@wix/editor-react-components 1.2697.0 → 1.2699.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2287,6 +2287,7 @@ const HamburgerMenu = ({
2287
2287
  }
2288
2288
  }
2289
2289
  }) => {
2290
+ var _a, _b;
2290
2291
  const { translations, navAriaLabel } = useMenuContext();
2291
2292
  const environment = useService(EnvironmentDefinition);
2292
2293
  const reducedMotion = (environment == null ? void 0 : environment.reducedMotion) ?? false;
@@ -2361,8 +2362,8 @@ const HamburgerMenu = ({
2361
2362
  label: "",
2362
2363
  labelContent: "",
2363
2364
  a11y: {
2364
- ariaLabel: translations.hamburgerOpenButtonAriaLabel,
2365
- ...hamburgerOpenButtonProps == null ? void 0 : hamburgerOpenButtonProps.a11y
2365
+ ...hamburgerOpenButtonProps == null ? void 0 : hamburgerOpenButtonProps.a11y,
2366
+ ariaLabel: ((_a = hamburgerOpenButtonProps == null ? void 0 : hamburgerOpenButtonProps.a11y) == null ? void 0 : _a.ariaLabel) || translations.hamburgerOpenButtonAriaLabel
2366
2367
  },
2367
2368
  className: clsx(
2368
2369
  selectors.hamburgerMenuOpenButton,
@@ -2409,8 +2410,8 @@ const HamburgerMenu = ({
2409
2410
  label: "",
2410
2411
  labelContent: "",
2411
2412
  a11y: {
2412
- ariaLabel: translations.hamburgerCloseButtonAriaLabel,
2413
- ...hamburgerCloseButtonProps == null ? void 0 : hamburgerCloseButtonProps.a11y
2413
+ ...hamburgerCloseButtonProps == null ? void 0 : hamburgerCloseButtonProps.a11y,
2414
+ ariaLabel: ((_b = hamburgerCloseButtonProps == null ? void 0 : hamburgerCloseButtonProps.a11y) == null ? void 0 : _b.ariaLabel) || translations.hamburgerCloseButtonAriaLabel
2414
2415
  },
2415
2416
  className: clsx(
2416
2417
  selectors.hamburgerMenuCloseButton,
@@ -1,7 +1,7 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { useState, useEffect, useCallback, useMemo, useRef, useLayoutEffect } from "react";
3
3
  import { c as clsx } from "../chunks/clsx.js";
4
- import { O as OVERFLOW_BEHAVIOR, c as classes } from "../chunks/constants20.js";
4
+ import { O as OVERFLOW_BEHAVIOR, c as classes, D as DesignStates } from "../chunks/constants20.js";
5
5
  import { d as debounce } from "../chunks/performanceUtils.js";
6
6
  import { useService } from "@wix/services-manager-react";
7
7
  import { E as EnvironmentDefinition } from "../chunks/index2.js";
@@ -11,9 +11,9 @@ const tabMenu = "tab-menu__LMnG9";
11
11
  const tabMenuItemsWrapper = "tab-menu-items-wrapper__dvJqZ";
12
12
  const tabMenuItems = "tab-menu-items__eqjW5";
13
13
  const menuItem = "menu-item__BJ1CW";
14
- const isActive = "is-active__tEw9F";
15
14
  const tabContent = "tab-content__IB3Kn";
16
15
  const tabContentItem = "tab-content-item__7WLdI";
16
+ const isActive = "is-active__tEw9F";
17
17
  const isPrevious = "is-previous__BxrT5";
18
18
  const transitionTypeSlide = "transition-type-slide__kkpIQ";
19
19
  const enter = "enter__t-a57";
@@ -37,12 +37,12 @@ const styles$1 = {
37
37
  tabMenuItems,
38
38
  "menu-item": "menu-item__BJ1CW",
39
39
  menuItem,
40
- "is-active": "is-active__tEw9F",
41
- isActive,
42
40
  "tab-content": "tab-content__IB3Kn",
43
41
  tabContent,
44
42
  "tab-content-item": "tab-content-item__7WLdI",
45
43
  tabContentItem,
44
+ "is-active": "is-active__tEw9F",
45
+ isActive,
46
46
  "is-previous": "is-previous__BxrT5",
47
47
  isPrevious,
48
48
  "transition-type-slide": "transition-type-slide__kkpIQ",
@@ -467,9 +467,7 @@ const Tabs = (props) => {
467
467
  classes.menuItem,
468
468
  HAS_CUSTOM_FOCUS_CLASSNAME,
469
469
  (_a2 = elementProps == null ? void 0 : elementProps.menuItem) == null ? void 0 : _a2.className,
470
- {
471
- [styles$1["is-active"]]: isActive2
472
- }
470
+ isActive2 && DesignStates.menuItem.selected.className
473
471
  ),
474
472
  onMouseDown: (event) => event.preventDefault(),
475
473
  onClick: () => {
@@ -30,6 +30,10 @@ export declare const DesignStates: {
30
30
  readonly displayName: "Hover";
31
31
  readonly className: "tabs__item--hover";
32
32
  };
33
+ readonly selected: {
34
+ readonly displayName: "Selected";
35
+ readonly className: "tabs__item--selected";
36
+ };
33
37
  };
34
38
  };
35
39
  export declare const ROOT_MENU_ITEM_CUSTOM_PROPERTIES: readonly ["menu-item-background", "menu-item-box-shadow", "menu-item-color", "menu-item-text-decoration-line", "menu-item-letter-spacing", "menu-item-text-shadow", "menu-item-text-align", "menu-item-flex", "menu-item-border-width-top", "menu-item-border-width-bottom", "menu-item-border-width-inline-start", "menu-item-border-width-inline-end", "menu-item-border-style-top", "menu-item-border-style-bottom", "menu-item-border-style-inline-start", "menu-item-border-style-inline-end", "menu-item-border-color-top", "menu-item-border-color-bottom", "menu-item-border-color-inline-start", "menu-item-border-color-inline-end", "menu-item-border-radius-start-start", "menu-item-border-radius-start-end", "menu-item-border-radius-end-start", "menu-item-border-radius-end-end", "menu-item-padding-top", "menu-item-padding-bottom", "menu-item-padding-inline-start", "menu-item-padding-inline-end"];
@@ -107,10 +107,7 @@
107
107
  outline: 2px solid #116dff;
108
108
  outline-offset: -2px;
109
109
  }
110
- .menu-item__BJ1CW:hover, .menu-item__BJ1CW.tabs__item--hover {
111
- text-decoration: underline;
112
- }
113
- .menu-item__BJ1CW.is-active__tEw9F {
110
+ .menu-item__BJ1CW:hover, .menu-item__BJ1CW.tabs__item--hover, .menu-item__BJ1CW.tabs__item--selected {
114
111
  text-decoration: underline;
115
112
  }
116
113
  @media (forced-colors: active) {
@@ -118,7 +115,7 @@
118
115
  outline: 2px solid ButtonText;
119
116
  outline-offset: 0px;
120
117
  }
121
- .menu-item__BJ1CW:hover, .menu-item__BJ1CW.tabs__item--hover, .menu-item__BJ1CW.is-active__tEw9F {
118
+ .menu-item__BJ1CW:hover, .menu-item__BJ1CW.tabs__item--hover, .menu-item__BJ1CW.tabs__item--selected {
122
119
  outline: 3px solid Highlight;
123
120
  outline-offset: -2px;
124
121
  }
@@ -29,7 +29,7 @@ const menuItemConfig = {
29
29
  textDecorationLine: {
30
30
  displayName: "Text decoration",
31
31
  defaultValue: "none",
32
- statesDefaultValues: { hover: "underline" }
32
+ statesDefaultValues: { hover: "underline", selected: "underline" }
33
33
  },
34
34
  letterSpacing: {
35
35
  displayName: "Letter spacing",
@@ -99,6 +99,11 @@ const menuItemConfig = {
99
99
  displayName: DesignStates.menuItem.hover.displayName,
100
100
  className: DesignStates.menuItem.hover.className,
101
101
  pseudoClass: NativeStateType.hover
102
+ }),
103
+ selected: withSpec({
104
+ spec: IS_SUPPORT_DESIGN_STATE_SPEC,
105
+ displayName: DesignStates.menuItem.selected.displayName,
106
+ className: DesignStates.menuItem.selected.className
102
107
  })
103
108
  }
104
109
  }
@@ -13,7 +13,8 @@ const OVERFLOW_BEHAVIOR = {
13
13
  };
14
14
  const DesignStates = {
15
15
  menuItem: {
16
- hover: { displayName: "Hover", className: "tabs__item--hover" }
16
+ hover: { displayName: "Hover", className: "tabs__item--hover" },
17
+ selected: { displayName: "Selected", className: "tabs__item--selected" }
17
18
  }
18
19
  };
19
20
  const ROOT_MENU_ITEM_CUSTOM_PROPERTIES = [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/editor-react-components",
3
- "version": "1.2697.0",
3
+ "version": "1.2699.0",
4
4
  "description": "React components for the Wix Editor",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -200,5 +200,5 @@
200
200
  "registry": "https://registry.npmjs.org/",
201
201
  "access": "public"
202
202
  },
203
- "falconPackageHash": "7d79912eb0df9ff1e056bf5eb61c973aec52d2340f03f42de7efa25a"
203
+ "falconPackageHash": "322cf3e03a80b338ea6a0ecfe6e5edb84ff89ccb9ccde316a38eb2ce"
204
204
  }