@atlaskit/smart-card 26.41.3 → 26.42.1

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/smart-card
 
+## 26.42.1
+
+### Patch Changes
+
+- [#42773](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/42773) [`d2ff4012e8d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d2ff4012e8d) - [ux] fire additional analytics events within smart-card forbidden views
+
+## 26.42.0
+
+### Minor Changes
+
+- [#42696](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/42696) [`6191f76a929`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6191f76a929) - Adds analytics for related links
+
 ## 26.41.3
 
 ### Patch Changes

package/dist/cjs/extractors/common/context/extractAccessContext.js

@@ -9,6 +9,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _messages = require("../../../messages");
 var _ForbiddenAction = require("../../../view/BlockCard/actions/ForbiddenAction");
 var _extractHostname = _interopRequireDefault(require("../hostname/extractHostname"));
+var _analytics = require("../../../utils/analytics");
 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; }
 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) { (0, _defineProperty2.default)(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; }
 var extractRequestAccessContext = exports.extractRequestAccessContext = function extractRequestAccessContext(_ref) {
@@ -57,7 +58,8 @@ var extractRequestAccessContextImproved = exports.extractRequestAccessContextImp
   var _jsonLd$requestAccess2;
   var jsonLd = _ref2.jsonLd,
     url = _ref2.url,
-    product = _ref2.product;
+    product = _ref2.product,
+    createAnalyticsEvent = _ref2.createAnalyticsEvent;
   var requestAccess = jsonLd !== null && jsonLd !== void 0 && jsonLd.requestAccess ? _objectSpread(_objectSpread({}, jsonLd === null || jsonLd === void 0 ? void 0 : jsonLd.requestAccess), {}, {
     hostname: (0, _extractHostname.default)(url)
   }) : undefined;
@@ -68,7 +70,13 @@ var extractRequestAccessContextImproved = exports.extractRequestAccessContextImp
         descriptiveMessageKey: 'direct_access_description_crossjoin',
         callToActionMessageKey: 'direct_access_crossjoin',
         action: (0, _ForbiddenAction.ForbiddenAction)(function () {
-          return window.open(url);
+          createAnalyticsEvent({
+            action: 'clicked',
+            actionSubject: 'button',
+            actionSubjectId: 'crossJoin',
+            eventType: 'ui'
+          }).fire(_analytics.ANALYTICS_CHANNEL);
+          window.open(url);
         }, 'direct_access', _messages.messages.direct_access_crossjoin, {
           product: product
         })
@@ -79,7 +87,13 @@ var extractRequestAccessContextImproved = exports.extractRequestAccessContextImp
         descriptiveMessageKey: 'request_access_description_crossjoin',
         callToActionMessageKey: 'request_access_crossjoin',
         action: (0, _ForbiddenAction.ForbiddenAction)(function () {
-          return window.open(url);
+          createAnalyticsEvent({
+            action: 'clicked',
+            actionSubject: 'button',
+            actionSubjectId: 'requestAccess',
+            eventType: 'ui'
+          }).fire(_analytics.ANALYTICS_CHANNEL);
+          window.open(url);
         }, 'request_access', _messages.messages.request_access_crossjoin)
       });
     case 'PENDING_REQUEST_EXISTS':
@@ -109,7 +123,13 @@ var extractRequestAccessContextImproved = exports.extractRequestAccessContextImp
         descriptiveMessageKey: 'access_exists_description_crossjoin',
         callToActionMessageKey: 'request_access_crossjoin',
         action: (0, _ForbiddenAction.ForbiddenAction)(function () {
-          return window.open(url);
+          createAnalyticsEvent({
+            action: 'clicked',
+            actionSubject: 'button',
+            actionSubjectId: 'requestAccess',
+            eventType: 'ui'
+          }).fire(_analytics.ANALYTICS_CHANNEL);
+          window.open(url);
         }, 'access_exists', _messages.messages.request_access_crossjoin)
       });
     case 'FORBIDDEN':

package/dist/cjs/utils/analytics/analytics.js

@@ -22,7 +22,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
 var context = exports.context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.41.3"
+  packageVersion: "26.42.1"
 };
 var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/cjs/view/BlockCard/views/flexible/FlexibleForbiddenView.js

