@wix/editor-react-components 1.2495.0 → 1.2497.0

package/dist/site/components/Logo/css.css

@@ -1,4 +1,18 @@
-.logo__Y9w6a {
+.image__WopE9 {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+.image__WopE9 img {
+  max-width: var(--wix-img-max-width, 100%);
+}
+.image__WopE9[data-animate-blur] img {
+  filter: blur(9px);
+  transition: filter 0.8s ease-in;
+}
+.image__WopE9[data-animate-blur] img[data-load-done] {
+  filter: none;
+}.logo__Y9w6a {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -28,19 +42,4 @@
   width: 100%;
   height: 100%;
   display: block;
-}
-.image__WopE9 {
-  display: block;
-  width: 100%;
-  height: 100%;
-}
-.image__WopE9 img {
-  max-width: var(--wix-img-max-width, 100%);
-}
-.image__WopE9[data-animate-blur] img {
-  filter: blur(9px);
-  transition: filter 0.8s ease-in;
-}
-.image__WopE9[data-animate-blur] img[data-load-done] {
-  filter: none;
 }

package/dist/site/components/Menu/Menu.types.d.ts

@@ -2,9 +2,8 @@ import { default as React, PropsWithChildren } from 'react';
 import { MenuOrientationType, MenuAnimationNameType, DropdownAnimationNameType, Translations } from './constants';
 import { MenuItemProps as MenuItemData, ActiveAnchor } from '../../../types/vendored/editor-elements-definitions';
 import { IMenuItemSDKAction, IMenuItemsPropsSDKActions } from '../../../common/sdk/props-factories/menuItemsPropsSDKFactory';
-import { A11y, Direction, VectorArt } from '@wix/editor-react-types';
+import { A11y, Direction } from '@wix/editor-react-types';
 import { ButtonProps } from '../Button/Button';
-import { AnimatedSvgRef } from '../AnimatedIcon/types';
 import { SdkFunctionMouseHoverProps } from '../../../utils/functions/sdkFunctionCallbackProps';
 import { AnimationState } from './components/MenuContent/MenuItem/useAnimationState';
 export type MenuItemType = MenuItemData & {
@@ -27,10 +26,6 @@ export type MenuDropdownElementProps = {
 export type MenuNavbarElementProps = {
     item?: {
         className?: string;
-        elementProps?: {
-            animatedIcon?: AnimatedIconElementProps;
-            itemLabel?: ItemLabelElementProps;
-        };
     };
     scrollButton?: {
         className?: string;
@@ -40,20 +35,6 @@ export type MenuNavbarElementProps = {
 export type HamburgerMenuElementProps = {
     hamburgerCloseButton?: ButtonProps;
 };
-export type BuilderAnimationIconProps = {
-    className?: string;
-    'data-testid'?: string;
-};
-export type BuilderAnimationIconComponent = React.ForwardRefExoticComponent<BuilderAnimationIconProps & React.RefAttributes<AnimatedSvgRef>>;
-export interface AnimatedIconElementProps {
-    svg?: VectorArt;
-    duration?: number;
-    svgLastAnimatedSelected?: VectorArt;
-    className?: string;
-}
-export interface ItemLabelElementProps {
-    className?: string;
-}
 export type HamburgerMenuProps = {
     className?: string;
     isOpen?: boolean;
@@ -158,7 +139,6 @@ export type IMenuContentProps = Partial<IMenuItemsPropsSDKActions> & {
     submenuDirection?: Direction;
     submenuToggleIdPrefix?: string;
     menuElementProps?: MenuNavbarElementProps;
-    BuilderAnimationIcon?: BuilderAnimationIconComponent;
 };
 export type IMenuItemProps = Partial<IMenuItemsPropsSDKActions> & {
     item: PropsWithChildren<MenuItemData & {
@@ -172,7 +152,6 @@ export type IMenuItemProps = Partial<IMenuItemsPropsSDKActions> & {
     submenuDirection?: Direction;
     submenuToggleIdPrefix?: string;
     menuElementProps?: MenuNavbarElementProps;
-    BuilderAnimationIcon?: BuilderAnimationIconComponent;
 } & Translations;
 export type ScrollControlsProps = {
     isScrollForwardButtonShown: boolean;

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

@@ -5,7 +5,7 @@ import { U as UrlDefinition } from "../chunks/index12.js";
 import { d as defineService } from "../chunks/index8.js";
 import { T as TranslationsDefinition } from "../chunks/index6.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, c as DesignStates, u as useAnimationState, e as ARIA_LABEL_NAMESPACE, t as translationsKeys } from "../chunks/constants27.js";
-import React__default, { createContext, useContext, useRef, useCallback, useMemo, useState, useEffect, useLayoutEffect, forwardRef } from "react";
+import React__default, { createContext, useContext, useRef, useCallback, useMemo, useState, 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/utils3.js";
 import { d as debounce } from "../chunks/performanceUtils.js";
@@ -14,7 +14,6 @@ import { i as isEmptyObject, a as getDataAttributes } from "../chunks/dataUtils.
 import { u as useResizeObserver } from "../chunks/useResizeObserver.js";
 import { d as directionStyles } from "../chunks/direction.module.js";
 import { E as EnvironmentDefinition } from "../chunks/index2.js";
-import AnimatedIconWithReducedMotion from "../AnimatedIcon/component.js";
 import { B as Button } from "../chunks/Button.js";
 import { f as convertA11yKeysToHtmlFormat } from "../chunks/a11y.js";
 const AnchorsDefinition = defineService("@wix/viewer-service-anchors");
@@ -375,7 +374,6 @@ const itemWrapper = "itemWrapper__sn71X";
 const labelContainer = "labelContainer__E4y-p";
 const label = "label__BBchK";
 const dropdownToggleButton = "dropdownToggleButton__nisoC";
-const labelWrapper = "labelWrapper__u5Jgh";
 const horizontalDropdown = "horizontalDropdown__TETsA";
 const coverAllSpace = "coverAllSpace__Iwj6W";
 const srOnly = "srOnly__AGv2l";
@@ -395,7 +393,6 @@ const classes$6 = {
   labelContainer,
   label,
   dropdownToggleButton,
-  labelWrapper,
   horizontalDropdown,
   coverAllSpace,
   srOnly,
@@ -741,105 +738,7 @@ const MenuItemDropdownIcon = ({
     button
   ] }) : button;
 };
-const SELECTION_ANIMATION_SETTLE_DELAY_MS = 0;
-const useIsomorphicLayoutEffect = typeof window === "undefined" ? useEffect : useLayoutEffect;
-function useIconAnimation({
-  BuilderAnimationIcon,
-  isCurrentPage,
-  isOpen,
-  onMouseEnter,
-  onMouseLeave
-}) {
-  const iconAnimatedRef = useRef(null);
-  const isAnimatedForwardRef = useRef(null);
-  const prevIsImmediateRef = useRef(null);
-  const prevIsSelectedRef = useRef(null);
-  const pendingTimeoutRef = useRef(null);
-  const [isHovered, setIsHovered] = useState(false);
-  const onMouseEnterRef = useRef(onMouseEnter);
-  onMouseEnterRef.current = onMouseEnter;
-  const onMouseLeaveRef = useRef(onMouseLeave);
-  onMouseLeaveRef.current = onMouseLeave;
-  const cancelPending = useCallback(() => {
-    if (pendingTimeoutRef.current !== null) {
-      clearTimeout(pendingTimeoutRef.current);
-      pendingTimeoutRef.current = null;
-    }
-  }, []);
-  useIsomorphicLayoutEffect(() => {
-    var _a;
-    if (!BuilderAnimationIcon) {
-      cancelPending();
-      isAnimatedForwardRef.current = null;
-      prevIsImmediateRef.current = null;
-      prevIsSelectedRef.current = null;
-      return cancelPending;
-    }
-    const applyAnimation = (forward) => {
-      var _a2, _b;
-      isAnimatedForwardRef.current = forward;
-      if (forward) {
-        (_a2 = iconAnimatedRef.current) == null ? void 0 : _a2.runAnimationForward();
-      } else {
-        (_b = iconAnimatedRef.current) == null ? void 0 : _b.runAnimationBackward();
-      }
-    };
-    const isImmediate = isHovered || isOpen;
-    const isSelected = isCurrentPage;
-    const shouldBeForward = isImmediate || isSelected;
-    if (isAnimatedForwardRef.current === null) {
-      isAnimatedForwardRef.current = shouldBeForward;
-      prevIsImmediateRef.current = isImmediate;
-      prevIsSelectedRef.current = isSelected;
-      if (shouldBeForward) {
-        (_a = iconAnimatedRef.current) == null ? void 0 : _a.runAnimationForward();
-      }
-      return cancelPending;
-    }
-    if (prevIsImmediateRef.current !== isImmediate) {
-      prevIsImmediateRef.current = isImmediate;
-      cancelPending();
-      if (isAnimatedForwardRef.current !== shouldBeForward) {
-        applyAnimation(shouldBeForward);
-      }
-      return cancelPending;
-    }
-    if (prevIsSelectedRef.current === isSelected) {
-      cancelPending();
-      return cancelPending;
-    }
-    prevIsSelectedRef.current = isSelected;
-    if (isImmediate || isAnimatedForwardRef.current === shouldBeForward) {
-      cancelPending();
-      return cancelPending;
-    }
-    cancelPending();
-    pendingTimeoutRef.current = setTimeout(() => {
-      pendingTimeoutRef.current = null;
-      applyAnimation(isSelected);
-    }, SELECTION_ANIMATION_SETTLE_DELAY_MS);
-    return cancelPending;
-  }, [BuilderAnimationIcon, cancelPending, isCurrentPage, isHovered, isOpen]);
-  const handleMouseEnter = useCallback(
-    (event) => {
-      var _a;
-      setIsHovered(true);
-      (_a = onMouseEnterRef.current) == null ? void 0 : _a.call(onMouseEnterRef, event);
-    },
-    []
-  );
-  const handleMouseLeave = useCallback(
-    (event) => {
-      var _a;
-      setIsHovered(false);
-      (_a = onMouseLeaveRef.current) == null ? void 0 : _a.call(onMouseLeaveRef, event);
-    },
-    []
-  );
-  return { iconAnimatedRef, handleMouseEnter, handleMouseLeave };
-}
 const MenuItemLabel = (props) => {
-  var _a, _b, _c, _d;
   const {
     item: item2,
     currentItem,
@@ -857,14 +756,12 @@ const MenuItemLabel = (props) => {
     isOpen,
     dropdownAnimationState,
     submenuToggleId,
-    itemClassName,
-    BuilderAnimationIcon
+    itemClassName
   } = props;
   const isCurrentPage = isCurrentItem(item2, currentItem);
   const { label: label2, link } = item2;
   const hasLink = !isEmptyObject(link);
   const linkRef = useRef(null);
-  const itemLabelClassName = (_d = (_c = (_b = (_a = props.menuElementProps) == null ? void 0 : _a.item) == null ? void 0 : _b.elementProps) == null ? void 0 : _c.itemLabel) == null ? void 0 : _d.className;
   const labelContainerClassNames = clsx(
     selectors.item,
     classes$6.labelContainer,
@@ -873,15 +770,6 @@ const MenuItemLabel = (props) => {
   );
   const isInteractive = (hasSubItems || hasLink) && !isCurrentPage;
   const isDropdownIconOpen = isOpen && dropdownAnimationState.phase !== AnimationPhase.ExitActive;
-  const mouseEnterAction = createSDKAction(item2, isCurrentPage, onItemMouseIn);
-  const mouseLeaveAction = createSDKAction(item2, isCurrentPage, onItemMouseOut);
-  const { iconAnimatedRef, handleMouseEnter, handleMouseLeave } = useIconAnimation({
-    BuilderAnimationIcon,
-    isCurrentPage,
-    isOpen,
-    onMouseEnter: mouseEnterAction,
-    onMouseLeave: mouseLeaveAction
-  });
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -891,8 +779,8 @@ const MenuItemLabel = (props) => {
       "data-preview": partToPreviewStateMap == null ? void 0 : partToPreviewStateMap.item,
       "data-interactive": isInteractive,
       onClick: createSDKAction(item2, isCurrentPage, onItemClick),
-      onMouseEnter: handleMouseEnter,
-      onMouseLeave: handleMouseLeave,
+      onMouseEnter: createSDKAction(item2, isCurrentPage, onItemMouseIn),
+      onMouseLeave: createSDKAction(item2, isCurrentPage, onItemMouseOut),
       onDoubleClick: createSDKAction(item2, isCurrentPage, onItemDblClick),
       children: [
         /* @__PURE__ */ jsx(
@@ -905,35 +793,15 @@ const MenuItemLabel = (props) => {
             ...isCurrentPage && {
               "aria-current": "page"
             },
-            children: /* @__PURE__ */ jsxs("span", { className: classes$6.labelWrapper, children: [
-              BuilderAnimationIcon && /* @__PURE__ */ jsx(
-                BuilderAnimationIcon,
-                {
-                  ref: iconAnimatedRef,
-                  "data-testid": "menu-builder-animation-icon"
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                "span",
-                {
-                  className: clsx(
-                    selectors.itemLabel,
-                    classes$6.label,
-                    itemLabelClassName
-                  ),
-                  "data-part": MenuParts.Label,
-                  children: label2
-                }
-              )
-            ] })
+            children: /* @__PURE__ */ jsx("div", { className: classes$6.label, "data-part": MenuParts.Label, children: label2 })
           }
         ),
         hasDropdownMenu && ["default", "srOnly"].map((variant) => {
-          var _a2;
+          var _a;
           return /* @__PURE__ */ jsx(
             MenuItemDropdownIcon,
             {
-              ariaLabel: (_a2 = translations.dropdownButtonAriaLabel) == null ? void 0 : _a2.replace(
+              ariaLabel: (_a = translations.dropdownButtonAriaLabel) == null ? void 0 : _a.replace(
                 "<%= itemName %>",
                 label2
               ),
@@ -1915,8 +1783,7 @@ const MenuContent = (props) => {
     onItemClick,
     onItemDblClick,
     submenuToggleIdPrefix,
-    menuElementProps,
-    BuilderAnimationIcon
+    menuElementProps
   } = props;
   const {
     items,
@@ -2018,8 +1885,7 @@ const MenuContent = (props) => {
             getAnimationPackage,
             submenuDirection,
             submenuToggleIdPrefix,
-            menuElementProps,
-            BuilderAnimationIcon
+            menuElementProps
           },
           item2.id
         )) }),
@@ -2039,18 +1905,14 @@ const MenuContent = (props) => {
   ) });
 };
 const navbar$1 = "navbar__H6ySL";
-const itemIcon = "itemIcon__zQPE-";
 const rtl = "rtl__7sC1t";
 const ltr = "ltr__r9AkY";
 const classes$1 = {
   navbar: navbar$1,
-  itemIcon,
   rtl,
   ltr
 };
-const DEFAULT_ANIMATED_ICON_DURATION = 0.2;
 const NavbarMenu = (props) => {
-  var _a;
   const { getLanguageDirection } = useService(
     EnvironmentDefinition
   );
@@ -2059,39 +1921,13 @@ const NavbarMenu = (props) => {
     id,
     className,
     submenuDirection,
-    elementProps,
     direction = siteDirection,
     onItemClick,
     onItemDblClick,
     onItemMouseIn,
-    onItemMouseOut
+    onItemMouseOut,
+    elementProps
   } = props;
-  const { item: item2 } = elementProps ?? {};
-  const animatedIconProps = (_a = item2 == null ? void 0 : item2.elementProps) == null ? void 0 : _a.animatedIcon;
-  const animatedIconPropsRef = useRef(animatedIconProps);
-  animatedIconPropsRef.current = animatedIconProps;
-  const BuilderAnimationIcon = useMemo(() => {
-    const AnimatedIconWithProps = forwardRef(({ className: iconClassName, ...iconProps }, ref) => {
-      var _a2, _b, _c;
-      return /* @__PURE__ */ jsx(
-        AnimatedIconWithReducedMotion,
-        {
-          ...iconProps,
-          duration: ((_a2 = animatedIconPropsRef.current) == null ? void 0 : _a2.duration) ?? DEFAULT_ANIMATED_ICON_DURATION,
-          svg: (_b = animatedIconPropsRef.current) == null ? void 0 : _b.svg,
-          className: clsx(
-            selectors.animatedIcon,
-            classes$1.itemIcon,
-            (_c = animatedIconPropsRef.current) == null ? void 0 : _c.className,
-            iconClassName
-          ),
-          ref
-        }
-      );
-    });
-    AnimatedIconWithProps.displayName = "NavbarAnimatedIcon";
-    return AnimatedIconWithProps;
-  }, []);
   return /* @__PURE__ */ jsx(
     MenuContent,
     {
@@ -2106,7 +1942,6 @@ const NavbarMenu = (props) => {
       direction,
       submenuDirection,
       onItemClick,
-      BuilderAnimationIcon: (animatedIconProps == null ? void 0 : animatedIconProps.svg) ? BuilderAnimationIcon : void 0,
       onItemDblClick,
       onItemMouseIn,
       onItemMouseOut,

package/dist/site/components/Menu/constants.d.ts

@@ -1,4 +1,3 @@
-import { ACTIONS } from '@wix/component-protocol/schema';
 export declare const MenuOrientation: {
     readonly Horizontal: "horizontal";
     readonly Vertical: "vertical";
@@ -132,10 +131,7 @@ export declare const DisplayNames: {
             justifyContent: string;
             background: string;
             columnGap: string;
-        };
-        cssCustomProperties: {
             'item-icon-size': string;
-            'item-icon-gap': string;
         };
         displayGroups: {
             iconGroup: string;
@@ -145,12 +141,6 @@ export declare const DisplayNames: {
             selected: string;
         };
     };
-    itemLabel: {
-        elementDisplayName: string;
-    };
-    itemIcon: {
-        elementDisplayName: string;
-    };
     dropdown: {
         elementDisplayName: string;
         cssCustomProperties: {
@@ -226,10 +216,6 @@ export declare const DisplayNames: {
         elementDisplayName: string;
     };
 };
-export declare const menuBuiltInActions: {
-    readonly elements: typeof ACTIONS.ACTION_NAME.design;
-};
-export declare const MENU_ANIMATED_ICON_SPEC: "sp.erc.menuAnimatedIcon";
 export declare const selectors: {
     menu: string;
     navbar: string;
@@ -238,8 +224,6 @@ export declare const selectors: {
     dropdownItem: string;
     dropdownSubItem: string;
     scrollButton: string;
-    animatedIcon: string;
-    itemLabel: string;
     hamburgerMenu: string;
     hamburgerMenuContent: string;
     hamburgerMenuHeaderContent: string;
@@ -255,8 +239,6 @@ export declare const elementKeys: {
     subItem: string;
     scrollButton: string;
     dropdown: string;
-    animatedIcon: string;
-    itemLabel: string;
 };
 export declare const presets: {
     horizontalScrollNavbar: string;

package/dist/site/components/Menu/css.css

@@ -73,7 +73,7 @@
   line-height: var(--item-line-height);
 }
 [data-open]:not([data-animation-state=exitActive]):not([data-animation-state=exitDone]) > .itemWrapper__sn71X > .labelContainer__E4y-p path, .labelContainer__E4y-p[data-interactive=true]:hover path, .labelContainer__E4y-p[data-preview=hover] path, .labelContainer__E4y-p.hover__tD6A4 path, .labelContainer__E4y-p.menu__item--hover path {
-  fill: var(--fill, var(--item-hover-icon-color, var(--item-icon-color, currentcolor)));
+  fill: var(--item-hover-icon-color, var(--item-icon-color, currentcolor));
 }
 .labelContainer__E4y-p[data-selected], .labelContainer__E4y-p[data-preview=selected], .labelContainer__E4y-p.selected__qC-k6, .labelContainer__E4y-p.menu__item--selected {
   background: var(--item-selected-background, var(--item-background));
@@ -89,7 +89,7 @@
   line-height: var(--item-line-height);
 }
 .labelContainer__E4y-p[data-selected] path, .labelContainer__E4y-p[data-preview=selected] path, .labelContainer__E4y-p.selected__qC-k6 path, .labelContainer__E4y-p.menu__item--selected path {
-  fill: var(--fill, var(--item-selected-icon-color, var(--item-icon-color, currentcolor)));
+  fill: var(--item-selected-icon-color, var(--item-icon-color, currentcolor));
 }
 .labelContainer__E4y-p > a::before {
   content: "";
@@ -131,13 +131,6 @@
   }
 }
 
-.labelWrapper__u5Jgh {
-  display: flex;
-  align-items: center;
-  min-width: 0;
-  gap: var(--item-icon-gap, 0);
-}
-
 @media (forced-colors: active) {
   .dropdownToggleButton__nisoC,
   .dropdownToggleButton__nisoC svg,
@@ -773,12 +766,6 @@
   --sr-only-item-icon-display: none;
 }
 
-.itemIcon__zQPE- {
-  display: flex;
-  align-items: center;
-  flex-shrink: 0;
-}
-
 .rtl__7sC1t {
   --scroll-button-transform: scaleX(-1);
 }
@@ -900,30 +887,6 @@
 .fallbackDirection__HeRgn:not([dir]) {
   direction: var(--wix-opt-in-direction);
 }
-.animatedIcon__3o5ii {
-  --size: 16px;
-  --fill: #000000;
-  --rotation: 0deg;
-}
-.animatedIcon__3o5ii {
-  display: block;
-  width: inherit;
-  height: inherit;
-  width: var(--size);
-  height: var(--size);
-}
-.animatedIcon__3o5ii svg {
-  width: var(--size);
-  height: var(--size);
-  display: block;
-  fill: var(--fill);
-  transform: rotate(var(--rotation));
-}
-@media (forced-colors: active) {
-  .animatedIcon__3o5ii svg {
-    fill: currentColor;
-  }
-}
 .rootDirection__PPhdq {
   direction: var(--btn-direction);
 }
@@ -1048,4 +1011,28 @@
 
 .button__i8gkO {
   min-width: min-content !important;
+}
+.animatedIcon__3o5ii {
+  --size: 16px;
+  --fill: #000000;
+  --rotation: 0deg;
+}
+.animatedIcon__3o5ii {
+  display: block;
+  width: inherit;
+  height: inherit;
+  width: var(--size);
+  height: var(--size);
+}
+.animatedIcon__3o5ii svg {
+  width: var(--size);
+  height: var(--size);
+  display: block;
+  fill: var(--fill);
+  transform: rotate(var(--rotation));
+}
+@media (forced-colors: active) {
+  .animatedIcon__3o5ii svg {
+    fill: currentColor;
+  }
 }

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

@@ -1,5 +1,5 @@
 import { E as ELEMENTS, C as CSS_PROPERTIES, b as DISPLAY_GROUPS, N as NativeStateType, a as ACTIONS, D as DATA, L as LAYOUT, I as INTERACTIONS, A as Archetype } from "../chunks/chunk-V7QOLP3D.js";
-import { c as DesignStates, f as DisplayNames, s as selectors, g as DropdownAnchorPositions, h as DropdownAppliedStyleProperties, i as elementKeys, j as MENU_ANIMATED_ICON_SPEC, k as states, p as presets, m as menuBuiltInActions } from "../chunks/constants27.js";
+import { c as DesignStates, f as DisplayNames, s as selectors, g as DropdownAnchorPositions, h as DropdownAppliedStyleProperties, i as elementKeys, j as states, p as presets } from "../chunks/constants27.js";
 import { w as withSpec } from "../chunks/manifest.js";
 import { I as IS_SUPPORT_DESIGN_STATE_SPEC } from "../chunks/specs.js";
 import { c as manifestMouseHover } from "../chunks/manifestSdkMixins.js";
@@ -509,53 +509,6 @@ const scrollButtonConfig = {
     }
   }
 };
-const animatedIconConfig = {
-  spec: MENU_ANIMATED_ICON_SPEC,
-  elementType: ELEMENTS.ELEMENT_TYPE.refElement,
-  [ELEMENTS.ELEMENT_TYPE.refElement]: {
-    displayName: DisplayNames.itemIcon.elementDisplayName,
-    selector: `.${selectors.animatedIcon}`,
-    type: "wixEditorElements.AnimatedIcon",
-    behaviors: {
-      selectable: false,
-      removable: true
-    },
-    cssProperties: {
-      display: {
-        defaultValue: CSS_PROPERTIES.DISPLAY_VALUE.none
-      }
-    }
-  }
-};
-const itemLabelDisplayConfig = {
-  displayValues: [
-    CSS_PROPERTIES.DISPLAY_VALUE.none,
-    CSS_PROPERTIES.DISPLAY_VALUE.flex
-  ]
-};
-const itemLabelConfig = {
-  elementType: ELEMENTS.ELEMENT_TYPE.inlineElement,
-  [ELEMENTS.ELEMENT_TYPE.inlineElement]: {
-    selector: `.${selectors.itemLabel}`,
-    displayName: DisplayNames.itemLabel.elementDisplayName,
-    behaviors: {
-      selectable: false,
-      removable: true
-    },
-    cssProperties: {
-      display: {
-        display: itemLabelDisplayConfig
-      },
-      font: { defaultValue: "14px sans-serif" },
-      color: { defaultValue: "rgba(0, 0, 0, 1)" },
-      textDecorationLine: { defaultValue: "none" },
-      textTransform: { defaultValue: "none" },
-      letterSpacing: { defaultValue: "normal" },
-      textShadow: { defaultValue: "none" },
-      textAlign: { defaultValue: "center" }
-    }
-  }
-};
 const itemConfig = {
   elementType: ELEMENTS.ELEMENT_TYPE.inlineElement,
   [ELEMENTS.ELEMENT_TYPE.inlineElement]: {
@@ -616,21 +569,14 @@ const itemConfig = {
       }
     },
     cssCustomProperties: {
+      // Icon
       "item-icon-size": {
-        displayName: DisplayNames.item.cssCustomProperties["item-icon-size"],
+        displayName: DisplayNames.item.cssProperties["item-icon-size"],
         cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.length
       },
       "item-icon-color": {
         cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.color
-      },
-      "item-icon-gap": {
-        displayName: DisplayNames.item.cssCustomProperties["item-icon-gap"],
-        cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.columnGap
       }
-    },
-    elements: {
-      [elementKeys.itemLabel]: itemLabelConfig,
-      [elementKeys.animatedIcon]: animatedIconConfig
     }
   }
 };
@@ -1271,15 +1217,6 @@ const manifest = {
           }
         }
       },
-      elements: {
-        execution: {
-          actionType: ACTIONS.ACTION_TYPE.forward,
-          forward: {
-            elementPath: `.self.${elementKeys.navbar}.${elementKeys.item}`,
-            actionName: menuBuiltInActions.elements
-          }
-        }
-      },
       design: {
         displayName: DisplayNames.root.actions.design
       },
@@ -1303,7 +1240,7 @@ const manifest = {
         execution: {
           actionType: ACTIONS.ACTION_TYPE.forward,
           forward: {
-            elementPath: `.self.${elementKeys.navbar}.${elementKeys.item}.${elementKeys.animatedIcon}`,
+            elementPath: `.self.${elementKeys.hamburgerOpenButton}.animatedIcon`,
             actionName: ACTIONS.ACTION_NAME.custom,
             custom: "animatedIcon"
           }
@@ -1442,7 +1379,6 @@ const manifest = {
         "@wix/viewer-service-url"
       ],
       dependencies: {
-        componentDependencies: ["@wix/editor-react-components/AnimatedIcon"],
         serviceDependencies: [
           "@wix/viewer-service-anchors",
           "@wix/viewer-service-environment",

package/dist/site/components/Menu/manifestConfigs/itemConfig.d.ts

@@ -1,5 +1,2 @@
-import { ElementItem, CssPropertyItem } from '@wix/component-protocol/schema';
-export declare const itemLabelDisplayConfig: CssPropertyItem["display"];
-export declare const HIDDEN_ITEM_TEXT_CSS_PROPERTIES: readonly ["font", "color", "textDecorationLine", "textTransform", "letterSpacing", "textShadow"];
-export declare const itemLabelConfig: ElementItem;
+import { ElementItem } from '@wix/component-protocol/schema';
 export declare const itemConfig: ElementItem;

package/dist/site/components/Menu/manifestConfigs/overrides/horizontalHugNavbarConfig.d.ts

@@ -8,8 +8,6 @@ type HorizontalHugNavbarProps = {
     isDropdownAnchorScreen: boolean;
     isDropdownAnchorMenuItem: boolean;
     dropdownColumnsNumber: string;
-    hideItemIconGap: boolean;
-    isIconHidden: boolean;
 };
 export declare const getHorizontalHugNavbarManifestOverrides: (props: HorizontalHugNavbarProps) => Partial<EditorElement>;
 export {};