@atlaskit/profilecard 19.11.1 → 19.11.2

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 (11) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/cjs/client/getTeamFromAGG.js +1 -1
  3. package/dist/cjs/styled/Card.js +4 -6
  4. package/dist/cjs/util/analytics.js +1 -1
  5. package/dist/es2019/client/getTeamFromAGG.js +1 -1
  6. package/dist/es2019/styled/Card.js +5 -7
  7. package/dist/es2019/util/analytics.js +1 -1
  8. package/dist/esm/client/getTeamFromAGG.js +1 -1
  9. package/dist/esm/styled/Card.js +4 -6
  10. package/dist/esm/util/analytics.js +1 -1
  11. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/profilecard
2
2
 
3
+ ## 19.11.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#74811](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/74811) [`c30aee2e855c`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c30aee2e855c) - PTC-8751 enforce space token usage in profilecard
8
+ - Updated dependencies
9
+
3
10
  ## 19.11.1
4
11
 
5
12
  ### Patch Changes
package/dist/cjs/client/getTeamFromAGG.js CHANGED
@@ -57,7 +57,7 @@ var addHeaders = exports.addHeaders = function addHeaders(headers) {
57
57
  headers.append('X-ExperimentalApi', 'teams-beta');
58
58
  headers.append('X-ExperimentalApi', 'team-members-beta');
59
59
  headers.append('atl-client-name', "@atlaskit/profilecard");
60
- headers.append('atl-client-version', "19.11.1");
60
+ headers.append('atl-client-version', "19.11.2");
61
61
  return headers;
62
62
  };
63
63
  function getTeamFromAGG(_x, _x2, _x3) {
package/dist/cjs/styled/Card.js CHANGED
@@ -15,9 +15,9 @@ var _constants = require("@atlaskit/theme/constants");
15
15
  var _constants2 = require("./constants");
16
16
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
17
17
  var getFullNameMargin = function getFullNameMargin(props) {
18
- return props.noMeta ? "".concat((0, _constants.gridSize)() * 4.5, "px 0 ").concat((0, _constants.gridSize)() * 1.5, "px 0") : "".concat((0, _constants.gridSize)() * 1.5, "px 0 0 0");
18
+ return props.noMeta ? "var(--ds-space-400, 32px)".concat(" 0 ", "var(--ds-space-150, 12px)", " 0") : "var(--ds-space-150, 12px)".concat(" 0 0 0");
19
19
  };
20
- var CardWrapper = exports.CardWrapper = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n background-color: ", ";\n border-radius: ", "px;\n width: ", "px;\n"])), _constants2.bgColor, _constants.borderRadius, (0, _constants.gridSize)() * 45);
20
+ var CardWrapper = exports.CardWrapper = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n background-color: ", ";\n border-radius: ", ";\n width: ", "px;\n"])), _constants2.bgColor, "var(--ds-border-radius, 3px)", (0, _constants.gridSize)() * 45);
21
21
  var ProfileImage = exports.ProfileImage = _styled.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n position: absolute;\n top: ", ";\n left: ", ";\n"])), "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)");
22
22
  var ActionsFlexSpacer = exports.ActionsFlexSpacer = _styled.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n flex: 1 0 auto;\n"])));
23
23
  var kudosButtonAnimationTransformation = (0, _react2.keyframes)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n 0% { transform: translate(-80px, -50px); }\n 100% { transform: translate(90px, -70px); }\n"])));
@@ -29,11 +29,9 @@ var KudosBlobAnimation = exports.KudosBlobAnimation = function KudosBlobAnimatio
29
29
  };
30
30
  var AnimationWrapper = exports.AnimationWrapper = _styled.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n clip-path: inset(0px 0px 0px 0px round ", "px);\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n"])), _constants.borderRadius);
31
31
  var AnimatedKudosButton = exports.AnimatedKudosButton = _styled.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: ", ";\n\n /* Need babel-plugin-emotion to use component selector */\n /* Previously with styled-components: &:hover {KudosBlobAnimation} { */\n &:focus-within .kudos-blob-animation,\n &:focus .kudos-blob-animation,\n &:hover .kudos-blob-animation {\n display: block;\n }\n"])), "var(--ds-space-100, 8px)");