@@ -23,6 +23,7 @@ var _withFlexibleUIBlockCardStyle = require("./utils/withFlexibleUIBlockCardStyl
 var _extractAccessContext = require("../../../../extractors/common/context/extractAccessContext");
 var _reactIntlNext = require("react-intl-next");
 var _extractHostname = _interopRequireDefault(require("../../../../extractors/common/hostname/extractHostname"));
+var _analyticsNext = require("@atlaskit/analytics-next");
 var _excluded = ["testId"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -38,6 +39,8 @@ var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
   var _ref$testId = _ref.testId,
     testId = _ref$testId === void 0 ? 'smart-block-forbidden-view' : _ref$testId,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var intl = (0, _reactIntlNext.useIntl)();
   var cardState = props.cardState,
     onAuthorize = props.onAuthorize,
@@ -57,9 +60,10 @@ var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
     return (0, _extractAccessContext.extractRequestAccessContextImproved)({
       jsonLd: cardMetadata,
       url: url,
-      product: providerName
+      product: providerName,
+      createAnalyticsEvent: createAnalyticsEvent
     });
-  }, [cardMetadata, providerName, url]);
+  }, [cardMetadata, providerName, url, createAnalyticsEvent]);
   var title = (0, _react.useMemo)(function () {
     var descriptor = (0, _intlUtils.toMessage)(_messages.messages.invalid_permissions, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.titleMessageKey);
     return intl.formatMessage(descriptor, {

package/dist/cjs/view/EmbedCard/index.js

@@ -25,6 +25,7 @@ var _ErroredView = require("./views/ErroredView");
 var _forbiddenView = _interopRequireDefault(require("./views/forbidden-view"));
 var _notFoundView = _interopRequireDefault(require("./views/not-found-view"));
 var _unauthorizedView = _interopRequireDefault(require("./views/unauthorized-view"));
+var _analyticsNext = require("@atlaskit/analytics-next");
 var EmbedCard = exports.EmbedCard = /*#__PURE__*/_react.default.forwardRef(function (_ref, iframeRef) {
   var _details$meta, _forbiddenViewProps$c3;
   var url = _ref.url,
@@ -48,6 +49,8 @@ var EmbedCard = exports.EmbedCard = /*#__PURE__*/_react.default.forwardRef(funct
     onIframeDwell = _ref.onIframeDwell,
     onIframeFocus = _ref.onIframeFocus,
     iframeUrlType = _ref.iframeUrlType;
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var data = details && details.data || (0, _jsonld.getEmptyJsonLd)();
   var meta = details && details.meta;
   var extensionKey = (0, _helpers.getExtensionKey)(details);
@@ -157,7 +160,8 @@ var EmbedCard = exports.EmbedCard = /*#__PURE__*/_react.default.forwardRef(funct
         var accessContext = (0, _extractAccessContext.extractRequestAccessContextImproved)({
           jsonLd: cardMetadata,
           url: url,
-          product: (_forbiddenViewProps$c = (_forbiddenViewProps$c2 = forbiddenViewProps.context) === null || _forbiddenViewProps$c2 === void 0 ? void 0 : _forbiddenViewProps$c2.text) !== null && _forbiddenViewProps$c !== void 0 ? _forbiddenViewProps$c : ''
+          product: (_forbiddenViewProps$c = (_forbiddenViewProps$c2 = forbiddenViewProps.context) === null || _forbiddenViewProps$c2 === void 0 ? void 0 : _forbiddenViewProps$c2.text) !== null && _forbiddenViewProps$c !== void 0 ? _forbiddenViewProps$c : '',
+          createAnalyticsEvent: createAnalyticsEvent
         });
         return /*#__PURE__*/_react.default.createElement(_forbiddenView.default, {
           context: forbiddenViewProps.context,
@@ -194,7 +198,8 @@ var EmbedCard = exports.EmbedCard = /*#__PURE__*/_react.default.forwardRef(funct
         var _accessContext = details !== null && details !== void 0 && details.meta ? (0, _extractAccessContext.extractRequestAccessContextImproved)({
           jsonLd: details === null || details === void 0 ? void 0 : details.meta,
           url: url,
-          product: (_notFoundViewProps$co = (_notFoundViewProps$co2 = notFoundViewProps.context) === null || _notFoundViewProps$co2 === void 0 ? void 0 : _notFoundViewProps$co2.text) !== null && _notFoundViewProps$co !== void 0 ? _notFoundViewProps$co : ''
+          product: (_notFoundViewProps$co = (_notFoundViewProps$co2 = notFoundViewProps.context) === null || _notFoundViewProps$co2 === void 0 ? void 0 : _notFoundViewProps$co2.text) !== null && _notFoundViewProps$co !== void 0 ? _notFoundViewProps$co : '',
+          createAnalyticsEvent: createAnalyticsEvent
         }) : undefined;
         return /*#__PURE__*/_react.default.createElement(_notFoundView.default, {
           context: notFoundViewProps.context,

package/dist/cjs/view/FlexibleCard/components/blocks/related-urls-block/analytics.js

@@ -0,0 +1,30 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.fireRelatedLinksLoadedEvent = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _analytics = require("../../../../../utils/analytics");
+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; }
+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) { (0, _defineProperty2.default)(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; }
+var createTrackRelatedLinksLoadedEventPayload = function createTrackRelatedLinksLoadedEventPayload(_ref) {
+  var relatedLinksCount = _ref.relatedLinksCount;
+  return {
+    action: 'loaded',
+    actionSubject: 'relatedLinks',
+    eventType: 'track',
+    attributes: {
+      relatedLinksCount: relatedLinksCount
+    }
+  };
+};
+var fireRelatedLinksLoadedEvent = exports.fireRelatedLinksLoadedEvent = function fireRelatedLinksLoadedEvent(createAnalyticsEvent) {
+  return function (attributes) {
+    var payload = createTrackRelatedLinksLoadedEventPayload(attributes);
+    if (payload) {
+      createAnalyticsEvent(_objectSpread({}, payload)).fire(_analytics.ANALYTICS_CHANNEL);
+    }
+  };
+};

package/dist/cjs/view/FlexibleCard/components/blocks/related-urls-block/index.js

@@ -15,10 +15,12 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireWildcard(require("react"));
 var _reactMagneticDi = require("react-magnetic-di");
 var _react2 = require("@emotion/react");
+var _analyticsNext = require("@atlaskit/analytics-next");
 var _useRelatedUrls = _interopRequireDefault(require("../../../../../state/hooks/use-related-urls"));
 var _errored = require("./errored");
 var _resolved = require("./resolved");
 var _resolving = require("./resolving");
+var _analytics = require("./analytics");
 var _templateObject;
 var _excluded = ["testId", "url", "renderers"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -32,6 +34,8 @@ var RelatedUrlsBlock = function RelatedUrlsBlock(_ref) {
     url = _ref.url,
     renderers = _ref.renderers,
     blockProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var _useState = (0, _react.useState)(true),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     loadingRelatedUrls = _useState2[0],
@@ -48,7 +52,7 @@ var RelatedUrlsBlock = function RelatedUrlsBlock(_ref) {
   (0, _react.useEffect)(function () {
     var fetchRelatedUrls = /*#__PURE__*/function () {
       var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
-        var relUrls;
+        var _relUrls$resolvedResu, _relUrls$resolvedResu2, relUrls;
         return _regenerator.default.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
@@ -58,26 +62,33 @@ var RelatedUrlsBlock = function RelatedUrlsBlock(_ref) {
             case 3:
               relUrls = _context.sent;
               setRelatedUrls(relUrls);
-              _context.next = 10;
+
+              /**
+               * Fire TrackRelatedLinksLoadedEvent
+               */
+              (0, _analytics.fireRelatedLinksLoadedEvent)(createAnalyticsEvent)({
+                relatedLinksCount: (_relUrls$resolvedResu = (_relUrls$resolvedResu2 = relUrls.resolvedResults) === null || _relUrls$resolvedResu2 === void 0 ? void 0 : _relUrls$resolvedResu2.length) !== null && _relUrls$resolvedResu !== void 0 ? _relUrls$resolvedResu : 0
+              });
+              _context.next = 11;
               break;
-            case 7:
-              _context.prev = 7;
+            case 8:
+              _context.prev = 8;
               _context.t0 = _context["catch"](0);
               setErr(_context.t0);
-            case 10:
-              setLoadingRelatedUrls(false);
             case 11:
+              setLoadingRelatedUrls(false);
+            case 12:
             case "end":
               return _context.stop();
           }
-        }, _callee, null, [[0, 7]]);
+        }, _callee, null, [[0, 8]]);
       }));
       return function fetchRelatedUrls() {
         return _ref2.apply(this, arguments);
       };
     }();
     fetchRelatedUrls();
-  }, [getRelatedUrls, url]);
+  }, [createAnalyticsEvent, getRelatedUrls, url]);
   if (loadingRelatedUrls) {
     return /*#__PURE__*/_react.default.createElement(_resolving.RelatedUrlsBlockResolvingView, (0, _extends2.default)({
       testId: "".concat(testId, "-resolving-view")

package/dist/cjs/view/FlexibleCard/components/blocks/related-urls-block/resolved/related-url-list/index.js

@@ -17,7 +17,7 @@ var _react2 = require("@emotion/react");
 var _messages = require("../../../../../../../messages");
 var _utils = require("../../../../../components/utils");
 var _text = _interopRequireDefault(require("../../../../elements/text"));
-var _relatedUrlItem = _interopRequireDefault(require("./related-url-item"));
+var _resolvedResultStack = _interopRequireDefault(require("./resolved-result-stack"));
 var _templateObject;
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -36,19 +36,6 @@ var RelatedUrlList = function RelatedUrlList(_ref) {
   }, [isOpen]);
   var ChevronComponent = isOpen ? _chevronUp.default : _chevronDown.default;
   var intl = (0, _reactIntlNext.useIntl)();
-  var resolvedResultsStack = (0, _react.useMemo)(function () {
-    return /*#__PURE__*/_react.default.createElement(_primitives.Stack, {
-      space: "space.050",
-      testId: "".concat(testId, "-items-wrapper")
-    }, resolvedResults.map(function (resolvedResults, idx) {
-      return /*#__PURE__*/_react.default.createElement(_relatedUrlItem.default, {
-        testId: "".concat(testId, "-item"),
-        key: idx,
-        results: resolvedResults,
-        renderers: renderers
-      });
-    }));
-  }, [renderers, resolvedResults, testId]);
   return resolvedResults.length > 0 ? /*#__PURE__*/_react.default.createElement(_primitives.Stack, {
     testId: testId,
     xcss: (0, _primitives.xcss)({
@@ -56,7 +43,11 @@ var RelatedUrlList = function RelatedUrlList(_ref) {
     })
   }, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
     onClick: chevronClickHandler,
-    testId: "".concat(testId, "-expand-title")
+    testId: "".concat(testId, "-expand-title"),
+    as: "button",
+    backgroundColor: "color.background.neutral.subtle",
+    "aria-expanded": !!isOpen,
+    padding: "space.0"
   }, /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
     alignBlock: "center",
     spread: "space-between"
@@ -68,7 +59,11 @@ var RelatedUrlList = function RelatedUrlList(_ref) {
   }), /*#__PURE__*/_react.default.createElement(ChevronComponent, {
     label: (0, _utils.getFormattedMessageAsString)(intl, title),
     size: 'medium'
-  }))), isOpen && resolvedResultsStack) : /*#__PURE__*/_react.default.createElement(_text.default, {
+  }))), isOpen && /*#__PURE__*/_react.default.createElement(_resolvedResultStack.default, {
+    resolvedResults: resolvedResults,
+    testId: testId,
+    renderers: renderers
+  })) : /*#__PURE__*/_react.default.createElement(_text.default, {
     testId: testId,
     message: {
       descriptor: _messages.messages.related_work_items_not_found

package/dist/cjs/view/FlexibleCard/components/blocks/related-urls-block/resolved/related-url-list/related-url-item/index.js

@@ -9,22 +9,29 @@ exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
 var _primitives = require("@atlaskit/primitives");
+var _analyticsNext = require("@atlaskit/analytics-next");
 var _constants = require("../../../../../../../../constants");
 var _flexible = _interopRequireDefault(require("../../../../../../../../extractors/flexible"));
 var _icon = _interopRequireDefault(require("../../../../../elements/icon"));
 var _link = _interopRequireDefault(require("../../../../../elements/link"));
+var _click = require("../../../../../../../../utils/analytics/click");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var RelatedUrlItem = function RelatedUrlItem(_ref) {
   var results = _ref.results,
     renderers = _ref.renderers,
     testId = _ref.testId;
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var flexibleDataContext = (0, _react.useMemo)(function () {
     return (0, _flexible.default)({
       response: results,
       renderers: renderers
     });
   }, [renderers, results]);
+  var onClick = (0, _react.useCallback)(function (event) {
+    (0, _click.fireLinkClickedEvent)(createAnalyticsEvent)(event);
+  }, [createAnalyticsEvent]);
   return /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
     alignBlock: "center",
     space: "space.050",
@@ -37,7 +44,8 @@ var RelatedUrlItem = function RelatedUrlItem(_ref) {
     text: flexibleDataContext === null || flexibleDataContext === void 0 ? void 0 : flexibleDataContext.title,
     url: flexibleDataContext === null || flexibleDataContext === void 0 ? void 0 : flexibleDataContext.url,
     size: _constants.SmartLinkSize.Small,
-    maxLines: 1
+    maxLines: 1,
+    onClick: onClick
   }));
 };
 var _default = exports.default = RelatedUrlItem;

package/dist/cjs/view/FlexibleCard/components/blocks/related-urls-block/resolved/related-url-list/resolved-result-stack/analytics.js

@@ -0,0 +1,51 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.fireRelatedLinksViewedEvent = exports.RelatedUrlItemAnalyticsContext = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _resolvedAttributes = require("@atlaskit/link-analytics/resolved-attributes");
+var _analytics = require("../../../../../../../../utils/analytics");
+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; }
+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) { (0, _defineProperty2.default)(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; }
+var createUiRelatedLinksViewedEventPayload = function createUiRelatedLinksViewedEventPayload(_ref) {
+  var relatedLinksCount = _ref.relatedLinksCount;
+  return {
+    action: 'viewed',
+    actionSubject: 'relatedLinks',
+    eventType: 'ui',
+    attributes: {
+      relatedLinksCount: relatedLinksCount
+    }
+  };
+};
+var fireRelatedLinksViewedEvent = exports.fireRelatedLinksViewedEvent = function fireRelatedLinksViewedEvent(createAnalyticsEvent) {
+  return function (attributes) {
+    var payload = createUiRelatedLinksViewedEventPayload(attributes);
+    if (payload) {
+      createAnalyticsEvent(_objectSpread({}, payload)).fire(_analytics.ANALYTICS_CHANNEL);
+    }
+  };
+};
+var RelatedUrlItemAnalyticsContext = exports.RelatedUrlItemAnalyticsContext = function RelatedUrlItemAnalyticsContext(props) {
+  var children = props.children,
+    details = props.details;
+
+  /**
+   * We don't really need the `url` to get the attributes here so set
+   * it to an empty string to just make typescript happy
+   */
+  var attributes = (0, _resolvedAttributes.getResolvedAttributes)({
+    url: ''
+  }, details);
+  return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
+    data: {
+      attributes: attributes,
+      component: 'relatedLink'
+    }
+  }, children);
+};

package/dist/cjs/view/FlexibleCard/components/blocks/related-urls-block/resolved/related-url-list/resolved-result-stack/index.js

@@ -0,0 +1,54 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _primitives = require("@atlaskit/primitives");
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _relatedUrlItem = _interopRequireDefault(require("../related-url-item"));
+var _analytics = require("./analytics");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var ResolvedResultsStack = function ResolvedResultsStack(_ref) {
+  var resolvedResults = _ref.resolvedResults,
+    testId = _ref.testId,
+    renderers = _ref.renderers;
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  (0, _react.useEffect)(function () {
+    // This event will fire each time the component is loaded
+    (0, _analytics.fireRelatedLinksViewedEvent)(createAnalyticsEvent)({
+      relatedLinksCount: resolvedResults.length
+    });
+  }, [resolvedResults.length, createAnalyticsEvent]);
+  return /*#__PURE__*/_react.default.createElement(_primitives.Stack, {
+    space: "space.050",
+    testId: "".concat(testId, "-items-wrapper"),
+    as: "ul",
+    xcss: (0, _primitives.xcss)({
+      paddingLeft: '0px',
+      marginTop: '0px'
+    })
+  }, resolvedResults.map(function (resolvedResults, idx) {
+    return /*#__PURE__*/_react.default.createElement(_analytics.RelatedUrlItemAnalyticsContext, {
+      details: resolvedResults,
+      key: idx
+    }, /*#__PURE__*/_react.default.createElement(_relatedUrlItem.default, {
+      testId: "".concat(testId, "-item"),
+      results: resolvedResults,
+      renderers: renderers
+    }));
+  }));
+};
+var ResolvedResultsStackWithAnalytics = function ResolvedResultsStackWithAnalytics(props) {
+  return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
+    data: {
+      component: 'relatedLinksSection'
+    }
+  }, /*#__PURE__*/_react.default.createElement(ResolvedResultsStack, props));
+};
+var _default = exports.default = ResolvedResultsStackWithAnalytics;

