@atlaskit/smart-card 19.1.13 → 19.1.16

package/dist/esm/view/CardWithUrl/loader.js

@@ -13,7 +13,7 @@ var LazyCardWithUrlContent = /*#__PURE__*/lazy(function () {
 });
 export function CardWithURLRenderer(props) {
   var _useState = useState(function () {
-    return uuid();
+    return props.id ? props.id : uuid();
   }),
       _useState2 = _slicedToArray(_useState, 1),
       id = _useState2[0];
@@ -41,7 +41,8 @@ export function CardWithURLRenderer(props) {
       createAnalyticsEvent = props.createAnalyticsEvent,
       children = props.children,
       ui = props.ui,
-      showHoverPreview = props.showHoverPreview; // Wrapper around analytics.
+      showHoverPreview = props.showHoverPreview,
+      analyticsEvents = props.analyticsEvents; // Wrapper around analytics.
 
   var dispatchAnalytics = useCallback(function (analyticsPayload) {
     if (analyticsPayload && analyticsPayload.attributes) {
@@ -98,7 +99,8 @@ export function CardWithURLRenderer(props) {
     embedIframeRef: embedIframeRef,
     inlinePreloaderStyle: inlinePreloaderStyle,
     ui: ui,
-    showHoverPreview: showHoverPreview
+    showHoverPreview: showHoverPreview,
+    analyticsEvents: analyticsEvents
   };
   return /*#__PURE__*/React.createElement(ErrorBoundary, {
     FallbackComponent: ErrorFallback,

package/dist/esm/view/FlexibleCard/components/elements/date-time/index.js

@@ -35,7 +35,8 @@ var DateTime = function DateTime(_ref) {
       overrideCss = _ref.overrideCss,
       type = _ref.type,
       _ref$testId = _ref.testId,
-      testId = _ref$testId === void 0 ? 'smart-element-date-time' : _ref$testId;
+      testId = _ref$testId === void 0 ? 'smart-element-date-time' : _ref$testId,
+      text = _ref.text;
 
   var _useIntl = useIntl(),
       formatRelativeTime = _useIntl.formatRelativeTime,
@@ -72,7 +73,7 @@ var DateTime = function DateTime(_ref) {
     "data-separator": true,
     "data-smart-element-date-time": true,
     "data-testid": testId
-  }, jsx(FormattedMessage, _extends({}, typeToDescriptorMap[type][typeVariant], {
+  }, text ? "".concat(text, " ").concat(context) : jsx(FormattedMessage, _extends({}, typeToDescriptorMap[type][typeVariant], {
     values: {
       context: context
     }

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

@@ -21,6 +21,7 @@ import { getSimulatedMetadata } from './utils';
 import extractPreview from '../../extractors/flexible/extract-preview';
 export var HoverCardComponent = function HoverCardComponent(_ref) {
   var children = _ref.children,
+      id = _ref.id,
       url = _ref.url,
       createAnalyticsEvent = _ref.createAnalyticsEvent;
   var analyticsHandler = useCallback(function (analyticsPayload) {
@@ -37,7 +38,7 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
   var fadeInTimeoutId = useRef();
   var cardOpenTime = useRef();
   var linkState = useLinkState(url);
-  var analytics = useSmartLinkAnalytics(analyticsHandler);
+  var analytics = useSmartLinkAnalytics(url, analyticsHandler, id);
   var extensionKey = useMemo(function () {
     return getExtensionKey(linkState.details);
   }, [linkState]);
@@ -53,7 +54,7 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
       //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('card', hoverTime, definitionId, extensionKey);
+        analytics.ui.hoverCardDismissedEvent('card', hoverTime, definitionId, extensionKey, 'mouse_hover');
       }
 
       setIsOpen(false);
@@ -68,7 +69,7 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
       //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('card', definitionId, extensionKey);
+        analytics.ui.hoverCardViewedEvent('card', definitionId, extensionKey, 'mouse_hover');
       }
 
       setIsOpen(true);
@@ -120,6 +121,7 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
       onMouseLeave: initHideCard,
       css: HoverCardContainer
     }, jsx(Card, {
+      id: id,
       appearance: "block",
       url: url,
       ui: {

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

@@ -1,4 +1,6 @@
-export var getSimulatedMetadata = function getSimulatedMetadata(extensionKey) {
+export var getSimulatedMetadata = function getSimulatedMetadata() {
+  var extensionKey = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+
   switch (extensionKey) {
     case 'confluence-object-provider':
       return {

package/dist/esm/view/InlineCard/ResolvedView/index.js

@@ -43,6 +43,7 @@ export var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var _this$props = this.props,
+          id = _this$props.id,
           _this$props$title = _this$props.title,
           title = _this$props$title === void 0 ? '' : _this$props$title,
           isSelected = _this$props.isSelected,
@@ -69,6 +70,7 @@ export var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
 
       if (showHoverPreview && link) {
         return /*#__PURE__*/React.createElement(HoverCard, {
+          id: id,
           url: link
         }, inlineCardResolvedView);
       }

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

@@ -13,7 +13,8 @@ export { InlineCardResolvedView, InlineCardResolvingView, InlineCardErroredView,
 export var InlineCard = function InlineCard(_ref) {
   var _details$meta;
 
-  var url = _ref.url,
+  var id = _ref.id,
+      url = _ref.url,
       cardState = _ref.cardState,
       handleAuthorize = _ref.handleAuthorize,
       handleFrameClick = _ref.handleFrameClick,
@@ -50,6 +51,7 @@ export var InlineCard = function InlineCard(_ref) {
       }
 
       return /*#__PURE__*/React.createElement(InlineCardResolvedView, _extends({}, resolvedProps, {
+        id: id,
         showHoverPreview: showHoverPreview,
         link: url,
         isSelected: isSelected,

package/dist/types/index.d.ts

@@ -1,6 +1,6 @@
 import { JsonLd } from 'json-ld-types';
 export declare type ResolveResponse = JsonLd.Response;
-export { SmartCardProvider as Provider, SmartCardContext } from './state';
+export { SmartCardProvider as Provider, SmartCardContext, useSmartLinkAnalytics, } from './state';
 export type { ProviderProps, CardType } from './state';
 export { EditorCardProvider, editorCardProvider, } from '@atlaskit/link-provider';
 export type { CardAdf, InlineCardAdf, BlockCardAdf, EmbedCardAdf, } from '@atlaskit/linking-common';

package/dist/types/state/analytics/useSmartLinkAnalytics.d.ts

@@ -3,31 +3,164 @@ import { AnalyticsHandler } from '../../utils/types';
 import { CardInnerAppearance } from '../../view/Card/types';
 import { PreviewDisplay, PreviewInvokeMethod } from '../../view/HoverCard/types';
 import { InvokeType } from '../../model/invoke-opts';
-export declare const useSmartLinkAnalytics: (dispatchAnalytics: AnalyticsHandler) => {
+/**
+ * This hook provides usage of Smart Link analytics outside of the Card component.
+ * Can be provided to Card via the analyticsEvents prop to change the analytics events.
+ * @param url URL of the link
+ * @param dispatchAnalytics dispatchAnalytics function
+ * @param id fallback id of the events sent if no id is available
+ * @param defaultLocation location attribute to be used
+ * @returns
+ */
+export declare const useSmartLinkAnalytics: (url: string, dispatchAnalytics: AnalyticsHandler, id?: string | undefined, defaultLocation?: string | undefined) => {
     ui: {
+        /**
+         * This fires an event that represents when a user clicks on the authentication
+         * call to action with no current authenticated account. (i.e. Connect to Preview).
+         * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @returns
+         */
         authEvent: (display: CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
+        /**
+         * This fires an event that represents when a user clicks on the authentication
+         * call to action with a forbidden authenticated account. (i.e. Try another account).
+         * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @returns
+         */
         authAlternateAccountEvent: (display: CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
-        cardClickedEvent: (display: CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined, isModifierKeyPressed?: boolean | undefined) => void;
-        actionClickedEvent: (id: string, extensionKey: string, actionType: string, display: CardInnerAppearance, invokeType: InvokeType) => void;
+        /**
+         * This fires an event that represents when a user clicks on a Smart Link.
+         * @param id The unique ID for this Smart Link.
+         * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @param isModifierKeyPressed Whether a modifier key was pressed when clicking the Smart Link.
+         * @param location Where the Smart Link is currently rendered.
+         * @param destinationProduct The product the Smart Link is linked to.
+         * @returns
+         */
+        cardClickedEvent: (id: string | undefined, display: CardInnerAppearance, status: CardType, definitionId?: string | undefined, extensionKey?: string | undefined, isModifierKeyPressed?: boolean | undefined, location?: string | undefined, destinationProduct?: string | undefined) => void;
+        /**
+         * This fires an event that represents when a user clicks on a Smart Link action.
+         * Note: This also starts the UFO smart-link-action-invocation experience.
+         * @param id The unique ID for this Smart Link.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @param actionType The type of the action that was clicked, e.g. PreviewAction
+         * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+         * @param invokeType Whether the action invoked made a call to a server.
+         * @returns
+         */
+        actionClickedEvent: (id: string | undefined, extensionKey: string | undefined, actionType: string, display: CardInnerAppearance, invokeType: InvokeType) => void;
+        /**
+         * This fires an event that represents when a user clicks on a hover preview's "navigate to link" button.
+         * https://product-fabric.atlassian.net/wiki/spaces/EM/pages/3206743323/Analytics+Metrics+-+Hover+Previews
+         * @param previewDisplay What format the preview is in.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @param previewInvokeMethod How the preview was triggered.
+         */
         hoverCardOpenLinkClickedEvent: (previewDisplay: PreviewDisplay, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: PreviewInvokeMethod | undefined) => void;
+        /**
+         * This fires an event that represents when a user closed the authentication window without authenticating after opening it.
+         * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @returns
+         */
         closedAuthEvent: (display: CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
-        renderSuccessEvent: (display: CardInnerAppearance, id: string, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
-        hoverCardViewedEvent: (hoverDisplay: PreviewDisplay, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: PreviewInvokeMethod | undefined) => void;
-        hoverCardDismissedEvent: (hoverDisplay: PreviewDisplay, hoverTime: number, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: PreviewInvokeMethod | undefined) => void;
+        /**
+         * This fires an event that represents when a Smart Link was rendered successfully.
+         * Note: this fires even if the Smart Link request errored out.
+         * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+         * @param id The unique ID for this Smart Link.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         */
+        renderSuccessEvent: (display: CardInnerAppearance, status: CardType, id?: string, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
+        /**
+         * This fires an event that represents a hover preview being opened.
+         * @param hoverDisplay Whether the hover preview was displayed as a card or embed.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @param previewInvokeMethod How the preview was triggered.
+         * @returns
+         */
+        hoverCardViewedEvent: (previewDisplay: PreviewDisplay, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: PreviewInvokeMethod | undefined) => void;
+        /**
+         * This fires an event that represents a hover preview being dismissed.
+         * @param hoverDisplay Whether the hover preview was displayed as a card or embed.
+         * @param hoverTime The duration that the user hovered over a Smart Link before the preview was dismissed.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @param previewInvokeMethod How the preview was triggered.
+         * @returns
+         */
+        hoverCardDismissedEvent: (previewDisplay: PreviewDisplay, hoverTime: number, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: PreviewInvokeMethod | undefined) => void;
     };
     operational: {
-        resolvedEvent: (id: string, definitionId?: string | undefined, extensionKey?: string | undefined, resourceType?: string | undefined) => void;
-        unresolvedEvent: (id: string, status: string, definitionId?: string | undefined, extensionKey?: string | undefined, resourceType?: string | undefined) => void;
-        invokeSucceededEvent: (id: string, providerKey: string, actionType: string, display: CardInnerAppearance) => void;
-        invokeFailedEvent: (id: string, providerKey: string, actionType: string, display: CardInnerAppearance, reason: string) => void;
-        connectSucceededEvent: (id: string, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
-        connectFailedEvent: (id: string, definitionId?: string | undefined, extensionKey?: string | undefined, status?: string | undefined) => void;
-        instrument: (id: string, status: CardType, definitionId?: string | undefined, extensionKey?: string | undefined, resourceType?: string | undefined, error?: APIError | undefined) => void;
+        /**
+         * This fires an event that represents an action being successfully invoked.
+         * @param id The unique ID for this Smart Link.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @param actionType The type of action invoked, e.g. PreviewAction
+         * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+         */
+        invokeSucceededEvent: (id: string | undefined, extensionKey: string | undefined, actionType: string, display: CardInnerAppearance) => void;
+        /**
+         * This fires an event that represents an action being unsuccessfully invoked.
+         * @param id The unique ID for this Smart Link.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @param actionType The type of action invoked, e.g. PreviewAction
+         * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+         * @param reason The reason the invocation failed.
+         */
+        invokeFailedEvent: (id: string | undefined, providerKey: string | undefined, actionType: string, display: CardInnerAppearance, reason: string) => void;
+        /**
+         * This fires an event that represents an account successfully being connected via a Smart Link.
+         * @param id The unique ID for this Smart Link.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         */
+        connectSucceededEvent: (id?: string, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
+        /**
+         * This fires an event that represents an account unsuccessfully being connected.
+         * @param id The unique ID for this Smart Link.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @param reason The reason why the Smart Link connect account failed.
+         */
+        connectFailedEvent: (id?: string, definitionId?: string | undefined, extensionKey?: string | undefined, reason?: string | undefined) => void;
+        /**
+         * This fires an event which represents a Smart Link request succeeding or failing based on the status.
+         * @param id The unique ID for this Smart Link.
+         * @param status The status of the Smart Link.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @param resourceType The type of resource that was invoked. This is provider specific (e.g. File, PullRequest).
+         * @param error An error representing why the Smart Link request failed.
+         */
+        instrument: (id: string | undefined, status: CardType, definitionId?: string | undefined, extensionKey?: string | undefined, resourceType?: string | undefined, error?: APIError | undefined) => void;
     };
     track: {
+        /**
+         * This fires an event which represents a user starting the Smart Link connect account process.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @returns
+         */
         appAccountConnected: (definitionId?: string | undefined, extensionKey?: string | undefined) => void;
     };
     screen: {
+        /**
+         * This fires an event which represents the connect account page being opened.
+         * @param definitionId The definitionId of the Smart Link resolver invoked.
+         * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+         * @returns
+         */
         authPopupEvent: (definitionId?: string | undefined, extensionKey?: string | undefined) => void;
     };
 };

package/dist/types/state/helpers.d.ts

@@ -2,8 +2,8 @@ import { JsonLd } from 'json-ld-types';
 import { CardType, CardStore } from '@atlaskit/linking-common';
 export declare const getByDefinitionId: (definitionId: string | undefined, store: CardStore) => string[];
 export declare const getClickUrl: (url: string, jsonLd?: JsonLd.Response<JsonLd.Data.BaseData> | undefined) => string;
-export declare const getDefinitionId: (details?: JsonLd.Response<JsonLd.Data.BaseData> | undefined) => any;
-export declare const getExtensionKey: (details?: JsonLd.Response<JsonLd.Data.BaseData> | undefined) => any;
+export declare const getDefinitionId: (details?: JsonLd.Response<JsonLd.Data.BaseData> | undefined) => string | undefined;
+export declare const getExtensionKey: (details?: JsonLd.Response<JsonLd.Data.BaseData> | undefined) => string | undefined;
 export declare const getResourceType: (details?: JsonLd.Response<JsonLd.Data.BaseData> | undefined) => string | undefined;
 export declare const getServices: (details?: JsonLd.Response<JsonLd.Data.BaseData> | undefined) => JsonLd.Primitives.AuthService[];
 export declare const hasResolved: (details?: JsonLd.Response<JsonLd.Data.BaseData> | undefined) => boolean | undefined;

package/dist/types/state/hooks/useSmartLink.d.ts

@@ -12,22 +12,20 @@ export declare function useSmartLink(id: string, url: string, dispatchAnalytics:
         ui: {
             authEvent: (display: import("../../view/Card/types").CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
             authAlternateAccountEvent: (display: import("../../view/Card/types").CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
-            cardClickedEvent: (display: import("../../view/Card/types").CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined, isModifierKeyPressed?: boolean | undefined) => void;
-            actionClickedEvent: (id: string, extensionKey: string, actionType: string, display: import("../../view/Card/types").CardInnerAppearance, invokeType: import("../../model/invoke-opts").InvokeType) => void;
+            cardClickedEvent: (id: string | undefined, display: import("../../view/Card/types").CardInnerAppearance, status: import("@atlaskit/linking-common/types").CardType, definitionId?: string | undefined, extensionKey?: string | undefined, isModifierKeyPressed?: boolean | undefined, location?: string | undefined, destinationProduct?: string | undefined) => void;
+            actionClickedEvent: (id: string | undefined, extensionKey: string | undefined, actionType: string, display: import("../../view/Card/types").CardInnerAppearance, invokeType: import("../../model/invoke-opts").InvokeType) => void;
             hoverCardOpenLinkClickedEvent: (previewDisplay: import("../../view/HoverCard/types").PreviewDisplay, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: import("../../view/HoverCard/types").PreviewInvokeMethod | undefined) => void;
             closedAuthEvent: (display: import("../../view/Card/types").CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
-            renderSuccessEvent: (display: import("../../view/Card/types").CardInnerAppearance, id: string, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
-            hoverCardViewedEvent: (hoverDisplay: import("../../view/HoverCard/types").PreviewDisplay, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: import("../../view/HoverCard/types").PreviewInvokeMethod | undefined) => void;
-            hoverCardDismissedEvent: (hoverDisplay: import("../../view/HoverCard/types").PreviewDisplay, hoverTime: number, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: import("../../view/HoverCard/types").PreviewInvokeMethod | undefined) => void;
+            renderSuccessEvent: (display: import("../../view/Card/types").CardInnerAppearance, status: import("@atlaskit/linking-common/types").CardType, id?: string, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
+            hoverCardViewedEvent: (previewDisplay: import("../../view/HoverCard/types").PreviewDisplay, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: import("../../view/HoverCard/types").PreviewInvokeMethod | undefined) => void;
+            hoverCardDismissedEvent: (previewDisplay: import("../../view/HoverCard/types").PreviewDisplay, hoverTime: number, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: import("../../view/HoverCard/types").PreviewInvokeMethod | undefined) => void;
         };
         operational: {
-            resolvedEvent: (id: string, definitionId?: string | undefined, extensionKey?: string | undefined, resourceType?: string | undefined) => void;
-            unresolvedEvent: (id: string, status: string, definitionId?: string | undefined, extensionKey?: string | undefined, resourceType?: string | undefined) => void;
-            invokeSucceededEvent: (id: string, providerKey: string, actionType: string, display: import("../../view/Card/types").CardInnerAppearance) => void;
-            invokeFailedEvent: (id: string, providerKey: string, actionType: string, display: import("../../view/Card/types").CardInnerAppearance, reason: string) => void;
-            connectSucceededEvent: (id: string, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
-            connectFailedEvent: (id: string, definitionId?: string | undefined, extensionKey?: string | undefined, status?: string | undefined) => void;
-            instrument: (id: string, status: import("@atlaskit/linking-common/types").CardType, definitionId?: string | undefined, extensionKey?: string | undefined, resourceType?: string | undefined, error?: import("@atlaskit/linking-common").APIError | undefined) => void;
+            invokeSucceededEvent: (id: string | undefined, extensionKey: string | undefined, actionType: string, display: import("../../view/Card/types").CardInnerAppearance) => void;
+            invokeFailedEvent: (id: string | undefined, providerKey: string | undefined, actionType: string, display: import("../../view/Card/types").CardInnerAppearance, reason: string) => void;
+            connectSucceededEvent: (id?: string, definitionId?: string | undefined, extensionKey?: string | undefined) => void;
+            connectFailedEvent: (id?: string, definitionId?: string | undefined, extensionKey?: string | undefined, reason?: string | undefined) => void;
+            instrument: (id: string | undefined, status: import("@atlaskit/linking-common/types").CardType, definitionId?: string | undefined, extensionKey?: string | undefined, resourceType?: string | undefined, error?: import("@atlaskit/linking-common").APIError | undefined) => void;
         };
         track: {
             appAccountConnected: (definitionId?: string | undefined, extensionKey?: string | undefined) => void;

package/dist/types/state/index.d.ts

@@ -2,3 +2,4 @@ export { SmartCardContext, SmartCardProvider, useSmartLinkContext, } from '@atla
 export type { CardContext, ProviderProps } from '@atlaskit/link-provider';
 export type { CardType } from '@atlaskit/linking-common';
 export { useSmartLink, usePrefetch } from './hooks';
+export { useSmartLinkAnalytics } from './analytics';

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

@@ -1,5 +1,5 @@
 import { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
-import { APIError } from '@atlaskit/linking-common';
+import { APIError, CardType } from '@atlaskit/linking-common';
 import { AnalyticsPayload } from '../types';
 import { ErrorInfo } from 'react';
 import { CardInnerAppearance } from '../../view/Card/types';
@@ -16,19 +16,19 @@ export declare class SmartLinkEvents {
 export declare const fireSmartLinkEvent: (payload: AnalyticsPayload, createAnalyticsEvent?: CreateUIAnalyticsEvent | undefined) => void;
 export declare const resolvedEvent: (id: string, definitionId?: string | undefined, extensionKey?: string | undefined, resourceType?: string | undefined) => AnalyticsPayload;
 export declare const unresolvedEvent: (id: string, status: string, definitionId?: string | undefined, extensionKey?: string | undefined, resourceType?: string | undefined, error?: APIError | undefined) => AnalyticsPayload;
-export declare const invokeSucceededEvent: (id: string, extensionKey: string, actionType: string, display: CardInnerAppearance) => AnalyticsPayload;
-export declare const invokeFailedEvent: (id: string, extensionKey: string, actionType: string, display: CardInnerAppearance, reason: string) => AnalyticsPayload;
+export declare const invokeSucceededEvent: (id: string, actionType: string, display: CardInnerAppearance, extensionKey?: string | undefined) => AnalyticsPayload;
+export declare const invokeFailedEvent: (id: string, actionType: string, display: CardInnerAppearance, reason: string, extensionKey?: string | undefined) => AnalyticsPayload;
 export declare const connectSucceededEvent: (definitionId?: string | undefined, extensionKey?: string | undefined) => AnalyticsPayload;
 export declare const connectFailedEvent: (definitionId?: string | undefined, extensionKey?: string | undefined, reason?: string | undefined) => AnalyticsPayload;
 export declare const trackAppAccountConnected: (definitionId?: string | undefined, extensionKey?: string | undefined) => AnalyticsPayload;
 export declare const uiAuthEvent: (display: CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined) => AnalyticsPayload;
 export declare const uiAuthAlternateAccountEvent: (display: CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined) => AnalyticsPayload;
-export declare const uiCardClickedEvent: (display: CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined, isModifierKeyPressed?: boolean | undefined) => AnalyticsPayload;
-export declare const uiActionClickedEvent: (extensionKey: string, actionType: string, display?: CardInnerAppearance | undefined) => AnalyticsPayload;
+export declare const uiCardClickedEvent: (id: string, display: CardInnerAppearance, status: CardType, definitionId?: string | undefined, extensionKey?: string | undefined, isModifierKeyPressed?: boolean | undefined, location?: string | undefined, destinationProduct?: string | undefined) => AnalyticsPayload;
+export declare const uiActionClickedEvent: (actionType: string, extensionKey?: string | undefined, display?: CardInnerAppearance | undefined) => AnalyticsPayload;
 export declare const uiClosedAuthEvent: (display: CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined) => AnalyticsPayload;
 export declare const screenAuthPopupEvent: (definitionId?: string | undefined, extensionKey?: string | undefined) => AnalyticsPayload;
-export declare const uiRenderSuccessEvent: (display: CardInnerAppearance, definitionId?: string | undefined, extensionKey?: string | undefined) => AnalyticsPayload;
+export declare const uiRenderSuccessEvent: (display: CardInnerAppearance, status: CardType, definitionId?: string | undefined, extensionKey?: string | undefined) => AnalyticsPayload;
 export declare const uiRenderFailedEvent: (display: CardInnerAppearance, error: Error, errorInfo: ErrorInfo) => AnalyticsPayload;
-export declare const uiHoverCardViewedEvent: (hoverDisplay: PreviewDisplay, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: PreviewInvokeMethod | undefined) => AnalyticsPayload;
-export declare const uiHoverCardDismissedEvent: (hoverDisplay: PreviewDisplay, hoverTime: number, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: PreviewInvokeMethod | undefined) => AnalyticsPayload;
+export declare const uiHoverCardViewedEvent: (previewDisplay: PreviewDisplay, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: PreviewInvokeMethod | undefined) => AnalyticsPayload;
+export declare const uiHoverCardDismissedEvent: (previewDisplay: PreviewDisplay, hoverTime: number, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: PreviewInvokeMethod | undefined) => AnalyticsPayload;
 export declare const uiHoverCardOpenLinkClickedEvent: (previewDisplay: string, definitionId?: string | undefined, extensionKey?: string | undefined, previewInvokeMethod?: PreviewInvokeMethod | undefined) => AnalyticsPayload;

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

@@ -0,0 +1 @@
+export declare type DestinationProduct = 'jira' | 'confluence' | 'bitbucket' | 'trello';

package/dist/types/utils/performance.d.ts

@@ -3,6 +3,6 @@ export declare const getMarkName: (id: string, status: CardType) => string;
 export declare const getMeasureName: (id: string, status: CardType) => string;
 export declare const clearMarks: (id: string) => void;
 export declare const clearMeasures: (id: string) => void;
-export declare const getMeasure: (id: string, status: CardType) => PerformanceMeasure | undefined;
+export declare const getMeasure: (id: string, status: CardType) => PerformanceEntry | undefined;
 export declare const mark: (id: string, status: CardType) => void;
 export declare const create: (id: string, status: CardType) => void;

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

@@ -1,6 +1,6 @@
 import { GasPayload } from '@atlaskit/analytics-gas-types';
 import { CardInnerAppearance } from '../view/Card/types';
-export declare type AnalyticsAction = 'resolved' | 'unresolved' | 'connectSucceeded' | 'connectFailed' | 'connected' | 'clicked' | 'closed' | 'renderFailed' | 'renderWithStatus' | 'renderSuccess' | 'inserted' | 'viewed' | 'dismissed';
+export declare type AnalyticsAction = 'resolved' | 'unresolved' | 'connectSucceeded' | 'connectFailed' | 'connected' | 'clicked' | 'closed' | 'renderFailed' | 'renderWithStatus' | 'renderSuccess' | 'inserted' | 'viewed' | 'dismissed' | 'created';
 export declare type AnalyticsActionSubject = 'smartLink' | 'smartLinkAction' | 'applicationAccount' | 'button' | 'consentModal' | 'hoverCard';
 export declare type AnalyticsPayload = GasPayload & {
     action?: AnalyticsAction;

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

@@ -5,6 +5,7 @@ import { InvokeHandler } from '../../model/invoke-handler';
 import { AnalyticsHandler } from '../../utils/types';
 import { OnResolveCallback, CardPlatform } from '../Card/types';
 export declare type BlockCardProps = {
+    id: string;
     url: string;
     cardState: CardState;
     authFlow?: CardAuthFlowOpts['authFlow'];

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

@@ -1,5 +1,5 @@
 import React from 'react';
 import { CardAppearance, CardPlatform, CardProps } from './types';
 import { WrappedComponentProps } from 'react-intl-next';
-export declare const Card: React.ForwardRefExoticComponent<Pick<Omit<React.PropsWithChildren<import("react-intl-next").WithIntlProps<CardProps & WrappedComponentProps<"intl">>>, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps> & React.RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "children" | "data" | "appearance" | "testId" | "isSelected" | "inheritDimensions" | "onClick" | "analyticsContext" | "key" | "url" | "ui" | "showActions" | "onResolve" | "platform" | "isFrameVisible" | "embedIframeRef" | "forwardedRef" | "importer" | "container" | "inlinePreloaderStyle" | "showHoverPreview"> & React.RefAttributes<any>>;
+export declare const Card: React.ForwardRefExoticComponent<Pick<Omit<React.PropsWithChildren<import("react-intl-next").WithIntlProps<CardProps & WrappedComponentProps<"intl">>>, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps> & React.RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "children" | "data" | "appearance" | "testId" | "isSelected" | "inheritDimensions" | "id" | "onClick" | "analyticsContext" | "key" | "url" | "ui" | "showActions" | "onResolve" | "platform" | "isFrameVisible" | "embedIframeRef" | "forwardedRef" | "importer" | "container" | "inlinePreloaderStyle" | "showHoverPreview" | "analyticsEvents"> & React.RefAttributes<any>>;
 export type { CardAppearance, CardProps, CardPlatform };

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

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
 import { CardAppearance, CardPlatform } from '@atlaskit/linking-common';
+import { AnalyticsFacade } from '../../state/analytics';
 import { FlexibleUiOptions } from '../FlexibleCard/types';
 import { InlinePreloaderStyle } from '../types';
 export type { CardAppearance, CardPlatform };
@@ -12,6 +13,7 @@ export declare type OnResolveCallback = (data: {
 }) => void;
 export interface CardProps extends WithAnalyticsEventsProps {
     appearance: CardAppearance;
+    id?: string;
     platform?: CardPlatform;
     isSelected?: boolean;
     isFrameVisible?: boolean;
@@ -29,4 +31,5 @@ export interface CardProps extends WithAnalyticsEventsProps {
     ui?: FlexibleUiOptions;
     children?: React.ReactNode;
     showHoverPreview?: boolean;
+    analyticsEvents?: AnalyticsFacade;
 }

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

@@ -3,6 +3,7 @@ import { CardAppearance, OnResolveCallback } from '../Card/types';
 import { JsonLd } from 'json-ld-types';
 import { InlinePreloaderStyle } from '../types';
 export interface CardWithDataContentProps {
+    id?: string;
     appearance: CardAppearance;
     data: JsonLd.Data.BaseData;
     onClick?: EventHandler<MouseEvent | KeyboardEvent>;

package/dist/types/view/CardWithUrl/component.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import { CardWithUrlContentProps } from './types';
-export declare function CardWithUrlContent({ id, url, isSelected, isFrameVisible, platform, onClick, appearance, dispatchAnalytics, onResolve, testId, showActions, inheritDimensions, embedIframeRef, inlinePreloaderStyle, ui, children, showHoverPreview, }: CardWithUrlContentProps): JSX.Element;
+export declare function CardWithUrlContent({ id, url, isSelected, isFrameVisible, platform, onClick, appearance, dispatchAnalytics, onResolve, testId, showActions, inheritDimensions, embedIframeRef, inlinePreloaderStyle, ui, children, showHoverPreview, analyticsEvents, }: CardWithUrlContentProps): JSX.Element;

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

@@ -3,6 +3,7 @@ import { CardAppearance, CardPlatform, OnResolveCallback } from '../Card/types';
 import { AnalyticsHandler } from '../../utils/types';
 import { FlexibleUiOptions } from '../FlexibleCard/types';
 import { InlinePreloaderStyle } from '../types';
+import { AnalyticsFacade } from '../../state/analytics';
 export declare type CardWithUrlContentProps = {
     id: string;
     url: string;
@@ -22,4 +23,5 @@ export declare type CardWithUrlContentProps = {
     ui?: FlexibleUiOptions;
     children?: React.ReactNode;
     showHoverPreview?: boolean;
+    analyticsEvents?: AnalyticsFacade;
 };

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

@@ -13,6 +13,7 @@ export declare type EmbedCardProps = {
     handleFrameClick: React.EventHandler<React.MouseEvent | React.KeyboardEvent>;
     handleAnalytics: AnalyticsHandler;
     handleInvoke: InvokeHandler;
+    id?: string;
     isSelected?: boolean;
     isFrameVisible?: boolean;
     platform?: CardPlatform;

package/dist/types/view/FlexibleCard/components/elements/date-time/types.d.ts

@@ -9,4 +9,8 @@ export declare type DateTimeProps = ElementProps & {
      * The date to display in the element.
      */
     date?: Date;
+    /**
+     * The override text which will show next to the date
+     */
+    text?: string;
 };

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

@@ -6,6 +6,10 @@ import { SmartLinkSize, SmartLinkTheme } from '../../constants';
 import { CardAppearance } from '../../view/Card';
 import { OnResolveCallback } from '../Card/types';
 export declare type FlexibleCardProps = {
+    /**
+     * @internal A unique ID for a Smart Link.
+     */
+    id?: string;
     /**
      * Determines the appearance of the Smart Link.
      * @internal

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

@@ -1,4 +1,4 @@
 import React, { FC } from 'react';
 import { HoverCardProps } from './types';
 export declare const HoverCardComponent: FC<HoverCardProps>;
-export declare const HoverCard: React.ForwardRefExoticComponent<Pick<Omit<React.PropsWithChildren<HoverCardProps>, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps> & React.RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "children" | "analyticsContext" | "key" | "url"> & React.RefAttributes<any>>;
+export declare const HoverCard: React.ForwardRefExoticComponent<Pick<Omit<React.PropsWithChildren<HoverCardProps>, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps> & React.RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "children" | "id" | "analyticsContext" | "key" | "url"> & React.RefAttributes<any>>;

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

@@ -1,6 +1,7 @@
 import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
 import { ElementItem } from '../FlexibleCard/components/blocks/types';
 export interface HoverCardProps extends WithAnalyticsEventsProps {
+    id?: string;
     url: string;
 }
 export declare type PreviewDisplay = 'card' | 'embed';

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

@@ -1,2 +1,2 @@
 import { JsonLd } from 'json-ld-types';
-export declare const getSimulatedMetadata: (extensionKey: string) => JsonLd.Primitives.Property<any>;
+export declare const getSimulatedMetadata: (extensionKey?: string) => JsonLd.Primitives.Property<any>;

package/dist/types/view/InlineCard/ResolvedView/index.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
 import { LozengeProps } from '../../../types';
 export interface InlineCardResolvedViewProps {
+    /** A unique ID for a Smart Link. */
+    id?: string;
     /** The optional con of the service (e.g. Dropbox/Asana/Google/etc) to display */
     icon?: React.ReactNode;
     /** The name of the resource */

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

@@ -3,6 +3,7 @@ import { CardProviderRenderers } from '@atlaskit/link-provider';
 import { CardState } from '../../state/types';
 import { InlinePreloaderStyle } from '../types';
 export declare type InlineCardProps = {
+    id: string;
     url: string;
     cardState: CardState;
     handleAuthorize: (() => void) | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/smart-card",
-  "version": "19.1.13",
+  "version": "19.1.16",
   "description": "Smart card component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"