@atlaskit/profilecard 24.20.4 → 24.21.0

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 (86) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/__tests__/vr-tests/__snapshots__/agent-profilecard/agent-profile-card-example--default.png +0 -0
  3. package/__tests__/vr-tests/__snapshots__/user-profilecard/alternate-actions--default.png +0 -0
  4. package/__tests__/vr-tests/__snapshots__/user-profilecard/best-case-profile--default.png +0 -0
  5. package/__tests__/vr-tests/__snapshots__/user-profilecard/bot-case-profile--default.png +0 -0
  6. package/__tests__/vr-tests/__snapshots__/user-profilecard/error-state--default.png +0 -0
  7. package/__tests__/vr-tests/__snapshots__/user-profilecard/error-state-not-found--default.png +0 -0
  8. package/__tests__/vr-tests/__snapshots__/user-profilecard/worst-case-profile--default.png +0 -0
  9. package/compass.yml +3 -0
  10. package/dist/cjs/client/getOrgIdForCloudIdFromAGG.js +1 -1
  11. package/dist/cjs/client/getTeamFromAGG.js +1 -1
  12. package/dist/cjs/components/Agent/Actions.js +5 -7
  13. package/dist/cjs/components/Agent/ActionsCompiled.compiled.css +2 -2
  14. package/dist/cjs/components/Agent/ActionsCompiled.js +4 -8
  15. package/dist/cjs/components/Agent/AgentProfileCardCompiled.compiled.css +1 -1
  16. package/dist/cjs/components/Agent/AgentProfileCardCompiled.js +1 -1
  17. package/dist/cjs/components/Icon/IconLabel.js +1 -1
  18. package/dist/cjs/components/User/ProfileCardDetails.compiled.css +1 -1
  19. package/dist/cjs/components/User/ProfileCardDetails.js +1 -1
  20. package/dist/cjs/components/User/ReportingLinesDetails.compiled.css +1 -1
  21. package/dist/cjs/components/User/ReportingLinesDetails.js +1 -1
  22. package/dist/cjs/components/User/ReportingLinesDetailsCompiled.compiled.css +2 -2
  23. package/dist/cjs/components/User/ReportingLinesDetailsCompiled.js +2 -2
  24. package/dist/cjs/components/common/ProfileCardTrigger.js +17 -21
  25. package/dist/cjs/components/team-profile-card/main.compiled.css +1 -15
  26. package/dist/cjs/components/team-profile-card/main.js +82 -186
  27. package/dist/cjs/components/team-profile-card/team-connections/main.compiled.css +1 -6
  28. package/dist/cjs/components/team-profile-card/team-connections/main.js +1 -65
  29. package/dist/cjs/components/team-profile-card/team-containers-skeleton/linked-container-card-skeleton/index.compiled.css +3 -3
  30. package/dist/cjs/components/team-profile-card/team-containers-skeleton/linked-container-card-skeleton/index.js +1 -1
  31. package/dist/cjs/styled/Card.compiled.css +7 -7
  32. package/dist/cjs/styled/Card.js +9 -9
  33. package/dist/cjs/util/analytics.js +2 -2
  34. package/dist/es2019/client/getOrgIdForCloudIdFromAGG.js +1 -1
  35. package/dist/es2019/client/getTeamFromAGG.js +1 -1
  36. package/dist/es2019/components/Agent/Actions.js +1 -3
  37. package/dist/es2019/components/Agent/ActionsCompiled.compiled.css +2 -2
  38. package/dist/es2019/components/Agent/ActionsCompiled.js +2 -4
  39. package/dist/es2019/components/Agent/AgentProfileCardCompiled.compiled.css +1 -1
  40. package/dist/es2019/components/Agent/AgentProfileCardCompiled.js +1 -1
  41. package/dist/es2019/components/Icon/IconLabel.js +1 -1
  42. package/dist/es2019/components/User/ProfileCardDetails.compiled.css +1 -1
  43. package/dist/es2019/components/User/ProfileCardDetails.js +1 -1
  44. package/dist/es2019/components/User/ReportingLinesDetails.compiled.css +1 -1
  45. package/dist/es2019/components/User/ReportingLinesDetails.js +1 -1
  46. package/dist/es2019/components/User/ReportingLinesDetailsCompiled.compiled.css +2 -2
  47. package/dist/es2019/components/User/ReportingLinesDetailsCompiled.js +2 -2
  48. package/dist/es2019/components/common/ProfileCardTrigger.js +1 -4
  49. package/dist/es2019/components/team-profile-card/main.compiled.css +1 -15
  50. package/dist/es2019/components/team-profile-card/main.js +56 -158
  51. package/dist/es2019/components/team-profile-card/team-connections/main.compiled.css +1 -6
  52. package/dist/es2019/components/team-profile-card/team-connections/main.js +1 -69
  53. package/dist/es2019/components/team-profile-card/team-containers-skeleton/linked-container-card-skeleton/index.compiled.css +3 -3
  54. package/dist/es2019/components/team-profile-card/team-containers-skeleton/linked-container-card-skeleton/index.js +1 -1
  55. package/dist/es2019/styled/Card.compiled.css +7 -7
  56. package/dist/es2019/styled/Card.js +9 -9
  57. package/dist/es2019/util/analytics.js +2 -2
  58. package/dist/esm/client/getOrgIdForCloudIdFromAGG.js +1 -1
  59. package/dist/esm/client/getTeamFromAGG.js +1 -1
  60. package/dist/esm/components/Agent/Actions.js +3 -7
  61. package/dist/esm/components/Agent/ActionsCompiled.compiled.css +2 -2
  62. package/dist/esm/components/Agent/ActionsCompiled.js +4 -8
  63. package/dist/esm/components/Agent/AgentProfileCardCompiled.compiled.css +1 -1
  64. package/dist/esm/components/Agent/AgentProfileCardCompiled.js +1 -1
  65. package/dist/esm/components/Icon/IconLabel.js +1 -1
  66. package/dist/esm/components/User/ProfileCardDetails.compiled.css +1 -1
  67. package/dist/esm/components/User/ProfileCardDetails.js +1 -1
  68. package/dist/esm/components/User/ReportingLinesDetails.compiled.css +1 -1
  69. package/dist/esm/components/User/ReportingLinesDetails.js +1 -1
  70. package/dist/esm/components/User/ReportingLinesDetailsCompiled.compiled.css +2 -2
  71. package/dist/esm/components/User/ReportingLinesDetailsCompiled.js +2 -2
  72. package/dist/esm/components/common/ProfileCardTrigger.js +17 -21
  73. package/dist/esm/components/team-profile-card/main.compiled.css +1 -15
  74. package/dist/esm/components/team-profile-card/main.js +70 -174
  75. package/dist/esm/components/team-profile-card/team-connections/main.compiled.css +1 -6
  76. package/dist/esm/components/team-profile-card/team-connections/main.js +1 -65
  77. package/dist/esm/components/team-profile-card/team-containers-skeleton/linked-container-card-skeleton/index.compiled.css +3 -3
  78. package/dist/esm/components/team-profile-card/team-containers-skeleton/linked-container-card-skeleton/index.js +1 -1
  79. package/dist/esm/styled/Card.compiled.css +7 -7
  80. package/dist/esm/styled/Card.js +9 -9
  81. package/dist/esm/util/analytics.js +2 -2
  82. package/dist/types/components/team-profile-card/team-connections/main.d.ts +0 -1
  83. package/dist/types-ts4.5/components/team-profile-card/team-connections/main.d.ts +0 -1
  84. package/package.json +12 -23
  85. package/afm-post-office/tsconfig.json +0 -123
  86. package/afm-townsquare/tsconfig.json +0 -123
