@atlaskit/smart-card 44.24.1 → 44.25.0

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/smart-card
 
+## 44.25.0
+
+### Minor Changes
+
+- [`fdea0f8bc06c4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/fdea0f8bc06c4) -
+  Pass card appearance to ORS for optimized response payload. When
+  platform_smartlink_inline_resolve_optimization is enabled, inline cards request minimal data on
+  initial load and fetch full block data on hover.
+
+### Patch Changes
+
+- Updated dependencies
+
+## 44.24.2
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 44.24.1
 
 ### Patch Changes

package/dist/cjs/extractors/flexible/extract-state.js

@@ -51,7 +51,10 @@ var extractAction = function extractAction(response, id, actionOptions, appearan
     fireEvent: fireEvent,
     id: id,
     onClose: resolve ? function () {
-      return url && resolve(url, true);
+      return url && resolve({
+        url: url,
+        isReloading: true
+      });
     } : undefined,
     origin: origin,
     response: response,

package/dist/cjs/ssr.js

@@ -14,6 +14,7 @@ var _uuid = _interopRequireDefault(require("uuid"));
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _analytics = require("./utils/analytics/analytics");
+var _flexible = require("./utils/flexible");
 var _cardErrorBoundary = _interopRequireDefault(require("./view/CardWithUrl/card-error-boundary"));
 var _component = require("./view/CardWithUrl/component");
 var _LoadingCardLink = require("./view/CardWithUrl/component-lazy/LoadingCardLink");
@@ -31,8 +32,13 @@ var CardSSROld = function CardSSROld(props) {
     }),
     _useState2 = (0, _slicedToArray2.default)(_useState, 1),
     id = _useState2[0];
+  // FlexibleCards always need full ORS data regardless of appearance prop,
+  // because they render custom blocks (TitleBlock etc.) requiring a complete response.
+  // Override appearance to 'block' for FlexibleCards when FG is enabled.
+  var effectiveAppearance = (0, _flexible.isFlexibleUiCard)(props.children, props.ui) && (0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization') ? 'block' : props.appearance;
   var cardProps = _objectSpread(_objectSpread({}, props), {}, {
-    id: id
+    id: id,
+    appearance: effectiveAppearance
   });
   var ErrorFallbackComponent = cardProps.fallbackComponent;
   var errorBoundaryFallbackComponent = function errorBoundaryFallbackComponent() {
@@ -41,7 +47,7 @@ var CardSSROld = function CardSSROld(props) {
     }
     return /*#__PURE__*/_react.default.createElement(_LoadingCardLink.LoadingCardLink, cardProps);
   };
-  var Component = cardProps.appearance === 'inline' ? 'span' : 'div';
+  var Component = effectiveAppearance === 'inline' ? 'span' : 'div';
   return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
     data: _analytics.context
   }, /*#__PURE__*/_react.default.createElement(_reactErrorBoundary.ErrorBoundary, {
@@ -62,8 +68,13 @@ var CardSSRNew = function CardSSRNew(props) {
     }),
     _useState4 = (0, _slicedToArray2.default)(_useState3, 1),
     id = _useState4[0];
+  // FlexibleCards always need full ORS data regardless of appearance prop,
+  // because they render custom blocks (TitleBlock etc.) requiring a complete response.
+  // Override appearance to 'block' for FlexibleCards when FG is enabled.
+  var effectiveAppearance = (0, _flexible.isFlexibleUiCard)(props.children, props.ui) && (0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization') ? 'block' : props.appearance;
   var propsWithId = _objectSpread(_objectSpread({}, props), {}, {
-    id: id
+    id: id,
+    appearance: effectiveAppearance
   });
   return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
     data: _analytics.context

package/dist/cjs/state/actions/index.js

@@ -107,6 +107,8 @@ var useSmartCardActions = exports.useSmartCardActions = function useSmartCardAct
       url: url
     }, undefined, undefined, metadataStatus));
   }, [dispatch, url]);
+
+  // Original resolve function — signature kept intact for maximum safety when FG is off.
   var resolve = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
     var resourceUrl,
       isReloading,
@@ -118,45 +120,131 @@ var useSmartCardActions = exports.useSmartCardActions = function useSmartCardAct
           resourceUrl = _args.length > 0 && _args[0] !== undefined ? _args[0] : url;
           isReloading = _args.length > 1 && _args[1] !== undefined ? _args[1] : false;
           isMetadataRequest = _args.length > 2 && _args[2] !== undefined ? _args[2] : false;
-          return _context.abrupt("return", resolveUrl(resourceUrl, isReloading, isMetadataRequest, id));
+          return _context.abrupt("return", resolveUrl({
+            url: resourceUrl,
+            isReloading: isReloading,
+            isMetadataRequest: isMetadataRequest,
+            id: id
+          }));
         case 1:
         case "end":
           return _context.stop();
       }
     }, _callee);
   })), [id, resolveUrl, url]);
-  var register = (0, _react.useCallback)(function () {
+
+  // New resolve function accepting ResolveUrlParams (minus 'id' which is closed over).
+  // Used when FG is enabled to pass appearance to ORS.
+  var resolveNew = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
+    var params,
+      _params$url,
+      resourceUrl,
+      _params$isReloading,
+      isReloading,
+      _params$isMetadataReq,
+      isMetadataRequest,
+      appearance,
+      _args2 = arguments;
+    return _regenerator.default.wrap(function (_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          params = _args2.length > 0 && _args2[0] !== undefined ? _args2[0] : {};
+          _params$url = params.url, resourceUrl = _params$url === void 0 ? url : _params$url, _params$isReloading = params.isReloading, isReloading = _params$isReloading === void 0 ? false : _params$isReloading, _params$isMetadataReq = params.isMetadataRequest, isMetadataRequest = _params$isMetadataReq === void 0 ? false : _params$isMetadataReq, appearance = params.appearance;
+          return _context2.abrupt("return", resolveUrl({
+            url: resourceUrl,
+            isReloading: isReloading,
+            isMetadataRequest: isMetadataRequest,
+            id: id,
+            appearance: appearance
+          }));
+        case 1:
+        case "end":
+          return _context2.stop();
+      }
+    }, _callee2);
+  })), [id, resolveUrl, url]);
+
+  /**
+   * Register a smart link for resolution.
+   * @param appearance - Card appearance hint for ORS to optimize response payload.
+   *                     When 'inline', ORS returns minimal data (title, status).
+   *                     When 'block' or 'embed', ORS returns full data including summary.
+   */
+  var register = (0, _react.useCallback)(function (appearance) {
     var _getSmartLinkState = getSmartLinkState(),
       details = _getSmartLinkState.details;
     if (!details) {
       dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RESOLVING, {
         url: url
       }));
+      // Always set metadataStatus to 'pending' during registration to prevent
+      // loadMetadata from firing a duplicate concurrent fetch if a hover card
+      // mounts while registration is in-flight. This matches pre-PR behaviour.
       setMetadataStatus('pending');
     }
-    return resolve();
-  }, [getSmartLinkState, resolve, dispatch, url, setMetadataStatus]);
-  var reload = (0, _react.useCallback)(function () {
+    if ((0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization')) {
+      return resolveNew({
+        url: url,
+        appearance: appearance
+      });
+    }
+    return resolve(url);
+  }, [getSmartLinkState, resolve, resolveNew, dispatch, url, setMetadataStatus]);
+  var reload = (0, _react.useCallback)(function (appearance) {
     var _getSmartLinkState2 = getSmartLinkState(),
       details = _getSmartLinkState2.details;
     var definitionId = (0, _helpers.getDefinitionId)(details);
-    if (definitionId) {
-      (0, _helpers.getByDefinitionId)(definitionId, getState()).map(function (url) {
-        return resolve(url, true);
-      });
+    if ((0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization')) {
+      if (definitionId) {
+        (0, _helpers.getByDefinitionId)(definitionId, getState()).map(function (reloadUrl) {
+          return resolveNew({
+            url: reloadUrl,
+            isReloading: true,
+            appearance: appearance
+          });
+        });
+      } else {
+        resolveNew({
+          url: url,
+          isReloading: true,
+          appearance: appearance
+        });
+      }
     } else {
-      resolve(url, true);
+      if (definitionId) {
+        (0, _helpers.getByDefinitionId)(definitionId, getState()).map(function (reloadUrl) {
+          return resolve(reloadUrl, true);
+        });
+      } else {
+        resolve(url, true);
+      }
     }
-  }, [getSmartLinkState, url, getState, resolve]);
+  }, [getSmartLinkState, url, getState, resolve, resolveNew]);
+
+  /**
+   * Load metadata for hover card preview.
+   * This always requests 'block' appearance to get full data including summary.
+   *
+   * Inline optimized and SSR-resolved links keep metadataStatus pending until hover
+   * requests the full block response.
+   */
   var loadMetadata = (0, _react.useCallback)(function () {
     var _getSmartLinkState3 = getSmartLinkState(),
       metadataStatus = _getSmartLinkState3.metadataStatus;
-    //metadataStatus will be undefined for SSR links only
-    if (metadataStatus === undefined) {
+    var needsBlockData = metadataStatus === undefined || metadataStatus === 'pending' && (0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization');
+    if (needsBlockData) {
       setMetadataStatus('pending');
+      if ((0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization')) {
+        // Always request 'block' appearance for hover card metadata to get full data
+        return resolveNew({
+          url: url,
+          isMetadataRequest: true,
+          appearance: 'block'
+        });
+      }
       return resolve(url, false, true);
     }
-  }, [getSmartLinkState, resolve, setMetadataStatus, url]);
+  }, [getSmartLinkState, resolve, resolveNew, setMetadataStatus, url]);
   var authorize = (0, _react.useCallback)(function (appearance) {
     var _getSmartLinkState4 = getSmartLinkState(),
       details = _getSmartLinkState4.details,
@@ -237,18 +325,18 @@ var useSmartCardActions = exports.useSmartCardActions = function useSmartCardAct
     }
   }, [getSmartLinkState, id, reload, fireEvent, flags, url]);
   var invoke = (0, _react.useCallback)( /*#__PURE__*/function () {
-    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(opts, appearance) {
+    var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(opts, appearance) {
       var key, action, source;
-      return _regenerator.default.wrap(function (_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
+      return _regenerator.default.wrap(function (_context3) {
+        while (1) switch (_context3.prev = _context3.next) {
           case 0:
             key = opts.key, action = opts.action;
             source = opts.source || appearance;
             if (!(opts.type === 'client')) {
-              _context2.next = 2;
+              _context3.next = 2;
               break;
             }
-            _context2.next = 1;
+            _context3.next = 1;
             return invokeClientAction({
               actionFn: opts.action.promise,
               actionType: action.type,
@@ -256,15 +344,15 @@ var useSmartCardActions = exports.useSmartCardActions = function useSmartCardAct
               extensionKey: key
             });
           case 1:
-            return _context2.abrupt("return", _context2.sent);
+            return _context3.abrupt("return", _context3.sent);
           case 2:
           case "end":
-            return _context2.stop();
+            return _context3.stop();
         }
-      }, _callee2);
+      }, _callee3);
     }));
     return function (_x, _x2) {
-      return _ref3.apply(this, arguments);
+      return _ref4.apply(this, arguments);
     };
   }(), [invokeClientAction]);
   return (0, _react.useMemo)(function () {

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

@@ -10,6 +10,7 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _react = require("react");
 var _linkExtractors = require("@atlaskit/link-extractors");
 var _linkProvider = require("@atlaskit/link-provider");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../../constants");
 var _analytics = require("../../analytics");
 var _useResponse2 = _interopRequireDefault(require("../use-response"));
@@ -26,20 +27,12 @@ var useResolve = function useResolve() {
     handleResolvedLinkResponse = _useResponse.handleResolvedLinkResponse,
     handleResolvedLinkError = _useResponse.handleResolvedLinkError;
   return (0, _react.useCallback)( /*#__PURE__*/function () {
-    var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(url) {
-      var isReloading,
-        isMetadataRequest,
-        id,
-        _ref2,
-        details,
-        hasData,
-        _args = arguments;
+    var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(params) {
+      var url, _params$isReloading, isReloading, _params$isMetadataReq, isMetadataRequest, _params$id, id, appearance, _ref2, details, hasData, metadataStatus;
       return _regenerator.default.wrap(function (_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
-            isReloading = _args.length > 1 && _args[1] !== undefined ? _args[1] : false;
-            isMetadataRequest = _args.length > 2 && _args[2] !== undefined ? _args[2] : false;
-            id = _args.length > 3 && _args[3] !== undefined ? _args[3] : '';
+            url = params.url, _params$isReloading = params.isReloading, isReloading = _params$isReloading === void 0 ? false : _params$isReloading, _params$isMetadataReq = params.isMetadataRequest, isMetadataRequest = _params$isMetadataReq === void 0 ? false : _params$isMetadataReq, _params$id = params.id, id = _params$id === void 0 ? '' : _params$id, appearance = params.appearance;
             _ref2 = getState()[url] || {
               status: _constants.SmartLinkStatus.Pending,
               details: undefined
@@ -49,8 +42,9 @@ var useResolve = function useResolve() {
               _context.next = 1;
               break;
             }
-            return _context.abrupt("return", connections.client.fetchData(url, isReloading).then(function (response) {
-              return handleResolvedLinkResponse(url, response, isReloading, isMetadataRequest);
+            metadataStatus = appearance === 'inline' && !isMetadataRequest && (0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization') ? 'pending' : undefined;
+            return _context.abrupt("return", connections.client.fetchData(url, isReloading, appearance).then(function (response) {
+              return handleResolvedLinkResponse(url, response, isReloading, isMetadataRequest, metadataStatus);
             }).catch(function (error) {
               return handleResolvedLinkError(url, error, undefined, isMetadataRequest);
             }));

package/dist/cjs/state/hooks/use-response/index.js

@@ -8,6 +8,7 @@ var _react = require("react");
 var _reactDom = require("react-dom");
 var _linkProvider = require("@atlaskit/link-provider");
 var _linkingCommon = require("@atlaskit/linking-common");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../../constants");
 var _jsonld = require("../../../utils/jsonld");
 var _constants2 = require("../../actions/constants");
@@ -77,8 +78,9 @@ var useResponse = function useResponse() {
     }
   }, [getState, setMetadataStatus, dispatch]);
   var handleResolvedLinkSuccess = (0, _react.useCallback)(function (resourceUrl, response, isReloading, isMetadataRequest) {
-    //if a link resolves normally, metadata will also always be resolved
-    setMetadataStatus(resourceUrl, 'resolved');
+    var metadataStatus = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'resolved';
+    // Some optimized resolves intentionally leave metadata pending so hover can fetch it.
+    setMetadataStatus(resourceUrl, (0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization') ? metadataStatus : 'resolved');
     // Dispatch Analytics and resolved card action - including unauthorized states.
     if (isReloading) {
       dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RELOADING, {
@@ -93,6 +95,10 @@ var useResponse = function useResponse() {
   var handleResolvedLinkResponse = (0, _react.useCallback)(function (resourceUrl, response) {
     var isReloading = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     var isMetadataRequest = arguments.length > 3 ? arguments[3] : undefined;
+    var metadataStatus = arguments.length > 4 ? arguments[4] : undefined;
+    if (!resourceUrl) {
+      return;
+    }
     var hostname = new URL(resourceUrl).hostname;
     var nextStatus = response ? (0, _linkingCommon.getStatus)(response) : 'fatal';
 
@@ -122,7 +128,7 @@ var useResponse = function useResponse() {
      * https://react-redux.js.org/api/batch
      */
     (0, _reactDom.unstable_batchedUpdates)(function () {
-      handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
+      handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest, metadataStatus);
     });
   }, [handleResolvedLinkError, handleResolvedLinkSuccess, hasAuthFlowSupported]);
   return (0, _react.useMemo)(function () {

package/dist/cjs/state/hooks/usePrefetch.js

@@ -10,7 +10,8 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _react = require("react");
 var _linkProvider = require("@atlaskit/link-provider");
 var _linkingCommon = require("@atlaskit/linking-common");
-function usePrefetch(url) {
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+function usePrefetch(url, appearance) {
   var _useSmartLinkContext = (0, _linkProvider.useSmartLinkContext)(),
     store = _useSmartLinkContext.store,
     prefetchStore = _useSmartLinkContext.prefetchStore,
@@ -54,7 +55,7 @@ function usePrefetch(url) {
           // we create between browser -> ORS when making network requests.
           _context.prev = 2;
           _context.next = 3;
-          return client.prefetchData(url);
+          return client.prefetchData(url, appearance);
         case 3:
           response = _context.sent;
           // Once the data comes back, we put the link in the `resolved` status. This ensures
@@ -66,11 +67,11 @@ function usePrefetch(url) {
               url: url,
               payload: response
             });
-            // Put the metadata in resolved state, theres no need for a pending or errored state as
-            // we are following the same render flow as described by the comments above and below.
+            // Put the metadata status: 'pending' for inline appearance when FG is on, so HoverCard
+            // can upgrade to full block data. Otherwise 'resolved' preserves existing behaviour.
             dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_UPDATE_METADATA_STATUS, {
               url: url
-            }, undefined, undefined, 'resolved'));
+            }, undefined, undefined, appearance === 'inline' && (0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization') ? 'pending' : 'resolved'));
           }
           _context.next = 5;
           break;
@@ -82,5 +83,5 @@ function usePrefetch(url) {
           return _context.stop();
       }
     }, _callee, null, [[2, 4]]);
-  })), [store, prefetchStore, connections, url, getState, client, dispatch]);
+  })), [store, prefetchStore, connections, url, getState, client, dispatch, appearance]);
 }

package/dist/cjs/state/hooks/useSmartLink.js

@@ -8,11 +8,20 @@ exports.useSmartLink = useSmartLink;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = require("react");
 var _linkProvider = require("@atlaskit/link-provider");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _actions = require("../actions");
 var _config = require("../config");
 var _renderers = require("../renderers");
 var _store = require("../store");
-function useSmartLink(id, url) {
+/**
+ * Hook for smart link state and actions.
+ * @param id - Unique identifier for the smart link
+ * @param url - The URL to resolve
+ * @param appearance - Card appearance hint for ORS to optimize response payload.
+ *                     When 'inline', ORS returns minimal data (title, status).
+ *                     When 'block' or 'embed', ORS returns full data including summary.
+ */
+function useSmartLink(id, url, appearance) {
   var state = (0, _store.useSmartCardState)(url);
   var _useSmartLinkContext = (0, _linkProvider.useSmartLinkContext)(),
     store = _useSmartLinkContext.store,
@@ -27,9 +36,9 @@ function useSmartLink(id, url) {
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     error = _useState2[0],
     setError = _useState2[1];
-  // Register the current card.
+  // Register the current card with appearance hint for optimized ORS response.
   var register = function register() {
-    actions.register().catch(function (err) {
+    actions.register((0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization') ? appearance : undefined).catch(function (err) {
       return setError(err);
     });
   };

package/dist/cjs/state/hooks-external/useSmartLinkActions.js

@@ -47,7 +47,9 @@ function useSmartLinkActions(_ref) {
     details: linkState.details
   });
   if ((0, _expValEquals.expValEquals)('platform_hover_card_preview_panel', 'cohort', 'test') && prefetch && !linkState.details) {
-    resolve(url);
+    resolve({
+      url: url
+    });
   }
   if (linkState.details && !(actionOptions !== null && actionOptions !== void 0 && actionOptions.hide)) {
     var actions = [];

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

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

package/dist/cjs/view/CardWithUrl/component-lazy/LazyIntersectionObserverCard.js

@@ -36,7 +36,7 @@ function LazyIntersectionObserverCardOld(props) {
   var appearance = props.appearance,
     url = props.url,
     id = props.id;
-  var prefetch = (0, _state.usePrefetch)(url);
+  var prefetch = (0, _state.usePrefetch)(url, appearance);
   var Component = appearance === 'inline' ? 'span' : 'div';
   var ComponentObserver = Component;
   var onIntersection = (0, _react.useCallback)(function (entries, observer) {

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

@@ -77,7 +77,10 @@ function Component(_ref) {
   }, [children, ui]);
 
   // Get state, actions for this card.
-  var _useSmartLink = (0, _state.useSmartLink)(id, url),
+  // appearance is pre-resolved by the caller (loader.tsx for Card, ssr.tsx for CardSSR):
+  // FlexibleCards are always passed appearance='block' when FG is on, so component.tsx
+  // simply consumes whatever appearance it receives.
+  var _useSmartLink = (0, _state.useSmartLink)(id, url, appearance),
     state = _useSmartLink.state,
     actions = _useSmartLink.actions,
     config = _useSmartLink.config,
@@ -270,12 +273,31 @@ function Component(_ref) {
       });
     }
   }, [fire3PClickEvent, shouldFire3PClickEvent]);
+  var reload = actions.reload;
   var handleAuthorize = (0, _react.useCallback)(function () {
     return actions.authorize(appearance);
   }, [actions, appearance]);
   var handleRetry = (0, _react.useCallback)(function () {
-    actions.reload();
-  }, [actions]);
+    reload();
+  }, [reload]);
+  var hasMounted = (0, _react.useRef)(false);
+  var prevAppearance = (0, _react.useRef)(appearance);
+
+  // When appearance changes from inline to non-inline on a mounted card
+  // (e.g. direct consumer changes inline → block/embed), reload with the new appearance
+  // so ORS can return the appropriate full data. We intentionally do NOT reload on
+  // block → embed or embed → block transitions since both already have full ORS data.
+  (0, _react.useEffect)(function () {
+    if (!hasMounted.current) {
+      hasMounted.current = true;
+      prevAppearance.current = appearance;
+      return;
+    }
+    if (prevAppearance.current === 'inline' && appearance !== 'inline' && (0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization')) {
+      reload(appearance);
+    }
+    prevAppearance.current = appearance;
+  }, [appearance, reload]);
   var handleInvoke = (0, _react.useCallback)(function (opts) {
     return actions.invoke(opts, appearance);
   }, [actions, appearance]);

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

@@ -13,6 +13,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactErrorBoundary = require("react-error-boundary");
 var _reactMagneticDi = require("react-magnetic-di");
 var _uuid = _interopRequireDefault(require("uuid"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _useAnalyticsEvents2 = require("../../common/analytics/generated/use-analytics-events");
 var _analytics = require("../../state/analytics");
 var _utils = require("../../utils");
@@ -123,10 +124,15 @@ function CardWithURLRenderer(props) {
   var ErrorFallback = function ErrorFallback() {
     return /*#__PURE__*/_react.default.createElement(FallbackComponent, null);
   };
+
+  // FlexibleCards always need full ORS data regardless of appearance prop,
+  // because they render custom blocks (TitleBlock etc.) requiring complete response.
+  // Override appearance to 'block' for all FlexibleCards when FG is enabled.
+  var effectiveAppearance = isFlexibleUi && (0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization') ? 'block' : appearance;
   var cardWithUrlProps = {
     id: id,
     url: url,
-    appearance: appearance,
+    appearance: effectiveAppearance,
     onClick: onClick,
     isSelected: isSelected,
     isHovered: isHovered,

package/dist/cjs/view/EmbedCard/useEmbedResolvePostMessageListener.js

@@ -19,7 +19,10 @@ var useEmbedResolvePostMessageListener = exports.useEmbedResolvePostMessageListe
       }
       var isFromExpectedIframe = embedIframeRef && event.source === ((_embedIframeRef$curre = embedIframeRef.current) === null || _embedIframeRef$curre === void 0 ? void 0 : _embedIframeRef$curre.contentWindow);
       if (event.data === 'force-resolve-smart-link' && isFromExpectedIframe) {
-        resolve(url, true);
+        resolve({
+          url: url,
+          isReloading: true
+        });
       }
     };
     window.addEventListener('message', messageCallback);

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

@@ -65,7 +65,11 @@ var ServerAction = function ServerAction(_ref) {
             break;
           }
           _context.next = 3;
-          return reload(action.reload.url, true, undefined, action.reload.id);
+          return reload({
+            url: action.reload.url,
+            isReloading: true,
+            id: action.reload.id
+          });
         case 3:
           setIsLoading(false);
           if (onClick) {

package/dist/cjs/view/FlexibleCard/components/elements/common/base-lozenge-element/lozenge-action/index.js

@@ -192,7 +192,11 @@ var LozengeAction = function LozengeAction(_ref) {
               break;
             }
             _context2.next = 2;
-            return reload(url, true, undefined, linkId);
+            return reload({
+              url: url,
+              isReloading: true,
+              id: linkId
+            });
           case 2:
             _context2.next = 4;
             break;

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

@@ -10,6 +10,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _popup = _interopRequireDefault(require("@atlaskit/popup"));
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _constants = require("../../../constants");
@@ -144,7 +145,7 @@ var HoverCardComponent = exports.HoverCardComponent = function HoverCardComponen
   // to minimize the loading state
   var initResolve = (0, _react.useCallback)(function () {
     // this check covers both non-SSR (status) & SSR case (metadataStatus)
-    var isLinkUnresolved = linkState.status === 'pending' || !linkState.metadataStatus;
+    var isLinkUnresolved = linkState.status === 'pending' || !linkState.metadataStatus || linkState.status === 'resolved' && linkState.metadataStatus === 'pending' && (0, _platformFeatureFlags.fg)('platform_smartlink_inline_resolve_optimization');
     if (!resolveTimeOutId.current && isLinkUnresolved) {
       resolveTimeOutId.current = setTimeout(function () {
         if (linkState.status === 'pending') {

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

@@ -19,7 +19,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId", "isLink
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "44.24.0",
+  packageVersion: "44.24.2",
   componentName: 'linkUrl'
 };
 var LinkUrl = function LinkUrl(_ref) {

package/dist/es2019/extractors/flexible/extract-state.js

@@ -38,7 +38,10 @@ const extractAction = (response, id, actionOptions, appearance, origin, fireEven
     appearance,
     fireEvent,
     id,
-    onClose: resolve ? () => url && resolve(url, true) : undefined,
+    onClose: resolve ? () => url && resolve({
+      url,
+      isReloading: true
+    }) : undefined,
     origin,
     response,
     isPreviewPanelAvailable,