@ringcentral/juno 2.31.0-hotfix.1 → 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.
Files changed (12) hide show
  1. package/components/Badge/Badge.js +1 -2
  2. package/components/Badge/styles/BadgeStyle.d.ts +3 -0
  3. package/components/Badge/styles/BadgeStyle.js +2 -1
  4. package/components/Presence/Presence.js +3 -3
  5. package/components/Presence/styles/StyledPresence.js +10 -5
  6. package/components/Presence/utils/RcPresenceUtils.js +1 -1
  7. package/es6/components/Badge/Badge.js +2 -3
  8. package/es6/components/Badge/styles/BadgeStyle.js +3 -2
  9. package/es6/components/Presence/Presence.js +4 -4
  10. package/es6/components/Presence/styles/StyledPresence.js +11 -6
  11. package/es6/components/Presence/utils/RcPresenceUtils.js +1 -1
  12. package/package.json +1 -1
package/components/Badge/Badge.js CHANGED
@@ -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 : Presence_1.RcPresence;
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,
package/components/Badge/styles/BadgeStyle.d.ts CHANGED
@@ -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>>;
package/components/Badge/styles/BadgeStyle.js CHANGED
@@ -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
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
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;
package/components/Presence/Presence.js CHANGED
@@ -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({ ref: ref }, sizeProps, { color: color }),
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 */
package/components/Presence/styles/StyledPresence.js CHANGED
@@ -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 background-color: ", ";\n border-radius: 50%;\n width: ", "px;\n height: ", "px;\n padding: ", "px;\n "], ["\n display: flex;\n justify-content: center;\n background-color: ", ";\n border-radius: 50%;\n width: ", "px;\n height: ", "px;\n padding: ", "px;\n "])), foundation_1.palette2('neutral', 'l01'), iconSizeValue, iconSizeValue, borderSizeValue);
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\n ", " {\n svg {\n width: ", "px;\n height: ", "px;\n }\n }\n "], ["\n width: ", "px;\n height: ", "px;\n background: ",
21
- ";\n\n ", " {\n svg {\n width: ", "px;\n height: ", "px;\n }\n }\n "])), iconSizeValue, iconSizeValue, color
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'), Icon_1.RcIcon, iconSizeValue, iconSizeValue);
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;
package/components/Presence/utils/RcPresenceUtils.js CHANGED
@@ -4,7 +4,7 @@ var foundation_1 = require("../../../foundation");
4
4
  // first is width, second is border
5
5
  exports.RcPresenceSizes = {
6
6
  xxsmall: [8, 1],
7
- xsmall: [8, 2],
7
+ xsmall: [10, 1],
8
8
  small: [10, 2],
9
9
  medium: [12, 2],
10
10
  large: [16, 2],
package/es6/components/Badge/Badge.js CHANGED
@@ -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 { RcPresence } from '../Presence';
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 : RcPresence;
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,
package/es6/components/Badge/styles/BadgeStyle.js CHANGED
@@ -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 templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
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;
package/es6/components/Presence/Presence.js CHANGED
@@ -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({ ref: ref }, sizeProps, { color: color }),
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 */
package/es6/components/Presence/styles/StyledPresence.js CHANGED
@@ -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 background-color: ", ";\n border-radius: 50%;\n width: ", "px;\n height: ", "px;\n padding: ", "px;\n "], ["\n display: flex;\n justify-content: center;\n background-color: ", ";\n border-radius: 50%;\n width: ", "px;\n height: ", "px;\n padding: ", "px;\n "])), palette2('neutral', 'l01'), iconSizeValue, iconSizeValue, borderSizeValue);
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\n ", " {\n svg {\n width: ", "px;\n height: ", "px;\n }\n }\n "], ["\n width: ", "px;\n height: ", "px;\n background: ",
19
- ";\n\n ", " {\n svg {\n width: ", "px;\n height: ", "px;\n }\n }\n "])), iconSizeValue, iconSizeValue, color
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'), RcIcon, iconSizeValue, iconSizeValue);
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;
package/es6/components/Presence/utils/RcPresenceUtils.js CHANGED
@@ -2,7 +2,7 @@ import { palette2 } from '../../../foundation';
2
2
  // first is width, second is border
3
3
  export var RcPresenceSizes = {
4
4
  xxsmall: [8, 1],
5
- xsmall: [8, 2],
5
+ xsmall: [10, 1],
6
6
  small: [10, 2],
7
7
  medium: [12, 2],
8
8
  large: [16, 2],
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ringcentral/juno",
3
- "version": "2.31.0-hotfix.1",
3
+ "version": "2.31.0-hotfix.3",
4
4
  "author": "RingCentral",
5
5
  "license": "MIT",
6
6
  "main": "./index.js",