32
- var ActionButtonGroup = exports.ActionButtonGroup = _styled.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n user-select: none;\n margin: ", " 0 0 0;\n text-align: right;\n display: flex;\n justify-content: flex-end;\n\n button,\n a {\n position: relative;\n }\n\n button,\n a,\n span {\n margin-left: ", ";\n\n &:first-child {\n margin-left: 0;\n }\n }\n\n a,\n button {\n &:focus {\n outline-color: ", ";\n outline-offset: ", ";\n outline-style: solid;\n outline-width: ", ";\n }\n }\n"])), "var(--ds-space-200, 16px)", "var(--ds-space-100, 8px)", "var(--ds-border-focused, ".concat(_colors.B200, ")"), "var(--ds-border-width, 2px)", "var(--ds-border-width, 2px)");
33
- var OverflowActionButtonsWrapper = exports.OverflowActionButtonsWrapper = _styled.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-block;\n width: 32px;\n height: 32px;\n margin-left: ", ";\n\n button {\n &:focus {\n outline-color: ", ";\n outline-offset: ", ";\n outline-style: solid;\n outline-width: ", ";\n }\n }\n"])), "var(--ds-space-100, 8px)", "var(--ds-border-focused, ".concat(_colors.B200, ")"), "var(--ds-border-width, 2px)", "var(--ds-border-width, 2px)");
32
+ var ActionButtonGroup = exports.ActionButtonGroup = _styled.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n user-select: none;\n margin: ", " 0 0 0;\n text-align: right;\n display: flex;\n justify-content: flex-end;\n\n button,\n a {\n position: relative;\n }\n\n button,\n a,\n span {\n margin-left: ", ";\n\n &:first-child {\n margin-left: ", ";\n }\n }\n\n a,\n button {\n &:focus {\n outline-color: ", ";\n outline-offset: ", ";\n outline-style: solid;\n outline-width: ", ";\n }\n }\n"])), "var(--ds-space-200, 16px)", "var(--ds-space-100, 8px)", "var(--ds-space-0, 0px)", "var(--ds-border-focused, ".concat(_colors.B200, ")"), "var(--ds-border-width, 2px)", "var(--ds-border-width, 2px)");
33
+ var OverflowActionButtonsWrapper = exports.OverflowActionButtonsWrapper = _styled.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-block;\n width: ", ";\n height: ", ";\n margin-left: ", ";\n\n button {\n &:focus {\n outline-color: ", ";\n outline-offset: ", ";\n outline-style: solid;\n outline-width: ", ";\n }\n }\n"])), "var(--ds-space-400, 32px)", "var(--ds-space-400, 32px)", "var(--ds-space-100, 8px)", "var(--ds-border-focused, ".concat(_colors.B200, ")"), "var(--ds-border-width, 2px)", "var(--ds-border-width, 2px)");
34
34
  var CardContent = exports.CardContent = _styled.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n min-height: ", "px;\n"])), (0, _constants.gridSize)() * 17);
35
-
36
- // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
37
35
  var DetailsGroup = exports.DetailsGroup = _styled.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n margin-left: ", "px;\n width: ", "px;\n"])), (0, _constants.gridSize)() * 14.5, (0, _constants.gridSize)() * 24.5);
38
36
  var DisabledInfo = exports.DisabledInfo = _styled.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n font-size: ", "px;\n color: ", ";\n margin: ", " 0 0 0;\n line-height: 16px;\n"])), _constants.fontSizeSmall, _constants2.labelTextColor, "var(--ds-space-150, 12px)");
