@digital-b2c/coreui-kit 0.9.0 → 0.10.1

package/dist/index.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-var clsx23 = require('clsx');
+var clsx25 = require('clsx');
 var jsxRuntime = require('react/jsx-runtime');
 var React62 = require('react');
 var gsap = require('gsap');
@@ -12,7 +12,7 @@ require('swiper/css');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var clsx23__default = /*#__PURE__*/_interopDefault(clsx23);
+var clsx25__default = /*#__PURE__*/_interopDefault(clsx25);
 var React62__default = /*#__PURE__*/_interopDefault(React62);
 var gsap__default = /*#__PURE__*/_interopDefault(gsap);
 
@@ -66,7 +66,7 @@ var Picture = (_a) => {
       __spreadValues({
         src: desktop.src,
         alt: desktop.alt,
-        className: clsx23__default.default(className, Picture_module_default["image-desktop"])
+        className: clsx25__default.default(className, Picture_module_default["image-desktop"])
       }, rest)
     ),
     /* @__PURE__ */ jsxRuntime.jsx(
@@ -74,7 +74,7 @@ var Picture = (_a) => {
       __spreadValues({
         src: (_b2 = mobile == null ? void 0 : mobile.src) != null ? _b2 : desktop.src,
         alt: (_c = mobile == null ? void 0 : mobile.alt) != null ? _c : desktop.alt,
-        className: clsx23__default.default(className, Picture_module_default["image-mobile"])
+        className: clsx25__default.default(className, Picture_module_default["image-mobile"])
       }, rest)
     )
   ] });
@@ -433,7 +433,7 @@ var Button = (_a) => {
   ]);
   const isLink = !!href;
   const props = __spreadValues(__spreadValues({
-    className: clsx23__default.default(
+    className: clsx25__default.default(
       Button_module_default.button,
       variant ? Button_module_default[variant] : null,
       { [Button_module_default.fullWidth]: !!fullWidth },
@@ -665,7 +665,7 @@ var BrandsStrip = ({
     "div",
     {
       ref: containerRef,
-      className: clsx23__default.default(
+      className: clsx25__default.default(
         BrandsStrip_module_default.brandsStrip,
         BrandsStrip_module_default[variant],
         { [BrandsStrip_module_default.small]: size === "small" },
@@ -674,13 +674,13 @@ var BrandsStrip = ({
       onMouseEnter: handleMouseEnter,
       onMouseLeave: handleMouseLeave,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx23__default.default(BrandsStrip_module_default.container, { [BrandsStrip_module_default.blurred]: show && logos.length > 1 }), children: [
-          title && logos.length === 1 && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: clsx23__default.default("body", BrandsStrip_module_default.title), children: title }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx25__default.default(BrandsStrip_module_default.container, { [BrandsStrip_module_default.blurred]: show && logos.length > 1 }), children: [
+          title && logos.length === 1 && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: clsx25__default.default("body", BrandsStrip_module_default.title), children: title }),
           logos.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
             "div",
             {
               ref: marqueeRef,
-              className: clsx23__default.default(BrandsStrip_module_default.logos, { [BrandsStrip_module_default.marqueeGSAP]: shouldAnimate }),
+              className: clsx25__default.default(BrandsStrip_module_default.logos, { [BrandsStrip_module_default.marqueeGSAP]: shouldAnimate }),
               children: duplicatedLogos.map((logo, index) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: BrandsStrip_module_default.logoWrapper, children: /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: BrandsStrip_module_default.logo }, logo)) }, `${logo.alt}-${index}`))
             }
           )
@@ -727,7 +727,7 @@ var Container_module_default = {
 var Container = React62.forwardRef(
   (_a, ref) => {
     var _b = _a, { children, className } = _b, props = __objRest(_b, ["children", "className"]);
-    return /* @__PURE__ */ jsxRuntime.jsx("div", __spreadProps(__spreadValues({ ref, className: clsx23__default.default(Container_module_default.container, className) }, props), { children }));
+    return /* @__PURE__ */ jsxRuntime.jsx("div", __spreadProps(__spreadValues({ ref, className: clsx25__default.default(Container_module_default.container, className) }, props), { children }));
   }
 );
 Container.displayName = "Container";
@@ -768,14 +768,14 @@ var Card = ({
     ConditionalWrapper,
     __spreadProps(__spreadValues({
       ref,
-      className: clsx23__default.default(Card_module_default.card, Card_module_default[variant], className),
+      className: clsx25__default.default(Card_module_default.card, Card_module_default[variant], className),
       wrapper: Anchor,
       fallback: "div",
       condition: isLink
     }, href ? { href, isExternal } : {}), {
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Card_module_default.logoContainer, children: [
-          (logo == null ? void 0 : logo.src) ? /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: clsx23__default.default(Card_module_default.logo, isLink && Card_module_default.hideLogo) }, logo)) : icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: icon, className: clsx23__default.default(Card_module_default.logo, isLink && Card_module_default.hideLogo) }),
+          (logo == null ? void 0 : logo.src) ? /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: clsx25__default.default(Card_module_default.logo, isLink && Card_module_default.hideLogo) }, logo)) : icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: icon, className: clsx25__default.default(Card_module_default.logo, isLink && Card_module_default.hideLogo) }),
           isLink && /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "tiltedRightWhite", className: Card_module_default.logoHover })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Card_module_default.content, children: [
@@ -810,10 +810,10 @@ var CountingCard = ({ className, title, count, image, children }) => {
     title: CountingCardTitle
   });
   const titleNode = (_a = slots.title) != null ? _a : title;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx23__default.default(CountingCard_module_default["counting-card"], className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx25__default.default(CountingCard_module_default["counting-card"], className), children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: CountingCard_module_default.content, children: [
       titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "body", children: titleNode }),
-      count && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(CountingCard_module_default.count, "h1"), children: count })
+      count && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(CountingCard_module_default.count, "h1"), children: count })
     ] }),
     image && /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: CountingCard_module_default.logo }, image))
   ] });
