@atlaskit/smart-card 26.3.2 → 26.3.4

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/esm/view/InlineCard/Icon.js

@@ -9,12 +9,12 @@ import React from 'react';
 // Current rationale: vertically positioned at the top of
 // the smart card container (when set to 0). Offset this
 // to position it with appropriate whitespace from the top.
-export var Icon = styled.img(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: 14px;\n  width: 14px;\n  margin-right: 4px;\n  border-radius: 2px;\n  user-select: none;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n"])));
+export var Icon = styled.img(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: 14px;\n  width: 14px;\n  margin-right: ", ";\n  border-radius: 2px;\n  user-select: none;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n"])), "var(--ds-space-050, 4px)");
 
 // Used for 'untrue' icons which claim to be 16x16 but
 // are less than that in height/width.
 // TODO: Replace this override with proper AtlasKit solution.
-export var AKIconWrapper = styled.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  margin-right: -2px;\n"])));
+export var AKIconWrapper = styled.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  margin-right: calc(-1 * ", ");\n"])), "var(--ds-space-025, 2px)");
 export var Shimmer = function Shimmer(_ref) {
   var testId = _ref.testId;
   var skeletonCustomStyles = {

package/dist/esm/view/InlineCard/IconAndTitleLayout/styled.js

@@ -1,7 +1,6 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
 import styled from '@emotion/styled';
-
 // TODO: remove this override behaviour for @atlaskit/icon-object
 export var IconObjectOverrides = "\n  & > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    line-height: 14px;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
 // TODO: remove this override behaviour for @atlaskit/icon
@@ -16,7 +15,7 @@ export var IconOverrides = "\n  & > * > span {\n    height: 16px;\n    width: 14
 export var IconWrapper = styled.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  user-select: none;\n  ", "\n  ", "\n"])), IconOverrides, IconObjectOverrides);
 
 // Wraps all emoji in Inline Links similar to icon
-export var EmojiWrapper = styled.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: inline-block;\n  margin-right: 2px;\n  user-select: none;\n  ", "\n  ", "\n"])), IconOverrides, IconObjectOverrides);
+export var EmojiWrapper = styled.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: inline-block;\n  margin-right: ", ";\n  user-select: none;\n  ", "\n  ", "\n"])), "var(--ds-space-025, 2px)", IconOverrides, IconObjectOverrides);
 
 // The main 'wrapping' element, title of the content.
 // NB: `white-space` adds little whitespace before wrapping.
@@ -26,13 +25,13 @@ export var IconTitleWrapper = styled.span(_templateObject3 || (_templateObject3
 // TODO: Replace overrides with proper AtlasKit solution.
 export var LozengeWrapper = styled.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: inline-block;\n  vertical-align: 1px;\n"])));
 // TODO: Replace overrides with proper AtlasKit solution.
-export var LozengeBlockWrapper = styled.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  & > span {\n    margin-left: 4px;\n  }\n"])));
-export var RightIconPositionWrapper = styled.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  margin-left: 2px;\n  margin-right: 4px;\n  position: relative;\n  display: inline-block;\n"])));
+export var LozengeBlockWrapper = styled.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  & > span {\n    margin-left: ", ";\n  }\n"])), "var(--ds-space-050, 4px)");
+export var RightIconPositionWrapper = styled.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  margin-left: ", ";\n  margin-right: ", ";\n  position: relative;\n  display: inline-block;\n"])), "var(--ds-space-025, 2px)", "var(--ds-space-050, 4px)");
 
 // The following components are used to absolutely position icons in the vertical center.
 // - IconPositionWrapper: the `relative` parent which has no height in itself.
 // - IconEmptyWrapper: the child which forces `IconPositionWrapper` to have a height.
-export var IconPositionWrapper = styled.span(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin-right: 4px;\n  position: relative;\n  display: inline-block;\n"])));
+export var IconPositionWrapper = styled.span(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin-right: ", ";\n  position: relative;\n  display: inline-block;\n"])), "var(--ds-space-050, 4px)");
 export var IconEmptyWrapper = styled.span(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  width: 14px;\n  height: 100%;\n  display: inline-block;\n  opacity: 0;\n"])));
 
 // With emotion it's not possible to use reference to `TitleWrapper` as part of a selector,

package/dist/esm/view/InlineCard/ResolvingView/styled.js

@@ -2,4 +2,4 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 var _templateObject;
 import styled from '@emotion/styled';
 import { IconTitleWrapper } from '../IconAndTitleLayout/styled';
-export var SpinnerWrapper = styled(IconTitleWrapper)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  vertical-align: text-top;\n  margin-left: 2px;\n"])));
+export var SpinnerWrapper = styled(IconTitleWrapper)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  vertical-align: text-top;\n  margin-left: ", ";\n"])), "var(--ds-space-025, 2px)");

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.4",
   "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",
@@ -93,7 +93,7 @@
     "@atlaskit/radio": "^5.6.0",
     "@atlaskit/range": "^7.1.0",
     "@atlaskit/section-message": "^6.4.0",
-    "@atlaskit/select": "^16.2.0",
+    "@atlaskit/select": "^16.3.0",
     "@atlaskit/table-tree": "^9.4.0",
     "@atlaskit/tabs": "^13.4.0",
     "@atlaskit/textarea": "^4.6.0",
@@ -141,13 +141,17 @@
   "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",
   "techstack": {
     "@repo/internal": {
       "design-tokens": [
-        "color"
+        "color",
+        "spacing"
       ]
     }
   }