@atlaskit/smart-card 38.5.0 → 38.5.2

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

@@ -2,20 +2,55 @@ import _extends from "@babel/runtime/helpers/extends";
 import _typeof from "@babel/runtime/helpers/typeof";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _elementMappings;
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React, { useContext } from 'react';
-import { FormattedDate } from 'react-intl-next';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { ElementName, IconType, SmartLinkInternalTheme } from '../../../../constants';
 import { messages } from '../../../../messages';
 import { FlexibleUiContext, useFlexibleUiContext } from '../../../../state/flexible-ui-context';
-import { isProfileType } from '../../../../utils';
 import AppliedToComponentsCount from './applied-to-components-count-element';
-import AtlaskitElementBadge from './atlaskit-badge-element';
-import { BaseAvatarGroupElement, BaseBadgeElement, BaseDateTimeElement, BaseLinkElement, BaseLozengeElement, BaseTextElement } from './common';
-import IconElement from './icon-element';
+import assignedToElement from './assigned-to-element';
+import assignedToGroupElement from './assigned-to-group-element';
+import attachmentCountElement from './attachment-count-element';
+import authorGroupElement from './author-group-element';
+import checklistProgressElement from './checklist-progress-element';
+import collaboratorGroupElement from './collaborator-group-element';
+import commentCountElement from './comment-count-element';
+import { BaseAtlaskitBadgeElement, BaseAvatarGroupElement, BaseBadgeElement, BaseDateTimeElement, BaseIconElement, BaseLinkElement, BaseLozengeElement, BaseTextElement, toAtlaskitBadgeProps, toAvatarGroupProps, toBadgeProps, toDateLozengeProps, toDateTimeProps, toFormattedTextProps, toLinkIconProps, toLinkProps, toTextProps } from './common';
+import createdByElement from './created-by-element';
+import createdOnElement from './created-on-element';
+import dueOnElement from './due-on-element';
+import latestCommitElement from './latest-commit-element';
+import linkIconElement from './link-icon-element';
+import locationElement from './location-element';
 import MediaElement from './media-element';