@@ -4,7 +4,7 @@ import { AGGQuery } from './graphqlUtils';
4
4
  var ORG_ID_FROM_CLOUD_ID_QUERY = "query OrgIdFromCloudId($cloudId: ID!) {\n\ttenantContexts(cloudIds: [$cloudId]) {\n\t\torgId\n\t}\n}";
5
5
  var addHeaders = function addHeaders(headers) {
6
6
  headers.append('atl-client-name', "@atlaskit/profilecard");
7
- headers.append('atl-client-version', "24.20.3");
7
+ headers.append('atl-client-version', "0.0.0-development");
8
8
  return headers;
9
9
  };
10
10
  export function getOrgIdForCloudIdFromAGG(_x, _x2) {
@@ -59,7 +59,7 @@ export var addHeaders = function addHeaders(headers) {
59
59
  headers.append('X-ExperimentalApi', 'teams-beta');
60
60
  headers.append('X-ExperimentalApi', 'team-members-beta');
61
61
  headers.append('atl-client-name', "@atlaskit/profilecard");
62
- headers.append('atl-client-version', "24.20.3");
62
+ headers.append('atl-client-version', "0.0.0-development");
63
63
  return headers;
64
64
  };
65
65
  export function getTeamFromAGG(_x, _x2, _x3) {
@@ -1,9 +1,6 @@
1
- import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
1
  import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
3
2
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
4
3
  import _regeneratorRuntime from "@babel/runtime/regenerator";
5
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
6
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
7
4
  import React, { useCallback, useState } from 'react';
8
5
  import { defineMessages, useIntl } from 'react-intl-next';
9
6
  import { useAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -80,12 +77,11 @@ var _AgentActions = function _AgentActions(_ref) {
80
77
  AGENT_CREATE = _yield$resourceClient2.AGENT_CREATE;
81
78
  AGENT_UPDATE = _yield$resourceClient2.AGENT_UPDATE;
82
79
  AGENT_DEACTIVATE = _yield$resourceClient2.AGENT_DEACTIVATE;
83
- return _context.abrupt("return", _objectSpread(_objectSpread({}, fg('agent_studio_fe_permissions_settings_m1') && {
84
- isCreateEnabled: AGENT_CREATE.permitted
85
- }), {}, {
80
+ return _context.abrupt("return", {
81
+ isCreateEnabled: AGENT_CREATE.permitted,
86
82
  isEditEnabled: AGENT_UPDATE.permitted,
87
83
  isDeleteEnabled: AGENT_DEACTIVATE.permitted
88
- }));
84
+ });
89
85
  case 8:
90
86
  case "end":
91
87
  return _context.stop();
@@ -1,7 +1,7 @@
1
1
 
2
2
  ._189ee4h9{border-width:var(--ds-border-width,1px)}
3
3
  ._18zrv77o{padding-inline:var(--ds-space-025,2px)}
4
- ._1h6dmuej{border-color:var(--ds-border,#091e4224)}._15a5nqa1{border-top-style:solid}
4
+ ._1h6d1l7x{border-color:var(--ds-border,#0b120e24)}._15a5nqa1{border-top-style:solid}
5
5
  ._19bvpxbi{padding-left:var(--ds-space-200,1pc)}
6
6
  ._1bah1h6o{justify-content:center}
7
7
  ._1bsb1osq{width:100%}
@@ -14,6 +14,6 @@
14
14
  ._k48p1wq8{font-weight:var(--ds-font-weight-medium,500)}
15
15
  ._n3tdpxbi{padding-bottom:var(--ds-space-200,1pc)}
16
16
  ._o5721jtm{white-space:pre-wrap}
17
- ._syaz1fxt{color:var(--ds-text,#172b4d)}
17
+ ._syazi7uo{color:var(--ds-text,#292a2e)}
18
18
  ._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}
19
19
  ._y3gn1e5h{text-align:left}
@@ -1,12 +1,9 @@
1
1
  /* ActionsCompiled.tsx generated by @compiled/babel-plugin v0.38.1 */
2
- import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
2
  import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
4
3
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
5
4
  import "./ActionsCompiled.compiled.css";
6
5
  import { ax, ix } from "@compiled/react/runtime";
7
6
  import _regeneratorRuntime from "@babel/runtime/regenerator";
8
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
9
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
10
7
  import React, { useCallback, useState } from 'react';
11
8
  import { defineMessages, useIntl } from 'react-intl-next';
12
9
  import { useAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -23,7 +20,7 @@ var styles = {
23
20
  chatPillButtonInlineStyles: "_18zrv77o",
24
21
  chatPillTextStyles: "_1nmz1hna _y3gn1e5h _o5721jtm",
25
22
  chatPillIconWrapper: "_1ul9gktf _4t3igktf",
26
- actionsWrapperStyles: "_189ee4h9 _1h6dmuej _15a5nqa1 _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _1pfhpxbi _syaz1fxt"
23
+ actionsWrapperStyles: "_189ee4h9 _1h6d1l7x _15a5nqa1 _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _1pfhpxbi _syazi7uo"
27
24
  };
28
25
  export var AgentActions = function AgentActions(_ref) {
29
26
  var onEditAgent = _ref.onEditAgent,
@@ -59,12 +56,11 @@ export var AgentActions = function AgentActions(_ref) {
59
56
  AGENT_CREATE = _yield$resourceClient2.AGENT_CREATE;
60
57
  AGENT_UPDATE = _yield$resourceClient2.AGENT_UPDATE;
61
58
  AGENT_DEACTIVATE = _yield$resourceClient2.AGENT_DEACTIVATE;
62
- return _context.abrupt("return", _objectSpread(_objectSpread({}, fg('agent_studio_fe_permissions_settings_m1') && {
63
- isCreateEnabled: AGENT_CREATE.permitted
64
- }), {}, {
59
+ return _context.abrupt("return", {
60
+ isCreateEnabled: AGENT_CREATE.permitted,
65
61
  isEditEnabled: AGENT_UPDATE.permitted,
66
62
  isDeleteEnabled: AGENT_DEACTIVATE.permitted
67
- }));
63
+ });
68
64
  case 8:
69
65
  case "end":
70
66
  return _context.stop();
@@ -1,7 +1,7 @@
1
1
 
2
2
  ._2rko1mok{border-radius:var(--ds-radius-large,8px)}
3
3
  ._18zrpxbi{padding-inline:var(--ds-space-200,1pc)}._154i1ejb{top:var(--ds-space-300,24px)}
4
- ._16qs1cd0{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #091e4226,0 0 1px #091e424f)}
4
+ ._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
5
5
  ._1ltvpxbi{left:var(--ds-space-200,1pc)}
6
6
  ._1q51xy5q{padding-block-start:var(--ds-space-400,2pc)}
7
7
  ._kqswh2mm{position:relative}
@@ -26,7 +26,7 @@ import { messages } from './messages';
26
26
  var styles = {
27
27
  detailWrapper: "_18zrpxbi _1q51xy5q",
28
28
  avatarStyles: "_kqswstnw _154i1ejb _1ltvpxbi",
29
- cardContainerStyles: "_2rko1mok _16qs1cd0 _kqswh2mm"
29
+ cardContainerStyles: "_2rko1mok _16qs130s _kqswh2mm"
30
30
  };
31
31
  var AgentProfileCard = function AgentProfileCard(_ref) {
32
32
  var _agent$user_defined_c, _agent$external_confi, _agent$external_confi2, _agent$creatorInfo, _agent$creatorInfo2, _agent$creatorInfo3, _agent$creatorInfo4;
@@ -36,7 +36,7 @@ var IconLabel = /*#__PURE__*/function (_React$PureComponent) {
36
36
  var displayIcon = IconElement ? /*#__PURE__*/React.createElement(IconElement, {
37
37
  label: "".concat(this.props.icon),
38
38
  LEGACY_size: "small",
39
- color: "var(--ds-text-subtlest, #626F86)"
39
+ color: "var(--ds-text-subtlest, #6B6E76)"
40
40
  }) : null;
41
41
  return /*#__PURE__*/React.createElement(DetailsLabel, {
42
42
  extraTopSpace: this.props.extraTopSpace
@@ -21,5 +21,5 @@
21
21
  ._rcujutpp._rcujutpp{margin-top:var(--ds-space-150,9pt)}
22
22
  ._rcujxy5q._rcujxy5q{margin-top:var(--ds-space-400,2pc)}
23
23
  ._syaz15cr{color:var(--ds-text-inverse,#fff)}
24
- ._syaz1fxt{color:var(--ds-text,#172b4d)}
24
+ ._syazi7uo{color:var(--ds-text,#292a2e)}
25
25
  ._u5f3ze3t{padding-right:var(--ds-space-0,0)}
@@ -22,7 +22,7 @@ var styles = {
22
22
  noMetaLabelWithHighSpecificity: "_vvzr1ixg _1hpmxy5q _1bguutpp",
23
23
  metaLabel: "_2hwxidpf _otyridpf _18u0idpf _rcujutpp",
24
24
  metaLabelWithHighSpecificity: "_2hwxidpf _otyridpf _18u0idpf _vvzr1ixg _1hpmutpp",
25
- disabledAccount: "_syaz1fxt",
25
+ disabledAccount: "_syazi7uo",
26
26
  activeAccount: "_syaz15cr"
27
27
  };
28
28
  var renderName = function renderName(nickname, fullName, meta) {
@@ -3,4 +3,4 @@
3
3
  ._ca0qze3t{padding-top:var(--ds-space-0,0)}
4
4
  ._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
5
5
  ._u5f3ze3t{padding-right:var(--ds-space-0,0)}
6
- ._irr3166n:hover{background-color:var(--ds-background-neutral-subtle-hovered,#091e420f)}
6
+ ._irr31dpa:hover{background-color:var(--ds-background-neutral-subtle-hovered,#0515240f)}
@@ -31,7 +31,7 @@ var reportingLinesHeadingStyles = xcss({
31
31
  marginBottom: '0'
32
32
  });
33
33
  var styles = {
34
- reportingLinesButton: "_ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _bfhksm61 _irr3166n"
34
+ reportingLinesButton: "_ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _bfhksm61 _irr31dpa"
35
35
  };
36
36
  var avatarGroupMaxCount = 5;
37
37
  var ReportingLinesDetails = function ReportingLinesDetails(props) {
@@ -6,6 +6,6 @@
6
6
  ._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
7
7
  ._otyru2gc{margin-bottom:var(--ds-space-100,8px)}
8
8
  ._otyrze3t{margin-bottom:var(--ds-space-0,0)}
9
- ._syaz1fxt{color:var(--ds-text,#172b4d)}
9
+ ._syazi7uo{color:var(--ds-text,#292a2e)}
10
10
  ._u5f3ze3t{padding-right:var(--ds-space-0,0)}
11
- ._irr3166n:hover{background-color:var(--ds-background-neutral-subtle-hovered,#091e420f)}
11
+ ._irr31dpa:hover{background-color:var(--ds-background-neutral-subtle-hovered,#0515240f)}
@@ -14,8 +14,8 @@ function getProfileHref(userId, profileUrl) {
14
14
  return profileUrl ? profileUrl + userId : undefined;
15
15
  }
16
16
  var styles = {
17
- reportingLinesButton: "_ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _bfhksm61 _irr3166n",
18
- reportingLinesHeadingDefaultStyles: "_11c81vhk _syaz1fxt _k48p1pd9 _otyru2gc",
17
+ reportingLinesButton: "_ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _bfhksm61 _irr31dpa",
18
+ reportingLinesHeadingDefaultStyles: "_11c81vhk _syazi7uo _k48p1pd9 _otyru2gc",
19
19
  reportingLinesHeadingStyles: "_otyrze3t"
20
20
  };
21
21
  var avatarGroupMaxCount = 5;
@@ -122,27 +122,23 @@ function ProfileCardTriggerInner(_ref, ref) {
122
122
  }));
123
123
  },
124
124
  content: function content() {
125
- return (
126
- /*#__PURE__*/
127
- // eslint-disable-next-line @atlassian/a11y/no-static-element-interactions
128
- React.createElement("div", {
129
- onMouseEnter: onMouseEnter
130
- // eslint-disable-next-line @atlassian/a11y/mouse-events-have-key-events
131
- ,
132
- onMouseLeave: hideProfilecard,
133
- onFocus: showProfilecard,
134
- "data-testid": "profile-card--trigger-content"
135
- }, isLoading ? /*#__PURE__*/React.createElement(ProfileCardWrapper, {
136
- testId: "profilecard.profilecardtrigger.loading"
137
- }, /*#__PURE__*/React.createElement(LoadingState, {
138
- fireAnalytics: fireAnalytics,
139
- fireAnalyticsNext: fireAnalyticsNext,
140
- profileType: profileCardType
141
- })) : renderProfileCard({
142
- profileData: profileData,
143
- error: error
144
- }))
145
- );
125
+ return /*#__PURE__*/React.createElement("div", {
126
+ onMouseEnter: onMouseEnter
127
+ // eslint-disable-next-line @atlassian/a11y/mouse-events-have-key-events
128
+ ,
129
+ onMouseLeave: hideProfilecard,
130
+ onFocus: showProfilecard,
131
+ "data-testid": "profile-card--trigger-content"
132
+ }, isLoading ? /*#__PURE__*/React.createElement(ProfileCardWrapper, {
133
+ testId: "profilecard.profilecardtrigger.loading"
134
+ }, /*#__PURE__*/React.createElement(LoadingState, {
135
+ fireAnalytics: fireAnalytics,
136
+ fireAnalyticsNext: fireAnalyticsNext,
137
+ profileType: profileCardType
138
+ })) : renderProfileCard({
139
+ profileData: profileData,
140
+ error: error
141
+ }));
146
142
  }
147
143
  }));
148
144
  }
@@ -1,45 +1,31 @@
1
1
  ._11c81vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
2
- ._2rko12b0{border-radius:var(--ds-radius-small,4px)}
3
2
  ._2rko1mok{border-radius:var(--ds-radius-large,8px)}
4
3
  ._v564nm7n{transition:box-shadow .25s ease-in-out}
5
- ._189ee4h9{border-width:var(--ds-border-width,1px)}
6
- ._1dqonqa1{border-style:solid}
7
- ._1h6dmuej{border-color:var(--ds-border,#091e4224)}
8
- ._15a5nqa1{border-top-style:solid}
9
4
  ._18m915vq{overflow-y:hidden}
10
5
  ._18m91wug{overflow-y:auto}
11
6
  ._18u01ejb{margin-left:var(--ds-space-300,24px)}
12
7
  ._18u01wug{margin-left:auto}
13
8
  ._18u0pxbi{margin-left:var(--ds-space-200,1pc)}
14
9
  ._18u0u2gc{margin-left:var(--ds-space-100,8px)}
15
- ._19bv1ejb{padding-left:var(--ds-space-300,24px)}
16
10
  ._19pk1b66{margin-top:var(--ds-space-050,4px)}
17
- ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
18
11
  ._19pku2gc{margin-top:var(--ds-space-100,8px)}
19
12
  ._1bsb1gwv{width:360px}
20
13
  ._1bsb1osq{width:100%}
21
14
  ._1bsb7vkz{width:1pc}
22
15
  ._1e0c1txw{display:flex}
23
- ._1i53muej{border-top-color:var(--ds-border,#091e4224)}
24
16
  ._1reo15vq{overflow-x:hidden}
25
17
  ._1ul95x59{min-width:340px}
26
18
  ._2hwx1ejb{margin-right:var(--ds-space-300,24px)}
27
19
  ._2hwxpxbi{margin-right:var(--ds-space-200,1pc)}
28
20
  ._2hwxu2gc{margin-right:var(--ds-space-100,8px)}
29
21
  ._2lx21bp4{flex-direction:column}
30
- ._4cvr1h6o{align-items:center}
31
22
  ._4t3i12am{height:50px}
32
- ._4t3i1ul9{height:30px}
33
23
  ._4t3i1wug{height:auto}
34
- ._4t3i53f4{height:75pt}
35
24
  ._4t3i7vkz{height:1pc}
36
25
  ._5ral1dfr{object-fit:cover}
37
- ._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
38
26
  ._c71lx2si{max-height:265px}
39
27
  ._kqswstnw{position:absolute}
40
28
  ._otyr12x7{margin-bottom:var(--ds-space-075,6px)}
41
29
  ._otyrpxbi{margin-bottom:var(--ds-space-200,1pc)}
42
30
  ._s7n4jp4b{vertical-align:top}
43
- ._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
44
- ._u5f31ejb{padding-right:var(--ds-space-300,24px)}
45
- ._uwhke4h9{border-top-width:var(--ds-border-width,1px)}
31
+ ._syazazsu{color:var(--ds-text-subtle,#505258)}
@@ -3,8 +3,9 @@ import _extends from "@babel/runtime/helpers/extends";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
4
  var _excluded = ["containerId", "teamId", "displayName", "description", "avatarImageUrl", "headerImageUrl", "memberAvatars", "memberCount", "cloudId", "userId", "isVerified", "teamProfileUrl"];
5
5
  import "./main.compiled.css";
6
+ import * as React from 'react';
6
7
  import { ax, ix } from "@compiled/react/runtime";
7
- import React, { useCallback, useMemo } from 'react';
8
+ import { useCallback, useMemo } from 'react';
8
9
  import { FormattedMessage } from 'react-intl-next';
9
10
  import { useAnalyticsEvents } from '@atlaskit/analytics-next';
10
11
  import AvatarGroup from '@atlaskit/avatar-group';
@@ -12,64 +13,41 @@ import Heading from '@atlaskit/heading';
12
13
  import LinkItem from '@atlaskit/menu/link-item';
13
14
  import { VerifiedTeamIcon } from '@atlaskit/people-teams-ui-public/verified-team-icon';
14
15
  import { fg } from '@atlaskit/platform-feature-flags';
15
- import { Box, Flex, Inline, Pressable, Stack, Text } from '@atlaskit/primitives/compiled';
16
+ import { Box, Flex, Inline, Stack, Text } from '@atlaskit/primitives/compiled';
16
17
  import { useAnalyticsEvents as useAnalyticsEventsNext } from '@atlaskit/teams-app-internal-analytics';
17
18
  import TeamAvatar from '@atlaskit/teams-avatar';
18
19
  import { TeamContainers, useTeamContainers } from '@atlaskit/teams-public';
19
20
  import { fireEvent } from '../../util/analytics';
20
21
  import TeamAppTile from '../common/assets/TeamAppTile.svg';
21
22
  import { TeamActions } from './team-actions';
22
- import { NewTeamConnections, TeamConnections } from './team-connections/main';
23
+ import { TeamConnections } from './team-connections/main';
23
24
  import { TeamContainersSkeleton } from './team-containers-skeleton';
24
25
  var noop = function noop() {};
25
26
  var styles = {
26
27
  wrapperStyles: "_2rko1mok _v564nm7n _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bsb1gwv _1ul95x59 _4t3i1wug",
27
28
  containerStyles: "_otyrpxbi",
28
29
  avatarImageStyles: "_kqswstnw _18u01ejb",
29
- headerImageStyles: "_5ral1dfr _s7n4jp4b _4t3i53f4 _1bsb1osq",
30
- newHeaderImageStyles: "_5ral1dfr _s7n4jp4b _4t3i12am _1bsb1osq",
30
+ headerImageStyles: "_5ral1dfr _s7n4jp4b _4t3i12am _1bsb1osq",
31
31
  teamInformationStyles: "_18u01ejb _19pku2gc _2hwx1ejb",
32
- teamConnectionHeaderStyles: "_18u0u2gc _2hwxu2gc _c71lx2si _18m91wug",
33
- teamConnectionContainerStyles: "_18u0u2gc _2hwxu2gc",
34
32
  teamConnectionStyles: "_18u0u2gc _2hwxu2gc",
35
33
  teamConnectionItemsStyles: "_c71lx2si _18m91wug",
36
- connectionTitleStyles: "_11c81vhk _18u0pxbi _19pk1b66 _2hwxpxbi _otyr12x7 _syaz1gjq",
37
- teamAppTileStyles: "_18u01wug _4t3i7vkz _1bsb7vkz",
38
- viewProfileContainerStyles: "_4cvr1h6o _uwhke4h9 _15a5nqa1 _1i53muej _19bv1ejb _u5f31ejb",
39
- viewProfileButtonStyles: "_2rko12b0 _189ee4h9 _1dqonqa1 _1h6dmuej _bfhksm61 _syaz1gjq _1bsb1osq _4t3i1ul9 _19pkpxbi"
34
+ connectionTitleStyles: "_11c81vhk _18u0pxbi _19pk1b66 _2hwxpxbi _otyr12x7 _syazazsu",
35
+ teamAppTileStyles: "_18u01wug _4t3i7vkz _1bsb7vkz"
40
36
  };
41
- var TeamCardWrapper = function TeamCardWrapper(_ref) {
42
- var id = _ref.id,
43
- children = _ref.children;
44
- return /*#__PURE__*/React.createElement(Box, {
45
- xcss: styles.wrapperStyles,
46
- testId: "team-card-".concat(id)
47
- }, children);
48
- };
49
- var HeaderImage = function HeaderImage(_ref2) {
50
- var srcUrl = _ref2.srcUrl;
51
- return /*#__PURE__*/React.createElement(Box, {
52
- as: "img",
53
- src: srcUrl,
54
- xcss: styles.headerImageStyles,
55
- testId: "profile-header-image",
56
- alt: "team-header-image"
57
- });
58
- };
59
- export var TeamProfileCard = function TeamProfileCard(_ref3) {
60
- var containerId = _ref3.containerId,
61
- teamId = _ref3.teamId,
62
- displayName = _ref3.displayName,
63
- description = _ref3.description,
64
- avatarImageUrl = _ref3.avatarImageUrl,
65
- headerImageUrl = _ref3.headerImageUrl,
66
- memberAvatars = _ref3.memberAvatars,
67
- memberCount = _ref3.memberCount,
68
- cloudId = _ref3.cloudId,
69
- userId = _ref3.userId,
70
- isVerified = _ref3.isVerified,
71
- teamProfileUrl = _ref3.teamProfileUrl,
72
- props = _objectWithoutProperties(_ref3, _excluded);
37
+ export var TeamProfileCard = function TeamProfileCard(_ref) {
38
+ var containerId = _ref.containerId,
39
+ teamId = _ref.teamId,
40
+ displayName = _ref.displayName,
41
+ description = _ref.description,
42
+ avatarImageUrl = _ref.avatarImageUrl,
43
+ headerImageUrl = _ref.headerImageUrl,
44
+ memberAvatars = _ref.memberAvatars,
45
+ memberCount = _ref.memberCount,
46
+ cloudId = _ref.cloudId,
47
+ userId = _ref.userId,
48
+ isVerified = _ref.isVerified,
49
+ teamProfileUrl = _ref.teamProfileUrl,
50
+ props = _objectWithoutProperties(_ref, _excluded);
73
51
  var _useTeamContainers = useTeamContainers(teamId),
74
52
  teamContainers = _useTeamContainers.teamContainers,
75
53
  loading = _useTeamContainers.loading;
@@ -83,9 +61,6 @@ export var TeamProfileCard = function TeamProfileCard(_ref3) {
83
61
  return tc.id === containerId;
84
62
  }).length < teamContainers.length;
85
63
  }, [containerId, teamContainers]);
86
-
87
- // TODO: set isNewLayout to be true when clean up 'team-bi-directional-container-connection' experiment
88
- var isNewLayout = Boolean(props.isKudosEnabled || props.otherActions);
89
64
  var onClick = useCallback(function () {
90
65
  if (fg('ptc-enable-profile-card-analytics-refactor')) {
91
66
  fireEventNext('ui.button.clicked.viewTeamProfileButton', {});
@@ -99,117 +74,16 @@ export var TeamProfileCard = function TeamProfileCard(_ref3) {
99
74
  });
100
75
  }
101
76
  }
102
- if (!isNewLayout) {
103
- window.open(teamProfileUrl, '_blank');
104
- }
105
- }, [createAnalyticsEvent, teamProfileUrl, isNewLayout, fireEventNext]);
106
- if (isNewLayout) {
107
- return /*#__PURE__*/React.createElement(Box, {
108
- xcss: styles.wrapperStyles,
109
- testId: "team-card-".concat(teamId)
110
- }, /*#__PURE__*/React.createElement(Box, {
111
- as: "img",
112
- src: headerImageUrl,
113
- xcss: styles.newHeaderImageStyles,
114
- testId: "profile-header-image",
115
- alt: "team-header-image"
116
- }), /*#__PURE__*/React.createElement(Stack, {
117
- space: "space.200",
118
- xcss: styles.containerStyles
119
- }, /*#__PURE__*/React.createElement(Inline, {
120
- spread: "space-between",
121
- alignBlock: "center"
122
- }, /*#__PURE__*/React.createElement(Box, {
123
- xcss: styles.avatarImageStyles
124
- }, /*#__PURE__*/React.createElement(TeamAvatar, {
125
- size: "medium",
126
- src: avatarImageUrl
127
- }))), /*#__PURE__*/React.createElement(Stack, {
128
- xcss: styles.teamInformationStyles,
129
- space: "space.200"
130
- }, /*#__PURE__*/React.createElement(Flex, {
131
- justifyContent: "space-between"
132
- }, /*#__PURE__*/React.createElement(Stack, {
133
- space: "space.050"
134
- }, /*#__PURE__*/React.createElement(Inline, {
135
- alignBlock: "center"
136
- }, /*#__PURE__*/React.createElement(Heading, {
137
- size: "medium"
138
- }, displayName), isVerified && /*#__PURE__*/React.createElement(VerifiedTeamIcon, {
139
- showTooltip: true
140
- })), /*#__PURE__*/React.createElement(Text, {
141
- color: "color.text.subtlest"
142
- }, typeof memberCount === 'string' ? /*#__PURE__*/React.createElement(FormattedMessage, {
143
- defaultMessage: "Contributing team \u2022 {memberCount} members",
144
- values: {
145
- memberCount: memberCount
146
- },
147
- id: "people-and-teams.team-profile-card.large-member-count"
148
- }) : /*#__PURE__*/React.createElement(FormattedMessage, {
149
- defaultMessage: "Contributing team \u2022 {count, plural, one {# member} other {# members}}",
150
- values: {
151
- count: memberCount
152
- },
153
- id: "people-and-teams.team-profile-card.member-count"
154
- }))), /*#__PURE__*/React.createElement(TeamActions, _extends({
155
- cloudId: cloudId,
156
- teamId: teamId
157
- }, props))), /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(AvatarGroup, {
158
- appearance: "stack",
159
- data: memberAvatars
160
- })), description && /*#__PURE__*/React.createElement(Text, {
161
- color: "color.text",
162
- maxLines: 3
163
- }, description)), /*#__PURE__*/React.createElement(Box, {
164
- xcss: styles.teamConnectionStyles
165
- }, /*#__PURE__*/React.createElement(Box, {
166
- xcss: styles.connectionTitleStyles
167
- }, /*#__PURE__*/React.createElement(FormattedMessage, {
168
- defaultMessage: "Team links",
169
- id: "people-and-teams.team-profile-card.team-connections"
170
- })), /*#__PURE__*/React.createElement(Box, {
171
- xcss: styles.teamConnectionItemsStyles
172
- }, /*#__PURE__*/React.createElement(LinkItem, {
173
- href: teamProfileUrl,
174
- target: "_blank",
175
- onClick: onClick,
176
- description: /*#__PURE__*/React.createElement(FormattedMessage, {
177
- defaultMessage: "Team profile",
178
- id: "people-and-teams.team-profile-card.team-profile-description"
179
- }),
180
- iconBefore: /*#__PURE__*/React.createElement(TeamAvatar, {
181
- size: "small",
182
- src: avatarImageUrl
183
- }),
184
- iconAfter: /*#__PURE__*/React.createElement(Box, {
185
- as: "img",
186
- src: TeamAppTile,
187
- testId: "team-app-tile",
188
- alt: "team-app-tile",
189
- xcss: styles.teamAppTileStyles
190
- }),
191
- testId: "team-profile-card-profile-link-item"
192
- }, /*#__PURE__*/React.createElement(Text, {
193
- maxLines: 1,
194
- color: "color.text"
195
- }, displayName)), (loading || hasOtherTeamConnections) && /*#__PURE__*/React.createElement(TeamContainers, {
196
- teamId: teamId,
197
- onAddAContainerClick: noop,
198
- userId: userId,
199
- cloudId: cloudId,
200
- components: {
201
- ContainerCard: NewTeamConnections,
202
- TeamContainersSkeleton: TeamContainersSkeleton
203
- },
204
- filterContainerId: containerId,
205
- isDisplayedOnProfileCard: true,
206
- maxNumberOfContainersToShow: loading ? 0 : 9
207
- })))));
208
- }
209
- return /*#__PURE__*/React.createElement(TeamCardWrapper, {
210
- id: teamId
211
- }, /*#__PURE__*/React.createElement(HeaderImage, {
212
- srcUrl: headerImageUrl
77
+ }, [createAnalyticsEvent, fireEventNext]);
78
+ return /*#__PURE__*/React.createElement(Box, {
79
+ xcss: styles.wrapperStyles,
80
+ testId: "team-card-".concat(teamId)
81
+ }, /*#__PURE__*/React.createElement(Box, {
82
+ as: "img",
83
+ src: headerImageUrl,
84
+ xcss: styles.headerImageStyles,
85
+ testId: "profile-header-image",
86
+ alt: "team-header-image"
213
87
  }), /*#__PURE__*/React.createElement(Stack, {
214
88
  space: "space.200",
215
89
  xcss: styles.containerStyles
@@ -224,6 +98,8 @@ export var TeamProfileCard = function TeamProfileCard(_ref3) {
224
98
  }))), /*#__PURE__*/React.createElement(Stack, {
225
99
  xcss: styles.teamInformationStyles,
226
100
  space: "space.200"
101
+ }, /*#__PURE__*/React.createElement(Flex, {
102
+ justifyContent: "space-between"
227
103
  }, /*#__PURE__*/React.createElement(Stack, {
228
104
  space: "space.050"
229
105
  }, /*#__PURE__*/React.createElement(Inline, {
@@ -246,20 +122,48 @@ export var TeamProfileCard = function TeamProfileCard(_ref3) {
246
122
  count: memberCount
247
123
  },
248
124
  id: "people-and-teams.team-profile-card.member-count"
249
- }))), /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(AvatarGroup, {
125
+ }))), /*#__PURE__*/React.createElement(TeamActions, _extends({
126
+ cloudId: cloudId,
127
+ teamId: teamId
128
+ }, props))), /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(AvatarGroup, {
250
129
  appearance: "stack",
251
130
  data: memberAvatars
252
131
  })), description && /*#__PURE__*/React.createElement(Text, {
253
132
  color: "color.text",
254
133
  maxLines: 3
255
- }, description)), (loading || hasOtherTeamConnections) && /*#__PURE__*/React.createElement(Box, {
256
- xcss: hasOtherTeamConnections ? styles.teamConnectionHeaderStyles : styles.teamConnectionContainerStyles
257
- }, hasOtherTeamConnections && /*#__PURE__*/React.createElement(Box, {
134
+ }, description)), /*#__PURE__*/React.createElement(Box, {
135
+ xcss: styles.teamConnectionStyles
136
+ }, /*#__PURE__*/React.createElement(Box, {
258
137
  xcss: styles.connectionTitleStyles
259
138
  }, /*#__PURE__*/React.createElement(FormattedMessage, {
260
- defaultMessage: "Where we work",
261
- id: "people-and-teams.team-profile-card.team-connections-header"
262
- })), /*#__PURE__*/React.createElement(TeamContainers, {
139
+ defaultMessage: "Team links",
140
+ id: "people-and-teams.team-profile-card.team-connections"
141
+ })), /*#__PURE__*/React.createElement(Box, {
142
+ xcss: styles.teamConnectionItemsStyles
143
+ }, /*#__PURE__*/React.createElement(LinkItem, {
144
+ href: teamProfileUrl,
145
+ target: "_blank",
146
+ onClick: onClick,
147
+ description: /*#__PURE__*/React.createElement(FormattedMessage, {
148
+ defaultMessage: "Team profile",
149
+ id: "people-and-teams.team-profile-card.team-profile-description"
150
+ }),
151
+ iconBefore: /*#__PURE__*/React.createElement(TeamAvatar, {
152
+ size: "small",
153
+ src: avatarImageUrl
154
+ }),
155
+ iconAfter: /*#__PURE__*/React.createElement(Box, {
156
+ as: "img",
157
+ src: TeamAppTile,
158
+ testId: "team-app-tile",
159
+ alt: "team-app-tile",
160
+ xcss: styles.teamAppTileStyles
161
+ }),
162
+ testId: "team-profile-card-profile-link-item"
163
+ }, /*#__PURE__*/React.createElement(Text, {
164
+ maxLines: 1,
165
+ color: "color.text"
166
+ }, displayName)), (loading || hasOtherTeamConnections) && /*#__PURE__*/React.createElement(TeamContainers, {
263
167
  teamId: teamId,
264
168
  onAddAContainerClick: noop,
265
169
  userId: userId,
@@ -269,15 +173,7 @@ export var TeamProfileCard = function TeamProfileCard(_ref3) {
269
173
  TeamContainersSkeleton: TeamContainersSkeleton
270
174
  },
271
175
  filterContainerId: containerId,
272
- isDisplayedOnProfileCard: true
273
- })), teamProfileUrl && /*#__PURE__*/React.createElement(Stack, {
274
- xcss: styles.viewProfileContainerStyles
275
- }, /*#__PURE__*/React.createElement(Pressable, {
276
- onClick: onClick,
277
- xcss: styles.viewProfileButtonStyles,
278
- testId: "view-profile-button"
279
- }, /*#__PURE__*/React.createElement(FormattedMessage, {
280
- defaultMessage: "View profile",
281
- id: "people-and-teams.team-profile-card.view-profile"
176
+ isDisplayedOnProfileCard: true,
177
+ maxNumberOfContainersToShow: loading ? 0 : 9
282
178
  })))));
283
179
  };
@@ -1,8 +1,3 @@
1
-
2
- ._2rko12b0{border-radius:var(--ds-radius-small,4px)}._18u01wug{margin-left:auto}
3
- ._1bsb1tcg{width:24px}
1
+ ._18u01wug{margin-left:auto}
4
2
  ._1bsb7vkz{width:1pc}
5
- ._1e0c1txw{display:flex}
6
- ._4cvr1h6o{align-items:center}
7
- ._4t3i1tcg{height:24px}
8
3
  ._4t3i7vkz{height:1pc}