@atlaskit/editor-plugin-card 7.5.1 → 7.7.0

package/dist/cjs/pm-plugins/main.js

@@ -54,6 +54,7 @@ var createPlugin = exports.createPlugin = function createPlugin(options, pluginI
       allowBlockCards = options.allowBlockCards,
       onClickCallback = options.onClickCallback,
       isPageSSRed = options.isPageSSRed,
+      provider = options.provider,
       CompetitorPrompt = options.CompetitorPrompt;
     var enableInlineUpgradeFeatures = !!showUpgradeDiscoverability;
     var inlineCardViewProducer = (0, _reactNodeView.getInlineNodeViewProducer)({
@@ -68,6 +69,7 @@ var createPlugin = exports.createPlugin = function createPlugin(options, pluginI
         pluginInjectionApi: pluginInjectionApi,
         onClickCallback: onClickCallback,
         isPageSSRed: isPageSSRed,
+        provider: provider,
         CompetitorPrompt: CompetitorPrompt
       }
     });
@@ -196,7 +198,7 @@ var createPlugin = exports.createPlugin = function createPlugin(options, pluginI
               // Find requests in this state that weren't in the old one.
               var newRequests = (0, _state2.getNewRequests)(oldState, currentState);
               // Ask the CardProvider to resolve all new requests.
-              var provider = currentState.provider;
+              var _provider = currentState.provider;
               newRequests.forEach(function (request) {
                 /**
                  * Queue each asynchronous resolve request on separate frames.
@@ -209,7 +211,7 @@ var createPlugin = exports.createPlugin = function createPlugin(options, pluginI
                  */
                 var invoke = (0, _rafSchd.default)(function () {
                   var _pluginInjectionApi$a, _pluginInjectionApi$a2, _pluginInjectionApi$a3;
-                  return (0, _resolve.resolveWithProvider)(view, provider, request, options, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions, (_pluginInjectionApi$a2 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a3 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a3 === void 0 || (_pluginInjectionApi$a3 = _pluginInjectionApi$a3.sharedState.currentState()) === null || _pluginInjectionApi$a3 === void 0 ? void 0 : _pluginInjectionApi$a3.createAnalyticsEvent) !== null && _pluginInjectionApi$a2 !== void 0 ? _pluginInjectionApi$a2 : undefined);
+                  return (0, _resolve.resolveWithProvider)(view, _provider, request, options, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions, (_pluginInjectionApi$a2 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a3 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a3 === void 0 || (_pluginInjectionApi$a3 = _pluginInjectionApi$a3.sharedState.currentState()) === null || _pluginInjectionApi$a3 === void 0 ? void 0 : _pluginInjectionApi$a3.createAnalyticsEvent) !== null && _pluginInjectionApi$a2 !== void 0 ? _pluginInjectionApi$a2 : undefined);
                 });
                 rafCancellationCallbacks.push(invoke.cancel);
                 invoke();
@@ -236,6 +238,7 @@ var createPlugin = exports.createPlugin = function createPlugin(options, pluginI
           inlineCard: (0, _lazyInlineCard.lazyInlineCardView)({
             inlineCardViewProducer: inlineCardViewProducer,
             isPageSSRed: isPageSSRed
+            // no need provider here, it's in the inlineCardViewProducer.extraComponentProps
           }),
           blockCard: (0, _lazyBlockCard.lazyBlockCardView)({
             pmPluginFactoryParams: pmPluginFactoryParams,
@@ -245,6 +248,7 @@ var createPlugin = exports.createPlugin = function createPlugin(options, pluginI
             allowDatasource: options.allowDatasource,
             inlineCardViewProducer: inlineCardViewProducer,
             isPageSSRed: isPageSSRed,
+            provider: provider,
             CompetitorPrompt: options.CompetitorPrompt
           }),
           embedCard: (0, _lazyEmbedCard.lazyEmbedCardView)({
@@ -255,6 +259,7 @@ var createPlugin = exports.createPlugin = function createPlugin(options, pluginI
             actionOptions: actionOptions,
             onClickCallback: options.onClickCallback,
             isPageSSRed: isPageSSRed,
+            provider: provider,
             CompetitorPrompt: options.CompetitorPrompt
           })
         }

package/dist/es2019/nodeviews/blockCard.js

@@ -2,6 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import rafSchedule from 'raf-schd';
 import uuid from 'uuid/v4';
+import { EditorCardProvider } from '@atlaskit/editor-card-provider';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import { findOverflowScrollParent, UnsupportedBlock } from '@atlaskit/editor-common/ui';
 import { browser, canRenderDatasource } from '@atlaskit/editor-common/utils';
@@ -12,13 +13,15 @@ import { Datasource } from '../nodeviews/datasource';
 import { registerCard, removeCard } from '../pm-plugins/actions';
 import { isDatasourceNode } from '../pm-plugins/utils';
 import { Card } from './genericCard';
-
 // eslint-disable-next-line @repo/internal/react/no-class-components
 export class BlockCardComponent extends React.PureComponent {
   constructor(props) {
     super(props);
     // Ignored via go/ees005
     // eslint-disable-next-line @atlaskit/editor/no-as-casting
+    _defineProperty(this, "state", {
+      isSSRDataAvailable: false
+    });
     _defineProperty(this, "onResolve", data => {
       const {
         getPos,
@@ -69,6 +72,28 @@ export class BlockCardComponent extends React.PureComponent {
       }
     });
     this.scrollContainer = findOverflowScrollParent(props.view.dom) || undefined;
+    this.state = {
+      isSSRDataAvailable: expValEquals('platform_editor_smart_card_otp', 'isEnabled', true) && props.isPageSSRed
+    };
+  }
+  componentDidMount() {
+    if (!expValEquals('platform_editor_smart_card_otp', 'isEnabled', true)) {
+      return;
+    }
+    const provider = this.props.provider;
+    if (!provider) {
+      return;
+    }
+    const updateSSRDataAvailability = async () => {
+      const resolvedProvider = await provider;
+      if (resolvedProvider instanceof EditorCardProvider) {
+        this.setState(state => ({
+          ...state,
+          isSSRDataAvailable: resolvedProvider.getCacheStatusForNode(this.props.node) === 'ssr'
+        }));
+      }
+    };
+    void updateSSRDataAvailability();
   }
   componentWillUnmount() {
     this.removeCard();
@@ -109,7 +134,8 @@ export class BlockCardComponent extends React.PureComponent {
       onError: this.onError,
       platform: 'web',
       actionOptions: actionOptions,
-      CompetitorPrompt: CompetitorPrompt
+      CompetitorPrompt: CompetitorPrompt,
+      hideIconLoadingSkeleton: expValEquals('platform_editor_smart_card_otp', 'isEnabled', true) && this.state.isSSRDataAvailable
     }), this.gapCursorSpan()) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SmartCard, {
       key: url,
       url: url !== null && url !== void 0 ? url : data.url,
@@ -169,7 +195,8 @@ export class BlockCard extends ReactNodeView {
       pluginInjectionApi,
       onClickCallback,
       CompetitorPrompt,
-      isPageSSRed
+      isPageSSRed,
+      provider
     } = this.reactComponentProps;
     return /*#__PURE__*/React.createElement(WrappedBlockCard, {
       node: this.node,
@@ -180,7 +207,8 @@ export class BlockCard extends ReactNodeView {
       onClickCallback: onClickCallback,
       id: this.id,
       CompetitorPrompt: CompetitorPrompt,
-      isPageSSRed: isPageSSRed
+      isPageSSRed: isPageSSRed,
+      provider: provider
     });
   }
   destroy() {
@@ -197,7 +225,8 @@ export const blockCardNodeView = ({
   allowDatasource,
   inlineCardViewProducer,
   CompetitorPrompt,
-  isPageSSRed
+  isPageSSRed,
+  provider
 }) => (node, view, getPos, decorations) => {
   const {
     portalProviderAPI,
@@ -208,7 +237,8 @@ export const blockCardNodeView = ({
     pluginInjectionApi,
     onClickCallback: onClickCallback,
     CompetitorPrompt,
-    isPageSSRed
+    isPageSSRed,
+    provider
   };
   const isDatasource = isDatasourceNode(node);
   if (isDatasource) {

package/dist/es2019/nodeviews/embedCard.js

@@ -4,6 +4,7 @@ import React from 'react';
 import rafSchedule from 'raf-schd';
 import uuid from 'uuid/v4';
 import { SetAttrsStep } from '@atlaskit/adf-schema/steps';
+import { EditorCardProvider } from '@atlaskit/editor-card-provider';
 import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import { findOverflowScrollParent, MediaSingle as RichMediaWrapper, UnsupportedBlock } from '@atlaskit/editor-common/ui';
@@ -121,9 +122,6 @@ export class EmbedCardComponent extends React.PureComponent {
     // Ignored via go/ees005
     // eslint-disable-next-line @atlaskit/editor/no-as-casting
     _defineProperty(this, "embedIframeRef", /*#__PURE__*/React.createRef());
-    _defineProperty(this, "state", {
-      hasPreview: true
-    });
     _defineProperty(this, "getPosSafely", () => {
       const {
         getPos
@@ -273,6 +271,29 @@ export class EmbedCardComponent extends React.PureComponent {
     });
     _defineProperty(this, "removeCardDispatched", false);
     this.scrollContainer = findOverflowScrollParent(props.view.dom) || undefined;
+    this.state = {
+      hasPreview: true,
+      isSSRDataAvailable: expValEquals('platform_editor_smart_card_otp', 'isEnabled', true) && props.isPageSSRed
+    };
+  }
+  componentDidMount() {
+    if (!expValEquals('platform_editor_smart_card_otp', 'isEnabled', true)) {
+      return;
+    }
+    const provider = this.props.provider;
+    if (!provider) {
+      return;
+    }
+    const updateSSRDataAvailability = async () => {
+      const resolvedProvider = await provider;
+      if (resolvedProvider instanceof EditorCardProvider) {
+        this.setState(state => ({
+          ...state,
+          isSSRDataAvailable: resolvedProvider.getCacheStatusForNode(this.props.node) === 'ssr'
+        }));
+      }
+    };
+    void updateSSRDataAvailability();
   }
   componentWillUnmount() {
     this.removeCard();
@@ -345,7 +366,8 @@ export class EmbedCardComponent extends React.PureComponent {
       container: this.scrollContainer,
       embedIframeRef: this.embedIframeRef,
       actionOptions: actionOptions,
-      CompetitorPrompt: CompetitorPrompt
+      CompetitorPrompt: CompetitorPrompt,
+      hideIconLoadingSkeleton: expValEquals('platform_editor_smart_card_otp', 'isEnabled', true) && this.state.isSSRDataAvailable
     }) : /*#__PURE__*/React.createElement(SmartCard, {
       key: url,
       url: url,
@@ -403,7 +425,8 @@ export const EmbedOrBlockCardComponent = props => {
     hasPreview: props.hasPreview,
     liveHeight: props.liveHeight,
     initialAspectRatio: props.initialAspectRatio,
-    isPageSSRed: props.isPageSSRed
+    isPageSSRed: props.isPageSSRed,
+    provider: props.provider
   }) : /*#__PURE__*/React.createElement(EmbedCardComponent, {
     id: props.id,
     node: props.node,
@@ -422,7 +445,8 @@ export const EmbedOrBlockCardComponent = props => {
     hasPreview: props.hasPreview,
     liveHeight: props.liveHeight,
     initialAspectRatio: props.initialAspectRatio,
-    isPageSSRed: props.isPageSSRed
+    isPageSSRed: props.isPageSSRed,
+    provider: props.provider
   });
 };
 const WrappedEmbedCardWithCondition = componentWithCondition(() => expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true), EmbedOrBlockCardComponent, EmbedCardComponent);
@@ -461,7 +485,8 @@ export class EmbedCard extends ReactNodeView {
       pluginInjectionApi,
       onClickCallback,
       CompetitorPrompt,
-      isPageSSRed
+      isPageSSRed,
+      provider
     } = this.reactComponentProps;
     return /*#__PURE__*/React.createElement(WrappedEmbedCard, {
       node: this.node,
@@ -475,7 +500,8 @@ export class EmbedCard extends ReactNodeView {
       onClickCallback: onClickCallback,
       id: this.id,
       CompetitorPrompt: CompetitorPrompt,
-      isPageSSRed: isPageSSRed
+      isPageSSRed: isPageSSRed,
+      provider: provider
     });
   }
   destroy() {
@@ -492,7 +518,8 @@ export const embedCardNodeView = ({
   actionOptions,
   onClickCallback,
   CompetitorPrompt,
-  isPageSSRed
+  isPageSSRed,
+  provider
 }) => (node, view, getPos) => {
   const {
     portalProviderAPI,
@@ -508,7 +535,8 @@ export const embedCardNodeView = ({
     actionOptions,
     onClickCallback: onClickCallback,
     CompetitorPrompt,
-    isPageSSRed
+    isPageSSRed,
+    provider
   };
   return new EmbedCard(node, view, getPos, portalProviderAPI, eventDispatcher, reactComponentProps).init();
 };

package/dist/es2019/nodeviews/inlineCard.js

@@ -1,13 +1,15 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React, { memo, useCallback, useEffect, useMemo, useRef } from 'react';
+import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import rafSchedule from 'raf-schd';
 import uuid from 'uuid/v4';
+import { EditorCardProvider } from '@atlaskit/editor-card-provider';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { UnsupportedInline, findOverflowScrollParent } from '@atlaskit/editor-common/ui';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { Card as SmartCard } from '@atlaskit/smart-card';
 import { CardSSR } from '@atlaskit/smart-card/ssr';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { registerCard, removeCard } from '../pm-plugins/actions';
 import { getAwarenessProps } from '../pm-plugins/utils';
@@ -27,6 +29,7 @@ export const InlineCard = /*#__PURE__*/memo(({
   showHoverPreview,
   hoverPreviewOptions,
   isPageSSRed,
+  provider,
   pluginInjectionApi,
   disablePreviewPanel
 }) => {
@@ -47,6 +50,22 @@ export const InlineCard = /*#__PURE__*/memo(({
       view.dispatch(tr);
     };
   }, [getPos, view]);
+  const [isSSRDataAvailable, setIsSSRDataAvailable] = useState(expValEquals('platform_editor_smart_card_otp', 'isEnabled', true) && isPageSSRed);
+  useEffect(() => {
+    if (!expValEquals('platform_editor_smart_card_otp', 'isEnabled', true)) {
+      return;
+    }
+    if (!provider) {
+      return;
+    }
+    const updateSSRDataAvailability = async () => {
+      const resolvedProvider = await provider;
+      if (resolvedProvider instanceof EditorCardProvider) {
+        setIsSSRDataAvailable(resolvedProvider.getCacheStatusForNode(node) === 'ssr');
+      }
+    };
+    void updateSSRDataAvailability();
+  }, [provider, node]);
   const scrollContainer = useMemo(
   // Ignored via go/ees005
   // eslint-disable-next-line @atlaskit/editor/no-as-casting
@@ -121,7 +140,8 @@ export const InlineCard = /*#__PURE__*/memo(({
         isHovered: isHovered,
         showHoverPreview: showHoverPreview,
         hoverPreviewOptions: hoverPreviewOptions,
-        disablePreviewPanel: disablePreviewPanel
+        disablePreviewPanel: disablePreviewPanel,
+        hideIconLoadingSkeleton: expValEquals('platform_editor_smart_card_otp', 'isEnabled', true) && isSSRDataAvailable
       });
     }
     return /*#__PURE__*/React.createElement(SmartCard, {
@@ -139,7 +159,7 @@ export const InlineCard = /*#__PURE__*/memo(({
       hoverPreviewOptions: hoverPreviewOptions,
       disablePreviewPanel: disablePreviewPanel
     });
-  }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, disablePreviewPanel]);
+  }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, disablePreviewPanel, isSSRDataAvailable]);
 
   // [WS-2307]: we only render card wrapped into a Provider when the value is ready,
   // otherwise if we got data, we can render the card directly since it doesn't need the Provider
@@ -186,6 +206,7 @@ export function InlineCardNodeView(props) {
     pluginInjectionApi,
     onClickCallback,
     isPageSSRed,
+    provider,
     CompetitorPrompt
   } = props;
   const {
@@ -205,6 +226,7 @@ export function InlineCardNodeView(props) {
     pluginInjectionApi: pluginInjectionApi,
     onClickCallback: onClickCallback,
     isPageSSRed: isPageSSRed,
+    provider: provider,
     appearance: "inline"
     // Ignored via go/ees005
     // eslint-disable-next-line react/jsx-props-no-spreading

package/dist/es2019/nodeviews/inlineCardWithAwareness.js

@@ -42,6 +42,7 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
   isOverlayEnabled,
   isSelected,
   isPageSSRed,
+  provider,
   appearance
 }) => {
   var _pluginInjectionApi$c;
@@ -96,10 +97,11 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
       cardContext: cardContext,
       isHovered: isHovered,
       isPageSSRed: isPageSSRed,
+      provider: provider,
       pluginInjectionApi: pluginInjectionApi,
       disablePreviewPanel: true
     }));
-  }, [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed, pluginInjectionApi]);
+  }, [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed, provider, pluginInjectionApi]);
   const innerCardOriginal = useMemo(() => /*#__PURE__*/React.createElement(InlineCard, {
     node: node,
     view: view,
@@ -111,9 +113,10 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
     cardContext: cardContext,
     isHovered: isHovered,
     isPageSSRed: isPageSSRed,
+    provider: provider,
     pluginInjectionApi: pluginInjectionApi,
     showHoverPreview: false
-  }), [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed, pluginInjectionApi]);
+  }), [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed, provider, pluginInjectionApi]);
   const shouldShowOpenButtonOverlay = useMemo(() => {
     const shouldShowOpenButtonOverlayInChomeless = editorAppearance === 'chromeless';
     return (mode === 'edit' || editorAppearance === 'comment' || shouldShowOpenButtonOverlayInChomeless) && (editorExperiment('platform_editor_controls', 'variant1') || expValEquals('platform_editor_preview_panel_linking_exp', 'isEnabled', true));
@@ -179,6 +182,7 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
             cardContext: cardContext,
             isHovered: isHovered,
             isPageSSRed: isPageSSRed,
+            provider: provider,
             pluginInjectionApi: pluginInjectionApi,
             showHoverPreview: mode === 'view' && showHoverPreview,
             disablePreviewPanel: true
@@ -195,6 +199,7 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
             cardContext: cardContext,
             isHovered: isHovered,
             isPageSSRed: isPageSSRed,
+            provider: provider,
             pluginInjectionApi: pluginInjectionApi,
             showHoverPreview: mode === 'view' && showHoverPreview
           });

package/dist/es2019/pm-plugins/main.js

@@ -43,6 +43,7 @@ export const createPlugin = (options, pluginInjectionApi) => pmPluginFactoryPara
     allowBlockCards,
     onClickCallback,
     isPageSSRed,
+    provider,
     CompetitorPrompt
   } = options;
   const enableInlineUpgradeFeatures = !!showUpgradeDiscoverability;
@@ -58,6 +59,7 @@ export const createPlugin = (options, pluginInjectionApi) => pmPluginFactoryPara
       pluginInjectionApi,
       onClickCallback,
       isPageSSRed,
+      provider,
       CompetitorPrompt
     }
   });
@@ -233,6 +235,7 @@ export const createPlugin = (options, pluginInjectionApi) => pmPluginFactoryPara
         inlineCard: lazyInlineCardView({
           inlineCardViewProducer,
           isPageSSRed
+          // no need provider here, it's in the inlineCardViewProducer.extraComponentProps
         }),
         blockCard: lazyBlockCardView({
           pmPluginFactoryParams,
@@ -242,6 +245,7 @@ export const createPlugin = (options, pluginInjectionApi) => pmPluginFactoryPara
           allowDatasource: options.allowDatasource,
           inlineCardViewProducer,
           isPageSSRed,
+          provider,
           CompetitorPrompt: options.CompetitorPrompt
         }),
         embedCard: lazyEmbedCardView({
@@ -252,6 +256,7 @@ export const createPlugin = (options, pluginInjectionApi) => pmPluginFactoryPara
           actionOptions,
           onClickCallback: options.onClickCallback,
           isPageSSRed,
+          provider,
           CompetitorPrompt: options.CompetitorPrompt
         })
       },

package/dist/esm/nodeviews/blockCard.js

@@ -1,4 +1,5 @@
 import _get from "@babel/runtime/helpers/get";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
@@ -6,11 +7,15 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function _superPropGet(t, o, e, r) { var p = _get(_getPrototypeOf(1 & r ? t.prototype : t), o, e); return 2 & r && "function" == typeof p ? function (t) { return p.apply(e, t); } : p; }
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+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; }
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import React from 'react';
 import rafSchedule from 'raf-schd';
 import uuid from 'uuid/v4';
+import { EditorCardProvider } from '@atlaskit/editor-card-provider';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import { findOverflowScrollParent, UnsupportedBlock } from '@atlaskit/editor-common/ui';
 import { browser, canRenderDatasource } from '@atlaskit/editor-common/utils';
@@ -21,7 +26,6 @@ import { Datasource } from '../nodeviews/datasource';
 import { registerCard, removeCard as _removeCard } from '../pm-plugins/actions';
 import { isDatasourceNode } from '../pm-plugins/utils';
 import { Card } from './genericCard';
-
 // eslint-disable-next-line @repo/internal/react/no-class-components
 export var BlockCardComponent = /*#__PURE__*/function (_React$PureComponent) {
   function BlockCardComponent(props) {
@@ -30,6 +34,9 @@ export var BlockCardComponent = /*#__PURE__*/function (_React$PureComponent) {
     _this = _callSuper(this, BlockCardComponent, [props]);
     // Ignored via go/ees005
     // eslint-disable-next-line @atlaskit/editor/no-as-casting
+    _defineProperty(_this, "state", {
+      isSSRDataAvailable: false
+    });
     _defineProperty(_this, "onResolve", function (data) {
       var _this$props = _this.props,
         getPos = _this$props.getPos,
@@ -76,10 +83,53 @@ export var BlockCardComponent = /*#__PURE__*/function (_React$PureComponent) {
       }
     });
     _this.scrollContainer = findOverflowScrollParent(props.view.dom) || undefined;
+    _this.state = {
+      isSSRDataAvailable: expValEquals('platform_editor_smart_card_otp', 'isEnabled', true) && props.isPageSSRed
+    };
     return _this;
   }
   _inherits(BlockCardComponent, _React$PureComponent);
   return _createClass(BlockCardComponent, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var _this2 = this;
+      if (!expValEquals('platform_editor_smart_card_otp', 'isEnabled', true)) {
+        return;
+      }
+      var provider = this.props.provider;
+      if (!provider) {
+        return;
+      }
+      var updateSSRDataAvailability = /*#__PURE__*/function () {
+        var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+          var resolvedProvider;
+          return _regeneratorRuntime.wrap(function _callee$(_context) {
+            while (1) switch (_context.prev = _context.next) {
+              case 0:
+                _context.next = 2;
+                return provider;
+              case 2:
+                resolvedProvider = _context.sent;
+                if (resolvedProvider instanceof EditorCardProvider) {
+                  _this2.setState(function (state) {
+                    return _objectSpread(_objectSpread({}, state), {}, {
+                      isSSRDataAvailable: resolvedProvider.getCacheStatusForNode(_this2.props.node) === 'ssr'
+                    });
+                  });
+                }
+              case 4:
+              case "end":
+                return _context.stop();
+            }
+          }, _callee);
+        }));
+        return function updateSSRDataAvailability() {
+          return _ref2.apply(this, arguments);
+        };
+      }();
+      void updateSSRDataAvailability();
+    }
+  }, {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       this.removeCard();
@@ -120,7 +170,8 @@ export var BlockCardComponent = /*#__PURE__*/function (_React$PureComponent) {
         onError: this.onError,
         platform: 'web',
         actionOptions: actionOptions,
-        CompetitorPrompt: CompetitorPrompt
+        CompetitorPrompt: CompetitorPrompt,
+        hideIconLoadingSkeleton: expValEquals('platform_editor_smart_card_otp', 'isEnabled', true) && this.state.isSSRDataAvailable
       }), this.gapCursorSpan()) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SmartCard, {
         key: url,
         url: url !== null && url !== void 0 ? url : data.url,
@@ -144,31 +195,31 @@ export var BlockCardComponent = /*#__PURE__*/function (_React$PureComponent) {
 var WrappedBlockCard = Card(BlockCardComponent, UnsupportedBlock);
 export var BlockCard = /*#__PURE__*/function (_ReactNodeView) {
   function BlockCard() {
-    var _this2;
+    var _this3;
     _classCallCheck(this, BlockCard);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this2 = _callSuper(this, BlockCard, [].concat(args));
-    _defineProperty(_this2, "id", uuid());
-    _defineProperty(_this2, "updateContentEditable", function (editorViewModeState, divElement) {
+    _this3 = _callSuper(this, BlockCard, [].concat(args));
+    _defineProperty(_this3, "id", uuid());
+    _defineProperty(_this3, "updateContentEditable", function (editorViewModeState, divElement) {
       divElement.contentEditable = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view' ? 'false' : 'true';
     });
-    return _this2;
+    return _this3;
   }
   _inherits(BlockCard, _ReactNodeView);
   return _createClass(BlockCard, [{
     key: "createDomRef",
     value: function createDomRef() {
       var _this$reactComponentP,
-        _this3 = this,
+        _this4 = this,
         _this$reactComponentP2;
       var domRef = document.createElement('div');
       // workaround Chrome bug in https://product-fabric.atlassian.net/browse/ED-5379
       // see also: https://github.com/ProseMirror/prosemirror/issues/884
-      this.unsubscribe = (_this$reactComponentP = this.reactComponentProps.pluginInjectionApi) === null || _this$reactComponentP === void 0 || (_this$reactComponentP = _this$reactComponentP.editorViewMode) === null || _this$reactComponentP === void 0 ? void 0 : _this$reactComponentP.sharedState.onChange(function (_ref2) {
-        var nextSharedState = _ref2.nextSharedState;
-        return _this3.updateContentEditable(nextSharedState, domRef);
+      this.unsubscribe = (_this$reactComponentP = this.reactComponentProps.pluginInjectionApi) === null || _this$reactComponentP === void 0 || (_this$reactComponentP = _this$reactComponentP.editorViewMode) === null || _this$reactComponentP === void 0 ? void 0 : _this$reactComponentP.sharedState.onChange(function (_ref3) {
+        var nextSharedState = _ref3.nextSharedState;
+        return _this4.updateContentEditable(nextSharedState, domRef);
       });
       this.updateContentEditable((_this$reactComponentP2 = this.reactComponentProps.pluginInjectionApi) === null || _this$reactComponentP2 === void 0 || (_this$reactComponentP2 = _this$reactComponentP2.editorViewMode) === null || _this$reactComponentP2 === void 0 ? void 0 : _this$reactComponentP2.sharedState.currentState(), domRef);
       domRef.setAttribute('spellcheck', 'false');
@@ -200,7 +251,8 @@ export var BlockCard = /*#__PURE__*/function (_ReactNodeView) {
         pluginInjectionApi = _this$reactComponentP3.pluginInjectionApi,
         onClickCallback = _this$reactComponentP3.onClickCallback,
         CompetitorPrompt = _this$reactComponentP3.CompetitorPrompt,
-        isPageSSRed = _this$reactComponentP3.isPageSSRed;
+        isPageSSRed = _this$reactComponentP3.isPageSSRed,
+        provider = _this$reactComponentP3.provider;
       return /*#__PURE__*/React.createElement(WrappedBlockCard, {
         node: this.node,
         view: this.view,
@@ -210,7 +262,8 @@ export var BlockCard = /*#__PURE__*/function (_ReactNodeView) {
         onClickCallback: onClickCallback,
         id: this.id,
         CompetitorPrompt: CompetitorPrompt,
-        isPageSSRed: isPageSSRed
+        isPageSSRed: isPageSSRed,
+        provider: provider
       });
     }
   }, {
@@ -222,15 +275,16 @@ export var BlockCard = /*#__PURE__*/function (_ReactNodeView) {
     }
   }]);
 }(ReactNodeView);
-export var blockCardNodeView = function blockCardNodeView(_ref3) {
-  var pmPluginFactoryParams = _ref3.pmPluginFactoryParams,
-    actionOptions = _ref3.actionOptions,
-    pluginInjectionApi = _ref3.pluginInjectionApi,
-    onClickCallback = _ref3.onClickCallback,
-    allowDatasource = _ref3.allowDatasource,
-    inlineCardViewProducer = _ref3.inlineCardViewProducer,
-    CompetitorPrompt = _ref3.CompetitorPrompt,
-    isPageSSRed = _ref3.isPageSSRed;
+export var blockCardNodeView = function blockCardNodeView(_ref4) {
+  var pmPluginFactoryParams = _ref4.pmPluginFactoryParams,
+    actionOptions = _ref4.actionOptions,
+    pluginInjectionApi = _ref4.pluginInjectionApi,
+    onClickCallback = _ref4.onClickCallback,
+    allowDatasource = _ref4.allowDatasource,
+    inlineCardViewProducer = _ref4.inlineCardViewProducer,
+    CompetitorPrompt = _ref4.CompetitorPrompt,
+    isPageSSRed = _ref4.isPageSSRed,
+    provider = _ref4.provider;
   return function (node, view, getPos, decorations) {
     var portalProviderAPI = pmPluginFactoryParams.portalProviderAPI,
       eventDispatcher = pmPluginFactoryParams.eventDispatcher;
@@ -239,7 +293,8 @@ export var blockCardNodeView = function blockCardNodeView(_ref3) {
       pluginInjectionApi: pluginInjectionApi,
       onClickCallback: onClickCallback,
       CompetitorPrompt: CompetitorPrompt,
-      isPageSSRed: isPageSSRed
+      isPageSSRed: isPageSSRed,
+      provider: provider
     };
     var isDatasource = isDatasourceNode(node);
     if (isDatasource) {