+import modifiedByElement from './modified-by-element';
+import modifiedOnElement from './modified-on-element';
+import ownedByElement from './owned-by-element';
+import ownedByGroupElement from './owned-by-group-element';
+import previewElement from './preview-element';
+import priorityElement from './priority-element';
+import programmingLanguageElement from './programming-language-element';
+import providerElement from './provider-element';
+import reactCountElement from './react-count-element';
+import readTimeElement from './read-time-element';
+import sentOnElement from './sent-on-element';
+import sourceBranchElement from './source-branch-element';
+import stateElement from './state-element';
+import storyPointsElement from './story-points-element';
+import subTasksProgressElement from './sub-tasks-progress-element';
+import subscriberCountElement from './subscriber-count-element';
+import targetBranchElement from './target-branch-element';
+import titleElement from './title-element';
+import viewCountElement from './view-count-element';
+import voteCountElement from './vote-count-element';
+
+/**
+ * @deprecated remove on FG clean up platform-linking-flexible-card-elements-refactor
+ */
+
+/**
+ * @deprecated remove on FG clean up platform-linking-flexible-card-elements-refactor
+ */
 var elementMappings = (_elementMappings = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_elementMappings, ElementName.AppliedToComponentsCount, {
   component: AppliedToComponentsCount,
   props: {
@@ -25,105 +60,138 @@ var elementMappings = (_elementMappings = {}, _defineProperty(_defineProperty(_d
   component: BaseBadgeElement,
   props: {
     icon: IconType.Attachment
-  }
+  },
+  newComponent: attachmentCountElement
 }), ElementName.AuthorGroup, {
-  component: BaseAvatarGroupElement
+  component: BaseAvatarGroupElement,
+  newComponent: authorGroupElement
 }), ElementName.ChecklistProgress, {
   component: BaseBadgeElement,
   props: {
     icon: IconType.CheckItem
-  }
+  },
+  newComponent: checklistProgressElement
 }), ElementName.CollaboratorGroup, {
-  component: BaseAvatarGroupElement
+  component: BaseAvatarGroupElement,
+  newComponent: collaboratorGroupElement
 }), ElementName.CommentCount, {
   component: BaseBadgeElement,
   props: {
     icon: IconType.Comment
-  }
+  },
+  newComponent: commentCountElement
 }), ElementName.ViewCount, {
   component: BaseBadgeElement,
   props: {
     icon: IconType.View
-  }
+  },
+  newComponent: viewCountElement
 }), ElementName.ReactCount, {
   component: BaseBadgeElement,
   props: {
     icon: IconType.React
-  }
+  },
+  newComponent: reactCountElement
 }), ElementName.VoteCount, {
   component: BaseBadgeElement,
   props: {
     icon: IconType.Vote
-  }
+  },
+  newComponent: voteCountElement
 }), ElementName.CreatedBy, {
-  component: BaseTextElement
+  component: BaseTextElement,
+  newComponent: createdByElement
 }), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_elementMappings, ElementName.OwnedBy, {
-  component: BaseTextElement
+  component: BaseTextElement,
+  newComponent: ownedByElement
 }), ElementName.AssignedTo, {
-  component: BaseTextElement
+  component: BaseTextElement,
+  newComponent: assignedToElement
 }), ElementName.AssignedToGroup, {
-  component: BaseAvatarGroupElement
+  component: BaseAvatarGroupElement,
+  newComponent: assignedToGroupElement
 }), ElementName.OwnedByGroup, {
-  component: BaseAvatarGroupElement
+  component: BaseAvatarGroupElement,
+  newComponent: ownedByGroupElement
 }), ElementName.CreatedOn, {
-  component: BaseDateTimeElement
+  component: BaseDateTimeElement,
+  newComponent: createdOnElement
 }), ElementName.DueOn, {
-  component: BaseLozengeElement
+  component: BaseLozengeElement,
+  newComponent: dueOnElement
 }), ElementName.LatestCommit, {
   component: BaseBadgeElement,
   props: {
     icon: IconType.Commit
-  }
+  },
+  newComponent: latestCommitElement
 }), ElementName.LinkIcon, {
-  component: IconElement
+  component: BaseIconElement,
+  newComponent: linkIconElement
 }), ElementName.ModifiedBy, {
-  component: BaseTextElement
+  component: BaseTextElement,
+  newComponent: modifiedByElement
 }), ElementName.ModifiedOn, {
-  component: BaseDateTimeElement
+  component: BaseDateTimeElement,
+  newComponent: modifiedOnElement
 }), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_elementMappings, ElementName.Preview, {
-  component: MediaElement
+  component: MediaElement,
+  newComponent: previewElement
 }), ElementName.Priority, {
-  component: BaseBadgeElement
+  component: BaseBadgeElement,
+  newComponent: priorityElement
 }), ElementName.ProgrammingLanguage, {
   component: BaseBadgeElement,
   props: {
     icon: IconType.ProgrammingLanguage
-  }
+  },
+  newComponent: programmingLanguageElement
 }), ElementName.Provider, {
-  component: BaseBadgeElement
+  component: BaseBadgeElement,
+  newComponent: providerElement
 }), ElementName.ReadTime, {
-  component: BaseTextElement
+  component: BaseTextElement,
+  newComponent: readTimeElement
 }), ElementName.SentOn, {
-  component: BaseDateTimeElement
+  component: BaseDateTimeElement,
+  newComponent: sentOnElement
 }), ElementName.SourceBranch, {
-  component: BaseTextElement
+  component: BaseTextElement,
+  newComponent: sourceBranchElement
 }), ElementName.State, {
-  component: BaseLozengeElement
+  component: BaseLozengeElement,
+  newComponent: stateElement
 }), ElementName.SubscriberCount, {
   component: BaseBadgeElement,
   props: {
     icon: IconType.Subscriber
-  }
+  },
+  newComponent: subscriberCountElement
 }), ElementName.SubTasksProgress, {
   component: BaseBadgeElement,
   props: {
     icon: IconType.SubTasksProgress
-  }
+  },
+  newComponent: subTasksProgressElement
 }), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_elementMappings, ElementName.StoryPoints, {
-  component: AtlaskitElementBadge
+  component: BaseAtlaskitBadgeElement,
+  newComponent: storyPointsElement
 }), ElementName.TargetBranch, {
-  component: BaseTextElement
+  component: BaseTextElement,
+  newComponent: targetBranchElement
 }), ElementName.Title, {
-  component: BaseLinkElement
+  component: BaseLinkElement,
+  newComponent: titleElement
 }), ElementName.Location, {
   component: BaseLinkElement,
   props: {
     theme: SmartLinkInternalTheme.Grey
-  }
+  },
+  newComponent: locationElement
 }));
 
 /**
- * @deprecated
+ * @deprecated remove on FG clean up platform-linking-flexible-card-elements-refactor
  */
 var getContextKey = function getContextKey(name) {
   // Attempt to predict context prop name in advance to reduce the amount of
@@ -132,7 +200,7 @@ var getContextKey = function getContextKey(name) {
 };
 
 /**
- * @deprecated
+ * @deprecated remove on FG clean up platform-linking-flexible-card-elements-refactor
  */
 var getData = function getData(elementName, contextKey, context) {
   if (!context) {
@@ -183,6 +251,9 @@ var getData = function getData(elementName, contextKey, context) {
     case ElementName.TargetBranch:
       return toTextProps(data);
     case ElementName.Title:
+      if (fg('platform-linking-flexible-card-context')) {
+        return context.linkTitle;
+      }
       return toLinkProps(context.title, context.url);
     case ElementName.LinkIcon:
       if (fg('platform-linking-visual-refresh-v2')) {
@@ -193,95 +264,18 @@ var getData = function getData(elementName, contextKey, context) {
       return _typeof(data) === 'object' ? data : undefined;
   }
 };
-var toAvatarGroupProps = function toAvatarGroupProps(items, showFallbackAvatar) {
-  return items ? {
-    items: items
-  } : showFallbackAvatar ? {
-    items: []
-  } : undefined;
-};
-var toBadgeProps = function toBadgeProps(label) {
-  return label ? {
-    label: label
-  } : undefined;
-};
-var toAtlaskitBadgeProps = function toAtlaskitBadgeProps(value) {
-  return value ? {
-    value: value
-  } : undefined;
-};
-var toDateLozengeProps = function toDateLozengeProps(dateString) {
-  if (dateString) {
-    var text = Date.parse(dateString) ? /*#__PURE__*/React.createElement(FormattedDate, {
-      value: new Date(dateString),
-      year: "numeric",
-      month: "short",
-      day: "numeric",
-      formatMatcher: "best fit"
-    }) : dateString;
-    return {
-      text: text
-    };
-  }
-};
-var toDateTimeProps = function toDateTimeProps(type, dateString) {
-  return dateString ? {
-    date: new Date(dateString),
-    type: type
-  } : undefined;
-};
-var toFormattedTextProps = function toFormattedTextProps(descriptor, context) {
-  if (fg('platform-linking-additional-flexible-element-props')) {
-    return context ? {
-      message: {
-        descriptor: descriptor,
-        values: {
-          context: context
-        }
-      },
-      content: context
-    } : undefined;
-  }
-  return context ? {
-    message: {
-      descriptor: descriptor,
-      values: {
-        context: context
-      }
-    }
-  } : undefined;
-};
-var toLinkProps = function toLinkProps(text, url) {
-  return text ? {
-    text: text,
-    url: url
-  } : undefined;
-};
-var toTextProps = function toTextProps(content) {
-  return content ? {
-    content: content
-  } : undefined;
-};
-var toLinkIconProps = function toLinkIconProps(data, type) {
-  var isDataLinkIcon = function isDataLinkIcon(_data) {
-    return _typeof(_data) === 'object' && _data !== null && ('icon' in _data || 'url' in _data);
-  };
-  if (!isDataLinkIcon(data)) {
-    return _typeof(data) === 'object' ? data : undefined;
-  }
-  var isImageRound = isProfileType(type);
-  return _objectSpread(_objectSpread({}, data), {}, {
-    appearance: isImageRound ? 'round' : 'square'
-  });
-};
 
 /**
- * @deprecated
+ * @deprecated remove on FG platform-linking-flexible-card-elements-refactor clean up
  */
 export var createElement = function createElement(name) {
   var _ref = elementMappings[name] || {},
     BaseElement = _ref.component,
-    props = _ref.props;
+    props = _ref.props,
+    newComponent = _ref.newComponent;
+  if (newComponent && fg('platform-linking-flexible-card-elements-refactor')) {
+    return newComponent;
+  }
   var contextKey = getContextKey(name);
   if (!BaseElement) {
     throw Error("Element ".concat(name, " does not exist."));

package/dist/esm/view/FlexibleCard/components/elements/view-count-element/index.js

@@ -0,0 +1,16 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { ElementName, IconType } from '../../../../../constants';
+import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
+import { BaseBadgeElement, toBadgeProps } from '../common';
+var ViewCountElement = function ViewCountElement(props) {
+  var _context$viewCount;
+  var context = useFlexibleUiContext();
+  var data = context ? toBadgeProps((_context$viewCount = context.viewCount) === null || _context$viewCount === void 0 ? void 0 : _context$viewCount.toString()) : null;
+  return data ? /*#__PURE__*/React.createElement(BaseBadgeElement, _extends({
+    icon: IconType.View
+  }, data, props, {
+    name: ElementName.ViewCount
+  })) : null;
+};
+export default ViewCountElement;

package/dist/esm/view/FlexibleCard/components/elements/vote-count-element/index.js

@@ -0,0 +1,16 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { ElementName, IconType } from '../../../../../constants';
+import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
+import { BaseBadgeElement, toBadgeProps } from '../common';
+var VoteCountElement = function VoteCountElement(props) {
+  var _context$voteCount;
+  var context = useFlexibleUiContext();
+  var data = context ? toBadgeProps((_context$voteCount = context.voteCount) === null || _context$voteCount === void 0 ? void 0 : _context$voteCount.toString()) : null;
+  return data ? /*#__PURE__*/React.createElement(BaseBadgeElement, _extends({
+    icon: IconType.Vote
+  }, data, props, {
+    name: ElementName.VoteCount
+  })) : null;
+};
+export default VoteCountElement;

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

@@ -48,6 +48,7 @@ var FlexibleCard = function FlexibleCard(_ref) {
       response: details,
       id: id,
       onAuthorize: onAuthorize,
+      onClick: onClick,
       origin: origin,
       renderers: renderers,
       resolve: resolve,
@@ -55,7 +56,7 @@ var FlexibleCard = function FlexibleCard(_ref) {
       status: status,
       url: url
     });
-  }, [aiSummaryConfig, appearance, details, fireEvent, id, onAuthorize, origin, renderers, actionOptions, resolve, status, url]);
+  }, [aiSummaryConfig, appearance, fireEvent, details, id, onAuthorize, onClick, origin, renderers, resolve, actionOptions, status, url]);
   var flexibleCardContext = fg('platform-linking-flexible-card-context') ?
   // eslint-disable-next-line react-hooks/rules-of-hooks
   useMemo(function () {
@@ -67,7 +68,9 @@ var FlexibleCard = function FlexibleCard(_ref) {
   }, [context, status, ui]) : undefined;
   var retry = fg('platform-linking-flexible-card-unresolved-action') ? undefined : getRetryOptions(url, status, details, onAuthorize);
   var _ref2 = context || {},
-    title = _ref2.title;
+    linkTitle = _ref2.linkTitle,
+    titleOld = _ref2.title;
+  var title = fg('platform-linking-flexible-card-context') ? linkTitle === null || linkTitle === void 0 ? void 0 : linkTitle.text : titleOld;
   useEffect(function () {
     switch (status) {
       case SmartLinkStatus.Resolved:

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

@@ -1,9 +1,10 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import { extractProvider, extractSmartLinkProvider, isEntityPresent } from '@atlaskit/link-extractors';
+import { extractProvider, extractSmartLinkProvider } from '@atlaskit/link-extractors';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { InternalActionName, SmartLinkStatus } from '../../constants';
 import { extractRequestAccessContextImproved } from '../../extractors/common/context';
 import extractFlexibleUiContext from '../../extractors/flexible';
+import extractLinkTitle from '../../extractors/flexible/extract-link-title';
 import extractPreview, { extractSmartLinkPreviewImage } from '../../extractors/flexible/extract-preview';
 import { extractErrorIcon } from '../../extractors/flexible/icon';
 import extractProviderIcon, { extractSmartLinkProviderIcon } from '../../extractors/flexible/icon/extract-provider-icon';
@@ -12,13 +13,17 @@ import { handleOnClick } from '../../utils';
 import { getEmptyJsonLd, getForbiddenJsonLd } from '../../utils/jsonld';
 export var getContextByStatus = function getContextByStatus(params) {
   var _ref = params !== null && params !== void 0 ? params : {},
+    onClick = _ref.onClick,
     response = _ref.response,
     status = _ref.status,
     url = _ref.url;
   switch (status) {
     case SmartLinkStatus.Pending:
     case SmartLinkStatus.Resolving:
-      return {
+      return fg('platform-linking-flexible-card-context') ? {
+        linkTitle: extractLinkTitle(status, url, response, onClick),
+        url: url
+      } : {
         title: url,
         url: url
       };
@@ -30,26 +35,14 @@ export var getContextByStatus = function getContextByStatus(params) {
     case SmartLinkStatus.Errored:
     case SmartLinkStatus.Fallback:
     default:
-      var actions = fg('platform-linking-flexible-card-unresolved-action') ? _defineProperty({}, InternalActionName.UnresolvedAction, getRetryOptions(url, status, response, params.onAuthorize)) : undefined;
-      if (fg('smart_links_noun_support')) {
-        if (isEntityPresent(response)) {
-          return {
-            url: url,
-            title: url,
-            linkIcon: extractErrorIcon(response, status),
-            preview: extractSmartLinkPreviewImage(response),
-            provider: extractSmartLinkProviderIcon(response),
-            actions: actions
-          };
-        }
-      }
       return {
         url: url,
-        title: url,
+        title: fg('platform-linking-flexible-card-context') ? undefined : url,
         linkIcon: extractErrorIcon(response, status),
-        preview: extractPreview(response === null || response === void 0 ? void 0 : response.data),
-        provider: extractProviderIcon(response === null || response === void 0 ? void 0 : response.data),
-        actions: actions
+        linkTitle: fg('platform-linking-flexible-card-context') ? extractLinkTitle(status, url, response, onClick) : undefined,
+        preview: fg('smart_links_noun_support') ? extractSmartLinkPreviewImage(response) : extractPreview(response === null || response === void 0 ? void 0 : response.data),
+        provider: fg('smart_links_noun_support') ? extractSmartLinkProviderIcon(response) : extractProviderIcon(response === null || response === void 0 ? void 0 : response.data),
+        actions: fg('platform-linking-flexible-card-unresolved-action') ? _defineProperty({}, InternalActionName.UnresolvedAction, getRetryOptions(url, status, response, params.onAuthorize)) : undefined
       };
   }
 };

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

@@ -1,6 +1,7 @@
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { useAnalyticsEvents as useAnalyticsEventsNext } from '@atlaskit/analytics-next';
 import { useSmartLinkContext } from '@atlaskit/link-provider';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { useAnalyticsEvents } from '../../../common/analytics/generated/use-analytics-events';
 import { CardDisplay, SmartLinkPosition, SmartLinkSize } from '../../../constants';
 import { getDefinitionId, getExtensionKey, getServices } from '../../../state/helpers';
@@ -8,7 +9,7 @@ import { useSmartCardState } from '../../../state/store';
 import { isSpecialEvent } from '../../../utils';
 import { getIsAISummaryEnabled } from '../../../utils/ai-summary';
 import { fireLinkClickedEvent } from '../../../utils/analytics/click';
-import { flexibleUiOptions } from '../styled';
+import { flexibleUiOptions, flexibleUiOptionsOld } from '../styled';
 import { getMetadata } from '../utils';
 import ContentContainer from './ContentContainer';
 import HoverCardForbiddenView from './views/forbidden';
@@ -112,7 +113,7 @@ var HoverCardContent = function HoverCardContent(_ref) {
     origin: 'smartLinkPreviewHoverCard',
     renderers: renderers,
     actionOptions: actionOptions,
-    ui: flexibleUiOptions,
+    ui: fg('platform-linking-flexible-card-context') ? flexibleUiOptions : flexibleUiOptionsOld,
     url: url,
     children: null
   };

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

@@ -52,32 +52,39 @@ var HoverCardForbiddenView = function HoverCardForbiddenView(_ref) {
   var ButtonComponent = fg('platform-smart-card-remove-legacy-button') ? Button : ButtonOld;
   return /*#__PURE__*/React.createElement(FlexibleCard, _extends({}, flexibleCardProps, {
     testId: testId
-  }), /*#__PURE__*/React.createElement(PreviewBlock, {
+  }), /*#__PURE__*/React.createElement(PreviewBlock, _extends({
     ignoreContainerPadding: true,
-    testId: testId,
-    status: SmartLinkStatus.Forbidden,
+    testId: testId
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Forbidden
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') ? "_13lipd34 _qrwqpd34 _otyru2gc" : "_13lipd34 _qrwqpd34 _otyrcxkx"])
-  }), /*#__PURE__*/React.createElement(CustomBlock, {
-    testId: "".concat(testId, "-title"),
-    status: SmartLinkStatus.Forbidden,
+  })), /*#__PURE__*/React.createElement(CustomBlock, _extends({
+    testId: "".concat(testId, "-title")
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Forbidden
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') ? "_1bah1h6o _k48p1pd9 _19pku2gc" : "_1bah1h6o _k48p1pd9 _19pku2gc"])
-  }, /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[titleMessageKey], {
+  }), /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[titleMessageKey], {
     values: {
       product: product
     }
-  }))), /*#__PURE__*/React.createElement(CustomBlock, {
-    testId: "".concat(testId, "-content"),
-    status: SmartLinkStatus.Forbidden,
+  }))), /*#__PURE__*/React.createElement(CustomBlock, _extends({
+    testId: "".concat(testId, "-content")
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Forbidden
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') ? "_11c8dcr7 _1e0c1nu9 _1bah1h6o _19pkze3t _y3gn1h6o" : "_11c8dcr7 _1e0c1nu9 _1bah1h6o _19pkze3t _y3gn1h6o"])
-  }, /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[descriptiveMessageKey], {
+  }), /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[descriptiveMessageKey], {
     values: {
       product: product,
       hostname: hostname
     }
-  }))), action && /*#__PURE__*/React.createElement(CustomBlock, {
-    status: SmartLinkStatus.Forbidden,
+  }))), action && /*#__PURE__*/React.createElement(CustomBlock, _extends({}, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Forbidden
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') ? "_1bah1h6o _19pku2gc" : "_1bah1h6o _19pku2gc"])
-  }, /*#__PURE__*/React.createElement(ButtonComponent, {
+  }), /*#__PURE__*/React.createElement(ButtonComponent, {
     testId: "".concat(testId, "-button"),
     onClick: action === null || action === void 0 ? void 0 : action.promise,
     appearance: "primary",

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

@@ -64,33 +64,41 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
     fallbackElementHeight: snippetHeight.current,
     response: cardState.details
   });
-  var snippet = imagePreview ? null : /*#__PURE__*/React.createElement(SnippetBlock, {
-    status: SmartLinkStatus.Resolved,
+  var snippet = imagePreview ? null : /*#__PURE__*/React.createElement(SnippetBlock, _extends({}, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Resolved
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') && "_ca0q1b66"])
-  });
+  }));
   var aiSummaryMinHeight = snippet ? snippetHeight.current : 0;
   return /*#__PURE__*/React.createElement(FlexibleCard, flexibleCardProps, imagePreview, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockProps, {
-    metadataPosition: SmartLinkPosition.Top,
-    status: SmartLinkStatus.Resolved,
+    metadataPosition: SmartLinkPosition.Top
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Resolved
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') ? "_zulpu2gc _quenze3t _oebj1txw _13mh1pd9" : "_zulpu2gc _quenui7n _oebj1txw _x7z0u2gc _1ljqu2gc _13mh1pd9"])
-  })), /*#__PURE__*/React.createElement(MetadataBlock, {
+  })), /*#__PURE__*/React.createElement(MetadataBlock, _extends({
     primary: primary,
     secondary: secondary,
     maxLines: 1,
-    size: SmartLinkSize.Medium,
-    status: SmartLinkStatus.Resolved,
+    size: SmartLinkSize.Medium
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Resolved
+  }, {
     className: ax([!fg('platform-linking-visual-refresh-v1') && "_zulpidpf _2aco1o8v _fmt31ohn _yklxcxkx _w3mucxkx _ia0l11wp _3tmpcxkx"])
-  }), isAISummaryEnabled ? /*#__PURE__*/React.createElement(AISummaryBlock, {
+  })), isAISummaryEnabled ? /*#__PURE__*/React.createElement(AISummaryBlock, _extends({
     aiSummaryMinHeight: aiSummaryMinHeight,
-    placeholder: snippet,
+    placeholder: snippet
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
     status: SmartLinkStatus.Resolved
-  }) : snippet, /*#__PURE__*/React.createElement(SnippetBlock, {
+  })) : snippet, /*#__PURE__*/React.createElement(SnippetBlock, _extends({
     testId: "hidden-snippet",
     onRender: onSnippetRender,
-    blockRef: snippetBlockRef,
-    status: SmartLinkStatus.Resolved,
+    blockRef: snippetBlockRef
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Resolved
+  }, {
     className: ax(["_3um015vq _kqswstnw"])
-  }), /*#__PURE__*/React.createElement(ActionBlock, {
+  })), /*#__PURE__*/React.createElement(ActionBlock, {
     onClick: onActionClick,
     spaceInline: "space.100",
     className: ax([fg('platform-linking-visual-refresh-v1') && "_n3td1b66"])

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

@@ -6,7 +6,7 @@ import React from 'react';
 import { CustomBlock } from '../../../../FlexibleCard/components/blocks';
 import ActionGroup from '../../../../FlexibleCard/components/blocks/action-group';
 import { LoadingSkeleton } from '../../../../FlexibleCard/components/common/loading-skeleton';
-import IconElement from '../../../../FlexibleCard/components/elements/icon-element';
+import { BaseIconElement } from '../../../../FlexibleCard/components/elements/common';
 import { CARD_WIDTH_REM } from '../../../styled';
 var loadingViewContainer = null;
 var skeletonContainer = null;
@@ -31,7 +31,7 @@ var HoverCardLoadingView = function HoverCardLoadingView(_ref) {
   }, /*#__PURE__*/React.createElement(CustomBlock, _extends({}, titleBlockProps, {
     testId: "".concat(testId, "-title-block"),
     className: ax(["_zulpcxkx _1bsb1osq"])
-  }), /*#__PURE__*/React.createElement(IconElement, {
+  }), /*#__PURE__*/React.createElement(BaseIconElement, {
     render: function render() {
       return /*#__PURE__*/React.createElement(LoadingSkeleton, null);
     },

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

@@ -2,10 +2,22 @@ import { layers } from '@atlaskit/theme/constants';
 import { SmartLinkSize } from '../../constants';
 // Temporary fix for Confluence inline comment on editor mod has z-index of 500, Jira issue view has z-index of 510
 export var HOVER_CARD_Z_INDEX = layers.modal();
+
+/**
+ * @deprecated Remove on platform-linking-flexible-card-context cleanup
+ */
+export var flexibleUiOptionsOld = {
+  hideBackground: true,
+  hideElevation: true,
+  hideLegacyButton: true,
+  size: SmartLinkSize.Medium,
+  zIndex: HOVER_CARD_Z_INDEX + 1
+};
 export var flexibleUiOptions = {
   hideBackground: true,
   hideElevation: true,
   hideLegacyButton: true,
+  removeBlockRestriction: true,
   size: SmartLinkSize.Medium,
   zIndex: HOVER_CARD_Z_INDEX + 1
 };