@wix/editor-react-components 1.2452.0 → 1.2453.0

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

@@ -783,7 +783,8 @@ const MenuItemLabel = (props) => {
     toggleDropdown,
     isOpen,
     dropdownAnimationState,
-    submenuToggleId
+    submenuToggleId,
+    itemClassName
   } = props;
   const itemLabelClassNames = clsx(
     classes$6.label,
@@ -798,7 +799,8 @@ const MenuItemLabel = (props) => {
     selectors.item,
     classes$6.labelContainer,
     formatClassNames(shmSemanticClassNames.menuItemWrapper),
-    formatClassNames(menuSemanticClassNames.item)
+    formatClassNames(menuSemanticClassNames.item),
+    itemClassName
   );
   const isInteractive = (hasSubItems || hasLink) && !isCurrentPage;
   const isDropdownIconOpen = isOpen && dropdownAnimationState.phase !== AnimationPhase.ExitActive;
@@ -1268,7 +1270,9 @@ const ItemList = ({
   onItemClick,
   onItemMouseIn,
   onItemMouseOut,
-  onItemDblClick
+  onItemDblClick,
+  dropdownItemClassName,
+  dropdownSubItemClassName
 }) => {
   const subMenuContainerClasses = clsx(
     isRootLevel ? styles.list : styles.subList,
@@ -1279,7 +1283,7 @@ const ItemList = ({
   );
   const submenuItemLinkClasses = (isCurrent) => {
     return clsx(
-      isRootLevel ? [styles.item, selectors.dropdownItem] : [styles.subItem, selectors.dropdownSubItem],
+      isRootLevel ? [styles.item, selectors.dropdownItem, dropdownItemClassName] : [styles.subItem, selectors.dropdownSubItem, dropdownSubItemClassName],
       {
         [styles.selected]: isCurrent
       },
@@ -1365,7 +1369,8 @@ const ItemList = ({
                   onItemClick,
                   onItemMouseIn,
                   onItemMouseOut,
-                  onItemDblClick
+                  onItemDblClick,
+                  dropdownSubItemClassName
                 }
               )
             ]
@@ -1385,7 +1390,9 @@ const Submenu = (props) => {
     onItemClick,
     onItemMouseIn,
     onItemMouseOut,
-    onItemDblClick
+    onItemDblClick,
+    dropdownItemClassName,
+    dropdownSubItemClassName
   } = props;
   const { item: item2, currentItem, onEscKeyDown } = useMenuItemContext();
   return /* @__PURE__ */ jsx(
@@ -1406,7 +1413,9 @@ const Submenu = (props) => {
           onItemClick,
           onItemMouseIn,
           onItemMouseOut,
-          onItemDblClick
+          onItemDblClick,
+          dropdownItemClassName,
+          dropdownSubItemClassName
         }
       )
     }
@@ -1431,8 +1440,11 @@ const Dropdown = React__default.forwardRef(
     dropdownAnimationState,
     onEscKeyDown,
     direction,
-    onItemClick
+    onItemClick,
+    className,
+    elementProps
   }, ref) => {
+    var _a, _b;
     const rootClassNames = {
       [MenuOrientation.Horizontal]: [
         classes$6.horizontalDropdownDisplayWrapper
@@ -1449,7 +1461,8 @@ const Dropdown = React__default.forwardRef(
         className: clsx(
           selectors.dropdown,
           classes$5.dropdown,
-          ...rootClassNames[menuOrientation]
+          ...rootClassNames[menuOrientation],
+          className
         ),
         dir: direction,
         ref,
@@ -1477,7 +1490,9 @@ const Dropdown = React__default.forwardRef(
                     {
                       id: `${item2.id}-submenu`,
                       className: clsx(classes$5.submenu, "submenu"),
-                      onItemClick
+                      onItemClick,
+                      dropdownItemClassName: (_a = elementProps == null ? void 0 : elementProps.item) == null ? void 0 : _a.className,
+                      dropdownSubItemClassName: (_b = elementProps == null ? void 0 : elementProps.subItem) == null ? void 0 : _b.className
                     }
                   ),
                   displayContainer && /* @__PURE__ */ jsx("div", { className: classes$5.container, children: item2.container })
@@ -1491,7 +1506,7 @@ const Dropdown = React__default.forwardRef(
   }
 );
 const MenuItem = (props) => {
-  var _a;
+  var _a, _b, _c, _d;
   const {
     item: item2,
     currentItem,
@@ -1503,7 +1518,8 @@ const MenuItem = (props) => {
     onItemMouseIn,
     onItemMouseOut,
     onItemDblClick,
-    submenuToggleIdPrefix
+    submenuToggleIdPrefix,
+    menuElementProps
   } = props;
   const { forceOpen = false } = item2;
   const { animationState, initEnterAnimation, initExitAnimation } = useAnimationState(MENU_ITEM_ANIMATION_CONFIG, INITIAL_ANIMATION_STATE);
@@ -1576,11 +1592,11 @@ const MenuItem = (props) => {
     }
   }, [currentItem, item2, focusOnMenuItem]);
   useLayoutEffect(() => {
-    var _a2, _b;
+    var _a2, _b2;
     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"))) {
+    if (hasDropdownMenu && !isOpen && ((_b2 = itemRef.current) == null ? void 0 : _b2.matches(":hover"))) {
       showDropdownImmediate();
     }
   }, []);
@@ -1632,7 +1648,10 @@ const MenuItem = (props) => {
     onItemClick,
     onItemMouseIn,
     onItemMouseOut,
-    onItemDblClick
+    onItemDblClick,
+    className: (_b = menuElementProps == null ? void 0 : menuElementProps.dropdown) == null ? void 0 : _b.className,
+    elementProps: (_c = menuElementProps == null ? void 0 : menuElementProps.dropdown) == null ? void 0 : _c.elementProps,
+    direction: submenuDirection
   };
   return /* @__PURE__ */ jsxs(
     "li",
@@ -1670,7 +1689,8 @@ const MenuItem = (props) => {
               toggleDropdown,
               isOpen,
               dropdownAnimationState,
-              submenuToggleId
+              submenuToggleId,
+              itemClassName: (_d = menuElementProps == null ? void 0 : menuElementProps.item) == null ? void 0 : _d.className
             }
           ),
           hasDropdownMenu && /* @__PURE__ */ jsx(
@@ -1678,8 +1698,7 @@ const MenuItem = (props) => {
             {
               ...sharedDropdownProps,
               menuOrientation: "horizontal",
-              ref: forceOpen ? dropdownElementRef : void 0,
-              direction: submenuDirection
+              ref: forceOpen ? dropdownElementRef : void 0
             }
           )
         ] }),
@@ -1689,8 +1708,7 @@ const MenuItem = (props) => {
             ...sharedDropdownProps,
             menuOrientation: "vertical",
             isOpen,
-            partToPreviewStateMap,
-            direction: submenuDirection
+            partToPreviewStateMap
           }
         ),
         /* @__PURE__ */ jsx("span", { className: classes$6.divider })
@@ -1766,10 +1784,12 @@ const ScrollControls = (props) => {
     isScrollForwardButtonShown,
     scrollPageForward,
     scrollPageToBackward,
-    previewState
+    previewState,
+    scrollButtonClassName
   } = props;
   const sharedButtonProps = {
-    previewState
+    previewState,
+    className: scrollButtonClassName
   };
   return /* @__PURE__ */ jsxs("div", { className: classes$2.root, children: [
     /* @__PURE__ */ jsx(
@@ -1798,6 +1818,7 @@ const DataHooks = {
   menuRoot: "menu-root"
 };
 const MenuContent = (props) => {
+  var _a;
   const {
     id,
     className,
@@ -1809,7 +1830,8 @@ const MenuContent = (props) => {
     onItemMouseOut,
     onItemClick,
     onItemDblClick,
-    submenuToggleIdPrefix
+    submenuToggleIdPrefix,
+    menuElementProps
   } = props;
   const {
     items,
@@ -1913,7 +1935,8 @@ const MenuContent = (props) => {
             onItemDblClick,
             getAnimationPackage,
             submenuDirection,
-            submenuToggleIdPrefix
+            submenuToggleIdPrefix,
+            menuElementProps
           },
           item2.id
         )) }),
@@ -1924,7 +1947,8 @@ const MenuContent = (props) => {
             scrollPageToBackward: handleScrollBackward,
             isScrollBackwardButtonShown: isScrollBackwardButtonVisible,
             isScrollForwardButtonShown: isScrollForwardButtonVisible,
-            previewState: partToPreviewStateMap == null ? void 0 : partToPreviewStateMap["scroll-button"]
+            previewState: partToPreviewStateMap == null ? void 0 : partToPreviewStateMap["scroll-button"],
+            scrollButtonClassName: (_a = menuElementProps == null ? void 0 : menuElementProps.scrollButton) == null ? void 0 : _a.className
           }
         )
       ]
@@ -1952,7 +1976,8 @@ const NavbarMenu = (props) => {
     onItemClick,
     onItemDblClick,
     onItemMouseIn,
-    onItemMouseOut
+    onItemMouseOut,
+    elementProps
   } = props;
   return /* @__PURE__ */ jsx(
     MenuContent,
@@ -1970,7 +1995,8 @@ const NavbarMenu = (props) => {
       onItemClick,
       onItemDblClick,
       onItemMouseIn,
-      onItemMouseOut
+      onItemMouseOut,
+      menuElementProps: elementProps
     }
   );
 };
@@ -2081,6 +2107,7 @@ const HamburgerMenu = ({
     navbar: navbarProps,
     hamburgerOpenButton: hamburgerOpenButtonProps,
     hamburgerMenu: {
+      className: hamburgerMenuClassName,
       content: content2,
       headerContent: headerContent2,
       elementProps: {
@@ -2168,7 +2195,10 @@ const HamburgerMenu = ({
               ariaLabel: translations.hamburgerOpenButtonAriaLabel,
               ...hamburgerOpenButtonProps == null ? void 0 : hamburgerOpenButtonProps.a11y
             },
-            className: selectors.hamburgerMenuOpenButton,
+            className: clsx(
+              selectors.hamburgerMenuOpenButton,
+              hamburgerOpenButtonProps == null ? void 0 : hamburgerOpenButtonProps.className
+            ),
             onClick: () => setIsMenuOpen(true)
           }
         )
@@ -2180,7 +2210,8 @@ const HamburgerMenu = ({
         className: clsx(
           selectors.hamburgerMenu,
           classes.dialog,
-          animationClasses.dialog
+          animationClasses.dialog,
+          hamburgerMenuClassName
         ),
         role: "dialog",
         "aria-modal": "true",
@@ -2214,7 +2245,8 @@ const HamburgerMenu = ({
                   },
                   className: clsx(
                     selectors.hamburgerMenuCloseButton,
-                    classes.closeButton
+                    classes.closeButton,
+                    hamburgerCloseButtonProps == null ? void 0 : hamburgerCloseButtonProps.className
                   ),
                   onClick: closeMenu
                 }

package/dist/site/components/Menu/components/MenuContent/MenuItem/MenuItemLabel.d.ts

@@ -11,4 +11,5 @@ export declare const MenuItemLabel: React.FC<IMenuItemProps & {
     isOpen: boolean;
     dropdownAnimationState: AnimationState<DropdownAnimationNameType>;
     submenuToggleId?: string;
+    itemClassName?: string;
 }>;

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

@@ -17,6 +17,8 @@ type SubmenuBaseProps = {
     onItemMouseIn?: IMenuItemSDKAction;
     onItemMouseOut?: IMenuItemSDKAction;
     onItemDblClick?: IMenuItemSDKAction;
+    dropdownItemClassName?: string;
+    dropdownSubItemClassName?: string;
 };
 export type SubmenuProps = SubmenuBaseProps & SubmenuPreviewMapperProps;
 export {};

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

@@ -1,7 +1,7 @@
 import { ElementItem } from '@wix/component-protocol/schema';
 import { elementKeys } from '../constants';
 export declare const dropdownConfig: {
-    elementType: import("@wix/ambassador-devcenter-v1-component-type-data/types").ElementTypeEnumElementType.inlineElement;
+    elementType: import("@wix/component-protocol/schema").ElementTypeEnumElementType.inlineElement;
     inlineElement: {
         selector: string;
         displayName: string;
@@ -10,7 +10,7 @@ export declare const dropdownConfig: {
         };
         displayGroups: {
             dropdownContainerGroup: {
-                groupType: import("@wix/ambassador-devcenter-v1-component-type-data/types").GroupType.padding;
+                groupType: import("@wix/component-protocol/schema").GroupType.padding;
                 padding: {
                     top: string;
                     bottom: string;
@@ -19,7 +19,7 @@ export declare const dropdownConfig: {
                 };
             };
             gapGroup: {
-                groupType: import("@wix/ambassador-devcenter-v1-component-type-data/types").GroupType.gap;
+                groupType: import("@wix/component-protocol/schema").GroupType.gap;
                 displayName: string;
                 gap: {
                     columnGap: string;
@@ -27,7 +27,7 @@ export declare const dropdownConfig: {
                 };
             };
             borderColorGroup: {
-                groupType: import("@wix/ambassador-devcenter-v1-component-type-data/types").GroupType.borderColor;
+                groupType: import("@wix/component-protocol/schema").GroupType.borderColor;
                 borderColor: {
                     top: string;
                     right: string;
@@ -36,7 +36,7 @@ export declare const dropdownConfig: {
                 };
             };
             borderWidthGroup: {
-                groupType: import("@wix/ambassador-devcenter-v1-component-type-data/types").GroupType.borderWidth;
+                groupType: import("@wix/component-protocol/schema").GroupType.borderWidth;
                 borderWidth: {
                     top: string;
                     right: string;
@@ -45,7 +45,7 @@ export declare const dropdownConfig: {
                 };
             };
             borderStyleGroup: {
-                groupType: import("@wix/ambassador-devcenter-v1-component-type-data/types").GroupType.borderStyle;
+                groupType: import("@wix/component-protocol/schema").GroupType.borderStyle;
                 borderStyle: {
                     top: string;
                     right: string;
@@ -54,7 +54,7 @@ export declare const dropdownConfig: {
                 };
             };
             borderGroup: {
-                groupType: import("@wix/ambassador-devcenter-v1-component-type-data/types").GroupType.border;
+                groupType: import("@wix/component-protocol/schema").GroupType.border;
                 border: {
                     color: string;
                     width: string;
@@ -62,7 +62,7 @@ export declare const dropdownConfig: {
                 };
             };
             layoutGroup: {
-                groupType: import("@wix/ambassador-devcenter-v1-component-type-data/types").GroupType.cssDataType;
+                groupType: import("@wix/component-protocol/schema").GroupType.cssDataType;
                 cssDataType: {
                     items: string[];
                 };
@@ -71,10 +71,10 @@ export declare const dropdownConfig: {
         cssCustomProperties: {
             anchor: {
                 displayName: string;
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.customEnum;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.customEnum;
                 defaultValue: string;
                 customEnum: {
-                    cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.string;
+                    cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.string;
                     options: ({
                         displayName: string;
                         value: string;
@@ -101,10 +101,10 @@ export declare const dropdownConfig: {
             };
             align: {
                 displayName: string;
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.customEnum;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.customEnum;
                 defaultValue: string;
                 customEnum: {
-                    cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.string;
+                    cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.string;
                     options: {
                         displayName: string;
                         value: string;
@@ -113,10 +113,10 @@ export declare const dropdownConfig: {
             };
             'items-width': {
                 displayName: string;
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.customEnum;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.customEnum;
                 defaultValue: string;
                 customEnum: {
-                    cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.string;
+                    cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.string;
                     options: {
                         value: string;
                         displayName: string;
@@ -129,106 +129,106 @@ export declare const dropdownConfig: {
             };
             'dropdown-menu-item-text-align': {
                 displayName: string;
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.justifyContent;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.justifyContent;
             };
             'dropdown-menu-item-container-align': {
                 displayName: string;
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.justifyContent;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.justifyContent;
             };
             'columns-number': {
                 displayName: string;
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.number;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.number;
                 number: {
                     minimum: number;
                 };
             };
             'space-above': {
                 displayName: string;
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.rowGap;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.rowGap;
             };
             'horizontal-margin': {
                 displayName: string;
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.columnGap;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.columnGap;
             };
             'dropdown-container-background': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.background;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.background;
                 background: {};
             };
             'dropdown-container-box-shadow': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.boxShadow;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.boxShadow;
             };
             'dropdown-container-border-inline-start-color': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderInlineStartColor;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderInlineStartColor;
             };
             'dropdown-container-border-inline-start-style': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderInlineStartStyle;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderInlineStartStyle;
             };
             'dropdown-container-border-inline-start-width': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderInlineStartWidth;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderInlineStartWidth;
             };
             'dropdown-container-border-inline-end-color': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderInlineEndColor;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderInlineEndColor;
             };
             'dropdown-container-border-inline-end-style': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderInlineEndStyle;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderInlineEndStyle;
             };
             'dropdown-container-border-inline-end-width': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderInlineEndWidth;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderInlineEndWidth;
             };
             'dropdown-container-border-top-color': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderTopColor;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderTopColor;
             };
             'dropdown-container-border-top-style': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderTopStyle;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderTopStyle;
             };
             'dropdown-container-border-top-width': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderTopWidth;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderTopWidth;
             };
             'dropdown-container-border-bottom-color': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderBottomColor;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderBottomColor;
             };
             'dropdown-container-border-bottom-style': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderBottomStyle;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderBottomStyle;
             };
             'dropdown-container-border-bottom-width': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderBottomWidth;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderBottomWidth;
             };
             'dropdown-container-border-start-start-radius': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderStartStartRadius;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderStartStartRadius;
             };
             'dropdown-container-border-start-end-radius': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderStartEndRadius;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderStartEndRadius;
             };
             'dropdown-container-border-end-start-radius': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderEndStartRadius;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderEndStartRadius;
             };
             'dropdown-container-border-end-end-radius': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.borderEndEndRadius;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.borderEndEndRadius;
             };
             'dropdown-container-padding-top': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.paddingTop;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.paddingTop;
             };
             'dropdown-container-padding-bottom': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.paddingBottom;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.paddingBottom;
             };
             'dropdown-container-padding-inline-start': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.paddingInlineStart;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.paddingInlineStart;
             };
             'dropdown-container-padding-inline-end': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.paddingInlineEnd;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.paddingInlineEnd;
             };
             'dropdown-menu-item-horizontal-spacing': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.columnGap;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.columnGap;
             };
             'dropdown-menu-item-vertical-spacing': {
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.rowGap;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.rowGap;
             };
             'item-position': {
                 displayName: string;
-                cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.customEnum;
+                cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.customEnum;
                 defaultValue: string;
                 customEnum: {
-                    cssPropertyType: import("@wix/ambassador-devcenter-v1-component-type-data/types").CssPropertyEnumCssPropertyType.string;
+                    cssPropertyType: import("@wix/component-protocol/schema").CssPropertyEnumCssPropertyType.string;
                     options: {
                         displayName: string;
                         value: string;

package/dist/site/components/ProgressBar/ProgressBar.d.ts

@@ -1,5 +1,13 @@
 import { default as React } from 'react';
 import { A11y, Direction } from '@wix/editor-react-types';
+export type ProgressBarItemElementProps = {
+    className?: string;
+    direction?: Direction;
+};
+export type ProgressBarElementProps = {
+    bar?: ProgressBarItemElementProps;
+    label?: ProgressBarItemElementProps;
+};
 export type ProgressBarProps = {
     id: string;
     className: string;
@@ -7,14 +15,7 @@ export type ProgressBarProps = {
     label?: string;
     a11y?: A11y;
     targetValue?: number;
-    elementProps?: {
-        bar?: {
-            direction?: Direction;
-        };
-        label?: {
-            direction?: Direction;
-        };
-    };
+    elementProps?: ProgressBarElementProps;
 };
 declare const ProgressBar: React.FC<ProgressBarProps>;
 export default ProgressBar;

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

@@ -18,7 +18,7 @@ const styles = {
   barForeground
 };
 const ProgressBar = (props) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   const {
     id,
     className,
@@ -61,7 +61,11 @@ const ProgressBar = (props) => {
             ...labelDirection && { dir: labelDirection },
             "data-testid": TestIDs.label,
             id: `label_${id}`,
-            className: clsx(styles.label, "label"),
+            className: clsx(
+              styles.label,
+              "label",
+              (_c = elementProps == null ? void 0 : elementProps.label) == null ? void 0 : _c.className
+            ),
             children: label2
           }
         ),
@@ -73,7 +77,8 @@ const ProgressBar = (props) => {
             className: clsx(
               "barContainer",
               styles.barContainer,
-              directionStyles.fallbackDirection
+              directionStyles.fallbackDirection,
+              (_d = elementProps == null ? void 0 : elementProps.bar) == null ? void 0 : _d.className
             ),
             children: [
               /* @__PURE__ */ jsx(

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

@@ -3,6 +3,17 @@ import { SdkFunctionFocusableProps } from '../../../utils/functions/sdkFunctionC
 import { FieldValidationProps } from '../../../utils/validation/types';
 import { RadioButtonsDefaultSelection, RadioButtonsOption } from './constants';
 export type { RadioButtonsOption } from './constants';
+export type RadioButtonsElementProps = {
+    radio?: {
+        className?: string;
+    };
+    optionLabel?: {
+        className?: string;
+    };
+    groupLabel?: {
+        className?: string;
+    };
+};
 export type RadioButtonsProps = SdkFunctionFocusableProps & FieldValidationProps<string> & {
     id: string;
     className: string;
@@ -20,4 +31,5 @@ export type RadioButtonsProps = SdkFunctionFocusableProps & FieldValidationProps
     wix?: {
         presetsWrapperProps?: Record<string, unknown>;
     };
+    elementProps?: RadioButtonsElementProps;
 };