@@ -823,6 +823,280 @@ var CountingCard = ({ className, title, count, image, children }) => {
 var CountingCard2 = Object.assign(CountingCard, {
   Title: CountingCardTitle
 });
+
+// src/components/FilterBar/FilterBar.module.scss
+var FilterBar_module_default = {
+  filterBar: "FilterBar_module_filterBar",
+  viewToggle: "FilterBar_module_viewToggle",
+  filterActions: "FilterBar_module_filterActions",
+  chip: "FilterBar_module_chip",
+  active: "FilterBar_module_active",
+  chipLabel: "FilterBar_module_chipLabel",
+  dropdownWrapper: "FilterBar_module_dropdownWrapper",
+  searchExpanded: "FilterBar_module_searchExpanded",
+  searchCollapsing: "FilterBar_module_searchCollapsing",
+  searchIconInner: "FilterBar_module_searchIconInner",
+  searchInput: "FilterBar_module_searchInput",
+  searchClear: "FilterBar_module_searchClear",
+  dropdownPanel: "FilterBar_module_dropdownPanel",
+  searchPanel: "FilterBar_module_searchPanel",
+  dropdownOption: "FilterBar_module_dropdownOption",
+  selected: "FilterBar_module_selected"
+};
+var FILTER_OPTIONS = [
+  { value: "link", label: "Link", icon: "externalLink" },
+  { value: "pdf", label: "PDF", icon: "pdf" }
+];
+var SORT_OPTIONS = [
+  { value: "latest", label: "Latest" },
+  { value: "oldest", label: "Oldest" },
+  { value: "az", label: "A \u2192 Z" },
+  { value: "za", label: "Z \u2192 A" }
+];
+function FilterBar({
+  view,
+  onViewChange,
+  isMobile,
+  filterValue,
+  onFilterChange,
+  sortValue,
+  onSortChange,
+  searchValue,
+  onSearchChange
+}) {
+  const [openDropdown, setOpenDropdown] = React62.useState(null);
+  const [searchState, setSearchState] = React62.useState("closed");
+  const filterRef = React62.useRef(null);
+  const sortRef = React62.useRef(null);
+  const searchRef = React62.useRef(null);
+  const searchInputRef = React62.useRef(null);
+  const closeSearch = () => {
+    setSearchState("closing");
+    onSearchChange("");
+  };
+  const clearSearch = () => {
+    var _a;
+    onSearchChange("");
+    (_a = searchInputRef.current) == null ? void 0 : _a.focus();
+  };
+  React62.useEffect(() => {
+    const handleMouseDown = (e) => {
+      var _a, _b, _c;
+      const target = e.target;
+      if (((_a = filterRef.current) == null ? void 0 : _a.contains(target)) || ((_b = sortRef.current) == null ? void 0 : _b.contains(target)) || ((_c = searchRef.current) == null ? void 0 : _c.contains(target)))
+        return;
+      setOpenDropdown(null);
+    };
+    document.addEventListener("mousedown", handleMouseDown);
+    return () => document.removeEventListener("mousedown", handleMouseDown);
+  }, []);
+  React62.useEffect(() => {
+    var _a;
+    if (searchState === "open") (_a = searchInputRef.current) == null ? void 0 : _a.focus();
+  }, [searchState]);
+  React62.useEffect(() => {
+    var _a;
+    if (openDropdown === "search") (_a = searchInputRef.current) == null ? void 0 : _a.focus();
+  }, [openDropdown]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FilterBar_module_default.filterBar, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FilterBar_module_default.viewToggle, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          className: clsx25__default.default(FilterBar_module_default.chip, view === "grid" && FilterBar_module_default.active),
+          onClick: () => onViewChange("grid"),
+          "aria-pressed": view === "grid",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "grid", size: 20, "aria-hidden": "true" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: FilterBar_module_default.chipLabel, children: "Grid" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          className: clsx25__default.default(FilterBar_module_default.chip, view === "list" && FilterBar_module_default.active),
+          onClick: () => onViewChange("list"),
+          "aria-pressed": view === "list",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "list", size: 20, "aria-hidden": "true" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: FilterBar_module_default.chipLabel, children: "List" })
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FilterBar_module_default.filterActions, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FilterBar_module_default.dropdownWrapper, ref: filterRef, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            type: "button",
+            className: clsx25__default.default(FilterBar_module_default.chip, filterValue !== "all" && FilterBar_module_default.active),
+            onClick: () => setOpenDropdown(openDropdown === "filter" ? null : "filter"),
+            "aria-expanded": openDropdown === "filter",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "filter", size: 20, "aria-hidden": "true" }),
+              !isMobile && /* @__PURE__ */ jsxRuntime.jsx("span", { className: FilterBar_module_default.chipLabel, children: "Filter" })
+            ]
+          }
+        ),
+        openDropdown === "filter" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: FilterBar_module_default.dropdownPanel, role: "listbox", "aria-label": "Filter by type", children: FILTER_OPTIONS.map((opt) => /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            type: "button",
+            role: "option",
+            "aria-selected": filterValue === opt.value,
+            className: clsx25__default.default(
+              FilterBar_module_default.dropdownOption,
+              filterValue === opt.value && FilterBar_module_default.selected
+            ),
+            onClick: () => {
+              onFilterChange(filterValue === opt.value ? "all" : opt.value);
+              setOpenDropdown(null);
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: opt.icon, size: 20, "aria-hidden": "true" }),
+              opt.label
+            ]
+          },
+          opt.value
+        )) })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FilterBar_module_default.dropdownWrapper, ref: sortRef, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            type: "button",
+            className: FilterBar_module_default.chip,
+            onClick: () => setOpenDropdown(openDropdown === "sort" ? null : "sort"),
+            "aria-expanded": openDropdown === "sort",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "internalFilter", size: 20, "aria-hidden": "true" }),
+              !isMobile && /* @__PURE__ */ jsxRuntime.jsx("span", { className: FilterBar_module_default.chipLabel, children: "Sort" })
+            ]
+          }
+        ),
+        openDropdown === "sort" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: FilterBar_module_default.dropdownPanel, role: "listbox", "aria-label": "Sort by", children: SORT_OPTIONS.map((opt) => /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            role: "option",
+            "aria-selected": sortValue === opt.value,
+            className: clsx25__default.default(
+              FilterBar_module_default.dropdownOption,
+              sortValue === opt.value && FilterBar_module_default.selected
+            ),
+            onClick: () => {
+              onSortChange(opt.value);
+              setOpenDropdown(null);
+            },
+            children: opt.label
+          },
+          opt.value
+        )) })
+      ] }),
+      isMobile ? (
+        /* Mobile — popup panel, mirroring the Filter/Sort dropdowns */
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FilterBar_module_default.dropdownWrapper, ref: searchRef, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              className: clsx25__default.default(FilterBar_module_default.chip, searchValue !== "" && FilterBar_module_default.active),
+              onClick: () => setOpenDropdown(openDropdown === "search" ? null : "search"),
+              "aria-expanded": openDropdown === "search",
+              "aria-label": "Search",
+              children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "search", size: 20, "aria-hidden": "true" })
+            }
+          ),
+          openDropdown === "search" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: FilterBar_module_default.searchPanel, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: FilterBar_module_default.searchIconInner, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "search", size: 20, "aria-hidden": "true" }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "input",
+              {
+                ref: searchInputRef,
+                type: "text",
+                className: FilterBar_module_default.searchInput,
+                placeholder: "Search\u2026",
+                value: searchValue,
+                onChange: (e) => onSearchChange(e.target.value),
+                onKeyDown: (e) => {
+                  if (e.key === "Escape") {
+                    if (searchValue) clearSearch();
+                    else setOpenDropdown(null);
+                  }
+                }
+              }
+            ),
+            searchValue && /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                type: "button",
+                className: FilterBar_module_default.searchClear,
+                "aria-label": "Clear search",
+                onClick: clearSearch,
+                children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "xBlack", size: 16, "aria-hidden": "true" })
+              }
+            )
+          ] })
+        ] })
+      ) : searchState !== "closed" ? (
+        /* Desktop — animated inline expand */
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: clsx25__default.default(
+              FilterBar_module_default.searchExpanded,
+              searchState === "closing" && FilterBar_module_default.searchCollapsing
+            ),
+            onAnimationEnd: () => {
+              if (searchState === "closing") setSearchState("closed");
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: FilterBar_module_default.searchIconInner, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "search", size: 20, "aria-hidden": "true" }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "input",
+                {
+                  ref: searchInputRef,
+                  type: "text",
+                  className: FilterBar_module_default.searchInput,
+                  placeholder: "Search\u2026",
+                  value: searchValue,
+                  onChange: (e) => onSearchChange(e.target.value),
+                  onKeyDown: (e) => {
+                    if (e.key === "Escape") {
+                      if (searchValue) clearSearch();
+                      else closeSearch();
+                    }
+                  },
+                  onBlur: () => {
+                    if (!searchValue) closeSearch();
+                  }
+                }
+              ),
+              searchValue && /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  className: FilterBar_module_default.searchClear,
+                  "aria-label": "Clear search",
+                  onMouseDown: (e) => e.preventDefault(),
+                  onClick: clearSearch,
+                  children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "xBlack", size: 16, "aria-hidden": "true" })
+                }
+              )
+            ]
+          }
+        )
+      ) : /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", className: FilterBar_module_default.chip, onClick: () => setSearchState("open"), children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "search", size: 20, "aria-hidden": "true" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: FilterBar_module_default.chipLabel, children: "Search" })
+      ] })
+    ] })
+  ] });
+}
 var InfoCardTitle = ({ children }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 };
@@ -845,9 +1119,9 @@ var InfoCard = ({ className, title, subtitle, icon, badge, children }) => {
   });
   const titleNode = (_a = slots.title) != null ? _a : title;
   const subtitleNode = (_b = slots.subtitle) != null ? _b : subtitle;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx23__default.default(InfoCard_module_default["info-card"], { [InfoCard_module_default.hasIcon]: !!icon }, className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx25__default.default(InfoCard_module_default["info-card"], { [InfoCard_module_default.hasIcon]: !!icon }, className), children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: InfoCard_module_default.header, children: [
-      icon ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: icon }) : badge ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(InfoCard_module_default.badge, "h4"), children: badge }) : null,
+      icon ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: icon }) : badge ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(InfoCard_module_default.badge, "h4"), children: badge }) : null,
       titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h4", children: titleNode })
     ] }),
     subtitleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "body", children: subtitleNode })
