@atlaskit/smart-card 26.3.2 → 26.3.3

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/smart-card
 
+## 26.3.3
+
+### Patch Changes
+
+- [`6d9a4d28d94`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6d9a4d28d94) - Fixes HoverCard component providing hover card analytics context to the wrapped trigger component.
+- Updated dependencies
+
 ## 26.3.2
 
 ### Patch Changes

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

@@ -21,7 +21,8 @@ var SmartLinkAnalyticsContext = function SmartLinkAnalyticsContext(_ref) {
   var children = _ref.children,
     url = _ref.url,
     appearance = _ref.appearance,
-    id = _ref.id;
+    id = _ref.id,
+    source = _ref.source;
   var _useSmartLinkState = (0, _store.useSmartCardState)(url),
     details = _useSmartLinkState.details,
     status = _useSmartLinkState.status;
@@ -36,6 +37,7 @@ var SmartLinkAnalyticsContext = function SmartLinkAnalyticsContext(_ref) {
   var display = isFlexibleUi ? _constants.CardDisplay.Flexible : appearance;
   return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
     data: {
+      source: source,
       attributes: _objectSpread(_objectSpread({}, resolvedAttributes), {}, {
         urlHash: urlHash,
         display: display,

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "26.3.2",
+	"version": "26.3.3",
 	"sideEffects": false
 }

package/dist/cjs/view/HoverCard/components/HoverCardComponent.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.HoverCardComponent = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _popup = _interopRequireDefault(require("@atlaskit/popup"));
@@ -21,8 +22,9 @@ var _constants = require("../../../constants");
 var _SmartLinkAnalyticsContext = require("../../../utils/analytics/SmartLinkAnalyticsContext");
 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; }
-/** @jsx jsx */
-
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /** @jsx jsx */
+var HOVER_CARD_SOURCE = 'smartLinkPreviewHoverCard';
 var HoverCardComponent = function HoverCardComponent(_ref) {
   var children = _ref.children,
     url = _ref.url,
@@ -63,18 +65,24 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
     };
   }, [isOpen]);
   var hideCard = (0, _react2.useCallback)(function () {
-    //Check its previously open to avoid firing events when moving between the child and hover card components
-    if (isOpen === true && cardOpenTime.current) {
-      var hoverTime = Date.now() - cardOpenTime.current;
-      analytics.ui.hoverCardDismissedEvent({
-        previewDisplay: 'card',
-        hoverTime: hoverTime,
-        previewInvokeMethod: 'mouse_hover',
-        status: linkStatus
-      });
+    if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+      /**
+       * Defer to inner HoverCardContent to fire this event
+       */
+    } else {
+      //Check its previously open to avoid firing events when moving between the child and hover card components
+      if (isOpen === true && cardOpenTime.current) {
+        var hoverTime = Date.now() - cardOpenTime.current;
+        analytics === null || analytics === void 0 ? void 0 : analytics.ui.hoverCardDismissedEvent({
+          previewDisplay: 'card',
+          hoverTime: hoverTime,
+          previewInvokeMethod: 'mouse_hover',
+          status: linkStatus
+        });
+      }
     }
     setIsOpen(false);
-  }, [analytics.ui, isOpen, linkStatus]);
+  }, [analytics, isOpen, linkStatus]);
   var initHideCard = (0, _react2.useCallback)(function () {
     if (fadeInTimeoutId.current) {
       clearTimeout(fadeInTimeoutId.current);
@@ -90,14 +98,20 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
     //Set mouse position in the case it's not already set by onMouseMove, as in the case of scrolling
     setMousePosition(event);
     fadeInTimeoutId.current = setTimeout(function () {
-      //Check if its previously closed to avoid firing events when moving between the child and hover card components
-      if (isOpen === false) {
-        cardOpenTime.current = Date.now();
-        analytics.ui.hoverCardViewedEvent({
-          previewDisplay: hoverDisplay,
-          previewInvokeMethod: invokeMethod,
-          status: linkStatus
-        });
+      if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+        /**
+         * Defer to inner HoverCardContent to fire this event
+         */
+      } else {
+        //Check if its previously closed to avoid firing events when moving between the child and hover card components
+        if (isOpen === false) {
+          cardOpenTime.current = Date.now();
+          analytics === null || analytics === void 0 ? void 0 : analytics.ui.hoverCardViewedEvent({
+            previewDisplay: hoverDisplay,
+            previewInvokeMethod: invokeMethod,
+            status: linkStatus
+          });
+        }
       }
       //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
       if (parentSpan.current && mousePos.current) {
@@ -108,12 +122,12 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
       }
       setIsOpen(true);
     }, delay);
-  }, [isOpen, setMousePosition, analytics.ui, linkStatus]);
+  }, [isOpen, setMousePosition, analytics, linkStatus]);
   var linkActions = (0, _useSmartLinkActions.useSmartLinkActions)({
     url: url,
     appearance: _constants.CardDisplay.HoverCardPreview,
     analyticsHandler: analyticsHandler,
-    origin: 'smartLinkPreviewHoverCard'
+    origin: HOVER_CARD_SOURCE
   });
   var filteredActions = (0, _react2.useMemo)(function () {
     return hidePreviewButton ? linkActions.filter(function (action) {
@@ -136,14 +150,9 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
   }, [closeOnChildClick, hideCard]);
   var content = (0, _react2.useCallback)(function (_ref2) {
     var update = _ref2.update;
-    return (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-analytics-context') ? (0, _react.jsx)(_SmartLinkAnalyticsContext.SmartLinkAnalyticsContext, {
-      url: url,
-      appearance: _constants.CardDisplay.HoverCardPreview,
-      id: id
-    }, (0, _react.jsx)(_HoverCardContent.default, {
+    var hoverCardContentProps = _objectSpread({
       onMouseEnter: initShowCard,
       onMouseLeave: initHideCard,
-      analytics: analytics,
       cardActions: filteredActions,
       cardState: linkState,
       onActionClick: onActionClick,
@@ -152,18 +161,15 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
       showServerActions: showServerActions,
       url: url,
       id: id
-    })) : (0, _react.jsx)(_HoverCardContent.default, {
-      onMouseEnter: initShowCard,
-      onMouseLeave: initHideCard,
-      analytics: analytics,
-      cardActions: filteredActions,
-      cardState: linkState,
-      onActionClick: onActionClick,
-      onResolve: update,
-      renderers: renderers,
-      showServerActions: showServerActions,
-      url: url
+    }, (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.refactor-hover-card-analytics') ? {} : {
+      analytics: analytics
     });
+    return (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-analytics-context') ? (0, _react.jsx)(_SmartLinkAnalyticsContext.SmartLinkAnalyticsContext, {
+      url: url,
+      appearance: _constants.CardDisplay.HoverCardPreview,
+      id: id,
+      source: HOVER_CARD_SOURCE
+    }, (0, _react.jsx)(_HoverCardContent.default, hoverCardContentProps)) : (0, _react.jsx)(_HoverCardContent.default, hoverCardContentProps);
   }, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url, id]);
   var trigger = (0, _react2.useCallback)(function (triggerProps) {
     return (0, _react.jsx)("span", {

package/dist/cjs/view/HoverCard/components/HoverCardContent.js

@@ -9,12 +9,14 @@ exports.hoverCardClassName = exports.getOpenAction = exports.getCopyAction = exp
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _react = require("@emotion/react");
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _shortcut = _interopRequireDefault(require("@atlaskit/icon/glyph/shortcut"));
 var _copy = _interopRequireDefault(require("@atlaskit/icon/glyph/copy"));
-var _analyticsNext = require("@atlaskit/analytics-next");
 var _react2 = _interopRequireWildcard(require("react"));
 var _constants = require("../../../constants");
 var _extractMetadata2 = require("../../../extractors/hover/extractMetadata");
+var _analytics2 = require("../../../state/analytics");
 var _helpers = require("../../../state/helpers");
 var _utils = require("../../../utils");
 var _styled = require("../styled");
@@ -26,6 +28,7 @@ var _reactIntlNext = require("react-intl-next");
 var _messages = require("../../../messages");
 var _actions = require("../../../state/actions");
 var _click = require("../../../utils/analytics/click");
+var _store = require("../../../state/store");
 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; }
 /** @jsx jsx */
@@ -91,7 +94,7 @@ var HoverCardContent = function HoverCardContent(_ref) {
   var _cardState$details;
   var _ref$id = _ref.id,
     id = _ref$id === void 0 ? '' : _ref$id,
-    analytics = _ref.analytics,
+    _analytics = _ref.analytics,
     _ref$cardActions = _ref.cardActions,
     cardActions = _ref$cardActions === void 0 ? [] : _ref$cardActions,
     cardState = _ref.cardState,
@@ -104,13 +107,52 @@ var HoverCardContent = function HoverCardContent(_ref) {
     showServerActions = _ref.showServerActions;
   var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  var defaultAnalytics = (0, _analytics2.useSmartLinkAnalytics)(url, undefined, id);
+  var analytics = _analytics !== null && _analytics !== void 0 ? _analytics : defaultAnalytics;
   var extensionKey = (0, _react2.useMemo)(function () {
     return (0, _helpers.getExtensionKey)(cardState.details);
   }, [cardState.details]);
   var actions = (0, _actions.useSmartCardActions)(id, url, analytics);
+  var linkState = (0, _store.useSmartCardState)(url);
+  var linkStatus = linkState.status;
+  var statusRef = (0, _react2.useRef)(linkStatus);
+  var analyticsRef = (0, _react2.useRef)(analytics);
   (0, _react2.useEffect)(function () {
     actions.loadMetadata();
   }, [actions]);
+  (0, _react2.useEffect)(function () {
+    /**
+     * Must access current analytics object value via ref because its not stable
+     * and it can trigger useEffect to re-run below
+     */
+    if (analyticsRef.current !== analytics) {
+      analyticsRef.current = analytics;
+    }
+    if (statusRef.current !== linkStatus) {
+      statusRef.current = linkStatus;
+    }
+  }, [analytics, linkStatus]);
+  (0, _react2.useEffect)(function () {
+    if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+      var previewDisplay = 'card';
+      var previewInvokeMethod = 'mouse_hover';
+      var cardOpenTime = Date.now();
+      analyticsRef.current.ui.hoverCardViewedEvent({
+        previewDisplay: previewDisplay,
+        previewInvokeMethod: previewInvokeMethod,
+        status: statusRef.current
+      });
+      return function () {
+        var hoverTime = Date.now() - cardOpenTime;
+        analyticsRef.current.ui.hoverCardDismissedEvent({
+          previewDisplay: previewDisplay,
+          previewInvokeMethod: previewInvokeMethod,
+          hoverTime: hoverTime,
+          status: statusRef.current
+        });
+      };
+    }
+  }, []);
   var onClick = (0, _react2.useCallback)(function (event) {
     var isModifierKeyPressed = (0, _utils.isSpecialEvent)(event);
     analytics.ui.cardClickedEvent({

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

@@ -10,6 +10,7 @@ var _analyticsNext = require("@atlaskit/analytics-next");
 var _react = require("@emotion/react");
 var _react2 = require("react");
 var _reactErrorBoundary = require("react-error-boundary");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _analytics = require("../../state/analytics");
 var _analytics2 = require("../../utils/analytics");
 var _HoverCardComponent = require("./components/HoverCardComponent");
@@ -24,7 +25,11 @@ var HoverCardWithErrorBoundary = function HoverCardWithErrorBoundary(props) {
   var analyticsHandler = (0, _react2.useCallback)(function (analyticsPayload) {
     (0, _analytics2.fireSmartLinkEvent)(analyticsPayload, createAnalyticsEvent);
   }, [createAnalyticsEvent]);
-  var analytics = (0, _analytics.useSmartLinkAnalytics)(url, analyticsHandler, id);
+
+  /**
+   * Feature flag disables prop drilling of analytics handlers
+   */
+  var analytics = (0, _analytics.useSmartLinkAnalytics)(url, (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.refactor-hover-card-analytics') ? undefined : analyticsHandler, id);
   var onError = (0, _react2.useCallback)(function (error, info) {
     analytics.ui.renderFailedEvent({
       display: _constants.CardDisplay.HoverCardPreview,
@@ -33,18 +38,30 @@ var HoverCardWithErrorBoundary = function HoverCardWithErrorBoundary(props) {
       errorInfo: info
     });
   }, [analytics.ui, id]);
+
+  /**
+   * Feature flag disables the prop drilling of analytics handlers to hover card component
+   */
+  var analyticsProps = (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.refactor-hover-card-analytics') ? {} : {
+    analyticsHandler: analyticsHandler,
+    analytics: analytics
+  };
   return (0, _react.jsx)(_reactErrorBoundary.ErrorBoundary, {
     fallback: children,
     onError: onError
-  }, (0, _react.jsx)(_HoverCardComponent.HoverCardComponent, (0, _extends2.default)({}, props, {
-    analyticsHandler: analyticsHandler,
-    analytics: analytics
-  }), children));
+  }, (0, _react.jsx)(_HoverCardComponent.HoverCardComponent, (0, _extends2.default)({}, props, analyticsProps), children));
 };
-var HoverCard = (0, _analyticsNext.withAnalyticsContext)({
+var HoverCardWithAnalyticsContext = (0, _analyticsNext.withAnalyticsContext)({
   source: 'smartLinkPreviewHoverCard',
   attributes: {
     display: _constants.CardDisplay.HoverCardPreview
   }
 })((0, _analyticsNext.withAnalyticsEvents)()(HoverCardWithErrorBoundary));
+var HoverCardWithoutAnalyticsContext = (0, _analyticsNext.withAnalyticsEvents)()(HoverCardWithErrorBoundary);
+var HoverCard = function HoverCard(props) {
+  if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+    return (0, _react.jsx)(HoverCardWithoutAnalyticsContext, props);
+  }
+  return (0, _react.jsx)(HoverCardWithAnalyticsContext, props);
+};
 exports.HoverCard = HoverCard;

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

@@ -8,7 +8,8 @@ export const SmartLinkAnalyticsContext = ({
   children,
   url,
   appearance,
-  id
+  id,
+  source
 }) => {
   const {
     details,
@@ -24,6 +25,7 @@ export const SmartLinkAnalyticsContext = ({
   const display = isFlexibleUi ? CardDisplay.Flexible : appearance;
   return /*#__PURE__*/React.createElement(AnalyticsContext, {
     data: {
+      source,
       attributes: {
         ...resolvedAttributes,
         urlHash,

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "26.3.2",
+	"version": "26.3.3",
 	"sideEffects": false
 }

package/dist/es2019/view/HoverCard/components/HoverCardComponent.js

@@ -11,6 +11,7 @@ import HoverCardContent from '../components/HoverCardContent';
 import { CARD_GAP_PX, HOVER_CARD_Z_INDEX } from '../styled';
 import { CardDisplay } from '../../../constants';
 import { SmartLinkAnalyticsContext } from '../../../utils/analytics/SmartLinkAnalyticsContext';
+const HOVER_CARD_SOURCE = 'smartLinkPreviewHoverCard';
 export const HoverCardComponent = ({
   children,
   url,
@@ -45,18 +46,24 @@ export const HoverCardComponent = ({
     };
   }, [isOpen]);
   const hideCard = useCallback(() => {
-    //Check its previously open to avoid firing events when moving between the child and hover card components
-    if (isOpen === true && cardOpenTime.current) {
-      const hoverTime = Date.now() - cardOpenTime.current;
-      analytics.ui.hoverCardDismissedEvent({
-        previewDisplay: 'card',
-        hoverTime,
-        previewInvokeMethod: 'mouse_hover',
-        status: linkStatus
-      });
+    if (getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+      /**
+       * Defer to inner HoverCardContent to fire this event
+       */
+    } else {
+      //Check its previously open to avoid firing events when moving between the child and hover card components
+      if (isOpen === true && cardOpenTime.current) {
+        const hoverTime = Date.now() - cardOpenTime.current;
+        analytics === null || analytics === void 0 ? void 0 : analytics.ui.hoverCardDismissedEvent({
+          previewDisplay: 'card',
+          hoverTime,
+          previewInvokeMethod: 'mouse_hover',
+          status: linkStatus
+        });
+      }
     }
     setIsOpen(false);
-  }, [analytics.ui, isOpen, linkStatus]);
+  }, [analytics, isOpen, linkStatus]);
   const initHideCard = useCallback(() => {
     if (fadeInTimeoutId.current) {
       clearTimeout(fadeInTimeoutId.current);
@@ -70,14 +77,20 @@ export const HoverCardComponent = ({
     //Set mouse position in the case it's not already set by onMouseMove, as in the case of scrolling
     setMousePosition(event);
     fadeInTimeoutId.current = setTimeout(() => {
-      //Check if its previously closed to avoid firing events when moving between the child and hover card components
-      if (isOpen === false) {
-        cardOpenTime.current = Date.now();
-        analytics.ui.hoverCardViewedEvent({
-          previewDisplay: hoverDisplay,
-          previewInvokeMethod: invokeMethod,
-          status: linkStatus
-        });
+      if (getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+        /**
+         * Defer to inner HoverCardContent to fire this event
+         */
+      } else {
+        //Check if its previously closed to avoid firing events when moving between the child and hover card components
+        if (isOpen === false) {
+          cardOpenTime.current = Date.now();
+          analytics === null || analytics === void 0 ? void 0 : analytics.ui.hoverCardViewedEvent({
+            previewDisplay: hoverDisplay,
+            previewInvokeMethod: invokeMethod,
+            status: linkStatus
+          });
+        }
       }
       //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
       if (parentSpan.current && mousePos.current) {
@@ -89,12 +102,12 @@ export const HoverCardComponent = ({
       }
       setIsOpen(true);
     }, delay);
-  }, [isOpen, setMousePosition, analytics.ui, linkStatus]);
+  }, [isOpen, setMousePosition, analytics, linkStatus]);
   const linkActions = useSmartLinkActions({
     url,
     appearance: CardDisplay.HoverCardPreview,
     analyticsHandler,
-    origin: 'smartLinkPreviewHoverCard'
+    origin: HOVER_CARD_SOURCE
   });
   const filteredActions = useMemo(() => {
     return hidePreviewButton ? linkActions.filter(action => action.id !== 'preview-content') : linkActions;
@@ -115,34 +128,29 @@ export const HoverCardComponent = ({
   }, [closeOnChildClick, hideCard]);
   const content = useCallback(({
     update
-  }) => getBooleanFF('platform.linking-platform.smart-card.enable-analytics-context') ? jsx(SmartLinkAnalyticsContext, {
-    url: url,
-    appearance: CardDisplay.HoverCardPreview,
-    id: id
-  }, jsx(HoverCardContent, {
-    onMouseEnter: initShowCard,
-    onMouseLeave: initHideCard,
-    analytics: analytics,
-    cardActions: filteredActions,
-    cardState: linkState,
-    onActionClick: onActionClick,
-    onResolve: update,
-    renderers: renderers,
-    showServerActions: showServerActions,
-    url: url,
-    id: id
-  })) : jsx(HoverCardContent, {
-    onMouseEnter: initShowCard,
-    onMouseLeave: initHideCard,
-    analytics: analytics,
-    cardActions: filteredActions,
-    cardState: linkState,
-    onActionClick: onActionClick,
-    onResolve: update,
-    renderers: renderers,
-    showServerActions: showServerActions,
-    url: url
-  }), [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url, id]);
+  }) => {
+    const hoverCardContentProps = {
+      onMouseEnter: initShowCard,
+      onMouseLeave: initHideCard,
+      cardActions: filteredActions,
+      cardState: linkState,
+      onActionClick,
+      onResolve: update,
+      renderers,
+      showServerActions,
+      url,
+      id,
+      ...(getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics') ? {} : {
+        analytics
+      })
+    };
+    return getBooleanFF('platform.linking-platform.smart-card.enable-analytics-context') ? jsx(SmartLinkAnalyticsContext, {
+      url: url,
+      appearance: CardDisplay.HoverCardPreview,
+      id: id,
+      source: HOVER_CARD_SOURCE
+    }, jsx(HoverCardContent, hoverCardContentProps)) : jsx(HoverCardContent, hoverCardContentProps);
+  }, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url, id]);
   const trigger = useCallback(triggerProps => jsx("span", {
     ref: parentSpan
   }, jsx("span", _extends({}, triggerProps, {

package/dist/es2019/view/HoverCard/components/HoverCardContent.js

@@ -1,11 +1,13 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
+import { useAnalyticsEvents } from '@atlaskit/analytics-next';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import ShortcutIcon from '@atlaskit/icon/glyph/shortcut';
 import CopyIcon from '@atlaskit/icon/glyph/copy';
-import { useAnalyticsEvents } from '@atlaskit/analytics-next';
-import React, { useCallback, useEffect, useMemo } from 'react';
+import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { ActionName, CardDisplay, SmartLinkPosition, SmartLinkSize } from '../../../constants';
 import { extractMetadata } from '../../../extractors/hover/extractMetadata';
+import { useSmartLinkAnalytics } from '../../../state/analytics';
 import { getExtensionKey } from '../../../state/helpers';
 import { isSpecialEvent } from '../../../utils';
 import { HoverCardContainer, flexibleUiOptions, titleBlockCss } from '../styled';
@@ -17,6 +19,7 @@ import { FormattedMessage } from 'react-intl-next';
 import { messages } from '../../../messages';
 import { useSmartCardActions } from '../../../state/actions';
 import { fireLinkClickedEvent } from '../../../utils/analytics/click';
+import { useSmartCardState } from '../../../state/store';
 export const hoverCardClassName = 'smart-links-hover-preview';
 export const getOpenAction = (url, analytics, onActionClick) => ({
   name: ActionName.CustomAction,
@@ -50,7 +53,7 @@ export const getCopyAction = url => ({
 });
 const HoverCardContent = ({
   id = '',
-  analytics,
+  analytics: _analytics,
   cardActions = [],
   cardState,
   onActionClick,
@@ -65,11 +68,50 @@ const HoverCardContent = ({
   const {
     createAnalyticsEvent
   } = useAnalyticsEvents();
+  const defaultAnalytics = useSmartLinkAnalytics(url, undefined, id);
+  const analytics = _analytics !== null && _analytics !== void 0 ? _analytics : defaultAnalytics;
   const extensionKey = useMemo(() => getExtensionKey(cardState.details), [cardState.details]);
   const actions = useSmartCardActions(id, url, analytics);
+  const linkState = useSmartCardState(url);
+  const linkStatus = linkState.status;
+  const statusRef = useRef(linkStatus);
+  const analyticsRef = useRef(analytics);
   useEffect(() => {
     actions.loadMetadata();
   }, [actions]);
+  useEffect(() => {
+    /**
+     * Must access current analytics object value via ref because its not stable
+     * and it can trigger useEffect to re-run below
+     */
+    if (analyticsRef.current !== analytics) {
+      analyticsRef.current = analytics;
+    }
+    if (statusRef.current !== linkStatus) {
+      statusRef.current = linkStatus;
+    }
+  }, [analytics, linkStatus]);
+  useEffect(() => {
+    if (getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+      const previewDisplay = 'card';
+      const previewInvokeMethod = 'mouse_hover';
+      const cardOpenTime = Date.now();
+      analyticsRef.current.ui.hoverCardViewedEvent({
+        previewDisplay,
+        previewInvokeMethod,
+        status: statusRef.current
+      });
+      return () => {
+        const hoverTime = Date.now() - cardOpenTime;
+        analyticsRef.current.ui.hoverCardDismissedEvent({
+          previewDisplay,
+          previewInvokeMethod,
+          hoverTime,
+          status: statusRef.current
+        });
+      };
+    }
+  }, []);
   const onClick = useCallback(event => {
     const isModifierKeyPressed = isSpecialEvent(event);
     analytics.ui.cardClickedEvent({

package/dist/es2019/view/HoverCard/index.js

@@ -4,6 +4,7 @@ import { withAnalyticsContext, withAnalyticsEvents } from '@atlaskit/analytics-n
 import { jsx } from '@emotion/react';
 import { useCallback } from 'react';
 import { ErrorBoundary } from 'react-error-boundary';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { useSmartLinkAnalytics } from '../../state/analytics';
 import { fireSmartLinkEvent } from '../../utils/analytics';
 import { HoverCardComponent } from './components/HoverCardComponent';
@@ -18,7 +19,11 @@ const HoverCardWithErrorBoundary = props => {
   const analyticsHandler = useCallback(analyticsPayload => {
     fireSmartLinkEvent(analyticsPayload, createAnalyticsEvent);
   }, [createAnalyticsEvent]);
-  const analytics = useSmartLinkAnalytics(url, analyticsHandler, id);
+
+  /**
+   * Feature flag disables prop drilling of analytics handlers
+   */
+  const analytics = useSmartLinkAnalytics(url, getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics') ? undefined : analyticsHandler, id);
   const onError = useCallback((error, info) => {
     analytics.ui.renderFailedEvent({
       display: CardDisplay.HoverCardPreview,
@@ -27,17 +32,29 @@ const HoverCardWithErrorBoundary = props => {
       errorInfo: info
     });
   }, [analytics.ui, id]);
+
+  /**
+   * Feature flag disables the prop drilling of analytics handlers to hover card component
+   */
+  const analyticsProps = getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics') ? {} : {
+    analyticsHandler,
+    analytics
+  };
   return jsx(ErrorBoundary, {
     fallback: children,
     onError: onError
-  }, jsx(HoverCardComponent, _extends({}, props, {
-    analyticsHandler: analyticsHandler,
-    analytics: analytics
-  }), children));
+  }, jsx(HoverCardComponent, _extends({}, props, analyticsProps), children));
 };
-export const HoverCard = withAnalyticsContext({
+const HoverCardWithAnalyticsContext = withAnalyticsContext({
   source: 'smartLinkPreviewHoverCard',
   attributes: {
     display: CardDisplay.HoverCardPreview
   }
-})(withAnalyticsEvents()(HoverCardWithErrorBoundary));
+})(withAnalyticsEvents()(HoverCardWithErrorBoundary));
+const HoverCardWithoutAnalyticsContext = withAnalyticsEvents()(HoverCardWithErrorBoundary);
+export const HoverCard = props => {
+  if (getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+    return jsx(HoverCardWithoutAnalyticsContext, props);
+  }
+  return jsx(HoverCardWithAnalyticsContext, props);
+};

package/dist/esm/utils/analytics/SmartLinkAnalyticsContext.js

@@ -11,7 +11,8 @@ export var SmartLinkAnalyticsContext = function SmartLinkAnalyticsContext(_ref)
   var children = _ref.children,
     url = _ref.url,
     appearance = _ref.appearance,
-    id = _ref.id;
+    id = _ref.id,
+    source = _ref.source;
   var _useSmartLinkState = useSmartLinkState(url),
     details = _useSmartLinkState.details,
     status = _useSmartLinkState.status;
@@ -26,6 +27,7 @@ export var SmartLinkAnalyticsContext = function SmartLinkAnalyticsContext(_ref)
   var display = isFlexibleUi ? CardDisplay.Flexible : appearance;
   return /*#__PURE__*/React.createElement(AnalyticsContext, {
     data: {
+      source: source,
       attributes: _objectSpread(_objectSpread({}, resolvedAttributes), {}, {
         urlHash: urlHash,
         display: display,

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "26.3.2",
+	"version": "26.3.3",
 	"sideEffects": false
 }

package/dist/esm/view/HoverCard/components/HoverCardComponent.js

@@ -1,5 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 /** @jsx jsx */
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import Popup from '@atlaskit/popup';
@@ -12,6 +15,7 @@ import HoverCardContent from '../components/HoverCardContent';
 import { CARD_GAP_PX, HOVER_CARD_Z_INDEX } from '../styled';
 import { CardDisplay } from '../../../constants';
 import { SmartLinkAnalyticsContext } from '../../../utils/analytics/SmartLinkAnalyticsContext';
+var HOVER_CARD_SOURCE = 'smartLinkPreviewHoverCard';
 export var HoverCardComponent = function HoverCardComponent(_ref) {
   var children = _ref.children,
     url = _ref.url,
@@ -52,18 +56,24 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
     };
   }, [isOpen]);
   var hideCard = useCallback(function () {
-    //Check its previously open to avoid firing events when moving between the child and hover card components
-    if (isOpen === true && cardOpenTime.current) {
-      var hoverTime = Date.now() - cardOpenTime.current;
-      analytics.ui.hoverCardDismissedEvent({
-        previewDisplay: 'card',
-        hoverTime: hoverTime,
-        previewInvokeMethod: 'mouse_hover',
-        status: linkStatus
-      });
+    if (getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+      /**
+       * Defer to inner HoverCardContent to fire this event
+       */
+    } else {
+      //Check its previously open to avoid firing events when moving between the child and hover card components
+      if (isOpen === true && cardOpenTime.current) {
+        var hoverTime = Date.now() - cardOpenTime.current;
+        analytics === null || analytics === void 0 ? void 0 : analytics.ui.hoverCardDismissedEvent({
+          previewDisplay: 'card',
+          hoverTime: hoverTime,
+          previewInvokeMethod: 'mouse_hover',
+          status: linkStatus
+        });
+      }
     }
     setIsOpen(false);
-  }, [analytics.ui, isOpen, linkStatus]);
+  }, [analytics, isOpen, linkStatus]);
   var initHideCard = useCallback(function () {
     if (fadeInTimeoutId.current) {
       clearTimeout(fadeInTimeoutId.current);
@@ -79,14 +89,20 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
     //Set mouse position in the case it's not already set by onMouseMove, as in the case of scrolling
     setMousePosition(event);
     fadeInTimeoutId.current = setTimeout(function () {
-      //Check if its previously closed to avoid firing events when moving between the child and hover card components
-      if (isOpen === false) {
-        cardOpenTime.current = Date.now();
-        analytics.ui.hoverCardViewedEvent({
-          previewDisplay: hoverDisplay,
-          previewInvokeMethod: invokeMethod,
-          status: linkStatus
-        });
+      if (getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+        /**
+         * Defer to inner HoverCardContent to fire this event
+         */
+      } else {
+        //Check if its previously closed to avoid firing events when moving between the child and hover card components
+        if (isOpen === false) {
+          cardOpenTime.current = Date.now();
+          analytics === null || analytics === void 0 ? void 0 : analytics.ui.hoverCardViewedEvent({
+            previewDisplay: hoverDisplay,
+            previewInvokeMethod: invokeMethod,
+            status: linkStatus
+          });
+        }
       }
       //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
       if (parentSpan.current && mousePos.current) {
@@ -97,12 +113,12 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
       }
       setIsOpen(true);
     }, delay);
-  }, [isOpen, setMousePosition, analytics.ui, linkStatus]);
+  }, [isOpen, setMousePosition, analytics, linkStatus]);
   var linkActions = useSmartLinkActions({
     url: url,
     appearance: CardDisplay.HoverCardPreview,
     analyticsHandler: analyticsHandler,
-    origin: 'smartLinkPreviewHoverCard'
+    origin: HOVER_CARD_SOURCE
   });
   var filteredActions = useMemo(function () {
     return hidePreviewButton ? linkActions.filter(function (action) {
@@ -125,14 +141,9 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
   }, [closeOnChildClick, hideCard]);
   var content = useCallback(function (_ref2) {
     var update = _ref2.update;
-    return getBooleanFF('platform.linking-platform.smart-card.enable-analytics-context') ? jsx(SmartLinkAnalyticsContext, {
-      url: url,
-      appearance: CardDisplay.HoverCardPreview,
-      id: id
-    }, jsx(HoverCardContent, {
+    var hoverCardContentProps = _objectSpread({
       onMouseEnter: initShowCard,
       onMouseLeave: initHideCard,
-      analytics: analytics,
       cardActions: filteredActions,
       cardState: linkState,
       onActionClick: onActionClick,
@@ -141,18 +152,15 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
       showServerActions: showServerActions,
       url: url,
       id: id
-    })) : jsx(HoverCardContent, {
-      onMouseEnter: initShowCard,
-      onMouseLeave: initHideCard,
-      analytics: analytics,
-      cardActions: filteredActions,
-      cardState: linkState,
-      onActionClick: onActionClick,
-      onResolve: update,
-      renderers: renderers,
-      showServerActions: showServerActions,
-      url: url
+    }, getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics') ? {} : {
+      analytics: analytics
     });
+    return getBooleanFF('platform.linking-platform.smart-card.enable-analytics-context') ? jsx(SmartLinkAnalyticsContext, {
+      url: url,
+      appearance: CardDisplay.HoverCardPreview,
+      id: id,
+      source: HOVER_CARD_SOURCE
+    }, jsx(HoverCardContent, hoverCardContentProps)) : jsx(HoverCardContent, hoverCardContentProps);
   }, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url, id]);
   var trigger = useCallback(function (triggerProps) {
     return jsx("span", {

package/dist/esm/view/HoverCard/components/HoverCardContent.js

@@ -2,12 +2,14 @@ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
+import { useAnalyticsEvents } from '@atlaskit/analytics-next';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import ShortcutIcon from '@atlaskit/icon/glyph/shortcut';
 import CopyIcon from '@atlaskit/icon/glyph/copy';
-import { useAnalyticsEvents } from '@atlaskit/analytics-next';
-import React, { useCallback, useEffect, useMemo } from 'react';
+import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { ActionName, CardDisplay, SmartLinkPosition, SmartLinkSize } from '../../../constants';
 import { extractMetadata } from '../../../extractors/hover/extractMetadata';
+import { useSmartLinkAnalytics } from '../../../state/analytics';
 import { getExtensionKey } from '../../../state/helpers';
 import { isSpecialEvent } from '../../../utils';
 import { HoverCardContainer, flexibleUiOptions, titleBlockCss } from '../styled';
@@ -19,6 +21,7 @@ import { FormattedMessage } from 'react-intl-next';
 import { messages } from '../../../messages';
 import { useSmartCardActions } from '../../../state/actions';
 import { fireLinkClickedEvent } from '../../../utils/analytics/click';
+import { useSmartCardState } from '../../../state/store';
 export var hoverCardClassName = 'smart-links-hover-preview';
 export var getOpenAction = function getOpenAction(url, analytics, onActionClick) {
   return {
@@ -77,7 +80,7 @@ var HoverCardContent = function HoverCardContent(_ref) {
   var _cardState$details;
   var _ref$id = _ref.id,
     id = _ref$id === void 0 ? '' : _ref$id,
-    analytics = _ref.analytics,
+    _analytics = _ref.analytics,
     _ref$cardActions = _ref.cardActions,
     cardActions = _ref$cardActions === void 0 ? [] : _ref$cardActions,
     cardState = _ref.cardState,
@@ -90,13 +93,52 @@ var HoverCardContent = function HoverCardContent(_ref) {
     showServerActions = _ref.showServerActions;
   var _useAnalyticsEvents = useAnalyticsEvents(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  var defaultAnalytics = useSmartLinkAnalytics(url, undefined, id);
+  var analytics = _analytics !== null && _analytics !== void 0 ? _analytics : defaultAnalytics;
   var extensionKey = useMemo(function () {
     return getExtensionKey(cardState.details);
   }, [cardState.details]);
   var actions = useSmartCardActions(id, url, analytics);
+  var linkState = useSmartCardState(url);
+  var linkStatus = linkState.status;
+  var statusRef = useRef(linkStatus);
+  var analyticsRef = useRef(analytics);
   useEffect(function () {
     actions.loadMetadata();
   }, [actions]);
+  useEffect(function () {
+    /**
+     * Must access current analytics object value via ref because its not stable
+     * and it can trigger useEffect to re-run below
+     */
+    if (analyticsRef.current !== analytics) {
+      analyticsRef.current = analytics;
+    }
+    if (statusRef.current !== linkStatus) {
+      statusRef.current = linkStatus;
+    }
+  }, [analytics, linkStatus]);
+  useEffect(function () {
+    if (getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+      var previewDisplay = 'card';
+      var previewInvokeMethod = 'mouse_hover';
+      var cardOpenTime = Date.now();
+      analyticsRef.current.ui.hoverCardViewedEvent({
+        previewDisplay: previewDisplay,
+        previewInvokeMethod: previewInvokeMethod,
+        status: statusRef.current
+      });
+      return function () {
+        var hoverTime = Date.now() - cardOpenTime;
+        analyticsRef.current.ui.hoverCardDismissedEvent({
+          previewDisplay: previewDisplay,
+          previewInvokeMethod: previewInvokeMethod,
+          hoverTime: hoverTime,
+          status: statusRef.current
+        });
+      };
+    }
+  }, []);
   var onClick = useCallback(function (event) {
     var isModifierKeyPressed = isSpecialEvent(event);
     analytics.ui.cardClickedEvent({

package/dist/esm/view/HoverCard/index.js

@@ -4,6 +4,7 @@ import { withAnalyticsContext, withAnalyticsEvents } from '@atlaskit/analytics-n
 import { jsx } from '@emotion/react';
 import { useCallback } from 'react';
 import { ErrorBoundary } from 'react-error-boundary';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { useSmartLinkAnalytics } from '../../state/analytics';
 import { fireSmartLinkEvent } from '../../utils/analytics';
 import { HoverCardComponent } from './components/HoverCardComponent';
@@ -16,7 +17,11 @@ var HoverCardWithErrorBoundary = function HoverCardWithErrorBoundary(props) {
   var analyticsHandler = useCallback(function (analyticsPayload) {
     fireSmartLinkEvent(analyticsPayload, createAnalyticsEvent);
   }, [createAnalyticsEvent]);
-  var analytics = useSmartLinkAnalytics(url, analyticsHandler, id);
+
+  /**
+   * Feature flag disables prop drilling of analytics handlers
+   */
+  var analytics = useSmartLinkAnalytics(url, getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics') ? undefined : analyticsHandler, id);
   var onError = useCallback(function (error, info) {
     analytics.ui.renderFailedEvent({
       display: CardDisplay.HoverCardPreview,
@@ -25,17 +30,29 @@ var HoverCardWithErrorBoundary = function HoverCardWithErrorBoundary(props) {
       errorInfo: info
     });
   }, [analytics.ui, id]);
+
+  /**
+   * Feature flag disables the prop drilling of analytics handlers to hover card component
+   */
+  var analyticsProps = getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics') ? {} : {
+    analyticsHandler: analyticsHandler,
+    analytics: analytics
+  };
   return jsx(ErrorBoundary, {
     fallback: children,
     onError: onError
-  }, jsx(HoverCardComponent, _extends({}, props, {
-    analyticsHandler: analyticsHandler,
-    analytics: analytics
-  }), children));
+  }, jsx(HoverCardComponent, _extends({}, props, analyticsProps), children));
 };
-export var HoverCard = withAnalyticsContext({
+var HoverCardWithAnalyticsContext = withAnalyticsContext({
   source: 'smartLinkPreviewHoverCard',
   attributes: {
     display: CardDisplay.HoverCardPreview
   }
-})(withAnalyticsEvents()(HoverCardWithErrorBoundary));
+})(withAnalyticsEvents()(HoverCardWithErrorBoundary));
+var HoverCardWithoutAnalyticsContext = withAnalyticsEvents()(HoverCardWithErrorBoundary);
+export var HoverCard = function HoverCard(props) {
+  if (getBooleanFF('platform.linking-platform.smart-card.refactor-hover-card-analytics')) {
+    return jsx(HoverCardWithoutAnalyticsContext, props);
+  }
+  return jsx(HoverCardWithAnalyticsContext, props);
+};

package/dist/types/utils/analytics/SmartLinkAnalyticsContext.d.ts

@@ -4,6 +4,7 @@ type SmartLinkAnalyticsContextProps = {
     url: string;
     appearance: CardInnerAppearance;
     id: string | undefined;
+    source?: string;
 };
 export declare const SmartLinkAnalyticsContext: FC<SmartLinkAnalyticsContextProps>;
 export {};

package/dist/types/view/HoverCard/index.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
+import { jsx } from '@emotion/react';
 import { HoverCardProps } from './types';
-export declare const HoverCard: import("react").ForwardRefExoticComponent<Pick<Omit<import("react").PropsWithChildren<HoverCardProps>, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps> & import("react").RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "url" | "children" | "key" | "id" | "analyticsContext" | "showServerActions" | "onAuthorize" | "canOpen" | "closeOnChildClick" | "hidePreviewButton"> & import("react").RefAttributes<any>>;
+export declare const HoverCard: (props: HoverCardProps) => jsx.JSX.Element;

package/dist/types/view/HoverCard/types.d.ts

@@ -3,8 +3,8 @@ import { ElementItem } from '../FlexibleCard/components/blocks/types';
 import { AnalyticsFacade } from '../../state/analytics';
 import { LinkAction } from '../../state/hooks-external/useSmartLinkActions';
 import { CardState } from '@atlaskit/linking-common';
-import { CardProviderRenderers } from '@atlaskit/link-provider';
 import { AnalyticsHandler } from '../../utils/types';
+import { CardProviderRenderers } from '@atlaskit/link-provider';
 import { ReactElement, MouseEventHandler } from 'react';
 import { JsonLd } from 'json-ld-types';
 export interface HoverCardProps extends WithAnalyticsEventsProps {
@@ -44,8 +44,8 @@ export interface HoverCardProps extends WithAnalyticsEventsProps {
     showServerActions?: boolean;
 }
 export interface HoverCardComponentProps extends HoverCardProps {
-    analyticsHandler: AnalyticsHandler;
-    analytics: AnalyticsFacade;
+    analyticsHandler?: AnalyticsHandler;
+    analytics?: AnalyticsFacade;
     canOpen?: boolean;
     closeOnChildClick?: boolean;
 }
@@ -58,7 +58,7 @@ export interface MetadataOptions {
 }
 export type HoverCardContentProps = {
     id?: string;
-    analytics: AnalyticsFacade;
+    analytics?: AnalyticsFacade;
     cardActions?: LinkAction[];
     cardState: CardState;
     renderers?: CardProviderRenderers;

package/dist/types-ts4.5/utils/analytics/SmartLinkAnalyticsContext.d.ts

@@ -4,6 +4,7 @@ type SmartLinkAnalyticsContextProps = {
     url: string;
     appearance: CardInnerAppearance;
     id: string | undefined;
+    source?: string;
 };
 export declare const SmartLinkAnalyticsContext: FC<SmartLinkAnalyticsContextProps>;
 export {};

package/dist/types-ts4.5/view/HoverCard/index.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
+import { jsx } from '@emotion/react';
 import { HoverCardProps } from './types';
-export declare const HoverCard: import("react").ForwardRefExoticComponent<Pick<Omit<import("react").PropsWithChildren<HoverCardProps>, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps> & import("react").RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "url" | "children" | "key" | "id" | "analyticsContext" | "showServerActions" | "onAuthorize" | "canOpen" | "closeOnChildClick" | "hidePreviewButton"> & import("react").RefAttributes<any>>;
+export declare const HoverCard: (props: HoverCardProps) => jsx.JSX.Element;

package/dist/types-ts4.5/view/HoverCard/types.d.ts

@@ -3,8 +3,8 @@ import { ElementItem } from '../FlexibleCard/components/blocks/types';
 import { AnalyticsFacade } from '../../state/analytics';
 import { LinkAction } from '../../state/hooks-external/useSmartLinkActions';
 import { CardState } from '@atlaskit/linking-common';
-import { CardProviderRenderers } from '@atlaskit/link-provider';
 import { AnalyticsHandler } from '../../utils/types';
+import { CardProviderRenderers } from '@atlaskit/link-provider';
 import { ReactElement, MouseEventHandler } from 'react';
 import { JsonLd } from 'json-ld-types';
 export interface HoverCardProps extends WithAnalyticsEventsProps {
@@ -44,8 +44,8 @@ export interface HoverCardProps extends WithAnalyticsEventsProps {
     showServerActions?: boolean;
 }
 export interface HoverCardComponentProps extends HoverCardProps {
-    analyticsHandler: AnalyticsHandler;
-    analytics: AnalyticsFacade;
+    analyticsHandler?: AnalyticsHandler;
+    analytics?: AnalyticsFacade;
     canOpen?: boolean;
     closeOnChildClick?: boolean;
 }
@@ -58,7 +58,7 @@ export interface MetadataOptions {
 }
 export type HoverCardContentProps = {
     id?: string;
-    analytics: AnalyticsFacade;
+    analytics?: AnalyticsFacade;
     cardActions?: LinkAction[];
     cardState: CardState;
     renderers?: CardProviderRenderers;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/smart-card",
-  "version": "26.3.2",
+  "version": "26.3.3",
   "description": "Smart card component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -44,7 +44,7 @@
     "@atlaskit/link-analytics": "^8.0.2",
     "@atlaskit/link-client-extension": "^1.1.0",
     "@atlaskit/linking-common": "^2.12.0",
-    "@atlaskit/linking-types": "^2.0.0",
+    "@atlaskit/linking-types": "^3.0.0",
     "@atlaskit/logo": "^13.14.0",
     "@atlaskit/lozenge": "^11.4.0",
     "@atlaskit/media-common": "^4.1.0",
@@ -85,7 +85,7 @@
     "@atlaskit/field-base": "^15.2.0",
     "@atlaskit/form": "^8.11.0",
     "@atlaskit/inline-message": "^11.5.0",
-    "@atlaskit/link-test-helpers": "^3.0.0",
+    "@atlaskit/link-test-helpers": "^4.0.0",
     "@atlaskit/lozenge": "^11.4.0",
     "@atlaskit/media-integration-test-helpers": "^2.6.0",
     "@atlaskit/media-test-helpers": "^33.0.0",
@@ -141,6 +141,9 @@
   "platform-feature-flags": {
     "platform.linking-platform.smart-card.enable-analytics-context": {
       "type": "boolean"
+    },
+    "platform.linking-platform.smart-card.refactor-hover-card-analytics": {
+      "type": "boolean"
     }
   },
   "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1",