@asante-org/leybold-design-system 1.2.0

package/dist/index.esm.js

@@ -0,0 +1,2859 @@
+import React, { useMemo, useState, useCallback, useRef, useEffect } from 'react';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { faArrowLeft, faArrowLeftLong, faArrowRight, faArrowRightLong, faChevronRight, faChevronLeft, faArrowUpRightFromSquare, faGlobe, faXmark as faXmark$1 } from '@fortawesome/free-solid-svg-icons';
+import { faInstagram, faYoutube, faLinkedinIn, faXTwitter, faFacebookF } from '@fortawesome/free-brands-svg-icons';
+import { faChevronRight as faChevronRight$1, faArrowUpRightFromSquare as faArrowUpRightFromSquare$1 } from '@fortawesome/pro-solid-svg-icons';
+import { ProductDetailsCard, AlgoliaDynamicSearchRaw, QrForm } from '@asantemedia-org/edwardsvacuum-design-system';
+
+function _extends() {
+  return _extends = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+    }
+    return n;
+  }, _extends.apply(null, arguments);
+}
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
+
+var __assign = function () {
+  __assign = Object.assign || function __assign(t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+function __rest(s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+}
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+  var e = new Error(message);
+  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+var styles$k = {"button":"Button-module__button___18Bed","button--primary":"Button-module__button--primary___VuF-P","button--disabled":"Button-module__button--disabled___IuOY8","button--secondary":"Button-module__button--secondary___lD5E3","button--solid-grey":"Button-module__button--solid-grey___oRbEy","button--solid-black":"Button-module__button--solid-black___1Ma5K","button--solid-white":"Button-module__button--solid-white___bE-Z0","button--outlined-grey":"Button-module__button--outlined-grey___xWGbB","button--outlined-black":"Button-module__button--outlined-black___qfX5o","button--outlined-white":"Button-module__button--outlined-white___QLXNP","button--link-text":"Button-module__button--link-text___R2kun","button__icon":"Button-module__button__icon___hlcHo","button--link-text-alt":"Button-module__button--link-text-alt___1p7wH","button--external-link":"Button-module__button--external-link___Mhxuk","button--carousel-arrow-left":"Button-module__button--carousel-arrow-left___Wx-Jo","button--carousel-arrow-right":"Button-module__button--carousel-arrow-right___3ZtgT","button__icon__default":"Button-module__button__icon__default___0qlF1","button__icon__hover":"Button-module__button__icon__hover___3xPGT","button--extra-small":"Button-module__button--extra-small___R0QTM","button--small":"Button-module__button--small___ADJQe","button--medium":"Button-module__button--medium___ZuR4Z","button--large":"Button-module__button--large___-FaV5","button__icon--left":"Button-module__button__icon--left___wMCeH","button__icon--right":"Button-module__button__icon--right___-pGHl"};
+
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
+var classnames = {exports: {}};
+
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/
+var hasRequiredClassnames;
+function requireClassnames() {
+  if (hasRequiredClassnames) return classnames.exports;
+  hasRequiredClassnames = 1;
+  (function (module) {
+    /* global define */
+
+    (function () {
+
+      var hasOwn = {}.hasOwnProperty;
+      function classNames() {
+        var classes = '';
+        for (var i = 0; i < arguments.length; i++) {
+          var arg = arguments[i];
+          if (arg) {
+            classes = appendClass(classes, parseValue(arg));
+          }
+        }
+        return classes;
+      }
+      function parseValue(arg) {
+        if (typeof arg === 'string' || typeof arg === 'number') {
+          return arg;
+        }
+        if (typeof arg !== 'object') {
+          return '';
+        }
+        if (Array.isArray(arg)) {
+          return classNames.apply(null, arg);
+        }
+        if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
+          return arg.toString();
+        }
+        var classes = '';
+        for (var key in arg) {
+          if (hasOwn.call(arg, key) && arg[key]) {
+            classes = appendClass(classes, key);
+          }
+        }
+        return classes;
+      }
+      function appendClass(value, newClass) {
+        if (!newClass) {
+          return value;
+        }
+        if (value) {
+          return value + ' ' + newClass;
+        }
+        return value + newClass;
+      }
+      if (module.exports) {
+        classNames.default = classNames;
+        module.exports = classNames;
+      } else {
+        window.classNames = classNames;
+      }
+    })();
+  })(classnames);
+  return classnames.exports;
+}
+
+var classnamesExports = requireClassnames();
+var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
+
+/**
+ * Get the icon component based on icon type
+ */
+var getIcon = function (icon) {
+  switch (icon) {
+    case "arrow-right":
+      return /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+        icon: faArrowRight
+      });
+    case "external":
+      return /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+        icon: faArrowUpRightFromSquare
+      });
+    case "chevron-left":
+      return /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+        icon: faChevronLeft
+      });
+    case "chevron-right":
+      return /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+        icon: faChevronRight
+      });
+    default:
+      return null;
+  }
+};
+/**
+ * Get default icon for certain variants
+ */
+var getDefaultIcon = function (variant) {
+  switch (variant) {
+    case "link-text":
+    case "link-text-alt":
+    case "text":
+      // Alias
+      return "arrow-right";
+    case "external-link":
+      return "external";
+    case "carousel-arrow-left":
+      return "chevron-left";
+    case "carousel-arrow-right":
+      return "chevron-right";
+    default:
+      return "none";
+  }
+};
+/**
+ * Map alias variants to their actual CSS class variants
+ */
+var mapVariantToClass = function (variant) {
+  switch (variant) {
+    case "text":
+      return "link-text";
+    default:
+      return variant;
+  }
+};
+/**
+ * Primary UI component for user interaction
+ */
+var Button = function (_a) {
+  var _b;
+  var children = _a.children,
+    _c = _a.variant,
+    variant = _c === void 0 ? "primary" : _c,
+    _d = _a.size,
+    size = _d === void 0 ? "medium" : _d,
+    _e = _a.disabled,
+    disabled = _e === void 0 ? false : _e,
+    onClick = _a.onClick,
+    _f = _a.type,
+    type = _f === void 0 ? "button" : _f,
+    className = _a.className,
+    icon = _a.icon,
+    _g = _a.iconPosition,
+    iconPosition = _g === void 0 ? "right" : _g,
+    ariaLabel = _a.ariaLabel;
+    _a.opensInNewTab;
+    var props = __rest(_a, ["children", "variant", "size", "disabled", "onClick", "type", "className", "icon", "iconPosition", "ariaLabel", "opensInNewTab"]);
+  // Map alias variants to actual class names
+  var cssVariant = mapVariantToClass(variant);
+  // Determine the icon to display
+  var displayIcon = icon !== null && icon !== void 0 ? icon : getDefaultIcon(variant);
+  var iconElement = getIcon(displayIcon);
+  // Check if this is an icon-only button (carousel arrows)
+  var isIconOnly = variant === "carousel-arrow-left" || variant === "carousel-arrow-right";
+  var isCarouselLeft = variant === "carousel-arrow-left";
+  var isCarouselRight = variant === "carousel-arrow-right";
+  var buttonClasses = classNames(styles$k.button, styles$k["button--".concat(cssVariant)], styles$k["button--".concat(size)], (_b = {}, _b[styles$k["button--disabled"]] = disabled, _b), className);
+  var iconClasses = classNames(styles$k.button__icon, styles$k["button__icon--".concat(iconPosition)]);
+  // Generate accessible label for icon-only buttons
+  var accessibleLabel = ariaLabel || (isIconOnly ? variant === "carousel-arrow-left" ? "Previous" : "Next" : undefined);
+  return /*#__PURE__*/React.createElement("button", _extends({
+    type: type,
+    className: buttonClasses,
+    disabled: disabled,
+    onClick: onClick,
+    "aria-label": accessibleLabel,
+    "data-force-state": props['data-force-state']
+  }, props), !isIconOnly && children, isCarouselLeft && /*#__PURE__*/React.createElement("span", {
+    className: iconClasses
+  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faArrowLeft,
+    className: styles$k.button__icon__default
+  }), /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faArrowLeftLong,
+    className: styles$k.button__icon__hover
+  })), isCarouselRight && /*#__PURE__*/React.createElement("span", {
+    className: iconClasses
+  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faArrowRight,
+    className: styles$k.button__icon__default
+  }), /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faArrowRightLong,
+    className: styles$k.button__icon__hover
+  })), !isIconOnly && iconElement && /*#__PURE__*/React.createElement("span", {
+    className: iconClasses
+  }, iconElement));
+};
+
+var styles$j = {"footer":"Footer-module__footer___Oavyx","footer--mobile":"Footer-module__footer--mobile___9HQC-","footer__container":"Footer-module__footer__container___ohvnm","footer__links":"Footer-module__footer__links___DdVK8","footer__linkGroup":"Footer-module__footer__linkGroup___1B7JA","footer__linkList":"Footer-module__footer__linkList___j-DWF","footer__linkHeading":"Footer-module__footer__linkHeading___LtE6X","footer__link":"Footer-module__footer__link___G5HPW","footer__cta":"Footer-module__footer__cta___MRJLr","footer__socialIcons":"Footer-module__footer__socialIcons___j0aRp","footer__socialIcon":"Footer-module__footer__socialIcon___1uVTm","footer__countrySelector":"Footer-module__footer__countrySelector___pVtN5","footer__bottom":"Footer-module__footer__bottom___77bPL","footer__bottomLeft":"Footer-module__footer__bottomLeft___tlst1","footer__bottomLinks":"Footer-module__footer__bottomLinks___s22h7","footer__bottomLink":"Footer-module__footer__bottomLink___SLzwY","footer__copyright":"Footer-module__footer__copyright___4bZOF","footer__brandSection":"Footer-module__footer__brandSection___BBr5f","footer__logo":"Footer-module__footer__logo___mv-9M","footer__leftCol":"Footer-module__footer__leftCol___vmKNN","footer__motto":"Footer-module__footer__motto___QtB2m","footer__main":"Footer-module__footer__main___NSU9d","footer__badge":"Footer-module__footer__badge___faejb","footer__badgeIcon":"Footer-module__footer__badgeIcon___xJ519","footer__badgeText":"Footer-module__footer__badgeText___imXgG","footer__linkText":"Footer-module__footer__linkText___Gc18Z","footer__linkIcon":"Footer-module__footer__linkIcon___IZzJM","footer__countrySelectorIcon":"Footer-module__footer__countrySelectorIcon___hhEd4"};
+
+/**
+ * External link icon (↗) for footer links that open in new tabs
+ */
+var ExternalLinkIcon = function (_a) {
+  var className = _a.className,
+    _b = _a.size,
+    size = _b === void 0 ? 15 : _b;
+  return /*#__PURE__*/React.createElement("svg", {
+    width: size,
+    height: size,
+    viewBox: "0 0 15 15",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: className,
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M11.25 8.125V11.875C11.25 12.2065 11.1183 12.5245 10.8839 12.7589C10.6495 12.9933 10.3315 13.125 10 13.125H3.125C2.79348 13.125 2.47554 12.9933 2.24112 12.7589C2.0067 12.5245 1.875 12.2065 1.875 11.875V5C1.875 4.66848 2.0067 4.35054 2.24112 4.11612C2.47554 3.8817 2.79348 3.75 3.125 3.75H6.875M9.375 1.875H13.125M13.125 1.875V5.625M13.125 1.875L6.25 8.75",
+    stroke: "currentColor",
+    strokeWidth: "1.5",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }));
+};
+
+/**
+ * Atlas Copco Group badge icon (square)
+ */
+var AtlasCopcoIcon = function (_a) {
+  var className = _a.className,
+    _b = _a.size,
+    size = _b === void 0 ? 14 : _b;
+  return /*#__PURE__*/React.createElement("svg", {
+    width: size,
+    height: size,
+    viewBox: "0 0 14 14",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: className,
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("rect", {
+    x: "0.5",
+    y: "0.5",
+    width: "13",
+    height: "13",
+    rx: "1.5",
+    fill: "#D9D9D9",
+    stroke: "#D9D9D9"
+  }));
+};
+
+// =============================================================================
+// SOCIAL ICON COMPONENT
+// =============================================================================
+var SocialIconComponent = function (_a) {
+  var platform = _a.platform;
+  var iconMap = {
+    facebook: faFacebookF,
+    x: faXTwitter,
+    linkedin: faLinkedinIn,
+    youtube: faYoutube,
+    instagram: faInstagram
+  };
+  return /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: iconMap[platform]
+  });
+};
+var FooterLink = function (_a) {
+  var item = _a.item,
+    className = _a.className,
+    _b = _a.variant,
+    variant = _b === void 0 ? 'default' : _b;
+  var baseClass = variant === 'bottom' ? styles$j.footer__bottomLink : styles$j.footer__link;
+  var linkClasses = classNames(baseClass, className);
+  var handleClick = function (e) {
+    if (item.onClick) {
+      e.preventDefault();
+      item.onClick();
+    }
+  };
+  return /*#__PURE__*/React.createElement("a", _extends({
+    href: item.href,
+    className: linkClasses,
+    onClick: item.onClick ? handleClick : undefined
+  }, item.external && {
+    target: '_blank',
+    rel: 'noopener noreferrer'
+  }), /*#__PURE__*/React.createElement("span", {
+    className: styles$j.footer__linkText
+  }, item.label), item.external && /*#__PURE__*/React.createElement("span", {
+    className: styles$j.footer__linkIcon
+  }, /*#__PURE__*/React.createElement(ExternalLinkIcon, {
+    size: 15
+  })));
+};
+var FooterLinkGroup = function (_a) {
+  var heading = _a.heading,
+    links = _a.links,
+    className = _a.className,
+    children = _a.children;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(styles$j.footer__linkGroup, className)
+  }, /*#__PURE__*/React.createElement("h3", {
+    className: styles$j.footer__linkHeading
+  }, heading), /*#__PURE__*/React.createElement("ul", {
+    className: styles$j.footer__linkList
+  }, links.map(function (link, index) {
+    return /*#__PURE__*/React.createElement("li", {
+      key: index
+    }, /*#__PURE__*/React.createElement(FooterLink, {
+      item: link
+    }));
+  })), children);
+};
+var FooterSocialIcons = function (_a) {
+  var links = _a.links,
+    className = _a.className;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(styles$j.footer__socialIcons, className)
+  }, links.map(function (link, index) {
+    return /*#__PURE__*/React.createElement("a", {
+      key: index,
+      href: link.href,
+      className: styles$j.footer__socialIcon,
+      "aria-label": link.ariaLabel,
+      target: "_blank",
+      rel: "noopener noreferrer"
+    }, /*#__PURE__*/React.createElement(SocialIconComponent, {
+      platform: link.platform
+    }));
+  }));
+};
+var FooterSocialIcon = function (_a) {
+  var platform = _a.platform,
+    className = _a.className;
+  var iconClasses = classNames(styles$j.footer__socialIcon, className);
+  return /*#__PURE__*/React.createElement("span", {
+    className: iconClasses
+  }, /*#__PURE__*/React.createElement(SocialIconComponent, {
+    platform: platform
+  }));
+};
+var FooterBottom = function (_a) {
+  var links = _a.links,
+    copyright = _a.copyright,
+    countrySelector = _a.countrySelector,
+    className = _a.className;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(styles$j.footer__bottom, className)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$j.footer__bottomLeft
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$j.footer__bottomLinks
+  }, links.map(function (link, index) {
+    return /*#__PURE__*/React.createElement(FooterLink, {
+      key: index,
+      item: link,
+      variant: "bottom"
+    });
+  })), /*#__PURE__*/React.createElement("p", {
+    className: styles$j.footer__copyright
+  }, copyright)), countrySelector && /*#__PURE__*/React.createElement("a", {
+    href: countrySelector.href || '#',
+    className: styles$j.footer__countrySelector
+  }, countrySelector.showIcon !== false && /*#__PURE__*/React.createElement("span", {
+    className: styles$j.footer__countrySelectorIcon
+  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faGlobe
+  })), countrySelector.label));
+};
+// =============================================================================
+// MAIN FOOTER COMPONENT
+// =============================================================================
+/**
+ * Footer component with brand identity, navigation links, social icons, and legal information.
+ * Supports two layout variants:
+ * - desktop: Logo at top, 3-column main content
+ * - mobile: Logo at bottom, stacked layout with CTA button
+ */
+var Footer = function (_a) {
+  var _b = _a.variant,
+    variant = _b === void 0 ? 'desktop' : _b,
+    logo = _a.logo,
+    motto = _a.motto,
+    atlasCopcoBadge = _a.atlasCopcoBadge,
+    quickLinks = _a.quickLinks,
+    _c = _a.quickLinksHeading,
+    quickLinksHeading = _c === void 0 ? 'Quick links' : _c,
+    contactLinks = _a.contactLinks,
+    _d = _a.contactHeading,
+    contactHeading = _d === void 0 ? 'Contact us' : _d,
+    socialLinks = _a.socialLinks,
+    contactFormButton = _a.contactFormButton,
+    bottomLinks = _a.bottomLinks,
+    copyright = _a.copyright,
+    countrySelector = _a.countrySelector,
+    className = _a.className;
+  var isMobile = variant === 'mobile';
+  var footerClasses = classNames(styles$j.footer, isMobile && styles$j['footer--mobile'], className);
+  var LogoWrapper = logo.href ? 'a' : 'div';
+  var logoProps = logo.href ? {
+    href: logo.href,
+    className: styles$j.footer__logo
+  } : {
+    className: styles$j.footer__logo
+  };
+  // Logo + Motto + Badge component (used in both layouts)
+  var LogoSection = function () {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LogoWrapper, logoProps, /*#__PURE__*/React.createElement("img", {
+      src: logo.src,
+      alt: logo.alt
+    })), /*#__PURE__*/React.createElement("div", {
+      className: styles$j.footer__leftCol
+    }, /*#__PURE__*/React.createElement("h2", {
+      className: styles$j.footer__motto
+    }, motto), atlasCopcoBadge && /*#__PURE__*/React.createElement("div", {
+      className: styles$j.footer__badge
+    }, atlasCopcoBadge.showIcon !== false && /*#__PURE__*/React.createElement("span", {
+      className: styles$j.footer__badgeIcon
+    }, /*#__PURE__*/React.createElement(AtlasCopcoIcon, {
+      size: 14
+    })), /*#__PURE__*/React.createElement("span", {
+      className: styles$j.footer__badgeText
+    }, atlasCopcoBadge.text))));
+  };
+  // Mobile layout: Links at top, logo/motto at bottom
+  if (isMobile) {
+    return /*#__PURE__*/React.createElement("footer", {
+      className: footerClasses
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles$j.footer__container
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles$j.footer__links
+    }, /*#__PURE__*/React.createElement(FooterLinkGroup, {
+      heading: quickLinksHeading,
+      links: quickLinks
+    }), /*#__PURE__*/React.createElement(FooterLinkGroup, {
+      heading: contactHeading,
+      links: contactLinks
+    })), contactFormButton && /*#__PURE__*/React.createElement("div", {
+      className: styles$j.footer__cta
+    }, /*#__PURE__*/React.createElement("a", {
+      href: contactFormButton.href,
+      style: {
+        textDecoration: 'none',
+        width: '100%'
+      }
+    }, /*#__PURE__*/React.createElement(Button, {
+      variant: "primary",
+      style: {
+        width: '100%'
+      }
+    }, contactFormButton.label))), socialLinks.length > 0 && /*#__PURE__*/React.createElement(FooterSocialIcons, {
+      links: socialLinks
+    }), /*#__PURE__*/React.createElement(FooterBottom, {
+      links: bottomLinks,
+      copyright: copyright,
+      countrySelector: countrySelector
+    }), /*#__PURE__*/React.createElement("div", {
+      className: styles$j.footer__brandSection
+    }, /*#__PURE__*/React.createElement(LogoSection, null))));
+  }
+  // Desktop layout: Logo at top, 3-column main content
+  return /*#__PURE__*/React.createElement("footer", {
+    className: footerClasses
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$j.footer__container
+  }, /*#__PURE__*/React.createElement(LogoWrapper, logoProps, /*#__PURE__*/React.createElement("img", {
+    src: logo.src,
+    alt: logo.alt
+  })), /*#__PURE__*/React.createElement("div", {
+    className: styles$j.footer__main
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$j.footer__leftCol
+  }, /*#__PURE__*/React.createElement("h2", {
+    className: styles$j.footer__motto
+  }, motto), atlasCopcoBadge && /*#__PURE__*/React.createElement("div", {
+    className: styles$j.footer__badge
+  }, atlasCopcoBadge.showIcon !== false && /*#__PURE__*/React.createElement("span", {
+    className: styles$j.footer__badgeIcon
+  }, /*#__PURE__*/React.createElement(AtlasCopcoIcon, {
+    size: 14
+  })), /*#__PURE__*/React.createElement("span", {
+    className: styles$j.footer__badgeText
+  }, atlasCopcoBadge.text))), /*#__PURE__*/React.createElement("div", {
+    className: styles$j.footer__links
+  }, /*#__PURE__*/React.createElement(FooterLinkGroup, {
+    heading: quickLinksHeading,
+    links: quickLinks
+  }), /*#__PURE__*/React.createElement(FooterLinkGroup, {
+    heading: contactHeading,
+    links: contactLinks
+  }, socialLinks.length > 0 && /*#__PURE__*/React.createElement(FooterSocialIcons, {
+    links: socialLinks
+  })))), /*#__PURE__*/React.createElement(FooterBottom, {
+    links: bottomLinks,
+    copyright: copyright,
+    countrySelector: countrySelector
+  })));
+};
+
+var styles$i = {"pagination":"Pagination-module__pagination___Kih79","dividerLine":"Pagination-module__dividerLine___85LAX","paginationList":"Pagination-module__paginationList___-lZpm","paginationItem":"Pagination-module__paginationItem___VsGFa","pageButton":"Pagination-module__pageButton___b6UNF","pageButtonActive":"Pagination-module__pageButtonActive___D9m18","navButton":"Pagination-module__navButton___ZCIai","navButtonDisabled":"Pagination-module__navButtonDisabled___IZK8H","navIcon":"Pagination-module__navIcon___-BVJ3","ellipsis":"Pagination-module__ellipsis___iAsGN","ellipsisText":"Pagination-module__ellipsisText___fd6u1"};
+
+var PaginationItem = function (_a) {
+  var page = _a.page,
+    isActive = _a.isActive,
+    onClick = _a.onClick,
+    className = _a.className;
+  var handleClick = function () {
+    if (!isActive) {
+      onClick(page);
+    }
+  };
+  var handleKeyDown = function (event) {
+    if (event.key === "Enter" || event.key === " ") {
+      event.preventDefault();
+      handleClick();
+    }
+  };
+  return /*#__PURE__*/React.createElement("li", {
+    className: styles$i.paginationItem
+  }, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: handleClick,
+    onKeyDown: handleKeyDown,
+    className: "".concat(styles$i.pageButton, " ").concat(isActive ? styles$i.pageButtonActive : "", " ").concat(className || ""),
+    "aria-current": isActive ? "page" : undefined,
+    "aria-label": "Page ".concat(page),
+    disabled: isActive,
+    tabIndex: isActive ? -1 : 0
+  }, page));
+};
+
+var PaginationButton = function (_a) {
+  var label = _a.label,
+    disabled = _a.disabled,
+    onClick = _a.onClick,
+    direction = _a.direction,
+    className = _a.className,
+    ariaLabel = _a.ariaLabel;
+  var handleKeyDown = function (event) {
+    if (event.key === "Enter" || event.key === " ") {
+      event.preventDefault();
+      if (!disabled) {
+        onClick();
+      }
+    }
+  };
+  return /*#__PURE__*/React.createElement("li", {
+    className: styles$i.paginationItem
+  }, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onClick,
+    onKeyDown: handleKeyDown,
+    disabled: disabled,
+    className: "".concat(styles$i.navButton, " ").concat(styles$i["navButton--".concat(direction)], " ").concat(disabled ? styles$i.navButtonDisabled : "", " ").concat(className || ""),
+    "aria-label": ariaLabel || label,
+    tabIndex: disabled ? -1 : 0
+  }, /*#__PURE__*/React.createElement("span", null, label), direction === "next" && /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faChevronRight$1,
+    className: styles$i.navIcon,
+    "aria-hidden": "true"
+  })));
+};
+
+var PaginationEllipsis = function (_a) {
+  var className = _a.className;
+  return /*#__PURE__*/React.createElement("li", {
+    className: "".concat(styles$i.paginationItem, " ").concat(styles$i.ellipsis),
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "".concat(styles$i.ellipsisText, " ").concat(className || "")
+  }, "..."));
+};
+
+/**
+ * Generate page numbers to display with ellipsis logic
+ */
+var generatePageNumbers = function (currentPage, totalPages, maxVisiblePages) {
+  if (totalPages <= maxVisiblePages) {
+    return Array.from({
+      length: totalPages
+    }, function (_, i) {
+      return i + 1;
+    });
+  }
+  var pages = [];
+  var halfVisible = Math.floor(maxVisiblePages / 2);
+  // Always show first page
+  pages.push(1);
+  var startPage = Math.max(2, currentPage - halfVisible);
+  var endPage = Math.min(totalPages - 1, currentPage + halfVisible);
+  // Adjust if we're near the start
+  if (currentPage <= halfVisible + 1) {
+    endPage = Math.min(maxVisiblePages - 1, totalPages - 1);
+    startPage = 2;
+  }
+  // Adjust if we're near the end
+  if (currentPage >= totalPages - halfVisible) {
+    startPage = Math.max(2, totalPages - maxVisiblePages + 2);
+    endPage = totalPages - 1;
+  }
+  // Add ellipsis after first page if needed
+  if (startPage > 2) {
+    pages.push("ellipsis-start");
+  }
+  // Add middle pages
+  for (var i = startPage; i <= endPage; i++) {
+    pages.push(i);
+  }
+  // Add ellipsis before last page if needed
+  if (endPage < totalPages - 1) {
+    pages.push("ellipsis-end");
+  }
+  // Always show last page
+  if (totalPages > 1) {
+    pages.push(totalPages);
+  }
+  return pages;
+};
+var Pagination = function (_a) {
+  var currentPage = _a.currentPage,
+    totalPages = _a.totalPages,
+    onPageChange = _a.onPageChange,
+    _b = _a.maxVisiblePages,
+    maxVisiblePages = _b === void 0 ? 10 : _b,
+    _c = _a.showPrevious,
+    showPrevious = _c === void 0 ? true : _c,
+    _d = _a.showNext,
+    showNext = _d === void 0 ? true : _d,
+    _e = _a.previousLabel,
+    previousLabel = _e === void 0 ? "Previous" : _e,
+    _f = _a.nextLabel,
+    nextLabel = _f === void 0 ? "Next" : _f,
+    className = _a.className,
+    _g = _a.ariaLabel,
+    ariaLabel = _g === void 0 ? "Pagination" : _g;
+  var pageNumbers = useMemo(function () {
+    return generatePageNumbers(currentPage, totalPages, maxVisiblePages);
+  }, [currentPage, totalPages, maxVisiblePages]);
+  var handlePageChange = function (page) {
+    if (page >= 1 && page <= totalPages && page !== currentPage) {
+      onPageChange(page);
+    }
+  };
+  var handlePrevious = function () {
+    handlePageChange(currentPage - 1);
+  };
+  var handleNext = function () {
+    handlePageChange(currentPage + 1);
+  };
+  // Don't render if there's only one page or no pages
+  if (totalPages <= 1) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("nav", {
+    className: "".concat(styles$i.pagination, " ").concat(className || ""),
+    "aria-label": ariaLabel,
+    role: "navigation"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$i.dividerLine
+  }), /*#__PURE__*/React.createElement("ul", {
+    className: styles$i.paginationList
+  }, showPrevious && /*#__PURE__*/React.createElement(PaginationButton, {
+    label: previousLabel,
+    disabled: currentPage === 1,
+    onClick: handlePrevious,
+    direction: "previous",
+    ariaLabel: "Go to previous page"
+  }), pageNumbers.map(function (page, index) {
+    if (page === "ellipsis-start" || page === "ellipsis-end") {
+      return /*#__PURE__*/React.createElement(PaginationEllipsis, {
+        key: "ellipsis-".concat(index)
+      });
+    }
+    return /*#__PURE__*/React.createElement(PaginationItem, {
+      key: page,
+      page: page,
+      isActive: page === currentPage,
+      onClick: handlePageChange
+    });
+  }), showNext && /*#__PURE__*/React.createElement(PaginationButton, {
+    label: nextLabel,
+    disabled: currentPage === totalPages,
+    onClick: handleNext,
+    direction: "next",
+    ariaLabel: "Go to next page"
+  })));
+};
+
+var styles$h = {"productCard":"ProductCardHorizontal-module__productCard___Nl4jK","productWrapper":"ProductCardHorizontal-module__productWrapper___gs8fn","withImage":"ProductCardHorizontal-module__withImage___pPFw2","productTitle":"ProductCardHorizontal-module__productTitle___xBuu7","productPrice":"ProductCardHorizontal-module__productPrice___lf32A","productImage":"ProductCardHorizontal-module__productImage___sQsUO","productId":"ProductCardHorizontal-module__productId___3oOQV","productTitleDescriptionWrapper":"ProductCardHorizontal-module__productTitleDescriptionWrapper___Obv-j","productPriceCtaWrapper":"ProductCardHorizontal-module__productPriceCtaWrapper___Npkfl","productArrowIcon":"ProductCardHorizontal-module__productArrowIcon___1-A76"};
+
+var styles$g = {"imageContainer":"Image-module__imageContainer___iD5Kd","loading":"Image-module__loading___Sh1zO","image":"Image-module__image___1pa50","error":"Image-module__error___0LGZ2","skeleton":"Image-module__skeleton___0bGS6","shimmer":"Image-module__shimmer___aanrl","errorState":"Image-module__errorState___TjV-8","errorIcon":"Image-module__errorIcon___QCKvj","errorText":"Image-module__errorText___Q8pnb"};
+
+var Image = function (_a) {
+  var src = _a.src,
+    alt = _a.alt,
+    width = _a.width,
+    height = _a.height,
+    _b = _a.loading,
+    loading = _b === void 0 ? "lazy" : _b,
+    _c = _a.decoding,
+    decoding = _c === void 0 ? "async" : _c,
+    _d = _a.objectFit,
+    objectFit = _d === void 0 ? "cover" : _d,
+    _e = _a.objectPosition,
+    objectPosition = _e === void 0 ? "center" : _e,
+    aspectRatio = _a.aspectRatio,
+    _f = _a.isDecorative,
+    isDecorative = _f === void 0 ? false : _f,
+    fallbackSrc = _a.fallbackSrc,
+    onLoad = _a.onLoad,
+    onError = _a.onError,
+    _g = _a.className,
+    className = _g === void 0 ? "" : _g,
+    srcSet = _a.srcSet,
+    sizes = _a.sizes;
+  var _h = useState(true),
+    isLoading = _h[0],
+    setIsLoading = _h[1];
+  var _j = useState(false),
+    hasError = _j[0],
+    setHasError = _j[1];
+  var _k = useState(src),
+    currentSrc = _k[0],
+    setCurrentSrc = _k[1];
+  var handleLoad = useCallback(function () {
+    setIsLoading(false);
+    setHasError(false);
+    onLoad === null || onLoad === void 0 ? void 0 : onLoad();
+  }, [onLoad]);
+  var handleError = useCallback(function () {
+    setIsLoading(false);
+    setHasError(true);
+    // Try fallback if available and not already using it
+    if (fallbackSrc && currentSrc !== fallbackSrc) {
+      setCurrentSrc(fallbackSrc);
+      setHasError(false);
+      setIsLoading(true);
+    } else {
+      onError === null || onError === void 0 ? void 0 : onError();
+    }
+  }, [fallbackSrc, currentSrc, onError]);
+  // Accessibility: decorative images should have empty alt and be hidden from screen readers
+  var accessibilityProps = isDecorative ? {
+    alt: "",
+    "aria-hidden": true,
+    role: "presentation"
+  } : {
+    alt: alt
+  };
+  var containerStyle = __assign(__assign(__assign({}, aspectRatio && {
+    aspectRatio: aspectRatio
+  }), width && {
+    width: typeof width === "number" ? "".concat(width, "px") : width
+  }), height && {
+    height: typeof height === "number" ? "".concat(height, "px") : height
+  });
+  var imageStyle = {
+    objectFit: objectFit,
+    objectPosition: objectPosition
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$g.imageContainer, " ").concat(className, " ").concat(isLoading ? styles$g.loading : "", " ").concat(hasError ? styles$g.error : ""),
+    style: containerStyle
+  }, isLoading && /*#__PURE__*/React.createElement("div", {
+    className: styles$g.skeleton,
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$g.shimmer
+  })), hasError && !fallbackSrc ? /*#__PURE__*/React.createElement("div", {
+    className: styles$g.errorState,
+    role: "img",
+    "aria-label": alt || "Image failed to load"
+  }, /*#__PURE__*/React.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "1.5",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: styles$g.errorIcon,
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("rect", {
+    x: "3",
+    y: "3",
+    width: "18",
+    height: "18",
+    rx: "2",
+    ry: "2"
+  }), /*#__PURE__*/React.createElement("circle", {
+    cx: "8.5",
+    cy: "8.5",
+    r: "1.5"
+  }), /*#__PURE__*/React.createElement("polyline", {
+    points: "21 15 16 10 5 21"
+  })), /*#__PURE__*/React.createElement("span", {
+    className: styles$g.errorText
+  }, "Image unavailable")) : /*#__PURE__*/React.createElement("img", _extends({
+    src: currentSrc
+  }, accessibilityProps, {
+    width: width,
+    height: height,
+    loading: loading,
+    decoding: decoding,
+    onLoad: handleLoad,
+    onError: handleError,
+    className: styles$g.image,
+    style: imageStyle,
+    srcSet: srcSet,
+    sizes: sizes
+  })));
+};
+
+/*!
+ * Font Awesome Pro 6.7.2 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license (Commercial License)
+ * Copyright 2024 Fonticons, Inc.
+ */
+const faArrowUpRight = {
+  prefix: 'far',
+  iconName: 'arrow-up-right',
+  icon: [384, 512, [], "e09f", "M328 96c13.3 0 24 10.7 24 24l0 240c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-182.1L73 409c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l231-231L88 144c-13.3 0-24-10.7-24-24s10.7-24 24-24l240 0z"]
+};
+
+var ProductCardHorizontal = function (_a) {
+  _a.id;
+    var imageUrl = _a.imageUrl,
+    url = _a.url,
+    title = _a.title;
+    _a.description;
+    var price = _a.price,
+    productId = _a.productId,
+    button = _a.button,
+    _b = _a.className,
+    className = _b === void 0 ? "" : _b;
+  if (!title) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("a", {
+    href: url,
+    className: "".concat(styles$h.productCard, " ").concat(className),
+    "aria-label": "View product: ".concat(title)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$h.productWrapper, " ").concat(imageUrl ? styles$h.withImage : "")
+  }, imageUrl && /*#__PURE__*/React.createElement("div", {
+    className: styles$h.productImage
+  }, /*#__PURE__*/React.createElement(Image, {
+    src: imageUrl,
+    alt: title
+  })), /*#__PURE__*/React.createElement("div", {
+    className: styles$h.productTitleDescriptionWrapper
+  }, /*#__PURE__*/React.createElement("h3", {
+    className: styles$h.productTitle
+  }, title), productId && /*#__PURE__*/React.createElement("p", {
+    className: styles$h.productId
+  }, productId)), /*#__PURE__*/React.createElement("div", {
+    className: styles$h.productPriceCtaWrapper
+  }, /*#__PURE__*/React.createElement("p", {
+    className: styles$h.productPrice
+  }, price || " "), button ? /*#__PURE__*/React.createElement(Button, {
+    className: styles$h.productButton,
+    onClick: button.onClick,
+    size: "extra-small"
+  }, button.label) : /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faArrowUpRight,
+    className: styles$h.productArrowIcon,
+    "aria-hidden": "true"
+  }))));
+};
+// Alias for backward compatibility
+var ProductCardHorizontalParts = ProductCardHorizontal;
+
+var styles$f = {"productDetails":"ProductCardDetails-module__productDetails___-sx2l","spareCard":"ProductCardDetails-module__spareCard___vC1Ju"};
+
+// Adapter to map design system props to ProductCardHorizontalParts props
+var SpareCardAdapter = function (props) {
+  var spare = props.spare,
+    rest = __rest(props, ["spare"]);
+  return /*#__PURE__*/React.createElement(ProductCardHorizontalParts, {
+    className: styles$f.spareCard,
+    url: (spare === null || spare === void 0 ? void 0 : spare.url) || (spare === null || spare === void 0 ? void 0 : spare.link) || "#",
+    title: (spare === null || spare === void 0 ? void 0 : spare.name) || (spare === null || spare === void 0 ? void 0 : spare.title) || "",
+    description: (spare === null || spare === void 0 ? void 0 : spare.description) || "",
+    price: (spare === null || spare === void 0 ? void 0 : spare.priceValue) || (spare === null || spare === void 0 ? void 0 : spare.price) || "",
+    imageUrl: (spare === null || spare === void 0 ? void 0 : spare["img-product"]) || (spare === null || spare === void 0 ? void 0 : spare.image) || "",
+    button: {
+      label: rest.cta || "View Product",
+      onClick: function () {
+        return window.open((spare === null || spare === void 0 ? void 0 : spare.url) || (spare === null || spare === void 0 ? void 0 : spare.link) || "#", "_blank");
+      }
+    }
+  });
+};
+// Re-export the design system component with Leybold styling
+var ProductCardDetails = function (_a) {
+  var id = _a.id,
+    imageUrl = _a.imageUrl,
+    title = _a.title,
+    description = _a.description,
+    price = _a.price,
+    code = _a.code,
+    facets = _a.facets,
+    hit = _a.hit,
+    _b = _a.className,
+    className = _b === void 0 ? "" : _b,
+    ProductCardComponent = _a.ProductCardComponent,
+    hidespares = _a.hidespares;
+  // Build the hit object expected by ProductDetailsCard
+  var hitData = hit || {
+    id: id,
+    title: title,
+    description: description,
+    price: price,
+    code: code,
+    image: imageUrl
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles$f.productDetails
+  }, /*#__PURE__*/React.createElement(ProductDetailsCard, {
+    className: "".concat(className),
+    title: title,
+    imageUrl: imageUrl,
+    imageAlt: title,
+    hit: hitData,
+    facets: facets,
+    usePlainClasses: true,
+    ProductCardComponent: ProductCardComponent || SpareCardAdapter,
+    hidespares: hidespares
+  }));
+};
+
+// Adapter component that maps props from AlgoliaDynamicSearchRaw to ProductCardHorizontal
+// AlgoliaDynamicSearchRaw passes: title, cardLink, productPrice, cta, hit (original data)
+var ProductCardAdapter = function (props) {
+  var hit = props.hit,
+    title = props.title,
+    cardLink = props.cardLink,
+    productPrice = props.productPrice,
+    cta = props.cta,
+    showProductPrice = props.showProductPrice,
+    className = props.className,
+    code = props.code;
+  console.log(props);
+  // Get values from direct props or fallback to hit object
+  var url = cardLink || (hit === null || hit === void 0 ? void 0 : hit.link) || "#";
+  var imageUrl = "";
+  var price = showProductPrice ? productPrice || (hit === null || hit === void 0 ? void 0 : hit.price) || "" : "";
+  var productTitle = title || (hit === null || hit === void 0 ? void 0 : hit.title) || "";
+  var productCode = code || (hit === null || hit === void 0 ? void 0 : hit.code) || "";
+  var buttonLabel = cta || "View Product";
+  return /*#__PURE__*/React.createElement(ProductCardHorizontalParts, {
+    imageUrl: imageUrl,
+    url: url,
+    title: productTitle,
+    description: productCode,
+    price: price,
+    button: {
+      label: buttonLabel,
+      onClick: function () {
+        return window.open(url, "_blank");
+      }
+    },
+    className: className
+  });
+};
+var ProductCardDetailsAdapter = function (props) {
+  var hit = props.hit,
+    title = props.title;
+    props.cardLink;
+    var productPrice = props.productPrice;
+    props.cta;
+    props.showProductPrice;
+    var className = props.className,
+    code = props.code,
+    facets = props.facets,
+    related_products = props.related_products,
+    hidespares = props.hidespares;
+  if (!title) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(ProductCardDetails, {
+    imageUrl: (hit === null || hit === void 0 ? void 0 : hit.image) || "",
+    title: title,
+    description: (hit === null || hit === void 0 ? void 0 : hit.description) || "",
+    price: (hit === null || hit === void 0 ? void 0 : hit.price) || "" || productPrice,
+    code: (hit === null || hit === void 0 ? void 0 : hit.code) || "" || code,
+    hit: hit,
+    className: className,
+    facets: facets,
+    relatedProducts: (hit === null || hit === void 0 ? void 0 : hit.related_products) || related_products,
+    hidespares: hidespares
+  });
+};
+var AlgoliaDynamicSearchLeybold = function (props) {
+  var innerComponents = {
+    ProductCard: ProductCardAdapter,
+    ProductDetailsCard: ProductCardDetailsAdapter
+  };
+  return /*#__PURE__*/React.createElement(AlgoliaDynamicSearchRaw, _extends({}, props, {
+    innerComponents: innerComponents
+  }));
+};
+
+var QrFormButtonAdapter = function (_a) {
+  var label = _a.label,
+    onClick = _a.onClick,
+    _b = _a.buttonStyle,
+    buttonStyle = _b === void 0 ? "primary" : _b,
+    href = _a.href,
+    target = _a.target,
+    _c = _a.type,
+    type = _c === void 0 ? "button" : _c,
+    element = _a.element,
+    pageTarget = _a["data-page_target"],
+    className = _a.className;
+  // Map buttonStyle to our variant
+  var variant = buttonStyle === "secondary" ? "secondary" : "primary";
+  // If it's an anchor element (has href or element='a'), render as link
+  if (element === "a" || href) {
+    return /*#__PURE__*/React.createElement("a", {
+      href: href,
+      target: target,
+      className: className,
+      "data-page_target": pageTarget,
+      onClick: onClick,
+      style: {
+        display: "inline-block",
+        textDecoration: "none"
+      }
+    }, /*#__PURE__*/React.createElement(Button, {
+      variant: variant,
+      type: type,
+      size: "small"
+    }, label));
+  }
+  // Otherwise render as button
+  return /*#__PURE__*/React.createElement(Button, {
+    variant: variant,
+    type: type,
+    onClick: onClick ? function (e) {
+      return onClick(e);
+    } : undefined,
+    className: className,
+    "data-page_target": pageTarget,
+    size: "small"
+  }, label);
+};
+var QrFormLeybold = function (props) {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "qr-journey-form-wrapper"
+  }, /*#__PURE__*/React.createElement(QrForm, _extends({}, props, {
+    ButtonComponent: QrFormButtonAdapter
+  })));
+};
+
+var styles$e = {"overlay":"SearchModal-module__overlay___Vbvg9","modal":"SearchModal-module__modal___1k5gO","closeButton":"SearchModal-module__closeButton___AN0zt","closeButton__icon":"SearchModal-module__closeButton__icon___vISSw","closeButton__text":"SearchModal-module__closeButton__text___-4EH1","closeButtonDesktop":"SearchModal-module__closeButtonDesktop___Lxxb0","closeButtonMobile":"SearchModal-module__closeButtonMobile___WIIMS","stickyHeader":"SearchModal-module__stickyHeader___wp-gA","scrollableContent":"SearchModal-module__scrollableContent___lrZP3"};
+
+var ModalCloseButton = function (_a) {
+  var onClick = _a.onClick,
+    _b = _a.ariaLabel,
+    ariaLabel = _b === void 0 ? 'Close search' : _b,
+    _c = _a.className,
+    className = _c === void 0 ? '' : _c;
+  return /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onClick,
+    "aria-label": ariaLabel,
+    className: "".concat(styles$e.closeButton, " ").concat(className)
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles$e.closeButton__icon
+  }, /*#__PURE__*/React.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("line", {
+    x1: "18",
+    y1: "6",
+    x2: "6",
+    y2: "18"
+  }), /*#__PURE__*/React.createElement("line", {
+    x1: "6",
+    y1: "6",
+    x2: "18",
+    y2: "18"
+  }))), /*#__PURE__*/React.createElement("span", {
+    className: styles$e.closeButton__text
+  }, "CLOSE X"));
+};
+
+var SearchModal = function (_a) {
+  var isOpen = _a.isOpen,
+    onClose = _a.onClose,
+    _b = _a.title,
+    title = _b === void 0 ? 'Search' : _b,
+    children = _a.children,
+    _c = _a.className,
+    className = _c === void 0 ? '' : _c,
+    stickyHeaderContent = _a.stickyHeaderContent;
+  var modalRef = useRef(null);
+  var previouslyFocusedElement = useRef(null);
+  useEffect(function () {
+    if (isOpen) {
+      // Store the previously focused element
+      previouslyFocusedElement.current = document.activeElement;
+      // Focus the modal
+      if (modalRef.current) {
+        modalRef.current.focus();
+      }
+      // Prevent body scroll
+      document.body.style.overflow = 'hidden';
+    } else {
+      // Restore body scroll
+      document.body.style.overflow = '';
+      // Return focus to previously focused element
+      if (previouslyFocusedElement.current) {
+        previouslyFocusedElement.current.focus();
+      }
+    }
+    return function () {
+      document.body.style.overflow = '';
+    };
+  }, [isOpen]);
+  useEffect(function () {
+    var handleEscape = function (event) {
+      if (event.key === 'Escape' && isOpen) {
+        onClose();
+      }
+    };
+    document.addEventListener('keydown', handleEscape);
+    return function () {
+      return document.removeEventListener('keydown', handleEscape);
+    };
+  }, [isOpen, onClose]);
+  // Focus trap implementation
+  useEffect(function () {
+    if (!isOpen || !modalRef.current) return;
+    var modal = modalRef.current;
+    var focusableElements = modal.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
+    var firstElement = focusableElements[0];
+    var lastElement = focusableElements[focusableElements.length - 1];
+    var handleTab = function (event) {
+      if (event.key !== 'Tab') return;
+      if (event.shiftKey) {
+        // Shift + Tab
+        if (document.activeElement === firstElement) {
+          event.preventDefault();
+          lastElement === null || lastElement === void 0 ? void 0 : lastElement.focus();
+        }
+      } else {
+        // Tab
+        if (document.activeElement === lastElement) {
+          event.preventDefault();
+          firstElement === null || firstElement === void 0 ? void 0 : firstElement.focus();
+        }
+      }
+    };
+    modal.addEventListener('keydown', handleTab);
+    return function () {
+      return modal.removeEventListener('keydown', handleTab);
+    };
+  }, [isOpen]);
+  if (!isOpen) return null;
+  var handleOverlayClick = function (event) {
+    if (event.target === event.currentTarget) {
+      onClose();
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles$e.overlay,
+    onClick: handleOverlayClick,
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("div", {
+    ref: modalRef,
+    role: "dialog",
+    "aria-modal": "true",
+    "aria-label": title,
+    tabIndex: -1,
+    className: "".concat(styles$e.modal, " ").concat(className)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$e.stickyHeader
+  }, /*#__PURE__*/React.createElement(ModalCloseButton, {
+    onClick: onClose,
+    className: styles$e.closeButtonMobile
+  }), stickyHeaderContent), /*#__PURE__*/React.createElement("div", {
+    className: styles$e.scrollableContent
+  }, /*#__PURE__*/React.createElement(ModalCloseButton, {
+    onClick: onClose,
+    className: styles$e.closeButtonDesktop
+  }), children)));
+};
+
+var styles$d = {"searchBar":"SearchBar-module__searchBar___5ak1g","inputWrapper":"SearchBar-module__inputWrapper___-4wrM","searchIcon":"SearchBar-module__searchIcon___VAuDz","searchInput":"SearchBar-module__searchInput___1K4GN","clearButton":"SearchBar-module__clearButton___JQYg-","submitButton":"SearchBar-module__submitButton___DZWsQ","submitButton__text":"SearchBar-module__submitButton__text___WkUsL","submitButton__icon":"SearchBar-module__submitButton__icon___s-ltv"};
+
+var SearchIcon = function (_a) {
+  var _b = _a.className,
+    className = _b === void 0 ? '' : _b;
+  return /*#__PURE__*/React.createElement("svg", {
+    className: "".concat(styles$d.searchIcon, " ").concat(className),
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("circle", {
+    cx: "11",
+    cy: "11",
+    r: "8"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "m21 21-4.35-4.35"
+  }));
+};
+
+var SearchInput = function (_a) {
+  var value = _a.value,
+    onChange = _a.onChange,
+    onKeyDown = _a.onKeyDown,
+    _b = _a.placeholder,
+    placeholder = _b === void 0 ? 'Discover products, innovations, and resources...' : _b,
+    _c = _a.autoFocus,
+    autoFocus = _c === void 0 ? false : _c,
+    _d = _a.className,
+    className = _d === void 0 ? '' : _d;
+  var handleChange = function (event) {
+    onChange(event.target.value);
+  };
+  return /*#__PURE__*/React.createElement("input", {
+    type: "text",
+    value: value,
+    onChange: handleChange,
+    onKeyDown: onKeyDown,
+    placeholder: placeholder,
+    autoFocus: autoFocus,
+    "aria-label": "Search",
+    className: "".concat(styles$d.searchInput, " ").concat(className)
+  });
+};
+
+var SearchSubmitButton = function (_a) {
+  var onClick = _a.onClick,
+    _b = _a.disabled,
+    disabled = _b === void 0 ? false : _b,
+    _c = _a.ariaLabel,
+    ariaLabel = _c === void 0 ? 'Search' : _c,
+    _d = _a.label,
+    label = _d === void 0 ? 'Search' : _d;
+    _a.variant;
+    var _f = _a.className,
+    className = _f === void 0 ? '' : _f;
+  return /*#__PURE__*/React.createElement("button", {
+    type: "submit",
+    onClick: onClick,
+    disabled: disabled,
+    "aria-label": ariaLabel,
+    className: "".concat(styles$d.submitButton, " ").concat(className)
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles$d.submitButton__text
+  }, label), /*#__PURE__*/React.createElement("span", {
+    className: styles$d.submitButton__icon
+  }, /*#__PURE__*/React.createElement(SearchIcon, null)));
+};
+
+var SearchBar = function (_a) {
+  var value = _a.value,
+    onChange = _a.onChange,
+    onSubmit = _a.onSubmit,
+    placeholder = _a.placeholder,
+    _b = _a.autoFocus,
+    autoFocus = _b === void 0 ? false : _b,
+    _c = _a.className,
+    className = _c === void 0 ? '' : _c,
+    _d = _a.variant,
+    variant = _d === void 0 ? 'instant' : _d;
+  var handleSubmit = function (event) {
+    event.preventDefault();
+    onSubmit();
+  };
+  var handleKeyDown = function (event) {
+    if (event.key === 'Enter') {
+      event.preventDefault();
+      onSubmit();
+    }
+  };
+  var handleClear = function () {
+    onChange('');
+  };
+  var showClearButton = value.length > 0;
+  return /*#__PURE__*/React.createElement("form", {
+    onSubmit: handleSubmit,
+    className: "".concat(styles$d.searchBar, " ").concat(className)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$d.inputWrapper
+  }, /*#__PURE__*/React.createElement(SearchIcon, null), /*#__PURE__*/React.createElement(SearchInput, {
+    value: value,
+    onChange: onChange,
+    onKeyDown: handleKeyDown,
+    placeholder: placeholder,
+    autoFocus: autoFocus
+  }), showClearButton && /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: handleClear,
+    className: styles$d.clearButton,
+    "aria-label": "Clear search"
+  }, "CLEAR X")), /*#__PURE__*/React.createElement(SearchSubmitButton, {
+    onClick: onSubmit,
+    label: "SEE ALL RESULTS",
+    variant: variant
+  }));
+};
+
+var styles$c = {"contentCard":"ContentCardHorizontal-module__contentCard___l-Kim","contentCard--instant-view":"ContentCardHorizontal-module__contentCard--instant-view___4wK9-","contentExcerpt":"ContentCardHorizontal-module__contentExcerpt___tqg1v","contentCard--results-view":"ContentCardHorizontal-module__contentCard--results-view___oBP2u","contentMeta":"ContentCardHorizontal-module__contentMeta___rEW-X","contentCategory":"ContentCardHorizontal-module__contentCategory___NssVD","contentMetaText":"ContentCardHorizontal-module__contentMetaText___muYBN","contentTitle":"ContentCardHorizontal-module__contentTitle___54gEo"};
+
+var ContentCardHorizontal = function (_a) {
+  _a.id;
+    var title = _a.title,
+    url = _a.url,
+    category = _a.category,
+    meta = _a.meta,
+    excerpt = _a.excerpt,
+    _b = _a.className,
+    className = _b === void 0 ? "" : _b,
+    _c = _a.variant,
+    variant = _c === void 0 ? "instant-view" : _c;
+  var cardClasses = classNames(styles$c.contentCard, styles$c["contentCard--".concat(variant)], className);
+  return /*#__PURE__*/React.createElement("a", {
+    href: url,
+    className: cardClasses,
+    "aria-label": "View content: ".concat(title)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$c.contentMeta
+  }, category && /*#__PURE__*/React.createElement("span", {
+    className: styles$c.contentCategory
+  }, category), meta && /*#__PURE__*/React.createElement("span", {
+    className: styles$c.contentMetaText
+  }, meta)), /*#__PURE__*/React.createElement("h3", {
+    className: styles$c.contentTitle
+  }, title), excerpt && /*#__PURE__*/React.createElement("p", {
+    className: styles$c.contentExcerpt
+  }, excerpt));
+};
+
+var styles$b = {"instantResultsLayout":"InstantResults-module__instantResultsLayout___oy-o4","columnsGrid":"InstantResults-module__columnsGrid___bHRUM","resultsColumn":"InstantResults-module__resultsColumn___ZBSlT","columnHeader":"InstantResults-module__columnHeader___VYYhi","showingText":"InstantResults-module__showingText___lECiA","seeAllButton":"InstantResults-module__seeAllButton___xEDAX","chevronIcon":"InstantResults-module__chevronIcon___bjb3q","resultsList":"InstantResults-module__resultsList___7s3PT","divider":"InstantResults-module__divider___Ky6zK","loadingState":"InstantResults-module__loadingState___l0fMq","errorState":"InstantResults-module__errorState___hTBbE","spinner":"InstantResults-module__spinner___85jF-"};
+
+var FederatedInstantResultsLayout = function (_a) {
+  _a.query;
+    var products = _a.products,
+    contents = _a.contents,
+    isLoadingProducts = _a.isLoadingProducts,
+    isLoadingContents = _a.isLoadingContents,
+    productsError = _a.productsError,
+    contentsError = _a.contentsError,
+    onSeeAllProducts = _a.onSeeAllProducts,
+    onSeeAllContents = _a.onSeeAllContents;
+    _a.onSeeAllCombined;
+  products.length + contents.length;
+  // Show first 3 results from each category
+  var displayProducts = products.slice(0, 3);
+  var displayContents = contents.slice(0, 3);
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles$b.instantResultsLayout
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$b.columnsGrid
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$b.resultsColumn
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$b.columnHeader
+  }, /*#__PURE__*/React.createElement("p", {
+    className: styles$b.showingText
+  }, "SHOWING ", displayProducts.length, " OF ", products.length, " RESULTS"), /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: styles$b.seeAllButton,
+    onClick: onSeeAllProducts
+  }, /*#__PURE__*/React.createElement("svg", {
+    className: styles$b.chevronIcon,
+    width: "12",
+    height: "6",
+    viewBox: "0 0 12 6",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M1 1L6 5L11 1",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), /*#__PURE__*/React.createElement("span", null, "See all products"))), isLoadingProducts ? /*#__PURE__*/React.createElement("div", {
+    className: styles$b.loadingState
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$b.spinner,
+    "aria-label": "Loading..."
+  }), /*#__PURE__*/React.createElement("p", null, "Loading products...")) : productsError ? /*#__PURE__*/React.createElement("div", {
+    className: styles$b.errorState
+  }, /*#__PURE__*/React.createElement("p", null, productsError)) : displayProducts.length > 0 ? /*#__PURE__*/React.createElement("div", {
+    className: styles$b.resultsList
+  }, displayProducts.map(function (product, index) {
+    return /*#__PURE__*/React.createElement(React.Fragment, {
+      key: product.id
+    }, /*#__PURE__*/React.createElement(ProductCardHorizontal, product), index < displayProducts.length - 1 && /*#__PURE__*/React.createElement("hr", {
+      className: styles$b.divider
+    }));
+  })) : null), /*#__PURE__*/React.createElement("div", {
+    className: styles$b.resultsColumn
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$b.columnHeader
+  }, /*#__PURE__*/React.createElement("p", {
+    className: styles$b.showingText
+  }, "SHOWING ", displayContents.length, " OF ", contents.length, " RESULTS"), /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: styles$b.seeAllButton,
+    onClick: onSeeAllContents
+  }, /*#__PURE__*/React.createElement("svg", {
+    className: styles$b.chevronIcon,
+    width: "12",
+    height: "6",
+    viewBox: "0 0 12 6",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M1 1L6 5L11 1",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), /*#__PURE__*/React.createElement("span", null, "See all"))), isLoadingContents ? /*#__PURE__*/React.createElement("div", {
+    className: styles$b.loadingState
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$b.spinner,
+    "aria-label": "Loading..."
+  }), /*#__PURE__*/React.createElement("p", null, "Loading content...")) : contentsError ? /*#__PURE__*/React.createElement("div", {
+    className: styles$b.errorState
+  }, /*#__PURE__*/React.createElement("p", null, contentsError)) : displayContents.length > 0 ? /*#__PURE__*/React.createElement("div", {
+    className: styles$b.resultsList
+  }, displayContents.map(function (content, index) {
+    return /*#__PURE__*/React.createElement(React.Fragment, {
+      key: content.id
+    }, /*#__PURE__*/React.createElement(ContentCardHorizontal, _extends({}, content, {
+      variant: "instant-view"
+    })), index < displayContents.length - 1 && /*#__PURE__*/React.createElement("hr", {
+      className: styles$b.divider
+    }));
+  })) : null)));
+};
+
+var styles$a = {"resultsCount":"ResultsCount-module__resultsCount___cNM6f"};
+
+var ResultsCount = function (_a) {
+  var count = _a.count,
+    type = _a.type,
+    _b = _a.className,
+    className = _b === void 0 ? '' : _b;
+  var label = count === 1 ? type.slice(0, -1) : type;
+  return /*#__PURE__*/React.createElement("span", {
+    className: "".concat(styles$a.resultsCount, " ").concat(className)
+  }, count, " ", label);
+};
+
+var styles$9 = {"seeAllButton":"SeeAllLinkButton-module__seeAllButton___eAQqJ"};
+
+var SeeAllLinkButton = function (_a) {
+  var onClick = _a.onClick,
+    _b = _a.label,
+    label = _b === void 0 ? 'See all results' : _b,
+    _c = _a.className,
+    className = _c === void 0 ? '' : _c;
+  return /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onClick,
+    className: "".concat(styles$9.seeAllButton, " ").concat(className)
+  }, label, /*#__PURE__*/React.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("polyline", {
+    points: "9 18 15 12 9 6"
+  })));
+};
+
+var styles$8 = {"resultsColumn":"ResultsColumn-module__resultsColumn___AexF5","columnHeader":"ResultsColumn-module__columnHeader___-aUWU","columnTitle":"ResultsColumn-module__columnTitle___Gddr-","resultsList":"ResultsColumn-module__resultsList___BkEie","columnFooter":"ResultsColumn-module__columnFooter___4zJUp","loadingState":"ResultsColumn-module__loadingState___wme5F","errorState":"ResultsColumn-module__errorState___NI4fW","emptyState":"ResultsColumn-module__emptyState___tvefj","spinner":"ResultsColumn-module__spinner___hhntn"};
+
+var ResultsColumn = function (_a) {
+  var title = _a.title,
+    count = _a.count,
+    isLoading = _a.isLoading,
+    error = _a.error,
+    onSeeAll = _a.onSeeAll,
+    children = _a.children,
+    _b = _a.className,
+    className = _b === void 0 ? '' : _b;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$8.resultsColumn, " ").concat(className)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$8.columnHeader
+  }, /*#__PURE__*/React.createElement("h3", {
+    className: styles$8.columnTitle
+  }, title), !isLoading && !error && count > 0 && /*#__PURE__*/React.createElement(ResultsCount, {
+    count: count,
+    type: title.toLowerCase().includes('product') ? 'products' : 'content'
+  })), isLoading && /*#__PURE__*/React.createElement("div", {
+    className: styles$8.loadingState
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$8.spinner,
+    "aria-label": "Loading..."
+  }), /*#__PURE__*/React.createElement("p", null, "Loading ", title.toLowerCase(), "...")), error && /*#__PURE__*/React.createElement("div", {
+    className: styles$8.errorState
+  }, /*#__PURE__*/React.createElement("p", null, error)), !isLoading && !error && count === 0 && /*#__PURE__*/React.createElement("div", {
+    className: styles$8.emptyState
+  }, /*#__PURE__*/React.createElement("p", null, "No ", title.toLowerCase(), " found")), !isLoading && !error && count > 0 && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: styles$8.resultsList
+  }, children), /*#__PURE__*/React.createElement("div", {
+    className: styles$8.columnFooter
+  }, /*#__PURE__*/React.createElement(SeeAllLinkButton, {
+    onClick: onSeeAll,
+    label: "See all ".concat(title.toLowerCase())
+  }))));
+};
+
+var styles$7 = {"filtersPanel":"Filters-module__filtersPanel___T3SlK","filtersList":"Filters-module__filtersList___jPgkP","filterAccordion":"Filters-module__filterAccordion___Mf9Oe","accordionHeader":"Filters-module__accordionHeader___DtPJx","accordionTitle":"Filters-module__accordionTitle___YtHXW","accordionIcon":"Filters-module__accordionIcon___zRGrv","accordionIconExpanded":"Filters-module__accordionIconExpanded___pkkjv","accordionContent":"Filters-module__accordionContent___SqhIu","accordionSearch":"Filters-module__accordionSearch___V0A74","filterSearch":"Filters-module__filterSearch___Jc8AX","searchIcon":"Filters-module__searchIcon___pas1t","searchInput":"Filters-module__searchInput___nzOMK","clearButton":"Filters-module__clearButton___tHl6L","filterList":"Filters-module__filterList___TLqBu","filterItem":"Filters-module__filterItem___lA2rv","filterCheckboxInput":"Filters-module__filterCheckboxInput___NAcGz","filterCheckbox":"Filters-module__filterCheckbox___9In3q","filterLabel":"Filters-module__filterLabel___w-M8J","filterCount":"Filters-module__filterCount___XMsmy","filterItemMobile":"Filters-module__filterItemMobile___bqRMi","filterItemMobileRefined":"Filters-module__filterItemMobileRefined___VnLfK","filterItemDesktopNoCheckbox":"Filters-module__filterItemDesktopNoCheckbox___rX7Vy","filterItemDesktopRefined":"Filters-module__filterItemDesktopRefined___XaVGp","noResults":"Filters-module__noResults___ZdZ4V","loadingState":"Filters-module__loadingState___k6olr","spinner":"Filters-module__spinner___hvTaP","appliedFilters":"Filters-module__appliedFilters___hP4x-","appliedFiltersTitle":"Filters-module__appliedFiltersTitle___k6VbJ","appliedFiltersList":"Filters-module__appliedFiltersList___-fx9D","appliedFilterTag":"Filters-module__appliedFilterTag___hd5yc","tagLabel":"Filters-module__tagLabel___0ImQk","tagRemoveButton":"Filters-module__tagRemoveButton___JaA8M"};
+
+/*!
+ * Font Awesome Pro 6.7.2 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license (Commercial License)
+ * Copyright 2024 Fonticons, Inc.
+ */
+const faMagnifyingGlass = {
+  prefix: 'fal',
+  iconName: 'magnifying-glass',
+  icon: [512, 512, [128269, "search"], "f002", "M384 208A176 176 0 1 0 32 208a176 176 0 1 0 352 0zM343.3 366C307 397.2 259.7 416 208 416C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208c0 51.7-18.8 99-50 135.3L507.3 484.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0L343.3 366z"]
+};
+const faXmark = {
+  prefix: 'fal',
+  iconName: 'xmark',
+  icon: [384, 512, [128473, 10005, 10006, 10060, 215, "close", "multiply", "remove", "times"], "f00d", "M324.5 411.1c6.2 6.2 16.4 6.2 22.6 0s6.2-16.4 0-22.6L214.6 256 347.1 123.5c6.2-6.2 6.2-16.4 0-22.6s-16.4-6.2-22.6 0L192 233.4 59.6 100.9c-6.2-6.2-16.4-6.2-22.6 0s-6.2 16.4 0 22.6L169.4 256 36.9 388.5c-6.2 6.2-6.2 16.4 0 22.6s16.4 6.2 22.6 0L192 278.6 324.5 411.1z"]
+};
+
+/**
+ * FilterSearch - Search input for filtering facet values
+ */
+var FilterSearch = function (_a) {
+  var value = _a.value,
+    onChange = _a.onChange,
+    _b = _a.placeholder,
+    placeholder = _b === void 0 ? "Search" : _b,
+    className = _a.className;
+  var handleChange = function (e) {
+    onChange(e.target.value);
+  };
+  var handleClear = function () {
+    onChange("");
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$7.filterSearch, " ").concat(className || "")
+  }, !value && /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faMagnifyingGlass,
+    className: styles$7.searchIcon,
+    "aria-hidden": "true"
+  }), /*#__PURE__*/React.createElement("input", {
+    type: "text",
+    value: value,
+    onChange: handleChange,
+    placeholder: placeholder,
+    className: styles$7.searchInput,
+    "aria-label": placeholder
+  }), value && /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: handleClear,
+    className: styles$7.clearButton,
+    "aria-label": "Clear search"
+  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faXmark$1
+  })));
+};
+
+var CheckIcon = function () {
+  return /*#__PURE__*/React.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "9",
+    height: "7",
+    viewBox: "0 0 9 7",
+    fill: "none"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M8.73456 0.104504C9.02185 0.279451 9.08614 0.615889 8.8772 0.856441L3.7342 6.77774C3.62371 6.90558 3.45294 6.98465 3.2641 6.99811C3.07525 7.01156 2.89244 6.95269 2.75984 6.84166L0.188342 4.68846C-0.0627808 4.47819 -0.0627808 4.13671 0.188342 3.92643C0.439465 3.71616 0.847289 3.71616 1.09841 3.92643L3.13753 5.63385L7.83856 0.222257C8.04749 -0.0182957 8.44929 -0.0721258 8.73658 0.102822L8.73456 0.104504Z",
+    fill: "#E2001A"
+  }));
+};
+/**
+ * FilterItem - Individual facet item with checkbox and count
+ */
+var FilterItem = function (_a) {
+  var value = _a.value,
+    onToggle = _a.onToggle,
+    className = _a.className,
+    _b = _a.variant,
+    variant = _b === void 0 ? 'desktop' : _b,
+    _c = _a.showCheckbox,
+    showCheckbox = _c === void 0 ? true : _c;
+  var handleChange = function () {
+    onToggle(value.value);
+  };
+  var handleKeyDown = function (e) {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      onToggle(value.value);
+    }
+  };
+  // Mobile variant: Plain button (no checkbox)
+  if (variant === 'mobile') {
+    return /*#__PURE__*/React.createElement("button", {
+      type: "button",
+      className: "".concat(styles$7.filterItemMobile, " ").concat(value.isRefined ? styles$7.filterItemMobileRefined : '', " ").concat(className || ""),
+      onClick: handleChange,
+      onKeyDown: handleKeyDown,
+      "aria-pressed": value.isRefined
+    }, /*#__PURE__*/React.createElement("span", {
+      className: styles$7.filterLabel
+    }, value.value), value.count > 0 && /*#__PURE__*/React.createElement("span", {
+      className: styles$7.filterCount
+    }, "(", value.count, ")"));
+  }
+  // Desktop without checkbox (Content tab): Plain button with red text when selected
+  if (!showCheckbox) {
+    return /*#__PURE__*/React.createElement("button", {
+      type: "button",
+      className: "".concat(styles$7.filterItemDesktopNoCheckbox, " ").concat(value.isRefined ? styles$7.filterItemDesktopRefined : '', " ").concat(className || ""),
+      onClick: handleChange,
+      onKeyDown: handleKeyDown,
+      "aria-pressed": value.isRefined
+    }, /*#__PURE__*/React.createElement("span", {
+      className: styles$7.filterLabel
+    }, value.value), value.count > 0 && /*#__PURE__*/React.createElement("span", {
+      className: styles$7.filterCount
+    }, "(", value.count, ")"));
+  }
+  // Desktop with checkbox (Products tab): Multi-select checkboxes
+  return /*#__PURE__*/React.createElement("label", {
+    className: "".concat(styles$7.filterItem, " ").concat(className || ""),
+    onKeyDown: handleKeyDown
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "checkbox",
+    checked: value.isRefined,
+    onChange: handleChange,
+    className: styles$7.filterCheckboxInput,
+    "aria-label": "".concat(value.value, " (").concat(value.count, " results)")
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles$7.filterCheckbox
+  }, value.isRefined && /*#__PURE__*/React.createElement(CheckIcon, null)), /*#__PURE__*/React.createElement("span", {
+    className: styles$7.filterLabel
+  }, value.value), /*#__PURE__*/React.createElement("span", {
+    className: styles$7.filterCount
+  }, "(", value.count, ")"));
+};
+
+/**
+ * FilterAccordion - Collapsible facet section with optional search
+ */
+var FilterAccordion = function (_a) {
+  var facet = _a.facet,
+    isExpanded = _a.isExpanded,
+    onToggle = _a.onToggle,
+    onValueToggle = _a.onValueToggle,
+    className = _a.className,
+    _b = _a.variant,
+    variant = _b === void 0 ? 'desktop' : _b,
+    _c = _a.showCheckbox,
+    showCheckbox = _c === void 0 ? true : _c;
+  var _d = useState(""),
+    searchQuery = _d[0],
+    setSearchQuery = _d[1];
+  // Filter facet values based on search query
+  var filteredValues = useMemo(function () {
+    if (!searchQuery.trim()) {
+      return facet.values;
+    }
+    var query = searchQuery.toLowerCase();
+    return facet.values.filter(function (value) {
+      return value.value.toLowerCase().includes(query);
+    });
+  }, [facet.values, searchQuery]);
+  var handleToggle = function () {
+    onToggle();
+    // Clear search when collapsing
+    if (isExpanded) {
+      setSearchQuery("");
+    }
+  };
+  var handleKeyDown = function (e) {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      handleToggle();
+    }
+  };
+  var handleValueToggle = function (value) {
+    onValueToggle(facet.attribute, value);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$7.filterAccordion, " ").concat(className || "")
+  }, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: "".concat(styles$7.accordionHeader, " ").concat(isExpanded ? styles$7.accordionHeaderExpanded : ""),
+    onClick: handleToggle,
+    onKeyDown: handleKeyDown,
+    "aria-expanded": isExpanded,
+    "aria-controls": "accordion-".concat(facet.id)
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles$7.accordionTitle
+  }, facet.label), /*#__PURE__*/React.createElement("svg", {
+    className: "".concat(styles$7.accordionIcon, " ").concat(isExpanded ? styles$7.accordionIconExpanded : ""),
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M4 6L8 10L12 6",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }))), isExpanded && /*#__PURE__*/React.createElement("div", {
+    id: "accordion-".concat(facet.id),
+    className: styles$7.accordionContent
+  }, variant === 'desktop' && facet.searchable && facet.values.length > 5 && /*#__PURE__*/React.createElement("div", {
+    className: styles$7.accordionSearch
+  }, /*#__PURE__*/React.createElement(FilterSearch, {
+    value: searchQuery,
+    onChange: setSearchQuery,
+    placeholder: "Search"
+  })), /*#__PURE__*/React.createElement("div", {
+    className: styles$7.filterList
+  }, filteredValues.length > 0 ? filteredValues.map(function (value) {
+    return /*#__PURE__*/React.createElement(FilterItem, {
+      key: value.value,
+      value: value,
+      onToggle: handleValueToggle,
+      variant: variant,
+      showCheckbox: showCheckbox
+    });
+  }) : /*#__PURE__*/React.createElement("div", {
+    className: styles$7.noResults
+  }, "No results found"))));
+};
+
+/**
+ * AppliedFilterTag - Individual removable filter tag/chip
+ */
+var AppliedFilterTag = function (_a) {
+  var attribute = _a.attribute,
+    value = _a.value,
+    label = _a.label,
+    onRemove = _a.onRemove,
+    className = _a.className;
+  var handleRemove = function () {
+    onRemove(attribute, value);
+  };
+  var handleKeyDown = function (e) {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      handleRemove();
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$7.appliedFilterTag, " ").concat(className || "")
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles$7.tagLabel
+  }, label || value), /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: handleRemove,
+    onKeyDown: handleKeyDown,
+    className: styles$7.tagRemoveButton,
+    "aria-label": "Remove ".concat(label || value, " filter")
+  }, /*#__PURE__*/React.createElement("svg", {
+    width: "10",
+    height: "10",
+    viewBox: "0 0 10 10",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M8 2L2 8M2 2L8 8",
+    stroke: "currentColor",
+    strokeWidth: "1.5",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }))));
+};
+
+/**
+ * AppliedFilters - Shows all active filters as removable tags
+ */
+var AppliedFilters = function (_a) {
+  var facets = _a.facets,
+    onRemove = _a.onRemove;
+    _a.onClearAll;
+    var className = _a.className;
+  // Extract all refined (selected) filters
+  var appliedFilters = useMemo(function () {
+    var filters = [];
+    facets.forEach(function (facet) {
+      facet.values.forEach(function (value) {
+        if (value.isRefined) {
+          filters.push({
+            attribute: facet.attribute,
+            value: value.value,
+            label: value.value,
+            facetLabel: facet.label
+          });
+        }
+      });
+    });
+    return filters;
+  }, [facets]);
+  // Don't render if no filters are applied
+  if (appliedFilters.length === 0) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$7.appliedFilters, " ").concat(className || "")
+  }, /*#__PURE__*/React.createElement("h4", {
+    className: styles$7.appliedFiltersTitle
+  }, "Applied filters"), /*#__PURE__*/React.createElement("div", {
+    className: styles$7.appliedFiltersList
+  }, appliedFilters.map(function (filter) {
+    return /*#__PURE__*/React.createElement(AppliedFilterTag, {
+      key: "".concat(filter.attribute, "-").concat(filter.value),
+      attribute: filter.attribute,
+      value: filter.value,
+      label: filter.label,
+      onRemove: onRemove
+    });
+  })));
+};
+
+/**
+ * FiltersPanel - Main container for all filters
+ *
+ * Fully controlled component - renders based on facets prop.
+ * When facets change (e.g., after API refetch), component re-renders with new data.
+ * Accordion expansion state persists across refetches, with new facets respecting defaultExpanded.
+ */
+var FiltersPanel = function (_a) {
+  var facets = _a.facets,
+    onFacetToggle = _a.onFacetToggle,
+    _b = _a.isLoading,
+    isLoading = _b === void 0 ? false : _b,
+    className = _a.className,
+    _c = _a.variant,
+    variant = _c === void 0 ? 'desktop' : _c,
+    _d = _a.showCheckbox,
+    showCheckbox = _d === void 0 ? true : _d;
+  // Track which accordions are expanded (transient UI state)
+  var _e = useState(function () {
+      // Initialize with default expanded facets
+      var expanded = new Set();
+      facets.forEach(function (facet) {
+        if (facet.defaultExpanded) {
+          expanded.add(facet.id);
+        }
+      });
+      return expanded;
+    }),
+    expandedAccordions = _e[0],
+    setExpandedAccordions = _e[1];
+  // Sync expansion state when facets change (e.g., new facets appear after refetch)
+  useEffect(function () {
+    setExpandedAccordions(function (prev) {
+      var next = new Set(prev);
+      // Add new facets with defaultExpanded
+      facets.forEach(function (facet) {
+        if (facet.defaultExpanded && !next.has(facet.id)) {
+          next.add(facet.id);
+        }
+      });
+      // Remove facets that no longer exist
+      var currentFacetIds = new Set(facets.map(function (f) {
+        return f.id;
+      }));
+      next.forEach(function (id) {
+        if (!currentFacetIds.has(id)) {
+          next.delete(id);
+        }
+      });
+      return next;
+    });
+  }, [facets]);
+  var handleAccordionToggle = useCallback(function (facetId) {
+    setExpandedAccordions(function (prev) {
+      var next = new Set(prev);
+      if (next.has(facetId)) {
+        next.delete(facetId);
+      } else {
+        next.add(facetId);
+      }
+      return next;
+    });
+  }, []);
+  var handleValueToggle = useCallback(function (attribute, value) {
+    onFacetToggle(attribute, value);
+  }, [onFacetToggle]);
+  var handleRemoveFilter = useCallback(function (attribute, value) {
+    onFacetToggle(attribute, value);
+  }, [onFacetToggle]);
+  var handleClearAll = useCallback(function () {
+    // Remove all refined facets
+    facets.forEach(function (facet) {
+      facet.values.forEach(function (value) {
+        if (value.isRefined) {
+          onFacetToggle(facet.attribute, value.value);
+        }
+      });
+    });
+  }, [facets, onFacetToggle]);
+  if (isLoading) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "".concat(styles$7.filtersPanel, " ").concat(className || "")
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles$7.loadingState
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles$7.spinner
+    }), /*#__PURE__*/React.createElement("p", null, "Loading filters...")));
+  }
+  if (!facets || facets.length === 0) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$7.filtersPanel, " ").concat(className || "")
+  }, showCheckbox && /*#__PURE__*/React.createElement(AppliedFilters, {
+    facets: facets,
+    onRemove: handleRemoveFilter,
+    onClearAll: handleClearAll
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles$7.filtersList
+  }, facets.map(function (facet) {
+    return /*#__PURE__*/React.createElement(FilterAccordion, {
+      key: facet.id,
+      facet: facet,
+      isExpanded: expandedAccordions.has(facet.id),
+      onToggle: function () {
+        return handleAccordionToggle(facet.id);
+      },
+      onValueToggle: handleValueToggle,
+      variant: variant,
+      showCheckbox: showCheckbox
+    });
+  })));
+};
+
+var styles$6 = {"productCardVertical":"ProductCardVertical-module__productCardVertical___kXgmt","productCardVertical--hover":"ProductCardVertical-module__productCardVertical--hover___8Nsyp","productCardVertical__button":"ProductCardVertical-module__productCardVertical__button___oQPJG","productCardVertical--focus":"ProductCardVertical-module__productCardVertical--focus___8U57I","productCardVertical__imageWrapper":"ProductCardVertical-module__productCardVertical__imageWrapper___SgKoZ","productCardVertical__image":"ProductCardVertical-module__productCardVertical__image___kg-QU","productCardVertical__content":"ProductCardVertical-module__productCardVertical__content___sZdOs","productCardVertical__title":"ProductCardVertical-module__productCardVertical__title___PPKWb","productCardVertical__description":"ProductCardVertical-module__productCardVertical__description___Ai90p","productCardVertical__footer":"ProductCardVertical-module__productCardVertical__footer___rv6BH"};
+
+/**
+ * ProductCardVertical - Vertical product card for grid layouts
+ *
+ * Used in full results view with 4-column grid (desktop) or 2-column grid (mobile).
+ * Figma spec: Default (no shadow) → Hover (shadow + grey button) → Focus (border + shadow)
+ *
+ * @example
+ * ```tsx
+ * <ProductCardVertical
+ *   title="TURBOVAC i - High vacuum turbopump"
+ *   url="/products/turbovac-i"
+ *   imageUrl="/assets/search-product.png"
+ *   productId="21312VISH"
+ *   description="Premium high-performance turbomolecular pump"
+ *   buttonLabel="BUY ONLINE"
+ * />
+ * ```
+ */
+var ProductCardVertical = function (_a) {
+  var _b;
+  var id = _a.id,
+    title = _a.title,
+    url = _a.url,
+    imageUrl = _a.imageUrl;
+    _a.productId;
+    var description = _a.description,
+    _c = _a.buttonLabel,
+    buttonLabel = _c === void 0 ? 'BUY ONLINE' : _c,
+    onButtonClick = _a.onButtonClick,
+    className = _a.className,
+    _d = _a.variant,
+    variant = _d === void 0 ? 'desktop' : _d,
+    forceState = _a["data-force-state"];
+  var handleButtonClick = function (e) {
+    e.preventDefault(); // Prevent card link navigation
+    e.stopPropagation(); // Stop event bubbling
+    onButtonClick === null || onButtonClick === void 0 ? void 0 : onButtonClick();
+  };
+  var cardClasses = classNames(styles$6.productCardVertical, styles$6["productCardVertical--".concat(variant)], (_b = {}, _b[styles$6['productCardVertical--hover']] = forceState === 'hover', _b[styles$6['productCardVertical--focus']] = forceState === 'focus', _b), className);
+  return /*#__PURE__*/React.createElement("a", {
+    href: url,
+    className: cardClasses,
+    "aria-label": "View product: ".concat(title),
+    "data-product-id": id
+  }, imageUrl && /*#__PURE__*/React.createElement("div", {
+    className: styles$6.productCardVertical__imageWrapper
+  }, /*#__PURE__*/React.createElement(Image, {
+    src: imageUrl,
+    alt: title,
+    className: styles$6.productCardVertical__image,
+    objectFit: "contain",
+    objectPosition: "center",
+    loading: "lazy"
+  })), /*#__PURE__*/React.createElement("div", {
+    className: styles$6.productCardVertical__content
+  }, /*#__PURE__*/React.createElement("h3", {
+    className: styles$6.productCardVertical__title
+  }, title), description && /*#__PURE__*/React.createElement("p", {
+    className: styles$6.productCardVertical__description
+  }, description)), /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: handleButtonClick,
+    className: styles$6.productCardVertical__button,
+    "aria-label": "".concat(buttonLabel, " - ").concat(title),
+    tabIndex: -1
+  }, /*#__PURE__*/React.createElement("span", null, buttonLabel), /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faArrowUpRightFromSquare$1,
+    "aria-hidden": "true"
+  })));
+};
+
+var styles$5 = {"resultsView":"ResultsView-module__resultsView___S4Wh2","searchBarWrapper":"ResultsView-module__searchBarWrapper___XNtwR","tabsContainer":"ResultsView-module__tabsContainer___mB-Q2","tabs":"ResultsView-module__tabs___rOexd","tabSeparator":"ResultsView-module__tabSeparator___MSq9p","mobileFilterButton":"ResultsView-module__mobileFilterButton___ZrMQY","resultsContainer":"ResultsView-module__resultsContainer___J4URa","sidebar":"ResultsView-module__sidebar___nQq5J","assistanceBanner":"ResultsView-module__assistanceBanner___1r72a","mainContent":"ResultsView-module__mainContent___S9eIG","productsGrid":"ResultsView-module__productsGrid___gnAQ-","contentsList":"ResultsView-module__contentsList___tcfNG","contentDivider":"ResultsView-module__contentDivider___5n6sl","resultsList":"ResultsView-module__resultsList___8eYNX","resultsSection":"ResultsView-module__resultsSection___sCUaO","sectionTitle":"ResultsView-module__sectionTitle___mfvH3","loadingState":"ResultsView-module__loadingState___W5YXx","errorState":"ResultsView-module__errorState___UkkG-","emptyState":"ResultsView-module__emptyState___D0Iyn","spinner":"ResultsView-module__spinner___nk8E5","emptyIcon":"ResultsView-module__emptyIcon___fes8T","paginationWrapper":"ResultsView-module__paginationWrapper___mDTyl","searchBarDesktopOnly":"ResultsView-module__searchBarDesktopOnly___dZHUw","tabsContainerDesktopOnly":"ResultsView-module__tabsContainerDesktopOnly___-MQpa"};
+
+var ResultsList = function (_a) {
+  var type = _a.type,
+    _b = _a.products,
+    products = _b === void 0 ? [] : _b,
+    _c = _a.contents,
+    contents = _c === void 0 ? [] : _c,
+    isLoading = _a.isLoading,
+    error = _a.error,
+    _d = _a.className,
+    className = _d === void 0 ? '' : _d;
+  if (isLoading) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "".concat(styles$5.loadingState, " ").concat(className)
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles$5.spinner,
+      "aria-label": "Loading..."
+    }), /*#__PURE__*/React.createElement("p", null, "Loading results..."));
+  }
+  if (error) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "".concat(styles$5.errorState, " ").concat(className)
+    }, /*#__PURE__*/React.createElement("p", null, error));
+  }
+  var hasProducts = products.length > 0;
+  var hasContents = contents.length > 0;
+  var hasResults = hasProducts || hasContents;
+  if (!hasResults) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "".concat(styles$5.emptyState, " ").concat(className)
+    }, /*#__PURE__*/React.createElement("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className: styles$5.emptyIcon
+    }, /*#__PURE__*/React.createElement("circle", {
+      cx: "11",
+      cy: "11",
+      r: "8"
+    }), /*#__PURE__*/React.createElement("path", {
+      d: "m21 21-4.35-4.35"
+    })), /*#__PURE__*/React.createElement("h3", null, "No results found"), /*#__PURE__*/React.createElement("p", null, "Try adjusting your search or filters to find what you're looking for."));
+  }
+  // Render based on type
+  if (type === 'products') {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "".concat(styles$5.productsGrid, " ").concat(className)
+    }, products.map(function (product) {
+      return /*#__PURE__*/React.createElement(ProductCardVertical, _extends({
+        key: product.id
+      }, product, {
+        buttonLabel: "BUY ONLINE"
+      }));
+    }));
+  }
+  if (type === 'content') {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "".concat(styles$5.contentsList, " ").concat(className)
+    }, contents.map(function (content, index) {
+      return /*#__PURE__*/React.createElement(React.Fragment, {
+        key: content.id
+      }, index > 0 && /*#__PURE__*/React.createElement("hr", {
+        className: styles$5.contentDivider
+      }), /*#__PURE__*/React.createElement(ContentCardHorizontal, _extends({}, content, {
+        variant: "results-view"
+      })));
+    }));
+  }
+  // type === 'all' - Show mixed results (not in current Figma design, but keep for compatibility)
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$5.resultsList, " ").concat(className)
+  }, hasProducts && /*#__PURE__*/React.createElement("div", {
+    className: styles$5.resultsSection
+  }, /*#__PURE__*/React.createElement("h3", {
+    className: styles$5.sectionTitle
+  }, "Products (", products.length, ")"), /*#__PURE__*/React.createElement("div", {
+    className: styles$5.productsGrid
+  }, products.map(function (product) {
+    return /*#__PURE__*/React.createElement(ProductCardVertical, _extends({
+      key: product.id
+    }, product, {
+      buttonLabel: "BUY ONLINE"
+    }));
+  }))), hasContents && /*#__PURE__*/React.createElement("div", {
+    className: styles$5.resultsSection
+  }, /*#__PURE__*/React.createElement("h3", {
+    className: styles$5.sectionTitle
+  }, "Content (", contents.length, ")"), /*#__PURE__*/React.createElement("div", {
+    className: styles$5.contentsList
+  }, contents.map(function (content, index) {
+    return /*#__PURE__*/React.createElement(React.Fragment, {
+      key: content.id
+    }, index > 0 && /*#__PURE__*/React.createElement("hr", {
+      className: styles$5.contentDivider
+    }), /*#__PURE__*/React.createElement(ContentCardHorizontal, _extends({}, content, {
+      variant: "results-view"
+    })));
+  }))));
+};
+
+var styles$4 = {"tabButton":"TabButton-module__tabButton___cMU45","tabButton__count":"TabButton-module__tabButton__count___nlS1p","tabButton__label":"TabButton-module__tabButton__label___YGpiC","tabButton__results":"TabButton-module__tabButton__results___Nr6gr","tabButton--desktop":"TabButton-module__tabButton--desktop___fbAaC","tabButton--active":"TabButton-module__tabButton--active___gj6Jp","tabButton--mobile":"TabButton-module__tabButton--mobile___AnLwy"};
+
+/**
+ * TabButton - Tab navigation component with result counts
+ *
+ * Supports two layout variants:
+ * - Desktop: Background colours, top red underline when active, rounded corners
+ * - Mobile: Text-only with bottom border underline when active
+ *
+ * @example
+ * ```tsx
+ * // Desktop variant
+ * <TabButton
+ *   label="WEB SHOP RESULTS"
+ *   count={542}
+ *   isActive={true}
+ *   onClick={() => setActiveTab('products')}
+ *   variant="desktop"
+ * />
+ *
+ * // Mobile variant
+ * <TabButton
+ *   label="WEB SHOP"
+ *   isActive={false}
+ *   onClick={() => setActiveTab('content')}
+ *   variant="mobile"
+ * />
+ * ```
+ */
+var TabButton = function (_a) {
+  var _b;
+  var label = _a.label,
+    count = _a.count,
+    isActive = _a.isActive,
+    onClick = _a.onClick,
+    _c = _a.variant,
+    variant = _c === void 0 ? 'desktop' : _c,
+    className = _a.className;
+  var buttonClasses = classNames(styles$4.tabButton, styles$4["tabButton--".concat(variant)], (_b = {}, _b[styles$4['tabButton--active']] = isActive, _b), className);
+  // Split label to hide " RESULTS" on mobile
+  var labelParts = label.split(' RESULTS');
+  var mainLabel = labelParts[0];
+  var hasResults = labelParts.length > 1;
+  return /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    role: "tab",
+    "aria-selected": isActive,
+    "aria-controls": "tabpanel-".concat(label.toLowerCase().replace(/\s+/g, '-')),
+    onClick: onClick,
+    className: buttonClasses
+  }, count !== undefined && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
+    className: styles$4.tabButton__count
+  }, count), ' '), /*#__PURE__*/React.createElement("span", {
+    className: styles$4.tabButton__label
+  }, mainLabel, hasResults && /*#__PURE__*/React.createElement("span", {
+    className: styles$4.tabButton__results
+  }, " RESULTS")));
+};
+
+var AssistanceIcon = function (props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "87",
+    height: "87",
+    viewBox: "0 0 87 87",
+    fill: "none"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M10.875 4.83247H47.125C50.463 4.83247 53.1667 7.53564 53.1667 10.8731V39.8679C53.1667 43.2053 50.463 45.9085 47.125 45.9085H33.6068C31.6281 45.9085 29.7099 46.6032 28.1844 47.8717L19.3333 55.2412V48.3247C19.3333 46.9958 18.2458 45.9085 16.9167 45.9085H10.875C7.53698 45.9085 4.83333 43.2053 4.83333 39.8679V10.8731C4.83333 7.53564 7.53698 4.83247 10.875 4.83247ZM0 10.8731V39.8679C0 45.8783 4.86354 50.741 10.875 50.741H14.5V60.4059C14.5 61.3422 15.0437 62.203 15.8896 62.5956C16.7354 62.9883 17.7474 62.8675 18.4573 62.2634L31.2807 51.5867C31.9302 51.043 32.7609 50.741 33.6068 50.741H47.125C53.1365 50.741 58 45.8783 58 39.8679V10.8731C58 4.86268 53.1365 0 47.125 0H10.875C4.86354 0 0 4.86268 0 10.8731ZM33.8333 64.0303V58.8958L29 62.9279V64.0454C29 70.0558 33.8635 74.9184 39.875 74.9184H53.3932C54.2391 74.9184 55.0698 75.2205 55.7193 75.7641L68.5427 86.4409C69.2677 87.0449 70.2646 87.1657 71.1104 86.7731C71.9563 86.3804 72.5 85.5197 72.5 84.5834V74.9184H76.125C82.1365 74.9184 87 70.0558 87 64.0454V35.0505C87 29.0401 82.1365 24.1775 76.125 24.1775H65.25V29.0099H76.125C79.463 29.0099 82.1667 31.7131 82.1667 35.0505V64.0454C82.1667 67.3828 79.463 70.086 76.125 70.086H70.0833C68.7542 70.086 67.6667 71.1733 67.6667 72.5022V79.4187L58.8156 72.034C57.2901 70.7655 55.3719 70.0709 53.3932 70.0709H39.875C36.537 70.0709 33.8333 67.3677 33.8333 64.0303ZM29 13.2893C32.1115 13.2893 34.6188 15.8112 34.6188 18.907C34.6188 21.5951 32.9573 22.9844 31.1146 23.815C28.8943 24.8117 26.5682 27.0618 26.5682 30.203C26.5682 31.5319 27.6557 32.6192 28.9849 32.6192C30.3141 32.6192 31.4016 31.5319 31.4016 30.203C31.4016 29.6291 31.9151 28.7532 33.0781 28.2247C35.7667 27.0165 39.437 24.3134 39.437 18.907C39.437 13.1383 34.7547 8.45683 28.9849 8.45683C23.2151 8.45683 18.5328 13.1383 18.5328 18.907C18.5328 20.236 19.6203 21.3233 20.9495 21.3233C22.2786 21.3233 23.3661 20.236 23.3661 18.907C23.3813 15.8112 25.8885 13.2893 29 13.2893ZM32.0208 39.8679C32.0208 38.2067 30.6615 36.8476 29 36.8476C27.3385 36.8476 25.9792 38.2067 25.9792 39.8679C25.9792 41.5291 27.3385 42.8882 29 42.8882C30.6615 42.8882 32.0208 41.5291 32.0208 39.8679Z",
+    fill: "#39788E"
+  }));
+};
+
+var styles$3 = {"assistanceBanner":"AssistanceBanner-module__assistanceBanner___b97es","assistanceBanner__icon":"AssistanceBanner-module__assistanceBanner__icon___8NzJj","assistanceBanner__title":"AssistanceBanner-module__assistanceBanner__title___Wtkkt","assistanceBanner__description":"AssistanceBanner-module__assistanceBanner__description___AjoOr","assistanceBanner__link":"AssistanceBanner-module__assistanceBanner__link___5L45N","assistanceBanner__chevron":"AssistanceBanner-module__assistanceBanner__chevron___4km-f"};
+
+/**
+ * AssistanceBanner - Help widget for search sidebar
+ *
+ * Displays a call-to-action for users who need assistance finding products.
+ * Features chat icon, heading, description, and contact link with chevron.
+ *
+ * Desktop only - hidden on mobile to save space.
+ *
+ * @example
+ * ```tsx
+ * <AssistanceBanner
+ *   title="Need Assistance?"
+ *   description="Can't find what you're looking for? Our team is ready to help."
+ *   linkText="Contact support"
+ *   linkUrl="/contact"
+ * />
+ * ```
+ */
+var AssistanceBanner = function (_a) {
+  var _b = _a.title,
+    title = _b === void 0 ? 'Need Assistance?' : _b,
+    _c = _a.description,
+    description = _c === void 0 ? "Can't find what you're looking for? Our team is ready to help." : _c,
+    _d = _a.linkText,
+    linkText = _d === void 0 ? 'Contact support' : _d,
+    _e = _a.linkUrl,
+    linkUrl = _e === void 0 ? '/contact' : _e,
+    onLinkClick = _a.onLinkClick,
+    className = _a.className;
+  var handleLinkClick = function (e) {
+    if (onLinkClick) {
+      e.preventDefault();
+      onLinkClick();
+    }
+  };
+  var bannerClasses = classNames(styles$3.assistanceBanner, className);
+  return /*#__PURE__*/React.createElement("div", {
+    className: bannerClasses
+  }, /*#__PURE__*/React.createElement(AssistanceIcon, {
+    className: styles$3.assistanceBanner__icon,
+    "aria-hidden": "true"
+  }), /*#__PURE__*/React.createElement("h3", {
+    className: styles$3.assistanceBanner__title
+  }, title), /*#__PURE__*/React.createElement("p", {
+    className: styles$3.assistanceBanner__description
+  }, description), /*#__PURE__*/React.createElement("a", {
+    href: linkUrl,
+    onClick: onLinkClick ? handleLinkClick : undefined,
+    className: styles$3.assistanceBanner__link
+  }, /*#__PURE__*/React.createElement("span", null, linkText), /*#__PURE__*/React.createElement("svg", {
+    className: styles$3.assistanceBanner__chevron,
+    width: "12",
+    height: "6",
+    viewBox: "0 0 12 6",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M1 1L6 5L11 1",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }))));
+};
+
+var styles$2 = {"drawerOverlay":"FilterDrawer-module__drawerOverlay___P6M4y","drawerOverlay--open":"FilterDrawer-module__drawerOverlay--open___blJZo","drawerPanel":"FilterDrawer-module__drawerPanel___35h-U","drawerPanel--open":"FilterDrawer-module__drawerPanel--open___Fw1SY","drawerCloseButton":"FilterDrawer-module__drawerCloseButton___cfMmf","drawerContent":"FilterDrawer-module__drawerContent___KBff6"};
+
+/**
+ * FilterDrawer - Mobile slide-in filter panel
+ *
+ * Slides in from the right with a dark overlay. Used on mobile to show filters
+ * when screen space is limited. Includes focus trap, escape key handling, and
+ * body scroll prevention.
+ *
+ * Desktop: Hidden (filters shown in sidebar)
+ * Mobile: Slide-in drawer overlay
+ *
+ * @example
+ * ```tsx
+ * <FilterDrawer
+ *   isOpen={isFilterDrawerOpen}
+ *   onClose={() => setIsFilterDrawerOpen(false)}
+ * >
+ *   <FiltersPanel facets={facets} onFacetToggle={handleToggle} />
+ * </FilterDrawer>
+ * ```
+ */
+var FilterDrawer = function (_a) {
+  var _b, _c;
+  var isOpen = _a.isOpen,
+    onClose = _a.onClose,
+    children = _a.children,
+    className = _a.className;
+  var drawerRef = useRef(null);
+  var previouslyFocusedElement = useRef(null);
+  // Focus management
+  useEffect(function () {
+    if (isOpen) {
+      // Store previously focused element
+      previouslyFocusedElement.current = document.activeElement;
+      // Focus the drawer
+      if (drawerRef.current) {
+        drawerRef.current.focus();
+      }
+      // Prevent body scroll
+      document.body.style.overflow = 'hidden';
+    } else {
+      // Restore body scroll
+      document.body.style.overflow = '';
+      // Return focus to previously focused element
+      if (previouslyFocusedElement.current) {
+        previouslyFocusedElement.current.focus();
+      }
+    }
+    return function () {
+      document.body.style.overflow = '';
+    };
+  }, [isOpen]);
+  // Escape key handler
+  useEffect(function () {
+    var handleEscape = function (event) {
+      if (event.key === 'Escape' && isOpen) {
+        onClose();
+      }
+    };
+    document.addEventListener('keydown', handleEscape);
+    return function () {
+      return document.removeEventListener('keydown', handleEscape);
+    };
+  }, [isOpen, onClose]);
+  // Focus trap implementation
+  useEffect(function () {
+    if (!isOpen || !drawerRef.current) return;
+    var drawer = drawerRef.current;
+    var focusableElements = drawer.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
+    var firstElement = focusableElements[0];
+    var lastElement = focusableElements[focusableElements.length - 1];
+    var handleTab = function (event) {
+      if (event.key !== 'Tab') return;
+      if (event.shiftKey) {
+        // Shift + Tab
+        if (document.activeElement === firstElement) {
+          event.preventDefault();
+          lastElement === null || lastElement === void 0 ? void 0 : lastElement.focus();
+        }
+      } else {
+        // Tab
+        if (document.activeElement === lastElement) {
+          event.preventDefault();
+          firstElement === null || firstElement === void 0 ? void 0 : firstElement.focus();
+        }
+      }
+    };
+    drawer.addEventListener('keydown', handleTab);
+    return function () {
+      return drawer.removeEventListener('keydown', handleTab);
+    };
+  }, [isOpen]);
+  if (!isOpen) return null;
+  var handleOverlayClick = function (event) {
+    if (event.target === event.currentTarget) {
+      onClose();
+    }
+  };
+  var overlayClasses = classNames(styles$2.drawerOverlay, (_b = {}, _b[styles$2['drawerOverlay--open']] = isOpen, _b));
+  var panelClasses = classNames(styles$2.drawerPanel, (_c = {}, _c[styles$2['drawerPanel--open']] = isOpen, _c), className);
+  return /*#__PURE__*/React.createElement("div", {
+    className: overlayClasses,
+    onClick: handleOverlayClick,
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onClose,
+    "aria-label": "Close filters",
+    className: styles$2.drawerCloseButton
+  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faXmark
+  })), /*#__PURE__*/React.createElement("div", {
+    ref: drawerRef,
+    role: "dialog",
+    "aria-modal": "true",
+    "aria-label": "Filter options",
+    tabIndex: -1,
+    className: panelClasses
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$2.drawerContent
+  }, children)));
+};
+
+var FederatedResultsView = function (_a) {
+  var query = _a.query,
+    onQueryChange = _a.onQueryChange,
+    onSearchSubmit = _a.onSearchSubmit,
+    activeTab = _a.activeTab,
+    onTabChange = _a.onTabChange,
+    products = _a.products,
+    contents = _a.contents,
+    isLoadingProducts = _a.isLoadingProducts,
+    isLoadingContents = _a.isLoadingContents,
+    productsError = _a.productsError,
+    contentsError = _a.contentsError,
+    currentPage = _a.currentPage,
+    totalPages = _a.totalPages,
+    onPageChange = _a.onPageChange,
+    facets = _a.facets,
+    onFacetToggle = _a.onFacetToggle,
+    isFilterDrawerOpen = _a.isFilterDrawerOpen,
+    onFilterDrawerToggle = _a.onFilterDrawerToggle,
+    onFilterDrawerClose = _a.onFilterDrawerClose;
+  var isLoading = activeTab === "products" && isLoadingProducts || activeTab === "content" && isLoadingContents;
+  var error = activeTab === "products" ? productsError : contentsError;
+  // Filter results based on active tab
+  var displayProducts = activeTab === "content" ? [] : products;
+  var displayContents = activeTab === "products" ? [] : contents;
+  // Content tab single-select handler (clears all others when selecting)
+  var handleContentCategorySelect = useCallback(function (attribute, value) {
+    var facet = facets.find(function (f) {
+      return f.attribute === attribute;
+    });
+    if (!facet) return;
+    // Clear ALL values in this facet first
+    facet.values.forEach(function (v) {
+      if (v.isRefined) {
+        onFacetToggle(attribute, v.value); // Unselect
+      }
+    });
+    // Then select the clicked value (if not already selected)
+    var clickedValue = facet.values.find(function (v) {
+      return v.value === value;
+    });
+    if (clickedValue && !clickedValue.isRefined) {
+      onFacetToggle(attribute, value); // Select
+    }
+  }, [facets, onFacetToggle]);
+  // Track if any filters applied
+  var hasAppliedFilters = useMemo(function () {
+    return facets.some(function (facet) {
+      return facet.values.some(function (value) {
+        return value.isRefined;
+      });
+    });
+  }, [facets]);
+  // Track previous filter state to detect transitions
+  var prevHasAppliedFilters = useRef(hasAppliedFilters);
+  // Auto-close drawer when transitioning FROM filters applied TO no filters (mobile only)
+  useEffect(function () {
+    // Only close if we HAD filters and now have NONE (not on initial open)
+    if (prevHasAppliedFilters.current && !hasAppliedFilters && isFilterDrawerOpen && onFilterDrawerClose) {
+      onFilterDrawerClose();
+    }
+    prevHasAppliedFilters.current = hasAppliedFilters;
+  }, [hasAppliedFilters, isFilterDrawerOpen, onFilterDrawerClose]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles$5.resultsView
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$5.searchBarWrapper, " ").concat(styles$5.searchBarDesktopOnly)
+  }, /*#__PURE__*/React.createElement(SearchBar, {
+    value: query,
+    onChange: onQueryChange,
+    onSubmit: onSearchSubmit,
+    placeholder: "Refine your search...",
+    variant: "results"
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$5.tabsContainer, " ").concat(styles$5.tabsContainerDesktopOnly)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$5.tabs,
+    role: "tablist"
+  }, /*#__PURE__*/React.createElement(TabButton, {
+    label: "WEB SHOP RESULTS",
+    count: products.length,
+    isActive: activeTab === "products",
+    onClick: function () {
+      return onTabChange("products");
+    },
+    variant: "desktop"
+  }), /*#__PURE__*/React.createElement("div", {
+    className: styles$5.tabSeparator
+  }), /*#__PURE__*/React.createElement(TabButton, {
+    label: "WEBSITE RESULTS",
+    count: contents.length,
+    isActive: activeTab === "content",
+    onClick: function () {
+      return onTabChange("content");
+    },
+    variant: "desktop"
+  })), onFilterDrawerToggle && /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: styles$5.mobileFilterButton,
+    onClick: onFilterDrawerToggle
+  }, /*#__PURE__*/React.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "15",
+    height: "11",
+    viewBox: "0 0 15 11",
+    fill: "none",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M0 0.6875C0 0.30651 0.313477 0 0.703125 0H14.2969C14.6865 0 15 0.30651 15 0.6875C15 1.06849 14.6865 1.375 14.2969 1.375H0.703125C0.313477 1.375 0 1.06849 0 0.6875ZM2.8125 5.5C2.8125 5.11901 3.12598 4.8125 3.51562 4.8125H11.4844C11.874 4.8125 12.1875 5.11901 12.1875 5.5C12.1875 5.88099 11.874 6.1875 11.4844 6.1875H3.51562C3.12598 6.1875 2.8125 5.88099 2.8125 5.5ZM9.375 10.3125C9.375 10.6935 9.06152 11 8.67188 11H6.32812C5.93848 11 5.625 10.6935 5.625 10.3125C5.625 9.93151 5.93848 9.625 6.32812 9.625H8.67188C9.06152 9.625 9.375 9.93151 9.375 10.3125Z",
+    fill: "currentColor"
+  })), /*#__PURE__*/React.createElement("span", null, "Filter"))), /*#__PURE__*/React.createElement("div", {
+    className: styles$5.resultsContainer
+  }, /*#__PURE__*/React.createElement("aside", {
+    className: styles$5.sidebar
+  }, /*#__PURE__*/React.createElement(FiltersPanel, {
+    facets: facets,
+    onFacetToggle: activeTab === "products" ? onFacetToggle : handleContentCategorySelect,
+    showCheckbox: activeTab === "products"
+  }), /*#__PURE__*/React.createElement(AssistanceBanner, {
+    className: styles$5.assistanceBanner
+  })), /*#__PURE__*/React.createElement("main", {
+    className: styles$5.mainContent
+  }, /*#__PURE__*/React.createElement("div", {
+    id: "tabpanel-".concat(activeTab),
+    role: "tabpanel",
+    "aria-labelledby": "tab-".concat(activeTab)
+  }, /*#__PURE__*/React.createElement(ResultsList, {
+    type: activeTab,
+    products: displayProducts,
+    contents: displayContents,
+    isLoading: isLoading,
+    error: error
+  }), !isLoading && !error && (displayProducts.length > 0 || displayContents.length > 0) && /*#__PURE__*/React.createElement("div", {
+    className: styles$5.paginationWrapper
+  }, /*#__PURE__*/React.createElement(Pagination, {
+    currentPage: currentPage,
+    totalPages: totalPages,
+    onPageChange: onPageChange,
+    maxVisiblePages: 10,
+    showPrevious: false,
+    ariaLabel: "".concat(activeTab === "products" ? "Products" : "Content", " pagination")
+  }))))), onFilterDrawerClose && /*#__PURE__*/React.createElement(FilterDrawer, {
+    isOpen: isFilterDrawerOpen || false,
+    onClose: onFilterDrawerClose
+  }, /*#__PURE__*/React.createElement(FiltersPanel, {
+    facets: facets,
+    onFacetToggle: activeTab === "products" ? onFacetToggle : handleContentCategorySelect,
+    variant: "mobile",
+    showCheckbox: activeTab === "products"
+  })));
+};
+
+var styles$1 = {"searchExperience":"FederatedSearchExperience-module__searchExperience___gug9X","searchBarSection":"FederatedSearchExperience-module__searchBarSection___f0Ykq","searchBarDesktopOnly":"FederatedSearchExperience-module__searchBarDesktopOnly___CetKZ","searchBarMobileOnly":"FederatedSearchExperience-module__searchBarMobileOnly___Ityxp","resultsHeaderMobileOnly":"FederatedSearchExperience-module__resultsHeaderMobileOnly___09ef-","tabsContainerSticky":"FederatedSearchExperience-module__tabsContainerSticky___-HdY5","tabs":"FederatedSearchExperience-module__tabs___Vatv8","tabSeparator":"FederatedSearchExperience-module__tabSeparator___AUjhW","mobileFilterButtonWrapper":"FederatedSearchExperience-module__mobileFilterButtonWrapper___JkRtk","mobileFilterButton":"FederatedSearchExperience-module__mobileFilterButton___sRc-w","filterIndicatorDot":"FederatedSearchExperience-module__filterIndicatorDot___vqVi2","instantResultsSection":"FederatedSearchExperience-module__instantResultsSection___AG3qn","fullResultsSection":"FederatedSearchExperience-module__fullResultsSection___NH16U"};
+
+/**
+ * FederatedSearchExperience - Top-level search experience component
+ *
+ * This component orchestrates the entire federated search experience, including:
+ * - Modal container
+ * - Search input
+ * - Instant results (2-column layout)
+ * - Full results view with tabs and filters
+ *
+ * The component is fully controlled and does not contain any data fetching logic.
+ * All data and callbacks are passed in via props, making it suitable for use in AEM
+ * where a controller layer will handle Algolia integration.
+ *
+ * @example
+ * ```tsx
+ * <FederatedSearchExperience
+ *   isOpen={isOpen}
+ *   onOpen={handleOpen}
+ *   onClose={handleClose}
+ *   query={query}
+ *   onQueryChange={setQuery}
+ *   onSearchSubmit={handleSubmit}
+ *   products={products}
+ *   contents={contents}
+ *   isLoadingProducts={isLoadingProducts}
+ *   isLoadingContents={isLoadingContents}
+ *   onSeeAllProducts={handleSeeAllProducts}
+ *   onSeeAllContents={handleSeeAllContents}
+ *   onSeeAllCombined={handleSeeAllCombined}
+ *   activeView={activeView}
+ *   onChangeView={setActiveView}
+ *   activeTab={activeTab}
+ *   onTabChange={setActiveTab}
+ * />
+ * ```
+ */
+var FederatedSearchExperience = function (_a) {
+  var isOpen = _a.isOpen,
+    onClose = _a.onClose,
+    query = _a.query,
+    onQueryChange = _a.onQueryChange,
+    onSearchSubmit = _a.onSearchSubmit,
+    products = _a.products,
+    contents = _a.contents,
+    isLoadingProducts = _a.isLoadingProducts,
+    isLoadingContents = _a.isLoadingContents,
+    productsError = _a.productsError,
+    contentsError = _a.contentsError,
+    onSeeAllProducts = _a.onSeeAllProducts,
+    onSeeAllContents = _a.onSeeAllContents,
+    onSeeAllCombined = _a.onSeeAllCombined,
+    activeView = _a.activeView;
+    _a.onChangeView;
+    var activeTab = _a.activeTab,
+    onTabChange = _a.onTabChange,
+    currentPage = _a.currentPage,
+    totalPages = _a.totalPages,
+    onPageChange = _a.onPageChange,
+    facets = _a.facets,
+    onFacetToggle = _a.onFacetToggle,
+    isFilterDrawerOpen = _a.isFilterDrawerOpen,
+    onFilterDrawerToggle = _a.onFilterDrawerToggle,
+    onFilterDrawerClose = _a.onFilterDrawerClose;
+  // Track if any filters are active (for red dot indicator)
+  var hasAppliedFilters = useMemo(function () {
+    return facets.some(function (facet) {
+      return facet.values.some(function (value) {
+        return value.isRefined;
+      });
+    });
+  }, [facets]);
+  return /*#__PURE__*/React.createElement(SearchModal, {
+    isOpen: isOpen,
+    onClose: onClose,
+    title: "Search",
+    stickyHeaderContent: activeView === "instant" ? /*#__PURE__*/React.createElement("div", {
+      className: styles$1.searchBarMobileOnly
+    }, /*#__PURE__*/React.createElement(SearchBar, {
+      value: query,
+      onChange: onQueryChange,
+      onSubmit: onSearchSubmit,
+      placeholder: "Discover products, innovations, and resources...",
+      autoFocus: true,
+      variant: "instant"
+    })) : activeView === "results" ? /*#__PURE__*/React.createElement("div", {
+      className: styles$1.resultsHeaderMobileOnly
+    }, /*#__PURE__*/React.createElement(SearchBar, {
+      value: query,
+      onChange: onQueryChange,
+      onSubmit: onSearchSubmit,
+      placeholder: "Refine your search...",
+      variant: "results"
+    }), /*#__PURE__*/React.createElement("div", {
+      className: styles$1.tabsContainerSticky
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles$1.tabs,
+      role: "tablist"
+    }, /*#__PURE__*/React.createElement(TabButton, {
+      label: "WEB SHOP RESULTS",
+      count: products.length,
+      isActive: activeTab === "products",
+      onClick: function () {
+        return onTabChange("products");
+      },
+      variant: "mobile"
+    }), /*#__PURE__*/React.createElement("div", {
+      className: styles$1.tabSeparator
+    }), /*#__PURE__*/React.createElement(TabButton, {
+      label: "WEBSITE RESULTS",
+      count: contents.length,
+      isActive: activeTab === "content",
+      onClick: function () {
+        return onTabChange("content");
+      },
+      variant: "mobile"
+    })), /*#__PURE__*/React.createElement("div", {
+      className: styles$1.mobileFilterButtonWrapper
+    }, /*#__PURE__*/React.createElement("button", {
+      type: "button",
+      className: styles$1.mobileFilterButton,
+      onClick: onFilterDrawerToggle
+    }, /*#__PURE__*/React.createElement("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "15",
+      height: "11",
+      viewBox: "0 0 15 11",
+      fill: "none",
+      "aria-hidden": "true"
+    }, /*#__PURE__*/React.createElement("path", {
+      d: "M0 0.6875C0 0.30651 0.313477 0 0.703125 0H14.2969C14.6865 0 15 0.30651 15 0.6875C15 1.06849 14.6865 1.375 14.2969 1.375H0.703125C0.313477 1.375 0 1.06849 0 0.6875ZM2.8125 5.5C2.8125 5.11901 3.12598 4.8125 3.51562 4.8125H11.4844C11.874 4.8125 12.1875 5.11901 12.1875 5.5C12.1875 5.88099 11.874 6.1875 11.4844 6.1875H3.51562C3.12598 6.1875 2.8125 5.88099 2.8125 5.5ZM9.375 10.3125C9.375 10.6935 9.06152 11 8.67188 11H6.32812C5.93848 11 5.625 10.6935 5.625 10.3125C5.625 9.93151 5.93848 9.625 6.32812 9.625H8.67188C9.06152 9.625 9.375 9.93151 9.375 10.3125Z",
+      fill: "currentColor"
+    })), /*#__PURE__*/React.createElement("span", null, "Filter")), hasAppliedFilters && /*#__PURE__*/React.createElement("span", {
+      className: styles$1.filterIndicatorDot,
+      "aria-hidden": "true"
+    })))) : undefined
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles$1.searchExperience
+  }, activeView === "instant" && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles$1.searchBarSection, " ").concat(styles$1.searchBarDesktopOnly)
+  }, /*#__PURE__*/React.createElement(SearchBar, {
+    value: query,
+    onChange: onQueryChange,
+    onSubmit: onSearchSubmit,
+    placeholder: "Discover products, innovations, and resources...",
+    autoFocus: true,
+    variant: "instant"
+  })), activeView === "instant" && /*#__PURE__*/React.createElement("div", {
+    className: styles$1.instantResultsSection
+  }, query ? /*#__PURE__*/React.createElement(FederatedInstantResultsLayout, {
+    query: query,
+    products: products,
+    contents: contents,
+    isLoadingProducts: isLoadingProducts,
+    isLoadingContents: isLoadingContents,
+    productsError: productsError,
+    contentsError: contentsError,
+    onSeeAllProducts: onSeeAllProducts,
+    onSeeAllContents: onSeeAllContents,
+    onSeeAllCombined: onSeeAllCombined
+  }) : /*#__PURE__*/React.createElement(React.Fragment, null)
+  // <div className={styles.emptyState}>
+  //   <svg
+  //     xmlns="http://www.w3.org/2000/svg"
+  //     viewBox="0 0 24 24"
+  //     fill="none"
+  //     stroke="currentColor"
+  //     strokeWidth="2"
+  //     strokeLinecap="round"
+  //     strokeLinejoin="round"
+  //     className={styles.emptyIcon}
+  //   >
+  //     <circle cx="11" cy="11" r="8" />
+  //     <path d="m21 21-4.35-4.35" />
+  //   </svg>
+  //   <h3>Start searching</h3>
+  //   <p>
+  //     Search for vacuum pumps, accessories, technical documentation, and more.
+  //   </p>
+  // </div>
+  ), activeView === "results" && /*#__PURE__*/React.createElement("div", {
+    className: styles$1.fullResultsSection
+  }, /*#__PURE__*/React.createElement(FederatedResultsView, {
+    query: query,
+    onQueryChange: onQueryChange,
+    onSearchSubmit: onSearchSubmit,
+    activeTab: activeTab,
+    onTabChange: onTabChange,
+    products: products,
+    contents: contents,
+    isLoadingProducts: isLoadingProducts,
+    isLoadingContents: isLoadingContents,
+    productsError: productsError,
+    contentsError: contentsError,
+    currentPage: currentPage,
+    totalPages: totalPages,
+    onPageChange: onPageChange,
+    facets: facets,
+    onFacetToggle: onFacetToggle,
+    isFilterDrawerOpen: isFilterDrawerOpen,
+    onFilterDrawerToggle: onFilterDrawerToggle,
+    onFilterDrawerClose: onFilterDrawerClose
+  }))));
+};
+
+var styles = {"searchTrigger":"SearchTriggerButton-module__searchTrigger___PDbDB","searchIcon":"SearchTriggerButton-module__searchIcon___izByW","label":"SearchTriggerButton-module__label___mkS7T"};
+
+var SearchTriggerButton = function (_a) {
+  var onOpen = _a.onOpen,
+    _b = _a.ariaLabel,
+    ariaLabel = _b === void 0 ? 'Open search' : _b,
+    label = _a.label,
+    _c = _a.className,
+    className = _c === void 0 ? '' : _c;
+  var handleKeyDown = function (event) {
+    if (event.key === 'Enter' || event.key === ' ') {
+      event.preventDefault();
+      onOpen();
+    }
+  };
+  return /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onOpen,
+    onKeyDown: handleKeyDown,
+    "aria-label": ariaLabel,
+    className: "".concat(styles.searchTrigger, " ").concat(className)
+  }, /*#__PURE__*/React.createElement("svg", {
+    className: styles.searchIcon,
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement("circle", {
+    cx: "11",
+    cy: "11",
+    r: "8"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "m21 21-4.35-4.35"
+  })), label && /*#__PURE__*/React.createElement("span", {
+    className: styles.label
+  }, label));
+};
+
+export { AlgoliaDynamicSearchLeybold as AlgoliaDynamicSearch, AlgoliaDynamicSearchLeybold, AppliedFilterTag, AppliedFilters, Button, ContentCardHorizontal, FederatedInstantResultsLayout, FederatedResultsView, FederatedSearchExperience, FilterAccordion, FilterItem, FilterSearch, FiltersPanel, Footer, FooterBottom, FooterLink, FooterLinkGroup, FooterSocialIcon, FooterSocialIcons, ModalCloseButton, Pagination, PaginationButton, PaginationEllipsis, PaginationItem, ProductCardHorizontal, ProductCardVertical, QrFormLeybold as QrForm, QrFormLeybold, ResultsColumn, ResultsCount, ResultsList, SearchBar, SearchIcon, SearchInput, SearchModal, SearchSubmitButton, SearchTriggerButton, SeeAllLinkButton };
+//# sourceMappingURL=index.esm.js.map