@ringcentral/juno 2.31.0-hotfix.3 → 2.31.0-hotfix.4
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/components/Tabs/TabList/TabList.js +8 -6
- package/components/Tabs/Tabs/MoreMenuTab/MoreMenuTab.d.ts +1 -1
- package/components/Tabs/Tabs/MoreMenuTab/MoreMenuTab.js +14 -4
- package/es6/components/Tabs/TabList/TabList.js +8 -6
- package/es6/components/Tabs/Tabs/MoreMenuTab/MoreMenuTab.js +14 -4
- package/package.json +1 -1
|
@@ -20,13 +20,15 @@ var _RcTabList = react_1.forwardRef(function (inProps, ref) {
|
|
|
20
20
|
if (context === null) {
|
|
21
21
|
throw new TypeError('[RcTabList] No TabContext provided');
|
|
22
22
|
}
|
|
23
|
-
var children = react_1.
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
23
|
+
var children = react_1.useMemo(function () {
|
|
24
|
+
return react_1.default.Children.map(childrenProp, function (child) {
|
|
25
|
+
var value = child.props.value;
|
|
26
|
+
return react_1.default.cloneElement(child, {
|
|
27
|
+
'aria-controls': TabContext_1.getPanelId(context, value),
|
|
28
|
+
id: TabContext_1.getTabId(context, value),
|
|
29
|
+
});
|
|
28
30
|
});
|
|
29
|
-
});
|
|
31
|
+
}, [childrenProp, context]);
|
|
30
32
|
return (react_1.default.createElement(Tabs_1.RcTabs, tslib_1.__assign({}, rest, { ref: ref, classes: classes, value: context.value }), children));
|
|
31
33
|
});
|
|
32
34
|
var RcTabList = foundation_1.styled(_RcTabList)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), styles_1.TabListStyle);
|
|
@@ -13,7 +13,7 @@ declare type MoreMenuTabProps = {
|
|
|
13
13
|
TooltipProps?: RcBaseProps<RcTooltipProps, 'children'>;
|
|
14
14
|
onChange?: (event: React.MouseEvent<HTMLLIElement>, value: any) => void;
|
|
15
15
|
orientation?: 'horizontal' | 'vertical';
|
|
16
|
-
MoreIcon?: JSX.Element;
|
|
16
|
+
MoreIcon?: JSX.Element | ((isMenuOpen: boolean) => JSX.Element);
|
|
17
17
|
} & RcBaseProps<RcTabProps, 'onChange'>;
|
|
18
18
|
declare const DEFAULT_MORE_MENU_TAB_LABEL = "more_menu_tab";
|
|
19
19
|
/** inner component */
|
|
@@ -18,13 +18,23 @@ var _MoreMenuTab = react_1.forwardRef(function (props, ref) {
|
|
|
18
18
|
var menuIdProp = MenuProps.id, onMenuCloseProp = MenuProps.onClose, MenuPropsRest = tslib_1.__rest(MenuProps, ["id", "onClose"]);
|
|
19
19
|
var menuId = foundation_1.useId(menuIdProp);
|
|
20
20
|
var _c = tslib_1.__read(react_1.useState(null), 2), anchorEl = _c[0], setAnchorEl = _c[1];
|
|
21
|
-
var
|
|
22
|
-
|
|
21
|
+
var open = Boolean(anchorEl);
|
|
22
|
+
var MoreIcon = (function () {
|
|
23
|
+
var Icon;
|
|
24
|
+
if (!MoreIconProp) {
|
|
25
|
+
Icon = (react_1.default.createElement(Icon_1.RcIcon, { size: "medium", color: "neutral.f04", symbol: juno_icon_1.MoreHoriz }));
|
|
26
|
+
}
|
|
27
|
+
else if (typeof MoreIconProp === 'function') {
|
|
28
|
+
Icon = MoreIconProp(open);
|
|
29
|
+
}
|
|
30
|
+
else {
|
|
31
|
+
Icon = MoreIconProp;
|
|
32
|
+
}
|
|
23
33
|
if (TooltipProps === null || TooltipProps === void 0 ? void 0 : TooltipProps.title) {
|
|
24
34
|
return react_1.default.createElement(Tooltip_1.RcTooltip, tslib_1.__assign({}, TooltipProps), Icon);
|
|
25
35
|
}
|
|
26
36
|
return Icon;
|
|
27
|
-
}
|
|
37
|
+
})();
|
|
28
38
|
var handleTabClick = foundation_1.useEventCallback(function (event) {
|
|
29
39
|
setAnchorEl(event.currentTarget);
|
|
30
40
|
});
|
|
@@ -49,7 +59,7 @@ var _MoreMenuTab = react_1.forwardRef(function (props, ref) {
|
|
|
49
59
|
}, [MenuItemComponent, menuItems, onChange]);
|
|
50
60
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
51
61
|
react_1.default.createElement(Tab_1.RcTab, tslib_1.__assign({}, rest, { ref: ref, onClick: handleTabClick, label: MoreIcon, value: DEFAULT_MORE_MENU_TAB_LABEL, "aria-haspopup": "true", "aria-controls": menuId })),
|
|
52
|
-
react_1.default.createElement(Menu_1.RcMenu, tslib_1.__assign({ autoClose: true }, MenuPropsRest, { id: menuId, anchorEl: anchorEl, open:
|
|
62
|
+
react_1.default.createElement(Menu_1.RcMenu, tslib_1.__assign({ autoClose: true }, MenuPropsRest, { id: menuId, anchorEl: anchorEl, open: open, variant: "menu", onClose: handleMenuClose }), MenuList)));
|
|
53
63
|
});
|
|
54
64
|
/** inner component */
|
|
55
65
|
var MoreMenuTab = foundation_1.styled(_MoreMenuTab)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), styles_1.MoreMenuTabStyle);
|
|
@@ -18,13 +18,15 @@ var _RcTabList = forwardRef(function (inProps, ref) {
|
|
|
18
18
|
if (context === null) {
|
|
19
19
|
throw new TypeError('[RcTabList] No TabContext provided');
|
|
20
20
|
}
|
|
21
|
-
var children =
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
21
|
+
var children = useMemo(function () {
|
|
22
|
+
return React.Children.map(childrenProp, function (child) {
|
|
23
|
+
var value = child.props.value;
|
|
24
|
+
return React.cloneElement(child, {
|
|
25
|
+
'aria-controls': getPanelId(context, value),
|
|
26
|
+
id: getTabId(context, value),
|
|
27
|
+
});
|
|
26
28
|
});
|
|
27
|
-
});
|
|
29
|
+
}, [childrenProp, context]);
|
|
28
30
|
return (React.createElement(RcTabs, __assign({}, rest, { ref: ref, classes: classes, value: context.value }), children));
|
|
29
31
|
});
|
|
30
32
|
var RcTabList = styled(_RcTabList)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), TabListStyle);
|
|
@@ -15,13 +15,23 @@ var _MoreMenuTab = forwardRef(function (props, ref) {
|
|
|
15
15
|
var menuIdProp = MenuProps.id, onMenuCloseProp = MenuProps.onClose, MenuPropsRest = __rest(MenuProps, ["id", "onClose"]);
|
|
16
16
|
var menuId = useId(menuIdProp);
|
|
17
17
|
var _c = __read(useState(null), 2), anchorEl = _c[0], setAnchorEl = _c[1];
|
|
18
|
-
var
|
|
19
|
-
|
|
18
|
+
var open = Boolean(anchorEl);
|
|
19
|
+
var MoreIcon = (function () {
|
|
20
|
+
var Icon;
|
|
21
|
+
if (!MoreIconProp) {
|
|
22
|
+
Icon = (React.createElement(RcIcon, { size: "medium", color: "neutral.f04", symbol: MoreHorizIcon }));
|
|
23
|
+
}
|
|
24
|
+
else if (typeof MoreIconProp === 'function') {
|
|
25
|
+
Icon = MoreIconProp(open);
|
|
26
|
+
}
|
|
27
|
+
else {
|
|
28
|
+
Icon = MoreIconProp;
|
|
29
|
+
}
|
|
20
30
|
if (TooltipProps === null || TooltipProps === void 0 ? void 0 : TooltipProps.title) {
|
|
21
31
|
return React.createElement(RcTooltip, __assign({}, TooltipProps), Icon);
|
|
22
32
|
}
|
|
23
33
|
return Icon;
|
|
24
|
-
}
|
|
34
|
+
})();
|
|
25
35
|
var handleTabClick = useEventCallback(function (event) {
|
|
26
36
|
setAnchorEl(event.currentTarget);
|
|
27
37
|
});
|
|
@@ -46,7 +56,7 @@ var _MoreMenuTab = forwardRef(function (props, ref) {
|
|
|
46
56
|
}, [MenuItemComponent, menuItems, onChange]);
|
|
47
57
|
return (React.createElement(React.Fragment, null,
|
|
48
58
|
React.createElement(RcTab, __assign({}, rest, { ref: ref, onClick: handleTabClick, label: MoreIcon, value: DEFAULT_MORE_MENU_TAB_LABEL, "aria-haspopup": "true", "aria-controls": menuId })),
|
|
49
|
-
React.createElement(RcMenu, __assign({ autoClose: true }, MenuPropsRest, { id: menuId, anchorEl: anchorEl, open:
|
|
59
|
+
React.createElement(RcMenu, __assign({ autoClose: true }, MenuPropsRest, { id: menuId, anchorEl: anchorEl, open: open, variant: "menu", onClose: handleMenuClose }), MenuList)));
|
|
50
60
|
});
|
|
51
61
|
/** inner component */
|
|
52
62
|
var MoreMenuTab = styled(_MoreMenuTab)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), MoreMenuTabStyle);
|