@atlaskit/editor-plugin-avatar-group 1.2.5 → 1.2.7
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/CHANGELOG.md +12 -0
- package/dist/cjs/ui/AvatarGroupPluginWrapper.js +4 -1
- package/dist/cjs/ui/avatars.js +3 -1
- package/dist/cjs/ui/colored-avatar-item.js +2 -1
- package/dist/cjs/ui/invite-to-edit.js +3 -1
- package/dist/cjs/ui/styles.js +9 -0
- package/dist/es2019/ui/AvatarGroupPluginWrapper.js +4 -1
- package/dist/es2019/ui/avatars.js +3 -1
- package/dist/es2019/ui/colored-avatar-item.js +2 -1
- package/dist/es2019/ui/invite-to-edit.js +3 -1
- package/dist/es2019/ui/styles.js +9 -0
- package/dist/esm/ui/AvatarGroupPluginWrapper.js +4 -1
- package/dist/esm/ui/avatars.js +3 -1
- package/dist/esm/ui/colored-avatar-item.js +2 -1
- package/dist/esm/ui/invite-to-edit.js +3 -1
- package/dist/esm/ui/styles.js +9 -0
- package/dist/types/ui/avatars-with-plugin-state.d.ts +120 -35
- package/dist/types/ui/avatars.d.ts +4 -3
- package/dist/types/ui/colored-avatar-item.d.ts +3 -3
- package/dist/types/ui/to-avatar.d.ts +61 -19
- package/dist/types-ts4.5/ui/avatars-with-plugin-state.d.ts +151 -56
- package/dist/types-ts4.5/ui/avatars.d.ts +4 -5
- package/dist/types-ts4.5/ui/colored-avatar-item.d.ts +3 -5
- package/dist/types-ts4.5/ui/to-avatar.d.ts +86 -38
- package/package.json +98 -98
package/CHANGELOG.md
CHANGED
|
@@ -13,18 +13,21 @@ var _messages = require("@atlaskit/editor-common/messages");
|
|
|
13
13
|
var _avatarsWithPluginState = _interopRequireDefault(require("./avatars-with-plugin-state"));
|
|
14
14
|
/** @jsx jsx */
|
|
15
15
|
|
|
16
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
17
|
+
|
|
16
18
|
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
17
19
|
var toolbarButtonWrapper = (0, _react2.css)({
|
|
18
20
|
display: 'flex',
|
|
19
21
|
justifyContent: 'flex-end',
|
|
20
22
|
flexGrow: 0,
|
|
21
23
|
alignItems: 'center',
|
|
24
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
22
25
|
'& > div': {
|
|
23
26
|
marginRight: 0
|
|
24
27
|
}
|
|
25
28
|
});
|
|
26
29
|
|
|
27
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
30
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
28
31
|
var toolbarButtonWrapperFullWidth = (0, _react2.css)(toolbarButtonWrapper, {
|
|
29
32
|
flexGrow: 1
|
|
30
33
|
});
|
package/dist/cjs/ui/avatars.js
CHANGED
|
@@ -14,6 +14,8 @@ var _styles = require("./styles");
|
|
|
14
14
|
var _toAvatar = _interopRequireDefault(require("./to-avatar"));
|
|
15
15
|
/** @jsx jsx */
|
|
16
16
|
|
|
17
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
18
|
+
|
|
17
19
|
var scrollToCollabCursor = exports.scrollToCollabCursor = function scrollToCollabCursor(editorView, participants, sessionId, index, editorAnalyticsAPI) {
|
|
18
20
|
var selectedUser = participants[index];
|
|
19
21
|
if (selectedUser && selectedUser.cursorPos !== undefined && selectedUser.sessionId !== sessionId) {
|
|
@@ -49,7 +51,7 @@ var Avatars = exports.Avatars = /*#__PURE__*/_react.default.memo(function (props
|
|
|
49
51
|
return null;
|
|
50
52
|
}
|
|
51
53
|
return (
|
|
52
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
54
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
53
55
|
(0, _react2.jsx)("div", {
|
|
54
56
|
css: _styles.avatarContainerStyles
|
|
55
57
|
}, (0, _react2.jsx)(_avatarGroup.default, {
|
|
@@ -8,13 +8,14 @@ var _react = require("@emotion/react");
|
|
|
8
8
|
var _colors = require("@atlaskit/theme/colors");
|
|
9
9
|
var _styles = require("./styles");
|
|
10
10
|
/** @jsx jsx */
|
|
11
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
11
12
|
|
|
12
13
|
var ColoredAvatarItem = exports.ColoredAvatarItem = function ColoredAvatarItem(props) {
|
|
13
14
|
var _props$api;
|
|
14
15
|
var color = (_props$api = props.api) === null || _props$api === void 0 || (_props$api = _props$api.collabEdit) === null || _props$api === void 0 || (_props$api = _props$api.actions) === null || _props$api === void 0 ? void 0 : _props$api.getAvatarColor(props.sessionId).color;
|
|
15
16
|
var avatar = props.name.substr(0, 1).toUpperCase();
|
|
16
17
|
return (
|
|
17
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
18
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
18
19
|
(0, _react.jsx)("div", {
|
|
19
20
|
css: (0, _styles.badge)(color || _colors.R100),
|
|
20
21
|
"data-testid": "editor-collab-badge"
|
|
@@ -15,6 +15,8 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
|
|
|
15
15
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
16
16
|
/** @jsx jsx */
|
|
17
17
|
|
|
18
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
19
|
+
|
|
18
20
|
var ID = function ID(props) {
|
|
19
21
|
return (0, _react2.jsx)(_react.Fragment, null, props.children);
|
|
20
22
|
};
|
|
@@ -33,7 +35,7 @@ var InviteToEditButton = exports.InviteToEditButton = function InviteToEditButto
|
|
|
33
35
|
}
|
|
34
36
|
var Wrapper = Component ? Component : ID;
|
|
35
37
|
return (
|
|
36
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
38
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
37
39
|
(0, _react2.jsx)("div", {
|
|
38
40
|
css: _styles.inviteTeamWrapperStyles
|
|
39
41
|
}, (0, _react2.jsx)(Wrapper, null, (0, _react2.jsx)(_uiMenu.ToolbarButton
|
package/dist/cjs/ui/styles.js
CHANGED
|
@@ -8,20 +8,26 @@ var _react = require("@emotion/react");
|
|
|
8
8
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
9
9
|
var _colors = require("@atlaskit/theme/colors");
|
|
10
10
|
/* eslint-disable @repo/internal/styles/no-exported-styles, @atlaskit/design-system/no-nested-styles */
|
|
11
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
11
12
|
|
|
13
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
12
14
|
var inviteTeamWrapperStyles = exports.inviteTeamWrapperStyles = (0, _react.css)({
|
|
13
15
|
background: "var(--ds-background-neutral, ".concat(_colors.N20, ")"),
|
|
14
16
|
borderRadius: '50%',
|
|
15
17
|
minWidth: "var(--ds-space-400, 32px)",
|
|
16
18
|
marginLeft: "var(--ds-space-negative-050, -4px)"
|
|
17
19
|
});
|
|
20
|
+
|
|
21
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
18
22
|
var avatarContainerStyles = exports.avatarContainerStyles = (0, _react.css)({
|
|
19
23
|
marginRight: "var(--ds-space-100, 8px)",
|
|
20
24
|
display: 'flex',
|
|
21
25
|
alignItems: 'center',
|
|
26
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
22
27
|
'&& > ul': {
|
|
23
28
|
listStyleType: 'none'
|
|
24
29
|
},
|
|
30
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
25
31
|
'div:last-child button.invite-to-edit': {
|
|
26
32
|
borderRadius: '50%',
|
|
27
33
|
height: '32px',
|
|
@@ -37,10 +43,13 @@ var badge = exports.badge = function badge(color) {
|
|
|
37
43
|
bottom: "var(--ds-space-025, 2px)",
|
|
38
44
|
width: "var(--ds-space-150, 12px)",
|
|
39
45
|
height: "var(--ds-space-150, 12px)",
|
|
46
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
40
47
|
zIndex: _editorSharedStyles.akEditorSmallZIndex,
|
|
41
48
|
borderRadius: '3px',
|
|
49
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
42
50
|
background: color,
|
|
43
51
|
color: "var(--ds-text-inverse, #fff)",
|
|
52
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
44
53
|
fontSize: (0, _editorSharedStyles.relativeFontSizeToBase16)(9),
|
|
45
54
|
lineHeight: 0,
|
|
46
55
|
paddingTop: "var(--ds-space-075, 6px)",
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { useEffect } from 'react';
|
|
3
|
+
|
|
4
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
5
|
import { css, jsx } from '@emotion/react';
|
|
4
6
|
import { useIntl } from 'react-intl-next';
|
|
5
7
|
import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
|
|
@@ -12,12 +14,13 @@ const toolbarButtonWrapper = css({
|
|
|
12
14
|
justifyContent: 'flex-end',
|
|
13
15
|
flexGrow: 0,
|
|
14
16
|
alignItems: 'center',
|
|
17
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
15
18
|
'& > div': {
|
|
16
19
|
marginRight: 0
|
|
17
20
|
}
|
|
18
21
|
});
|
|
19
22
|
|
|
20
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
23
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
21
24
|
const toolbarButtonWrapperFullWidth = css(toolbarButtonWrapper, {
|
|
22
25
|
flexGrow: 1
|
|
23
26
|
});
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
|
|
3
3
|
import React from 'react';
|
|
4
|
+
|
|
5
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
4
6
|
import { jsx } from '@emotion/react';
|
|
5
7
|
import AvatarGroup from '@atlaskit/avatar-group';
|
|
6
8
|
import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
|
|
@@ -42,7 +44,7 @@ export const Avatars = /*#__PURE__*/React.memo(props => {
|
|
|
42
44
|
return null;
|
|
43
45
|
}
|
|
44
46
|
return (
|
|
45
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
47
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
46
48
|
jsx("div", {
|
|
47
49
|
css: avatarContainerStyles
|
|
48
50
|
}, jsx(AvatarGroup, {
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
2
3
|
import { jsx } from '@emotion/react';
|
|
3
4
|
import { R100 } from '@atlaskit/theme/colors';
|
|
4
5
|
import { badge } from './styles';
|
|
@@ -7,7 +8,7 @@ export const ColoredAvatarItem = props => {
|
|
|
7
8
|
const color = (_props$api = props.api) === null || _props$api === void 0 ? void 0 : (_props$api$collabEdit = _props$api.collabEdit) === null || _props$api$collabEdit === void 0 ? void 0 : (_props$api$collabEdit2 = _props$api$collabEdit.actions) === null || _props$api$collabEdit2 === void 0 ? void 0 : _props$api$collabEdit2.getAvatarColor(props.sessionId).color;
|
|
8
9
|
const avatar = props.name.substr(0, 1).toUpperCase();
|
|
9
10
|
return (
|
|
10
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
11
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
11
12
|
jsx("div", {
|
|
12
13
|
css: badge(color || R100),
|
|
13
14
|
"data-testid": "editor-collab-badge"
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import React, { Fragment } from 'react';
|
|
3
|
+
|
|
4
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
5
|
import { jsx } from '@emotion/react';
|
|
4
6
|
import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
|
|
5
7
|
import InviteTeamIcon from '@atlaskit/icon/glyph/editor/add';
|
|
@@ -20,7 +22,7 @@ export const InviteToEditButton = props => {
|
|
|
20
22
|
}
|
|
21
23
|
const Wrapper = Component ? Component : ID;
|
|
22
24
|
return (
|
|
23
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
25
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
24
26
|
jsx("div", {
|
|
25
27
|
css: inviteTeamWrapperStyles
|
|
26
28
|
}, jsx(Wrapper, null, jsx(ToolbarButton
|
package/dist/es2019/ui/styles.js
CHANGED
|
@@ -1,20 +1,26 @@
|
|
|
1
1
|
/* eslint-disable @repo/internal/styles/no-exported-styles, @atlaskit/design-system/no-nested-styles */
|
|
2
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
2
3
|
import { css } from '@emotion/react';
|
|
3
4
|
import { akEditorSmallZIndex, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
|
|
4
5
|
import { N20 } from '@atlaskit/theme/colors';
|
|
6
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
5
7
|
export const inviteTeamWrapperStyles = css({
|
|
6
8
|
background: `var(--ds-background-neutral, ${N20})`,
|
|
7
9
|
borderRadius: '50%',
|
|
8
10
|
minWidth: "var(--ds-space-400, 32px)",
|
|
9
11
|
marginLeft: "var(--ds-space-negative-050, -4px)"
|
|
10
12
|
});
|
|
13
|
+
|
|
14
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
11
15
|
export const avatarContainerStyles = css({
|
|
12
16
|
marginRight: "var(--ds-space-100, 8px)",
|
|
13
17
|
display: 'flex',
|
|
14
18
|
alignItems: 'center',
|
|
19
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
15
20
|
'&& > ul': {
|
|
16
21
|
listStyleType: 'none'
|
|
17
22
|
},
|
|
23
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
18
24
|
'div:last-child button.invite-to-edit': {
|
|
19
25
|
borderRadius: '50%',
|
|
20
26
|
height: '32px',
|
|
@@ -29,10 +35,13 @@ export const badge = color => css({
|
|
|
29
35
|
bottom: "var(--ds-space-025, 2px)",
|
|
30
36
|
width: "var(--ds-space-150, 12px)",
|
|
31
37
|
height: "var(--ds-space-150, 12px)",
|
|
38
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
32
39
|
zIndex: akEditorSmallZIndex,
|
|
33
40
|
borderRadius: '3px',
|
|
41
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
34
42
|
background: color,
|
|
35
43
|
color: "var(--ds-text-inverse, #fff)",
|
|
44
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
36
45
|
fontSize: relativeFontSizeToBase16(9),
|
|
37
46
|
lineHeight: 0,
|
|
38
47
|
paddingTop: "var(--ds-space-075, 6px)",
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { useEffect } from 'react';
|
|
3
|
+
|
|
4
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
5
|
import { css, jsx } from '@emotion/react';
|
|
4
6
|
import { useIntl } from 'react-intl-next';
|
|
5
7
|
import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
|
|
@@ -12,12 +14,13 @@ var toolbarButtonWrapper = css({
|
|
|
12
14
|
justifyContent: 'flex-end',
|
|
13
15
|
flexGrow: 0,
|
|
14
16
|
alignItems: 'center',
|
|
17
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
15
18
|
'& > div': {
|
|
16
19
|
marginRight: 0
|
|
17
20
|
}
|
|
18
21
|
});
|
|
19
22
|
|
|
20
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
23
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
21
24
|
var toolbarButtonWrapperFullWidth = css(toolbarButtonWrapper, {
|
|
22
25
|
flexGrow: 1
|
|
23
26
|
});
|
package/dist/esm/ui/avatars.js
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
|
|
3
3
|
import React from 'react';
|
|
4
|
+
|
|
5
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
4
6
|
import { jsx } from '@emotion/react';
|
|
5
7
|
import AvatarGroup from '@atlaskit/avatar-group';
|
|
6
8
|
import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
|
|
@@ -42,7 +44,7 @@ export var Avatars = /*#__PURE__*/React.memo(function (props) {
|
|
|
42
44
|
return null;
|
|
43
45
|
}
|
|
44
46
|
return (
|
|
45
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
47
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
46
48
|
jsx("div", {
|
|
47
49
|
css: avatarContainerStyles
|
|
48
50
|
}, jsx(AvatarGroup, {
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
2
3
|
import { jsx } from '@emotion/react';
|
|
3
4
|
import { R100 } from '@atlaskit/theme/colors';
|
|
4
5
|
import { badge } from './styles';
|
|
@@ -7,7 +8,7 @@ export var ColoredAvatarItem = function ColoredAvatarItem(props) {
|
|
|
7
8
|
var color = (_props$api = props.api) === null || _props$api === void 0 || (_props$api = _props$api.collabEdit) === null || _props$api === void 0 || (_props$api = _props$api.actions) === null || _props$api === void 0 ? void 0 : _props$api.getAvatarColor(props.sessionId).color;
|
|
8
9
|
var avatar = props.name.substr(0, 1).toUpperCase();
|
|
9
10
|
return (
|
|
10
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
11
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
11
12
|
jsx("div", {
|
|
12
13
|
css: badge(color || R100),
|
|
13
14
|
"data-testid": "editor-collab-badge"
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import React, { Fragment } from 'react';
|
|
3
|
+
|
|
4
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
5
|
import { jsx } from '@emotion/react';
|
|
4
6
|
import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
|
|
5
7
|
import InviteTeamIcon from '@atlaskit/icon/glyph/editor/add';
|
|
@@ -22,7 +24,7 @@ export var InviteToEditButton = function InviteToEditButton(props) {
|
|
|
22
24
|
}
|
|
23
25
|
var Wrapper = Component ? Component : ID;
|
|
24
26
|
return (
|
|
25
|
-
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
27
|
+
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
26
28
|
jsx("div", {
|
|
27
29
|
css: inviteTeamWrapperStyles
|
|
28
30
|
}, jsx(Wrapper, null, jsx(ToolbarButton
|
package/dist/esm/ui/styles.js
CHANGED
|
@@ -1,20 +1,26 @@
|
|
|
1
1
|
/* eslint-disable @repo/internal/styles/no-exported-styles, @atlaskit/design-system/no-nested-styles */
|
|
2
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
2
3
|
import { css } from '@emotion/react';
|
|
3
4
|
import { akEditorSmallZIndex, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
|
|
4
5
|
import { N20 } from '@atlaskit/theme/colors';
|
|
6
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
5
7
|
export var inviteTeamWrapperStyles = css({
|
|
6
8
|
background: "var(--ds-background-neutral, ".concat(N20, ")"),
|
|
7
9
|
borderRadius: '50%',
|
|
8
10
|
minWidth: "var(--ds-space-400, 32px)",
|
|
9
11
|
marginLeft: "var(--ds-space-negative-050, -4px)"
|
|
10
12
|
});
|
|
13
|
+
|
|
14
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
11
15
|
export var avatarContainerStyles = css({
|
|
12
16
|
marginRight: "var(--ds-space-100, 8px)",
|
|
13
17
|
display: 'flex',
|
|
14
18
|
alignItems: 'center',
|
|
19
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
15
20
|
'&& > ul': {
|
|
16
21
|
listStyleType: 'none'
|
|
17
22
|
},
|
|
23
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
18
24
|
'div:last-child button.invite-to-edit': {
|
|
19
25
|
borderRadius: '50%',
|
|
20
26
|
height: '32px',
|
|
@@ -30,10 +36,13 @@ export var badge = function badge(color) {
|
|
|
30
36
|
bottom: "var(--ds-space-025, 2px)",
|
|
31
37
|
width: "var(--ds-space-150, 12px)",
|
|
32
38
|
height: "var(--ds-space-150, 12px)",
|
|
39
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
33
40
|
zIndex: akEditorSmallZIndex,
|
|
34
41
|
borderRadius: '3px',
|
|
42
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
35
43
|
background: color,
|
|
36
44
|
color: "var(--ds-text-inverse, #fff)",
|
|
45
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
37
46
|
fontSize: relativeFontSizeToBase16(9),
|
|
38
47
|
lineHeight: 0,
|
|
39
48
|
paddingTop: "var(--ds-space-075, 6px)",
|