@ringcentral/juno 2.31.0-hotfix.2 → 2.31.0-hotfix.3
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/Badge/Badge.js +1 -2
- package/components/Badge/styles/BadgeStyle.d.ts +3 -0
- package/components/Badge/styles/BadgeStyle.js +2 -1
- package/components/Presence/Presence.js +3 -3
- package/components/Presence/styles/StyledPresence.js +10 -5
- package/es6/components/Badge/Badge.js +2 -3
- package/es6/components/Badge/styles/BadgeStyle.js +3 -2
- package/es6/components/Presence/Presence.js +4 -4
- package/es6/components/Presence/styles/StyledPresence.js +11 -6
- package/package.json +1 -1
|
@@ -7,7 +7,6 @@ var Badge_1 = tslib_1.__importDefault(require("@material-ui/core/Badge"));
|
|
|
7
7
|
var utils_1 = require("@material-ui/core/utils");
|
|
8
8
|
var foundation_1 = require("../../foundation");
|
|
9
9
|
var Box_1 = require("../Box");
|
|
10
|
-
var Presence_1 = require("../Presence");
|
|
11
10
|
var styles_1 = require("./styles");
|
|
12
11
|
var utils_2 = require("./utils");
|
|
13
12
|
var _RcBadge = react_1.forwardRef(function (inProps, ref) {
|
|
@@ -43,7 +42,7 @@ var _RcBadge = react_1.forwardRef(function (inProps, ref) {
|
|
|
43
42
|
var OmitChildren = _a.children, rest = tslib_1.__rest(_a, ["children"]);
|
|
44
43
|
var _b = anchorOrigin, horizontal = _b.horizontal, vertical = _b.vertical;
|
|
45
44
|
var addClassName = "MuiBadge-anchorOrigin" + utils_1.capitalize(vertical) + utils_1.capitalize(horizontal) + utils_1.capitalize(overlap);
|
|
46
|
-
var DotComponent = dotComponent !== null && dotComponent !== void 0 ? dotComponent :
|
|
45
|
+
var DotComponent = dotComponent !== null && dotComponent !== void 0 ? dotComponent : styles_1.DefaultDotComponent;
|
|
47
46
|
var applyDotProps = foundation_1.combineProps({ className: clsx_1.default(addClassName, utils_2.RcBadgeClasses.badge) }, dotProps);
|
|
48
47
|
return (react_1.default.createElement("div", tslib_1.__assign({}, rest, { ref: ref }),
|
|
49
48
|
children,
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
/// <reference types="styled-jsx" />
|
|
1
3
|
import { RcThemedStyled } from '../../../foundation';
|
|
2
4
|
import { RcBadgeProps } from '../Badge';
|
|
3
5
|
export declare const BadgeStyle: RcThemedStyled<RcBadgeProps, any>;
|
|
6
|
+
export declare const DefaultDotComponent: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("../../../foundation").RcTheme, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
|
|
@@ -21,4 +21,5 @@ exports.BadgeStyle = function (_a) {
|
|
|
21
21
|
? foundation_1.fakeBorder({ color: borderCurrColor, radius: 'round' })
|
|
22
22
|
: foundation_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n border-color: ", ";\n "], ["\n border-color: ", ";\n "])), borderCurrColor)), isStandard && foundation_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n height: 18px;\n min-width: 18px;\n padding: ", ";\n "], ["\n height: 18px;\n min-width: 18px;\n padding: ", ";\n "])), !manyChar && 0), overlapNone && foundation_1.css(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n position: unset;\n transform: unset;\n\n &.", " {\n transform: scale(0);\n }\n "], ["\n position: unset;\n transform: unset;\n\n &.", " {\n transform: scale(0);\n }\n "])), utils_1.RcBadgeClasses.invisible));
|
|
23
23
|
};
|
|
24
|
-
|
|
24
|
+
exports.DefaultDotComponent = foundation_1.styled.div(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n border-radius: 50%;\n width: 8px;\n height: 8px;\n border: 2px solid ", ";\n"], ["\n border-radius: 50%;\n width: 8px;\n height: 8px;\n border: 2px solid ", ";\n"])), foundation_1.palette2('neutral', 'l01'));
|
|
25
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
|
@@ -9,7 +9,7 @@ var styles_1 = require("./styles");
|
|
|
9
9
|
var utils_1 = require("./utils");
|
|
10
10
|
var _RcPresence = react_1.forwardRef(function (inProps, ref) {
|
|
11
11
|
var props = foundation_1.useThemeProps({ props: inProps, name: 'RcPresence' });
|
|
12
|
-
var type = props.type, color = props.color, size = props.size, borderSize = props.borderSize;
|
|
12
|
+
var type = props.type, color = props.color, size = props.size, borderSize = props.borderSize, rest = tslib_1.__rest(props, ["type", "color", "size", "borderSize"]);
|
|
13
13
|
var sizeProps = {
|
|
14
14
|
iconSizeValue: utils_1.RcPresenceSizes[size][0],
|
|
15
15
|
borderSizeValue: utils_1.RcPresenceSizes[borderSize || size][1],
|
|
@@ -33,8 +33,8 @@ var _RcPresence = react_1.forwardRef(function (inProps, ref) {
|
|
|
33
33
|
return assets_1.Default;
|
|
34
34
|
}
|
|
35
35
|
})();
|
|
36
|
-
return (react_1.default.createElement(styles_1.PresenceContainer, tslib_1.__assign({}, sizeProps),
|
|
37
|
-
react_1.default.createElement(styles_1.StyledPresence, tslib_1.__assign({
|
|
36
|
+
return (react_1.default.createElement(styles_1.PresenceContainer, tslib_1.__assign({ ref: ref }, sizeProps, rest),
|
|
37
|
+
react_1.default.createElement(styles_1.StyledPresence, tslib_1.__assign({}, sizeProps, { color: color }),
|
|
38
38
|
react_1.default.createElement(Icon_1.RcIcon, { symbol: symbol, color: color || utils_1.RcPresenceColors[type], size: "inherit" }))));
|
|
39
39
|
});
|
|
40
40
|
/** @release */
|
|
@@ -8,7 +8,7 @@ var utils_1 = require("../utils");
|
|
|
8
8
|
exports.PresenceContainer = foundation_1.styled.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ",
|
|
9
9
|
"\n"])), function (_a) {
|
|
10
10
|
var iconSizeValue = _a.iconSizeValue, borderSizeValue = _a.borderSizeValue;
|
|
11
|
-
return foundation_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n display: flex;\n justify-content: center;\n
|
|
11
|
+
return foundation_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n display: flex;\n justify-content: center;\n width: ", "px;\n height: ", "px;\n padding: ", "px;\n "], ["\n display: flex;\n justify-content: center;\n width: ", "px;\n height: ", "px;\n padding: ", "px;\n "])), iconSizeValue, iconSizeValue, borderSizeValue);
|
|
12
12
|
});
|
|
13
13
|
exports._StyledPresence = react_1.forwardRef(function (_a, ref) {
|
|
14
14
|
var color = _a.color, type = _a.type, rest = tslib_1.__rest(_a, ["color", "type"]);
|
|
@@ -16,10 +16,15 @@ exports._StyledPresence = react_1.forwardRef(function (_a, ref) {
|
|
|
16
16
|
});
|
|
17
17
|
exports.StyledPresence = foundation_1.styled(exports._StyledPresence)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n box-sizing: content-box;\n\n ", ";\n"], ["\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n box-sizing: content-box;\n\n ",
|
|
18
18
|
";\n"])), function (_a) {
|
|
19
|
-
var type = _a.type, iconSizeValue = _a.iconSizeValue, color = _a.color;
|
|
20
|
-
return foundation_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n width: ", "px;\n height: ", "px;\n background: ", ";\n
|
|
21
|
-
";\n
|
|
19
|
+
var type = _a.type, iconSizeValue = _a.iconSizeValue, borderSizeValue = _a.borderSizeValue, color = _a.color;
|
|
20
|
+
return foundation_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n width: ", "px;\n height: ", "px;\n background: ", ";\n margin: ", "px;\n ", ";\n ", " {\n svg {\n width: ", "px;\n height: ", "px;\n }\n }\n "], ["\n width: ", "px;\n height: ", "px;\n background: ",
|
|
21
|
+
";\n margin: ", "px;\n ",
|
|
22
|
+
";\n ", " {\n svg {\n width: ", "px;\n height: ", "px;\n }\n }\n "])), iconSizeValue, iconSizeValue, color
|
|
22
23
|
? foundation_1.getParsePaletteColor(color)
|
|
23
|
-
: utils_1.RcPresenceBackgroundColors[type] || foundation_1.palette2('neutral', 'l01'),
|
|
24
|
+
: utils_1.RcPresenceBackgroundColors[type] || foundation_1.palette2('neutral', 'l01'), borderSizeValue, foundation_1.fakeBorder({
|
|
25
|
+
inset: false,
|
|
26
|
+
color: foundation_1.palette2('neutral', 'l01'),
|
|
27
|
+
size: borderSizeValue,
|
|
28
|
+
}), Icon_1.RcIcon, iconSizeValue, iconSizeValue);
|
|
24
29
|
});
|
|
25
30
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
@@ -5,8 +5,7 @@ import MuiBadge from '@material-ui/core/Badge';
|
|
|
5
5
|
import { capitalize } from '@material-ui/core/utils';
|
|
6
6
|
import { combineClasses, combineProps, logInDev, styled, useChange, useForkRef, useThemeProps, } from '../../foundation';
|
|
7
7
|
import { RcBox } from '../Box';
|
|
8
|
-
import {
|
|
9
|
-
import { BadgeStyle } from './styles';
|
|
8
|
+
import { BadgeStyle, DefaultDotComponent } from './styles';
|
|
10
9
|
import { RcBadgeClasses, useRoundBadgeOffset } from './utils';
|
|
11
10
|
var _RcBadge = forwardRef(function (inProps, ref) {
|
|
12
11
|
var props = useThemeProps({ props: inProps, name: 'RcBadge' });
|
|
@@ -41,7 +40,7 @@ var _RcBadge = forwardRef(function (inProps, ref) {
|
|
|
41
40
|
var OmitChildren = _a.children, rest = __rest(_a, ["children"]);
|
|
42
41
|
var _b = anchorOrigin, horizontal = _b.horizontal, vertical = _b.vertical;
|
|
43
42
|
var addClassName = "MuiBadge-anchorOrigin" + capitalize(vertical) + capitalize(horizontal) + capitalize(overlap);
|
|
44
|
-
var DotComponent = dotComponent !== null && dotComponent !== void 0 ? dotComponent :
|
|
43
|
+
var DotComponent = dotComponent !== null && dotComponent !== void 0 ? dotComponent : DefaultDotComponent;
|
|
45
44
|
var applyDotProps = combineProps({ className: clsx(addClassName, RcBadgeClasses.badge) }, dotProps);
|
|
46
45
|
return (React.createElement("div", __assign({}, rest, { ref: ref }),
|
|
47
46
|
children,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { __makeTemplateObject } from "tslib";
|
|
2
|
-
import { css, fakeBorder, getParsePaletteColor, } from '../../../foundation';
|
|
2
|
+
import { css, fakeBorder, getParsePaletteColor, palette2, styled, } from '../../../foundation';
|
|
3
3
|
import { RcBadgeClasses, roundBadgeMarginKey } from '../utils';
|
|
4
4
|
export var BadgeStyle = function (_a) {
|
|
5
5
|
var badgeContent = _a.badgeContent, overlap = _a.overlap, variant = _a.variant, textColor = _a.textColor, borderColor = _a.borderColor, max = _a.max, color = _a.color;
|
|
@@ -19,4 +19,5 @@ export var BadgeStyle = function (_a) {
|
|
|
19
19
|
? fakeBorder({ color: borderCurrColor, radius: 'round' })
|
|
20
20
|
: css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-color: ", ";\n "], ["\n border-color: ", ";\n "])), borderCurrColor)), isStandard && css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n height: 18px;\n min-width: 18px;\n padding: ", ";\n "], ["\n height: 18px;\n min-width: 18px;\n padding: ", ";\n "])), !manyChar && 0), overlapNone && css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: unset;\n transform: unset;\n\n &.", " {\n transform: scale(0);\n }\n "], ["\n position: unset;\n transform: unset;\n\n &.", " {\n transform: scale(0);\n }\n "])), RcBadgeClasses.invisible));
|
|
21
21
|
};
|
|
22
|
-
var
|
|
22
|
+
export var DefaultDotComponent = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n border-radius: 50%;\n width: 8px;\n height: 8px;\n border: 2px solid ", ";\n"], ["\n border-radius: 50%;\n width: 8px;\n height: 8px;\n border: 2px solid ", ";\n"])), palette2('neutral', 'l01'));
|
|
23
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { __assign, __makeTemplateObject } from "tslib";
|
|
1
|
+
import { __assign, __makeTemplateObject, __rest } from "tslib";
|
|
2
2
|
import React, { forwardRef } from 'react';
|
|
3
3
|
import { styled, useThemeProps, } from '../../foundation';
|
|
4
4
|
import { RcIcon } from '../Icon';
|
|
@@ -7,7 +7,7 @@ import { StyledPresence, PresenceContainer } from './styles';
|
|
|
7
7
|
import { RcPresenceColors, RcPresenceSizes } from './utils';
|
|
8
8
|
var _RcPresence = forwardRef(function (inProps, ref) {
|
|
9
9
|
var props = useThemeProps({ props: inProps, name: 'RcPresence' });
|
|
10
|
-
var type = props.type, color = props.color, size = props.size, borderSize = props.borderSize;
|
|
10
|
+
var type = props.type, color = props.color, size = props.size, borderSize = props.borderSize, rest = __rest(props, ["type", "color", "size", "borderSize"]);
|
|
11
11
|
var sizeProps = {
|
|
12
12
|
iconSizeValue: RcPresenceSizes[size][0],
|
|
13
13
|
borderSizeValue: RcPresenceSizes[borderSize || size][1],
|
|
@@ -31,8 +31,8 @@ var _RcPresence = forwardRef(function (inProps, ref) {
|
|
|
31
31
|
return Default;
|
|
32
32
|
}
|
|
33
33
|
})();
|
|
34
|
-
return (React.createElement(PresenceContainer, __assign({}, sizeProps),
|
|
35
|
-
React.createElement(StyledPresence, __assign({
|
|
34
|
+
return (React.createElement(PresenceContainer, __assign({ ref: ref }, sizeProps, rest),
|
|
35
|
+
React.createElement(StyledPresence, __assign({}, sizeProps, { color: color }),
|
|
36
36
|
React.createElement(RcIcon, { symbol: symbol, color: color || RcPresenceColors[type], size: "inherit" }))));
|
|
37
37
|
});
|
|
38
38
|
/** @release */
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { __assign, __makeTemplateObject, __rest } from "tslib";
|
|
2
2
|
import React, { forwardRef } from 'react';
|
|
3
|
-
import { css, getParsePaletteColor, palette2, styled, } from '../../../foundation';
|
|
3
|
+
import { css, getParsePaletteColor, palette2, styled, fakeBorder, } from '../../../foundation';
|
|
4
4
|
import { RcIcon } from '../../Icon';
|
|
5
5
|
import { RcPresenceBackgroundColors } from '../utils';
|
|
6
6
|
export var PresenceContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n"], ["\n ",
|
|
7
7
|
"\n"])), function (_a) {
|
|
8
8
|
var iconSizeValue = _a.iconSizeValue, borderSizeValue = _a.borderSizeValue;
|
|
9
|
-
return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n
|
|
9
|
+
return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n width: ", "px;\n height: ", "px;\n padding: ", "px;\n "], ["\n display: flex;\n justify-content: center;\n width: ", "px;\n height: ", "px;\n padding: ", "px;\n "])), iconSizeValue, iconSizeValue, borderSizeValue);
|
|
10
10
|
});
|
|
11
11
|
export var _StyledPresence = forwardRef(function (_a, ref) {
|
|
12
12
|
var color = _a.color, type = _a.type, rest = __rest(_a, ["color", "type"]);
|
|
@@ -14,10 +14,15 @@ export var _StyledPresence = forwardRef(function (_a, ref) {
|
|
|
14
14
|
});
|
|
15
15
|
export var StyledPresence = styled(_StyledPresence)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n box-sizing: content-box;\n\n ", ";\n"], ["\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n box-sizing: content-box;\n\n ",
|
|
16
16
|
";\n"])), function (_a) {
|
|
17
|
-
var type = _a.type, iconSizeValue = _a.iconSizeValue, color = _a.color;
|
|
18
|
-
return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width: ", "px;\n height: ", "px;\n background: ", ";\n
|
|
19
|
-
";\n
|
|
17
|
+
var type = _a.type, iconSizeValue = _a.iconSizeValue, borderSizeValue = _a.borderSizeValue, color = _a.color;
|
|
18
|
+
return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width: ", "px;\n height: ", "px;\n background: ", ";\n margin: ", "px;\n ", ";\n ", " {\n svg {\n width: ", "px;\n height: ", "px;\n }\n }\n "], ["\n width: ", "px;\n height: ", "px;\n background: ",
|
|
19
|
+
";\n margin: ", "px;\n ",
|
|
20
|
+
";\n ", " {\n svg {\n width: ", "px;\n height: ", "px;\n }\n }\n "])), iconSizeValue, iconSizeValue, color
|
|
20
21
|
? getParsePaletteColor(color)
|
|
21
|
-
: RcPresenceBackgroundColors[type] || palette2('neutral', 'l01'),
|
|
22
|
+
: RcPresenceBackgroundColors[type] || palette2('neutral', 'l01'), borderSizeValue, fakeBorder({
|
|
23
|
+
inset: false,
|
|
24
|
+
color: palette2('neutral', 'l01'),
|
|
25
|
+
size: borderSizeValue,
|
|
26
|
+
}), RcIcon, iconSizeValue, iconSizeValue);
|
|
22
27
|
});
|
|
23
28
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|