@atlaskit/smart-card 26.67.0 → 26.68.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/smart-card
 
+## 26.68.0
+
+### Minor Changes
+
+-   [#100572](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100572)
+    [`f7db86ab4de9`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f7db86ab4de9) -
+    [ux] Remove footer AI icon tooltip and realign AI information quality tooltip
+
+### Patch Changes
+
+-   [#99219](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/99219)
+    [`3df318ff4439`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3df318ff4439) -
+    Hover preview: Move resolved view redesign into its own separate component
+
 ## 26.67.0
 
 ### Minor Changes

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

@@ -22,7 +22,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
 var context = exports.context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.67.0"
+  packageVersion: "26.68.0"
 };
 var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/cjs/view/FlexibleCard/components/actions/action/action-stack-item/index.js

@@ -17,6 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var buttonStyles = (0, _primitives.xcss)({
   all: 'unset',
+  cursor: 'pointer',
   padding: 'space.050',
   width: '100%',
   ':focus:not(:focus-visible)': {

package/dist/cjs/view/FlexibleCard/components/actions/automation-action/index.js

@@ -41,16 +41,17 @@ var AutomationAction = function AutomationAction(props) {
   var automationActionTitle = /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.automation_action_title);
   var automationActionTooltip = /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.automation_action_tooltip);
   var automationActionIconLabel = formatMessage(_messages.messages.automation_action_icon_label);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_action.default, (0, _extends2.default)({}, data, props, {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_action.default, (0, _extends2.default)({
     content: automationActionTitle,
     icon: /*#__PURE__*/_react.default.createElement(_manaulTriggersIcon.default, {
       label: automationActionIconLabel
     }),
-    onClick: function onClick() {
-      return handleAutomateActionClick(setIsModalOpen);
-    },
     testId: "smart-action-automation-action",
     tooltipMessage: automationActionTooltip
+  }, data, props, {
+    onClick: function onClick() {
+      return handleAutomateActionClick(setIsModalOpen);
+    }
   })));
 };
 var _default = exports.default = AutomationAction;

package/dist/cjs/view/FlexibleCard/components/blocks/ai-footer-block/resolved/ai-footer-metadata.js

@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.AIFooterMetadata = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _reactMagneticDi = require("react-magnetic-di");
 var _reactIntlNext = require("react-intl-next");
-var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _primitives = require("@atlaskit/primitives");
-var _aiStateIndicator = _interopRequireDefault(require("../../ai-summary-block/ai-state-indicator"));
+var _aiIcon = _interopRequireDefault(require("../../../../../common/ai-icon"));
 var _info = require("../icons/info");
 var _messages = require("../../../../../../messages");
 var _useAiSummary = require("../../../../../../state/hooks/use-ai-summary");
@@ -35,16 +35,16 @@ var AIFooterMetadata = exports.AIFooterMetadata = function AIFooterMetadata(_ref
     grow: "fill"
   }, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
     content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.ai_summarized_info_short),
-    position: "top"
+    position: "bottom"
   }, function (tooltipProps) {
     return /*#__PURE__*/_react.default.createElement(_primitives.Box, tooltipProps, /*#__PURE__*/_react.default.createElement(_info.InfoIcon, {
       label: "Information",
       size: "small",
       primaryColor: "var(--ds-icon-subtle, #626F86)"
     }));
-  }), /*#__PURE__*/_react.default.createElement(_aiStateIndicator.default, {
-    appearance: "icon-only",
-    state: "done",
-    testId: "ai-tooltip"
+  }), /*#__PURE__*/_react.default.createElement(_aiIcon.default, {
+    label: "AI",
+    size: "small",
+    primaryColor: "var(--ds-icon-subtle, #626F86)"
   }));
 };

package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js

@@ -73,7 +73,8 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
     testId = props.testId,
     _props$aiSummaryMinHe = props.aiSummaryMinHeight,
     aiSummaryMinHeight = _props$aiSummaryMinHe === void 0 ? 0 : _props$aiSummaryMinHe,
-    metadata = props.metadata;
+    metadata = props.metadata,
+    placeholder = props.placeholder;
   var _useAnalyticsEvents = (0, _useAnalyticsEvents2.useAnalyticsEvents)(),
     fireEvent = _useAnalyticsEvents.fireEvent;
   var context = (0, _flexibleUiContext.useFlexibleUiContext)();
@@ -99,6 +100,7 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
   status === 'loading' && !!content;
   var isSummarisedOnMountRef = (0, _react.useRef)(status === 'done');
   var isErroredOnMountRef = (0, _react.useRef)(status === 'error');
+  var minHeight = (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.hover-card-action-redesign') && isSummarisedOnMountRef.current ? 0 : aiSummaryMinHeight;
   (0, _react.useEffect)(function () {
     // if the error was apparent on mount and the status is changed to loading we can
     // clear the initial error on mount state
@@ -141,6 +143,9 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
       });
     }
   }, [onActionMenuOpenChange]);