39
37
  var FullNameLabel = exports.FullNameLabel = _styled.default.h2(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n\n font-size: 18px;\n font-weight: 400;\n letter-spacing: normal;\n color: ", ";\n margin: ", ";\n line-height: ", "em;\n :first-child {\n margin: ", ";\n }\n"])), function (props) {
package/dist/cjs/util/analytics.js CHANGED
@@ -44,7 +44,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
44
44
  actionSubjectId: actionSubjectId,
45
45
  attributes: _objectSpread(_objectSpread({
46
46
  packageName: "@atlaskit/profilecard",
47
- packageVersion: "19.11.1"
47
+ packageVersion: "19.11.2"
48
48
  }, attributes), {}, {
49
49
  firedAt: Math.round((0, _performance.getPageTime)())
50
50
  })
package/dist/es2019/client/getTeamFromAGG.js CHANGED
@@ -67,7 +67,7 @@ export const addHeaders = headers => {
67
67
  headers.append('X-ExperimentalApi', 'teams-beta');
68
68
  headers.append('X-ExperimentalApi', 'team-members-beta');
69
69
  headers.append('atl-client-name', "@atlaskit/profilecard");
70
- headers.append('atl-client-version', "19.11.1");
70
+ headers.append('atl-client-version', "19.11.2");
71
71
  return headers;
72
72
  };
73
73
  export async function getTeamFromAGG(url, teamId, siteId) {
package/dist/es2019/styled/Card.js CHANGED
@@ -5,10 +5,10 @@ import styled from '@emotion/styled';
5
5
  import { B200, N50A, N60A } from '@atlaskit/theme/colors';
6
6
  import { borderRadius, fontSize, fontSizeSmall, gridSize } from '@atlaskit/theme/constants';
7
7
  import { appLabelBgColor, appLabelTextColor, bgColor, headerBgColor, headerBgColorDisabledUser, headerTextColor, headerTextColorInactive, labelIconColor, labelTextColor } from './constants';
8
- const getFullNameMargin = props => props.noMeta ? `${gridSize() * 4.5}px 0 ${gridSize() * 1.5}px 0` : `${gridSize() * 1.5}px 0 0 0`;
8
+ const getFullNameMargin = props => props.noMeta ? `${"var(--ds-space-400, 32px)"} 0 ${"var(--ds-space-150, 12px)"} 0` : `${"var(--ds-space-150, 12px)"} 0 0 0`;
9
9
  export const CardWrapper = styled.div`
10
10
  background-color: ${bgColor};
11
- border-radius: ${borderRadius}px;
11
+ border-radius: ${"var(--ds-border-radius, 3px)"};
12
12
  width: ${gridSize() * 45}px;
13
13
  `;
14
14
  export const ProfileImage = styled.div`
@@ -81,7 +81,7 @@ export const ActionButtonGroup = styled.div`
81
81
  margin-left: ${"var(--ds-space-100, 8px)"};
82
82
 
83
83
  &:first-child {
84
- margin-left: 0;
84
+ margin-left: ${"var(--ds-space-0, 0px)"};
85
85
  }
86
86
  }
87
87
 
@@ -97,8 +97,8 @@ export const ActionButtonGroup = styled.div`
97
97
  `;
98
98
  export const OverflowActionButtonsWrapper = styled.div`
99
99
  display: inline-block;
100
- width: 32px;
101
- height: 32px;
100
+ width: ${"var(--ds-space-400, 32px)"};
101
+ height: ${"var(--ds-space-400, 32px)"};
102
102
  margin-left: ${"var(--ds-space-100, 8px)"};
103
103
 
104
104
  button {
@@ -115,8 +115,6 @@ export const CardContent = styled.div`
115
115
  flex-direction: column;
116
116
  min-height: ${gridSize() * 17}px;
117
117
  `;
118
-
119
- // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
120
118
  export const DetailsGroup = styled.div`
121
119
  display: flex;
122
120
  flex-direction: column;
package/dist/es2019/util/analytics.js CHANGED
@@ -31,7 +31,7 @@ const createEvent = (eventType, action, actionSubject, actionSubjectId, attribut
31
31
  actionSubjectId,
32
32
  attributes: {
33
33
  packageName: "@atlaskit/profilecard",
34
- packageVersion: "19.11.1",
34
+ packageVersion: "19.11.2",
35
35
  ...attributes,
36
36
  firedAt: Math.round(getPageTime())
37
37
  }
package/dist/esm/client/getTeamFromAGG.js CHANGED
@@ -48,7 +48,7 @@ export var addHeaders = function addHeaders(headers) {
48
48
  headers.append('X-ExperimentalApi', 'teams-beta');
49
49
  headers.append('X-ExperimentalApi', 'team-members-beta');
50
50
  headers.append('atl-client-name', "@atlaskit/profilecard");
51
- headers.append('atl-client-version', "19.11.1");
51
+ headers.append('atl-client-version', "19.11.2");
52
52
  return headers;
53
53
  };
54
54
  export function getTeamFromAGG(_x, _x2, _x3) {
package/dist/esm/styled/Card.js CHANGED
@@ -8,9 +8,9 @@ import { B200, N50A, N60A } from '@atlaskit/theme/colors';
8
8
  import { borderRadius, fontSize, fontSizeSmall, gridSize } from '@atlaskit/theme/constants';
9
9
  import { appLabelBgColor, appLabelTextColor, bgColor, headerBgColor, headerBgColorDisabledUser, headerTextColor, headerTextColorInactive, labelIconColor, labelTextColor } from './constants';
10
10
  var getFullNameMargin = function getFullNameMargin(props) {
11
- return props.noMeta ? "".concat(gridSize() * 4.5, "px 0 ").concat(gridSize() * 1.5, "px 0") : "".concat(gridSize() * 1.5, "px 0 0 0");
11
+ return props.noMeta ? "var(--ds-space-400, 32px)".concat(" 0 ", "var(--ds-space-150, 12px)", " 0") : "var(--ds-space-150, 12px)".concat(" 0 0 0");
12
12
  };
13
- export var CardWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background-color: ", ";\n border-radius: ", "px;\n width: ", "px;\n"])), bgColor, borderRadius, gridSize() * 45);
13
+ export var CardWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background-color: ", ";\n border-radius: ", ";\n width: ", "px;\n"])), bgColor, "var(--ds-border-radius, 3px)", gridSize() * 45);
14
14
  export var ProfileImage = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n position: absolute;\n top: ", ";\n left: ", ";\n"])), "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)");
15
15
  export var ActionsFlexSpacer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n flex: 1 0 auto;\n"])));
16
16
  var kudosButtonAnimationTransformation = keyframes(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n 0% { transform: translate(-80px, -50px); }\n 100% { transform: translate(90px, -70px); }\n"])));
@@ -22,11 +22,9 @@ export var KudosBlobAnimation = function KudosBlobAnimation(props) {
22
22
  };
23
23
  export var AnimationWrapper = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n clip-path: inset(0px 0px 0px 0px round ", "px);\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n"])), borderRadius);
24
24
  export var AnimatedKudosButton = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n margin-left: ", ";\n\n /* Need babel-plugin-emotion to use component selector */\n /* Previously with styled-components: &:hover {KudosBlobAnimation} { */\n &:focus-within .kudos-blob-animation,\n &:focus .kudos-blob-animation,\n &:hover .kudos-blob-animation {\n display: block;\n }\n"])), "var(--ds-space-100, 8px)");
25
- export var ActionButtonGroup = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n user-select: none;\n margin: ", " 0 0 0;\n text-align: right;\n display: flex;\n justify-content: flex-end;\n\n button,\n a {\n position: relative;\n }\n\n button,\n a,\n span {\n margin-left: ", ";\n\n &:first-child {\n margin-left: 0;\n }\n }\n\n a,\n button {\n &:focus {\n outline-color: ", ";\n outline-offset: ", ";\n outline-style: solid;\n outline-width: ", ";\n }\n }\n"])), "var(--ds-space-200, 16px)", "var(--ds-space-100, 8px)", "var(--ds-border-focused, ".concat(B200, ")"), "var(--ds-border-width, 2px)", "var(--ds-border-width, 2px)");
26
- export var OverflowActionButtonsWrapper = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n display: inline-block;\n width: 32px;\n height: 32px;\n margin-left: ", ";\n\n button {\n &:focus {\n outline-color: ", ";\n outline-offset: ", ";\n outline-style: solid;\n outline-width: ", ";\n }\n }\n"])), "var(--ds-space-100, 8px)", "var(--ds-border-focused, ".concat(B200, ")"), "var(--ds-border-width, 2px)", "var(--ds-border-width, 2px)");
25
+ export var ActionButtonGroup = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n user-select: none;\n margin: ", " 0 0 0;\n text-align: right;\n display: flex;\n justify-content: flex-end;\n\n button,\n a {\n position: relative;\n }\n\n button,\n a,\n span {\n margin-left: ", ";\n\n &:first-child {\n margin-left: ", ";\n }\n }\n\n a,\n button {\n &:focus {\n outline-color: ", ";\n outline-offset: ", ";\n outline-style: solid;\n outline-width: ", ";\n }\n }\n"])), "var(--ds-space-200, 16px)", "var(--ds-space-100, 8px)", "var(--ds-space-0, 0px)", "var(--ds-border-focused, ".concat(B200, ")"), "var(--ds-border-width, 2px)", "var(--ds-border-width, 2px)");
26
+ export var OverflowActionButtonsWrapper = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n display: inline-block;\n width: ", ";\n height: ", ";\n margin-left: ", ";\n\n button {\n &:focus {\n outline-color: ", ";\n outline-offset: ", ";\n outline-style: solid;\n outline-width: ", ";\n }\n }\n"])), "var(--ds-space-400, 32px)", "var(--ds-space-400, 32px)", "var(--ds-space-100, 8px)", "var(--ds-border-focused, ".concat(B200, ")"), "var(--ds-border-width, 2px)", "var(--ds-border-width, 2px)");
27
27
  export var CardContent = styled.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n min-height: ", "px;\n"])), gridSize() * 17);
28
-
29
- // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
30
28
  export var DetailsGroup = styled.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n margin-left: ", "px;\n width: ", "px;\n"])), gridSize() * 14.5, gridSize() * 24.5);
31
29
  export var DisabledInfo = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n font-size: ", "px;\n color: ", ";\n margin: ", " 0 0 0;\n line-height: 16px;\n"])), fontSizeSmall, labelTextColor, "var(--ds-space-150, 12px)");
32
30
  export var FullNameLabel = styled.h2(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n\n font-size: 18px;\n font-weight: 400;\n letter-spacing: normal;\n color: ", ";\n margin: ", ";\n line-height: ", "em;\n :first-child {\n margin: ", ";\n }\n"])), function (props) {
package/dist/esm/util/analytics.js CHANGED
@@ -38,7 +38,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
38
38
  actionSubjectId: actionSubjectId,
39
39
  attributes: _objectSpread(_objectSpread({
40
40
  packageName: "@atlaskit/profilecard",
41
- packageVersion: "19.11.1"
41
+ packageVersion: "19.11.2"
42
42
  }, attributes), {}, {
43
43
  firedAt: Math.round(getPageTime())
44
44
  })
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/profilecard",
3
- "version": "19.11.1",
3
+ "version": "19.11.2",
4
4
  "description": "A React component to display a card with user information.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -53,7 +53,7 @@
53
53
  },
54
54
  "dependencies": {
55
55
  "@atlaskit/analytics-next": "^9.2.0",
56
- "@atlaskit/avatar": "^21.4.0",
56
+ "@atlaskit/avatar": "^21.5.0",
57
57
  "@atlaskit/avatar-group": "^9.5.0",
58
58
  "@atlaskit/button": "^17.4.0",
59
59
  "@atlaskit/dropdown-menu": "^12.5.0",
@@ -67,7 +67,7 @@
67
67
  "@atlaskit/popup": "^1.12.0",
68
68
  "@atlaskit/spinner": "^16.0.0",
69
69
  "@atlaskit/theme": "^12.6.0",
70
- "@atlaskit/tokens": "^1.37.0",
70
+ "@atlaskit/tokens": "^1.38.0",
71
71
  "@atlaskit/tooltip": "^18.1.0",
72
72
  "@babel/runtime": "^7.0.0",
73
73
  "@emotion/react": "^11.7.1",