@@ -909,7 +1183,7 @@ var Pagination = ({
     setActivePage(page);
     onPageChange == null ? void 0 : onPageChange(page);
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx23__default.default(Pagination_module_default.pagination, className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx25__default.default(Pagination_module_default.pagination, className), children: [
     !disableArrows && /* @__PURE__ */ jsxRuntime.jsx(
       "button",
       {
@@ -926,7 +1200,7 @@ var Pagination = ({
         "button",
         {
           onClick: () => goToPage(page),
-          className: clsx23__default.default(Pagination_module_default.page, {
+          className: clsx25__default.default(Pagination_module_default.page, {
             [Pagination_module_default.active]: activePage === page,
             [Pagination_module_default.number]: hasNumber
           }),
@@ -962,7 +1236,7 @@ var PracticeCard_module_default = {
 };
 var PracticeCard = ({ className, title, cta, image }) => {
   const { url: href, isExternal } = cta != null ? cta : {};
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(PracticeCard_module_default["practice-card"], className), children: /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(PracticeCard_module_default["practice-card"], className), children: /* @__PURE__ */ jsxRuntime.jsxs(
     ConditionalWrapper,
     __spreadProps(__spreadValues({
       className: PracticeCard_module_default.wrapper,
@@ -973,7 +1247,7 @@ var PracticeCard = ({ className, title, cta, image }) => {
       children: [
         image && /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: PracticeCard_module_default.background }, image)),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PracticeCard_module_default.container, children: [
-          title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(PracticeCard_module_default.title, "h3"), children: title }),
+          title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(PracticeCard_module_default.title, "h3"), children: title }),
           href && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PracticeCard_module_default.cta, children: [
             /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: PracticeCard_module_default.ctaRest, type: "right" }),
             /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: PracticeCard_module_default.ctaHover, type: "tiltedRight" })
@@ -984,6 +1258,106 @@ var PracticeCard = ({ className, title, cta, image }) => {
   ) });
 };
 
+// src/components/ResourceCardItem/ResourceCardItem.module.scss
+var ResourceCardItem_module_default = {
+  cardLink: "ResourceCardItem_module_cardLink",
+  cardGrid: "ResourceCardItem_module_cardGrid",
+  cardBody: "ResourceCardItem_module_cardBody",
+  cardIconTitle: "ResourceCardItem_module_cardIconTitle",
+  cardTitle: "ResourceCardItem_module_cardTitle",
+  cardMeta: "ResourceCardItem_module_cardMeta",
+  cardDate: "ResourceCardItem_module_cardDate",
+  cardList: "ResourceCardItem_module_cardList",
+  cardListLeft: "ResourceCardItem_module_cardListLeft",
+  cardListRight: "ResourceCardItem_module_cardListRight",
+  notificationDot: "ResourceCardItem_module_notificationDot",
+  iconWrapper: "ResourceCardItem_module_iconWrapper"
+};
+var ResourceIcon = ({ image, type }) => {
+  if (!image) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: ResourceCardItem_module_default.iconWrapper, children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: image, alt: type != null ? type : "", width: 32, height: 32 }) });
+};
+var ResourceCardItem = ({ item, view }) => {
+  const hasHref = Boolean(item.href);
+  const linkWrapper = ({ children }) => /* @__PURE__ */ jsxRuntime.jsx("a", { href: item.href, className: ResourceCardItem_module_default.cardLink, target: "_blank", rel: "noopener noreferrer", children });
+  if (view === "grid") {
+    return /* @__PURE__ */ jsxRuntime.jsx("article", { className: ResourceCardItem_module_default.cardGrid, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourceCardItem_module_default.cardBody, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ConditionalWrapper, { condition: hasHref, wrapper: linkWrapper, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourceCardItem_module_default.cardIconTitle, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ResourceIcon, { image: item.image, type: item.type }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourceCardItem_module_default.cardTitle, children: item.title })
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourceCardItem_module_default.cardMeta, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourceCardItem_module_default.cardDate, children: item.date }),
+        item.hasNotification && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourceCardItem_module_default.notificationDot, "aria-label": "New" })
+      ] })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("article", { className: ResourceCardItem_module_default.cardList, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourceCardItem_module_default.cardListLeft, children: [
+      item.hasNotification && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourceCardItem_module_default.notificationDot, "aria-label": "New" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourceCardItem_module_default.cardDate, children: item.date })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(ConditionalWrapper, { condition: hasHref, wrapper: linkWrapper, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourceCardItem_module_default.cardListRight, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ResourceIcon, { image: item.image, type: item.type }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourceCardItem_module_default.cardTitle, children: item.title })
+    ] }) })
+  ] });
+};
+
+// src/components/Sidebar/Sidebar.module.scss
+var Sidebar_module_default = {
+  sidebar: "Sidebar_module_sidebar",
+  sidebarItem: "Sidebar_module_sidebarItem",
+  active: "Sidebar_module_active",
+  sidebarMobile: "Sidebar_module_sidebarMobile",
+  hamburger: "Sidebar_module_hamburger",
+  notificationDot: "Sidebar_module_notificationDot"
+};
+var Sidebar = ({
+  categories,
+  isMobile,
+  onToggle,
+  selectedIndex,
+  onSelect
+}) => {
+  if (isMobile) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: Sidebar_module_default.sidebarMobile, children: /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        className: Sidebar_module_default.hamburger,
+        "aria-label": "Open categories",
+        onClick: onToggle,
+        children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "menuBlack", size: 20, "aria-hidden": "true" })
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("nav", { className: Sidebar_module_default.sidebar, "aria-label": "Resource categories", children: /* @__PURE__ */ jsxRuntime.jsx("ul", { children: categories.map((cat, i) => {
+    var _a;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "li",
+      {
+        className: clsx25__default.default(Sidebar_module_default.sidebarItem, i === selectedIndex && Sidebar_module_default.active),
+        role: "button",
+        tabIndex: 0,
+        "aria-pressed": i === selectedIndex,
+        onClick: () => onSelect(i),
+        onKeyDown: (e) => {
+          if (e.key === "Enter" || e.key === " ") {
+            e.preventDefault();
+            onSelect(i);
+          }
+        },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: cat.label }),
+          cat.hasNotification && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Sidebar_module_default.notificationDot, "aria-label": "New" })
+        ]
+      },
+      (_a = cat.label) != null ? _a : i
+    );
+  }) }) });
+};
+
 // src/components/LogoBar/LogoBar.module.scss
 var LogoBar_module_default = {
   logoBar: "LogoBar_module_logoBar",
@@ -993,7 +1367,7 @@ var LogoBar_module_default = {
 };
 var LogoBar = ({ className, items }) => {
   if (!items || items.length === 0) return null;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(LogoBar_module_default.logoBar, className), children: items.map((item, key) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(LogoBar_module_default.logoBar, className), children: items.map((item, key) => {
     return /* @__PURE__ */ jsxRuntime.jsx(Anchor, { href: item.url, isExternal: item.isExternal, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: LogoBar_module_default.logoWrapper, children: [
       item.logo && /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: LogoBar_module_default.logo }, item.logo)),
       item.hoverLogo && /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: LogoBar_module_default.logoHover }, item.hoverLogo))
@@ -1079,13 +1453,13 @@ var CardCollection = ({
     Container,
     {
       ref: container,
-      className: clsx23__default.default(CardCollection_module_default["card-collection"], CardCollection_module_default[variant], className),
+      className: clsx25__default.default(CardCollection_module_default["card-collection"], CardCollection_module_default[variant], className),
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: CardCollection_module_default.content, children: [
           titleNode && /* @__PURE__ */ jsxRuntime.jsx("h2", { children: titleNode }),
           subtitleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "subheading", children: subtitleNode })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: CardCollection_module_default.wrapper, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx23__default.default(CardCollection_module_default.cardWrapper, { [CardCollection_module_default["is-expanded"]]: isExpanded }), children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: CardCollection_module_default.wrapper, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx25__default.default(CardCollection_module_default.cardWrapper, { [CardCollection_module_default["is-expanded"]]: isExpanded }), children: [
           visibleCards.map((card, key) => /* @__PURE__ */ jsxRuntime.jsx(Card2, __spreadValues({ className: CardCollection_module_default.card, variant: theme }, card), key)),
           isExamCard && hiddenCards.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { ref: revealWrapper, className: CardCollection_module_default["reveal-wrapper"], children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: CardCollection_module_default["reveal-inner"], children: hiddenCards.map((card, key) => /* @__PURE__ */ jsxRuntime.jsx(
             Card2,
@@ -1186,7 +1560,7 @@ var ContactModule = ({
     },
     { scope: containerRef, dependencies: [blurred, animateBlur] }
   );
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: clsx23__default.default(ContactModule_module_default["contact-module"], className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: containerRef, className: clsx25__default.default(ContactModule_module_default["contact-module"], className), children: [
     blurred && /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
@@ -1201,8 +1575,8 @@ var ContactModule = ({
     /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: ContactModule_module_default.container, children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ContactModule_module_default.wrapper, children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ContactModule_module_default.content, children: [
-          titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(ContactModule_module_default.title, "h1"), children: titleNode }),
-          subtitleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(ContactModule_module_default.subtitle, "subheading"), children: subtitleNode })
+          titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(ContactModule_module_default.title, "h1"), children: titleNode }),
+          subtitleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(ContactModule_module_default.subtitle, "subheading"), children: subtitleNode })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: ContactModule_module_default["cta-wrapper"], children: ctas == null ? void 0 : ctas.map((cta, key) => /* @__PURE__ */ jsxRuntime.jsx(
           Button,
@@ -1263,7 +1637,7 @@ var Footer = ({
     disclaimer: FooterDisclaimer
   });
   const titleNode = (_a = slots.disclaimer) != null ? _a : disclaimer;
-  return /* @__PURE__ */ jsxRuntime.jsx("footer", { className: clsx23__default.default(Footer_module_default.footer, className), children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: Footer_module_default.container, children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("footer", { className: clsx25__default.default(Footer_module_default.footer, className), children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: Footer_module_default.container, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Footer_module_default.bottom, children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Footer_module_default["bottom-left"], children: [
         supporters.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: Footer_module_default.supporters, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: Footer_module_default["supporters-logos"], children: supporters.map(
@@ -1279,7 +1653,7 @@ var Footer = ({
             index
           ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: Footer_module_default["supporter-link-primary"], children: /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({}, supporter.image)) }, index)
         ) }) }),
-        titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(Footer_module_default.disclaimer, "p"), children: titleNode }),
+        titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(Footer_module_default.disclaimer, "p"), children: titleNode }),
         copyright && /* @__PURE__ */ jsxRuntime.jsx("p", { className: Footer_module_default.copyright, children: copyright })
       ] }),
       columns.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("nav", { className: Footer_module_default["bottom-right"], children: columns.map((column, colIndex) => /* @__PURE__ */ jsxRuntime.jsx("ul", { className: Footer_module_default["nav-list"], children: column.map((link) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -1345,7 +1719,7 @@ var HeroBanner = ({
   var _a, _b;
   const { is } = useViewPort_default();
   const isTabletBelow = is("tablet", "below");
-  const vPageHeroBanner = variant === "pageHeroBanner";
+  const vMainHeroBanner = variant === "mainHeroBanner";
   const vBannerPodcast = variant === "bannerPodcast";
   const isTitleLogo = (logo == null ? void 0 : logo.variant) === "titleLogo";
   const GRADIENT_BANDS = [
@@ -1360,7 +1734,7 @@ var HeroBanner = ({
   });
   const titleNode = (_a = slots.title) != null ? _a : title;
   const subtitleNode = (_b = slots.subtitle) != null ? _b : subtitle;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx23__default.default(HeroBanner_module_default.heroBanner, HeroBanner_module_default[variant], className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx25__default.default(HeroBanner_module_default.heroBanner, HeroBanner_module_default[variant], className), children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: HeroBanner_module_default.container, children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: HeroBanner_module_default.banner, children: [
         (titleNode || subtitleNode) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: HeroBanner_module_default.text, children: [
@@ -1370,7 +1744,7 @@ var HeroBanner = ({
             {
               tag: "h2",
               promoteToH1,
-              className: clsx23__default.default(HeroBanner_module_default.title, vBannerPodcast ? "h3" : "h1"),
+              className: clsx25__default.default(HeroBanner_module_default.title, vBannerPodcast ? "h3" : "h1"),
               children: titleNode
             }
           ),
@@ -1379,7 +1753,7 @@ var HeroBanner = ({
             {
               tag: "div",
               promoteToH1: promoteToH1 && !titleNode,
-              className: clsx23__default.default(HeroBanner_module_default.subtitle, "subheading"),
+              className: clsx25__default.default(HeroBanner_module_default.subtitle, "subheading"),
               children: subtitleNode
             }
           )
@@ -1390,7 +1764,7 @@ var HeroBanner = ({
             {
               href: cta2.url,
               isExternal: cta2.isExternal,
-              variant: key % 2 ? vPageHeroBanner && !isTabletBelow ? "nofill" : "grey" : "primary",
+              variant: key % 2 ? vMainHeroBanner && !isTabletBelow ? "grey" : "nofill" : "primary",
               fullWidth: isTabletBelow,
               logo: cta2.logo,
               children: cta2.label
@@ -1406,7 +1780,7 @@ var HeroBanner = ({
         __spreadValues({
           className: HeroBanner_module_default.brandsStrip,
           variant: "light",
-          size: isTabletBelow || vPageHeroBanner ? "small" : void 0
+          size: isTabletBelow || vMainHeroBanner ? void 0 : "small"
         }, brands)
       ),
       backgroundImage && !vBannerPodcast && /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: HeroBanner_module_default.backgroundImage }, backgroundImage))
@@ -1456,7 +1830,7 @@ var HeroBannerCarousel = ({
   const [swiperInstance, setSwiperInstance] = React62.useState(null);
   const [activeIndex, setActiveIndex] = React62.useState(0);
   if (!items.length) return null;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(HeroBannerCarousel_module_default.heroBannerCarousel, className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: HeroBannerCarousel_module_default.inner, children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(HeroBannerCarousel_module_default.heroBannerCarousel, className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: HeroBannerCarousel_module_default.inner, children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: HeroBannerCarousel_module_default.swiperContainer, children: /* @__PURE__ */ jsxRuntime.jsx(
       react$1.Swiper,
       {
@@ -1503,7 +1877,7 @@ var HeroBannerCarousel = ({
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: HeroBannerCarousel_module_default.pagination, children: items.map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
-          className: clsx23__default.default(HeroBannerCarousel_module_default.dot, index === activeIndex && HeroBannerCarousel_module_default.dotActive),
+          className: clsx25__default.default(HeroBannerCarousel_module_default.dot, index === activeIndex && HeroBannerCarousel_module_default.dotActive),
           onClick: () => swiperInstance == null ? void 0 : swiperInstance.slideTo(index),
           "aria-label": `Go to slide ${index + 1}`
         },
@@ -1583,7 +1957,7 @@ var AccordionItem = ({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: clsx23__default.default(
+      className: clsx25__default.default(
         Accordion_module_default.accordionItem,
         {
           [Accordion_module_default.accordionItemOpen]: isOpen
@@ -1594,18 +1968,18 @@ var AccordionItem = ({
         /* @__PURE__ */ jsxRuntime.jsxs(
           "button",
           {
-            className: clsx23__default.default(Accordion_module_default.accordionHeader, {
+            className: clsx25__default.default(Accordion_module_default.accordionHeader, {
               [Accordion_module_default.accordionHeaderOpen]: isOpen
             }),
             onClick: handleToggle,
             "aria-expanded": isOpen,
             "aria-label": `Toggle ${title}`,
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: Accordion_module_default.accordionHeaderLeft, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: clsx23__default.default("body", Accordion_module_default.accordionTitle), children: title }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: Accordion_module_default.accordionHeaderLeft, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: clsx25__default.default("body", Accordion_module_default.accordionTitle), children: title }) }),
               /* @__PURE__ */ jsxRuntime.jsx(
                 "span",
                 {
-                  className: clsx23__default.default(Accordion_module_default.accordionChevron, {
+                  className: clsx25__default.default(Accordion_module_default.accordionChevron, {
                     [Accordion_module_default.accordionChevronOpen]: isOpen
                   }),
                   children: isOpen ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "filledChevronUpBlack", size: 40 }) : /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "circleChevronDown", size: 40 })
@@ -1657,7 +2031,7 @@ var Accordion = ({
   if (items.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(Accordion_module_default.accordion, className), children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(Accordion_module_default.accordion, className), children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
     AccordionItem,
     {
       id: item.id,
@@ -1747,7 +2121,7 @@ var InternalBrandsTab = (props) => {
       };
     })) || [];
   }, [tabs]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: clsx23__default.default(InternalBrandsTab_module_default.internalBrandsTab, className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: clsx25__default.default(InternalBrandsTab_module_default.internalBrandsTab, className), children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: InternalBrandsTab_module_default.textsContainer, children: [
       title && /* @__PURE__ */ jsxRuntime.jsx(Text, { tag: "h2", className: InternalBrandsTab_module_default.title, children: title }),
       subTitle && /* @__PURE__ */ jsxRuntime.jsx("div", { className: InternalBrandsTab_module_default.subTitle, children: subTitle })
@@ -1763,7 +2137,7 @@ var InternalBrandsTab = (props) => {
         },
         index
       )) }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(InternalBrandsTab_module_default.contentArea), children: ((_a = tabs == null ? void 0 : tabs[activeIndex]) == null ? void 0 : _a.topContent) && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(InternalBrandsTab_module_default.contentArea), children: ((_a = tabs == null ? void 0 : tabs[activeIndex]) == null ? void 0 : _a.topContent) && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: InternalBrandsTab_module_default.topContent, children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             ((_b = tabs[activeIndex].topContent) == null ? void 0 : _b.title) && /* @__PURE__ */ jsxRuntime.jsx("p", { className: InternalBrandsTab_module_default.topContentTitle, children: (_c = tabs[activeIndex].topContent) == null ? void 0 : _c.title }),
@@ -1854,17 +2228,17 @@ var MiniBanner = ({
   const pretitleNode = (_a = slots.pretitle) != null ? _a : pretitle;
   const titleNode = (_b = slots.title) != null ? _b : title;
   const subtitleNode = (_c = slots.subtitle) != null ? _c : subtitle;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx23__default.default(MiniBanner_module_default.minibanner, MiniBanner_module_default[variant], className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx25__default.default(MiniBanner_module_default.minibanner, MiniBanner_module_default[variant], className), children: [
     ((background == null ? void 0 : background.src) || ((_d = background == null ? void 0 : background.desktop) == null ? void 0 : _d.src) || ((_e = background == null ? void 0 : background.mobile) == null ? void 0 : _e.src)) && /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: MiniBanner_module_default.background }, background)),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: MiniBanner_module_default.wrapper, children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: MiniBanner_module_default.textContainer, children: [
         (logo == null ? void 0 : logo.src) && /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: MiniBanner_module_default.logo }, logo)),
-        pretitleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(MiniBanner_module_default.pretitle, "small"), children: pretitleNode }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: MiniBanner_module_default.headingWrapper, children: titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(MiniBanner_module_default.title, isMiniBannerTextLeft ? "h1" : "h4"), children: titleNode }) }),
+        pretitleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(MiniBanner_module_default.pretitle, "small"), children: pretitleNode }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: MiniBanner_module_default.headingWrapper, children: titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(MiniBanner_module_default.title, isMiniBannerTextLeft ? "h1" : "h4"), children: titleNode }) }),
         subtitleNode && /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: clsx23__default.default(MiniBanner_module_default.title, {
+            className: clsx25__default.default(MiniBanner_module_default.title, {
               subheading: isMiniBannerNoBG || isMiniBannerTextLeft,
               h1: !isMiniBannerNoBG && !isMiniBannerTextLeft
             }),
@@ -1935,14 +2309,14 @@ var MiniSectionCta = ({
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: clsx23__default.default(MiniSectionCta_module_default.miniSectionCta, MiniSectionCta_module_default[variant], theme && MiniSectionCta_module_default[theme], className),
+      className: clsx25__default.default(MiniSectionCta_module_default.miniSectionCta, MiniSectionCta_module_default[variant], theme && MiniSectionCta_module_default[theme], className),
       children: /* @__PURE__ */ jsxRuntime.jsx(Container, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: MiniSectionCta_module_default.wrapper, children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: MiniSectionCta_module_default.col, children: [
           titleNode && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: variant === "BgColorBlack" || variant === "BgColorGrey" ? "h3" : "h2", children: titleNode }),
           subtitleNode && /* @__PURE__ */ jsxRuntime.jsx(
             "div",
             {
-              className: clsx23__default.default(MiniSectionCta_module_default.subtitle, variant === "infoCallout" ? "h4" : "subheading"),
+              className: clsx25__default.default(MiniSectionCta_module_default.subtitle, variant === "infoCallout" ? "h4" : "subheading"),
               children: subtitleNode
             }
           )
@@ -2007,7 +2381,7 @@ var PracticePathCards = ({
   const titleNode = (_a = slots.title) != null ? _a : title;
   const subtitleNode = (_b = slots.subtitle) != null ? _b : subtitle;
   const footerNode = (_c = slots.footer) != null ? _c : footer;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(PracticePathCards_module_default["practice-path-cards"], className), children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: PracticePathCards_module_default.container, children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(PracticePathCards_module_default["practice-path-cards"], className), children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: PracticePathCards_module_default.container, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PracticePathCards_module_default.wrapper, children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: PracticePathCards_module_default.content, children: [
         titleNode && /* @__PURE__ */ jsxRuntime.jsx("h2", { children: titleNode }),
@@ -2061,8 +2435,8 @@ var Teaser5050With3Text = ({
     title: Teaser5050With3TextTitle
   });
   const titleNode = (_a = slots.title) != null ? _a : title;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(Teaser5050With3Text_module_default["teaser5050-3text"], Teaser5050With3Text_module_default[variant], className), children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: Teaser5050With3Text_module_default.container, children: [
-    titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(Teaser5050With3Text_module_default.title, "h3"), children: titleNode }),
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(Teaser5050With3Text_module_default["teaser5050-3text"], Teaser5050With3Text_module_default[variant], className), children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: Teaser5050With3Text_module_default.container, children: [
+    titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(Teaser5050With3Text_module_default.title, "h3"), children: titleNode }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Teaser5050With3Text_module_default.content, children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: Teaser5050With3Text_module_default.cards, children: cards == null ? void 0 : cards.map((card, key) => /* @__PURE__ */ jsxRuntime.jsx(InfoCard2, __spreadValues({}, card), key)) }),
       image && /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadValues({ className: Teaser5050With3Text_module_default.image }, image))
@@ -2112,12 +2486,12 @@ var Teaser5050WithCta = ({
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: clsx23__default.default(Teaser5050WithCta_module_default.teaser5050, Teaser5050WithCta_module_default[variant], className),
+      className: clsx25__default.default(Teaser5050WithCta_module_default.teaser5050, Teaser5050WithCta_module_default[variant], className),
       style: { backgroundColor: bgColor ? bgColor : "#ffffff" },
       children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: Teaser5050WithCta_module_default.container, children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Teaser5050WithCta_module_default.wrapper, children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Teaser5050WithCta_module_default.content, children: [
-            titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(Teaser5050WithCta_module_default.title, "h3"), children: titleNode }),
+            titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(Teaser5050WithCta_module_default.title, "h3"), children: titleNode }),
             subtitleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "subheading", children: subtitleNode })
           ] }),
           (ctas == null ? void 0 : ctas.length) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: Teaser5050WithCta_module_default.ctaWrapper, children: ctas.map((cta, key) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -2181,7 +2555,7 @@ var UpcomingEventCard = ({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "article",
     {
-      className: clsx23__default.default(
+      className: clsx25__default.default(
         "card",
         UpcomingEventCard_module_default["event-card"],
         UpcomingEventCard_module_default[direction],
@@ -2189,26 +2563,26 @@ var UpcomingEventCard = ({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx23__default.default("card-content", UpcomingEventCard_module_default["event-card-content"]), children: [
-          showImage && image && /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadProps(__spreadValues({}, image), { className: clsx23__default.default("card-image", UpcomingEventCard_module_default["event-card-image"]) })),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx25__default.default("card-content", UpcomingEventCard_module_default["event-card-content"]), children: [
+          showImage && image && /* @__PURE__ */ jsxRuntime.jsx(Picture, __spreadProps(__spreadValues({}, image), { className: clsx25__default.default("card-image", UpcomingEventCard_module_default["event-card-image"]) })),
           /* @__PURE__ */ jsxRuntime.jsxs(
             "div",
             {
-              className: clsx23__default.default(
+              className: clsx25__default.default(
                 "card-text-content",
                 UpcomingEventCard_module_default["event-card-text-content"],
                 (!showImage || !hasImage) && UpcomingEventCard_module_default["event-card-show-image"]
               ),
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { className: UpcomingEventCard_module_default.date, children: date }),
-                title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: clsx23__default.default("card-text-title"), children: title }),
+                title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: clsx25__default.default("card-text-title"), children: title }),
                 location && /* @__PURE__ */ jsxRuntime.jsx("span", { className: UpcomingEventCard_module_default.location, children: location }),
-                description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default("card-text-description", UpcomingEventCard_module_default.description), children: description }),
+                description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default("card-text-description", UpcomingEventCard_module_default.description), children: description }),
                 cta && cta.url && /* @__PURE__ */ jsxRuntime.jsx(
                   Button,
                   {
                     variant: "secondary",
-                    className: clsx23__default.default(
+                    className: clsx25__default.default(
                       "card-cta",
                       UpcomingEventCard_module_default["event-card-cta"],
                       !hasCTAandImage && UpcomingEventCard_module_default.hidden
@@ -2227,12 +2601,12 @@ var UpcomingEventCard = ({
         cta && cta.url && /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: clsx23__default.default("card-footer", UpcomingEventCard_module_default["event-card-footer"], hasImage && UpcomingEventCard_module_default.hidden),
+            className: clsx25__default.default("card-footer", UpcomingEventCard_module_default["event-card-footer"], hasImage && UpcomingEventCard_module_default.hidden),
             children: /* @__PURE__ */ jsxRuntime.jsx(
               Button,
               {
                 variant: "secondary",
-                className: clsx23__default.default("card-cta", UpcomingEventCard_module_default["event-card-cta"]),
+                className: clsx25__default.default("card-cta", UpcomingEventCard_module_default["event-card-cta"]),
                 fullWidth: isBelowMobile,
                 href: cta.url,
                 icon: cta.icon,
@@ -2269,7 +2643,7 @@ var Carousel = (_a) => {
       },
       role: "region",
       "aria-label": ariaLabel,
-      className: clsx23__default.default(Carousel_module_default.carousel, className),
+      className: clsx25__default.default(Carousel_module_default.carousel, className),
       spaceBetween: 0,
       slidesPerView: "auto",
       modules: [modules.FreeMode, modules.A11y],
@@ -2279,7 +2653,7 @@ var Carousel = (_a) => {
       children: slides.map((slide, index) => /* @__PURE__ */ jsxRuntime.jsx(
         react$1.SwiperSlide,
         {
-          className: clsx23__default.default(Carousel_module_default["carousel-item"], props.slideClass),
+          className: clsx25__default.default(Carousel_module_default["carousel-item"], props.slideClass),
           children: slide
         },
         index
@@ -2329,13 +2703,13 @@ var EventList = ({
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: clsx23__default.default("event-list-module", EventList_module_default["event-list-module"], className),
+      className: clsx25__default.default("event-list-module", EventList_module_default["event-list-module"], className),
       style: {
         backgroundColor
       },
-      children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: clsx23__default.default(EventList_module_default["event-list-container"]), children: [
+      children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: clsx25__default.default(EventList_module_default["event-list-container"]), children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: EventList_module_default["event-list-header-container"], children: [
-          titleNode && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: clsx23__default.default(EventList_module_default["event-list-title"]), children: titleNode }),
+          titleNode && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: clsx25__default.default(EventList_module_default["event-list-title"]), children: titleNode }),
           cta && cta.url && /* @__PURE__ */ jsxRuntime.jsx(
             Button,
             {
@@ -2352,7 +2726,7 @@ var EventList = ({
           Carousel,
           {
             "aria-label": "Upcoming events",
-            wrapperClass: clsx23__default.default(EventList_module_default["carousel-wrapper"], EventList_module_default[variant]),
+            wrapperClass: clsx25__default.default(EventList_module_default["carousel-wrapper"], EventList_module_default[variant]),
             slideClass: EventList_module_default["carousel-list-item"],
             spaceBetween: 16,
             slides: items.map((item) => {
@@ -2360,7 +2734,7 @@ var EventList = ({
               return /* @__PURE__ */ jsxRuntime.jsx(
                 UpcomingEventCard,
                 __spreadValues({
-                  className: clsx23__default.default(EventList_module_default["event-card"]),
+                  className: clsx25__default.default(EventList_module_default["event-card"]),
                   direction: "vertical",
                   showImage: false
                 }, item),
@@ -2373,17 +2747,17 @@ var EventList = ({
           "ul",
           {
             "aria-label": "Upcoming events",
-            className: clsx23__default.default(EventList_module_default["event-list-wrapper"], EventList_module_default["horizontal"], EventList_module_default[variant]),
+            className: clsx25__default.default(EventList_module_default["event-list-wrapper"], EventList_module_default["horizontal"], EventList_module_default[variant]),
             children: items == null ? void 0 : items.map((item, index) => {
               var _a2, _b, _c;
               return /* @__PURE__ */ jsxRuntime.jsx(
                 "li",
                 {
-                  className: clsx23__default.default(EventList_module_default["card-list-item"]),
+                  className: clsx25__default.default(EventList_module_default["card-list-item"]),
                   children: /* @__PURE__ */ jsxRuntime.jsx(
                     UpcomingEventCard,
                     __spreadProps(__spreadValues({}, item), {
-                      className: clsx23__default.default(EventList_module_default["card-item"]),
+                      className: clsx25__default.default(EventList_module_default["card-item"]),
                       showImage: false,
                       direction: "vertical"
                     })
@@ -2398,7 +2772,7 @@ var EventList = ({
           "ul",
           {
             "aria-label": "Upcoming events",
-            className: clsx23__default.default(EventList_module_default["event-list-wrapper"], EventList_module_default[listDirection]),
+            className: clsx25__default.default(EventList_module_default["event-list-wrapper"], EventList_module_default[listDirection]),
             children: items == null ? void 0 : items.map((item, index) => {
               var _a2, _b, _c;
               return /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(UpcomingEventCard, __spreadProps(__spreadValues({}, item), { direction: cardDirection })) }, (_c = (_b = (_a2 = item.title) != null ? _a2 : item.date) != null ? _b : item.location) != null ? _c : index);
@@ -2445,9 +2819,9 @@ var TextEvent = (props) => {
   });
   const titleNode = (_a = slots.title) != null ? _a : title;
   const richTextNode = (_b = slots.richText) != null ? _b : richText;
-  return /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: clsx23__default.default(TextEvent_module_default.textEvent, className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: clsx25__default.default(TextEvent_module_default.textEvent, className), children: [
     /* @__PURE__ */ jsxRuntime.jsx(Text, { tag: "h2", className: TextEvent_module_default.title, children: titleNode }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(TextEvent_module_default.richText, TextEvent_module_default[variant != null ? variant : ""]), children: richTextNode })
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(TextEvent_module_default.richText, TextEvent_module_default[variant != null ? variant : ""]), children: richTextNode })
   ] });
 };
 
@@ -2478,7 +2852,7 @@ var TextBody = (props) => {
   });
   const titleNode = (_a = slots.title) != null ? _a : title;
   const bodyNode = (_b = slots.body) != null ? _b : body;
-  return /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: clsx23__default.default(TextBody_module_default.textBody, className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: clsx25__default.default(TextBody_module_default.textBody, className), children: [
     titleNode && /* @__PURE__ */ jsxRuntime.jsx(Text, { tag: "h2", className: TextBody_module_default.title, children: titleNode }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: TextBody_module_default.body, children: bodyNode })
   ] });
@@ -2521,7 +2895,7 @@ var TextCenterCtaInBottom = ({
   });
   const titleNode = (_a = slots.title) != null ? _a : title;
   const subtitleNode = (_b = slots.subtitle) != null ? _b : subtitle;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(TextCenterCtaInBottom_module_default.textCenterCta, className), children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: TextCenterCtaInBottom_module_default.container, children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(TextCenterCtaInBottom_module_default.textCenterCta, className), children: /* @__PURE__ */ jsxRuntime.jsxs(Container, { className: TextCenterCtaInBottom_module_default.container, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: TextCenterCtaInBottom_module_default.content, children: [
       titleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: TextCenterCtaInBottom_module_default.title, children: titleNode }),
       subtitleNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: TextCenterCtaInBottom_module_default.subtitle, children: subtitleNode })
@@ -2529,7 +2903,7 @@ var TextCenterCtaInBottom = ({
     !!(ctas == null ? void 0 : ctas.length) && /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
-        className: clsx23__default.default(
+        className: clsx25__default.default(
           TextCenterCtaInBottom_module_default.ctaWrapper,
           ctas.every((cta) => !cta.label && cta.logo) && TextCenterCtaInBottom_module_default.iconOnly
         ),
@@ -2559,290 +2933,21 @@ var TextCenterCtaInBottom2 = Object.assign(TextCenterCtaInBottom, {
 // src/widgets/ResourcesGridList/ResourcesGridList.module.scss
 var ResourcesGridList_module_default = {
   widget: "ResourcesGridList_module_widget",
-  filterBar: "ResourcesGridList_module_filterBar",
-  viewToggle: "ResourcesGridList_module_viewToggle",
-  filterActions: "ResourcesGridList_module_filterActions",
-  chip: "ResourcesGridList_module_chip",
-  active: "ResourcesGridList_module_active",
-  chipLabel: "ResourcesGridList_module_chipLabel",
-  dropdownWrapper: "ResourcesGridList_module_dropdownWrapper",
-  searchExpanded: "ResourcesGridList_module_searchExpanded",
-  searchExpand: "ResourcesGridList_module_searchExpand",
-  searchCollapsing: "ResourcesGridList_module_searchCollapsing",
-  searchCollapse: "ResourcesGridList_module_searchCollapse",
-  searchIconInner: "ResourcesGridList_module_searchIconInner",
-  searchInput: "ResourcesGridList_module_searchInput",
-  dropdownPanel: "ResourcesGridList_module_dropdownPanel",
-  dropdownOption: "ResourcesGridList_module_dropdownOption",
-  selected: "ResourcesGridList_module_selected",
   content: "ResourcesGridList_module_content",
   mobileSidebarOverlay: "ResourcesGridList_module_mobileSidebarOverlay",
   mobileSidebarOverlayOpen: "ResourcesGridList_module_mobileSidebarOverlayOpen",
   mobileCategoriesPanel: "ResourcesGridList_module_mobileCategoriesPanel",
   mobileCategoriesList: "ResourcesGridList_module_mobileCategoriesList",
   mobileSidebarItem: "ResourcesGridList_module_mobileSidebarItem",
+  active: "ResourcesGridList_module_active",
   mobileSidebarCloseColumn: "ResourcesGridList_module_mobileSidebarCloseColumn",
-  sidebar: "ResourcesGridList_module_sidebar",
-  sidebarItem: "ResourcesGridList_module_sidebarItem",
-  sidebarMobile: "ResourcesGridList_module_sidebarMobile",
   hamburger: "ResourcesGridList_module_hamburger",
   cardsArea: "ResourcesGridList_module_cardsArea",
   grid: "ResourcesGridList_module_grid",
   list: "ResourcesGridList_module_list",
-  cardGrid: "ResourcesGridList_module_cardGrid",
-  cardBody: "ResourcesGridList_module_cardBody",
-  cardIconTitle: "ResourcesGridList_module_cardIconTitle",
-  cardTitle: "ResourcesGridList_module_cardTitle",
-  cardMeta: "ResourcesGridList_module_cardMeta",
-  cardDate: "ResourcesGridList_module_cardDate",
-  cardList: "ResourcesGridList_module_cardList",
-  cardListLeft: "ResourcesGridList_module_cardListLeft",
-  cardListRight: "ResourcesGridList_module_cardListRight",
-  notificationDot: "ResourcesGridList_module_notificationDot",
-  iconWrapper: "ResourcesGridList_module_iconWrapper",
-  pagination: "ResourcesGridList_module_pagination",
-  pageArrow: "ResourcesGridList_module_pageArrow",
-  pageDotActive: "ResourcesGridList_module_pageDotActive",
-  pageDot: "ResourcesGridList_module_pageDot"
+  notificationDot: "ResourcesGridList_module_notificationDot"
 };
-var FILTER_OPTIONS = [
-  { value: "link", label: "Link", icon: "externalLink" },
-  { value: "pdf", label: "PDF", icon: "pdf" }
-];
-var SORT_OPTIONS = [
-  { value: "latest", label: "Latest" },
-  { value: "oldest", label: "Oldest" },
-  { value: "az", label: "A \u2192 Z" },
-  { value: "za", label: "Z \u2192 A" }
-];
-function FilterBar({
-  view,
-  onViewChange,
-  isMobile,
-  filterValue,
-  onFilterChange,
-  sortValue,
-  onSortChange
-}) {
-  const [openDropdown, setOpenDropdown] = React62.useState(null);
-  const [searchState, setSearchState] = React62.useState("closed");
-  const [searchQuery, setSearchQuery] = React62.useState("");
-  const filterRef = React62.useRef(null);
-  const sortRef = React62.useRef(null);
-  const searchInputRef = React62.useRef(null);
-  const closeSearch = () => {
-    setSearchState("closing");
-    setSearchQuery("");
-  };
-  React62.useEffect(() => {
-    const handleMouseDown = (e) => {
-      var _a, _b;
-      const target = e.target;
-      if (((_a = filterRef.current) == null ? void 0 : _a.contains(target)) || ((_b = sortRef.current) == null ? void 0 : _b.contains(target))) return;
-      setOpenDropdown(null);
-    };
-    document.addEventListener("mousedown", handleMouseDown);
-    return () => document.removeEventListener("mousedown", handleMouseDown);
-  }, []);
-  React62.useEffect(() => {
-    var _a;
-    if (searchState === "open") (_a = searchInputRef.current) == null ? void 0 : _a.focus();
-  }, [searchState]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.filterBar, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.viewToggle, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        "button",
-        {
-          type: "button",
-          className: clsx23__default.default(ResourcesGridList_module_default.chip, view === "grid" && ResourcesGridList_module_default.active),
-          onClick: () => onViewChange("grid"),
-          "aria-pressed": view === "grid",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "grid", size: 20, "aria-hidden": "true" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.chipLabel, children: "Grid" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        "button",
-        {
-          type: "button",
-          className: clsx23__default.default(ResourcesGridList_module_default.chip, view === "list" && ResourcesGridList_module_default.active),
-          onClick: () => onViewChange("list"),
-          "aria-pressed": view === "list",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "list", size: 20, "aria-hidden": "true" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.chipLabel, children: "List" })
-          ]
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.filterActions, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.dropdownWrapper, ref: filterRef, children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          "button",
-          {
-            type: "button",
-            className: clsx23__default.default(ResourcesGridList_module_default.chip, filterValue !== "all" && ResourcesGridList_module_default.active),
-            onClick: () => setOpenDropdown(openDropdown === "filter" ? null : "filter"),
-            "aria-expanded": openDropdown === "filter",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "filter", size: 20, "aria-hidden": "true" }),
-              !isMobile && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.chipLabel, children: "Filter" })
-            ]
-          }
-        ),
-        openDropdown === "filter" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ResourcesGridList_module_default.dropdownPanel, role: "listbox", "aria-label": "Filter by type", children: FILTER_OPTIONS.map((opt) => /* @__PURE__ */ jsxRuntime.jsxs(
-          "button",
-          {
-            type: "button",
-            role: "option",
-            "aria-selected": filterValue === opt.value,
-            className: clsx23__default.default(
-              ResourcesGridList_module_default.dropdownOption,
-              filterValue === opt.value && ResourcesGridList_module_default.selected
-            ),
-            onClick: () => {
-              onFilterChange(filterValue === opt.value ? "all" : opt.value);
-              setOpenDropdown(null);
-            },
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: opt.icon, size: 20, "aria-hidden": "true" }),
-              opt.label
-            ]
-          },
-          opt.value
-        )) })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.dropdownWrapper, ref: sortRef, children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          "button",
-          {
-            type: "button",
-            className: ResourcesGridList_module_default.chip,
-            onClick: () => setOpenDropdown(openDropdown === "sort" ? null : "sort"),
-            "aria-expanded": openDropdown === "sort",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "internalFilter", size: 20, "aria-hidden": "true" }),
-              !isMobile && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.chipLabel, children: "Sort" })
-            ]
-          }
-        ),
-        openDropdown === "sort" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ResourcesGridList_module_default.dropdownPanel, role: "listbox", "aria-label": "Sort by", children: SORT_OPTIONS.map((opt) => /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            type: "button",
-            role: "option",
-            "aria-selected": sortValue === opt.value,
-            className: clsx23__default.default(
-              ResourcesGridList_module_default.dropdownOption,
-              sortValue === opt.value && ResourcesGridList_module_default.selected
-            ),
-            onClick: () => {
-              onSortChange(opt.value);
-              setOpenDropdown(null);
-            },
-            children: opt.label
-          },
-          opt.value
-        )) })
-      ] }),
-      searchState !== "closed" ? /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          className: clsx23__default.default(
-            ResourcesGridList_module_default.searchExpanded,
-            searchState === "closing" && ResourcesGridList_module_default.searchCollapsing
-          ),
-          onAnimationEnd: () => {
-            if (searchState === "closing") setSearchState("closed");
-          },
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.searchIconInner, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "search", size: 20, "aria-hidden": "true" }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "input",
-              {
-                ref: searchInputRef,
-                type: "text",
-                className: ResourcesGridList_module_default.searchInput,
-                placeholder: "Search\u2026",
-                value: searchQuery,
-                onChange: (e) => setSearchQuery(e.target.value),
-                onKeyDown: (e) => {
-                  if (e.key === "Escape") closeSearch();
-                },
-                onBlur: closeSearch
-              }
-            )
-          ]
-        }
-      ) : /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", className: ResourcesGridList_module_default.chip, onClick: () => setSearchState("open"), children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "search", size: 20, "aria-hidden": "true" }),
-        !isMobile && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.chipLabel, children: "Search" })
-      ] })
-    ] })
-  ] });
-}
-var Sidebar = ({ categories, isMobile, onToggle }) => {
-  if (isMobile) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: ResourcesGridList_module_default.sidebarMobile, children: /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        className: ResourcesGridList_module_default.hamburger,
-        "aria-label": "Open categories",
-        onClick: onToggle,
-        children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "menuBlack", size: 20, "aria-hidden": "true" })
-      }
-    ) });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx("nav", { className: ResourcesGridList_module_default.sidebar, "aria-label": "Resource categories", children: /* @__PURE__ */ jsxRuntime.jsx("ul", { children: categories.map((cat, i) => {
-    var _a;
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "li",
-      {
-        className: clsx23__default.default(ResourcesGridList_module_default.sidebarItem, cat.active && ResourcesGridList_module_default.active),
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { children: cat.label }),
-          cat.hasNotification && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.notificationDot, "aria-label": "New" })
-        ]
-      },
-      (_a = cat.label) != null ? _a : i
-    );
-  }) }) });
-};
-var ResourceIcon = ({ type }) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: ResourcesGridList_module_default.iconWrapper, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: type === "pdf" ? "pdf" : "externalLink", size: 32, "aria-hidden": "true" }) });
-var ResourceCardItem = ({ item, view }) => {
-  if (view === "grid") {
-    return /* @__PURE__ */ jsxRuntime.jsx("article", { className: ResourcesGridList_module_default.cardGrid, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.cardBody, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.cardIconTitle, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ResourceIcon, { type: item.type }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.cardTitle, children: item.title })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.cardMeta, children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.cardDate, children: item.date }),
-        item.hasNotification && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.notificationDot, "aria-label": "New" })
-      ] })
-    ] }) });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("article", { className: ResourcesGridList_module_default.cardList, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.cardListLeft, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.cardDate, children: item.date }),
-      item.hasNotification && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.notificationDot, "aria-label": "New" })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.cardListRight, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ResourceIcon, { type: item.type }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.cardTitle, children: item.title })
-    ] })
-  ] });
-};
-var Pagination3 = () => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.pagination, "aria-label": "Pagination", children: [
-  /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: ResourcesGridList_module_default.pageArrow, "aria-label": "Previous page", children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "chevronLeftBlack", size: 32, "aria-hidden": "true" }) }),
-  /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.pageDotActive, "aria-current": "page" }),
-  /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.pageDot }),
-  /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.pageDot }),
-  /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: ResourcesGridList_module_default.pageArrow, "aria-label": "Next page", children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { type: "chevronRightBlack", size: 32, "aria-hidden": "true" }) })
-] });
+var ITEMS_PER_PAGE = 12;
 var ResourcesGridList = ({
   className,
   items = [],
@@ -2851,20 +2956,52 @@ var ResourcesGridList = ({
   defaultFilter = "all",
   defaultSort = "latest"
 }) => {
+  var _a;
   const [view, setView] = React62.useState(defaultView);
   const [isSidebarOpen, setIsSidebarOpen] = React62.useState(false);
   const [filterValue, setFilterValue] = React62.useState(defaultFilter);
   const [sortValue, setSortValue] = React62.useState(defaultSort);
+  const [searchQuery, setSearchQuery] = React62.useState("");
+  const [currentPage, setCurrentPage] = React62.useState(1);
+  const [selectedCategory, setSelectedCategory] = React62.useState(() => {
+    const activeIndex = categories.findIndex((cat) => cat.active);
+    return activeIndex === -1 ? 0 : activeIndex;
+  });
   const { is } = useViewPort_default();
   const isMobile = is("tablet", "below");
-  const displayedItems = [...items].filter((item) => filterValue === "all" || item.type === filterValue).sort((a, b) => {
+  const selectedValue = (_a = categories[selectedCategory]) == null ? void 0 : _a.value;
+  const handleSelectCategory = (index) => {
+    setSelectedCategory(index);
+    setCurrentPage(1);
+    if (isMobile) setIsSidebarOpen(false);
+  };
+  const handleFilterChange = (value) => {
+    setFilterValue(value);
+    setCurrentPage(1);
+  };
+  const handleSortChange = (value) => {
+    setSortValue(value);
+    setCurrentPage(1);
+  };
+  const handleSearchChange = (value) => {
+    setSearchQuery(value);
+    setCurrentPage(1);
+  };
+  const displayedItems = [...items].filter((item) => filterValue === "all" || item.type === filterValue).filter((item) => selectedValue == null || item.category === selectedValue).filter((item) => {
+    const q = searchQuery.trim().toLowerCase();
+    return q === "" || item.title.toLowerCase().includes(q);
+  }).sort((a, b) => {
     if (sortValue === "latest") return new Date(b.date).getTime() - new Date(a.date).getTime();
     if (sortValue === "oldest") return new Date(a.date).getTime() - new Date(b.date).getTime();
     if (sortValue === "az") return a.title.localeCompare(b.title);
     if (sortValue === "za") return b.title.localeCompare(a.title);
     return 0;
   });
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx23__default.default(ResourcesGridList_module_default.widget, className), children: [
+  const totalPages = Math.max(1, Math.ceil(displayedItems.length / ITEMS_PER_PAGE));
+  const safeCurrentPage = Math.min(currentPage, totalPages);
+  const pageStart = (safeCurrentPage - 1) * ITEMS_PER_PAGE;
+  const paginatedItems = displayedItems.slice(pageStart, pageStart + ITEMS_PER_PAGE);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx25__default.default(ResourcesGridList_module_default.widget, className), children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       FilterBar,
       {
@@ -2872,33 +3009,48 @@ var ResourcesGridList = ({
         onViewChange: setView,
         isMobile,
         filterValue,
-        onFilterChange: setFilterValue,
+        onFilterChange: handleFilterChange,
         sortValue,
-        onSortChange: setSortValue
+        onSortChange: handleSortChange,
+        searchValue: searchQuery,
+        onSearchChange: handleSearchChange
       }
     ),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ResourcesGridList_module_default.content, children: [
       isMobile && /* @__PURE__ */ jsxRuntime.jsxs(
         "div",
         {
-          className: clsx23__default.default(
+          className: clsx25__default.default(
             ResourcesGridList_module_default.mobileSidebarOverlay,
             isSidebarOpen && ResourcesGridList_module_default.mobileSidebarOverlayOpen
           ),
           "aria-hidden": !isSidebarOpen,
           children: [
             /* @__PURE__ */ jsxRuntime.jsx("nav", { className: ResourcesGridList_module_default.mobileCategoriesPanel, "aria-label": "Resource categories", children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: ResourcesGridList_module_default.mobileCategoriesList, children: categories.map((cat, i) => {
-              var _a;
+              var _a2;
               return /* @__PURE__ */ jsxRuntime.jsxs(
                 "li",
                 {
-                  className: clsx23__default.default(ResourcesGridList_module_default.mobileSidebarItem, cat.active && ResourcesGridList_module_default.active),
+                  className: clsx25__default.default(
+                    ResourcesGridList_module_default.mobileSidebarItem,
+                    i === selectedCategory && ResourcesGridList_module_default.active
+                  ),
+                  role: "button",
+                  tabIndex: 0,
+                  "aria-pressed": i === selectedCategory,
+                  onClick: () => handleSelectCategory(i),
+                  onKeyDown: (e) => {
+                    if (e.key === "Enter" || e.key === " ") {
+                      e.preventDefault();
+                      handleSelectCategory(i);
+                    }
+                  },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsx("span", { children: cat.label }),
                     cat.hasNotification && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ResourcesGridList_module_default.notificationDot, "aria-label": "New" })
                   ]
                 },
-                (_a = cat.label) != null ? _a : i
+                (_a2 = cat.label) != null ? _a2 : i
               );
             }) }) }),
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: ResourcesGridList_module_default.mobileSidebarCloseColumn, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -2919,15 +3071,26 @@ var ResourcesGridList = ({
         {
           categories,
           isMobile,
-          onToggle: () => setIsSidebarOpen(true)
+          onToggle: () => setIsSidebarOpen(true),
+          selectedIndex: selectedCategory,
+          onSelect: handleSelectCategory
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx23__default.default(ResourcesGridList_module_default.cardsArea, ResourcesGridList_module_default[view]), children: displayedItems.map((item, i) => {
-        var _a;
-        return /* @__PURE__ */ jsxRuntime.jsx(ResourceCardItem, { item, view }, (_a = item.title) != null ? _a : i);
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx25__default.default(ResourcesGridList_module_default.cardsArea, ResourcesGridList_module_default[view]), children: paginatedItems.map((item, i) => {
+        var _a2;
+        return /* @__PURE__ */ jsxRuntime.jsx(ResourceCardItem, { item, view }, (_a2 = item.title) != null ? _a2 : i);
       }) })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(Pagination3, {})
+    totalPages > 1 && /* @__PURE__ */ jsxRuntime.jsx(
+      Pagination,
+      {
+        currentPage: safeCurrentPage,
+        totalPages,
+        loop: false,
+        onPageChange: setCurrentPage
+      },
+      `${selectedCategory}-${filterValue}-${sortValue}-${searchQuery}`
+    )
   ] });
 };
 function useIntersectionObserver({
@@ -2969,6 +3132,7 @@ exports.ContactModule = ContactModule2;
 exports.Container = Container;
 exports.CountingCard = CountingCard2;
 exports.EventList = EventList2;
+exports.FilterBar = FilterBar;
 exports.Footer = Footer;
 exports.HeroBanner = HeroBanner2;
 exports.HeroBannerCarousel = HeroBannerCarousel;
@@ -2982,7 +3146,9 @@ exports.Pagination = Pagination;
 exports.Picture = Picture;
 exports.PracticeCard = PracticeCard;
 exports.PracticePathCards = PracticePathCards2;
+exports.ResourceCardItem = ResourceCardItem;
 exports.ResourcesGridList = ResourcesGridList;
+exports.Sidebar = Sidebar;
 exports.Teaser5050With3Text = Teaser5050With3Text2;
 exports.Teaser5050WithCta = Teaser5050WithCta2;
 exports.TextBody = TextBody2;