package/dist/cjs/view/FlexibleCard/components/blocks/related-urls-block/resolved/related-url-list/resolved-result-stack/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/view/FlexibleCard/components/blocks/related-urls-block/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/view/HoverCard/components/views/forbidden/index.js

@@ -17,11 +17,14 @@ var _styled = require("./styled");
 var _styled2 = require("../../../styled");
 var _extractAccessContext = require("../../../../../extractors/common/context/extractAccessContext");
 var _extractHostname = _interopRequireDefault(require("../../../../../extractors/common/hostname/extractHostname"));
+var _analyticsNext = require("@atlaskit/analytics-next");
 var HoverCardForbiddenView = function HoverCardForbiddenView(_ref) {
   var _cardState$details, _cardState$details2, _extractProvider$text, _extractProvider, _extractRequestAccess;
   var flexibleCardProps = _ref.flexibleCardProps,
     _ref$testId = _ref.testId,
     testId = _ref$testId === void 0 ? 'hover-card-forbidden-view' : _ref$testId;
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var cardState = flexibleCardProps.cardState,
     url = flexibleCardProps.url;
   var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
@@ -31,7 +34,8 @@ var HoverCardForbiddenView = function HoverCardForbiddenView(_ref) {
   var _ref2 = (_extractRequestAccess = (0, _extractAccessContext.extractRequestAccessContextImproved)({
       jsonLd: meta,
       url: url,
-      product: product
+      product: product,
+      createAnalyticsEvent: createAnalyticsEvent
     })) !== null && _extractRequestAccess !== void 0 ? _extractRequestAccess : {},
     action = _ref2.action,
     descriptiveMessageKey = _ref2.descriptiveMessageKey,
@@ -62,9 +66,9 @@ var HoverCardForbiddenView = function HoverCardForbiddenView(_ref) {
       hostname: hostname
     }
   }))), action && /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, {
-    overrideCss: _styled.connectButtonStyles,
-    testId: "".concat(testId, "-button")
+    overrideCss: _styled.connectButtonStyles
   }, /*#__PURE__*/_react.default.createElement(_button.default, {
+    testId: "".concat(testId, "-button"),
     onClick: action === null || action === void 0 ? void 0 : action.promise,
     appearance: "primary",
     isDisabled: buttonDisabled

package/dist/cjs/view/LinkUrl/index.js

@@ -18,7 +18,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId"],
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.41.3",
+  packageVersion: "26.42.1",
   componentName: 'linkUrl'
 };
 var Link = (0, _click.withLinkClickedEvent)('a');

package/dist/cjs/view/RedesignedInlineCard/index.js

@@ -51,6 +51,7 @@ var _linkExtractors = require("@atlaskit/link-extractors");
 var _linkProvider = require("@atlaskit/link-provider");
 var _helpers = require("../../state/helpers");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _analyticsNext = require("@atlaskit/analytics-next");
 var InlineCard = exports.InlineCard = function InlineCard(_ref) {
   var _details$meta, _providerForbidden$te;
   var analytics = _ref.analytics,
@@ -68,6 +69,8 @@ var InlineCard = exports.InlineCard = function InlineCard(_ref) {
     showHoverPreview = _ref.showHoverPreview,
     showAuthTooltip = _ref.showAuthTooltip,
     showServerActions = _ref.showServerActions;
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var status = cardState.status,
     details = cardState.details;
   var cardDetails = details && details.data || (0, _jsonld.getEmptyJsonLd)();
@@ -137,7 +140,8 @@ var InlineCard = exports.InlineCard = function InlineCard(_ref) {
       var requestAccessContext = (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.cross-join') ? (0, _extractAccessContext.extractRequestAccessContextImproved)({
         jsonLd: cardMetadata,
         url: url,
-        product: (_providerForbidden$te = providerForbidden === null || providerForbidden === void 0 ? void 0 : providerForbidden.text) !== null && _providerForbidden$te !== void 0 ? _providerForbidden$te : ''
+        product: (_providerForbidden$te = providerForbidden === null || providerForbidden === void 0 ? void 0 : providerForbidden.text) !== null && _providerForbidden$te !== void 0 ? _providerForbidden$te : '',
+        createAnalyticsEvent: createAnalyticsEvent
       }) : (0, _context.extractRequestAccessContext)({
         jsonLd: cardMetadata,
         url: url,

package/dist/es2019/extractors/common/context/extractAccessContext.js

@@ -1,6 +1,7 @@
 import { messages } from '../../../messages';
 import { ForbiddenAction } from '../../../view/BlockCard/actions/ForbiddenAction';
 import extractHostname from '../hostname/extractHostname';
+import { ANALYTICS_CHANNEL } from '../../../utils/analytics';
 export const extractRequestAccessContext = ({
   jsonLd,
   url,
@@ -48,7 +49,8 @@ export const extractRequestAccessContext = ({
 export const extractRequestAccessContextImproved = ({
   jsonLd,
   url,
-  product
+  product,
+  createAnalyticsEvent
 }) => {
   var _jsonLd$requestAccess2;
   const requestAccess = jsonLd !== null && jsonLd !== void 0 && jsonLd.requestAccess ? {
@@ -62,7 +64,15 @@ export const extractRequestAccessContextImproved = ({
         titleMessageKey: 'direct_access_title_crossjoin',
         descriptiveMessageKey: 'direct_access_description_crossjoin',
         callToActionMessageKey: 'direct_access_crossjoin',
-        action: ForbiddenAction(() => window.open(url), 'direct_access', messages.direct_access_crossjoin, {
+        action: ForbiddenAction(() => {
+          createAnalyticsEvent({
+            action: 'clicked',
+            actionSubject: 'button',
+            actionSubjectId: 'crossJoin',
+            eventType: 'ui'
+          }).fire(ANALYTICS_CHANNEL);
+          window.open(url);
+        }, 'direct_access', messages.direct_access_crossjoin, {
           product
         })
       };
@@ -72,7 +82,15 @@ export const extractRequestAccessContextImproved = ({
         titleMessageKey: 'default_no_access_title_crossjoin',
         descriptiveMessageKey: 'request_access_description_crossjoin',
         callToActionMessageKey: 'request_access_crossjoin',
-        action: ForbiddenAction(() => window.open(url), 'request_access', messages.request_access_crossjoin)
+        action: ForbiddenAction(() => {
+          createAnalyticsEvent({
+            action: 'clicked',
+            actionSubject: 'button',
+            actionSubjectId: 'requestAccess',
+            eventType: 'ui'
+          }).fire(ANALYTICS_CHANNEL);
+          window.open(url);
+        }, 'request_access', messages.request_access_crossjoin)
       };
     case 'PENDING_REQUEST_EXISTS':
       return {
@@ -102,7 +120,15 @@ export const extractRequestAccessContextImproved = ({
         titleMessageKey: 'forbidden_title_crossjoin',
         descriptiveMessageKey: 'access_exists_description_crossjoin',
         callToActionMessageKey: 'request_access_crossjoin',
-        action: ForbiddenAction(() => window.open(url), 'access_exists', messages.request_access_crossjoin)
+        action: ForbiddenAction(() => {
+          createAnalyticsEvent({
+            action: 'clicked',
+            actionSubject: 'button',
+            actionSubjectId: 'requestAccess',
+            eventType: 'ui'
+          }).fire(ANALYTICS_CHANNEL);
+          window.open(url);
+        }, 'access_exists', messages.request_access_crossjoin)
       };
     case 'FORBIDDEN':
       return {

package/dist/es2019/utils/analytics/analytics.js

@@ -4,7 +4,7 @@ export const ANALYTICS_CHANNEL = 'media';
 export const context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.41.3"
+  packageVersion: "26.42.1"
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";