@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.
- package/dist/site/components/Menu/component.js +5 -4
- package/dist/site/components/Tabs/component.js +5 -7
- package/dist/site/components/Tabs/constants.d.ts +4 -0
- package/dist/site/components/Tabs/css.css +2 -5
- package/dist/site/components/Tabs/manifest.js +6 -1
- package/dist/site/components/chunks/constants20.js +2 -1
- package/package.json +2 -2
|
@@ -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
|
-
|
|
2365
|
-
|
|
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
|
-
|
|
2413
|
-
|
|
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.
|
|
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.
|
|
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": "
|
|
203
|
+
"falconPackageHash": "322cf3e03a80b338ea6a0ecfe6e5edb84ff89ccb9ccde316a38eb2ce"
|
|
204
204
|
}
|