+  if (!showAISummary && (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.hover-card-action-redesign')) {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, placeholder);
+  }
   return /*#__PURE__*/_react.default.createElement(_block.default, (0, _extends2.default)({}, props, {
     direction: _constants.SmartLinkDirection.Vertical,
     testId: "".concat(testId, "-resolved-view")
@@ -154,12 +159,12 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
   }), status === 'done' && /*#__PURE__*/_react.default.createElement(_aiEventSummaryViewed.default, {
     fromCache: isSummarisedOnMountRef.current
   }), /*#__PURE__*/_react.default.createElement(_motionWrapper.default, {
-    minHeight: aiSummaryMinHeight,
+    minHeight: minHeight,
     show: showAISummary,
     showTransition: !isSummarisedOnMountRef.current
   }, /*#__PURE__*/_react.default.createElement(_aiSummary.default, {
     testId: "".concat(testId, "-ai-summary"),
-    minHeight: aiSummaryMinHeight,
+    minHeight: minHeight,
     content: content,
     showIcon: !(0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.hover-card-action-redesign') && isSummarisedOnMountRef.current
   })), !(0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.hover-card-action-redesign') && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_primitives.Inline, {

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

@@ -23,6 +23,7 @@ var _utils2 = require("../utils");
 var _resolving = _interopRequireDefault(require("./views/resolving"));
 var _unauthorised = _interopRequireDefault(require("./views/unauthorised"));
 var _resolved = _interopRequireDefault(require("./views/resolved"));
+var _redesign = _interopRequireDefault(require("./views/resolved/redesign"));
 var _reactIntlNext = require("react-intl-next");
 var _messages = require("../../../messages");
 var _click = require("../../../utils/analytics/click");
@@ -191,6 +192,18 @@ var HoverCardContent = function HoverCardContent(_ref) {
       });
     }
     if (cardState.status === 'resolved') {
+      if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.hover-card-action-redesign')) {
+        return (0, _react.jsx)(_redesign.default, {
+          analytics: analytics,
+          cardState: cardState,
+          extensionKey: extensionKey,
+          flexibleCardProps: flexibleCardProps,
+          isAISummaryEnabled: isAISummaryEnabled,
+          onActionClick: onActionClick,
+          titleBlockProps: titleBlockProps,
+          url: url
+        });
+      }
       return (0, _react.jsx)(_resolved.default, {
         id: id,
         url: url,

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

@@ -86,7 +86,7 @@ var ConnectedAIBlock = function ConnectedAIBlock(_ref) {
   return showData ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !imagePreview && /*#__PURE__*/_react.default.createElement(_blocks.SnippetBlock, {
     testId: 'connected-AI',
     status: _constants.SmartLinkStatus.Resolved
-  }), !(0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.hover-card-action-redesign') && /*#__PURE__*/_react.default.createElement(_blocks.MetadataBlock, {
+  }), /*#__PURE__*/_react.default.createElement(_blocks.MetadataBlock, {
     primary: bottomPrimary,
     size: _constants.SmartLinkSize.Large,
     overrideCss: _styled.metadataBlockCss,
@@ -145,7 +145,6 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref2) {
     data: data,
     fallbackElementHeight: snippetHeight.current
   });
-  var isActionBlockEnabled = (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.hover-card-action-redesign') ? true : false;
   return /*#__PURE__*/_react.default.createElement(_FlexibleCard.default, flexibleCardProps, imagePreview, /*#__PURE__*/_react.default.createElement(_blocks.TitleBlock, (0, _extends2.default)({}, titleBlockProps, {
     metadataPosition: _constants.SmartLinkPosition.Top
   })), /*#__PURE__*/_react.default.createElement(_blocks.MetadataBlock, {
@@ -173,7 +172,7 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref2) {
     onRender: onSnippetRender,
     blockRef: snippetBlockRef,
     overrideCss: _styled.hiddenSnippetStyles
-  }), !isAISummaryEnabled && !isActionBlockEnabled && /*#__PURE__*/_react.default.createElement(_blocks.MetadataBlock, {
+  }), !isAISummaryEnabled && /*#__PURE__*/_react.default.createElement(_blocks.MetadataBlock, {
     primary: tertiary,
     size: _constants.SmartLinkSize.Large,
     overrideCss: _styled.metadataBlockCss,
@@ -188,10 +187,7 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref2) {
     }],
     actions: footerActions,
     aiSummaryMinHeight: connectedAIBlockHeight.current
-  }), isActionBlockEnabled && /*#__PURE__*/_react.default.createElement(_blocks.ActionBlock, {
-    onClick: onActionClick,
-    spaceInline: "space.100"
-  }), isActionBlockEnabled && /*#__PURE__*/_react.default.createElement(_blocks.AIFooterBlock, null), !isAISummaryEnabled && !isActionBlockEnabled && /*#__PURE__*/_react.default.createElement(_blocks.FooterBlock, {
+  }), !isAISummaryEnabled && /*#__PURE__*/_react.default.createElement(_blocks.FooterBlock, {
     actions: footerActions,
     size: _constants.SmartLinkSize.Large,
     overrideCss: _styled.footerBlockCss

package/dist/cjs/view/HoverCard/components/views/resolved/redesign.js

@@ -0,0 +1,81 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireWildcard(require("react"));
+var _constants = require("../../../../../constants");
+var _helpers = require("../../../../../state/helpers");
+var _FlexibleCard = _interopRequireDefault(require("../../../../FlexibleCard"));
+var _blocks = require("../../../../FlexibleCard/components/blocks");
+var _utils = require("../../../utils");
+var _ImagePreview = _interopRequireDefault(require("../../ImagePreview"));
+var _styled = require("./styled");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
+  var _cardState$details;
+  var analytics = _ref.analytics,
+    cardState = _ref.cardState,
+    extensionKey = _ref.extensionKey,
+    flexibleCardProps = _ref.flexibleCardProps,
+    isAISummaryEnabled = _ref.isAISummaryEnabled,
+    onActionClick = _ref.onActionClick,
+    titleBlockProps = _ref.titleBlockProps;
+  var canBeDatasource = (0, _helpers.getCanBeDatasource)(cardState.details);
+  (0, _react.useEffect)(function () {
+    // Since this hover view is only rendered on resolved status,
+    // there is no need to check for statuses.
+    analytics.ui.renderSuccessEvent({
+      display: _constants.CardDisplay.HoverCardPreview,
+      status: cardState.status,
+      canBeDatasource: canBeDatasource
+    });
+  }, [analytics.ui, cardState.status, canBeDatasource]);
+  var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
+  var _useMemo = (0, _react.useMemo)(function () {
+      return (0, _utils.getMetadata)(extensionKey, data);
+    }, [data, extensionKey]),
+    primary = _useMemo.primary,
+    secondary = _useMemo.secondary;
+  var snippetHeight = _react.default.useRef(0);
+  var snippetBlockRef = (0, _react.useRef)(null);
+  var onSnippetRender = (0, _react.useCallback)(function () {
+    var _snippetBlockRef$curr, _snippetBlockRef$curr2;
+    snippetHeight.current = (_snippetBlockRef$curr = (_snippetBlockRef$curr2 = snippetBlockRef.current) === null || _snippetBlockRef$curr2 === void 0 ? void 0 : _snippetBlockRef$curr2.getBoundingClientRect().height) !== null && _snippetBlockRef$curr !== void 0 ? _snippetBlockRef$curr : 0;
+  }, []);
+  var imagePreview = (0, _ImagePreview.default)({
+    data: data,
+    fallbackElementHeight: snippetHeight.current
+  });
+  var snippet = imagePreview ? null : /*#__PURE__*/_react.default.createElement(_blocks.SnippetBlock, {
+    status: _constants.SmartLinkStatus.Resolved
+  });
+  var aiSummaryMinHeight = snippet ? snippetHeight.current : 0;
+  return /*#__PURE__*/_react.default.createElement(_FlexibleCard.default, flexibleCardProps, imagePreview, /*#__PURE__*/_react.default.createElement(_blocks.TitleBlock, (0, _extends2.default)({}, titleBlockProps, {
+    metadataPosition: _constants.SmartLinkPosition.Top
+  })), /*#__PURE__*/_react.default.createElement(_blocks.MetadataBlock, {
+    primary: primary,
+    secondary: secondary,
+    overrideCss: _styled.metadataBlockCss,
+    maxLines: 1,
+    size: _constants.SmartLinkSize.Medium
+  }), isAISummaryEnabled ? /*#__PURE__*/_react.default.createElement(_blocks.AISummaryBlock, {
+    aiSummaryMinHeight: aiSummaryMinHeight,
+    placeholder: snippet,
+    status: _constants.SmartLinkStatus.Resolved
+  }) : snippet, /*#__PURE__*/_react.default.createElement(_blocks.SnippetBlock, {
+    testId: "hidden-snippet",
+    onRender: onSnippetRender,
+    blockRef: snippetBlockRef,
+    overrideCss: _styled.hiddenSnippetStyles
+  }), /*#__PURE__*/_react.default.createElement(_blocks.ActionBlock, {
+    onClick: onActionClick,
+    spaceInline: "space.100"
+  }), /*#__PURE__*/_react.default.createElement(_blocks.AIFooterBlock, null));
+};
+var _default = exports.default = HoverCardResolvedView;

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

@@ -17,7 +17,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId"],
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.67.0",
+  packageVersion: "26.68.0",
   componentName: 'linkUrl'
 };
 var Link = (0, _click.withLinkClickedEvent)('a');

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

@@ -4,7 +4,7 @@ export const ANALYTICS_CHANNEL = 'media';
 export const context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.67.0"
+  packageVersion: "26.68.0"
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/es2019/view/FlexibleCard/components/actions/action/action-stack-item/index.js

@@ -7,6 +7,7 @@ import { getPrimitivesInlineSpaceBySize } from '../../../utils';
 import ActionIcon from '../action-icon';
 const buttonStyles = xcss({
   all: 'unset',
+  cursor: 'pointer',
   padding: 'space.050',
   width: '100%',
   ':focus:not(:focus-visible)': {

package/dist/es2019/view/FlexibleCard/components/actions/automation-action/index.js

@@ -28,14 +28,15 @@ const AutomationAction = props => {
   const automationActionTitle = /*#__PURE__*/React.createElement(FormattedMessage, messages.automation_action_title);
   const automationActionTooltip = /*#__PURE__*/React.createElement(FormattedMessage, messages.automation_action_tooltip);
   const automationActionIconLabel = formatMessage(messages.automation_action_icon_label);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Action, _extends({}, data, props, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Action, _extends({
     content: automationActionTitle,
     icon: /*#__PURE__*/React.createElement(AutomationManualTriggersGlyph, {
       label: automationActionIconLabel
     }),
-    onClick: () => handleAutomateActionClick(setIsModalOpen),
     testId: "smart-action-automation-action",
     tooltipMessage: automationActionTooltip
+  }, data, props, {
+    onClick: () => handleAutomateActionClick(setIsModalOpen)
   })));
 };
 export default AutomationAction;

package/dist/es2019/view/FlexibleCard/components/blocks/ai-footer-block/resolved/ai-footer-metadata.js

@@ -1,9 +1,9 @@
 import React from 'react';
+import Tooltip from '@atlaskit/tooltip';
 import { di } from 'react-magnetic-di';
 import { FormattedMessage } from 'react-intl-next';
-import Tooltip from '@atlaskit/tooltip';
 import { Box, Inline } from '@atlaskit/primitives';
-import AIStateIndicator from '../../ai-summary-block/ai-state-indicator';
+import AIIcon from '../../../../../common/ai-icon';
 import { InfoIcon } from '../icons/info';
 import { messages } from '../../../../../../messages';
 import { useAISummary } from '../../../../../../state/hooks/use-ai-summary';
@@ -32,14 +32,14 @@ export const AIFooterMetadata = ({
     grow: "fill"
   }, /*#__PURE__*/React.createElement(Tooltip, {
     content: /*#__PURE__*/React.createElement(FormattedMessage, messages.ai_summarized_info_short),
-    position: "top"
+    position: "bottom"
   }, tooltipProps => /*#__PURE__*/React.createElement(Box, tooltipProps, /*#__PURE__*/React.createElement(InfoIcon, {
     label: "Information",
     size: "small",
     primaryColor: "var(--ds-icon-subtle, #626F86)"
-  }))), /*#__PURE__*/React.createElement(AIStateIndicator, {
-    appearance: "icon-only",
-    state: "done",
-    testId: "ai-tooltip"
+  }))), /*#__PURE__*/React.createElement(AIIcon, {
+    label: "AI",
+    size: "small",
+    primaryColor: "var(--ds-icon-subtle, #626F86)"
   }));
 };

package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js

@@ -60,7 +60,8 @@ const AISummaryBlockResolvedView = props => {
     size = SmartLinkSize.Medium,
     testId,
     aiSummaryMinHeight = 0,
-    metadata
+    metadata,
+    placeholder
   } = props;
   const {
     fireEvent
@@ -91,6 +92,7 @@ const AISummaryBlockResolvedView = props => {
   status === 'loading' && !!content;
   const isSummarisedOnMountRef = useRef(status === 'done');
   const isErroredOnMountRef = useRef(status === 'error');
+  const minHeight = getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') && isSummarisedOnMountRef.current ? 0 : aiSummaryMinHeight;
   useEffect(() => {
     // if the error was apparent on mount and the status is changed to loading we can
     // clear the initial error on mount state
@@ -133,6 +135,9 @@ const AISummaryBlockResolvedView = props => {
       });
     }
   }, [onActionMenuOpenChange]);
+  if (!showAISummary && getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign')) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, placeholder);
+  }
   return /*#__PURE__*/React.createElement(Block, _extends({}, props, {
     direction: SmartLinkDirection.Vertical,
     testId: `${testId}-resolved-view`
@@ -146,12 +151,12 @@ const AISummaryBlockResolvedView = props => {
   }), status === 'done' && /*#__PURE__*/React.createElement(AIEventSummaryViewed, {
     fromCache: isSummarisedOnMountRef.current
   }), /*#__PURE__*/React.createElement(MotionWrapper, {
-    minHeight: aiSummaryMinHeight,
+    minHeight: minHeight,
     show: showAISummary,
     showTransition: !isSummarisedOnMountRef.current
   }, /*#__PURE__*/React.createElement(AISummary, {
     testId: `${testId}-ai-summary`,
-    minHeight: aiSummaryMinHeight,
+    minHeight: minHeight,
     content: content,
     showIcon: !getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') && isSummarisedOnMountRef.current
   })), !getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Inline, {

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

@@ -14,6 +14,7 @@ import { getMetadata } from '../utils';
 import HoverCardLoadingView from './views/resolving';
 import HoverCardUnauthorisedView from './views/unauthorised';
 import HoverCardResolvedView from './views/resolved';
+import HoverCardRedesignedResolvedView from './views/resolved/redesign';
 import { FormattedMessage } from 'react-intl-next';
 import { messages } from '../../../messages';
 import { fireLinkClickedEvent } from '../../../utils/analytics/click';
@@ -153,6 +154,18 @@ const HoverCardContent = ({
       });
     }
     if (cardState.status === 'resolved') {
+      if (getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign')) {
+        return jsx(HoverCardRedesignedResolvedView, {
+          analytics: analytics,
+          cardState: cardState,
+          extensionKey: extensionKey,
+          flexibleCardProps: flexibleCardProps,
+          isAISummaryEnabled: isAISummaryEnabled,
+          onActionClick: onActionClick,
+          titleBlockProps: titleBlockProps,
+          url: url
+        });
+      }
       return jsx(HoverCardResolvedView, {
         id: id,
         url: url,

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

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { ActionName, CardDisplay, ElementName, SmartLinkPosition, SmartLinkSize, SmartLinkDirection } from '../../../../../constants';
-import { FooterBlock, MetadataBlock, RelatedUrlsBlock, SnippetBlock, TitleBlock, AISummaryBlock, CustomBlock, ActionBlock, AIFooterBlock } from '../../../../FlexibleCard/components/blocks';
+import { FooterBlock, MetadataBlock, RelatedUrlsBlock, SnippetBlock, TitleBlock, AISummaryBlock, CustomBlock } from '../../../../FlexibleCard/components/blocks';
 import { footerBlockCss, hiddenSnippetStyles, metadataBlockCss } from './styled';
 import FlexibleCard from '../../../../FlexibleCard';
 import { getMetadata } from '../../../utils';
@@ -80,7 +80,7 @@ const ConnectedAIBlock = ({
   return showData ? /*#__PURE__*/React.createElement(React.Fragment, null, !imagePreview && /*#__PURE__*/React.createElement(SnippetBlock, {
     testId: 'connected-AI',
     status: SmartLinkStatus.Resolved
-  }), !getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') && /*#__PURE__*/React.createElement(MetadataBlock, {
+  }), /*#__PURE__*/React.createElement(MetadataBlock, {
     primary: bottomPrimary,
     size: SmartLinkSize.Large,
     overrideCss: metadataBlockCss,
@@ -138,7 +138,6 @@ const HoverCardResolvedView = ({
     data: data,
     fallbackElementHeight: snippetHeight.current
   });
-  const isActionBlockEnabled = getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') ? true : false;
   return /*#__PURE__*/React.createElement(FlexibleCard, flexibleCardProps, imagePreview, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockProps, {
     metadataPosition: SmartLinkPosition.Top
   })), /*#__PURE__*/React.createElement(MetadataBlock, {
@@ -166,7 +165,7 @@ const HoverCardResolvedView = ({
     onRender: onSnippetRender,
     blockRef: snippetBlockRef,
     overrideCss: hiddenSnippetStyles
-  }), !isAISummaryEnabled && !isActionBlockEnabled && /*#__PURE__*/React.createElement(MetadataBlock, {
+  }), !isAISummaryEnabled && /*#__PURE__*/React.createElement(MetadataBlock, {
     primary: tertiary,
     size: SmartLinkSize.Large,
     overrideCss: metadataBlockCss,
@@ -181,10 +180,7 @@ const HoverCardResolvedView = ({
     }],
     actions: footerActions,
     aiSummaryMinHeight: connectedAIBlockHeight.current
-  }), isActionBlockEnabled && /*#__PURE__*/React.createElement(ActionBlock, {
-    onClick: onActionClick,
-    spaceInline: "space.100"
-  }), isActionBlockEnabled && /*#__PURE__*/React.createElement(AIFooterBlock, null), !isAISummaryEnabled && !isActionBlockEnabled && /*#__PURE__*/React.createElement(FooterBlock, {
+  }), !isAISummaryEnabled && /*#__PURE__*/React.createElement(FooterBlock, {
     actions: footerActions,
     size: SmartLinkSize.Large,
     overrideCss: footerBlockCss

package/dist/es2019/view/HoverCard/components/views/resolved/redesign.js

@@ -0,0 +1,73 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { useCallback, useEffect, useMemo, useRef } from 'react';
+import { CardDisplay, SmartLinkPosition, SmartLinkSize, SmartLinkStatus } from '../../../../../constants';
+import { getCanBeDatasource } from '../../../../../state/helpers';
+import FlexibleCard from '../../../../FlexibleCard';
+import { ActionBlock, AIFooterBlock, AISummaryBlock, MetadataBlock, SnippetBlock, TitleBlock } from '../../../../FlexibleCard/components/blocks';
+import { getMetadata } from '../../../utils';
+import ImagePreview from '../../ImagePreview';
+import { hiddenSnippetStyles, metadataBlockCss } from './styled';
+const HoverCardResolvedView = ({
+  analytics,
+  cardState,
+  extensionKey,
+  flexibleCardProps,
+  isAISummaryEnabled,
+  onActionClick,
+  titleBlockProps
+}) => {
+  var _cardState$details;
+  const canBeDatasource = getCanBeDatasource(cardState.details);
+  useEffect(() => {
+    // Since this hover view is only rendered on resolved status,
+    // there is no need to check for statuses.
+    analytics.ui.renderSuccessEvent({
+      display: CardDisplay.HoverCardPreview,
+      status: cardState.status,
+      canBeDatasource
+    });
+  }, [analytics.ui, cardState.status, canBeDatasource]);
+  const data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
+  const {
+    primary,
+    secondary
+  } = useMemo(() => {
+    return getMetadata(extensionKey, data);
+  }, [data, extensionKey]);
+  const snippetHeight = React.useRef(0);
+  const snippetBlockRef = useRef(null);
+  const onSnippetRender = useCallback(() => {
+    var _snippetBlockRef$curr, _snippetBlockRef$curr2;
+    snippetHeight.current = (_snippetBlockRef$curr = (_snippetBlockRef$curr2 = snippetBlockRef.current) === null || _snippetBlockRef$curr2 === void 0 ? void 0 : _snippetBlockRef$curr2.getBoundingClientRect().height) !== null && _snippetBlockRef$curr !== void 0 ? _snippetBlockRef$curr : 0;
+  }, []);
+  const imagePreview = ImagePreview({
+    data: data,
+    fallbackElementHeight: snippetHeight.current
+  });
+  const snippet = imagePreview ? null : /*#__PURE__*/React.createElement(SnippetBlock, {
+    status: SmartLinkStatus.Resolved
+  });
+  const aiSummaryMinHeight = snippet ? snippetHeight.current : 0;
+  return /*#__PURE__*/React.createElement(FlexibleCard, flexibleCardProps, imagePreview, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockProps, {
+    metadataPosition: SmartLinkPosition.Top
+  })), /*#__PURE__*/React.createElement(MetadataBlock, {
+    primary: primary,
+    secondary: secondary,
+    overrideCss: metadataBlockCss,
+    maxLines: 1,
+    size: SmartLinkSize.Medium
+  }), isAISummaryEnabled ? /*#__PURE__*/React.createElement(AISummaryBlock, {
+    aiSummaryMinHeight: aiSummaryMinHeight,
+    placeholder: snippet,
+    status: SmartLinkStatus.Resolved
+  }) : snippet, /*#__PURE__*/React.createElement(SnippetBlock, {
+    testId: "hidden-snippet",
+    onRender: onSnippetRender,
+    blockRef: snippetBlockRef,
+    overrideCss: hiddenSnippetStyles
+  }), /*#__PURE__*/React.createElement(ActionBlock, {
+    onClick: onActionClick,
+    spaceInline: "space.100"
+  }), /*#__PURE__*/React.createElement(AIFooterBlock, null));
+};
+export default HoverCardResolvedView;

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

@@ -7,7 +7,7 @@ import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-m
 import LinkWarningModal from './LinkWarningModal';
 const PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.67.0",
+  packageVersion: "26.68.0",
   componentName: 'linkUrl'
 };
 const Link = withLinkClickedEvent('a');

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

@@ -15,7 +15,7 @@ export var ANALYTICS_CHANNEL = 'media';
 export var context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.67.0"
+  packageVersion: "26.68.0"
 };
 export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

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

@@ -7,6 +7,7 @@ import { getPrimitivesInlineSpaceBySize } from '../../../utils';
 import ActionIcon from '../action-icon';
 var buttonStyles = xcss({
   all: 'unset',
+  cursor: 'pointer',
   padding: 'space.050',
   width: '100%',
   ':focus:not(:focus-visible)': {

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

@@ -31,16 +31,17 @@ var AutomationAction = function AutomationAction(props) {
   var automationActionTitle = /*#__PURE__*/React.createElement(FormattedMessage, messages.automation_action_title);
   var automationActionTooltip = /*#__PURE__*/React.createElement(FormattedMessage, messages.automation_action_tooltip);
   var automationActionIconLabel = formatMessage(messages.automation_action_icon_label);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Action, _extends({}, data, props, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Action, _extends({
     content: automationActionTitle,
     icon: /*#__PURE__*/React.createElement(AutomationManualTriggersGlyph, {
       label: automationActionIconLabel
     }),
-    onClick: function onClick() {
-      return handleAutomateActionClick(setIsModalOpen);
-    },
     testId: "smart-action-automation-action",
     tooltipMessage: automationActionTooltip
+  }, data, props, {
+    onClick: function onClick() {
+      return handleAutomateActionClick(setIsModalOpen);
+    }
   })));
 };
 export default AutomationAction;

package/dist/esm/view/FlexibleCard/components/blocks/ai-footer-block/resolved/ai-footer-metadata.js

@@ -1,9 +1,9 @@
 import React from 'react';
+import Tooltip from '@atlaskit/tooltip';
 import { di } from 'react-magnetic-di';
 import { FormattedMessage } from 'react-intl-next';
-import Tooltip from '@atlaskit/tooltip';
 import { Box, Inline } from '@atlaskit/primitives';
-import AIStateIndicator from '../../ai-summary-block/ai-state-indicator';
+import AIIcon from '../../../../../common/ai-icon';
 import { InfoIcon } from '../icons/info';
 import { messages } from '../../../../../../messages';
 import { useAISummary } from '../../../../../../state/hooks/use-ai-summary';
@@ -28,16 +28,16 @@ export var AIFooterMetadata = function AIFooterMetadata(_ref) {
     grow: "fill"
   }, /*#__PURE__*/React.createElement(Tooltip, {
     content: /*#__PURE__*/React.createElement(FormattedMessage, messages.ai_summarized_info_short),
-    position: "top"
+    position: "bottom"
   }, function (tooltipProps) {
     return /*#__PURE__*/React.createElement(Box, tooltipProps, /*#__PURE__*/React.createElement(InfoIcon, {
       label: "Information",
       size: "small",
       primaryColor: "var(--ds-icon-subtle, #626F86)"
     }));
-  }), /*#__PURE__*/React.createElement(AIStateIndicator, {
-    appearance: "icon-only",
-    state: "done",
-    testId: "ai-tooltip"
+  }), /*#__PURE__*/React.createElement(AIIcon, {
+    label: "AI",
+    size: "small",
+    primaryColor: "var(--ds-icon-subtle, #626F86)"
   }));
 };

package/dist/esm/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js

@@ -63,7 +63,8 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
     testId = props.testId,
     _props$aiSummaryMinHe = props.aiSummaryMinHeight,
     aiSummaryMinHeight = _props$aiSummaryMinHe === void 0 ? 0 : _props$aiSummaryMinHe,
-    metadata = props.metadata;
+    metadata = props.metadata,
+    placeholder = props.placeholder;
   var _useAnalyticsEvents = useAnalyticsEvents(),
     fireEvent = _useAnalyticsEvents.fireEvent;
   var context = useFlexibleUiContext();
@@ -89,6 +90,7 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
   status === 'loading' && !!content;
   var isSummarisedOnMountRef = useRef(status === 'done');
   var isErroredOnMountRef = useRef(status === 'error');
+  var minHeight = getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') && isSummarisedOnMountRef.current ? 0 : aiSummaryMinHeight;
   useEffect(function () {
     // if the error was apparent on mount and the status is changed to loading we can
     // clear the initial error on mount state
@@ -131,6 +133,9 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
       });
     }
   }, [onActionMenuOpenChange]);
+  if (!showAISummary && getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign')) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, placeholder);
+  }
   return /*#__PURE__*/React.createElement(Block, _extends({}, props, {
     direction: SmartLinkDirection.Vertical,
     testId: "".concat(testId, "-resolved-view")
@@ -144,12 +149,12 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
   }), status === 'done' && /*#__PURE__*/React.createElement(AIEventSummaryViewed, {
     fromCache: isSummarisedOnMountRef.current
   }), /*#__PURE__*/React.createElement(MotionWrapper, {
-    minHeight: aiSummaryMinHeight,
+    minHeight: minHeight,
     show: showAISummary,
     showTransition: !isSummarisedOnMountRef.current
   }, /*#__PURE__*/React.createElement(AISummary, {
     testId: "".concat(testId, "-ai-summary"),
-    minHeight: aiSummaryMinHeight,
+    minHeight: minHeight,
     content: content,
     showIcon: !getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') && isSummarisedOnMountRef.current
   })), !getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Inline, {

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

@@ -16,6 +16,7 @@ import { getMetadata } from '../utils';
 import HoverCardLoadingView from './views/resolving';
 import HoverCardUnauthorisedView from './views/unauthorised';
 import HoverCardResolvedView from './views/resolved';
+import HoverCardRedesignedResolvedView from './views/resolved/redesign';
 import { FormattedMessage } from 'react-intl-next';
 import { messages } from '../../../messages';
 import { fireLinkClickedEvent } from '../../../utils/analytics/click';
@@ -180,6 +181,18 @@ var HoverCardContent = function HoverCardContent(_ref) {
       });
     }
     if (cardState.status === 'resolved') {
+      if (getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign')) {
+        return jsx(HoverCardRedesignedResolvedView, {
+          analytics: analytics,
+          cardState: cardState,
+          extensionKey: extensionKey,
+          flexibleCardProps: flexibleCardProps,
+          isAISummaryEnabled: isAISummaryEnabled,
+          onActionClick: onActionClick,
+          titleBlockProps: titleBlockProps,
+          url: url
+        });
+      }
       return jsx(HoverCardResolvedView, {
         id: id,
         url: url,

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

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { ActionName, CardDisplay, ElementName, SmartLinkPosition, SmartLinkSize, SmartLinkDirection } from '../../../../../constants';
-import { FooterBlock, MetadataBlock, RelatedUrlsBlock, SnippetBlock, TitleBlock, AISummaryBlock, CustomBlock, ActionBlock, AIFooterBlock } from '../../../../FlexibleCard/components/blocks';
+import { FooterBlock, MetadataBlock, RelatedUrlsBlock, SnippetBlock, TitleBlock, AISummaryBlock, CustomBlock } from '../../../../FlexibleCard/components/blocks';
 import { footerBlockCss, hiddenSnippetStyles, metadataBlockCss } from './styled';
 import FlexibleCard from '../../../../FlexibleCard';
 import { getMetadata } from '../../../utils';
@@ -77,7 +77,7 @@ var ConnectedAIBlock = function ConnectedAIBlock(_ref) {
   return showData ? /*#__PURE__*/React.createElement(React.Fragment, null, !imagePreview && /*#__PURE__*/React.createElement(SnippetBlock, {
     testId: 'connected-AI',
     status: SmartLinkStatus.Resolved
-  }), !getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') && /*#__PURE__*/React.createElement(MetadataBlock, {
+  }), /*#__PURE__*/React.createElement(MetadataBlock, {
     primary: bottomPrimary,
     size: SmartLinkSize.Large,
     overrideCss: metadataBlockCss,
@@ -136,7 +136,6 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref2) {
     data: data,
     fallbackElementHeight: snippetHeight.current
   });
-  var isActionBlockEnabled = getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') ? true : false;
   return /*#__PURE__*/React.createElement(FlexibleCard, flexibleCardProps, imagePreview, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockProps, {
     metadataPosition: SmartLinkPosition.Top
   })), /*#__PURE__*/React.createElement(MetadataBlock, {
@@ -164,7 +163,7 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref2) {
     onRender: onSnippetRender,
     blockRef: snippetBlockRef,
     overrideCss: hiddenSnippetStyles
-  }), !isAISummaryEnabled && !isActionBlockEnabled && /*#__PURE__*/React.createElement(MetadataBlock, {
+  }), !isAISummaryEnabled && /*#__PURE__*/React.createElement(MetadataBlock, {
     primary: tertiary,
     size: SmartLinkSize.Large,
     overrideCss: metadataBlockCss,
@@ -179,10 +178,7 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref2) {
     }],
     actions: footerActions,
     aiSummaryMinHeight: connectedAIBlockHeight.current
-  }), isActionBlockEnabled && /*#__PURE__*/React.createElement(ActionBlock, {
-    onClick: onActionClick,
-    spaceInline: "space.100"
-  }), isActionBlockEnabled && /*#__PURE__*/React.createElement(AIFooterBlock, null), !isAISummaryEnabled && !isActionBlockEnabled && /*#__PURE__*/React.createElement(FooterBlock, {
+  }), !isAISummaryEnabled && /*#__PURE__*/React.createElement(FooterBlock, {
     actions: footerActions,
     size: SmartLinkSize.Large,
     overrideCss: footerBlockCss

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

@@ -0,0 +1,71 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { useCallback, useEffect, useMemo, useRef } from 'react';
+import { CardDisplay, SmartLinkPosition, SmartLinkSize, SmartLinkStatus } from '../../../../../constants';
+import { getCanBeDatasource } from '../../../../../state/helpers';
+import FlexibleCard from '../../../../FlexibleCard';
+import { ActionBlock, AIFooterBlock, AISummaryBlock, MetadataBlock, SnippetBlock, TitleBlock } from '../../../../FlexibleCard/components/blocks';
+import { getMetadata } from '../../../utils';
+import ImagePreview from '../../ImagePreview';
+import { hiddenSnippetStyles, metadataBlockCss } from './styled';
+var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
+  var _cardState$details;
+  var analytics = _ref.analytics,
+    cardState = _ref.cardState,
+    extensionKey = _ref.extensionKey,
+    flexibleCardProps = _ref.flexibleCardProps,
+    isAISummaryEnabled = _ref.isAISummaryEnabled,
+    onActionClick = _ref.onActionClick,
+    titleBlockProps = _ref.titleBlockProps;
+  var canBeDatasource = getCanBeDatasource(cardState.details);
+  useEffect(function () {
+    // Since this hover view is only rendered on resolved status,
+    // there is no need to check for statuses.
+    analytics.ui.renderSuccessEvent({
+      display: CardDisplay.HoverCardPreview,
+      status: cardState.status,
+      canBeDatasource: canBeDatasource
+    });
+  }, [analytics.ui, cardState.status, canBeDatasource]);
+  var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
+  var _useMemo = useMemo(function () {
+      return getMetadata(extensionKey, data);
+    }, [data, extensionKey]),
+    primary = _useMemo.primary,
+    secondary = _useMemo.secondary;
+  var snippetHeight = React.useRef(0);
+  var snippetBlockRef = useRef(null);
+  var onSnippetRender = useCallback(function () {
+    var _snippetBlockRef$curr, _snippetBlockRef$curr2;
+    snippetHeight.current = (_snippetBlockRef$curr = (_snippetBlockRef$curr2 = snippetBlockRef.current) === null || _snippetBlockRef$curr2 === void 0 ? void 0 : _snippetBlockRef$curr2.getBoundingClientRect().height) !== null && _snippetBlockRef$curr !== void 0 ? _snippetBlockRef$curr : 0;
+  }, []);
+  var imagePreview = ImagePreview({
+    data: data,
+    fallbackElementHeight: snippetHeight.current
+  });
+  var snippet = imagePreview ? null : /*#__PURE__*/React.createElement(SnippetBlock, {
+    status: SmartLinkStatus.Resolved
+  });
+  var aiSummaryMinHeight = snippet ? snippetHeight.current : 0;
+  return /*#__PURE__*/React.createElement(FlexibleCard, flexibleCardProps, imagePreview, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockProps, {
+    metadataPosition: SmartLinkPosition.Top
+  })), /*#__PURE__*/React.createElement(MetadataBlock, {
+    primary: primary,
+    secondary: secondary,
+    overrideCss: metadataBlockCss,
+    maxLines: 1,
+    size: SmartLinkSize.Medium
+  }), isAISummaryEnabled ? /*#__PURE__*/React.createElement(AISummaryBlock, {
+    aiSummaryMinHeight: aiSummaryMinHeight,
+    placeholder: snippet,
+    status: SmartLinkStatus.Resolved
+  }) : snippet, /*#__PURE__*/React.createElement(SnippetBlock, {
+    testId: "hidden-snippet",
+    onRender: onSnippetRender,
+    blockRef: snippetBlockRef,
+    overrideCss: hiddenSnippetStyles
+  }), /*#__PURE__*/React.createElement(ActionBlock, {
+    onClick: onActionClick,
+    spaceInline: "space.100"
+  }), /*#__PURE__*/React.createElement(AIFooterBlock, null));
+};
+export default HoverCardResolvedView;

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

@@ -10,7 +10,7 @@ import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-m
 import LinkWarningModal from './LinkWarningModal';
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.67.0",
+  packageVersion: "26.68.0",
   componentName: 'linkUrl'
 };
 var Link = withLinkClickedEvent('a');

package/dist/types/__fixtures__/flexible-ui-data-context.d.ts

@@ -1,3 +1,3 @@
-import { FlexibleUiDataContext } from '../state/flexible-ui-context/types';
+import { type FlexibleUiDataContext } from '../state/flexible-ui-context/types';
 declare const context: FlexibleUiDataContext;
 export default context;

package/dist/types/view/FlexibleCard/components/blocks/ai-summary-block/types.d.ts

@@ -1,5 +1,6 @@
-import { ActionItem, BlockProps, ElementItem } from '../types';
-import { OnActionMenuOpenChangeOptions } from '../types';
+import { type ReactNode } from 'react';
+import { type ActionItem, type BlockProps, type ElementItem } from '../types';
+import { type OnActionMenuOpenChangeOptions } from '../types';
 export type AISummaryBlockProps = {
     /**
      * An array of actions to be displayed on the right
@@ -20,4 +21,8 @@ export type AISummaryBlockProps = {
      * Minimum height requirement for the AISummary component to prevent fluctuations in a card size on the summary action.
      */
     aiSummaryMinHeight?: number;
+    /**
+     * Placeholder to show when summary is not available
+     */
+    placeholder?: ReactNode;
 } & BlockProps;

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

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import { type HoverCardResolvedProps } from './types';
+declare const HoverCardResolvedView: FC<HoverCardResolvedProps>;
+export default HoverCardResolvedView;

package/dist/types-ts4.5/__fixtures__/flexible-ui-data-context.d.ts

@@ -1,3 +1,3 @@
-import { FlexibleUiDataContext } from '../state/flexible-ui-context/types';
+import { type FlexibleUiDataContext } from '../state/flexible-ui-context/types';
 declare const context: FlexibleUiDataContext;
 export default context;

package/dist/types-ts4.5/view/FlexibleCard/components/blocks/ai-summary-block/types.d.ts

@@ -1,5 +1,6 @@
-import { ActionItem, BlockProps, ElementItem } from '../types';
-import { OnActionMenuOpenChangeOptions } from '../types';
+import { type ReactNode } from 'react';
+import { type ActionItem, type BlockProps, type ElementItem } from '../types';
+import { type OnActionMenuOpenChangeOptions } from '../types';
 export type AISummaryBlockProps = {
     /**
      * An array of actions to be displayed on the right
@@ -20,4 +21,8 @@ export type AISummaryBlockProps = {
      * Minimum height requirement for the AISummary component to prevent fluctuations in a card size on the summary action.
      */
     aiSummaryMinHeight?: number;
+    /**
+     * Placeholder to show when summary is not available
+     */
+    placeholder?: ReactNode;
 } & BlockProps;

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

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import { type HoverCardResolvedProps } from './types';
+declare const HoverCardResolvedView: FC<HoverCardResolvedProps>;
+export default HoverCardResolvedView;

package/package.json

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