@wix/editor-react-components 1.2153.0

package/dist/site/components/Menu/component.js

@@ -0,0 +1,2285 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { c as clsx } from "../chunks/clsx.js";
+import { useService } from "@wix/services-manager-react";
+import { d as definitionExports$3 } from "../chunks/index11.js";
+import { r as requireBuild } from "../chunks/index7.js";
+import { d as definitionExports$4 } from "../chunks/index5.js";
+import { M as MenuAnimationName, d as defaultTranslations, a as MenuOrientation, A as AnimationPhase, V as VerticalDropdownDisplay, D as DropdownAnimationName, H as HamburgerMenuAnimationName, b as MenuParts, s as selectors, u as useAnimationState, c as ARIA_LABEL_NAMESPACE, t as translationsKeys } from "../chunks/constants23.js";
+import React__default, { createContext, useContext, useMemo, useState, useCallback, useRef, useEffect, useLayoutEffect } from "react";
+import { p as presetWrapperStyles } from "../chunks/presetWrapper.module.js";
+import { g as getItemDepthSelector, r as rootItemDepthLevel, s as subItemDepthLevel, a as subSubItemDepthLevel } from "../chunks/utils2.js";
+import { d as debounce } from "../chunks/performanceUtils.js";
+import { f as formatClassNames } from "../chunks/classNames.js";
+import { L as Link } from "../chunks/Link.js";
+import { i as isEmptyObject, a as getDataAttributes } from "../chunks/dataUtils.js";
+import { u as useResizeObserver } from "../chunks/useResizeObserver.js";
+import { d as directionStyles } from "../chunks/direction.module.js";
+import { d as definitionExports$2 } from "../chunks/index2.js";
+import { B as Button } from "../chunks/Button.js";
+import { f as convertA11yKeysToHtmlFormat } from "../chunks/a11y.js";
+var definition$1 = {};
+var hasRequiredDefinition$1;
+function requireDefinition$1() {
+  if (hasRequiredDefinition$1) return definition$1;
+  hasRequiredDefinition$1 = 1;
+  Object.defineProperty(definition$1, "__esModule", { value: true });
+  definition$1.AnchorsDefinition = void 0;
+  const services_definitions_1 = /* @__PURE__ */ requireBuild();
+  definition$1.AnchorsDefinition = (0, services_definitions_1.defineService)("viewer-core/viewer-service-anchors");
+  return definition$1;
+}
+var definitionExports$1 = /* @__PURE__ */ requireDefinition$1();
+const EMPTY_ANCHOR_URL = "#";
+const MenuContext = createContext({
+  items: [],
+  currentUrl: EMPTY_ANCHOR_URL,
+  translations: defaultTranslations,
+  menuStyleId: "",
+  customClassNames: [],
+  getAnimationPackage: () => MenuAnimationName.None,
+  navAriaLabel: "",
+  isHamburgerMenuOpened: void 0,
+  setIsHamburgerMenuOpened: void 0,
+  a11yProps: {}
+});
+const useMenuContext = () => useContext(MenuContext);
+const MenuContextProvider = ({
+  children,
+  items,
+  partToPreviewStateMap,
+  currentUrl,
+  activeAnchor,
+  translations,
+  menuStyleId,
+  customClassNames,
+  getAnimationPackage,
+  navAriaLabel,
+  isHamburgerMenuOpened,
+  setIsHamburgerMenuOpened,
+  a11yProps,
+  dropdownAnchor
+}) => {
+  const contextValue = useMemo(
+    () => ({
+      items,
+      partToPreviewStateMap,
+      currentUrl,
+      activeAnchor,
+      translations,
+      menuStyleId,
+      customClassNames,
+      getAnimationPackage,
+      navAriaLabel,
+      isHamburgerMenuOpened,
+      setIsHamburgerMenuOpened,
+      a11yProps,
+      dropdownAnchor
+    }),
+    [
+      items,
+      partToPreviewStateMap,
+      currentUrl,
+      activeAnchor,
+      translations,
+      menuStyleId,
+      customClassNames,
+      getAnimationPackage,
+      navAriaLabel,
+      isHamburgerMenuOpened,
+      setIsHamburgerMenuOpened,
+      a11yProps,
+      dropdownAnchor
+    ]
+  );
+  return /* @__PURE__ */ jsx(MenuContext.Provider, { value: contextValue, children });
+};
+const animationNone = "animation-none__XVWlD";
+const animationCalm = "animation-calm__3dYT3";
+const animationWash = "animation-wash__QCeg5";
+const animationCircle = "animation-circle__O-RL2";
+const animationUnderline = "animation-underline__2sdsW";
+const animationBullet = "animation-bullet__x4Y13";
+const animationWave = "animation-wave__8hNHr";
+const animationClasses$1 = {
+  "animation-none": "animation-none__XVWlD",
+  animationNone,
+  "animation-calm": "animation-calm__3dYT3",
+  animationCalm,
+  "animation-wash": "animation-wash__QCeg5",
+  animationWash,
+  "animation-circle": "animation-circle__O-RL2",
+  animationCircle,
+  "animation-underline": "animation-underline__2sdsW",
+  animationUnderline,
+  "animation-bullet": "animation-bullet__x4Y13",
+  animationBullet,
+  "animation-wave": "animation-wave__8hNHr",
+  animationWave
+};
+const isSafari = () => /^((?!chrome|android).)*safari/i.test(navigator == null ? void 0 : navigator.userAgent);
+const easeOutQuart = (time) => 1 - Math.pow(1 - time, 4);
+const scrollLeftProperty = "scrollLeft";
+const scrollSafari = (element, moveTo, duration = 700) => {
+  const ease = easeOutQuart;
+  const startPoint = element[scrollLeftProperty];
+  let start = null;
+  const step = (timestamp) => {
+    if (start === null) {
+      start = timestamp;
+    }
+    const time = Math.min(1, (timestamp - start) / duration);
+    element[scrollLeftProperty] = startPoint + ease(time) * (moveTo - startPoint);
+    if (time === 1) {
+      start = null;
+    } else {
+      requestAnimationFrame(step);
+    }
+  };
+  if (startPoint !== moveTo) {
+    requestAnimationFrame(step);
+  }
+};
+const scrollNative = (element, moveTo) => {
+  element.scrollTo({
+    left: moveTo,
+    top: 0,
+    behavior: "smooth"
+  });
+};
+const scrollTo = (element, moveTo) => (isSafari() ? scrollSafari : scrollNative)(element, moveTo);
+const getIsRTL = (node) => window.getComputedStyle(node).direction === "rtl";
+const rootLevelMenuItemSelector = getItemDepthSelector(rootItemDepthLevel);
+const scrollPageButtonSelector = '[data-menu-scroll-action="page"]';
+const getMenuItemNodes = (menuNode, shouldCheckRTL = true) => {
+  const menuItems = Array.from(
+    (menuNode == null ? void 0 : menuNode.querySelectorAll(rootLevelMenuItemSelector)) || []
+  ).map(({ firstChild }) => firstChild);
+  return shouldCheckRTL && getIsRTL(menuNode.firstChild) ? [...menuItems].reverse() : menuItems;
+};
+const getScrollButtonWidth = (menuNode) => {
+  var _a;
+  return ((_a = menuNode.querySelector(scrollPageButtonSelector)) == null ? void 0 : _a.getBoundingClientRect().width) || 0;
+};
+const getBounds = (node) => {
+  const { left, width } = node.getBoundingClientRect();
+  return [left, width + left];
+};
+const getInnerBounds = (node) => {
+  const [left, right] = getBounds(node);
+  const style = getComputedStyle(node);
+  const [paddingLeft, paddingRight, borderLeftWidth, borderRightWidth] = [
+    style.paddingLeft,
+    style.paddingRight,
+    style.borderLeftWidth,
+    style.borderRightWidth
+  ].map((n) => parseFloat(n));
+  return [
+    left + paddingLeft + borderLeftWidth,
+    right - paddingRight - borderRightWidth
+  ];
+};
+const getLastFullyVisibleItemIndexMovingRight = (menuItemsBounds, menuRight) => {
+  const index = [...menuItemsBounds].findIndex(
+    ([, right]) => right >= menuRight
+  );
+  return index === -1 ? 0 : index;
+};
+const MINIMAL_IMPORTANT_SCROLL_DISTANCE = 15;
+const scrollMenu = (menuNode, direction) => {
+  const isForward = direction === "forward";
+  const menuItemNodes = isForward ? getMenuItemNodes(menuNode, false) : getMenuItemNodes(menuNode, false).reverse();
+  const isRTL = getIsRTL(menuNode.firstChild);
+  const menuItemsBounds = menuItemNodes.map(getBounds);
+  const [menuLeft, menuRight] = getInnerBounds(menuNode);
+  const isMovingLeft = isForward ? isRTL : !isRTL;
+  const itemIndex = isMovingLeft ? getLastFullyVisibleItemIndexMovingLeft(menuItemsBounds, menuLeft) : getLastFullyVisibleItemIndexMovingRight(menuItemsBounds, menuRight);
+  if (itemIndex < menuItemsBounds.length) {
+    scrollToMenuItem(
+      menuNode,
+      menuItemNodes[itemIndex],
+      itemIndex + 1 < menuItemNodes.length ? menuItemNodes[itemIndex + 1] : void 0
+    );
+  }
+};
+const getLastFullyVisibleItemIndexMovingLeft = (menuItemsBounds, menuLeft) => {
+  const index = menuItemsBounds.findIndex(([left]) => left <= menuLeft);
+  return index === -1 ? 0 : index;
+};
+const scrollToMenuItem = (menuNode, menuItem, nextItem) => {
+  const [menuLeft, menuRight] = getInnerBounds(menuNode);
+  const [itemLeft, itemRight] = getBounds(menuItem);
+  if (itemLeft >= menuLeft && itemRight <= menuRight) {
+    return;
+  }
+  const realLeft = menuLeft + getScrollButtonWidth(menuNode);
+  if (Math.abs(itemLeft - realLeft) < MINIMAL_IMPORTANT_SCROLL_DISTANCE && nextItem) {
+    scrollToMenuItem(menuNode, nextItem);
+    return;
+  }
+  scrollTo(menuNode, menuNode.scrollLeft + itemLeft - realLeft);
+};
+const DEBOUNCE_DURATION = 100;
+const useScroll = (ref) => {
+  const [isScrollable, setIsScrollable] = useState(false);
+  const [isScrollBackwardButtonVisible, setIsScrollBackwardButtonVisible] = useState(false);
+  const [isScrollForwardButtonVisible, setIsScrollForwardButtonVisible] = useState(false);
+  const handleScrollBackward = useCallback(() => {
+    if (ref.current && isScrollable) {
+      scrollMenu(ref.current, "backward");
+    }
+  }, [isScrollable, ref]);
+  const handleScrollForward = useCallback(() => {
+    if (ref.current && isScrollable) {
+      scrollMenu(ref.current, "forward");
+    }
+  }, [isScrollable, ref]);
+  const updateScrollState = useCallback(
+    debounce(() => {
+      const { current: nav } = ref;
+      if (!nav) {
+        return;
+      }
+      const { scrollWidth, clientWidth } = nav;
+      const scrollLeft = Math.abs(nav.scrollLeft);
+      const isMenuScrollable = clientWidth < scrollWidth;
+      setIsScrollable(isMenuScrollable);
+      setIsScrollBackwardButtonVisible(
+        isMenuScrollable && scrollLeft > MINIMAL_IMPORTANT_SCROLL_DISTANCE
+      );
+      setIsScrollForwardButtonVisible(
+        isMenuScrollable && scrollLeft < scrollWidth - clientWidth - MINIMAL_IMPORTANT_SCROLL_DISTANCE
+      );
+    }, DEBOUNCE_DURATION),
+    []
+  );
+  const updateScrolledLeftCSSVar = useCallback(() => {
+    const { current: nav } = ref;
+    if (!nav) {
+      return;
+    }
+    nav.style.setProperty("--scrolled-left", `${-nav.scrollLeft}px`);
+  }, [ref]);
+  const handleOnScroll = useCallback(() => {
+    updateScrollState();
+    updateScrolledLeftCSSVar();
+  }, [updateScrollState, updateScrolledLeftCSSVar]);
+  return {
+    isScrollable,
+    updateScrollState,
+    handleOnScroll,
+    handleScrollForward,
+    handleScrollBackward,
+    isScrollBackwardButtonVisible,
+    isScrollForwardButtonVisible
+  };
+};
+const createSDKAction = (item2, selected2, sdkAction) => sdkAction && ((e) => {
+  sdkAction == null ? void 0 : sdkAction(e, {
+    ...item2,
+    selected: selected2
+  });
+});
+const getMenuOrientation = (itemRef) => {
+  if (!(itemRef == null ? void 0 : itemRef.current)) {
+    return;
+  }
+  const orientation = getComputedStyle(itemRef.current).getPropertyValue(
+    "--orientation"
+  );
+  return orientation;
+};
+const getVerticalDropdownDispaly = (itemRef) => {
+  if (!(itemRef == null ? void 0 : itemRef.current)) {
+    return;
+  }
+  const verticalDropdownDisplay = getComputedStyle(
+    itemRef.current
+  ).getPropertyValue(
+    "--vertical-dropdown-display"
+  );
+  return verticalDropdownDisplay;
+};
+const getIsAlwaysOpen = (itemRef) => {
+  const isVertical = getMenuOrientation(itemRef) === MenuOrientation.Vertical;
+  const verticalDropdownDisplay = getVerticalDropdownDispaly(itemRef);
+  const isAlwaysOpen = isVertical && verticalDropdownDisplay === VerticalDropdownDisplay.AlwaysOpen;
+  return isAlwaysOpen;
+};
+const getIsVerticalExpanded = (isHorizontal, isOpen, dropdownAnimationState) => {
+  const isVertical = !isHorizontal;
+  const isDropdownAnimationExiting = [
+    AnimationPhase.Exit,
+    AnimationPhase.ExitActive
+  ].includes(dropdownAnimationState.phase);
+  return isVertical && isOpen && !isDropdownAnimationExiting;
+};
+const createEventListeners = ({
+  showDropdown,
+  hideDropdown,
+  itemRef,
+  getMenuItemAnimationName,
+  initEnterAnimation,
+  initExitAnimation,
+  isOpen,
+  hasLink,
+  dropdownAnimationState
+}) => {
+  const shouldDropdownBeHidden = () => {
+    const isHorizontal = getMenuOrientation(itemRef) === MenuOrientation.Horizontal;
+    const isAlwaysOpen = getIsAlwaysOpen(itemRef);
+    const isVerticalExpanded = getIsVerticalExpanded(
+      isHorizontal,
+      isOpen,
+      dropdownAnimationState
+    );
+    if (!hasLink && (isAlwaysOpen || isVerticalExpanded)) {
+      return false;
+    }
+    return !!isHorizontal;
+  };
+  return {
+    onMouseEnter: () => {
+      const isHorizontal = getMenuOrientation(itemRef) === MenuOrientation.Horizontal;
+      const isAlwaysOpen = getIsAlwaysOpen(itemRef);
+      const isVerticalExpanded = getIsVerticalExpanded(
+        isHorizontal,
+        isOpen,
+        dropdownAnimationState
+      );
+      if (!hasLink && (isAlwaysOpen || isVerticalExpanded)) {
+        return;
+      }
+      const animationName = getMenuItemAnimationName();
+      if (isHorizontal) {
+        showDropdown();
+      }
+      initEnterAnimation(animationName);
+    },
+    onMouseLeave: () => {
+      const animationName = getMenuItemAnimationName();
+      if (shouldDropdownBeHidden()) {
+        hideDropdown();
+      }
+      initExitAnimation(animationName);
+    },
+    onBlur: (event) => {
+      const isOutsideElement = !event.relatedTarget || !event.currentTarget.contains(event.relatedTarget);
+      const animationName = getMenuItemAnimationName();
+      if (shouldDropdownBeHidden() && isOutsideElement) {
+        hideDropdown();
+      }
+      initExitAnimation(animationName);
+    }
+  };
+};
+const listItem$1 = "listItem__Vh8iZ";
+const itemWrapper = "itemWrapper__sn71X";
+const labelContainer = "labelContainer__E4y-p";
+const label = "label__BBchK";
+const dropdownToggleButton = "dropdownToggleButton__nisoC";
+const horizontalDropdown = "horizontalDropdown__TETsA";
+const coverAllSpace = "coverAllSpace__Iwj6W";
+const srOnly = "srOnly__AGv2l";
+const dropdownIcon = "dropdownIcon__1JsUn";
+const noDropdownItems = "noDropdownItems__P9nB3";
+const horizontalDropdownDisplayWrapper = "horizontalDropdownDisplayWrapper__9Ep15";
+const verticalDropdownDisplayWrapper = "verticalDropdownDisplayWrapper__ERDA-";
+const verticalDropdown = "verticalDropdown__PYfx4";
+const expandedDropdown = "expandedDropdown__LDSbF";
+const divider = "divider__Pyztn";
+const submenuToggleWrapper = "submenuToggleWrapper__RaD4x";
+const submenuToggleLabel = "submenuToggleLabel__rbbmv";
+const hiddenToggle = "hiddenToggle__PMEFN";
+const classes$6 = {
+  listItem: listItem$1,
+  itemWrapper,
+  labelContainer,
+  label,
+  dropdownToggleButton,
+  horizontalDropdown,
+  coverAllSpace,
+  srOnly,
+  dropdownIcon,
+  noDropdownItems,
+  horizontalDropdownDisplayWrapper,
+  verticalDropdownDisplayWrapper,
+  verticalDropdown,
+  expandedDropdown,
+  divider,
+  submenuToggleWrapper,
+  submenuToggleLabel,
+  hiddenToggle
+};
+const MENU_ITEM_ANIMATION_CONFIG = {
+  [MenuAnimationName.None]: { name: MenuAnimationName.None, duration: 0 },
+  [MenuAnimationName.Calm]: { name: MenuAnimationName.Calm, duration: 0 },
+  [MenuAnimationName.Underline]: {
+    name: MenuAnimationName.Underline,
+    duration: 300
+  },
+  [MenuAnimationName.Wash]: { name: MenuAnimationName.Wash, duration: 400 },
+  [MenuAnimationName.Bullet]: { name: MenuAnimationName.Bullet, duration: 300 },
+  [MenuAnimationName.Wave]: { name: MenuAnimationName.Wave, duration: 400 },
+  [MenuAnimationName.Circle]: { name: MenuAnimationName.Circle, duration: 400 },
+  [MenuAnimationName.Bounce]: { name: MenuAnimationName.Bounce, duration: 400 },
+  [MenuAnimationName.Tint]: { name: MenuAnimationName.Tint, duration: 400 },
+  [MenuAnimationName.TextWash]: {
+    name: MenuAnimationName.TextWash,
+    duration: 400
+  },
+  [MenuAnimationName.Wobble]: { name: MenuAnimationName.Wobble, duration: 400 },
+  [MenuAnimationName.Brackets]: {
+    name: MenuAnimationName.Brackets,
+    duration: 400
+  },
+  [MenuAnimationName.Float]: { name: MenuAnimationName.Float, duration: 400 },
+  [MenuAnimationName.Shape]: { name: MenuAnimationName.Shape, duration: 400 },
+  [MenuAnimationName.Expand]: { name: MenuAnimationName.Expand, duration: 400 },
+  [MenuAnimationName.Shadow]: { name: MenuAnimationName.Shadow, duration: 400 },
+  [MenuAnimationName.LineRise]: {
+    name: MenuAnimationName.LineRise,
+    duration: 400
+  },
+  [MenuAnimationName.Overline]: {
+    name: MenuAnimationName.Overline,
+    duration: 400
+  },
+  [MenuAnimationName.CenterLine]: {
+    name: MenuAnimationName.CenterLine,
+    duration: 400
+  },
+  [MenuAnimationName.Skew]: { name: MenuAnimationName.Skew, duration: 400 },
+  [MenuAnimationName.Point]: { name: MenuAnimationName.Point, duration: 400 },
+  [MenuAnimationName.Blur]: { name: MenuAnimationName.Blur, duration: 400 }
+};
+const DROPDOWN_ANIMATION_CONFIG = {
+  [DropdownAnimationName.None]: {
+    name: DropdownAnimationName.None,
+    duration: 0
+  },
+  [DropdownAnimationName.RevealFromTop]: {
+    name: DropdownAnimationName.RevealFromTop,
+    duration: 400
+  },
+  [DropdownAnimationName.FadeIn]: {
+    name: DropdownAnimationName.FadeIn,
+    duration: 400
+  }
+};
+const HAMBURGER_MENU_ANIMATION_CONFIG = {
+  [HamburgerMenuAnimationName.None]: {
+    name: HamburgerMenuAnimationName.None,
+    duration: 0
+  },
+  [HamburgerMenuAnimationName.RevealFromRight]: {
+    name: HamburgerMenuAnimationName.RevealFromRight,
+    duration: 400
+  },
+  [HamburgerMenuAnimationName.FadeIn]: {
+    name: HamburgerMenuAnimationName.FadeIn,
+    duration: 400
+  }
+};
+const ANIMATION_PACKAGE_CONFIG = {
+  [MenuAnimationName.None]: {
+    menuItemAnimationName: MenuAnimationName.None,
+    dropdownAnimationName: DropdownAnimationName.None,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.None
+  },
+  [MenuAnimationName.Underline]: {
+    menuItemAnimationName: MenuAnimationName.Underline,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Wash]: {
+    menuItemAnimationName: MenuAnimationName.Wash,
+    dropdownAnimationName: DropdownAnimationName.FadeIn,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.FadeIn
+  },
+  [MenuAnimationName.Bullet]: {
+    menuItemAnimationName: MenuAnimationName.Bullet,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Wave]: {
+    menuItemAnimationName: MenuAnimationName.Wave,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Circle]: {
+    menuItemAnimationName: MenuAnimationName.Circle,
+    dropdownAnimationName: DropdownAnimationName.FadeIn,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.FadeIn
+  },
+  [MenuAnimationName.Bounce]: {
+    menuItemAnimationName: MenuAnimationName.Bounce,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Tint]: {
+    menuItemAnimationName: MenuAnimationName.Tint,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.TextWash]: {
+    menuItemAnimationName: MenuAnimationName.TextWash,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Wobble]: {
+    menuItemAnimationName: MenuAnimationName.Wobble,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Brackets]: {
+    menuItemAnimationName: MenuAnimationName.Brackets,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Float]: {
+    menuItemAnimationName: MenuAnimationName.Float,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Shape]: {
+    menuItemAnimationName: MenuAnimationName.Shape,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Expand]: {
+    menuItemAnimationName: MenuAnimationName.Expand,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Shadow]: {
+    menuItemAnimationName: MenuAnimationName.Shadow,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.LineRise]: {
+    menuItemAnimationName: MenuAnimationName.LineRise,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Overline]: {
+    menuItemAnimationName: MenuAnimationName.Overline,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.CenterLine]: {
+    menuItemAnimationName: MenuAnimationName.CenterLine,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Skew]: {
+    menuItemAnimationName: MenuAnimationName.Skew,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Point]: {
+    menuItemAnimationName: MenuAnimationName.Point,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Blur]: {
+    menuItemAnimationName: MenuAnimationName.Blur,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.RevealFromRight
+  },
+  [MenuAnimationName.Calm]: {
+    menuItemAnimationName: MenuAnimationName.Calm,
+    dropdownAnimationName: DropdownAnimationName.RevealFromTop,
+    hamburgerMenuAnimationName: HamburgerMenuAnimationName.FadeIn
+  }
+};
+const INITIAL_ANIMATION_STATE = {
+  name: MenuAnimationName.None
+};
+const INITIAL_DROPDOWN_ANIMATION_STATE = {
+  name: DropdownAnimationName.None
+};
+const INITIAL_HAMBURGER_MENU_ANIMATION_STATE = {
+  name: HamburgerMenuAnimationName.None
+};
+const removeQueryFromUrl = (url) => url.split("?")[0];
+const isDefaultAnchor = (activeAnchor) => {
+  return activeAnchor.dataId === "SCROLL_TO_TOP" || activeAnchor.dataId === "SCROLL_TO_BOTTOM";
+};
+const isAnchorLink = (link) => (link == null ? void 0 : link.type) === "AnchorLink" || Boolean((link == null ? void 0 : link.anchorCompId) || (link == null ? void 0 : link.anchorDataId));
+const isCurrentAnchor = (activeAnchor, link) => {
+  if (!link || !isAnchorLink(link)) {
+    return false;
+  }
+  const isSameCompId = link.anchorCompId && link.anchorCompId === activeAnchor.compId;
+  const isSameDataId = link.anchorDataId && link.anchorDataId === activeAnchor.dataId;
+  return Boolean(isSameCompId || isSameDataId);
+};
+const flattenMenuItems = (items) => {
+  const result = [];
+  items.forEach((item2) => {
+    result.push(item2);
+    if (item2.items) {
+      result.push(...item2.items);
+      item2.items.forEach((nestedItem) => {
+        result.push(...nestedItem.items || []);
+      });
+    }
+  });
+  return result;
+};
+const getCurrentMenuItem = (items, activeAnchor, currentPageHref) => {
+  const flatItems = flattenMenuItems(items);
+  const selectedFromVelo = flatItems.find((item2) => item2.selected);
+  if (selectedFromVelo) {
+    return selectedFromVelo;
+  }
+  if (activeAnchor && !isDefaultAnchor(activeAnchor)) {
+    const currentItem = flatItems.find(
+      (menuItem) => isCurrentAnchor(activeAnchor, menuItem.link)
+    );
+    if (currentItem) {
+      return currentItem;
+    }
+  }
+  return flatItems.find(({ link }) => {
+    if (!link) {
+      return false;
+    }
+    return !isAnchorLink(link) && decodeURIComponent(removeQueryFromUrl(link.href || "")) === currentPageHref;
+  });
+};
+const isSameAnchorLinks = (first, second) => {
+  return first.anchorCompId === second.anchorCompId && first.anchorDataId === second.anchorDataId;
+};
+const isSameVeloSelectedItem = (item2, currentItem) => {
+  return item2.selected === true && item2.label === currentItem.label;
+};
+const isCurrentItem = (item2, currentItem) => {
+  if (!currentItem) {
+    return false;
+  }
+  if (currentItem.selected === true) {
+    return isSameVeloSelectedItem(item2, currentItem);
+  }
+  if (!item2.link || !currentItem.link) {
+    return false;
+  }
+  const { link: firstLink } = item2;
+  const { link: secondLink } = currentItem;
+  if (firstLink.type !== secondLink.type) {
+    return false;
+  }
+  if (isAnchorLink(firstLink) || isAnchorLink(secondLink)) {
+    return isSameAnchorLinks(firstLink, secondLink);
+  }
+  return firstLink.href === secondLink.href;
+};
+const menuSemanticClassNames = {
+  root: "menu",
+  item: "menu__item",
+  itemLabel: "menu__item-label",
+  scrollButton: "menu__scroll-button",
+  scrollButtonIcon: "menu__scroll-button-icon",
+  itemIcon: "menu__item-icon"
+};
+const shmSemanticClassNames = {
+  root: "horizontal-menu",
+  menuItemWrapper: "horizontal-menu__item",
+  menuItemLabel: "horizontal-menu__item-label"
+};
+const dropdownSemanticClassNames = {
+  root: "dropdown-menu",
+  dropdownItem: "dropdown-menu__item",
+  dropdownItemLabel: "dropdown-menu__item-label",
+  dropdownSubItem: "dropdown-menu__subitem",
+  dropdownSubItemLabel: "dropdown-menu__subitem-label"
+};
+const DropdownIcon = (props) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    width: "16",
+    height: "11",
+    viewBox: "0 0 16 11",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    children: /* @__PURE__ */ jsx("path", { d: "M8 10.5L16 1.86193L14.7387 0.5L8 7.77613L1.26133 0.499999L-5.95321e-08 1.86193L8 10.5Z" })
+  }
+);
+const MenuItemDropdownIcon = ({
+  chevronButtonRef,
+  onClick,
+  isOpen,
+  hasSubItems,
+  hasContainer,
+  hasLink,
+  ariaLabel,
+  isDropdownIconOpen,
+  className,
+  srOnly: srOnly2,
+  submenuToggleId
+}) => {
+  const button = /* @__PURE__ */ jsx(
+    "button",
+    {
+      "aria-label": ariaLabel,
+      ref: chevronButtonRef,
+      className: clsx(
+        classes$6.dropdownToggleButton,
+        !hasSubItems && !hasContainer && classes$6.noDropdownItems,
+        !hasLink && classes$6.coverAllSpace,
+        className
+      ),
+      onClick: (e) => {
+        if (hasLink) {
+          e.stopPropagation();
+        }
+        onClick();
+      },
+      "aria-expanded": isOpen,
+      ...!srOnly2 && { "data-part": MenuParts.DropdownButton },
+      children: /* @__PURE__ */ jsx(
+        DropdownIcon,
+        {
+          "data-part": MenuParts.DropdownIcon,
+          "data-open": isDropdownIconOpen ? "true" : void 0,
+          className: clsx(
+            classes$6.dropdownIcon,
+            formatClassNames(menuSemanticClassNames.itemIcon)
+          )
+        }
+      )
+    }
+  );
+  return submenuToggleId ? /* @__PURE__ */ jsxs("span", { className: classes$6.submenuToggleWrapper, children: [
+    /* @__PURE__ */ jsx(
+      "label",
+      {
+        htmlFor: submenuToggleId,
+        className: classes$6.submenuToggleLabel,
+        "data-submenu-toggle-label": "",
+        "aria-hidden": "true"
+      }
+    ),
+    button
+  ] }) : button;
+};
+const MenuItemLabel = (props) => {
+  const {
+    item: item2,
+    currentItem,
+    hasDropdownMenu,
+    hasSubItems,
+    hasContainer,
+    onItemClick,
+    onItemDblClick,
+    onItemMouseIn,
+    onItemMouseOut,
+    partToPreviewStateMap,
+    translations,
+    chevronButtonRef,
+    toggleDropdown,
+    isOpen,
+    dropdownAnimationState,
+    submenuToggleId
+  } = props;
+  const itemLabelClassNames = clsx(
+    classes$6.label,
+    formatClassNames(shmSemanticClassNames.menuItemLabel),
+    formatClassNames(menuSemanticClassNames.itemLabel)
+  );
+  const isCurrentPage = isCurrentItem(item2, currentItem);
+  const { label: label2, link } = item2;
+  const hasLink = !isEmptyObject(link);
+  const linkRef = useRef(null);
+  const labelContainerClassNames = clsx(
+    selectors.item,
+    classes$6.labelContainer,
+    formatClassNames(shmSemanticClassNames.menuItemWrapper),
+    formatClassNames(menuSemanticClassNames.item)
+  );
+  const isInteractive = (hasSubItems || hasLink) && !isCurrentPage;
+  const isDropdownIconOpen = isOpen && dropdownAnimationState.phase !== AnimationPhase.ExitActive;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: labelContainerClassNames,
+      "data-selected": isCurrentPage ? true : void 0,
+      "data-part": MenuParts.MenuItemContent,
+      "data-preview": partToPreviewStateMap == null ? void 0 : partToPreviewStateMap.item,
+      "data-interactive": isInteractive,
+      onClick: createSDKAction(item2, isCurrentPage, onItemClick),
+      onMouseEnter: createSDKAction(item2, isCurrentPage, onItemMouseIn),
+      onMouseLeave: createSDKAction(item2, isCurrentPage, onItemMouseOut),
+      onDoubleClick: createSDKAction(item2, isCurrentPage, onItemDblClick),
+      children: [
+        /* @__PURE__ */ jsx(
+          Link,
+          {
+            ref: linkRef,
+            ...link,
+            dataPart: MenuParts.MenuItemLink,
+            activateByKey: "Enter",
+            ...isCurrentPage && {
+              "aria-current": "page"
+            },
+            children: /* @__PURE__ */ jsx("div", { className: itemLabelClassNames, "data-part": MenuParts.Label, children: label2 })
+          }
+        ),
+        hasDropdownMenu && ["default", "srOnly"].map((variant) => {
+          var _a;
+          return /* @__PURE__ */ jsx(
+            MenuItemDropdownIcon,
+            {
+              ariaLabel: (_a = translations.dropdownButtonAriaLabel) == null ? void 0 : _a.replace(
+                "<%= itemName %>",
+                label2
+              ),
+              chevronButtonRef,
+              onClick: toggleDropdown,
+              isOpen,
+              hasSubItems,
+              hasContainer,
+              hasLink,
+              isDropdownIconOpen,
+              className: variant === "srOnly" ? classes$6.srOnly : void 0,
+              srOnly: variant === "srOnly",
+              submenuToggleId: variant === "srOnly" ? void 0 : submenuToggleId
+            },
+            variant
+          );
+        })
+      ]
+    }
+  );
+};
+const splitTopLevelCommas = (str) => {
+  const parts = [];
+  let depth = 0;
+  let buf = "";
+  for (const ch of str) {
+    if (ch === "(") {
+      depth++;
+    } else if (ch === ")") {
+      depth--;
+    }
+    if (ch === "," && depth === 0) {
+      parts.push(buf);
+      buf = "";
+    } else {
+      buf += ch;
+    }
+  }
+  if (buf.length) {
+    parts.push(buf);
+  }
+  return parts.map((p) => p.trim()).filter(Boolean);
+};
+const splitTopLevelWhitespace = (str) => {
+  const parts = [];
+  let depth = 0;
+  let buf = "";
+  for (const ch of str) {
+    if (ch === "(") {
+      depth++;
+    } else if (ch === ")") {
+      depth--;
+    }
+    if (/\s/.test(ch) && depth === 0) {
+      if (buf.length) {
+        parts.push(buf);
+        buf = "";
+      }
+    } else {
+      buf += ch;
+    }
+  }
+  if (buf.length) {
+    parts.push(buf);
+  }
+  return parts;
+};
+const CSS_LENGTH_RE = /^-?\d+(\.\d+)?(px|em|rem|%|vh|vw|pt|cm|mm|in|pc|ex|ch)?$/;
+const parseSize = (token) => ({
+  value: token ? parseFloat(token) || 0 : 0
+});
+const toBoxShadowLayers = (shadow) => {
+  if (!shadow) {
+    return void 0;
+  }
+  if (shadow === "none") {
+    return { layers: [] };
+  }
+  const layerStrings = splitTopLevelCommas(shadow);
+  const layers = [];
+  for (const layerStr of layerStrings) {
+    const tokens = splitTopLevelWhitespace(layerStr).filter((t) => t !== "inset");
+    if (tokens.length < 2) {
+      continue;
+    }
+    const lengthTokens = tokens.filter((t) => CSS_LENGTH_RE.test(t));
+    if (lengthTokens.length < 2) {
+      continue;
+    }
+    const [offsetX, offsetY, blurRadius, spreadRadius] = lengthTokens;
+    layers.push({
+      offsetX: parseSize(offsetX),
+      offsetY: parseSize(offsetY),
+      blurRadius: parseSize(blurRadius),
+      spreadRadius: parseSize(spreadRadius)
+    });
+  }
+  return layers.length ? { layers } : void 0;
+};
+const getWixBannerHeight = () => {
+  const cssVarHeight = window.getComputedStyle(document.documentElement).getPropertyValue("--wix-ads-height");
+  return Number.parseInt(cssVarHeight, 10) || 0;
+};
+const getLeftForItemAnchor = ({ align, itemEl, dropdownEl }) => {
+  switch (align) {
+    case "start":
+      return itemEl.offsetLeft;
+    case "center":
+      return itemEl.offsetLeft + (itemEl.offsetWidth - dropdownEl.offsetWidth) / 2;
+    case "end":
+      return itemEl.offsetLeft + itemEl.offsetWidth - dropdownEl.offsetWidth;
+  }
+};
+const getLeftForMenuCustomWidth = ({
+  align,
+  menuEl,
+  dropdownEl
+}) => {
+  switch (align) {
+    case "start":
+      return 0;
+    case "center":
+      return (menuEl.offsetWidth - dropdownEl.offsetWidth) / 2;
+    case "end":
+      return menuEl.offsetWidth - dropdownEl.offsetWidth;
+  }
+};
+const getLeft = (props) => {
+  switch (props.anchor) {
+    case "screen":
+      return -(props.menuEl.getBoundingClientRect().left ?? 0);
+    case "menuStretched":
+      return 0;
+    case "menuCustomWidth":
+      return getLeftForMenuCustomWidth(props);
+    case "menuItem":
+      return getLeftForItemAnchor(props);
+  }
+};
+const getMarginLeft = (anchor) => {
+  switch (anchor) {
+    case "screen":
+      return "var(--computed-horizontal-margin)";
+    case "menuStretched":
+    case "menuCustomWidth":
+      return "0";
+    case "menuItem":
+      return "var(--scrolled-left)";
+  }
+};
+const widthMap = {
+  screen: "calc(100vw - 2 * var(--computed-horizontal-margin))",
+  menuStretched: "100%",
+  menuCustomWidth: null,
+  menuItem: "max-content"
+};
+const setHorizontalDimensions = (itemEl, dropdownEl, menuEl) => {
+  const dropdownComputedStyle = window.getComputedStyle(dropdownEl);
+  const anchor = dropdownComputedStyle.getPropertyValue(
+    "--computed-anchor"
+  );
+  const align = dropdownComputedStyle.getPropertyValue(
+    "--computed-align"
+  );
+  dropdownEl.style.setProperty("width", widthMap[anchor]);
+  if (anchor === "menuItem") {
+    dropdownEl.style.setProperty("min-width", `${itemEl.offsetWidth}px`);
+  }
+  const left = getLeft({ itemEl, dropdownEl, menuEl, anchor, align });
+  dropdownEl.style.setProperty("--dropdown-left", `${left}px`);
+  dropdownEl.style.setProperty("margin-left", getMarginLeft(anchor));
+};
+const calculateShadowMargin = (dropdownEl) => {
+  const dropdownStyles = window.getComputedStyle(dropdownEl);
+  const boxShadow = dropdownStyles.getPropertyValue("--dropdown-container-box-shadow").trim();
+  if (!boxShadow || boxShadow === "none") {
+    return 0;
+  }
+  const boxShadowLayers = toBoxShadowLayers(boxShadow);
+  if (!boxShadowLayers || !boxShadowLayers.layers.length) {
+    return 0;
+  }
+  const margins = boxShadowLayers.layers.map(
+    ({ offsetX, offsetY, blurRadius, spreadRadius }) => Math.max(Math.abs(offsetX.value), Math.abs(offsetY.value)) + blurRadius.value + spreadRadius.value
+  );
+  return Math.max(...margins);
+};
+const toggleToTopIfNeeded = (itemEl, dropdownEl) => {
+  const itemElRect = itemEl.getBoundingClientRect();
+  const spaceAbove = window.getComputedStyle(dropdownEl).getPropertyValue("--computed-space-above");
+  const dropdownHeight = dropdownEl.offsetHeight + Number.parseInt(spaceAbove, 10);
+  const availableSpaceBelow = window.innerHeight - itemElRect.bottom;
+  const enoughSpaceBelow = availableSpaceBelow >= dropdownHeight;
+  const availableSpaceAbove = itemElRect.top - getWixBannerHeight();
+  const enoughSpaceAbove = availableSpaceAbove >= dropdownHeight;
+  if (enoughSpaceBelow || !enoughSpaceAbove) {
+    return false;
+  }
+  dropdownEl.style.setProperty(
+    "margin-top",
+    `-${dropdownHeight + itemElRect.height}px`,
+    "important"
+  );
+  dropdownEl.style.setProperty("--before-el-top", "100%");
+  return true;
+};
+const updateDropdownDomStyles = (itemEl, wasHiddenBefore = true) => {
+  const dropdownEl = itemEl == null ? void 0 : itemEl.querySelector(
+    `[data-part="${MenuParts.DropdownContainer}"]`
+  );
+  const menuEl = itemEl == null ? void 0 : itemEl.closest(
+    `[data-part="${MenuParts.Navbar}"]`
+  );
+  if (!itemEl || !dropdownEl || !menuEl) {
+    return;
+  }
+  if (wasHiddenBefore) {
+    itemEl.setAttribute("data-open", "calculating");
+  }
+  setHorizontalDimensions(itemEl, dropdownEl, menuEl);
+  const isTopNeeded = toggleToTopIfNeeded(itemEl, dropdownEl);
+  const shadowMargin = calculateShadowMargin(dropdownEl);
+  const shadowMarginCssValue = shadowMargin ? `-${shadowMargin}px` : "0%";
+  dropdownEl.style.setProperty("--shadow-margin", shadowMarginCssValue);
+  const animationClipPath = isTopNeeded ? `inset(100% ${shadowMarginCssValue} ${shadowMarginCssValue} ${shadowMarginCssValue})` : `inset(${shadowMarginCssValue} ${shadowMarginCssValue} 100% ${shadowMarginCssValue})`;
+  dropdownEl.style.setProperty("--animation-clip-path", animationClipPath);
+  dropdownEl.setAttribute("data-open", "true");
+  itemEl.setAttribute("data-open", "true");
+  const prehydrationRoot = itemEl.closest(
+    "[data-prehydration]"
+  );
+  prehydrationRoot == null ? void 0 : prehydrationRoot.removeAttribute("data-prehydration");
+};
+const resetDropdownDomStyles = (itemEl) => {
+  const dropdownEl = itemEl == null ? void 0 : itemEl.querySelector(
+    `[data-part="${MenuParts.DropdownContainer}"]`
+  );
+  itemEl == null ? void 0 : itemEl.removeAttribute("data-open");
+  dropdownEl == null ? void 0 : dropdownEl.removeAttribute("style");
+  dropdownEl == null ? void 0 : dropdownEl.removeAttribute("data-open");
+};
+const useDidUpdate = (cb, deps) => {
+  const isFirstRender = useRef(true);
+  useEffect(
+    () => {
+      if (!isFirstRender.current) {
+        cb();
+      }
+      isFirstRender.current = false;
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    deps
+  );
+};
+const useDropdown = ({
+  itemRef,
+  forceOpen,
+  getAnimationPackage
+}) => {
+  const updateDropdownDomStyles$1 = () => updateDropdownDomStyles(itemRef.current);
+  const {
+    animationState,
+    initEnterAnimation,
+    initExitAnimation,
+    skipToEnterDone
+  } = useAnimationState(
+    DROPDOWN_ANIMATION_CONFIG,
+    INITIAL_DROPDOWN_ANIMATION_STATE
+  );
+  const [isOpen, setIsOpen] = useState(forceOpen);
+  const getDropdownAnimationName = () => {
+    const animationPackage = getAnimationPackage();
+    const dropdownAnimationName = ANIMATION_PACKAGE_CONFIG[animationPackage].dropdownAnimationName;
+    return dropdownAnimationName;
+  };
+  useLayoutEffect(() => {
+    if (!isOpen) {
+      return;
+    }
+    updateDropdownDomStyles$1();
+  }, [isOpen]);
+  const showDropdown = () => {
+    var _a;
+    const dropdownAnimationName = getDropdownAnimationName();
+    initEnterAnimation(dropdownAnimationName);
+    setIsOpen(true);
+    (_a = itemRef.current) == null ? void 0 : _a.focus();
+  };
+  const showDropdownImmediate = () => {
+    const dropdownAnimationName = getDropdownAnimationName();
+    skipToEnterDone(dropdownAnimationName);
+    setIsOpen(true);
+  };
+  const hideDropdown = () => {
+    const dropdownAnimationName = getDropdownAnimationName();
+    initExitAnimation(dropdownAnimationName, () => setIsOpen(false));
+  };
+  const toggleDropdown = () => {
+    if (isOpen) {
+      hideDropdown();
+    } else {
+      showDropdown();
+    }
+  };
+  useDidUpdate(() => {
+    if (!isOpen) {
+      resetDropdownDomStyles(itemRef.current);
+    }
+  }, [isOpen]);
+  useDidUpdate(() => {
+    if (forceOpen) {
+      showDropdown();
+    } else {
+      hideDropdown();
+    }
+  }, [forceOpen]);
+  useEffect(() => {
+    return () => resetDropdownDomStyles(itemRef.current);
+  }, []);
+  return {
+    isOpen,
+    dropdownAnimationState: animationState,
+    showDropdown,
+    showDropdownImmediate,
+    hideDropdown,
+    toggleDropdown,
+    updateDropdownDomStyles: updateDropdownDomStyles$1
+  };
+};
+const DropdownContext = createContext({
+  dropdownElementRef: { current: null },
+  setDropdownDomStylesApplier: () => {
+  }
+});
+const emptyItem = {
+  label: "",
+  link: {}
+};
+const MenuItemContext = createContext({
+  item: emptyItem,
+  dropdownAnimationState: INITIAL_DROPDOWN_ANIMATION_STATE,
+  isOpen: false
+});
+const useMenuItemContext = () => useContext(MenuItemContext);
+const DropdownWrapper = ({
+  id,
+  className,
+  childrenWrapperClassName,
+  dataAttributes,
+  children,
+  menuOrientation = "horizontal"
+}) => {
+  const {
+    dropdownAnimationState: animationState = INITIAL_DROPDOWN_ANIMATION_STATE,
+    item: item2
+  } = useMenuItemContext();
+  const { dropdownAnchor } = useMenuContext();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      id,
+      ...dataAttributes,
+      className: `${menuOrientation === "horizontal" ? classes$6.horizontalDropdown : classes$6.verticalDropdown} ${className || ""}`,
+      role: "group",
+      "aria-label": item2.label,
+      "data-part": MenuParts.DropdownContainer,
+      "data-anchor": menuOrientation === "horizontal" ? dropdownAnchor : void 0,
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: childrenWrapperClassName,
+          "data-animation-name": animationState.name,
+          "data-animation-state": animationState.phase,
+          children
+        }
+      )
+    }
+  );
+};
+const childrenWrapper = "childrenWrapper__UYx0a";
+const dropdownClasses = {
+  childrenWrapper
+};
+const root$3 = "root__JxTph";
+const list = "list__HKOkk";
+const subList = "subList__uWPaR";
+const listItem = "listItem__nFgdQ";
+const item = "item__nS3PO";
+const selected = "selected__YFkZs";
+const itemLabel = "itemLabel__d2L8o";
+const subItem = "subItem__3ieV0";
+const subItemLabel = "subItemLabel__v6zMr";
+const styles = {
+  root: root$3,
+  list,
+  subList,
+  listItem,
+  item,
+  selected,
+  itemLabel,
+  subItem,
+  subItemLabel
+};
+const TestIds = {
+  itemLabel: "submenu-item-label",
+  subItemLabel: "submenu-sub-item-label"
+};
+const DataHooks$1 = {
+  submenu: "submenu"
+};
+const INNER_FOCUS_RING_CLASSNAME = "has-inner-focus-ring";
+const ItemList = ({
+  items,
+  currentItem,
+  isRootLevel = true,
+  partToPreviewStateMap,
+  onEscKeyDown,
+  customClassNames = [],
+  onItemClick,
+  onItemMouseIn,
+  onItemMouseOut,
+  onItemDblClick
+}) => {
+  const subMenuContainerClasses = clsx(
+    isRootLevel ? styles.list : styles.subList,
+    classes$6.dropdownMenu,
+    {
+      [formatClassNames(dropdownSemanticClassNames.root, ...customClassNames)]: isRootLevel
+    }
+  );
+  const submenuItemLinkClasses = (isCurrent) => {
+    return clsx(
+      isRootLevel ? [styles.item, selectors.dropdownItem] : [styles.subItem, selectors.dropdownSubItem],
+      {
+        [styles.selected]: isCurrent
+      },
+      isRootLevel ? {
+        [formatClassNames(dropdownSemanticClassNames.dropdownItem)]: true
+      } : {
+        [formatClassNames(dropdownSemanticClassNames.dropdownSubItem)]: true
+      },
+      INNER_FOCUS_RING_CLASSNAME
+    );
+  };
+  const submenuItemLabelClasses = clsx(
+    isRootLevel ? styles.itemLabel : styles.subItemLabel,
+    isRootLevel ? formatClassNames(dropdownSemanticClassNames.dropdownItemLabel) : formatClassNames(dropdownSemanticClassNames.dropdownSubItemLabel)
+  );
+  return /* @__PURE__ */ jsx(
+    "ul",
+    {
+      className: subMenuContainerClasses,
+      style: {
+        "--items-number": items.length
+      },
+      onKeyDown: (e) => {
+        var _a;
+        if (e.key === "Escape") {
+          if (onEscKeyDown) {
+            onEscKeyDown();
+            return;
+          }
+          const target = e.target;
+          const parentListItem = target.closest("li");
+          const parentNavigateTo = parentListItem.closest(
+            getItemDepthSelector(0)
+          );
+          (_a = parentNavigateTo == null ? void 0 : parentNavigateTo.firstChild) == null ? void 0 : _a.focus();
+        }
+      },
+      children: items.map((item2, i) => {
+        const { items: subItems, link, label: label2 } = item2;
+        const isCurrent = isCurrentItem(item2, currentItem);
+        return /* @__PURE__ */ jsxs(
+          "li",
+          {
+            className: clsx({ [styles.listItem]: !isRootLevel }),
+            "data-item-depth": isRootLevel ? subItemDepthLevel : subSubItemDepthLevel,
+            children: [
+              /* @__PURE__ */ jsx(
+                Link,
+                {
+                  ...link,
+                  className: submenuItemLinkClasses(isCurrent),
+                  dataPart: isRootLevel ? MenuParts.DropdownItem : MenuParts.DropdownSubItem,
+                  dataPreview: partToPreviewStateMap == null ? void 0 : partToPreviewStateMap[isRootLevel ? "item" : "sub-item"],
+                  onFocus: (e) => {
+                    e.stopPropagation();
+                  },
+                  onClick: createSDKAction(item2, isCurrent, onItemClick),
+                  onMouseEnter: createSDKAction(item2, isCurrent, onItemMouseIn),
+                  onMouseLeave: createSDKAction(item2, isCurrent, onItemMouseOut),
+                  onDoubleClick: createSDKAction(item2, isCurrent, onItemDblClick),
+                  ...isCurrent && {
+                    "aria-current": "page"
+                  },
+                  children: /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: submenuItemLabelClasses,
+                      "data-selected": isCurrent ? "true" : void 0,
+                      "data-part": isRootLevel ? MenuParts.DropdownItemLabel : MenuParts.DropdownSubItemLabel,
+                      "data-testid": isRootLevel ? TestIds.itemLabel : TestIds.subItemLabel,
+                      children: label2
+                    }
+                  )
+                }
+              ),
+              !!(subItems == null ? void 0 : subItems.length) && /* @__PURE__ */ jsx(
+                ItemList,
+                {
+                  partToPreviewStateMap,
+                  items: subItems,
+                  isRootLevel: false,
+                  currentItem,
+                  onItemClick,
+                  onItemMouseIn,
+                  onItemMouseOut,
+                  onItemDblClick
+                }
+              )
+            ]
+          },
+          i
+        );
+      })
+    }
+  );
+};
+const Submenu = (props) => {
+  const {
+    id,
+    partToPreviewStateMap,
+    customClassNames = [],
+    className,
+    onItemClick,
+    onItemMouseIn,
+    onItemMouseOut,
+    onItemDblClick
+  } = props;
+  const { item: item2, currentItem, onEscKeyDown } = useMenuItemContext();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      id,
+      ...getDataAttributes(props),
+      className: clsx(className, styles.root),
+      "data-hook": DataHooks$1.submenu,
+      children: /* @__PURE__ */ jsx(
+        ItemList,
+        {
+          partToPreviewStateMap,
+          items: item2.items || [],
+          currentItem,
+          onEscKeyDown,
+          customClassNames,
+          onItemClick,
+          onItemMouseIn,
+          onItemMouseOut,
+          onItemDblClick
+        }
+      )
+    }
+  );
+};
+const dropdown = "dropdown__AdOBG";
+const submenu = "submenu__XhNgM";
+const container$1 = "container__L6ce2";
+const dropdownContentWrapper = "dropdownContentWrapper__T9BwO";
+const classes$5 = {
+  dropdown,
+  submenu,
+  container: container$1,
+  dropdownContentWrapper
+};
+const Dropdown = React__default.forwardRef(
+  ({
+    item: item2,
+    currentItem,
+    isOpen,
+    menuOrientation,
+    dropdownAnimationState,
+    onEscKeyDown,
+    direction,
+    onItemClick
+  }, ref) => {
+    const rootClassNames = {
+      [MenuOrientation.Horizontal]: [
+        classes$6.horizontalDropdownDisplayWrapper
+      ],
+      [MenuOrientation.Vertical]: [
+        classes$6.verticalDropdownDisplayWrapper,
+        isOpen && classes$6.expandedDropdown
+      ]
+    };
+    const displayContainer = menuOrientation === "horizontal" && item2.isContainerItem;
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: clsx(
+          selectors.dropdown,
+          classes$5.dropdown,
+          ...rootClassNames[menuOrientation]
+        ),
+        dir: direction,
+        ref,
+        children: /* @__PURE__ */ jsx(
+          MenuItemContext.Provider,
+          {
+            value: {
+              item: item2,
+              currentItem,
+              dropdownAnimationState,
+              onEscKeyDown
+            },
+            children: /* @__PURE__ */ jsxs(
+              DropdownWrapper,
+              {
+                id: `${item2.id}-dropdown`,
+                menuOrientation,
+                childrenWrapperClassName: clsx(
+                  dropdownClasses.childrenWrapper,
+                  classes$5.dropdownContentWrapper
+                ),
+                children: [
+                  item2.items && /* @__PURE__ */ jsx(
+                    Submenu,
+                    {
+                      id: `${item2.id}-submenu`,
+                      className: clsx(classes$5.submenu, "submenu"),
+                      onItemClick
+                    }
+                  ),
+                  displayContainer && /* @__PURE__ */ jsx("div", { className: classes$5.container, children: item2.container })
+                ]
+              }
+            )
+          }
+        )
+      }
+    );
+  }
+);
+const MenuItem = (props) => {
+  var _a;
+  const {
+    item: item2,
+    currentItem,
+    focusOnMenuItem,
+    getAnimationPackage,
+    partToPreviewStateMap,
+    submenuDirection,
+    onItemClick,
+    onItemMouseIn,
+    onItemMouseOut,
+    onItemDblClick,
+    submenuToggleIdPrefix
+  } = props;
+  const { forceOpen = false } = item2;
+  const { animationState, initEnterAnimation, initExitAnimation } = useAnimationState(MENU_ITEM_ANIMATION_CONFIG, INITIAL_ANIMATION_STATE);
+  const hasSubItems = !!((_a = item2.items) == null ? void 0 : _a.length);
+  const hasContainer = !!item2.isContainerItem;
+  const hasDropdownMenu = hasContainer || hasSubItems;
+  const hasLink = !isEmptyObject(item2.link);
+  const submenuToggleId = submenuToggleIdPrefix && hasSubItems ? `${submenuToggleIdPrefix}-${item2.id}-submenu-toggle` : void 0;
+  const submenuCheckboxRef = useRef(null);
+  const prehydrationOpenRef = useRef(null);
+  if (prehydrationOpenRef.current === null) {
+    if (submenuToggleId && typeof document !== "undefined") {
+      const checkbox = document.getElementById(
+        submenuToggleId
+      );
+      prehydrationOpenRef.current = !!(checkbox == null ? void 0 : checkbox.checked);
+    } else {
+      prehydrationOpenRef.current = false;
+    }
+  }
+  const chevronButtonRef = useRef(null);
+  const itemRef = useRef(null);
+  const getMenuItemAnimationName = () => {
+    const animationPackage = getAnimationPackage();
+    const menuItemAnimationName = ANIMATION_PACKAGE_CONFIG[animationPackage].menuItemAnimationName;
+    return menuItemAnimationName;
+  };
+  const {
+    isOpen,
+    dropdownAnimationState,
+    showDropdown,
+    showDropdownImmediate,
+    hideDropdown,
+    toggleDropdown,
+    updateDropdownDomStyles: updateDropdownDomStyles2
+  } = useDropdown({
+    itemRef,
+    forceOpen,
+    getAnimationPackage
+  });
+  const { isHamburgerMenuOpened } = useMenuContext();
+  const { setDropdownDomStylesApplier, dropdownElementRef } = useContext(DropdownContext);
+  setDropdownDomStylesApplier(updateDropdownDomStyles2);
+  const eventListeners = createEventListeners({
+    showDropdown,
+    hideDropdown,
+    itemRef,
+    getMenuItemAnimationName,
+    initEnterAnimation,
+    initExitAnimation,
+    isOpen,
+    hasLink,
+    dropdownAnimationState
+  });
+  useEffect(() => {
+    if ((currentItem == null ? void 0 : currentItem.id) === item2.id && itemRef.current) {
+      focusOnMenuItem == null ? void 0 : focusOnMenuItem(itemRef.current);
+    }
+  }, [currentItem, item2, focusOnMenuItem]);
+  useLayoutEffect(() => {
+    var _a2, _b;
+    if ((((_a2 = submenuCheckboxRef.current) == null ? void 0 : _a2.checked) || prehydrationOpenRef.current) && !isOpen) {
+      showDropdownImmediate();
+    }
+    if (hasDropdownMenu && !isOpen && ((_b = itemRef.current) == null ? void 0 : _b.matches(":hover"))) {
+      showDropdownImmediate();
+    }
+  }, []);
+  const prevHamburgerOpenRef = useRef(isHamburgerMenuOpened);
+  useEffect(() => {
+    if (prevHamburgerOpenRef.current && !isHamburgerMenuOpened && isOpen) {
+      hideDropdown();
+    }
+    prevHamburgerOpenRef.current = isHamburgerMenuOpened;
+  }, [isHamburgerMenuOpened, isOpen, hideDropdown]);
+  const handleEscKeyDown = useCallback(() => {
+    var _a2;
+    (_a2 = chevronButtonRef.current) == null ? void 0 : _a2.focus();
+    hideDropdown();
+  }, [hideDropdown, chevronButtonRef]);
+  const handleKeyDown = useCallback(
+    (event) => {
+      if (event.key === "Escape") {
+        handleEscKeyDown();
+      }
+    },
+    [handleEscKeyDown]
+  );
+  useEffect(() => {
+    if (isOpen) {
+      window.addEventListener("keydown", handleKeyDown);
+    } else {
+      window.removeEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [isOpen, handleKeyDown]);
+  const isElementInView = (element) => {
+    const boundingRect = element.getBoundingClientRect();
+    return boundingRect.top >= 0 && boundingRect.bottom <= window.innerHeight;
+  };
+  const scrollIntoViewIfNeeded = () => {
+    const element = itemRef.current;
+    if (element && !isElementInView(element)) {
+      element.scrollIntoView();
+    }
+  };
+  const sharedDropdownProps = {
+    item: item2,
+    currentItem,
+    dropdownAnimationState,
+    onEscKeyDown: handleEscKeyDown,
+    onItemClick,
+    onItemMouseIn,
+    onItemMouseOut,
+    onItemDblClick
+  };
+  return /* @__PURE__ */ jsxs(
+    "li",
+    {
+      ref: itemRef,
+      className: classes$6.listItem,
+      "data-part": MenuParts.MenuItem,
+      "data-animation-name": animationState.name,
+      "data-animation-state": animationState.phase,
+      "data-item-depth": "0",
+      onFocus: scrollIntoViewIfNeeded,
+      children: [
+        submenuToggleId && /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "checkbox",
+            id: submenuToggleId,
+            ref: submenuCheckboxRef,
+            "data-submenu-toggle": "",
+            "aria-hidden": "true",
+            tabIndex: -1,
+            autoComplete: "off",
+            className: classes$6.hiddenToggle
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: classes$6.itemWrapper, ...eventListeners, children: [
+          /* @__PURE__ */ jsx(
+            MenuItemLabel,
+            {
+              ...props,
+              hasDropdownMenu,
+              hasSubItems,
+              hasContainer,
+              chevronButtonRef,
+              toggleDropdown,
+              isOpen,
+              dropdownAnimationState,
+              submenuToggleId
+            }
+          ),
+          hasDropdownMenu && /* @__PURE__ */ jsx(
+            Dropdown,
+            {
+              ...sharedDropdownProps,
+              menuOrientation: "horizontal",
+              ref: dropdownElementRef,
+              direction: submenuDirection
+            }
+          )
+        ] }),
+        hasSubItems && /* @__PURE__ */ jsx(
+          Dropdown,
+          {
+            ...sharedDropdownProps,
+            menuOrientation: "vertical",
+            isOpen,
+            partToPreviewStateMap,
+            direction: submenuDirection
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: classes$6.divider })
+      ]
+    }
+  );
+};
+const root$2 = "root__YhBXP";
+const rootDirection = "rootDirection__3yF0G";
+const container = "container__AIbpV";
+const classes$4 = {
+  root: root$2,
+  rootDirection,
+  container
+};
+const root$1 = "root__ufRZ-";
+const icon = "icon__p4-DX";
+const visible = "visible__tHTKq";
+const hidden = "hidden__agl8y";
+const classes$3 = {
+  root: root$1,
+  icon,
+  visible,
+  hidden
+};
+const iconClasses = clsx(
+  classes$3.icon,
+  formatClassNames(menuSemanticClassNames.scrollButtonIcon)
+);
+const ScrollButton = (props) => {
+  const {
+    className: propClassName,
+    onClick,
+    direction,
+    isHidden,
+    dataPart,
+    previewState
+  } = props;
+  const rootClassName = clsx(
+    classes$3.root,
+    propClassName,
+    isHidden ? classes$3.hidden : classes$3.visible,
+    formatClassNames(menuSemanticClassNames.scrollButton),
+    "scroll-button"
+  );
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      onClick,
+      "aria-hidden": "true",
+      "aria-label": "scroll",
+      className: rootClassName,
+      "data-menu-scroll-action": "page",
+      "data-hidden": isHidden,
+      "data-preview": previewState,
+      "data-part": dataPart,
+      children: /* @__PURE__ */ jsx("span", { className: iconClasses, children: /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 6 12", children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: direction === "forward" ? "M6 6L.8 0 0 .7 4.7 6 0 11.3l.8.7z" : "M0 6L5.2 0 6 .7 1.3 6 6 11.3 5.2 12z"
+        }
+      ) }) })
+    }
+  );
+};
+const root = "root__Ok9AO";
+const classes$2 = {
+  root
+};
+const ScrollControls = (props) => {
+  const {
+    isScrollBackwardButtonShown,
+    isScrollForwardButtonShown,
+    scrollPageForward,
+    scrollPageToBackward,
+    previewState
+  } = props;
+  const sharedButtonProps = {
+    previewState
+  };
+  return /* @__PURE__ */ jsxs("div", { className: classes$2.root, children: [
+    /* @__PURE__ */ jsx(
+      ScrollButton,
+      {
+        direction: "backward",
+        onClick: scrollPageToBackward,
+        isHidden: !isScrollBackwardButtonShown,
+        dataPart: MenuParts.ScrollBackwardButton,
+        ...sharedButtonProps
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ScrollButton,
+      {
+        direction: "forward",
+        onClick: scrollPageForward,
+        isHidden: !isScrollForwardButtonShown,
+        dataPart: MenuParts.ScrollForwardButton,
+        ...sharedButtonProps
+      }
+    )
+  ] });
+};
+const DataHooks = {
+  menuRoot: "menu-root"
+};
+const MenuContent = (props) => {
+  const {
+    id,
+    className,
+    navbarClassName,
+    directionClassName,
+    direction,
+    submenuDirection,
+    onItemMouseIn,
+    onItemMouseOut,
+    onItemClick,
+    onItemDblClick,
+    submenuToggleIdPrefix
+  } = props;
+  const {
+    items,
+    partToPreviewStateMap,
+    currentUrl,
+    activeAnchor,
+    translations,
+    customClassNames = [],
+    getAnimationPackage,
+    navAriaLabel,
+    a11yProps
+  } = useMenuContext();
+  const rootClassName = clsx(
+    classes$4.root,
+    navbarClassName,
+    !direction && (directionClassName ?? classes$4.rootDirection),
+    formatClassNames(shmSemanticClassNames.root),
+    formatClassNames(menuSemanticClassNames.root, ...customClassNames)
+  );
+  const menuContainerRef = React__default.useRef(null);
+  const lastValidAnchorMenuItemRef = useRef(
+    void 0
+  );
+  const currentItem = useMemo(() => {
+    const menuItem = getCurrentMenuItem(items, activeAnchor, currentUrl);
+    if (activeAnchor) {
+      if (isDefaultAnchor(activeAnchor)) {
+        lastValidAnchorMenuItemRef.current = void 0;
+      } else if (menuItem) {
+        lastValidAnchorMenuItemRef.current = menuItem;
+      } else {
+        return lastValidAnchorMenuItemRef.current;
+      }
+    }
+    return menuItem;
+  }, [items, activeAnchor, currentUrl]);
+  const {
+    isScrollable,
+    updateScrollState,
+    handleOnScroll,
+    handleScrollForward,
+    handleScrollBackward,
+    isScrollBackwardButtonVisible,
+    isScrollForwardButtonVisible
+  } = useScroll(menuContainerRef);
+  const focusOnMenuItem = useCallback(
+    (menuItem) => {
+      const { current: menuContainer } = menuContainerRef;
+      if (!isScrollable || !menuItem || !menuContainer) {
+        return;
+      }
+      const rootMenuItem = menuContainer.closest(
+        rootLevelMenuItemSelector
+      );
+      if (rootMenuItem && rootMenuItem !== menuItem) {
+        scrollToMenuItem(menuContainer, rootMenuItem);
+      } else {
+        scrollToMenuItem(menuContainer, menuItem);
+      }
+    },
+    [isScrollable]
+  );
+  const handleOnFocus = useCallback(
+    (event) => {
+      const targetMenuItem = event.target;
+      focusOnMenuItem(targetMenuItem);
+    },
+    [focusOnMenuItem]
+  );
+  useResizeObserver({
+    ref: menuContainerRef,
+    callback: updateScrollState
+  });
+  useEffect(updateScrollState, [items, updateScrollState]);
+  return /* @__PURE__ */ jsx("div", { id, className, children: /* @__PURE__ */ jsxs(
+    "nav",
+    {
+      className: rootClassName,
+      ref: menuContainerRef,
+      ...isScrollable && {
+        onScroll: handleOnScroll,
+        onFocus: handleOnFocus
+      },
+      "data-part": MenuParts.Navbar,
+      "data-hook": DataHooks.menuRoot,
+      ...a11yProps,
+      "aria-label": navAriaLabel || translations.menuNavAriaLabel,
+      dir: direction,
+      children: [
+        /* @__PURE__ */ jsx("ul", { className: classes$4.container, children: items.map((item2) => /* @__PURE__ */ jsx(
+          MenuItem,
+          {
+            translations,
+            currentItem,
+            item: item2,
+            partToPreviewStateMap,
+            onItemClick,
+            focusOnMenuItem,
+            onItemMouseIn,
+            onItemMouseOut,
+            onItemDblClick,
+            getAnimationPackage,
+            submenuDirection,
+            submenuToggleIdPrefix
+          },
+          item2.id
+        )) }),
+        /* @__PURE__ */ jsx(
+          ScrollControls,
+          {
+            scrollPageForward: handleScrollForward,
+            scrollPageToBackward: handleScrollBackward,
+            isScrollBackwardButtonShown: isScrollBackwardButtonVisible,
+            isScrollForwardButtonShown: isScrollForwardButtonVisible,
+            previewState: partToPreviewStateMap == null ? void 0 : partToPreviewStateMap["scroll-button"]
+          }
+        )
+      ]
+    }
+  ) });
+};
+const navbar$1 = "navbar__H6ySL";
+const rtl = "rtl__7sC1t";
+const ltr = "ltr__r9AkY";
+const classes$1 = {
+  navbar: navbar$1,
+  rtl,
+  ltr
+};
+const NavbarMenu = (props) => {
+  const { getLanguageDirection } = useService(
+    definitionExports$2.EnvironmentDefinition
+  );
+  const siteDirection = getLanguageDirection();
+  const {
+    id,
+    className,
+    submenuDirection,
+    direction = siteDirection,
+    onItemClick,
+    onItemDblClick,
+    onItemMouseIn,
+    onItemMouseOut
+  } = props;
+  return /* @__PURE__ */ jsx(
+    MenuContent,
+    {
+      id: `${id}-menu-content`,
+      navbarClassName: clsx(
+        selectors.navbar,
+        classes$1.navbar,
+        className,
+        classes$1[direction]
+      ),
+      directionClassName: directionStyles.fallbackDirection,
+      direction,
+      submenuDirection,
+      onItemClick,
+      onItemDblClick,
+      onItemMouseIn,
+      onItemMouseOut
+    }
+  );
+};
+var definition = {};
+var hasRequiredDefinition;
+function requireDefinition() {
+  if (hasRequiredDefinition) return definition;
+  hasRequiredDefinition = 1;
+  Object.defineProperty(definition, "__esModule", { value: true });
+  definition.SiteScrollBlockerDefinition = void 0;
+  const services_definitions_1 = /* @__PURE__ */ requireBuild();
+  definition.SiteScrollBlockerDefinition = (0, services_definitions_1.defineService)("viewer-core/site-scroll-blocker");
+  return definition;
+}
+var definitionExports = /* @__PURE__ */ requireDefinition();
+const dialog$1 = "dialog__8nYtn";
+const backdrop = "backdrop__GPb-W";
+const dialogContent = "dialogContent__Xp-X2";
+const header = "header__zD0Aj";
+const headerContent = "headerContent__YA-my";
+const main = "main__nxjmC";
+const content = "content__Axo2j";
+const openButton = "openButton__yTPKy";
+const closeButton = "closeButton__SyNEB";
+const navbar = "navbar__-KnMk";
+const classes = {
+  dialog: dialog$1,
+  backdrop,
+  dialogContent,
+  header,
+  headerContent,
+  main,
+  content,
+  openButton,
+  closeButton,
+  navbar
+};
+const FOCUS_TRAP_WARNING_MESSAGE = "[useFocusTrap] No focusable elements found in the container.";
+const focusableSelectors = `
+  button, [href], input, select, textarea, summary,
+  [tabindex]:not([tabindex="-1"]), [contenteditable="true"]
+`;
+function useFocusTrap(active, options) {
+  const containerRef = useRef(null);
+  const previouslyFocusedElement = useRef(null);
+  const handleKeyDown = (event) => {
+    const container2 = containerRef.current;
+    const focusableElements = getFocusableElements(container2);
+    if (event.key !== "Tab") {
+      return;
+    }
+    const firstElement = focusableElements[0];
+    const lastElement = focusableElements[focusableElements.length - 1];
+    if (event.shiftKey && document.activeElement === firstElement) {
+      event.preventDefault();
+      lastElement.focus();
+    } else if (!event.shiftKey && document.activeElement === lastElement) {
+      event.preventDefault();
+      firstElement.focus();
+    }
+  };
+  const getFocusableElements = (container2) => {
+    return Array.from(
+      container2.querySelectorAll(focusableSelectors)
+    ).filter((element) => {
+      const computedStyle = getComputedStyle(element);
+      return (element !== container2 || container2.hasAttribute("tabindex")) && computedStyle.display !== "none" && computedStyle.visibility !== "hidden";
+    });
+  };
+  const focusOnFirstElement = (focusableElements) => {
+    var _a;
+    (_a = focusableElements[0]) == null ? void 0 : _a.focus();
+  };
+  useLayoutEffect(() => {
+    const container2 = containerRef.current;
+    if (!active || !container2) {
+      return;
+    }
+    previouslyFocusedElement.current = document.activeElement;
+    {
+      const focusableElements = getFocusableElements(container2);
+      const hasFocusableElements = focusableElements.length > 0;
+      if (!hasFocusableElements) {
+        if (process.env.NODE_ENV === "development" || process.env.NODE_ENV === "test") {
+          console.warn(FOCUS_TRAP_WARNING_MESSAGE);
+        }
+        return;
+      }
+      focusOnFirstElement(focusableElements);
+    }
+    container2.addEventListener("keydown", handleKeyDown);
+    return () => {
+      if (previouslyFocusedElement.current instanceof HTMLElement) {
+        previouslyFocusedElement.current.focus();
+      }
+      container2.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [active, options == null ? void 0 : options.onFocus]);
+  return { containerRef };
+}
+const dialog = "dialog__i2P5D";
+const animationClasses = {
+  dialog
+};
+const HamburgerMenu = ({
+  id,
+  animationName = MenuAnimationName.None,
+  hamburgerMenuOpen: isOpenProp,
+  onItemClick,
+  onItemDblClick,
+  onItemMouseIn,
+  onItemMouseOut,
+  elementProps: {
+    navbar: navbarProps,
+    hamburgerOpenButton: hamburgerOpenButtonProps,
+    hamburgerMenu: {
+      content: content2,
+      headerContent: headerContent2,
+      elementProps: {
+        hamburgerCloseButton: hamburgerCloseButtonProps
+      } = {}
+    } = {
+      isOpen: false
+    }
+  }
+}) => {
+  const siteScrollBlocker = useService(definitionExports.SiteScrollBlockerDefinition);
+  const [isOpen, setIsOpen] = useState(false);
+  useEffect(() => {
+    setIsOpen(!!isOpenProp);
+  }, [isOpenProp]);
+  useEffect(() => {
+    if (isOpen) {
+      siteScrollBlocker.setSiteScrollingBlocked(true, id);
+    } else {
+      siteScrollBlocker.setSiteScrollingBlocked(false, id);
+    }
+    return () => {
+      siteScrollBlocker.setSiteScrollingBlocked(false, id);
+    };
+  }, [isOpen, siteScrollBlocker, id]);
+  const { animationState, initEnterAnimation, initExitAnimation } = useAnimationState(
+    HAMBURGER_MENU_ANIMATION_CONFIG,
+    INITIAL_HAMBURGER_MENU_ANIMATION_STATE
+  );
+  const setIsMenuOpen = React__default.useCallback(
+    (newOpenValue) => {
+      if (newOpenValue === isOpen) {
+        return;
+      }
+      const getHamburgerMenuAnimationName = () => {
+        const hamburgerMenuAnimationName2 = ANIMATION_PACKAGE_CONFIG[animationName].hamburgerMenuAnimationName;
+        return hamburgerMenuAnimationName2;
+      };
+      const hamburgerMenuAnimationName = getHamburgerMenuAnimationName();
+      if (newOpenValue) {
+        setIsOpen(true);
+        initEnterAnimation(hamburgerMenuAnimationName);
+      } else {
+        initExitAnimation(hamburgerMenuAnimationName, () => setIsOpen(false));
+      }
+    },
+    [isOpen, setIsOpen, initEnterAnimation, initExitAnimation, animationName]
+  );
+  const closeMenu = React__default.useCallback(
+    () => setIsMenuOpen(false),
+    [setIsMenuOpen]
+  );
+  const { containerRef: focusTrapRef } = useFocusTrap(isOpen);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        ...hamburgerOpenButtonProps,
+        className: clsx(
+          selectors.hamburgerMenuOpenButton,
+          classes.openButton
+        ),
+        onClick: () => setIsMenuOpen(true)
+      }
+    ),
+    isOpen && /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: clsx(
+          selectors.hamburgerMenu,
+          classes.dialog,
+          animationClasses.dialog
+        ),
+        "data-animation-name": animationState.name,
+        "data-animation-state": animationState.phase,
+        ref: focusTrapRef,
+        onKeyDown: (e) => e.key === "Escape" && closeMenu(),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: clsx(classes.dialogContent), children: [
+            /* @__PURE__ */ jsxs("header", { className: classes.header, children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: clsx(
+                    selectors.hamburgerMenuHeaderContent,
+                    classes.headerContent
+                  ),
+                  children: headerContent2
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  ...hamburgerCloseButtonProps,
+                  className: clsx(
+                    selectors.hamburgerMenuCloseButton,
+                    classes.closeButton
+                  ),
+                  onClick: closeMenu
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("main", { className: classes.main, children: [
+              /* @__PURE__ */ jsx(
+                NavbarMenu,
+                {
+                  id,
+                  className: classes.navbar,
+                  ...navbarProps,
+                  onItemClick: (event, item2) => {
+                    if (!isEmptyObject(item2.link)) {
+                      closeMenu();
+                    }
+                    onItemClick == null ? void 0 : onItemClick(event, item2);
+                  },
+                  onItemDblClick,
+                  onItemMouseIn,
+                  onItemMouseOut
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: clsx(
+                    selectors.hamburgerMenuContent,
+                    classes.content
+                  ),
+                  children: content2
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: clsx(classes.backdrop), onClick: closeMenu })
+        ]
+      }
+    )
+  ] });
+};
+const Menu = (props) => {
+  var _a;
+  const {
+    id,
+    className,
+    elementProps: {
+      navbar: navbarProps = {
+        items: [],
+        a11y: { ariaLabel: "" }
+      }
+    },
+    hamburgerMenuOpen,
+    wix,
+    animationName = MenuAnimationName.Calm,
+    onMouseIn,
+    onMouseOut,
+    onItemClick,
+    onItemDblClick,
+    onItemMouseIn,
+    onItemMouseOut
+  } = props;
+  const { getCurrentUrl } = useService(definitionExports$3.UrlDefinition);
+  const currentUrl = getCurrentUrl();
+  const { getActiveAnchor } = useService(definitionExports$1.AnchorsDefinition);
+  const activeAnchor = getActiveAnchor();
+  const { translate } = useService(
+    definitionExports$4.TranslationsDefinition
+  );
+  const translations = {
+    menuNavAriaLabel: translate(ARIA_LABEL_NAMESPACE)(translationsKeys.menuNavAriaLabel) || defaultTranslations.menuNavAriaLabel,
+    dropdownButtonAriaLabel: translate(ARIA_LABEL_NAMESPACE)(
+      translationsKeys.dropdownButtonAriaLabel
+    ) || defaultTranslations.dropdownButtonAriaLabel
+  };
+  const presetsWrapperProps = (wix == null ? void 0 : wix.presetsWrapperProps) || {};
+  return /* @__PURE__ */ jsx("div", { className: presetWrapperStyles.presetWrapper, ...presetsWrapperProps, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      id,
+      className: clsx(
+        className,
+        selectors.menu,
+        animationClasses$1[`animation-${animationName}`]
+      ),
+      onMouseEnter: onMouseIn,
+      onMouseLeave: onMouseOut,
+      children: /* @__PURE__ */ jsxs(
+        MenuContextProvider,
+        {
+          items: navbarProps.items || [],
+          translations,
+          getAnimationPackage: () => animationName,
+          currentUrl,
+          activeAnchor,
+          navAriaLabel: ((_a = navbarProps == null ? void 0 : navbarProps.a11y) == null ? void 0 : _a.ariaLabel) ?? "",
+          a11yProps: convertA11yKeysToHtmlFormat((navbarProps == null ? void 0 : navbarProps.a11y) ?? {}),
+          children: [
+            /* @__PURE__ */ jsx(
+              NavbarMenu,
+              {
+                id,
+                ...navbarProps,
+                onItemClick,
+                onItemDblClick,
+                onItemMouseIn,
+                onItemMouseOut
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              HamburgerMenu,
+              {
+                ...props,
+                animationName,
+                hamburgerMenuOpen
+              }
+            )
+          ]
+        }
+      )
+    }
+  ) });
+};
+export {
+  Menu as default
+};