@ringcentral/juno 2.36.3 → 2.36.5
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/Downshift/Downshift.js +1 -1
- package/components/Downshift/utils/index.d.ts +0 -1
- package/components/Downshift/utils/index.js +0 -1
- package/components/Popper/Popper.js +3 -2
- package/components/Popper/modifiers/index.d.ts +1 -0
- package/components/Popper/modifiers/index.js +4 -0
- package/components/Popper/modifiers/package.json +5 -0
- package/components/Tooltip/styles/StyledTooltip.js +8 -1
- package/es6/components/Downshift/Downshift.js +2 -2
- package/es6/components/Downshift/utils/index.js +0 -1
- package/es6/components/Popper/Popper.js +3 -2
- package/es6/components/Popper/modifiers/index.js +1 -0
- package/es6/components/Tooltip/styles/StyledTooltip.js +8 -1
- package/package.json +1 -1
- /package/components/{Downshift/utils → Popper/modifiers}/fixOffsetsModifer.d.ts +0 -0
- /package/components/{Downshift/utils → Popper/modifiers}/fixOffsetsModifer.js +0 -0
- /package/es6/components/{Downshift/utils → Popper/modifiers}/fixOffsetsModifer.js +0 -0
|
@@ -307,7 +307,7 @@ var _RcDownshift = react_1.memo(react_1.forwardRef(function (inProps, ref) {
|
|
|
307
307
|
maxLength: maxLength, containerRef: inputContainerRef }, getInputAriaProps(TextFieldProps === null || TextFieldProps === void 0 ? void 0 : TextFieldProps.inputProps)),
|
|
308
308
|
}, rest), { value: inputValue, clearBtn: false })),
|
|
309
309
|
!helperText && screenReaderText && (react_1.default.createElement(VisuallyHidden_1.RcVisuallyHidden, { id: describedbyId }, screenReaderText)),
|
|
310
|
-
react_1.default.createElement(styles_1.StyledPopper, tslib_1.__assign({ ref: popperElementRef, open: open, position: position, component: PopperComponent, placement: "bottom-start", anchorEl: anchorElRef.current, "data-test-automation-id": "suggestions-list", popperRef: popperRef,
|
|
310
|
+
react_1.default.createElement(styles_1.StyledPopper, tslib_1.__assign({ ref: popperElementRef, open: open, position: position, component: PopperComponent, placement: "bottom-start", anchorEl: anchorElRef.current, "data-test-automation-id": "suggestions-list", popperRef: popperRef,
|
|
311
311
|
// * view type in popper.js
|
|
312
312
|
popperOptions: {
|
|
313
313
|
onUpdate: function (e) {
|
|
@@ -6,4 +6,3 @@ tslib_1.__exportStar(require("./useDownshift"), exports);
|
|
|
6
6
|
tslib_1.__exportStar(require("./useDownshiftError"), exports);
|
|
7
7
|
tslib_1.__exportStar(require("./useDownshiftGroup"), exports);
|
|
8
8
|
tslib_1.__exportStar(require("./useDownshiftTag"), exports);
|
|
9
|
-
tslib_1.__exportStar(require("./fixOffsetsModifer"), exports);
|
|
@@ -5,11 +5,12 @@ var react_1 = tslib_1.__importStar(require("react"));
|
|
|
5
5
|
var Popper_1 = tslib_1.__importDefault(require("@material-ui/core/Popper"));
|
|
6
6
|
var foundation_1 = require("../../foundation");
|
|
7
7
|
var styles_1 = require("./styles");
|
|
8
|
+
var modifiers_1 = require("./modifiers");
|
|
8
9
|
var _RcPopper = react_1.forwardRef(function (inProps, ref) {
|
|
9
10
|
var props = foundation_1.useThemeProps({ props: inProps, name: 'RcPopper' });
|
|
10
|
-
var children = props.children, rest = tslib_1.__rest(props, ["children"]);
|
|
11
|
+
var children = props.children, modifiers = props.modifiers, rest = tslib_1.__rest(props, ["children", "modifiers"]);
|
|
11
12
|
var externalWindow = foundation_1.useRcPortalWindowContext().externalWindow;
|
|
12
|
-
return (react_1.default.createElement(Popper_1.default, tslib_1.__assign({ container: externalWindow === null || externalWindow === void 0 ? void 0 : externalWindow.document.body }, rest, { ref: ref }), children));
|
|
13
|
+
return (react_1.default.createElement(Popper_1.default, tslib_1.__assign({ container: externalWindow === null || externalWindow === void 0 ? void 0 : externalWindow.document.body }, rest, { modifiers: tslib_1.__assign({ fixOffsets: modifiers_1.fixOffsetsModifer }, modifiers), ref: ref }), children));
|
|
13
14
|
});
|
|
14
15
|
var RcPopper = foundation_1.styled(_RcPopper)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n ", ";\n"], ["\n ", ";\n"])), styles_1.PopperStyle);
|
|
15
16
|
exports.RcPopper = RcPopper;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './fixOffsetsModifer';
|
|
@@ -30,6 +30,13 @@ var arrowSize = {
|
|
|
30
30
|
var marginOffset = '-0.4em';
|
|
31
31
|
var horizontalMarginTopAndMarginBottom = foundation_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n margin-top: 3px;\n margin-bottom: 3px;\n"], ["\n margin-top: 3px;\n margin-bottom: 3px;\n"])));
|
|
32
32
|
exports.tooltipStyle = function () {
|
|
33
|
-
return foundation_1.css(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n
|
|
33
|
+
return foundation_1.css(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n ", "\n max-width: calc(100% - 10px);\n\n .", " {\n ", ";\n background-color: ", ";\n color: ", ";\n padding: ", ";\n word-break: break-word;\n position: relative;\n }\n\n .", ",\n .", " {\n margin: ", " 0;\n }\n\n .", ",\n .", " {\n margin: 0 ", ";\n }\n\n .", " {\n color: ", ";\n }\n\n .", " {\n .", " {\n margin-bottom: ", ";\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-top: ", ";\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-right: ", ";\n ", "\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-left: ", ";\n ", "\n ", "\n }\n }\n "], ["\n "
|
|
34
|
+
// The preventOverflowModifier of popperjs has 5px padding.
|
|
35
|
+
// So need set max-width to calc(100% - 10px) to prevent overflow when the tooltip is too long.
|
|
36
|
+
,
|
|
37
|
+
"\n max-width: calc(100% - 10px);\n\n .", " {\n ", ";\n background-color: ", ";\n color: ", ";\n padding: ", ";\n word-break: break-word;\n position: relative;\n }\n\n .", ",\n .", " {\n margin: ", " 0;\n }\n\n .", ",\n .", " {\n margin: 0 ", ";\n }\n\n .", " {\n color: ", ";\n }\n\n .", " {\n .", " {\n margin-bottom: ", ";\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-top: ", ";\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-right: ", ";\n ", "\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-left: ", ";\n ", "\n ", "\n }\n }\n "])),
|
|
38
|
+
// The preventOverflowModifier of popperjs has 5px padding.
|
|
39
|
+
// So need set max-width to calc(100% - 10px) to prevent overflow when the tooltip is too long.
|
|
40
|
+
'', utils_1.RcTooltipClasses.tooltip, tooltipTypography, tooltipColor, tooltipTextColor, tooltipPadding, utils_1.RcTooltipClasses.tooltipPlacementTop, utils_1.RcTooltipClasses.tooltipPlacementBottom, placementSpace, utils_1.RcTooltipClasses.tooltipPlacementRight, utils_1.RcTooltipClasses.tooltipPlacementLeft, placementSpace, utils_1.RcTooltipClasses.arrow, tooltipColor, utils_1.RcTooltipClasses.tooltipPlacementTop, utils_1.RcTooltipClasses.arrow, marginOffset, arrowSize.vertical, utils_1.RcTooltipClasses.tooltipPlacementBottom, utils_1.RcTooltipClasses.arrow, marginOffset, arrowSize.vertical, utils_1.RcTooltipClasses.tooltipPlacementLeft, utils_1.RcTooltipClasses.arrow, marginOffset, arrowSize.horizontal, horizontalMarginTopAndMarginBottom, utils_1.RcTooltipClasses.tooltipPlacementRight, utils_1.RcTooltipClasses.arrow, marginOffset, arrowSize.horizontal, horizontalMarginTopAndMarginBottom);
|
|
34
41
|
};
|
|
35
42
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
@@ -9,7 +9,7 @@ import { ClearIconButton } from '../Forms/TextField/styles/ClearIconButton';
|
|
|
9
9
|
import { RcVisuallyHidden } from '../VisuallyHidden';
|
|
10
10
|
import { ArrowDownButton, DownshiftStyle, EndAdornment, RcDownshiftInput, StyledPopper, StyledTextField, } from './styles';
|
|
11
11
|
import { RcSuggestionList } from './SuggestionList';
|
|
12
|
-
import { DEFAULT_GET_OPTION_LABEL, DEFAULT_KEY_TO_CHIPS, DEFAULT_LIMIT_CHIPS,
|
|
12
|
+
import { DEFAULT_GET_OPTION_LABEL, DEFAULT_KEY_TO_CHIPS, DEFAULT_LIMIT_CHIPS, RcDownshiftDefaultFilterOptions, RcDownshiftInputClasses, useDownshift, useDownshiftError, } from './utils';
|
|
13
13
|
/**
|
|
14
14
|
* default transition style for grow when not virtualize
|
|
15
15
|
*/
|
|
@@ -303,7 +303,7 @@ var _RcDownshift = memo(forwardRef(function (inProps, ref) {
|
|
|
303
303
|
maxLength: maxLength, containerRef: inputContainerRef }, getInputAriaProps(TextFieldProps === null || TextFieldProps === void 0 ? void 0 : TextFieldProps.inputProps)),
|
|
304
304
|
}, rest), { value: inputValue, clearBtn: false })),
|
|
305
305
|
!helperText && screenReaderText && (React.createElement(RcVisuallyHidden, { id: describedbyId }, screenReaderText)),
|
|
306
|
-
React.createElement(StyledPopper, __assign({ ref: popperElementRef, open: open, position: position, component: PopperComponent, placement: "bottom-start", anchorEl: anchorElRef.current, "data-test-automation-id": "suggestions-list", popperRef: popperRef,
|
|
306
|
+
React.createElement(StyledPopper, __assign({ ref: popperElementRef, open: open, position: position, component: PopperComponent, placement: "bottom-start", anchorEl: anchorElRef.current, "data-test-automation-id": "suggestions-list", popperRef: popperRef,
|
|
307
307
|
// * view type in popper.js
|
|
308
308
|
popperOptions: {
|
|
309
309
|
onUpdate: function (e) {
|
|
@@ -3,11 +3,12 @@ import React, { forwardRef } from 'react';
|
|
|
3
3
|
import MuiPopper from '@material-ui/core/Popper';
|
|
4
4
|
import { styled, useRcPortalWindowContext, useThemeProps, } from '../../foundation';
|
|
5
5
|
import { PopperStyle } from './styles';
|
|
6
|
+
import { fixOffsetsModifer } from './modifiers';
|
|
6
7
|
var _RcPopper = forwardRef(function (inProps, ref) {
|
|
7
8
|
var props = useThemeProps({ props: inProps, name: 'RcPopper' });
|
|
8
|
-
var children = props.children, rest = __rest(props, ["children"]);
|
|
9
|
+
var children = props.children, modifiers = props.modifiers, rest = __rest(props, ["children", "modifiers"]);
|
|
9
10
|
var externalWindow = useRcPortalWindowContext().externalWindow;
|
|
10
|
-
return (React.createElement(MuiPopper, __assign({ container: externalWindow === null || externalWindow === void 0 ? void 0 : externalWindow.document.body }, rest, { ref: ref }), children));
|
|
11
|
+
return (React.createElement(MuiPopper, __assign({ container: externalWindow === null || externalWindow === void 0 ? void 0 : externalWindow.document.body }, rest, { modifiers: __assign({ fixOffsets: fixOffsetsModifer }, modifiers), ref: ref }), children));
|
|
11
12
|
});
|
|
12
13
|
var RcPopper = styled(_RcPopper)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", ";\n"], ["\n ", ";\n"])), PopperStyle);
|
|
13
14
|
RcPopper.defaultProps = {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './fixOffsetsModifer';
|
|
@@ -28,6 +28,13 @@ var arrowSize = {
|
|
|
28
28
|
var marginOffset = '-0.4em';
|
|
29
29
|
var horizontalMarginTopAndMarginBottom = css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n margin-top: 3px;\n margin-bottom: 3px;\n"], ["\n margin-top: 3px;\n margin-bottom: 3px;\n"])));
|
|
30
30
|
export var tooltipStyle = function () {
|
|
31
|
-
return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n
|
|
31
|
+
return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n ", "\n max-width: calc(100% - 10px);\n\n .", " {\n ", ";\n background-color: ", ";\n color: ", ";\n padding: ", ";\n word-break: break-word;\n position: relative;\n }\n\n .", ",\n .", " {\n margin: ", " 0;\n }\n\n .", ",\n .", " {\n margin: 0 ", ";\n }\n\n .", " {\n color: ", ";\n }\n\n .", " {\n .", " {\n margin-bottom: ", ";\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-top: ", ";\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-right: ", ";\n ", "\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-left: ", ";\n ", "\n ", "\n }\n }\n "], ["\n "
|
|
32
|
+
// The preventOverflowModifier of popperjs has 5px padding.
|
|
33
|
+
// So need set max-width to calc(100% - 10px) to prevent overflow when the tooltip is too long.
|
|
34
|
+
,
|
|
35
|
+
"\n max-width: calc(100% - 10px);\n\n .", " {\n ", ";\n background-color: ", ";\n color: ", ";\n padding: ", ";\n word-break: break-word;\n position: relative;\n }\n\n .", ",\n .", " {\n margin: ", " 0;\n }\n\n .", ",\n .", " {\n margin: 0 ", ";\n }\n\n .", " {\n color: ", ";\n }\n\n .", " {\n .", " {\n margin-bottom: ", ";\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-top: ", ";\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-right: ", ";\n ", "\n ", "\n }\n }\n\n .", " {\n .", " {\n margin-left: ", ";\n ", "\n ", "\n }\n }\n "])),
|
|
36
|
+
// The preventOverflowModifier of popperjs has 5px padding.
|
|
37
|
+
// So need set max-width to calc(100% - 10px) to prevent overflow when the tooltip is too long.
|
|
38
|
+
'', RcTooltipClasses.tooltip, tooltipTypography, tooltipColor, tooltipTextColor, tooltipPadding, RcTooltipClasses.tooltipPlacementTop, RcTooltipClasses.tooltipPlacementBottom, placementSpace, RcTooltipClasses.tooltipPlacementRight, RcTooltipClasses.tooltipPlacementLeft, placementSpace, RcTooltipClasses.arrow, tooltipColor, RcTooltipClasses.tooltipPlacementTop, RcTooltipClasses.arrow, marginOffset, arrowSize.vertical, RcTooltipClasses.tooltipPlacementBottom, RcTooltipClasses.arrow, marginOffset, arrowSize.vertical, RcTooltipClasses.tooltipPlacementLeft, RcTooltipClasses.arrow, marginOffset, arrowSize.horizontal, horizontalMarginTopAndMarginBottom, RcTooltipClasses.tooltipPlacementRight, RcTooltipClasses.arrow, marginOffset, arrowSize.horizontal, horizontalMarginTopAndMarginBottom);
|
|
32
39
|
};
|
|
33
40
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
package/package.json
CHANGED
|
File without changes
|
|
File without changes
|
|
File without changes
|