@asante-org/leybold-design-system 1.3.0 → 1.3.1

package/dist/index.esm.js

@@ -15,46 +15,7 @@ function _extends() {
   }, _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$l = {"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"};
+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;
@@ -131,10 +92,22 @@ function requireClassnames() {
 var classnamesExports = requireClassnames();
 var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
 
-/**
- * Get the icon component based on icon type
+/**
+ * Button variant types
+ */
+
+/**
+ * Icon types for button
+ */
+
+/**
+ * Icon position
+ */
+
+/**
+ * Get the icon component based on icon type
  */
-var getIcon = function (icon) {
+const getIcon = icon => {
   switch (icon) {
     case "arrow-right":
       return /*#__PURE__*/React.createElement(FontAwesomeIcon, {
@@ -156,10 +129,11 @@ var getIcon = function (icon) {
       return null;
   }
 };
-/**
- * Get default icon for certain variants
+
+/**
+ * Get default icon for certain variants
  */
-var getDefaultIcon = function (variant) {
+const getDefaultIcon = variant => {
   switch (variant) {
     case "link-text":
     case "link-text-alt":
@@ -176,10 +150,11 @@ var getDefaultIcon = function (variant) {
       return "none";
   }
 };
-/**
- * Map alias variants to their actual CSS class variants
+
+/**
+ * Map alias variants to their actual CSS class variants
  */
-var mapVariantToClass = function (variant) {
+const mapVariantToClass = variant => {
   switch (variant) {
     case "text":
       return "link-text";
@@ -187,127 +162,130 @@ var mapVariantToClass = function (variant) {
       return variant;
   }
 };
-/**
- * Primary UI component for user interaction
+
+/**
+ * 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"]);
+const Button = ({
+  children,
+  variant = "primary",
+  size = "medium",
+  disabled = false,
+  onClick,
+  type = "button",
+  className,
+  icon,
+  iconPosition = "right",
+  ariaLabel,
+  opensInNewTab,
+  ...props
+}) => {
   // Map alias variants to actual class names
-  var cssVariant = mapVariantToClass(variant);
+  const cssVariant = mapVariantToClass(variant);
+
   // Determine the icon to display
-  var displayIcon = icon !== null && icon !== void 0 ? icon : getDefaultIcon(variant);
-  var iconElement = getIcon(displayIcon);
+  const displayIcon = icon ?? getDefaultIcon(variant);
+  const 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$l.button, styles$l["button--".concat(cssVariant)], styles$l["button--".concat(size)], (_b = {}, _b[styles$l["button--disabled"]] = disabled, _b), className);
-  var iconClasses = classNames(styles$l.button__icon, styles$l["button__icon--".concat(iconPosition)]);
+  const isIconOnly = variant === "carousel-arrow-left" || variant === "carousel-arrow-right";
+  const isCarouselLeft = variant === "carousel-arrow-left";
+  const isCarouselRight = variant === "carousel-arrow-right";
+  const buttonClasses = classNames(styles$k.button, styles$k[`button--${cssVariant}`], styles$k[`button--${size}`], {
+    [styles$k["button--disabled"]]: disabled
+  }, className);
+  const iconClasses = classNames(styles$k.button__icon, styles$k[`button__icon--${iconPosition}`]);
+
   // Generate accessible label for icon-only buttons
-  var accessibleLabel = ariaLabel || (isIconOnly ? variant === "carousel-arrow-left" ? "Previous" : "Next" : undefined);
+  const 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"]
+    "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$l.button__icon__default
+    className: styles$k.button__icon__default
   }), /*#__PURE__*/React.createElement(FontAwesomeIcon, {
     icon: faArrowLeftLong,
-    className: styles$l.button__icon__hover
+    className: styles$k.button__icon__hover
   })), isCarouselRight && /*#__PURE__*/React.createElement("span", {
     className: iconClasses
   }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
     icon: faArrowRight,
-    className: styles$l.button__icon__default
+    className: styles$k.button__icon__default
   }), /*#__PURE__*/React.createElement(FontAwesomeIcon, {
     icon: faArrowRightLong,
-    className: styles$l.button__icon__hover
+    className: styles$k.button__icon__hover
   })), !isIconOnly && iconElement && /*#__PURE__*/React.createElement("span", {
     className: iconClasses
   }, iconElement));
 };
 
-var styles$k = {"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"};
+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
+/**
+ * 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)
+const ExternalLinkIcon = ({
+  className,
+  size = 15
+}) => /*#__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"
-  }));
-};
+const AtlasCopcoIcon = ({
+  className,
+  size = 14
+}) => /*#__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"
+}));
+
+// =============================================================================
+// TYPE DEFINITIONS
+// =============================================================================
 
 // =============================================================================
 // SOCIAL ICON COMPONENT
 // =============================================================================
-var SocialIconComponent = function (_a) {
-  var platform = _a.platform;
-  var iconMap = {
+
+const SocialIconComponent = ({
+  platform
+}) => {
+  const iconMap = {
     facebook: faFacebookF,
     x: faXTwitter,
     linkedin: faLinkedinIn,
@@ -318,14 +296,19 @@ var SocialIconComponent = function (_a) {
     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$k.footer__bottomLink : styles$k.footer__link;
-  var linkClasses = classNames(baseClass, className);
-  var handleClick = function (e) {
+
+// =============================================================================
+// FOOTER LINK COMPONENT
+// =============================================================================
+
+const FooterLink = ({
+  item,
+  className,
+  variant = 'default'
+}) => {
+  const baseClass = variant === 'bottom' ? styles$j.footer__bottomLink : styles$j.footer__link;
+  const linkClasses = classNames(baseClass, className);
+  const handleClick = e => {
     if (item.onClick) {
       e.preventDefault();
       item.onClick();
@@ -339,151 +322,169 @@ var FooterLink = function (_a) {
     target: '_blank',
     rel: 'noopener noreferrer'
   }), /*#__PURE__*/React.createElement("span", {
-    className: styles$k.footer__linkText
+    className: styles$j.footer__linkText
   }, item.label), item.external && /*#__PURE__*/React.createElement("span", {
-    className: styles$k.footer__linkIcon
+    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;
+
+// =============================================================================
+// FOOTER LINK GROUP COMPONENT
+// =============================================================================
+
+const FooterLinkGroup = ({
+  heading,
+  links,
+  className,
+  children
+}) => {
   return /*#__PURE__*/React.createElement("div", {
-    className: classNames(styles$k.footer__linkGroup, className)
+    className: classNames(styles$j.footer__linkGroup, className)
   }, /*#__PURE__*/React.createElement("h3", {
-    className: styles$k.footer__linkHeading
+    className: styles$j.footer__linkHeading
   }, heading), /*#__PURE__*/React.createElement("ul", {
-    className: styles$k.footer__linkList
-  }, links.map(function (link, index) {
-    return /*#__PURE__*/React.createElement("li", {
-      key: index
-    }, /*#__PURE__*/React.createElement(FooterLink, {
-      item: link
-    }));
-  })), children);
+    className: styles$j.footer__linkList
+  }, links.map((link, index) => /*#__PURE__*/React.createElement("li", {
+    key: index
+  }, /*#__PURE__*/React.createElement(FooterLink, {
+    item: link
+  })))), children);
 };
-var FooterSocialIcons = function (_a) {
-  var links = _a.links,
-    className = _a.className;
+
+// =============================================================================
+// FOOTER SOCIAL ICONS COMPONENT
+// =============================================================================
+
+const FooterSocialIcons = ({
+  links,
+  className
+}) => {
   return /*#__PURE__*/React.createElement("div", {
-    className: classNames(styles$k.footer__socialIcons, className)
-  }, links.map(function (link, index) {
-    return /*#__PURE__*/React.createElement("a", {
-      key: index,
-      href: link.href,
-      className: styles$k.footer__socialIcon,
-      "aria-label": link.ariaLabel,
-      target: "_blank",
-      rel: "noopener noreferrer"
-    }, /*#__PURE__*/React.createElement(SocialIconComponent, {
-      platform: link.platform
-    }));
-  }));
+    className: classNames(styles$j.footer__socialIcons, className)
+  }, links.map((link, index) => /*#__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$k.footer__socialIcon, className);
+
+// =============================================================================
+// FOOTER SOCIAL ICON (STANDALONE) COMPONENT
+// =============================================================================
+
+const FooterSocialIcon = ({
+  platform,
+  className
+}) => {
+  const 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;
+
+// =============================================================================
+// FOOTER BOTTOM COMPONENT
+// =============================================================================
+
+const FooterBottom = ({
+  links,
+  copyright,
+  countrySelector,
+  className
+}) => {
   return /*#__PURE__*/React.createElement("div", {
-    className: classNames(styles$k.footer__bottom, className)
+    className: classNames(styles$j.footer__bottom, className)
   }, /*#__PURE__*/React.createElement("div", {
-    className: styles$k.footer__bottomLeft
+    className: styles$j.footer__bottomLeft
   }, /*#__PURE__*/React.createElement("div", {
-    className: styles$k.footer__bottomLinks
-  }, links.map(function (link, index) {
-    return /*#__PURE__*/React.createElement(FooterLink, {
-      key: index,
-      item: link,
-      variant: "bottom"
-    });
-  })), /*#__PURE__*/React.createElement("p", {
-    className: styles$k.footer__copyright
+    className: styles$j.footer__bottomLinks
+  }, links.map((link, index) => /*#__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$k.footer__countrySelector
+    className: styles$j.footer__countrySelector
   }, countrySelector.showIcon !== false && /*#__PURE__*/React.createElement("span", {
-    className: styles$k.footer__countrySelectorIcon
+    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
+
+/**
+ * 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$k.footer, isMobile && styles$k['footer--mobile'], className);
-  var LogoWrapper = logo.href ? 'a' : 'div';
-  var logoProps = logo.href ? {
+const Footer = ({
+  variant = 'desktop',
+  logo,
+  motto,
+  atlasCopcoBadge,
+  quickLinks,
+  quickLinksHeading = 'Quick links',
+  contactLinks,
+  contactHeading = 'Contact us',
+  socialLinks,
+  contactFormButton,
+  bottomLinks,
+  copyright,
+  countrySelector,
+  className
+}) => {
+  const isMobile = variant === 'mobile';
+  const footerClasses = classNames(styles$j.footer, isMobile && styles$j['footer--mobile'], className);
+  const LogoWrapper = logo.href ? 'a' : 'div';
+  const logoProps = logo.href ? {
     href: logo.href,
-    className: styles$k.footer__logo
+    className: styles$j.footer__logo
   } : {
-    className: styles$k.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$k.footer__leftCol
-    }, /*#__PURE__*/React.createElement("h2", {
-      className: styles$k.footer__motto
-    }, motto), atlasCopcoBadge && /*#__PURE__*/React.createElement("div", {
-      className: styles$k.footer__badge
-    }, atlasCopcoBadge.showIcon !== false && /*#__PURE__*/React.createElement("span", {
-      className: styles$k.footer__badgeIcon
-    }, /*#__PURE__*/React.createElement(AtlasCopcoIcon, {
-      size: 14
-    })), /*#__PURE__*/React.createElement("span", {
-      className: styles$k.footer__badgeText
-    }, atlasCopcoBadge.text))));
-  };
+  const LogoSection = () => /*#__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$k.footer__container
+      className: styles$j.footer__container
     }, /*#__PURE__*/React.createElement("div", {
-      className: styles$k.footer__links
+      className: styles$j.footer__links
     }, /*#__PURE__*/React.createElement(FooterLinkGroup, {
       heading: quickLinksHeading,
       links: quickLinks
@@ -491,7 +492,7 @@ var Footer = function (_a) {
       heading: contactHeading,
       links: contactLinks
     })), contactFormButton && /*#__PURE__*/React.createElement("div", {
-      className: styles$k.footer__cta
+      className: styles$j.footer__cta
     }, /*#__PURE__*/React.createElement("a", {
       href: contactFormButton.href,
       style: {
@@ -510,33 +511,34 @@ var Footer = function (_a) {
       copyright: copyright,
       countrySelector: countrySelector
     }), /*#__PURE__*/React.createElement("div", {
-      className: styles$k.footer__brandSection
+      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$k.footer__container
+    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$k.footer__main
+    className: styles$j.footer__main
   }, /*#__PURE__*/React.createElement("div", {
-    className: styles$k.footer__leftCol
+    className: styles$j.footer__leftCol
   }, /*#__PURE__*/React.createElement("h2", {
-    className: styles$k.footer__motto
+    className: styles$j.footer__motto
   }, motto), atlasCopcoBadge && /*#__PURE__*/React.createElement("div", {
-    className: styles$k.footer__badge
+    className: styles$j.footer__badge
   }, atlasCopcoBadge.showIcon !== false && /*#__PURE__*/React.createElement("span", {
-    className: styles$k.footer__badgeIcon
+    className: styles$j.footer__badgeIcon
   }, /*#__PURE__*/React.createElement(AtlasCopcoIcon, {
     size: 14
   })), /*#__PURE__*/React.createElement("span", {
-    className: styles$k.footer__badgeText
+    className: styles$j.footer__badgeText
   }, atlasCopcoBadge.text))), /*#__PURE__*/React.createElement("div", {
-    className: styles$k.footer__links
+    className: styles$j.footer__links
   }, /*#__PURE__*/React.createElement(FooterLinkGroup, {
     heading: quickLinksHeading,
     links: quickLinks
@@ -552,46 +554,48 @@ var Footer = function (_a) {
   })));
 };
 
-var styles$j = {"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 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 () {
+const PaginationItem = ({
+  page,
+  isActive,
+  onClick,
+  className
+}) => {
+  const handleClick = () => {
     if (!isActive) {
       onClick(page);
     }
   };
-  var handleKeyDown = function (event) {
+  const handleKeyDown = event => {
     if (event.key === "Enter" || event.key === " ") {
       event.preventDefault();
       handleClick();
     }
   };
   return /*#__PURE__*/React.createElement("li", {
-    className: styles$j.paginationItem
+    className: styles$i.paginationItem
   }, /*#__PURE__*/React.createElement("button", {
     type: "button",
     onClick: handleClick,
     onKeyDown: handleKeyDown,
-    className: "".concat(styles$j.pageButton, " ").concat(isActive ? styles$j.pageButtonActive : "", " ").concat(className || ""),
+    className: `${styles$i.pageButton} ${isActive ? styles$i.pageButtonActive : ""} ${className || ""}`,
     "aria-current": isActive ? "page" : undefined,
-    "aria-label": "Page ".concat(page),
+    "aria-label": `Page ${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) {
+const PaginationButton = ({
+  label,
+  disabled,
+  onClick,
+  direction,
+  className,
+  ariaLabel
+}) => {
+  const handleKeyDown = event => {
     if (event.key === "Enter" || event.key === " ") {
       event.preventDefault();
       if (!disabled) {
@@ -600,130 +604,130 @@ var PaginationButton = function (_a) {
     }
   };
   return /*#__PURE__*/React.createElement("li", {
-    className: styles$j.paginationItem
+    className: styles$i.paginationItem
   }, /*#__PURE__*/React.createElement("button", {
     type: "button",
     onClick: onClick,
     onKeyDown: handleKeyDown,
     disabled: disabled,
-    className: "".concat(styles$j.navButton, " ").concat(styles$j["navButton--".concat(direction)], " ").concat(disabled ? styles$j.navButtonDisabled : "", " ").concat(className || ""),
+    className: `${styles$i.navButton} ${styles$i[`navButton--${direction}`]} ${disabled ? styles$i.navButtonDisabled : ""} ${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$j.navIcon,
+    className: styles$i.navIcon,
     "aria-hidden": "true"
   })));
 };
 
-var PaginationEllipsis = function (_a) {
-  var className = _a.className;
+const PaginationEllipsis = ({
+  className
+}) => {
   return /*#__PURE__*/React.createElement("li", {
-    className: "".concat(styles$j.paginationItem, " ").concat(styles$j.ellipsis),
+    className: `${styles$i.paginationItem} ${styles$i.ellipsis}`,
     "aria-hidden": "true"
   }, /*#__PURE__*/React.createElement("span", {
-    className: "".concat(styles$j.ellipsisText, " ").concat(className || "")
+    className: `${styles$i.ellipsisText} ${className || ""}`
   }, "..."));
 };
 
-/**
- * Generate page numbers to display with ellipsis logic
+/**
+ * Generate page numbers to display with ellipsis logic
  */
-var generatePageNumbers = function (currentPage, totalPages, maxVisiblePages) {
+const generatePageNumbers = (currentPage, totalPages, maxVisiblePages) => {
   if (totalPages <= maxVisiblePages) {
     return Array.from({
       length: totalPages
-    }, function (_, i) {
-      return i + 1;
-    });
+    }, (_, i) => i + 1);
   }
-  var pages = [];
-  var halfVisible = Math.floor(maxVisiblePages / 2);
+  const pages = [];
+  const 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);
+  let startPage = Math.max(2, currentPage - halfVisible);
+  let 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++) {
+  for (let 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) {
+const Pagination = ({
+  currentPage,
+  totalPages,
+  onPageChange,
+  maxVisiblePages = 10,
+  showPrevious = true,
+  showNext = true,
+  previousLabel = "Previous",
+  nextLabel = "Next",
+  className,
+  ariaLabel = "Pagination"
+}) => {
+  const pageNumbers = useMemo(() => generatePageNumbers(currentPage, totalPages, maxVisiblePages), [currentPage, totalPages, maxVisiblePages]);
+  const handlePageChange = page => {
     if (page >= 1 && page <= totalPages && page !== currentPage) {
       onPageChange(page);
     }
   };
-  var handlePrevious = function () {
+  const handlePrevious = () => {
     handlePageChange(currentPage - 1);
   };
-  var handleNext = function () {
+  const handleNext = () => {
     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$j.pagination, " ").concat(className || ""),
+    className: `${styles$i.pagination} ${className || ""}`,
     "aria-label": ariaLabel,
     role: "navigation"
   }, /*#__PURE__*/React.createElement("div", {
-    className: styles$j.dividerLine
+    className: styles$i.dividerLine
   }), /*#__PURE__*/React.createElement("ul", {
-    className: styles$j.paginationList
+    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) {
+  }), pageNumbers.map((page, index) => {
     if (page === "ellipsis-start" || page === "ellipsis-end") {
       return /*#__PURE__*/React.createElement(PaginationEllipsis, {
-        key: "ellipsis-".concat(index)
+        key: `ellipsis-${index}`
       });
     }
     return /*#__PURE__*/React.createElement(PaginationItem, {
@@ -741,88 +745,83 @@ var Pagination = function (_a) {
   })));
 };
 
-var styles$i = {"productCard":"ProductCardHorizontal-module__productCard___Nl4jK","productWrapper":"ProductCardHorizontal-module__productWrapper___gs8fn","withImage":"ProductCardHorizontal-module__withImage___pPFw2","withPlaceholder":"ProductCardHorizontal-module__withPlaceholder___x8IUh","productTitle":"ProductCardHorizontal-module__productTitle___xBuu7","productPrice":"ProductCardHorizontal-module__productPrice___lf32A","productImage":"ProductCardHorizontal-module__productImage___sQsUO","placeholderImage":"ProductCardHorizontal-module__placeholderImage___kT1sp","productId":"ProductCardHorizontal-module__productId___3oOQV","productTitleDescriptionWrapper":"ProductCardHorizontal-module__productTitleDescriptionWrapper___Obv-j","productPriceCtaWrapper":"ProductCardHorizontal-module__productPriceCtaWrapper___Npkfl","productArrowIcon":"ProductCardHorizontal-module__productArrowIcon___1-A76"};
-
-var styles$h = {"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 () {
+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"};
+
+const Image = ({
+  src,
+  alt,
+  width,
+  height,
+  loading = "lazy",
+  decoding = "async",
+  objectFit = "cover",
+  objectPosition = "center",
+  aspectRatio,
+  isDecorative = false,
+  fallbackSrc,
+  onLoad,
+  onError,
+  className = "",
+  srcSet,
+  sizes
+}) => {
+  const [isLoading, setIsLoading] = useState(true);
+  const [hasError, setHasError] = useState(false);
+  const [currentSrc, setCurrentSrc] = useState(src);
+  const handleLoad = useCallback(() => {
     setIsLoading(false);
     setHasError(false);
-    onLoad === null || onLoad === void 0 ? void 0 : onLoad();
+    onLoad?.();
   }, [onLoad]);
-  var handleError = useCallback(function () {
+  const handleError = useCallback(() => {
     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();
+      onError?.();
     }
   }, [fallbackSrc, currentSrc, onError]);
+
   // Accessibility: decorative images should have empty alt and be hidden from screen readers
-  var accessibilityProps = isDecorative ? {
+  const accessibilityProps = isDecorative ? {
     alt: "",
     "aria-hidden": true,
     role: "presentation"
   } : {
-    alt: 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
+  const containerStyle = {
+    ...(aspectRatio && {
+      aspectRatio
+    }),
+    ...(width && {
+      width: typeof width === "number" ? `${width}px` : width
+    }),
+    ...(height && {
+      height: typeof height === "number" ? `${height}px` : height
+    })
+  };
+  const imageStyle = {
+    objectFit,
+    objectPosition
   };
   return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles$h.imageContainer, " ").concat(className, " ").concat(isLoading ? styles$h.loading : "", " ").concat(hasError ? styles$h.error : ""),
+    className: `${styles$g.imageContainer} ${className} ${isLoading ? styles$g.loading : ""} ${hasError ? styles$g.error : ""}`,
     style: containerStyle
   }, isLoading && /*#__PURE__*/React.createElement("div", {
-    className: styles$h.skeleton,
+    className: styles$g.skeleton,
     "aria-hidden": "true"
   }, /*#__PURE__*/React.createElement("div", {
-    className: styles$h.shimmer
+    className: styles$g.shimmer
   })), hasError && !fallbackSrc ? /*#__PURE__*/React.createElement("div", {
-    className: styles$h.errorState,
+    className: styles$g.errorState,
     role: "img",
     "aria-label": alt || "Image failed to load"
   }, /*#__PURE__*/React.createElement("svg", {
@@ -833,7 +832,7 @@ var Image = function (_a) {
     strokeWidth: "1.5",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    className: styles$h.errorIcon,
+    className: styles$g.errorIcon,
     "aria-hidden": "true"
   }, /*#__PURE__*/React.createElement("rect", {
     x: "3",
@@ -849,7 +848,7 @@ var Image = function (_a) {
   }), /*#__PURE__*/React.createElement("polyline", {
     points: "21 15 16 10 5 21"
   })), /*#__PURE__*/React.createElement("span", {
-    className: styles$h.errorText
+    className: styles$g.errorText
   }, "Image unavailable")) : /*#__PURE__*/React.createElement("img", _extends({
     src: currentSrc
   }, accessibilityProps, {
@@ -859,7 +858,7 @@ var Image = function (_a) {
     decoding: decoding,
     onLoad: handleLoad,
     onError: handleError,
-    className: styles$h.image,
+    className: styles$g.image,
     style: imageStyle,
     srcSet: srcSet,
     sizes: sizes
@@ -877,285 +876,144 @@ const faArrowUpRight = {
   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 PLACEHOLDER_INDICATOR = "?placeholder-storybook";
-var PLACEHOLDER_SVG = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"440\" height=\"133\" viewBox=\"218.446 219.139 440 133\" role=\"img\" aria-label=\"Leybold placeholder logo\"><g fill=\"#ffff\"><path d=\"M290.317,313.442h37.784v12.782h-53.654v-70.62h15.87V313.442z\"/><path d=\"M386.309,310.883c-3.912,12.593-15.135,16.722-24.761,16.722c-15.878,0-28.046-7.084-28.046-28.62c0-6.296,2.322-26.458,26.98-26.458c11.116,0,26.457,4.917,26.457,28.819v2.457h-38.626c0.428,3.935,1.274,12.785,13.232,12.785c4.125,0,8.356-1.965,9.521-5.704L386.309,310.883L386.309,310.883z M371.709,294.852c-0.85-8.456-6.666-11.017-11.434-11.017c-6.979,0-10.686,4.129-11.532,11.017H371.709z\"/><path d=\"M423.556,325.343c-6.986,19.374-8.892,21.932-21.799,21.932c-2.014,0-4.553-0.096-6.665-0.194v-11.02c0.629,0.104,1.582,0.197,2.854,0.197c5.397,0,8.36-0.688,9.737-7.864l-20.741-54.488h16.508l12.062,38.553h0.209l11.539-38.553h15.658L423.556,325.343z\"/><path d=\"M463.54,280.689h0.213c2.328-3.344,6.775-8.164,16.297-8.164c12.385,0,23.389,8.854,23.389,26.949c0,14.359-6.98,28.129-23.703,28.129c-6.141,0-12.701-2.067-16.299-7.968h-0.211v6.589h-14.498v-70.62h14.812V280.689z M475.604,284.427c-10.158,0-12.701,8.455-12.701,16.815c0,7.773,3.707,15.049,13.129,15.049c9.521,0,12.168-9.641,12.168-15.83C488.198,292.192,485.02,284.427,475.604,284.427z\"/><path d=\"M538.094,327.604c-15.141,0-28.787-8.652-28.787-27.542c0-18.881,13.646-27.536,28.787-27.536c15.129,0,28.785,8.655,28.785,27.536C566.88,318.95,553.223,327.604,538.094,327.604z M538.094,284.129c-11.434,0-13.547,9.244-13.547,15.934c0,6.691,2.113,15.939,13.547,15.939c11.426,0,13.547-9.248,13.547-15.939C551.641,293.373,549.52,284.129,538.094,284.129z\"/><path d=\"M588.811,326.225h-14.814v-70.62h14.814V326.225z\"/><path d=\"M651.969,326.225h-14.5v-6.589h-0.213c-3.598,5.898-10.156,7.968-16.295,7.968c-16.727,0-23.703-13.77-23.703-28.129c0-18.097,11.004-26.949,23.381-26.949c9.523,0,13.975,4.82,16.295,8.164h0.221v-25.085h14.814V326.225z M624.663,316.291c9.418,0,13.121-7.273,13.121-15.05c0-8.359-2.537-16.814-12.703-16.814c-9.416,0-12.592,7.767-12.592,16.034C612.49,306.651,615.135,316.291,624.663,316.291z\"/></g><g fill=\"#ffff\"><path d=\"M268.323,226.771h-41.551v39.685C230.996,246.516,247.442,230.811,268.323,226.771z\"/><path d=\"M226.771,286.726v39.688h41.551C247.442,322.371,230.996,306.67,226.771,286.726z\"/><path d=\"M331.122,266.455V226.77h-41.552C310.449,230.811,326.892,246.516,331.122,266.455z\"/></g></svg>";
-var PLACEHOLDER_IMAGE_DATA_URI = "data:image/svg+xml,".concat(encodeURIComponent(PLACEHOLDER_SVG));
-var isPlaceholderImg = function (url) {
-  return !!url && url.includes(PLACEHOLDER_INDICATOR);
-};
-var ProductCardHorizontal = function (_a) {
-  _a.id;
-    var imageUrl = _a.imageUrl,
-    _b = _a.showProductImage,
-    showProductImage = _b === void 0 ? true : _b,
-    url = _a.url,
-    title = _a.title;
-    _a.description;
-    var price = _a.price,
-    productId = _a.productId,
-    button = _a.button,
-    utm = _a.utm,
-    _c = _a.className,
-    className = _c === void 0 ? "" : _c,
-    style = _a.style,
-    code = _a.code,
-    showProductPrice = _a.showProductPrice;
+const ProductCardHorizontal = ({
+  id,
+  imageUrl,
+  url,
+  title,
+  description,
+  price,
+  productId,
+  button,
+  utm,
+  className = ""
+}) => {
   if (!title) {
     return null;
   }
-  console.log("Rendering ProductCardHorizontal with props:", {
-    showProductPrice: showProductPrice,
-    price: price
-  });
-  var hasPlaceholderImage = showProductImage && (!imageUrl || isPlaceholderImg(imageUrl));
-  var productImage = hasPlaceholderImage ? PLACEHOLDER_IMAGE_DATA_URI : imageUrl;
-  var href = !utm || url && url.indexOf("utm") > -1 ? url : url + "?utm_source=".concat(utm.utmSource, "&utm_medium=").concat(utm.utmMedium, "&utm_campaign=").concat(utm.utmCampaign);
+  const href = !utm || url && url.indexOf("utm") > -1 ? url : url + `?utm_source=${utm.utmSource}&utm_medium=${utm.utmMedium}&utm_campaign=${utm.utmCampaign}`;
   return /*#__PURE__*/React.createElement("a", {
     href: href,
-    className: "".concat(styles$i.productCard, " ").concat(className),
-    "aria-label": "View product: ".concat(title)
+    className: `${styles$h.productCard} ${className}`,
+    "aria-label": `View product: ${title}`
   }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles$i.productWrapper, " ").concat(showProductImage ? hasPlaceholderImage ? styles$i.withPlaceholder : styles$i.withImage : ""),
-    style: style
-  }, showProductImage && /*#__PURE__*/React.createElement("div", {
-    className: styles$i.productImage
+    className: `${styles$h.productWrapper} ${imageUrl ? styles$h.withImage : ""}`
+  }, imageUrl && /*#__PURE__*/React.createElement("div", {
+    className: styles$h.productImage
   }, /*#__PURE__*/React.createElement(Image, {
-    src: productImage || PLACEHOLDER_IMAGE_DATA_URI,
-    alt: title,
-    className: hasPlaceholderImage ? styles$i.placeholderImage : "",
-    objectFit: hasPlaceholderImage ? "contain" : "cover",
-    fallbackSrc: PLACEHOLDER_IMAGE_DATA_URI
+    src: imageUrl,
+    alt: title
   })), /*#__PURE__*/React.createElement("div", {
-    className: styles$i.productTitleDescriptionWrapper
+    className: styles$h.productTitleDescriptionWrapper
   }, /*#__PURE__*/React.createElement("h3", {
-    className: styles$i.productTitle
-  }, title), productId || code ? /*#__PURE__*/React.createElement("p", {
-    className: styles$i.productId
-  }, productId || code) : null), /*#__PURE__*/React.createElement("div", {
-    className: styles$i.productPriceCtaWrapper
+    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$i.productPrice
-  }, showProductPrice ? price || "" : ""), button ? /*#__PURE__*/React.createElement(Button, {
-    className: styles$i.productButton,
+    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$i.productArrowIcon,
+    className: styles$h.productArrowIcon,
     "aria-hidden": "true"
   }))));
 };
+
 // Alias for backward compatibility
-var ProductCardHorizontalParts = ProductCardHorizontal;
+const ProductCardHorizontalParts = ProductCardHorizontal;
 
-var styles$g = {"productDetails":"ProductCardDetails-module__productDetails___-sx2l","spareCard":"ProductCardDetails-module__spareCard___vC1Ju"};
+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"]);
+const SpareCardAdapter = props => {
+  const {
+    spare,
+    ...rest
+  } = props;
   return /*#__PURE__*/React.createElement(ProductCardHorizontalParts, {
-    className: styles$g.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) || (props === null || props === void 0 ? void 0 : props.productPrice) || ""
-    // imageUrl={spare?.["img-product"] || spare?.image || ""}
-    ,
+    className: styles$f.spareCard,
+    url: spare?.url || spare?.link || "#",
+    title: spare?.name || spare?.title || "",
+    description: spare?.description || "",
+    price: spare?.priceValue || spare?.price || "",
+    imageUrl: spare?.["img-product"] || spare?.image || "",
     utm: props.utm,
-    showProductPrice: props.showProductPrice,
-    showProductImage: false,
     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");
-      }
+      onClick: () => window.open(spare?.url || 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,
-    utm = _a.utm,
-    _b = _a.className,
-    className = _b === void 0 ? "" : _b,
-    ProductCardComponent = _a.ProductCardComponent,
-    hidespares = _a.hidespares,
-    showProductPrice = _a.showProductPrice,
-    _c = _a.showProductImage,
-    showProductImage = _c === void 0 ? true : _c;
+const ProductCardDetails = ({
+  id,
+  imageUrl,
+  title,
+  description,
+  price,
+  code,
+  facets,
+  hit,
+  utm,
+  className = "",
+  ProductCardComponent,
+  hidespares
+}) => {
   // Build the hit object expected by ProductDetailsCard
-  var hitData = hit || {
-    id: id,
-    title: title,
-    description: description,
-    price: price,
-    code: code,
+  const hitData = hit || {
+    id,
+    title,
+    description,
+    price,
+    code,
     image: imageUrl
   };
   return /*#__PURE__*/React.createElement("div", {
-    className: styles$g.productDetails
+    className: styles$f.productDetails
   }, /*#__PURE__*/React.createElement(ProductDetailsCard, {
-    className: "".concat(className),
+    className: `${className}`,
     title: title,
-    imageUrl: showProductImage ? imageUrl : "",
+    imageUrl: imageUrl,
     imageAlt: title,
     hit: hitData,
     utm: utm,
     facets: facets,
     usePlainClasses: true,
     ProductCardComponent: ProductCardComponent || SpareCardAdapter,
-    hidespares: hidespares,
-    showProductPrice: showProductPrice,
-    showProductImage: showProductImage
+    hidespares: hidespares
   }));
 };
 
-var ContentCardBase = function (_a) {
-  var title = _a.title,
-    variant = _a.variant,
-    url = _a.url,
-    imageUrl = _a.imageUrl,
-    category = _a.category,
-    meta = _a.meta,
-    excerpt = _a.excerpt,
-    _b = _a.className,
-    className = _b === void 0 ? "" : _b,
-    style = _a.style,
-    ariaLabel = _a.ariaLabel,
-    contentMetaClassName = _a.contentMetaClassName,
-    contentCategoryClassName = _a.contentCategoryClassName,
-    contentMetaTextClassName = _a.contentMetaTextClassName,
-    contentTitleClassName = _a.contentTitleClassName,
-    contentExcerptClassName = _a.contentExcerptClassName;
-  console.log("variant in ContentCardBase:", variant);
-  var fallbackImage = "/assets/list-card.png";
-  var isCareerView = variant === "career-view";
-  var defaultAriaLabel = isCareerView ? "View career opportunity: ".concat(title) : "View content: ".concat(title);
-  return /*#__PURE__*/React.createElement("a", {
-    href: url,
-    className: className,
-    style: style,
-    "aria-label": ariaLabel || defaultAriaLabel
-  }, imageUrl && /*#__PURE__*/React.createElement("div", {
-    className: "content-card-image-wrapper"
-  }, /*#__PURE__*/React.createElement(Image, {
-    src: imageUrl,
-    alt: title,
-    className: "content-card-image",
-    aspectRatio: "16 / 9",
-    loading: "lazy",
-    decoding: "async",
-    fallbackSrc: fallbackImage
-  })), isCareerView ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("h3", {
-    className: contentTitleClassName
-  }, title), category && /*#__PURE__*/React.createElement("span", {
-    className: contentCategoryClassName
-  }, category), meta && /*#__PURE__*/React.createElement("span", {
-    className: contentMetaTextClassName
-  }, meta), /*#__PURE__*/React.createElement(Button, {
-    "aria-label": ariaLabel || defaultAriaLabel,
-    variant: "link-text-alt",
-    className: "career-button"
-  }, "See more")) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: contentMetaClassName
-  }, category && /*#__PURE__*/React.createElement("span", {
-    className: contentCategoryClassName
-  }, category), meta && /*#__PURE__*/React.createElement("span", {
-    className: contentMetaTextClassName
-  }, meta)), /*#__PURE__*/React.createElement("h3", {
-    className: contentTitleClassName
-  }, title), excerpt && /*#__PURE__*/React.createElement("p", {
-    className: contentExcerptClassName
-  }, excerpt), /*#__PURE__*/React.createElement(Button, {
-    "aria-label": ariaLabel || defaultAriaLabel
-  }, "Read More")));
-};
-
-var styles$f = {"contentCard":"ContentCardVertical-module__contentCard___EoYej","contentCard--instant-view":"ContentCardVertical-module__contentCard--instant-view___dsIUf","contentCard--results-view":"ContentCardVertical-module__contentCard--results-view___6mSHQ","contentMeta":"ContentCardVertical-module__contentMeta___l2GtO","contentCategory":"ContentCardVertical-module__contentCategory___78vrj","contentMetaText":"ContentCardVertical-module__contentMetaText___Rl-ln","contentTitle":"ContentCardVertical-module__contentTitle___rEiHm","contentExcerpt":"ContentCardVertical-module__contentExcerpt___5Gb2G"};
-
-var ContentCardVertical = function (_a) {
-  var id = _a.id,
-    title = _a.title,
-    url = _a.url,
-    imageUrl = _a.imageUrl,
-    category = _a.category,
-    meta = _a.meta,
-    excerpt = _a.excerpt,
-    _b = _a.className,
-    className = _b === void 0 ? "" : _b,
-    variant = _a.variant;
-  var cardClasses = classNames(styles$f.contentCard, styles$f["contentCard--".concat(variant)], className);
-  console.log("Rendering ContentCardVertical with variant:", variant);
-  return /*#__PURE__*/React.createElement(ContentCardBase, {
-    id: id,
-    variant: variant,
-    title: title,
-    url: url,
-    imageUrl: imageUrl,
-    category: category,
-    meta: meta,
-    excerpt: excerpt,
-    className: cardClasses,
-    contentMetaClassName: styles$f.contentMeta,
-    contentCategoryClassName: styles$f.contentCategory,
-    contentMetaTextClassName: styles$f.contentMetaText,
-    contentTitleClassName: styles$f.contentTitle,
-    contentExcerptClassName: styles$f.contentExcerpt
-  });
-};
-
 // Adapter component that maps props from AlgoliaDynamicSearchRaw to ProductCardHorizontal
 // AlgoliaDynamicSearchRaw passes: title, cardLink, productPrice, cta, hit (original data)
-var cardAdapter = function (props) {
-  var hit = props.hit,
-    title = props.title,
-    cardLink = props.cardLink,
-    productPrice = props.productPrice;
-    props.cta;
-    var showProductPrice = props.showProductPrice,
-    className = props.className,
-    queryType = props.queryType;
-  return /*#__PURE__*/React.createElement(ContentCardVertical, {
-    id: (hit === null || hit === void 0 ? void 0 : hit.id) || "",
-    variant: queryType && queryType === "careers" ? "career-view" : "content-view",
-    title: title || (hit === null || hit === void 0 ? void 0 : hit.title) || "",
-    url: cardLink || (hit === null || hit === void 0 ? void 0 : hit.link) || "#",
-    imageUrl: (hit === null || hit === void 0 ? void 0 : hit.image) || "",
-    category: (hit === null || hit === void 0 ? void 0 : hit.category) || "",
-    meta: showProductPrice ? productPrice || (hit === null || hit === void 0 ? void 0 : hit.price) || "" : "",
-    excerpt: (hit === null || hit === void 0 ? void 0 : hit.description) || "",
-    className: className
-  });
-};
-var ProductCardAdapter = function (props) {
-  var hit = props.hit,
-    title = props.title,
-    cardLink = props.cardLink,
-    productPrice = props.productPrice,
-    cta = props.cta,
-    showProductPrice = props.showProductPrice,
-    showProductImage = props.showProductImage,
-    className = props.className,
-    code = props.code,
-    utm = props.utm;
+const ProductCardAdapter = props => {
+  const {
+    hit,
+    title,
+    cardLink,
+    productPrice,
+    cta,
+    showProductPrice,
+    className,
+    code,
+    utm
+  } = props;
+  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 = (hit === null || hit === void 0 ? void 0 : hit.image) || "";
-  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";
+  const url = cardLink || hit?.link || "#";
+  const imageUrl = "";
+  const price = showProductPrice ? productPrice || hit?.price || "" : "";
+  const productTitle = title || hit?.title || "";
+  const productCode = code || hit?.code || "";
+  const buttonLabel = cta || "View Product";
   return /*#__PURE__*/React.createElement(ProductCardHorizontalParts, {
     imageUrl: imageUrl,
-    showProductImage: showProductImage,
     url: url,
     utm: utm,
     title: productTitle,
@@ -1163,99 +1021,69 @@ var ProductCardAdapter = function (props) {
     price: price,
     button: {
       label: buttonLabel,
-      onClick: function () {
-        return window.open(url, "_blank");
-      }
+      onClick: () => window.open(url, "_blank")
     },
-    className: className,
-    style: __assign({}, showProductImage ? {
-      minHeight: "130px"
-    } : {}),
-    code: productCode,
-    showProductPrice: showProductPrice
+    className: className
   });
 };
-var ProductCardDetailsAdapter = function (props) {
-  var hit = props.hit,
-    title = props.title;
-    props.cardLink;
-    var productPrice = props.productPrice;
-    props.cta;
-    var showProductPrice = props.showProductPrice,
-    showProductImage = props.showProductImage,
-    className = props.className,
-    code = props.code,
-    utm = props.utm,
-    facets = props.facets,
-    related_products = props.related_products,
-    hidespares = props.hidespares;
+const ProductCardDetailsAdapter = props => {
+  const {
+    hit,
+    title,
+    cardLink,
+    productPrice,
+    cta,
+    showProductPrice,
+    className,
+    code,
+    utm,
+    facets,
+    related_products,
+    hidespares
+  } = props;
   if (!title) {
     return null;
   }
   return /*#__PURE__*/React.createElement(ProductCardDetails, {
-    imageUrl: (hit === null || hit === void 0 ? void 0 : hit.image) || "",
+    imageUrl: 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,
+    description: hit?.description || "",
+    price: hit?.price || "" || productPrice,
+    code: hit?.code || "" || code,
     hit: hit,
     utm: utm,
     className: className,
     facets: facets,
-    relatedProducts: (hit === null || hit === void 0 ? void 0 : hit.related_products) || related_products,
-    hidespares: hidespares,
-    showProductPrice: showProductPrice,
-    showProductImage: showProductImage
+    relatedProducts: hit?.related_products || related_products,
+    hidespares: hidespares
   });
 };
-var ButtonAdapter = function (props) {
-  var label = props.label,
-    onClick = props.onClick,
-    className = props.className;
-  return /*#__PURE__*/React.createElement(Button, {
-    className: className,
-    onClick: onClick
-  }, label);
-};
-var AlgoliaDynamicSearchLeybold = function (props) {
-  var parentComponentProps = {
-    queryType: props === null || props === void 0 ? void 0 : props.queryType,
-    showProductPrice: props === null || props === void 0 ? void 0 : props.showProductPrice,
-    showProductImage: props === null || props === void 0 ? void 0 : props.showProductImage,
-    hitCta: props === null || props === void 0 ? void 0 : props.hitCta,
-    hidespares: props === null || props === void 0 ? void 0 : props.hidespares
-  };
-  var innerComponents = {
-    Card: function (innerProps) {
-      return cardAdapter(__assign(__assign({}, parentComponentProps), innerProps));
-    },
-    ProductCard: function (innerProps) {
-      return ProductCardAdapter(__assign(__assign({}, parentComponentProps), innerProps));
-    },
-    ProductDetailsCard: function (innerProps) {
-      return ProductCardDetailsAdapter(__assign(__assign({}, parentComponentProps), innerProps));
-    },
-    Button: ButtonAdapter
+const AlgoliaDynamicSearchLeybold = props => {
+  const 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;
+// Adapter to map QrForm's expected button props to our Button component
+
+const QrFormButtonAdapter = ({
+  label,
+  onClick,
+  buttonStyle = "primary",
+  href,
+  target,
+  type = "button",
+  element,
+  "data-page_target": pageTarget,
+  className
+}) => {
   // Map buttonStyle to our variant
-  var variant = buttonStyle === "secondary" ? "secondary" : "primary";
+  const 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", {
@@ -1274,19 +1102,18 @@ var QrFormButtonAdapter = function (_a) {
       size: "small"
     }, label));
   }
+
   // Otherwise render as button
   return /*#__PURE__*/React.createElement(Button, {
     variant: variant,
     type: type,
-    onClick: onClick ? function (e) {
-      return onClick(e);
-    } : undefined,
+    onClick: onClick ? e => onClick(e) : undefined,
     className: className,
     "data-page_target": pageTarget,
     size: "small"
   }, label);
 };
-var QrFormLeybold = function (props) {
+const QrFormLeybold = props => {
   return /*#__PURE__*/React.createElement("div", {
     className: "qr-journey-form-wrapper"
   }, /*#__PURE__*/React.createElement(QrForm, _extends({}, props, {
@@ -1296,17 +1123,16 @@ var QrFormLeybold = function (props) {
 
 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;
+const ModalCloseButton = ({
+  onClick,
+  ariaLabel = 'Close search',
+  className = ''
+}) => {
   return /*#__PURE__*/React.createElement("button", {
     type: "button",
     onClick: onClick,
     "aria-label": ariaLabel,
-    className: "".concat(styles$e.closeButton, " ").concat(className)
+    className: `${styles$e.closeButton} ${className}`
   }, /*#__PURE__*/React.createElement("span", {
     className: styles$e.closeButton__icon
   }, /*#__PURE__*/React.createElement("svg", {
@@ -1333,80 +1159,79 @@ var ModalCloseButton = function (_a) {
   }, "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 () {
+const SearchModal = ({
+  isOpen,
+  onClose,
+  title = 'Search',
+  children,
+  className = '',
+  stickyHeaderContent
+}) => {
+  const modalRef = useRef(null);
+  const previouslyFocusedElement = useRef(null);
+  useEffect(() => {
     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 () {
+    return () => {
       document.body.style.overflow = '';
     };
   }, [isOpen]);
-  useEffect(function () {
-    var handleEscape = function (event) {
+  useEffect(() => {
+    const handleEscape = event => {
       if (event.key === 'Escape' && isOpen) {
         onClose();
       }
     };
     document.addEventListener('keydown', handleEscape);
-    return function () {
-      return document.removeEventListener('keydown', handleEscape);
-    };
+    return () => document.removeEventListener('keydown', handleEscape);
   }, [isOpen, onClose]);
+
   // Focus trap implementation
-  useEffect(function () {
+  useEffect(() => {
     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) {
+    const modal = modalRef.current;
+    const focusableElements = modal.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
+    const firstElement = focusableElements[0];
+    const lastElement = focusableElements[focusableElements.length - 1];
+    const handleTab = 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();
+          lastElement?.focus();
         }
       } else {
         // Tab
         if (document.activeElement === lastElement) {
           event.preventDefault();
-          firstElement === null || firstElement === void 0 ? void 0 : firstElement.focus();
+          firstElement?.focus();
         }
       }
     };
     modal.addEventListener('keydown', handleTab);
-    return function () {
-      return modal.removeEventListener('keydown', handleTab);
-    };
+    return () => modal.removeEventListener('keydown', handleTab);
   }, [isOpen]);
   if (!isOpen) return null;
-  var handleOverlayClick = function (event) {
+  const handleOverlayClick = event => {
     if (event.target === event.currentTarget) {
       onClose();
     }
@@ -1421,7 +1246,7 @@ var SearchModal = function (_a) {
     "aria-modal": "true",
     "aria-label": title,
     tabIndex: -1,
-    className: "".concat(styles$e.modal, " ").concat(className)
+    className: `${styles$e.modal} ${className}`
   }, /*#__PURE__*/React.createElement("div", {
     className: styles$e.stickyHeader
   }, /*#__PURE__*/React.createElement(ModalCloseButton, {
@@ -1437,11 +1262,11 @@ var SearchModal = function (_a) {
 
 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;
+const SearchIcon = ({
+  className = ''
+}) => {
   return /*#__PURE__*/React.createElement("svg", {
-    className: "".concat(styles$d.searchIcon, " ").concat(className),
+    className: `${styles$d.searchIcon} ${className}`,
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
     fill: "none",
@@ -1459,17 +1284,15 @@ var SearchIcon = function (_a) {
   }));
 };
 
-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) {
+const SearchInput = ({
+  value,
+  onChange,
+  onKeyDown,
+  placeholder = 'Discover products, innovations, and resources...',
+  autoFocus = false,
+  className = ''
+}) => {
+  const handleChange = event => {
     onChange(event.target.value);
   };
   return /*#__PURE__*/React.createElement("input", {
@@ -1480,27 +1303,24 @@ var SearchInput = function (_a) {
     placeholder: placeholder,
     autoFocus: autoFocus,
     "aria-label": "Search",
-    className: "".concat(styles$d.searchInput, " ").concat(className)
+    className: `${styles$d.searchInput} ${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;
+const SearchSubmitButton = ({
+  onClick,
+  disabled = false,
+  ariaLabel = 'Search',
+  label = 'Search',
+  variant = 'instant',
+  className = ''
+}) => {
   return /*#__PURE__*/React.createElement("button", {
     type: "submit",
     onClick: onClick,
     disabled: disabled,
     "aria-label": ariaLabel,
-    className: "".concat(styles$d.submitButton, " ").concat(className)
+    className: `${styles$d.submitButton} ${className}`
   }, /*#__PURE__*/React.createElement("span", {
     className: styles$d.submitButton__text
   }, label), /*#__PURE__*/React.createElement("span", {
@@ -1508,34 +1328,32 @@ var SearchSubmitButton = function (_a) {
   }, /*#__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) {
+const SearchBar = ({
+  value,
+  onChange,
+  onSubmit,
+  placeholder,
+  autoFocus = false,
+  className = '',
+  variant = 'instant'
+}) => {
+  const handleSubmit = event => {
     event.preventDefault();
     onSubmit();
   };
-  var handleKeyDown = function (event) {
+  const handleKeyDown = event => {
     if (event.key === 'Enter') {
       event.preventDefault();
       onSubmit();
     }
   };
-  var handleClear = function () {
+  const handleClear = () => {
     onChange('');
   };
-  var showClearButton = value.length > 0;
+  const showClearButton = value.length > 0;
   return /*#__PURE__*/React.createElement("form", {
     onSubmit: handleSubmit,
-    className: "".concat(styles$d.searchBar, " ").concat(className)
+    className: `${styles$d.searchBar} ${className}`
   }, /*#__PURE__*/React.createElement("div", {
     className: styles$d.inputWrapper
   }, /*#__PURE__*/React.createElement(SearchIcon, null), /*#__PURE__*/React.createElement(SearchInput, {
@@ -1558,51 +1376,53 @@ var SearchBar = function (_a) {
 
 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) {
-  var id = _a.id,
-    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(ContentCardBase, {
-    id: id,
-    title: title,
-    url: url,
-    category: category,
-    meta: meta,
-    excerpt: excerpt,
+const ContentCardHorizontal = ({
+  id,
+  title,
+  url,
+  category,
+  meta,
+  excerpt,
+  className = "",
+  variant = "instant-view"
+}) => {
+  const cardClasses = classNames(styles$c.contentCard, styles$c[`contentCard--${variant}`], className);
+  return /*#__PURE__*/React.createElement("a", {
+    href: url,
     className: cardClasses,
-    contentMetaClassName: styles$c.contentMeta,
-    contentCategoryClassName: styles$c.contentCategory,
-    contentMetaTextClassName: styles$c.contentMetaText,
-    contentTitleClassName: styles$c.contentTitle,
-    contentExcerptClassName: styles$c.contentExcerpt
-  });
+    "aria-label": `View content: ${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;
+const FederatedInstantResultsLayout = ({
+  query,
+  products,
+  contents,
+  isLoadingProducts,
+  isLoadingContents,
+  productsError,
+  contentsError,
+  onSeeAllProducts,
+  onSeeAllContents,
+  onSeeAllCombined
+}) => {
   products.length + contents.length;
+
   // Show first 3 results from each category
-  var displayProducts = products.slice(0, 3);
-  var displayContents = contents.slice(0, 3);
+  const displayProducts = products.slice(0, 3);
+  const displayContents = contents.slice(0, 3);
   return /*#__PURE__*/React.createElement("div", {
     className: styles$b.instantResultsLayout
   }, /*#__PURE__*/React.createElement("div", {
@@ -1640,13 +1460,11 @@ var FederatedInstantResultsLayout = function (_a) {
     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", {
+  }, displayProducts.map((product, index) => /*#__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
@@ -1679,42 +1497,39 @@ var FederatedInstantResultsLayout = function (_a) {
     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)));
+  }, displayContents.map((content, index) => /*#__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;
+const ResultsCount = ({
+  count,
+  type,
+  className = ''
+}) => {
+  const label = count === 1 ? type.slice(0, -1) : type;
   return /*#__PURE__*/React.createElement("span", {
-    className: "".concat(styles$a.resultsCount, " ").concat(className)
+    className: `${styles$a.resultsCount} ${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;
+const SeeAllLinkButton = ({
+  onClick,
+  label = 'See all results',
+  className = ''
+}) => {
   return /*#__PURE__*/React.createElement("button", {
     type: "button",
     onClick: onClick,
-    className: "".concat(styles$9.seeAllButton, " ").concat(className)
+    className: `${styles$9.seeAllButton} ${className}`
   }, label, /*#__PURE__*/React.createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -1731,17 +1546,17 @@ var SeeAllLinkButton = function (_a) {
 
 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;
+const ResultsColumn = ({
+  title,
+  count,
+  isLoading,
+  error,
+  onSeeAll,
+  children,
+  className = ''
+}) => {
   return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles$8.resultsColumn, " ").concat(className)
+    className: `${styles$8.resultsColumn} ${className}`
   }, /*#__PURE__*/React.createElement("div", {
     className: styles$8.columnHeader
   }, /*#__PURE__*/React.createElement("h3", {
@@ -1764,7 +1579,7 @@ var ResultsColumn = function (_a) {
     className: styles$8.columnFooter
   }, /*#__PURE__*/React.createElement(SeeAllLinkButton, {
     onClick: onSeeAll,
-    label: "See all ".concat(title.toLowerCase())
+    label: `See all ${title.toLowerCase()}`
   }))));
 };
 
@@ -1786,23 +1601,23 @@ const faXmark = {
   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
+/**
+ * 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) {
+const FilterSearch = ({
+  value,
+  onChange,
+  placeholder = "Search",
+  className
+}) => {
+  const handleChange = e => {
     onChange(e.target.value);
   };
-  var handleClear = function () {
+  const handleClear = () => {
     onChange("");
   };
   return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles$7.filterSearch, " ").concat(className || "")
+    className: `${styles$7.filterSearch} ${className || ""}`
   }, !value && /*#__PURE__*/React.createElement(FontAwesomeIcon, {
     icon: faMagnifyingGlass,
     className: styles$7.searchIcon,
@@ -1824,43 +1639,42 @@ var FilterSearch = function (_a) {
   })));
 };
 
-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
+const CheckIcon = () => /*#__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 () {
+const FilterItem = ({
+  value,
+  onToggle,
+  className,
+  variant = 'desktop',
+  showCheckbox = true
+}) => {
+  const handleChange = () => {
     onToggle(value.value);
   };
-  var handleKeyDown = function (e) {
+  const handleKeyDown = 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 || ""),
+      className: `${styles$7.filterItemMobile} ${value.isRefined ? styles$7.filterItemMobileRefined : ''} ${className || ""}`,
       onClick: handleChange,
       onKeyDown: handleKeyDown,
       "aria-pressed": value.isRefined
@@ -1870,11 +1684,12 @@ var FilterItem = function (_a) {
       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 || ""),
+      className: `${styles$7.filterItemDesktopNoCheckbox} ${value.isRefined ? styles$7.filterItemDesktopRefined : ''} ${className || ""}`,
       onClick: handleChange,
       onKeyDown: handleKeyDown,
       "aria-pressed": value.isRefined
@@ -1884,16 +1699,17 @@ var FilterItem = function (_a) {
       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 || ""),
+    className: `${styles$7.filterItem} ${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)")
+    "aria-label": `${value.value} (${value.count} results)`
   }), /*#__PURE__*/React.createElement("div", {
     className: styles$7.filterCheckbox
   }, value.isRefined && /*#__PURE__*/React.createElement(CheckIcon, null)), /*#__PURE__*/React.createElement("span", {
@@ -1903,61 +1719,57 @@ var FilterItem = function (_a) {
   }, "(", value.count, ")"));
 };
 
-/**
- * FilterAccordion - Collapsible facet section with optional search
+/**
+ * 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];
+const FilterAccordion = ({
+  facet,
+  isExpanded,
+  onToggle,
+  onValueToggle,
+  className,
+  variant = 'desktop',
+  showCheckbox = true
+}) => {
+  const [searchQuery, setSearchQuery] = useState("");
+
   // Filter facet values based on search query
-  var filteredValues = useMemo(function () {
+  const filteredValues = useMemo(() => {
     if (!searchQuery.trim()) {
       return facet.values;
     }
-    var query = searchQuery.toLowerCase();
-    return facet.values.filter(function (value) {
-      return value.value.toLowerCase().includes(query);
-    });
+    const query = searchQuery.toLowerCase();
+    return facet.values.filter(value => value.value.toLowerCase().includes(query));
   }, [facet.values, searchQuery]);
-  var handleToggle = function () {
+  const handleToggle = () => {
     onToggle();
     // Clear search when collapsing
     if (isExpanded) {
       setSearchQuery("");
     }
   };
-  var handleKeyDown = function (e) {
+  const handleKeyDown = e => {
     if (e.key === "Enter" || e.key === " ") {
       e.preventDefault();
       handleToggle();
     }
   };
-  var handleValueToggle = function (value) {
+  const handleValueToggle = value => {
     onValueToggle(facet.attribute, value);
   };
   return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles$7.filterAccordion, " ").concat(className || "")
+    className: `${styles$7.filterAccordion} ${className || ""}`
   }, /*#__PURE__*/React.createElement("button", {
     type: "button",
-    className: "".concat(styles$7.accordionHeader, " ").concat(isExpanded ? styles$7.accordionHeaderExpanded : ""),
+    className: `${styles$7.accordionHeader} ${isExpanded ? styles$7.accordionHeaderExpanded : ""}`,
     onClick: handleToggle,
     onKeyDown: handleKeyDown,
     "aria-expanded": isExpanded,
-    "aria-controls": "accordion-".concat(facet.id)
+    "aria-controls": `accordion-${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 : ""),
+    className: `${styles$7.accordionIcon} ${isExpanded ? styles$7.accordionIconExpanded : ""}`,
     width: "16",
     height: "16",
     viewBox: "0 0 16 16",
@@ -1971,7 +1783,7 @@ var FilterAccordion = function (_a) {
     strokeLinecap: "round",
     strokeLinejoin: "round"
   }))), isExpanded && /*#__PURE__*/React.createElement("div", {
-    id: "accordion-".concat(facet.id),
+    id: `accordion-${facet.id}`,
     className: styles$7.accordionContent
   }, variant === 'desktop' && facet.searchable && facet.values.length > 5 && /*#__PURE__*/React.createElement("div", {
     className: styles$7.accordionSearch
@@ -1981,39 +1793,38 @@ var FilterAccordion = function (_a) {
     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", {
+  }, filteredValues.length > 0 ? filteredValues.map(value => /*#__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
+/**
+ * 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 () {
+const AppliedFilterTag = ({
+  attribute,
+  value,
+  label,
+  onRemove,
+  className
+}) => {
+  const handleRemove = () => {
     onRemove(attribute, value);
   };
-  var handleKeyDown = function (e) {
+  const handleKeyDown = e => {
     if (e.key === "Enter" || e.key === " ") {
       e.preventDefault();
       handleRemove();
     }
   };
   return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles$7.appliedFilterTag, " ").concat(className || "")
+    className: `${styles$7.appliedFilterTag} ${className || ""}`
   }, /*#__PURE__*/React.createElement("span", {
     className: styles$7.tagLabel
   }, label || value), /*#__PURE__*/React.createElement("button", {
@@ -2021,7 +1832,7 @@ var AppliedFilterTag = function (_a) {
     onClick: handleRemove,
     onKeyDown: handleKeyDown,
     className: styles$7.tagRemoveButton,
-    "aria-label": "Remove ".concat(label || value, " filter")
+    "aria-label": `Remove ${label || value} filter`
   }, /*#__PURE__*/React.createElement("svg", {
     width: "10",
     height: "10",
@@ -2038,19 +1849,20 @@ var AppliedFilterTag = function (_a) {
   }))));
 };
 
-/**
- * AppliedFilters - Shows all active filters as removable tags
+/**
+ * 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;
+const AppliedFilters = ({
+  facets,
+  onRemove,
+  onClearAll,
+  className
+}) => {
   // Extract all refined (selected) filters
-  var appliedFilters = useMemo(function () {
-    var filters = [];
-    facets.forEach(function (facet) {
-      facet.values.forEach(function (value) {
+  const appliedFilters = useMemo(() => {
+    const filters = [];
+    facets.forEach(facet => {
+      facet.values.forEach(value => {
         if (value.isRefined) {
           filters.push({
             attribute: facet.attribute,
@@ -2063,72 +1875,66 @@ var AppliedFilters = function (_a) {
     });
     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 || "")
+    className: `${styles$7.appliedFilters} ${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
-    });
-  })));
+  }, appliedFilters.map(filter => /*#__PURE__*/React.createElement(AppliedFilterTag, {
+    key: `${filter.attribute}-${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.
+/**
+ * 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;
+const FiltersPanel = ({
+  facets,
+  onFacetToggle,
+  isLoading = false,
+  className,
+  variant = 'desktop',
+  showCheckbox = true
+}) => {
   // 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];
+  const [expandedAccordions, setExpandedAccordions] = useState(() => {
+    // Initialize with default expanded facets
+    const expanded = new Set();
+    facets.forEach(facet => {
+      if (facet.defaultExpanded) {
+        expanded.add(facet.id);
+      }
+    });
+    return expanded;
+  });
+
   // Sync expansion state when facets change (e.g., new facets appear after refetch)
-  useEffect(function () {
-    setExpandedAccordions(function (prev) {
-      var next = new Set(prev);
+  useEffect(() => {
+    setExpandedAccordions(prev => {
+      const next = new Set(prev);
       // Add new facets with defaultExpanded
-      facets.forEach(function (facet) {
+      facets.forEach(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) {
+      const currentFacetIds = new Set(facets.map(f => f.id));
+      next.forEach(id => {
         if (!currentFacetIds.has(id)) {
           next.delete(id);
         }
@@ -2136,9 +1942,9 @@ var FiltersPanel = function (_a) {
       return next;
     });
   }, [facets]);
-  var handleAccordionToggle = useCallback(function (facetId) {
-    setExpandedAccordions(function (prev) {
-      var next = new Set(prev);
+  const handleAccordionToggle = useCallback(facetId => {
+    setExpandedAccordions(prev => {
+      const next = new Set(prev);
       if (next.has(facetId)) {
         next.delete(facetId);
       } else {
@@ -2147,16 +1953,16 @@ var FiltersPanel = function (_a) {
       return next;
     });
   }, []);
-  var handleValueToggle = useCallback(function (attribute, value) {
+  const handleValueToggle = useCallback((attribute, value) => {
     onFacetToggle(attribute, value);
   }, [onFacetToggle]);
-  var handleRemoveFilter = useCallback(function (attribute, value) {
+  const handleRemoveFilter = useCallback((attribute, value) => {
     onFacetToggle(attribute, value);
   }, [onFacetToggle]);
-  var handleClearAll = useCallback(function () {
+  const handleClearAll = useCallback(() => {
     // Remove all refined facets
-    facets.forEach(function (facet) {
-      facet.values.forEach(function (value) {
+    facets.forEach(facet => {
+      facet.values.forEach(value => {
         if (value.isRefined) {
           onFacetToggle(facet.attribute, value.value);
         }
@@ -2165,7 +1971,7 @@ var FiltersPanel = function (_a) {
   }, [facets, onFacetToggle]);
   if (isLoading) {
     return /*#__PURE__*/React.createElement("div", {
-      className: "".concat(styles$7.filtersPanel, " ").concat(className || "")
+      className: `${styles$7.filtersPanel} ${className || ""}`
     }, /*#__PURE__*/React.createElement("div", {
       className: styles$7.loadingState
     }, /*#__PURE__*/React.createElement("div", {
@@ -2176,73 +1982,70 @@ var FiltersPanel = function (_a) {
     return null;
   }
   return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles$7.filtersPanel, " ").concat(className || "")
+    className: `${styles$7.filtersPanel} ${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
-    });
-  })));
+  }, facets.map(facet => /*#__PURE__*/React.createElement(FilterAccordion, {
+    key: facet.id,
+    facet: facet,
+    isExpanded: expandedAccordions.has(facet.id),
+    onToggle: () => 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"
- * />
- * ```
+/**
+ * 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) {
+const ProductCardVertical = ({
+  id,
+  title,
+  url,
+  imageUrl,
+  productId,
+  description,
+  buttonLabel = 'BUY ONLINE',
+  onButtonClick,
+  className,
+  variant = 'desktop',
+  'data-force-state': forceState
+}) => {
+  const handleButtonClick = e => {
     e.preventDefault(); // Prevent card link navigation
     e.stopPropagation(); // Stop event bubbling
-    onButtonClick === null || onButtonClick === void 0 ? void 0 : onButtonClick();
+    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);
+  const cardClasses = classNames(styles$6.productCardVertical, styles$6[`productCardVertical--${variant}`], {
+    [styles$6['productCardVertical--hover']]: forceState === 'hover',
+    [styles$6['productCardVertical--focus']]: forceState === 'focus'
+  }, className);
   return /*#__PURE__*/React.createElement("a", {
     href: url,
     className: cardClasses,
-    "aria-label": "View product: ".concat(title),
+    "aria-label": `View product: ${title}`,
     "data-product-id": id
   }, imageUrl && /*#__PURE__*/React.createElement("div", {
     className: styles$6.productCardVertical__imageWrapper
@@ -2263,7 +2066,7 @@ var ProductCardVertical = function (_a) {
     type: "button",
     onClick: handleButtonClick,
     className: styles$6.productCardVertical__button,
-    "aria-label": "".concat(buttonLabel, " - ").concat(title),
+    "aria-label": `${buttonLabel} - ${title}`,
     tabIndex: -1
   }, /*#__PURE__*/React.createElement("span", null, buttonLabel), /*#__PURE__*/React.createElement(FontAwesomeIcon, {
     icon: faArrowUpRightFromSquare$1,
@@ -2273,19 +2076,17 @@ var ProductCardVertical = function (_a) {
 
 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;
+const ResultsList = ({
+  type,
+  products = [],
+  contents = [],
+  isLoading,
+  error,
+  className = ''
+}) => {
   if (isLoading) {
     return /*#__PURE__*/React.createElement("div", {
-      className: "".concat(styles$5.loadingState, " ").concat(className)
+      className: `${styles$5.loadingState} ${className}`
     }, /*#__PURE__*/React.createElement("div", {
       className: styles$5.spinner,
       "aria-label": "Loading..."
@@ -2293,15 +2094,15 @@ var ResultsList = function (_a) {
   }
   if (error) {
     return /*#__PURE__*/React.createElement("div", {
-      className: "".concat(styles$5.errorState, " ").concat(className)
+      className: `${styles$5.errorState} ${className}`
     }, /*#__PURE__*/React.createElement("p", null, error));
   }
-  var hasProducts = products.length > 0;
-  var hasContents = contents.length > 0;
-  var hasResults = hasProducts || hasContents;
+  const hasProducts = products.length > 0;
+  const hasContents = contents.length > 0;
+  const hasResults = hasProducts || hasContents;
   if (!hasResults) {
     return /*#__PURE__*/React.createElement("div", {
-      className: "".concat(styles$5.emptyState, " ").concat(className)
+      className: `${styles$5.emptyState} ${className}`
     }, /*#__PURE__*/React.createElement("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
@@ -2319,111 +2120,107 @@ var ResultsList = function (_a) {
       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"
-      }));
-    }));
+      className: `${styles$5.productsGrid} ${className}`
+    }, products.map(product => /*#__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"
-      })));
-    }));
+      className: `${styles$5.contentsList} ${className}`
+    }, contents.map((content, index) => /*#__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)
+    className: `${styles$5.resultsList} ${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", {
+  }, products.map(product => /*#__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"
-    })));
-  }))));
+  }, contents.map((content, index) => /*#__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"
- * />
- * ```
+/**
+ * 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);
+const TabButton = ({
+  label,
+  count,
+  isActive,
+  onClick,
+  variant = 'desktop',
+  className
+}) => {
+  const buttonClasses = classNames(styles$4.tabButton, styles$4[`tabButton--${variant}`], {
+    [styles$4['tabButton--active']]: isActive
+  }, className);
+
   // Split label to hide " RESULTS" on mobile
-  var labelParts = label.split(' RESULTS');
-  var mainLabel = labelParts[0];
-  var hasResults = labelParts.length > 1;
+  const labelParts = label.split(' RESULTS');
+  const mainLabel = labelParts[0];
+  const 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, '-')),
+    "aria-controls": `tabpanel-${label.toLowerCase().replace(/\s+/g, '-')}`,
     onClick: onClick,
     className: buttonClasses
   }, count !== undefined && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
@@ -2435,7 +2232,7 @@ var TabButton = function (_a) {
   }, " RESULTS")));
 };
 
-var AssistanceIcon = function (props) {
+const AssistanceIcon = props => {
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
     width: "87",
@@ -2450,42 +2247,39 @@ var AssistanceIcon = function (props) {
 
 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"
- * />
- * ```
+/**
+ * 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) {
+const AssistanceBanner = ({
+  title = 'Need Assistance?',
+  description = "Can't find what you're looking for? Our team is ready to help.",
+  linkText = 'Contact support',
+  linkUrl = '/contact',
+  onLinkClick,
+  className
+}) => {
+  const handleLinkClick = e => {
     if (onLinkClick) {
       e.preventDefault();
       onLinkClick();
     }
   };
-  var bannerClasses = classNames(styles$3.assistanceBanner, className);
+  const bannerClasses = classNames(styles$3.assistanceBanner, className);
   return /*#__PURE__*/React.createElement("div", {
     className: bannerClasses
   }, /*#__PURE__*/React.createElement(AssistanceIcon, {
@@ -2518,105 +2312,111 @@ var AssistanceBanner = function (_a) {
 
 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>
- * ```
+/**
+ * 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);
+const FilterDrawer = ({
+  isOpen,
+  onClose,
+  children,
+  className
+}) => {
+  const drawerRef = useRef(null);
+  const previouslyFocusedElement = useRef(null);
+
   // Focus management
-  useEffect(function () {
+  useEffect(() => {
     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 () {
+    return () => {
       document.body.style.overflow = '';
     };
   }, [isOpen]);
+
   // Escape key handler
-  useEffect(function () {
-    var handleEscape = function (event) {
+  useEffect(() => {
+    const handleEscape = event => {
       if (event.key === 'Escape' && isOpen) {
         onClose();
       }
     };
     document.addEventListener('keydown', handleEscape);
-    return function () {
-      return document.removeEventListener('keydown', handleEscape);
-    };
+    return () => document.removeEventListener('keydown', handleEscape);
   }, [isOpen, onClose]);
+
   // Focus trap implementation
-  useEffect(function () {
+  useEffect(() => {
     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) {
+    const drawer = drawerRef.current;
+    const focusableElements = drawer.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
+    const firstElement = focusableElements[0];
+    const lastElement = focusableElements[focusableElements.length - 1];
+    const handleTab = 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();
+          lastElement?.focus();
         }
       } else {
         // Tab
         if (document.activeElement === lastElement) {
           event.preventDefault();
-          firstElement === null || firstElement === void 0 ? void 0 : firstElement.focus();
+          firstElement?.focus();
         }
       }
     };
     drawer.addEventListener('keydown', handleTab);
-    return function () {
-      return drawer.removeEventListener('keydown', handleTab);
-    };
+    return () => drawer.removeEventListener('keydown', handleTab);
   }, [isOpen]);
   if (!isOpen) return null;
-  var handleOverlayClick = function (event) {
+  const handleOverlayClick = 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);
+  const overlayClasses = classNames(styles$2.drawerOverlay, {
+    [styles$2['drawerOverlay--open']]: isOpen
+  });
+  const panelClasses = classNames(styles$2.drawerPanel, {
+    [styles$2['drawerPanel--open']]: isOpen
+  }, className);
   return /*#__PURE__*/React.createElement("div", {
     className: overlayClasses,
     onClick: handleOverlayClick,
@@ -2640,63 +2440,63 @@ var FilterDrawer = function (_a) {
   }, 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;
+const FederatedResultsView = ({
+  query,
+  onQueryChange,
+  onSearchSubmit,
+  activeTab,
+  onTabChange,
+  products,
+  contents,
+  isLoadingProducts,
+  isLoadingContents,
+  productsError,
+  contentsError,
+  currentPage,
+  totalPages,
+  onPageChange,
+  facets,
+  onFacetToggle,
+  isFilterDrawerOpen,
+  onFilterDrawerToggle,
+  onFilterDrawerClose
+}) => {
+  const isLoading = activeTab === "products" && isLoadingProducts || activeTab === "content" && isLoadingContents;
+  const error = activeTab === "products" ? productsError : contentsError;
+
   // Filter results based on active tab
-  var displayProducts = activeTab === "content" ? [] : products;
-  var displayContents = activeTab === "products" ? [] : contents;
+  const displayProducts = activeTab === "content" ? [] : products;
+  const 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;
-    });
+  const handleContentCategorySelect = useCallback((attribute, value) => {
+    const facet = facets.find(f => f.attribute === attribute);
     if (!facet) return;
+
     // Clear ALL values in this facet first
-    facet.values.forEach(function (v) {
+    facet.values.forEach(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;
-    });
+    const clickedValue = facet.values.find(v => 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;
-      });
-    });
+  const hasAppliedFilters = useMemo(() => {
+    return facets.some(facet => facet.values.some(value => value.isRefined));
   }, [facets]);
+
   // Track previous filter state to detect transitions
-  var prevHasAppliedFilters = useRef(hasAppliedFilters);
+  const prevHasAppliedFilters = useRef(hasAppliedFilters);
+
   // Auto-close drawer when transitioning FROM filters applied TO no filters (mobile only)
-  useEffect(function () {
+  useEffect(() => {
     // Only close if we HAD filters and now have NONE (not on initial open)
     if (prevHasAppliedFilters.current && !hasAppliedFilters && isFilterDrawerOpen && onFilterDrawerClose) {
       onFilterDrawerClose();
@@ -2706,7 +2506,7 @@ var FederatedResultsView = function (_a) {
   return /*#__PURE__*/React.createElement("div", {
     className: styles$5.resultsView
   }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles$5.searchBarWrapper, " ").concat(styles$5.searchBarDesktopOnly)
+    className: `${styles$5.searchBarWrapper} ${styles$5.searchBarDesktopOnly}`
   }, /*#__PURE__*/React.createElement(SearchBar, {
     value: query,
     onChange: onQueryChange,
@@ -2714,7 +2514,7 @@ var FederatedResultsView = function (_a) {
     placeholder: "Refine your search...",
     variant: "results"
   })), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles$5.tabsContainer, " ").concat(styles$5.tabsContainerDesktopOnly)
+    className: `${styles$5.tabsContainer} ${styles$5.tabsContainerDesktopOnly}`
   }, /*#__PURE__*/React.createElement("div", {
     className: styles$5.tabs,
     role: "tablist"
@@ -2722,9 +2522,7 @@ var FederatedResultsView = function (_a) {
     label: "WEB SHOP RESULTS",
     count: products.length,
     isActive: activeTab === "products",
-    onClick: function () {
-      return onTabChange("products");
-    },
+    onClick: () => onTabChange("products"),
     variant: "desktop"
   }), /*#__PURE__*/React.createElement("div", {
     className: styles$5.tabSeparator
@@ -2732,9 +2530,7 @@ var FederatedResultsView = function (_a) {
     label: "WEBSITE RESULTS",
     count: contents.length,
     isActive: activeTab === "content",
-    onClick: function () {
-      return onTabChange("content");
-    },
+    onClick: () => onTabChange("content"),
     variant: "desktop"
   })), onFilterDrawerToggle && /*#__PURE__*/React.createElement("button", {
     type: "button",
@@ -2763,9 +2559,9 @@ var FederatedResultsView = function (_a) {
   })), /*#__PURE__*/React.createElement("main", {
     className: styles$5.mainContent
   }, /*#__PURE__*/React.createElement("div", {
-    id: "tabpanel-".concat(activeTab),
+    id: `tabpanel-${activeTab}`,
     role: "tabpanel",
-    "aria-labelledby": "tab-".concat(activeTab)
+    "aria-labelledby": `tab-${activeTab}`
   }, /*#__PURE__*/React.createElement(ResultsList, {
     type: activeTab,
     products: displayProducts,
@@ -2780,7 +2576,7 @@ var FederatedResultsView = function (_a) {
     onPageChange: onPageChange,
     maxVisiblePages: 10,
     showPrevious: false,
-    ariaLabel: "".concat(activeTab === "products" ? "Products" : "Content", " pagination")
+    ariaLabel: `${activeTab === "products" ? "Products" : "Content"} pagination`
   }))))), onFilterDrawerClose && /*#__PURE__*/React.createElement(FilterDrawer, {
     isOpen: isFilterDrawerOpen || false,
     onClose: onFilterDrawerClose
@@ -2794,76 +2590,73 @@ var FederatedResultsView = function (_a) {
 
 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}
- * />
- * ```
+/**
+ * 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;
+const FederatedSearchExperience = ({
+  isOpen,
+  onClose,
+  query,
+  onQueryChange,
+  onSearchSubmit,
+  products,
+  contents,
+  isLoadingProducts,
+  isLoadingContents,
+  productsError,
+  contentsError,
+  onSeeAllProducts,
+  onSeeAllContents,
+  onSeeAllCombined,
+  activeView,
+  onChangeView,
+  activeTab,
+  onTabChange,
+  currentPage,
+  totalPages,
+  onPageChange,
+  facets,
+  onFacetToggle,
+  isFilterDrawerOpen,
+  onFilterDrawerToggle,
+  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;
-      });
-    });
+  const hasAppliedFilters = useMemo(() => {
+    return facets.some(facet => facet.values.some(value => value.isRefined));
   }, [facets]);
   return /*#__PURE__*/React.createElement(SearchModal, {
     isOpen: isOpen,
@@ -2895,9 +2688,7 @@ var FederatedSearchExperience = function (_a) {
       label: "WEB SHOP RESULTS",
       count: products.length,
       isActive: activeTab === "products",
-      onClick: function () {
-        return onTabChange("products");
-      },
+      onClick: () => onTabChange("products"),
       variant: "mobile"
     }), /*#__PURE__*/React.createElement("div", {
       className: styles$1.tabSeparator
@@ -2905,9 +2696,7 @@ var FederatedSearchExperience = function (_a) {
       label: "WEBSITE RESULTS",
       count: contents.length,
       isActive: activeTab === "content",
-      onClick: function () {
-        return onTabChange("content");
-      },
+      onClick: () => onTabChange("content"),
       variant: "mobile"
     })), /*#__PURE__*/React.createElement("div", {
       className: styles$1.mobileFilterButtonWrapper
@@ -2932,7 +2721,7 @@ var FederatedSearchExperience = function (_a) {
   }, /*#__PURE__*/React.createElement("div", {
     className: styles$1.searchExperience
   }, activeView === "instant" && /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles$1.searchBarSection, " ").concat(styles$1.searchBarDesktopOnly)
+    className: `${styles$1.searchBarSection} ${styles$1.searchBarDesktopOnly}`
   }, /*#__PURE__*/React.createElement(SearchBar, {
     value: query,
     onChange: onQueryChange,
@@ -3000,14 +2789,13 @@ var FederatedSearchExperience = function (_a) {
 
 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) {
+const SearchTriggerButton = ({
+  onOpen,
+  ariaLabel = 'Open search',
+  label,
+  className = ''
+}) => {
+  const handleKeyDown = event => {
     if (event.key === 'Enter' || event.key === ' ') {
       event.preventDefault();
       onOpen();
@@ -3018,7 +2806,7 @@ var SearchTriggerButton = function (_a) {
     onClick: onOpen,
     onKeyDown: handleKeyDown,
     "aria-label": ariaLabel,
-    className: "".concat(styles.searchTrigger, " ").concat(className)
+    className: `${styles.searchTrigger} ${className}`
   }, /*#__PURE__*/React.createElement("svg", {
     className: styles.searchIcon,
     xmlns: "http://www.w3.org/2000/svg",
@@ -3040,5 +2828,5 @@ var SearchTriggerButton = function (_a) {
   }, label));
 };
 
-export { AlgoliaDynamicSearchLeybold as AlgoliaDynamicSearch, AlgoliaDynamicSearchLeybold, AppliedFilterTag, AppliedFilters, Button, ContentCardBase, 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 };
+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