@atlaskit/smart-card 26.2.1 → 26.2.2

package/dist/esm/state/hooks/use-resolve/index.js

@@ -1,9 +1,11 @@
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { useCallback } from 'react';
+import { unstable_batchedUpdates } from 'react-dom';
 import { addMetadataToExperience } from '../../analytics';
 import { getStatus } from '../../helpers';
 import { ACTION_ERROR, ACTION_ERROR_FALLBACK, ACTION_RELOADING, ACTION_RESOLVED, ACTION_UPDATE_METADATA_STATUS, APIError, cardAction } from '@atlaskit/linking-common';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { ERROR_MESSAGE_FATAL, ERROR_MESSAGE_METADATA, ERROR_MESSAGE_OAUTH } from '../../actions/constants';
 import { getUnauthorizedJsonLd } from '../../../utils/jsonld';
 import { SmartLinkStatus } from '../../../constants';
@@ -73,6 +75,20 @@ var useResolve = function useResolve() {
       }
     }
   }, [getState, setMetadataStatus, dispatch]);
+  var handleResolvedLinkSuccess = useCallback(function (resourceUrl, response, isReloading, isMetadataRequest) {
+    //if a link resolves normally, metadata will also always be resolved
+    setMetadataStatus(resourceUrl, 'resolved');
+    // Dispatch Analytics and resolved card action - including unauthorized states.
+    if (isReloading) {
+      dispatch(cardAction(ACTION_RELOADING, {
+        url: resourceUrl
+      }, response));
+    } else {
+      dispatch(cardAction(ACTION_RESOLVED, {
+        url: resourceUrl
+      }, response, undefined, undefined, isMetadataRequest));
+    }
+  }, [setMetadataStatus, dispatch]);
   var handleResolvedLinkResponse = useCallback(function (resourceUrl, response) {
     var isReloading = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     var isMetadataRequest = arguments.length > 3 ? arguments[3] : undefined;
@@ -97,20 +113,20 @@ var useResolve = function useResolve() {
       handleResolvedLinkError(resourceUrl, new APIError('error', hostname, ERROR_MESSAGE_METADATA), response, isMetadataRequest);
       return;
     }
-
-    //if a link resolves normally, metadata will also always be resolved
-    setMetadataStatus(resourceUrl, 'resolved');
-    // Dispatch Analytics and resolved card action - including unauthorized states.
-    if (isReloading) {
-      dispatch(cardAction(ACTION_RELOADING, {
-        url: resourceUrl
-      }, response));
+    if (getBooleanFF('platform.linking-platform.smart-card.enable-analytics-context')) {
+      /**
+       * Using unstable_batchedUpdates because this store update happens async and trigers a rerender
+       * more info:
+       * https://github.com/facebook/react/blob/v18.2.0/packages/use-sync-external-store/src/useSyncExternalStoreShimClient.js#L113
+       * https://react-redux.js.org/api/batch
+       */
+      unstable_batchedUpdates(function () {
+        handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
+      });
     } else {
-      dispatch(cardAction(ACTION_RESOLVED, {
-        url: resourceUrl
-      }, response, undefined, undefined, isMetadataRequest));
+      handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
     }
-  }, [dispatch, handleResolvedLinkError, hasAuthFlowSupported, setMetadataStatus]);
+  }, [handleResolvedLinkError, handleResolvedLinkSuccess, hasAuthFlowSupported]);
   return useCallback( /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(url) {
       var isReloading,

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

@@ -0,0 +1,36 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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; }
+import React, { useMemo } from 'react';
+import { AnalyticsContext } from '@atlaskit/analytics-next';
+import { getResolvedAttributes, getUrlAttributes } from '@atlaskit/link-analytics/resolved-attributes';
+import { isFlexibleUiCard } from '../flexible';
+import { CardDisplay } from '../../constants';
+import { useSmartCardState as useSmartLinkState } from '../../state/store';
+export var SmartLinkAnalyticsContext = function SmartLinkAnalyticsContext(_ref) {
+  var children = _ref.children,
+    url = _ref.url,
+    appearance = _ref.appearance,
+    id = _ref.id;
+  var _useSmartLinkState = useSmartLinkState(url),
+    details = _useSmartLinkState.details,
+    status = _useSmartLinkState.status;
+  var resolvedAttributes = getResolvedAttributes({
+    url: url
+  }, details, status);
+  var _getUrlAttributes = getUrlAttributes(url),
+    urlHash = _getUrlAttributes.urlHash;
+  var isFlexibleUi = useMemo(function () {
+    return isFlexibleUiCard(children);
+  }, [children]);
+  var display = isFlexibleUi ? CardDisplay.Flexible : appearance;
+  return /*#__PURE__*/React.createElement(AnalyticsContext, {
+    data: {
+      attributes: _objectSpread(_objectSpread({}, resolvedAttributes), {}, {
+        urlHash: urlHash,
+        display: display,
+        id: id
+      })
+    }
+  }, children);
+};

package/dist/esm/version.json

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

package/dist/esm/view/BlockCard/actions/PreviewAction.js

@@ -3,7 +3,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 var _excluded = ["popupMountPointId", "onClose"],
-  _excluded2 = ["details"];
+  _excluded2 = ["details", "enableImprovedPreviewAction"];
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 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; }
@@ -70,10 +70,12 @@ function _previewFunction() {
 }
 export default (function (_ref2) {
   var details = _ref2.details,
+    enableImprovedPreviewAction = _ref2.enableImprovedPreviewAction,
     rest = _objectWithoutProperties(_ref2, _excluded2);
+  var previewText = enableImprovedPreviewAction ? messages.preview_improved : messages.preview;
   return {
     id: 'preview-content',
-    text: /*#__PURE__*/React.createElement(FormattedMessage, messages.preview),
+    text: /*#__PURE__*/React.createElement(FormattedMessage, previewText),
     promise: function promise(props) {
       return previewFunction(_objectSpread(_objectSpread({
         popupMountPointId: 'twp-editor-preview-iframe',

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

@@ -24,6 +24,7 @@ import FlexibleForbiddenView from './views/flexible/FlexibleForbiddenView';
 import { tokens } from '../../utils/token';
 import { css, jsx } from '@emotion/react';
 import { handleClickCommon } from './utils/handlers';
+import { useFeatureFlag } from '@atlaskit/link-provider';
 export { default as PreviewAction } from './actions/PreviewAction';
 export { ForbiddenAction, AuthorizeAction, BlockCardResolvedView, BlockCardResolvingView, BlockCardUnauthorisedView, BlockCardForbiddenView, BlockCardErroredView, BlockCardNotFoundView };
 var flexibleBlockCardElevationStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  border-radius: 1.5px;\n  box-shadow: ", ";\n  margin: 2px;\n"])), tokens.elevation);
@@ -58,6 +59,7 @@ export var BlockCard = function BlockCard(_ref) {
     handleInvoke: handleInvoke,
     extensionKey: extensionKey
   };
+  var enableImprovedPreviewAction = Boolean(useFeatureFlag('enableImprovedPreviewAction'));
   if (enableFlexibleBlockCard) {
     var ui = {
       hideElevation: true
@@ -140,7 +142,7 @@ export var BlockCard = function BlockCard(_ref) {
         isSelected: isSelected
       });
     case 'resolved':
-      var resolvedViewProps = extractBlockProps(data, meta, extractorOpts, renderers, platform);
+      var resolvedViewProps = extractBlockProps(data, meta, extractorOpts, renderers, platform, enableImprovedPreviewAction);
       if (onResolve) {
         onResolve({
           title: resolvedViewProps.title,

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

@@ -1,6 +1,7 @@
 import React, { useEffect, useCallback, useMemo } from 'react';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import { useFeatureFlag } from '@atlaskit/link-provider';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { isSpecialEvent } from '../../utils';
 import * as measure from '../../utils/performance';
 import { getDefinitionId, getServices, isFinalState, getClickUrl, getResourceType, getExtensionKey, getSubproduct, getProduct } from '../../state/helpers';
@@ -12,7 +13,8 @@ import { isFlexibleUiCard } from '../../utils/flexible';
 import FlexibleCard from '../FlexibleCard';
 import { CardDisplay } from '../../constants';
 import { fireLinkClickedEvent } from '../../utils/analytics/click';
-export function CardWithUrlContent(_ref) {
+import { SmartLinkAnalyticsContext } from '../../utils/analytics/SmartLinkAnalyticsContext';
+function Component(_ref) {
   var id = _ref.id,
     url = _ref.url,
     isSelected = _ref.isSelected,
@@ -258,4 +260,11 @@ export function CardWithUrlContent(_ref) {
         onIframeFocus: onIframeFocus
       });
   }
-}
+}
+export var CardWithUrlContent = function CardWithUrlContent(props) {
+  return getBooleanFF('platform.linking-platform.smart-card.enable-analytics-context') ? /*#__PURE__*/React.createElement(SmartLinkAnalyticsContext, {
+    url: props.url,
+    appearance: props.appearance,
+    id: props.id
+  }, /*#__PURE__*/React.createElement(Component, props)) : /*#__PURE__*/React.createElement(Component, props);
+};

package/dist/esm/view/FlexibleCard/components/actions/action/preview-action/index.js

@@ -7,6 +7,9 @@ import Action from '../index';
 import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
 import { useSmartLinkAnalytics } from '../../../../../../state';
 import { openPreviewModal } from '../../../../../EmbedModal/utils';
+import { FormattedMessage } from 'react-intl-next';
+import { messages } from '../../../../../../messages';
+import { useFeatureFlag } from '@atlaskit/link-provider';
 var PreviewAction = function PreviewAction(props) {
   var appearance = props.appearance,
     asDropDownItem = props.asDropDownItem,
@@ -21,6 +24,8 @@ var PreviewAction = function PreviewAction(props) {
     isSupportTheming = props.isSupportTheming;
   var defaultAnalytics = useSmartLinkAnalytics(url, function () {});
   var analytics = useFlexibleUiAnalyticsContext() || defaultAnalytics;
+  var enableImprovedPreviewAction = Boolean(useFeatureFlag('enableImprovedPreviewAction'));
+  var previewText = enableImprovedPreviewAction ? messages.preview_improved : messages.preview;
   if (src && url) {
     var embedModal = function embedModal() {
       return openPreviewModal({
@@ -39,7 +44,8 @@ var PreviewAction = function PreviewAction(props) {
         if (_onClick) {
           _onClick();
         }
-      }
+      },
+      content: /*#__PURE__*/React.createElement(FormattedMessage, previewText)
     });
     return /*#__PURE__*/React.createElement(Action, _extends({}, action, {
       appearance: appearance,

package/dist/esm/view/FlexibleCard/components/actions/utils.js

@@ -47,7 +47,7 @@ var actionMappings = (_actionMappings = {}, _defineProperty(_actionMappings, Act
     testId: 'smart-action-preview-action',
     content: /*#__PURE__*/React.createElement(FormattedMessage, messages.preview),
     icon: /*#__PURE__*/React.createElement(VidFullScreenOnIcon, {
-      label: "Full screen view"
+      label: "Open preview"
     }),
     tooltipMessage: /*#__PURE__*/React.createElement(FormattedMessage, messages.preview)
   }

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

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 /** @jsx jsx */
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import Popup from '@atlaskit/popup';
 import { jsx } from '@emotion/react';
 import React, { useCallback, useMemo, useRef } from 'react';
@@ -10,9 +11,11 @@ import { useSmartCardState as useLinkState } from '../../../state/store';
 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';
 export var HoverCardComponent = function HoverCardComponent(_ref) {
   var children = _ref.children,
     url = _ref.url,
+    id = _ref.id,
     analyticsHandler = _ref.analyticsHandler,
     analytics = _ref.analytics,
     _ref$canOpen = _ref.canOpen,
@@ -122,7 +125,23 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
   }, [closeOnChildClick, hideCard]);
   var content = useCallback(function (_ref2) {
     var update = _ref2.update;
-    return jsx(HoverCardContent, {
+    return 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,
@@ -134,7 +153,7 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
       showServerActions: showServerActions,
       url: url
     });
-  }, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url]);
+  }, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url, id]);
   var trigger = useCallback(function (triggerProps) {
     return jsx("span", {
       ref: parentSpan

package/dist/esm/view/HoverCard/components/views/resolved/index.js

@@ -1,3 +1,6 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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; }
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { useFeatureFlag } from '@atlaskit/link-provider';
 import { extractType } from '@atlaskit/linking-common/extractors';
@@ -8,8 +11,27 @@ import FlexibleCard from '../../../../FlexibleCard';
 import { getSimulatedMetadata, toActionableMetadata } from '../../../utils';
 import SnippetOrPreview from '../../SnippetOrPreview';
 import { extractMetadata } from '../../../../../extractors/hover/extractMetadata';
-export var toFooterActions = function toFooterActions(cardActions, onActionClick) {
+import { messages } from '../../../../../messages';
+import { FormattedMessage } from 'react-intl-next';
+export var toFooterActions = function toFooterActions(cardActions, onActionClick, enableImprovedPreviewAction) {
+  var appearance = enableImprovedPreviewAction ? {
+    appearance: 'primary'
+  } : undefined;
+  var previewText = enableImprovedPreviewAction ? messages.preview_improved : messages.preview;
   return cardActions.map(function (action) {
+    if (action.id === 'preview-content') {
+      return _objectSpread({
+        content: /*#__PURE__*/React.createElement(FormattedMessage, previewText),
+        name: ActionName.CustomAction,
+        onClick: function onClick() {
+          if (onActionClick) {
+            onActionClick(action.id);
+          }
+          return action.invoke();
+        },
+        testId: action.id
+      }, appearance);
+    }
     return {
       content: action.text,
       name: ActionName.CustomAction,
@@ -37,6 +59,7 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
     onActionClick = _ref.onActionClick,
     extensionKey = _ref.extensionKey;
   var showActionableElement = useFeatureFlag('enableActionableElement');
+  var enableImprovedPreviewAction = useFeatureFlag('enableImprovedPreviewAction');
   useEffect(function () {
     // Since this hover view is only rendered on resolved status,
     // there is no need to check for statuses.
@@ -46,8 +69,8 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
     });
   }, [analytics.ui, cardState.status]);
   var footerActions = useMemo(function () {
-    return toFooterActions(cardActions, onActionClick);
-  }, [cardActions, onActionClick]);
+    return toFooterActions(cardActions, onActionClick, Boolean(enableImprovedPreviewAction));
+  }, [cardActions, onActionClick, enableImprovedPreviewAction]);
   var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
   var _useMemo = useMemo(function () {
       var types = data ? extractType(data) : undefined;

package/dist/types/extractors/block/index.d.ts

@@ -5,6 +5,6 @@ import { ExtractBlockOpts } from './types';
 import { CardPlatform } from '../../view/Card';
 import { BlockCardResolvedViewProps } from '../../view/BlockCard';
 import { ActionProps } from '../../view/BlockCard/components/Action';
-export declare const extractBlockActions: (props: BlockCardResolvedViewProps, jsonLd: JsonLd.Data.BaseData, opts?: ExtractBlockOpts, platform?: CardPlatform, meta?: JsonLd.Meta.BaseMeta) => ActionProps[];
+export declare const extractBlockActions: (props: BlockCardResolvedViewProps, jsonLd: JsonLd.Data.BaseData, opts?: ExtractBlockOpts, platform?: CardPlatform, meta?: JsonLd.Meta.BaseMeta, enableImprovedPreviewAction?: boolean) => ActionProps[];
 export declare const extractBlockUsers: (jsonLd: JsonLd.Data.BaseData) => LinkPerson[] | undefined;
-export declare const extractBlockProps: (jsonLd: JsonLd.Data.BaseData, meta?: JsonLd.Meta.BaseMeta, opts?: ExtractBlockOpts, renderers?: CardProviderRenderers, platform?: CardPlatform) => BlockCardResolvedViewProps;
+export declare const extractBlockProps: (jsonLd: JsonLd.Data.BaseData, meta?: JsonLd.Meta.BaseMeta, opts?: ExtractBlockOpts, renderers?: CardProviderRenderers, platform?: CardPlatform, enableImprovedPreviewAction?: boolean) => BlockCardResolvedViewProps;

package/dist/types/extractors/block/types.d.ts

@@ -9,4 +9,5 @@ export interface ExtractBlockOpts {
     extensionKey?: string;
     source?: CardInnerAppearance;
     testId?: string;
+    enableImprovedPreviewAction?: boolean;
 }

package/dist/types/extractors/common/actions/extractPreviewAction.d.ts

@@ -2,7 +2,7 @@ import { JsonLd } from 'json-ld-types';
 import { CardPlatform } from '../../../view/Card/types';
 import { BlockCardResolvedViewProps } from '../../../view/BlockCard';
 import { ExtractBlockOpts } from '../../block/types';
-export declare const extractPreviewAction: ({ extensionKey, viewProps, jsonLd, handleInvoke, testId, platform, origin, source, analytics, meta, }: ExtractBlockOpts & {
+export declare const extractPreviewAction: ({ extensionKey, viewProps, jsonLd, handleInvoke, testId, platform, origin, source, analytics, meta, enableImprovedPreviewAction, }: ExtractBlockOpts & {
     viewProps: BlockCardResolvedViewProps;
     jsonLd: JsonLd.Data.BaseData;
     platform?: JsonLd.Primitives.Platforms | undefined;

package/dist/types/messages.d.ts

@@ -1,6 +1,6 @@
 import { MessageDescriptor } from 'react-intl-next';
 export type RequestAccessMessageKey = 'click_to_join' | 'click_to_join_description' | 'forbidden_description' | 'request_access' | 'request_access_description' | 'request_access_pending' | 'request_access_pending_description' | 'request_denied_description';
-export type MessageKey = 'cannot_find_link' | 'connect_link_account_card' | 'connect_link_account_card_name' | 'connect_link_account_card_description' | 'connect_unauthorised_account_action' | 'connect_unauthorised_account_description' | 'connect_unauthorised_account_description_no_provider' | 'continue' | 'copy_url_to_clipboard' | 'could_not_load_link' | 'download' | 'go_back' | 'invalid_permissions' | 'invalid_permissions_description' | 'join_to_view' | 'connect_link_account' | 'created_by' | 'created_on_relative' | 'created_on_absolute' | 'check_this_link' | 'delete' | 'edit' | 'learn_more_about_smart_links' | 'loading' | 'link_safety_warning_message' | 'modified_by' | 'modified_on_relative' | 'modified_on_absolute' | 'more_actions' | 'not_found_title' | 'not_found_description' | 'open_issue_in_jira' | 'open_link_in_a_new_tab' | 'owned_by' | 'preview' | 'preview_close' | 'preview_max_size' | 'preview_min_size' | 'priority_blocker' | 'priority_critical' | 'priority_high' | 'priority_highest' | 'priority_low' | 'priority_lowest' | 'priority_major' | 'priority_medium' | 'priority_minor' | 'priority_trivial' | 'priority_undefined' | 'forbidden_access' | 'pending_request' | 'restricted_link' | 'request_access_to_view' | 'request_denied' | 'status_change_load_error' | 'status_change_permission_error' | 'status_change_update_error' | 'try_again' | 'try_another_account' | 'view' | 'viewIn' | 'viewOriginal' | 'actions' | 'add_account' | 'cancel' | 'close' | 'connect_to' | 'connect_account_description' | 'retry' | 'save' | 'unlink_account' | RequestAccessMessageKey;
+export type MessageKey = 'cannot_find_link' | 'connect_link_account_card' | 'connect_link_account_card_name' | 'connect_link_account_card_description' | 'connect_unauthorised_account_action' | 'connect_unauthorised_account_description' | 'connect_unauthorised_account_description_no_provider' | 'continue' | 'copy_url_to_clipboard' | 'could_not_load_link' | 'download' | 'go_back' | 'invalid_permissions' | 'invalid_permissions_description' | 'join_to_view' | 'connect_link_account' | 'created_by' | 'created_on_relative' | 'created_on_absolute' | 'check_this_link' | 'delete' | 'edit' | 'learn_more_about_smart_links' | 'loading' | 'link_safety_warning_message' | 'modified_by' | 'modified_on_relative' | 'modified_on_absolute' | 'more_actions' | 'not_found_title' | 'not_found_description' | 'open_issue_in_jira' | 'open_link_in_a_new_tab' | 'owned_by' | 'preview_improved' | 'preview' | 'preview_close' | 'preview_max_size' | 'preview_min_size' | 'priority_blocker' | 'priority_critical' | 'priority_high' | 'priority_highest' | 'priority_low' | 'priority_lowest' | 'priority_major' | 'priority_medium' | 'priority_minor' | 'priority_trivial' | 'priority_undefined' | 'forbidden_access' | 'pending_request' | 'restricted_link' | 'request_access_to_view' | 'request_denied' | 'status_change_load_error' | 'status_change_permission_error' | 'status_change_update_error' | 'try_again' | 'try_another_account' | 'view' | 'viewIn' | 'viewOriginal' | 'actions' | 'add_account' | 'cancel' | 'close' | 'connect_to' | 'connect_account_description' | 'retry' | 'save' | 'unlink_account' | RequestAccessMessageKey;
 type Messages = {
     [K in MessageKey]: MessageDescriptor;
 };

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

@@ -0,0 +1,9 @@
+import { FC } from 'react';
+import { CardInnerAppearance } from '../../view/Card/types';
+type SmartLinkAnalyticsContextProps = {
+    url: string;
+    appearance: CardInnerAppearance;
+    id: string | undefined;
+};
+export declare const SmartLinkAnalyticsContext: FC<SmartLinkAnalyticsContextProps>;
+export {};

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

@@ -26,6 +26,7 @@ type PreviewInfo = {
     analytics: AnalyticsFacade;
     origin?: AnalyticsOrigin;
     isSupportTheming?: boolean;
+    enableImprovedPreviewAction?: boolean;
 };
-declare const _default: ({ details, ...rest }: PreviewInfo) => ActionProps;
+declare const _default: ({ details, enableImprovedPreviewAction, ...rest }: PreviewInfo) => ActionProps;
 export default _default;

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

@@ -30,6 +30,8 @@ export interface ResolvedViewProps {
     isTrusted?: boolean;
     /** It determines whether a link source supports different design theme modes */
     isSupportTheming?: boolean;
+    /** Determines whether a preview action's text should display 'Open preview' or 'Full screen view' */
+    enableImprovedPreviewAction?: boolean;
 }
 export declare const blockCardResolvedViewClassName = "block-card-resolved-view";
 export declare const blockCardResolvedViewByClassName = "block-card-resolved-view-by";

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, frameStyle, platform, onClick, appearance, dispatchAnalytics, onResolve, onError, testId, showActions, showServerActions: showServerActionsProp, inheritDimensions, embedIframeRef, embedIframeUrlType, inlinePreloaderStyle, ui, children, showHoverPreview, showAuthTooltip: showAuthTooltipProp, analyticsEvents, }: CardWithUrlContentProps): JSX.Element;
+export declare const CardWithUrlContent: (props: CardWithUrlContentProps) => JSX.Element;

package/dist/types/view/HoverCard/components/views/resolved/index.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { ActionItem } from '../../../../FlexibleCard/components/blocks/types';
 import { LinkAction } from '../../../../../state/hooks-external/useSmartLinkActions';
 import { HoverCardResolvedProps } from './types';
-export declare const toFooterActions: (cardActions: LinkAction[], onActionClick?: ((actionId: string) => void) | undefined) => ActionItem[];
+export declare const toFooterActions: (cardActions: LinkAction[], onActionClick?: ((actionId: string) => void) | undefined, enableImprovedPreviewAction?: boolean) => ActionItem[];
 declare const HoverCardResolvedView: React.FC<HoverCardResolvedProps>;
 export default HoverCardResolvedView;

package/dist/types-ts4.5/extractors/block/index.d.ts

@@ -5,6 +5,6 @@ import { ExtractBlockOpts } from './types';
 import { CardPlatform } from '../../view/Card';
 import { BlockCardResolvedViewProps } from '../../view/BlockCard';
 import { ActionProps } from '../../view/BlockCard/components/Action';
-export declare const extractBlockActions: (props: BlockCardResolvedViewProps, jsonLd: JsonLd.Data.BaseData, opts?: ExtractBlockOpts, platform?: CardPlatform, meta?: JsonLd.Meta.BaseMeta) => ActionProps[];
+export declare const extractBlockActions: (props: BlockCardResolvedViewProps, jsonLd: JsonLd.Data.BaseData, opts?: ExtractBlockOpts, platform?: CardPlatform, meta?: JsonLd.Meta.BaseMeta, enableImprovedPreviewAction?: boolean) => ActionProps[];
 export declare const extractBlockUsers: (jsonLd: JsonLd.Data.BaseData) => LinkPerson[] | undefined;
-export declare const extractBlockProps: (jsonLd: JsonLd.Data.BaseData, meta?: JsonLd.Meta.BaseMeta, opts?: ExtractBlockOpts, renderers?: CardProviderRenderers, platform?: CardPlatform) => BlockCardResolvedViewProps;
+export declare const extractBlockProps: (jsonLd: JsonLd.Data.BaseData, meta?: JsonLd.Meta.BaseMeta, opts?: ExtractBlockOpts, renderers?: CardProviderRenderers, platform?: CardPlatform, enableImprovedPreviewAction?: boolean) => BlockCardResolvedViewProps;

package/dist/types-ts4.5/extractors/block/types.d.ts

@@ -9,4 +9,5 @@ export interface ExtractBlockOpts {
     extensionKey?: string;
     source?: CardInnerAppearance;
     testId?: string;
+    enableImprovedPreviewAction?: boolean;
 }

package/dist/types-ts4.5/extractors/common/actions/extractPreviewAction.d.ts

@@ -2,7 +2,7 @@ import { JsonLd } from 'json-ld-types';
 import { CardPlatform } from '../../../view/Card/types';
 import { BlockCardResolvedViewProps } from '../../../view/BlockCard';
 import { ExtractBlockOpts } from '../../block/types';
-export declare const extractPreviewAction: ({ extensionKey, viewProps, jsonLd, handleInvoke, testId, platform, origin, source, analytics, meta, }: ExtractBlockOpts & {
+export declare const extractPreviewAction: ({ extensionKey, viewProps, jsonLd, handleInvoke, testId, platform, origin, source, analytics, meta, enableImprovedPreviewAction, }: ExtractBlockOpts & {
     viewProps: BlockCardResolvedViewProps;
     jsonLd: JsonLd.Data.BaseData;
     platform?: JsonLd.Primitives.Platforms | undefined;

package/dist/types-ts4.5/messages.d.ts

@@ -1,6 +1,6 @@
 import { MessageDescriptor } from 'react-intl-next';
 export type RequestAccessMessageKey = 'click_to_join' | 'click_to_join_description' | 'forbidden_description' | 'request_access' | 'request_access_description' | 'request_access_pending' | 'request_access_pending_description' | 'request_denied_description';
-export type MessageKey = 'cannot_find_link' | 'connect_link_account_card' | 'connect_link_account_card_name' | 'connect_link_account_card_description' | 'connect_unauthorised_account_action' | 'connect_unauthorised_account_description' | 'connect_unauthorised_account_description_no_provider' | 'continue' | 'copy_url_to_clipboard' | 'could_not_load_link' | 'download' | 'go_back' | 'invalid_permissions' | 'invalid_permissions_description' | 'join_to_view' | 'connect_link_account' | 'created_by' | 'created_on_relative' | 'created_on_absolute' | 'check_this_link' | 'delete' | 'edit' | 'learn_more_about_smart_links' | 'loading' | 'link_safety_warning_message' | 'modified_by' | 'modified_on_relative' | 'modified_on_absolute' | 'more_actions' | 'not_found_title' | 'not_found_description' | 'open_issue_in_jira' | 'open_link_in_a_new_tab' | 'owned_by' | 'preview' | 'preview_close' | 'preview_max_size' | 'preview_min_size' | 'priority_blocker' | 'priority_critical' | 'priority_high' | 'priority_highest' | 'priority_low' | 'priority_lowest' | 'priority_major' | 'priority_medium' | 'priority_minor' | 'priority_trivial' | 'priority_undefined' | 'forbidden_access' | 'pending_request' | 'restricted_link' | 'request_access_to_view' | 'request_denied' | 'status_change_load_error' | 'status_change_permission_error' | 'status_change_update_error' | 'try_again' | 'try_another_account' | 'view' | 'viewIn' | 'viewOriginal' | 'actions' | 'add_account' | 'cancel' | 'close' | 'connect_to' | 'connect_account_description' | 'retry' | 'save' | 'unlink_account' | RequestAccessMessageKey;
+export type MessageKey = 'cannot_find_link' | 'connect_link_account_card' | 'connect_link_account_card_name' | 'connect_link_account_card_description' | 'connect_unauthorised_account_action' | 'connect_unauthorised_account_description' | 'connect_unauthorised_account_description_no_provider' | 'continue' | 'copy_url_to_clipboard' | 'could_not_load_link' | 'download' | 'go_back' | 'invalid_permissions' | 'invalid_permissions_description' | 'join_to_view' | 'connect_link_account' | 'created_by' | 'created_on_relative' | 'created_on_absolute' | 'check_this_link' | 'delete' | 'edit' | 'learn_more_about_smart_links' | 'loading' | 'link_safety_warning_message' | 'modified_by' | 'modified_on_relative' | 'modified_on_absolute' | 'more_actions' | 'not_found_title' | 'not_found_description' | 'open_issue_in_jira' | 'open_link_in_a_new_tab' | 'owned_by' | 'preview_improved' | 'preview' | 'preview_close' | 'preview_max_size' | 'preview_min_size' | 'priority_blocker' | 'priority_critical' | 'priority_high' | 'priority_highest' | 'priority_low' | 'priority_lowest' | 'priority_major' | 'priority_medium' | 'priority_minor' | 'priority_trivial' | 'priority_undefined' | 'forbidden_access' | 'pending_request' | 'restricted_link' | 'request_access_to_view' | 'request_denied' | 'status_change_load_error' | 'status_change_permission_error' | 'status_change_update_error' | 'try_again' | 'try_another_account' | 'view' | 'viewIn' | 'viewOriginal' | 'actions' | 'add_account' | 'cancel' | 'close' | 'connect_to' | 'connect_account_description' | 'retry' | 'save' | 'unlink_account' | RequestAccessMessageKey;
 type Messages = {
     [K in MessageKey]: MessageDescriptor;
 };

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

@@ -0,0 +1,9 @@
+import { FC } from 'react';
+import { CardInnerAppearance } from '../../view/Card/types';
+type SmartLinkAnalyticsContextProps = {
+    url: string;
+    appearance: CardInnerAppearance;
+    id: string | undefined;
+};
+export declare const SmartLinkAnalyticsContext: FC<SmartLinkAnalyticsContextProps>;
+export {};

package/dist/types-ts4.5/view/BlockCard/actions/PreviewAction.d.ts

@@ -26,6 +26,7 @@ type PreviewInfo = {
     analytics: AnalyticsFacade;
     origin?: AnalyticsOrigin;
     isSupportTheming?: boolean;
+    enableImprovedPreviewAction?: boolean;
 };
-declare const _default: ({ details, ...rest }: PreviewInfo) => ActionProps;
+declare const _default: ({ details, enableImprovedPreviewAction, ...rest }: PreviewInfo) => ActionProps;
 export default _default;

package/dist/types-ts4.5/view/BlockCard/views/ResolvedView.d.ts

@@ -30,6 +30,8 @@ export interface ResolvedViewProps {
     isTrusted?: boolean;
     /** It determines whether a link source supports different design theme modes */
     isSupportTheming?: boolean;
+    /** Determines whether a preview action's text should display 'Open preview' or 'Full screen view' */
+    enableImprovedPreviewAction?: boolean;
 }
 export declare const blockCardResolvedViewClassName = "block-card-resolved-view";
 export declare const blockCardResolvedViewByClassName = "block-card-resolved-view-by";

package/dist/types-ts4.5/view/CardWithUrl/component.d.ts

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

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

@@ -2,6 +2,6 @@ import React from 'react';
 import { ActionItem } from '../../../../FlexibleCard/components/blocks/types';
 import { LinkAction } from '../../../../../state/hooks-external/useSmartLinkActions';
 import { HoverCardResolvedProps } from './types';
-export declare const toFooterActions: (cardActions: LinkAction[], onActionClick?: ((actionId: string) => void) | undefined) => ActionItem[];
+export declare const toFooterActions: (cardActions: LinkAction[], onActionClick?: ((actionId: string) => void) | undefined, enableImprovedPreviewAction?: boolean) => ActionItem[];
 declare const HoverCardResolvedView: React.FC<HoverCardResolvedProps>;
 export default HoverCardResolvedView;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/smart-card",
-  "version": "26.2.1",
+  "version": "26.2.2",
   "description": "Smart card component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -41,14 +41,16 @@
     "@atlaskit/icon-object": "^6.3.0",
     "@atlaskit/icon-priority": "^6.3.0",
     "@atlaskit/in-product-testing": "^0.2.0",
+    "@atlaskit/link-analytics": "^8.0.2",
     "@atlaskit/link-client-extension": "^1.1.0",
-    "@atlaskit/linking-common": "^2.11.0",
+    "@atlaskit/linking-common": "^2.12.0",
     "@atlaskit/linking-types": "^1.6.0",
     "@atlaskit/logo": "^13.14.0",
     "@atlaskit/lozenge": "^11.4.0",
     "@atlaskit/media-common": "^4.1.0",
     "@atlaskit/modal-dialog": "^12.5.0",
     "@atlaskit/outbound-auth-flow-client": "^3.4.0",
+    "@atlaskit/platform-feature-flags": "^0.2.1",
     "@atlaskit/popup": "^1.6.0",
     "@atlaskit/spinner": "^15.5.0",
     "@atlaskit/theme": "^12.5.0",
@@ -83,7 +85,7 @@
     "@atlaskit/field-base": "^15.2.0",
     "@atlaskit/form": "^8.11.0",
     "@atlaskit/inline-message": "^11.5.0",
-    "@atlaskit/link-test-helpers": "^2.3.0",
+    "@atlaskit/link-test-helpers": "^2.4.0",
     "@atlaskit/lozenge": "^11.4.0",
     "@atlaskit/media-integration-test-helpers": "^2.6.0",
     "@atlaskit/media-test-helpers": "^33.0.0",
@@ -99,6 +101,7 @@
     "@atlaskit/toggle": "^12.6.0",
     "@atlaskit/visual-regression": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
+    "@atlassian/feature-flags-test-utils": "^0.1.1",
     "@testing-library/dom": "^8.17.1",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^12.1.5",
@@ -135,6 +138,11 @@
     "./link-url": "./src/linkUrl.ts",
     ".": "./src/index.ts"
   },
+  "platform-feature-flags": {
+    "platform.linking-platform.smart-card.enable-analytics-context": {
+      "type": "boolean"
+    }
+  },
   "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1",
   "techstack": {
     "@repo/internal": {