@atlaskit/profilecard 23.7.2 → 23.7.4

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/profilecard
 
+## 23.7.4
+
+### Patch Changes
+
+- [#133042](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/133042)
+  [`5168674830838`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5168674830838) -
+  make the connection item clickable
+- Updated dependencies
+
+## 23.7.3
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 23.7.2
 
 ### Patch Changes

package/dist/cjs/client/getOrgIdForCloudIdFromAGG.js

@@ -11,7 +11,7 @@ var _graphqlUtils = require("./graphqlUtils");
 var ORG_ID_FROM_CLOUD_ID_QUERY = "query OrgIdFromCloudId($cloudId: ID!) {\n\ttenantContexts(cloudIds: [$cloudId]) {\n\t\torgId\n\t}\n}";
 var addHeaders = function addHeaders(headers) {
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "23.7.2");
+  headers.append('atl-client-version', "23.7.4");
   return headers;
 };
 function getOrgIdForCloudIdFromAGG(_x, _x2) {

package/dist/cjs/client/getTeamFromAGG.js

@@ -66,7 +66,7 @@ var addHeaders = exports.addHeaders = function addHeaders(headers) {
   headers.append('X-ExperimentalApi', 'teams-beta');
   headers.append('X-ExperimentalApi', 'team-members-beta');
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "23.7.2");
+  headers.append('atl-client-version', "23.7.4");
   return headers;
 };
 function getTeamFromAGG(_x, _x2, _x3) {

package/dist/cjs/components/team-profile-card/main.compiled.css

@@ -1,13 +1,16 @@
-
+._11c81vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._2rkoiti9{border-radius:var(--ds-border-radius-100,4px)}
 ._2rkopd34{border-radius:var(--ds-border-radius-200,8px)}
 ._v564nm7n{transition:box-shadow .25s ease-in-out}
 ._189ee4h9{border-width:var(--ds-border-width,1px)}
 ._1dqonqa1{border-style:solid}
-._1h6dmuej{border-color:var(--ds-border,#091e4224)}._15a5nqa1{border-top-style:solid}
+._1h6dmuej{border-color:var(--ds-border,#091e4224)}
+._15a5nqa1{border-top-style:solid}
 ._18m915vq{overflow-y:hidden}
 ._18m91wug{overflow-y:auto}
 ._18u01ejb{margin-left:var(--ds-space-300,24px)}
+._18u0pxbi{margin-left:var(--ds-space-200,1pc)}
+._18u0u2gc{margin-left:var(--ds-space-100,8px)}
 ._19bv1ejb{padding-left:var(--ds-space-300,24px)}
 ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
 ._19pku2gc{margin-top:var(--ds-space-100,8px)}
@@ -18,6 +21,8 @@
 ._1reo15vq{overflow-x:hidden}
 ._1ul95x59{min-width:340px}
 ._2hwx1ejb{margin-right:var(--ds-space-300,24px)}
+._2hwxpxbi{margin-right:var(--ds-space-200,1pc)}
+._2hwxu2gc{margin-right:var(--ds-space-100,8px)}
 ._2lx21bp4{flex-direction:column}
 ._4cvr1h6o{align-items:center}
 ._4t3i1ul9{height:30px}
@@ -27,6 +32,7 @@
 ._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
 ._c71lx2si{max-height:265px}
 ._kqswstnw{position:absolute}
+._otyr12x7{margin-bottom:var(--ds-space-075,6px)}
 ._otyrpxbi{margin-bottom:var(--ds-space-200,1pc)}
 ._s7n4jp4b{vertical-align:top}
 ._syaz1gjq{color:var(--ds-text-subtle,#44546f)}

package/dist/cjs/components/team-profile-card/main.js

@@ -25,13 +25,14 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 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 && {}.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; }
 var noop = function noop() {};
 var styles = {
-  wrapperStyles: "_2rkopd34 _v564nm7n _1reo15vq _18m915vq _189ee4h9 _1dqonqa1 _1h6dmuej _1e0c1txw _2lx21bp4 _1bsb1gwv _1ul95x59 _4t3i1wug",
+  wrapperStyles: "_2rkopd34 _v564nm7n _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bsb1gwv _1ul95x59 _4t3i1wug",
   containerStyles: "_otyrpxbi",
   avatarImageStyles: "_kqswstnw _18u01ejb",
   headerImageStyles: "_5ral1dfr _s7n4jp4b _4t3i53f4 _1bsb1osq",
   teamInformationStyles: "_18u01ejb _19pku2gc _2hwx1ejb",
-  teamConnectionHeaderStyles: "_18u01ejb _19pkpxbi _2hwx1ejb _c71lx2si _18m91wug",
+  teamConnectionHeaderStyles: "_18u0u2gc _2hwxu2gc _c71lx2si _18m91wug",
   teamConnectionContainerStyles: "_18u01ejb _2hwx1ejb",
+  connectionTitleStyles: "_11c81vhk _18u0pxbi _19pkpxbi _2hwxpxbi _otyr12x7 _syaz1gjq",
   viewProfileContainerStyles: "_4cvr1h6o _uwhke4h9 _15a5nqa1 _1i53muej _19bv1ejb _u5f31ejb",
   viewProfileButtonStyles: "_2rkoiti9 _189ee4h9 _1dqonqa1 _1h6dmuej _bfhksm61 _syaz1gjq _1bsb1osq _4t3i1ul9 _19pkpxbi"
 };
@@ -128,11 +129,10 @@ var TeamProfileCard = exports.TeamProfileCard = function TeamProfileCard(_ref3)
   })), description && /*#__PURE__*/_react.default.createElement(_compiled.Text, {
     color: "color.text",
     maxLines: 3
-  }, description)), (loading || hasOtherTeamConnections) && /*#__PURE__*/_react.default.createElement(_compiled.Stack, {
-    space: 'space.200',
+  }, description)), (loading || hasOtherTeamConnections) && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
     xcss: hasOtherTeamConnections ? styles.teamConnectionHeaderStyles : styles.teamConnectionContainerStyles
-  }, hasOtherTeamConnections && /*#__PURE__*/_react.default.createElement(_heading.default, {
-    size: "xxsmall"
+  }, hasOtherTeamConnections && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
+    xcss: styles.connectionTitleStyles
   }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, {
     defaultMessage: "Where we work",
     id: "people-and-teams.team-profile-card.team-connections"

package/dist/cjs/components/team-profile-card/team-connections/main.js

@@ -1,16 +1,21 @@
 /* main.tsx generated by @compiled/babel-plugin v0.36.1 */
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.TeamConnections = void 0;
 require("./main.compiled.css");
 var _runtime = require("@compiled/react/runtime");
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _menu = require("@atlaskit/menu");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _teamsPublic = require("@atlaskit/teams-public");
+var _analytics = require("../../../util/analytics");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+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 && {}.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; }
 var styles = {
   containerWrapperStyles: "_1e0c1txw _4cvr1h6o",
   containerIconStyles: "_2rkoiti9 _4t3i1tcg _1bsb1tcg",
@@ -19,12 +24,28 @@ var styles = {
 var TeamConnections = exports.TeamConnections = function TeamConnections(_ref) {
   var containerType = _ref.containerType,
     title = _ref.title,
-    containerIcon = _ref.containerIcon;
+    containerIcon = _ref.containerIcon,
+    link = _ref.link;
   var _getContainerProperti = (0, _teamsPublic.getContainerProperties)(containerType, 'medium'),
     description = _getContainerProperti.description,
     icon = _getContainerProperti.icon,
     containerTypeText = _getContainerProperti.containerTypeText;
-  return /*#__PURE__*/_react.default.createElement(_compiled.Inline, {
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  var onClick = (0, _react.useCallback)(function () {
+    (0, _analytics.fireEvent)(createAnalyticsEvent, {
+      action: 'clicked',
+      actionSubject: 'teamConnectionItem',
+      actionSubjectId: 'teamProfileCard',
+      attributes: {
+        container: containerType
+      }
+    });
+  }, [containerType, createAnalyticsEvent]);
+  return /*#__PURE__*/_react.default.createElement(_menu.LinkItem, {
+    href: link,
+    onClick: onClick
+  }, /*#__PURE__*/_react.default.createElement(_compiled.Inline, {
     space: "space.100",
     xcss: styles.containerWrapperStyles
   }, /*#__PURE__*/_react.default.createElement(_compiled.Box, {
@@ -48,5 +69,5 @@ var TeamConnections = exports.TeamConnections = function TeamConnections(_ref) {
     backgroundColor: 'color.background.neutral.subtle',
     xcss: styles.containerTypeIconButtonStyles,
     testId: "container-type-icon"
-  }, icon));
+  }, icon)));
 };

package/dist/cjs/util/analytics.js

@@ -45,7 +45,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
     actionSubjectId: actionSubjectId,
     attributes: _objectSpread(_objectSpread({
       packageName: "@atlaskit/profilecard",
-      packageVersion: "23.7.2"
+      packageVersion: "23.7.4"
     }, attributes), {}, {
       firedAt: Math.round((0, _performance.getPageTime)())
     })

package/dist/es2019/client/getOrgIdForCloudIdFromAGG.js

@@ -6,7 +6,7 @@ const ORG_ID_FROM_CLOUD_ID_QUERY = `query OrgIdFromCloudId($cloudId: ID!) {
 }`;
 const addHeaders = headers => {
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "23.7.2");
+  headers.append('atl-client-version', "23.7.4");
   return headers;
 };
 export async function getOrgIdForCloudIdFromAGG(url, cloudId) {

package/dist/es2019/client/getTeamFromAGG.js

@@ -75,7 +75,7 @@ export const addHeaders = headers => {
   headers.append('X-ExperimentalApi', 'teams-beta');
   headers.append('X-ExperimentalApi', 'team-members-beta');
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "23.7.2");
+  headers.append('atl-client-version', "23.7.4");
   return headers;
 };
 export async function getTeamFromAGG(url, teamId, siteId) {

package/dist/es2019/components/team-profile-card/main.compiled.css

@@ -1,13 +1,16 @@
-
+._11c81vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._2rkoiti9{border-radius:var(--ds-border-radius-100,4px)}
 ._2rkopd34{border-radius:var(--ds-border-radius-200,8px)}
 ._v564nm7n{transition:box-shadow .25s ease-in-out}
 ._189ee4h9{border-width:var(--ds-border-width,1px)}
 ._1dqonqa1{border-style:solid}
-._1h6dmuej{border-color:var(--ds-border,#091e4224)}._15a5nqa1{border-top-style:solid}
+._1h6dmuej{border-color:var(--ds-border,#091e4224)}
+._15a5nqa1{border-top-style:solid}
 ._18m915vq{overflow-y:hidden}
 ._18m91wug{overflow-y:auto}
 ._18u01ejb{margin-left:var(--ds-space-300,24px)}
+._18u0pxbi{margin-left:var(--ds-space-200,1pc)}
+._18u0u2gc{margin-left:var(--ds-space-100,8px)}
 ._19bv1ejb{padding-left:var(--ds-space-300,24px)}
 ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
 ._19pku2gc{margin-top:var(--ds-space-100,8px)}
@@ -18,6 +21,8 @@
 ._1reo15vq{overflow-x:hidden}
 ._1ul95x59{min-width:340px}
 ._2hwx1ejb{margin-right:var(--ds-space-300,24px)}
+._2hwxpxbi{margin-right:var(--ds-space-200,1pc)}
+._2hwxu2gc{margin-right:var(--ds-space-100,8px)}
 ._2lx21bp4{flex-direction:column}
 ._4cvr1h6o{align-items:center}
 ._4t3i1ul9{height:30px}
@@ -27,6 +32,7 @@
 ._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
 ._c71lx2si{max-height:265px}
 ._kqswstnw{position:absolute}
+._otyr12x7{margin-bottom:var(--ds-space-075,6px)}
 ._otyrpxbi{margin-bottom:var(--ds-space-200,1pc)}
 ._s7n4jp4b{vertical-align:top}
 ._syaz1gjq{color:var(--ds-text-subtle,#44546f)}

package/dist/es2019/components/team-profile-card/main.js

@@ -15,13 +15,14 @@ import { TeamConnections } from './team-connections/main';
 import { TeamContainersSkeleton } from './team-containers-skeleton';
 const noop = () => {};
 const styles = {
-  wrapperStyles: "_2rkopd34 _v564nm7n _1reo15vq _18m915vq _189ee4h9 _1dqonqa1 _1h6dmuej _1e0c1txw _2lx21bp4 _1bsb1gwv _1ul95x59 _4t3i1wug",
+  wrapperStyles: "_2rkopd34 _v564nm7n _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bsb1gwv _1ul95x59 _4t3i1wug",
   containerStyles: "_otyrpxbi",
   avatarImageStyles: "_kqswstnw _18u01ejb",
   headerImageStyles: "_5ral1dfr _s7n4jp4b _4t3i53f4 _1bsb1osq",
   teamInformationStyles: "_18u01ejb _19pku2gc _2hwx1ejb",
-  teamConnectionHeaderStyles: "_18u01ejb _19pkpxbi _2hwx1ejb _c71lx2si _18m91wug",
+  teamConnectionHeaderStyles: "_18u0u2gc _2hwxu2gc _c71lx2si _18m91wug",
   teamConnectionContainerStyles: "_18u01ejb _2hwx1ejb",
+  connectionTitleStyles: "_11c81vhk _18u0pxbi _19pkpxbi _2hwxpxbi _otyr12x7 _syaz1gjq",
   viewProfileContainerStyles: "_4cvr1h6o _uwhke4h9 _15a5nqa1 _1i53muej _19bv1ejb _u5f31ejb",
   viewProfileButtonStyles: "_2rkoiti9 _189ee4h9 _1dqonqa1 _1h6dmuej _bfhksm61 _syaz1gjq _1bsb1osq _4t3i1ul9 _19pkpxbi"
 };
@@ -115,11 +116,10 @@ export const TeamProfileCard = ({
   })), description && /*#__PURE__*/React.createElement(Text, {
     color: "color.text",
     maxLines: 3
-  }, description)), (loading || hasOtherTeamConnections) && /*#__PURE__*/React.createElement(Stack, {
-    space: 'space.200',
+  }, description)), (loading || hasOtherTeamConnections) && /*#__PURE__*/React.createElement(Box, {
     xcss: hasOtherTeamConnections ? styles.teamConnectionHeaderStyles : styles.teamConnectionContainerStyles
-  }, hasOtherTeamConnections && /*#__PURE__*/React.createElement(Heading, {
-    size: "xxsmall"
+  }, hasOtherTeamConnections && /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.connectionTitleStyles
   }, /*#__PURE__*/React.createElement(FormattedMessage, {
     defaultMessage: "Where we work",
     id: "people-and-teams.team-profile-card.team-connections"

package/dist/es2019/components/team-profile-card/team-connections/main.js

@@ -1,9 +1,12 @@
 /* main.tsx generated by @compiled/babel-plugin v0.36.1 */
 import "./main.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
-import React from 'react';
+import React, { useCallback } from 'react';
+import { useAnalyticsEvents } from '@atlaskit/analytics-next';
+import { LinkItem } from '@atlaskit/menu';
 import { Box, Inline, Stack, Text } from '@atlaskit/primitives/compiled';
 import { getContainerProperties } from '@atlaskit/teams-public';
+import { fireEvent } from '../../../util/analytics';
 const styles = {
   containerWrapperStyles: "_1e0c1txw _4cvr1h6o",
   containerIconStyles: "_2rkoiti9 _4t3i1tcg _1bsb1tcg",
@@ -12,14 +15,31 @@ const styles = {
 export const TeamConnections = ({
   containerType,
   title,
-  containerIcon
+  containerIcon,
+  link
 }) => {
   const {
     description,
     icon,
     containerTypeText
   } = getContainerProperties(containerType, 'medium');
-  return /*#__PURE__*/React.createElement(Inline, {
+  const {
+    createAnalyticsEvent
+  } = useAnalyticsEvents();
+  const onClick = useCallback(() => {
+    fireEvent(createAnalyticsEvent, {
+      action: 'clicked',
+      actionSubject: 'teamConnectionItem',
+      actionSubjectId: 'teamProfileCard',
+      attributes: {
+        container: containerType
+      }
+    });
+  }, [containerType, createAnalyticsEvent]);
+  return /*#__PURE__*/React.createElement(LinkItem, {
+    href: link,
+    onClick: onClick
+  }, /*#__PURE__*/React.createElement(Inline, {
     space: "space.100",
     xcss: styles.containerWrapperStyles
   }, /*#__PURE__*/React.createElement(Box, {
@@ -43,5 +63,5 @@ export const TeamConnections = ({
     backgroundColor: 'color.background.neutral.subtle',
     xcss: styles.containerTypeIconButtonStyles,
     testId: "container-type-icon"
-  }, icon));
+  }, icon)));
 };

package/dist/es2019/util/analytics.js

@@ -32,7 +32,7 @@ const createEvent = (eventType, action, actionSubject, actionSubjectId, attribut
   actionSubjectId,
   attributes: {
     packageName: "@atlaskit/profilecard",
-    packageVersion: "23.7.2",
+    packageVersion: "23.7.4",
     ...attributes,
     firedAt: Math.round(getPageTime())
   }

package/dist/esm/client/getOrgIdForCloudIdFromAGG.js

@@ -4,7 +4,7 @@ import { AGGQuery } from './graphqlUtils';
 var ORG_ID_FROM_CLOUD_ID_QUERY = "query OrgIdFromCloudId($cloudId: ID!) {\n\ttenantContexts(cloudIds: [$cloudId]) {\n\t\torgId\n\t}\n}";
 var addHeaders = function addHeaders(headers) {
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "23.7.2");
+  headers.append('atl-client-version', "23.7.4");
   return headers;
 };
 export function getOrgIdForCloudIdFromAGG(_x, _x2) {

package/dist/esm/client/getTeamFromAGG.js

@@ -57,7 +57,7 @@ export var addHeaders = function addHeaders(headers) {
   headers.append('X-ExperimentalApi', 'teams-beta');
   headers.append('X-ExperimentalApi', 'team-members-beta');
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "23.7.2");
+  headers.append('atl-client-version', "23.7.4");
   return headers;
 };
 export function getTeamFromAGG(_x, _x2, _x3) {

package/dist/esm/components/team-profile-card/main.compiled.css

@@ -1,13 +1,16 @@
-
+._11c81vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._2rkoiti9{border-radius:var(--ds-border-radius-100,4px)}
 ._2rkopd34{border-radius:var(--ds-border-radius-200,8px)}
 ._v564nm7n{transition:box-shadow .25s ease-in-out}
 ._189ee4h9{border-width:var(--ds-border-width,1px)}
 ._1dqonqa1{border-style:solid}
-._1h6dmuej{border-color:var(--ds-border,#091e4224)}._15a5nqa1{border-top-style:solid}
+._1h6dmuej{border-color:var(--ds-border,#091e4224)}
+._15a5nqa1{border-top-style:solid}
 ._18m915vq{overflow-y:hidden}
 ._18m91wug{overflow-y:auto}
 ._18u01ejb{margin-left:var(--ds-space-300,24px)}
+._18u0pxbi{margin-left:var(--ds-space-200,1pc)}
+._18u0u2gc{margin-left:var(--ds-space-100,8px)}
 ._19bv1ejb{padding-left:var(--ds-space-300,24px)}
 ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
 ._19pku2gc{margin-top:var(--ds-space-100,8px)}
@@ -18,6 +21,8 @@
 ._1reo15vq{overflow-x:hidden}
 ._1ul95x59{min-width:340px}
 ._2hwx1ejb{margin-right:var(--ds-space-300,24px)}
+._2hwxpxbi{margin-right:var(--ds-space-200,1pc)}
+._2hwxu2gc{margin-right:var(--ds-space-100,8px)}
 ._2lx21bp4{flex-direction:column}
 ._4cvr1h6o{align-items:center}
 ._4t3i1ul9{height:30px}
@@ -27,6 +32,7 @@
 ._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
 ._c71lx2si{max-height:265px}
 ._kqswstnw{position:absolute}
+._otyr12x7{margin-bottom:var(--ds-space-075,6px)}
 ._otyrpxbi{margin-bottom:var(--ds-space-200,1pc)}
 ._s7n4jp4b{vertical-align:top}
 ._syaz1gjq{color:var(--ds-text-subtle,#44546f)}

package/dist/esm/components/team-profile-card/main.js

@@ -15,13 +15,14 @@ import { TeamConnections } from './team-connections/main';
 import { TeamContainersSkeleton } from './team-containers-skeleton';
 var noop = function noop() {};
 var styles = {
-  wrapperStyles: "_2rkopd34 _v564nm7n _1reo15vq _18m915vq _189ee4h9 _1dqonqa1 _1h6dmuej _1e0c1txw _2lx21bp4 _1bsb1gwv _1ul95x59 _4t3i1wug",
+  wrapperStyles: "_2rkopd34 _v564nm7n _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bsb1gwv _1ul95x59 _4t3i1wug",
   containerStyles: "_otyrpxbi",
   avatarImageStyles: "_kqswstnw _18u01ejb",
   headerImageStyles: "_5ral1dfr _s7n4jp4b _4t3i53f4 _1bsb1osq",
   teamInformationStyles: "_18u01ejb _19pku2gc _2hwx1ejb",
-  teamConnectionHeaderStyles: "_18u01ejb _19pkpxbi _2hwx1ejb _c71lx2si _18m91wug",
+  teamConnectionHeaderStyles: "_18u0u2gc _2hwxu2gc _c71lx2si _18m91wug",
   teamConnectionContainerStyles: "_18u01ejb _2hwx1ejb",
+  connectionTitleStyles: "_11c81vhk _18u0pxbi _19pkpxbi _2hwxpxbi _otyr12x7 _syaz1gjq",
   viewProfileContainerStyles: "_4cvr1h6o _uwhke4h9 _15a5nqa1 _1i53muej _19bv1ejb _u5f31ejb",
   viewProfileButtonStyles: "_2rkoiti9 _189ee4h9 _1dqonqa1 _1h6dmuej _bfhksm61 _syaz1gjq _1bsb1osq _4t3i1ul9 _19pkpxbi"
 };
@@ -118,11 +119,10 @@ export var TeamProfileCard = function TeamProfileCard(_ref3) {
   })), description && /*#__PURE__*/React.createElement(Text, {
     color: "color.text",
     maxLines: 3
-  }, description)), (loading || hasOtherTeamConnections) && /*#__PURE__*/React.createElement(Stack, {
-    space: 'space.200',
+  }, description)), (loading || hasOtherTeamConnections) && /*#__PURE__*/React.createElement(Box, {
     xcss: hasOtherTeamConnections ? styles.teamConnectionHeaderStyles : styles.teamConnectionContainerStyles
-  }, hasOtherTeamConnections && /*#__PURE__*/React.createElement(Heading, {
-    size: "xxsmall"
+  }, hasOtherTeamConnections && /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.connectionTitleStyles
   }, /*#__PURE__*/React.createElement(FormattedMessage, {
     defaultMessage: "Where we work",
     id: "people-and-teams.team-profile-card.team-connections"

package/dist/esm/components/team-profile-card/team-connections/main.js

@@ -1,9 +1,12 @@
 /* main.tsx generated by @compiled/babel-plugin v0.36.1 */
 import "./main.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
-import React from 'react';
+import React, { useCallback } from 'react';
+import { useAnalyticsEvents } from '@atlaskit/analytics-next';
+import { LinkItem } from '@atlaskit/menu';
 import { Box, Inline, Stack, Text } from '@atlaskit/primitives/compiled';
 import { getContainerProperties } from '@atlaskit/teams-public';
+import { fireEvent } from '../../../util/analytics';
 var styles = {
   containerWrapperStyles: "_1e0c1txw _4cvr1h6o",
   containerIconStyles: "_2rkoiti9 _4t3i1tcg _1bsb1tcg",
@@ -12,12 +15,28 @@ var styles = {
 export var TeamConnections = function TeamConnections(_ref) {
   var containerType = _ref.containerType,
     title = _ref.title,
-    containerIcon = _ref.containerIcon;
+    containerIcon = _ref.containerIcon,
+    link = _ref.link;
   var _getContainerProperti = getContainerProperties(containerType, 'medium'),
     description = _getContainerProperti.description,
     icon = _getContainerProperti.icon,
     containerTypeText = _getContainerProperti.containerTypeText;
-  return /*#__PURE__*/React.createElement(Inline, {
+  var _useAnalyticsEvents = useAnalyticsEvents(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  var onClick = useCallback(function () {
+    fireEvent(createAnalyticsEvent, {
+      action: 'clicked',
+      actionSubject: 'teamConnectionItem',
+      actionSubjectId: 'teamProfileCard',
+      attributes: {
+        container: containerType
+      }
+    });
+  }, [containerType, createAnalyticsEvent]);
+  return /*#__PURE__*/React.createElement(LinkItem, {
+    href: link,
+    onClick: onClick
+  }, /*#__PURE__*/React.createElement(Inline, {
     space: "space.100",
     xcss: styles.containerWrapperStyles
   }, /*#__PURE__*/React.createElement(Box, {
@@ -41,5 +60,5 @@ export var TeamConnections = function TeamConnections(_ref) {
     backgroundColor: 'color.background.neutral.subtle',
     xcss: styles.containerTypeIconButtonStyles,
     testId: "container-type-icon"
-  }, icon));
+  }, icon)));
 };

package/dist/esm/util/analytics.js

@@ -39,7 +39,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
     actionSubjectId: actionSubjectId,
     attributes: _objectSpread(_objectSpread({
       packageName: "@atlaskit/profilecard",
-      packageVersion: "23.7.2"
+      packageVersion: "23.7.4"
     }, attributes), {}, {
       firedAt: Math.round(getPageTime())
     })

package/dist/types/components/team-profile-card/team-connections/main.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { type LinkedContainerCardProps } from '@atlaskit/teams-public';
-export declare const TeamConnections: ({ containerType, title, containerIcon, }: LinkedContainerCardProps) => React.JSX.Element;
+export declare const TeamConnections: ({ containerType, title, containerIcon, link, }: LinkedContainerCardProps) => React.JSX.Element;

package/dist/types-ts4.5/components/team-profile-card/team-connections/main.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { type LinkedContainerCardProps } from '@atlaskit/teams-public';
-export declare const TeamConnections: ({ containerType, title, containerIcon, }: LinkedContainerCardProps) => React.JSX.Element;
+export declare const TeamConnections: ({ containerType, title, containerIcon, link, }: LinkedContainerCardProps) => React.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/profilecard",
-	"version": "23.7.2",
+	"version": "23.7.4",
 	"description": "A React component to display a card with user information.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -54,7 +54,7 @@
 		"@atlaskit/atlassian-context": "^0.2.0",
 		"@atlaskit/avatar": "^25.0.0",
 		"@atlaskit/avatar-group": "^12.0.0",
-		"@atlaskit/button": "^21.1.0",
+		"@atlaskit/button": "^22.0.0",
 		"@atlaskit/css": "^0.10.0",
 		"@atlaskit/dropdown-menu": "^13.0.0",
 		"@atlaskit/empty-state": "^9.0.0",
@@ -64,14 +64,14 @@
 		"@atlaskit/icon": "^25.2.0",
 		"@atlaskit/logo": "^16.0.0",
 		"@atlaskit/lozenge": "^12.2.0",
-		"@atlaskit/menu": "^3.1.0",
+		"@atlaskit/menu": "^3.2.0",
 		"@atlaskit/modal-dialog": "^14.0.0",
 		"@atlaskit/people-teams-ui-public": "^3.1.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/popup": "^3.0.0",
 		"@atlaskit/primitives": "^14.2.0",
 		"@atlaskit/rovo-agent-components": "^2.3.0",
-		"@atlaskit/rovo-triggers": "^2.7.0",
+		"@atlaskit/rovo-triggers": "^2.9.0",
 		"@atlaskit/spinner": "^18.0.0",
 		"@atlaskit/teams-avatar": "^2.3.0",
 		"@atlaskit/teams-public": "^0.23.0",