@atlaskit/editor-plugin-card 1.7.0 → 1.8.1

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

@@ -43,7 +43,8 @@ export const createPlugin = (options, pluginInjectionApi) => pmPluginFactoryPara
     cardPluginEvents,
     showUpgradeDiscoverability,
     allowEmbeds,
-    allowBlockCards
+    allowBlockCards,
+    onClickCallback
   } = options;
   const enableInlineUpgradeFeatures = !!showUpgradeDiscoverability && platform !== 'mobile';
   const shouldUseUpgradeFeatures = getBooleanFF('platform.linking-platform.smart-card.inline-switcher') && enableInlineUpgradeFeatures;
@@ -57,7 +58,8 @@ export const createPlugin = (options, pluginInjectionApi) => pmPluginFactoryPara
       enableInlineUpgradeFeatures,
       allowEmbeds,
       allowBlockCards,
-      pluginInjectionApi
+      pluginInjectionApi,
+      onClickCallback
     }
   });
   return new SafePlugin({
@@ -226,7 +228,9 @@ export const createPlugin = (options, pluginInjectionApi) => pmPluginFactoryPara
           const reactComponentProps = {
             platform,
             actionOptions,
-            showServerActions
+            showServerActions,
+            pluginInjectionApi,
+            onClickCallback: options.onClickCallback
           };
           const hasIntlContext = true;
           const isDatasource = !!(node !== null && node !== void 0 && (_node$attrs3 = node.attrs) !== null && _node$attrs3 !== void 0 && _node$attrs3.datasource);
@@ -266,7 +270,8 @@ export const createPlugin = (options, pluginInjectionApi) => pmPluginFactoryPara
             dispatchAnalyticsEvent,
             pluginInjectionApi,
             actionOptions,
-            showServerActions
+            showServerActions,
+            onClickCallback: options.onClickCallback
           };
           const hasIntlContext = true;
           return new EmbedCard(node, view, getPos, portalProviderAPI, eventDispatcher, reactComponentProps, undefined, true, undefined, hasIntlContext).init();

package/dist/es2019/toolbar.js

@@ -389,6 +389,10 @@ const getDatasourceButtonGroup = (metadata, intl, editorAnalyticsApi, node, hove
     });
   }
   const canShowMainToolbar = () => {
+    // we do not show smart-link or the datasource icons when the node does not have a url to resolve
+    if (!metadata.url) {
+      return false;
+    }
     if (
     // FF that controls visibily of the additional toolbar buttons
     !getBooleanFF('platform.linking-platform.enable-datasource-appearance-toolbar')) {

package/dist/esm/nodeviews/blockCard.js

@@ -29,7 +29,6 @@ export var BlockCardComponent = /*#__PURE__*/function (_React$PureComponent) {
       args[_key] = arguments[_key];
     }
     _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "onClick", function () {});
     _defineProperty(_assertThisInitialized(_this), "onResolve", function (data) {
       var _this$props = _this.props,
         getPos = _this$props.getPos,
@@ -90,7 +89,8 @@ export var BlockCardComponent = /*#__PURE__*/function (_React$PureComponent) {
         cardContext = _this$props2.cardContext,
         platform = _this$props2.platform,
         actionOptions = _this$props2.actionOptions,
-        showServerActions = _this$props2.showServerActions;
+        showServerActions = _this$props2.showServerActions,
+        onClick = _this$props2.onClick;
       var _node$attrs = node.attrs,
         url = _node$attrs.url,
         data = _node$attrs.data;
@@ -100,7 +100,7 @@ export var BlockCardComponent = /*#__PURE__*/function (_React$PureComponent) {
         data: data,
         container: this.scrollContainer,
         appearance: "block",
-        onClick: this.onClick,
+        onClick: onClick,
         onResolve: this.onResolve,
         onError: this.onError,
         platform: platform,
@@ -164,14 +164,18 @@ export var BlockCard = /*#__PURE__*/function (_ReactNodeView) {
       var _this$reactComponentP = this.reactComponentProps,
         platform = _this$reactComponentP.platform,
         actionOptions = _this$reactComponentP.actionOptions,
-        showServerActions = _this$reactComponentP.showServerActions;
+        showServerActions = _this$reactComponentP.showServerActions,
+        pluginInjectionApi = _this$reactComponentP.pluginInjectionApi,
+        onClickCallback = _this$reactComponentP.onClickCallback;
       return /*#__PURE__*/React.createElement(WrappedBlockCard, {
         node: this.node,
         view: this.view,
         getPos: this.getPos,
         platform: platform,
         actionOptions: actionOptions,
-        showServerActions: showServerActions
+        showServerActions: showServerActions,
+        pluginInjectionApi: pluginInjectionApi,
+        onClickCallback: onClickCallback
       });
     }
   }]);

package/dist/esm/nodeviews/embedCard.js

@@ -104,7 +104,6 @@ export var EmbedCardComponent = /*#__PURE__*/function (_React$PureComponent) {
     }
     _this = _super.call.apply(_super, [this].concat(args));
     _defineProperty(_assertThisInitialized(_this), "embedIframeRef", /*#__PURE__*/React.createRef());
-    _defineProperty(_assertThisInitialized(_this), "onClick", function () {});
     _defineProperty(_assertThisInitialized(_this), "state", {
       hasPreview: true
     });
@@ -265,7 +264,8 @@ export var EmbedCardComponent = /*#__PURE__*/function (_React$PureComponent) {
         getPos = _this$props.getPos,
         pluginInjectionApi = _this$props.pluginInjectionApi,
         actionOptions = _this$props.actionOptions,
-        showServerActions = _this$props.showServerActions;
+        showServerActions = _this$props.showServerActions,
+        onClick = _this$props.onClick;
       var _node$attrs = node.attrs,
         url = _node$attrs.url,
         pctWidth = _node$attrs.width,
@@ -296,7 +296,7 @@ export var EmbedCardComponent = /*#__PURE__*/function (_React$PureComponent) {
         key: url,
         url: url,
         appearance: "embed",
-        onClick: this.onClick,
+        onClick: onClick,
         onResolve: this.onResolve,
         onError: this.onError,
         frameStyle: "show",
@@ -382,7 +382,8 @@ export var EmbedCard = /*#__PURE__*/function (_ReactNodeView) {
         platform = _this$reactComponentP.platform,
         fullWidthMode = _this$reactComponentP.fullWidthMode,
         dispatchAnalyticsEvent = _this$reactComponentP.dispatchAnalyticsEvent,
-        pluginInjectionApi = _this$reactComponentP.pluginInjectionApi;
+        pluginInjectionApi = _this$reactComponentP.pluginInjectionApi,
+        onClickCallback = _this$reactComponentP.onClickCallback;
       return /*#__PURE__*/React.createElement(WrappedBlockCard, {
         node: this.node,
         view: this.view,
@@ -392,7 +393,8 @@ export var EmbedCard = /*#__PURE__*/function (_ReactNodeView) {
         platform: platform,
         fullWidthMode: fullWidthMode,
         dispatchAnalyticsEvent: dispatchAnalyticsEvent,
-        pluginInjectionApi: pluginInjectionApi
+        pluginInjectionApi: pluginInjectionApi,
+        onClickCallback: onClickCallback
       });
     }
   }]);

package/dist/esm/nodeviews/genericCard.js

@@ -8,14 +8,41 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 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 React, { useCallback } from 'react';
 import PropTypes from 'prop-types';
 import { isSafeUrl } from '@atlaskit/adf-schema';
 import { AnalyticsContext } from '@atlaskit/analytics-next';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { getAnalyticsEditorAppearance } from '@atlaskit/editor-common/utils';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { changeSelectedCardToLinkFallback } from '../pm-plugins/doc';
 import { getPluginState } from '../pm-plugins/util/state';
 import { titleUrlPairFromNode } from '../utils';
+var WithClickHandler = function WithClickHandler(_ref) {
+  var pluginInjectionApi = _ref.pluginInjectionApi,
+    url = _ref.url,
+    onClickCallback = _ref.onClickCallback,
+    children = _ref.children;
+  var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['editorViewMode']),
+    editorViewModeState = _useSharedPluginState.editorViewModeState;
+  var onClick = useCallback(function (event) {
+    if (typeof onClickCallback === 'function') {
+      try {
+        onClickCallback({
+          event: event,
+          url: url
+        });
+      } catch (_unused) {}
+    }
+  }, [url, onClickCallback]);
+
+  // Setting `onClick` to `undefined` ensures clicks on smartcards navigate to the URL.
+  // If in view mode and not overriding with onClickCallback option, then allow smartlinks to navigate on click.
+  var allowNavigation = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view' && !onClickCallback;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, children({
+    onClick: allowNavigation ? undefined : onClick
+  }));
+};
 export function Card(SmartCardComponent, UnsupportedComponent) {
   var _class;
   return _class = /*#__PURE__*/function (_React$Component) {
@@ -31,12 +58,17 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
       _defineProperty(_assertThisInitialized(_this), "state", {
         isError: false
       });
+      _defineProperty(_assertThisInitialized(_this), "onClick", function () {});
       return _this;
     }
     _createClass(_class, [{
       key: "render",
       value: function render() {
-        var _getPluginState;
+        var _getPluginState,
+          _this2 = this;
+        var _this$props = this.props,
+          pluginInjectionApi = _this$props.pluginInjectionApi,
+          onClickCallback = _this$props.onClickCallback;
         var _titleUrlPairFromNode = titleUrlPairFromNode(this.props.node),
           url = _titleUrlPairFromNode.url;
         if (url && !isSafeUrl(url)) {
@@ -65,10 +97,24 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
             // Below is added for the future implementation of Linking Platform namespaced analytics context
             location: analyticsEditorAppearance
           }
-        }, /*#__PURE__*/React.createElement(SmartCardComponent, _extends({
+        }, getBooleanFF('platform.linking-platform.smart-card.on-click-callback') ? /*#__PURE__*/React.createElement(WithClickHandler, {
+          pluginInjectionApi: pluginInjectionApi,
+          onClickCallback: onClickCallback,
+          url: url
+        }, function (_ref2) {
+          var onClick = _ref2.onClick;
+          return /*#__PURE__*/React.createElement(SmartCardComponent, _extends({
+            key: url,
+            cardContext: cardContext
+          }, _this2.props, {
+            onClick: onClick
+          }));
+        }) : /*#__PURE__*/React.createElement(SmartCardComponent, _extends({
           key: url,
           cardContext: cardContext
-        }, this.props)));
+        }, this.props, {
+          onClick: this.onClick
+        })));
       }
     }, {
       key: "componentDidCatch",
@@ -84,11 +130,11 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
           this.setState({
             isError: true
           });
-          var _this$props = this.props,
-            view = _this$props.view,
-            node = _this$props.node,
-            getPos = _this$props.getPos,
-            pluginInjectionApi = _this$props.pluginInjectionApi;
+          var _this$props2 = this.props,
+            view = _this$props2.view,
+            node = _this$props2.node,
+            getPos = _this$props2.getPos,
+            pluginInjectionApi = _this$props2.pluginInjectionApi;
           var _titleUrlPairFromNode2 = titleUrlPairFromNode(node),
             url = _titleUrlPairFromNode2.url;
           if (!getPos || typeof getPos === 'boolean') {

package/dist/esm/nodeviews/inlineCard.js

@@ -31,7 +31,6 @@ export var InlineCardComponent = /*#__PURE__*/function (_React$PureComponent) {
       args[_key] = arguments[_key];
     }
     _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "onClick", function () {});
     _defineProperty(_assertThisInitialized(_this), "onResolve", function (data) {
       var _this$props = _this.props,
         getPos = _this$props.getPos,
@@ -85,7 +84,8 @@ export var InlineCardComponent = /*#__PURE__*/function (_React$PureComponent) {
         cardContext = _this$props2.cardContext,
         actionOptions = _this$props2.actionOptions,
         showServerActions = _this$props2.showServerActions,
-        useAlternativePreloader = _this$props2.useAlternativePreloader;
+        useAlternativePreloader = _this$props2.useAlternativePreloader,
+        onClick = _this$props2.onClick;
       var _node$attrs = node.attrs,
         url = _node$attrs.url,
         data = _node$attrs.data;
@@ -96,7 +96,7 @@ export var InlineCardComponent = /*#__PURE__*/function (_React$PureComponent) {
         url: url,
         data: data,
         appearance: "inline",
-        onClick: this.onClick,
+        onClick: onClick,
         container: this.scrollContainer,
         onResolve: this.onResolve,
         onError: this.onError,
@@ -128,7 +128,8 @@ export function InlineCardNodeView(props) {
     allowEmbeds = props.allowEmbeds,
     allowBlockCards = props.allowBlockCards,
     enableInlineUpgradeFeatures = props.enableInlineUpgradeFeatures,
-    pluginInjectionApi = props.pluginInjectionApi;
+    pluginInjectionApi = props.pluginInjectionApi,
+    onClickCallback = props.onClickCallback;
   if (!getBooleanFF('platform.linking-platform.smart-card.inline-switcher')) {
     return /*#__PURE__*/React.createElement(WrappedInlineCard, {
       node: node,
@@ -136,7 +137,9 @@ export function InlineCardNodeView(props) {
       getPos: getPos,
       actionOptions: actionOptions,
       showServerActions: showServerActions,
-      useAlternativePreloader: useAlternativePreloader
+      useAlternativePreloader: useAlternativePreloader,
+      pluginInjectionApi: pluginInjectionApi,
+      onClickCallback: onClickCallback
     });
   }
   return /*#__PURE__*/React.createElement(WrappedInlineCardWithAwareness, _extends({
@@ -146,7 +149,8 @@ export function InlineCardNodeView(props) {
     actionOptions: actionOptions,
     showServerActions: showServerActions,
     useAlternativePreloader: useAlternativePreloader,
-    pluginInjectionApi: pluginInjectionApi
+    pluginInjectionApi: pluginInjectionApi,
+    onClickCallback: onClickCallback
   }, enableInlineUpgradeFeatures && getAwarenessProps(view.state, getPos, allowEmbeds, allowBlockCards)));
 }
 var getAwarenessProps = function getAwarenessProps(editorState, getPos, allowEmbeds, allowBlockCards) {

package/dist/esm/nodeviews/inlineCardWithAwareness.js

@@ -17,7 +17,8 @@ var InlineCard = function InlineCard(_ref) {
     isPulseEnabled = _ref.isPulseEnabled,
     pluginInjectionApi = _ref.pluginInjectionApi,
     _ref$isSelected = _ref.isSelected,
-    isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected;
+    isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
+    onClick = _ref.onClick;
   var _node$attrs = node.attrs,
     url = _node$attrs.url,
     data = _node$attrs.data;
@@ -95,7 +96,7 @@ var InlineCard = function InlineCard(_ref) {
       url: url,
       data: data,
       appearance: "inline",
-      onClick: function onClick() {},
+      onClick: onClick,
       container: scrollContainer,
       onResolve: onResolve,
       onError: onError,
@@ -104,7 +105,7 @@ var InlineCard = function InlineCard(_ref) {
       showServerActions: showServerActions,
       isHovered: isHovered
     });
-  }, [data, isHovered, onError, onResolve, scrollContainer, url, useAlternativePreloader, actionOptions, showServerActions]);
+  }, [data, isHovered, onError, onResolve, scrollContainer, url, useAlternativePreloader, actionOptions, showServerActions, onClick]);
   var card = useMemo(function () {
     return isOverlayEnabled || isPulseEnabled ? /*#__PURE__*/React.createElement(AwarenessWrapper, {
       isOverlayEnabled: isOverlayEnabled,

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

@@ -47,7 +47,8 @@ export var createPlugin = function createPlugin(options, pluginInjectionApi) {
       cardPluginEvents = options.cardPluginEvents,
       showUpgradeDiscoverability = options.showUpgradeDiscoverability,
       allowEmbeds = options.allowEmbeds,
-      allowBlockCards = options.allowBlockCards;
+      allowBlockCards = options.allowBlockCards,
+      onClickCallback = options.onClickCallback;
     var enableInlineUpgradeFeatures = !!showUpgradeDiscoverability && platform !== 'mobile';
     var shouldUseUpgradeFeatures = getBooleanFF('platform.linking-platform.smart-card.inline-switcher') && enableInlineUpgradeFeatures;
     var inlineCardViewProducer = getInlineNodeViewProducer({
@@ -60,7 +61,8 @@ export var createPlugin = function createPlugin(options, pluginInjectionApi) {
         enableInlineUpgradeFeatures: enableInlineUpgradeFeatures,
         allowEmbeds: allowEmbeds,
         allowBlockCards: allowBlockCards,
-        pluginInjectionApi: pluginInjectionApi
+        pluginInjectionApi: pluginInjectionApi,
+        onClickCallback: onClickCallback
       }
     });
     return new SafePlugin({
@@ -222,7 +224,9 @@ export var createPlugin = function createPlugin(options, pluginInjectionApi) {
             var reactComponentProps = {
               platform: platform,
               actionOptions: actionOptions,
-              showServerActions: showServerActions
+              showServerActions: showServerActions,
+              pluginInjectionApi: pluginInjectionApi,
+              onClickCallback: options.onClickCallback
             };
             var hasIntlContext = true;
             var isDatasource = !!(node !== null && node !== void 0 && (_node$attrs3 = node.attrs) !== null && _node$attrs3 !== void 0 && _node$attrs3.datasource);
@@ -260,7 +264,8 @@ export var createPlugin = function createPlugin(options, pluginInjectionApi) {
               dispatchAnalyticsEvent: dispatchAnalyticsEvent,
               pluginInjectionApi: pluginInjectionApi,
               actionOptions: actionOptions,
-              showServerActions: showServerActions
+              showServerActions: showServerActions,
+              onClickCallback: options.onClickCallback
             };
             var hasIntlContext = true;
             return new EmbedCard(node, view, getPos, portalProviderAPI, eventDispatcher, reactComponentProps, undefined, true, undefined, hasIntlContext).init();

package/dist/esm/toolbar.js

@@ -388,6 +388,10 @@ var getDatasourceButtonGroup = function getDatasourceButtonGroup(metadata, intl,
     });
   }
   var canShowMainToolbar = function canShowMainToolbar() {
+    // we do not show smart-link or the datasource icons when the node does not have a url to resolve
+    if (!metadata.url) {
+      return false;
+    }
     if (
     // FF that controls visibily of the additional toolbar buttons
     !getBooleanFF('platform.linking-platform.enable-datasource-appearance-toolbar')) {

package/dist/types/nodeviews/blockCard.d.ts

@@ -6,7 +6,6 @@ import type { Decoration, DecorationSource } from '@atlaskit/editor-prosemirror/
 import type { SmartCardProps } from './genericCard';
 export declare class BlockCardComponent extends React.PureComponent<SmartCardProps> {
     private scrollContainer?;
-    onClick: () => void;
     static contextTypes: {
         contextAdapter: PropTypes.Requireable<object>;
     };
@@ -21,7 +20,7 @@ export declare class BlockCardComponent extends React.PureComponent<SmartCardPro
     }) => void;
     render(): JSX.Element;
 }
-export type BlockCardNodeViewProps = Pick<SmartCardProps, 'platform' | 'actionOptions' | 'showServerActions'>;
+export type BlockCardNodeViewProps = Pick<SmartCardProps, 'platform' | 'actionOptions' | 'showServerActions' | 'pluginInjectionApi' | 'onClickCallback'>;
 export declare class BlockCard extends ReactNodeView<BlockCardNodeViewProps> {
     createDomRef(): HTMLElement;
     validUpdate(currentNode: Node, newNode: Node): boolean;

package/dist/types/nodeviews/embedCard.d.ts

@@ -13,7 +13,6 @@ export declare class EmbedCardComponent extends React.PureComponent<SmartCardPro
     private scrollContainer?;
     private embedIframeRef;
     context: any;
-    onClick: () => void;
     static contextTypes: {
         contextAdapter: PropTypes.Requireable<object>;
     };
@@ -39,7 +38,7 @@ export declare class EmbedCardComponent extends React.PureComponent<SmartCardPro
     }) => void;
     render(): JSX.Element;
 }
-export type EmbedCardNodeViewProps = Pick<SmartCardProps, 'eventDispatcher' | 'allowResizing' | 'platform' | 'fullWidthMode' | 'dispatchAnalyticsEvent' | 'pluginInjectionApi' | 'actionOptions' | 'showServerActions'>;
+export type EmbedCardNodeViewProps = Pick<SmartCardProps, 'eventDispatcher' | 'allowResizing' | 'platform' | 'fullWidthMode' | 'dispatchAnalyticsEvent' | 'pluginInjectionApi' | 'actionOptions' | 'showServerActions' | 'onClickCallback'>;
 export declare class EmbedCard extends ReactNodeView<EmbedCardNodeViewProps> {
     viewShouldUpdate(nextNode: PMNode): boolean;
     createDomRef(): HTMLElement;

package/dist/types/nodeviews/genericCard.d.ts

@@ -1,12 +1,14 @@
 import React from 'react';
+import type { EventHandler, KeyboardEvent, MouseEvent } from 'react';
 import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
+import type { OnClickCallback } from '@atlaskit/editor-common/card';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import type { getPosHandler, ReactComponentProps } from '@atlaskit/editor-common/react-node-view';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
-import type { CardContext } from '@atlaskit/link-provider';
+import { type CardContext } from '@atlaskit/link-provider';
 import type { CardProps as BaseCardProps, CardPlatform } from '@atlaskit/smart-card';
 import type { cardPlugin } from '../index';
 export type EditorContext<T> = React.Context<T> & {
@@ -40,8 +42,11 @@ export interface CardProps extends CardNodeViewProps {
     isPulseEnabled?: boolean;
     linkPosition?: number;
     isSelected?: boolean;
+    onClickCallback?: OnClickCallback;
 }
 export interface SmartCardProps extends CardProps {
+    pluginInjectionApi?: ExtractInjectionAPI<typeof cardPlugin>;
     cardContext?: EditorContext<CardContext | undefined>;
+    onClick?: EventHandler<MouseEvent | KeyboardEvent> | undefined;
 }
 export declare function Card(SmartCardComponent: React.ComponentType<React.PropsWithChildren<SmartCardProps>>, UnsupportedComponent: React.ComponentType<React.PropsWithChildren<unknown>>): React.ComponentType<React.PropsWithChildren<CardProps>>;

package/dist/types/nodeviews/inlineCard.d.ts

@@ -4,7 +4,6 @@ import type { InlineNodeViewComponentProps } from '@atlaskit/editor-common/react
 import type { SmartCardProps } from './genericCard';
 export declare class InlineCardComponent extends React.PureComponent<SmartCardProps> {
     private scrollContainer?;
-    private onClick;
     static contextTypes: {
         contextAdapter: PropTypes.Requireable<object>;
     };
@@ -19,7 +18,7 @@ export declare class InlineCardComponent extends React.PureComponent<SmartCardPr
     }) => void;
     render(): JSX.Element | null;
 }
-export type InlineCardNodeViewProps = Pick<SmartCardProps, 'useAlternativePreloader' | 'actionOptions' | 'showServerActions' | 'allowEmbeds' | 'allowBlockCards' | 'enableInlineUpgradeFeatures' | 'pluginInjectionApi'>;
+export type InlineCardNodeViewProps = Pick<SmartCardProps, 'useAlternativePreloader' | 'actionOptions' | 'showServerActions' | 'allowEmbeds' | 'allowBlockCards' | 'enableInlineUpgradeFeatures' | 'pluginInjectionApi' | 'onClickCallback'>;
 type InlineCardWithAwarenessProps = {
     allowEmbeds?: boolean;
     allowBlockCards?: boolean;

package/dist/types/nodeviews/inlineCardWithAwareness.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { SmartCardProps } from './genericCard';
-export declare const InlineCardWithAwareness: React.MemoExoticComponent<({ node, cardContext, actionOptions, showServerActions, useAlternativePreloader, view, getPos, isOverlayEnabled, isPulseEnabled, pluginInjectionApi, isSelected, }: SmartCardProps) => JSX.Element | null>;
+export declare const InlineCardWithAwareness: React.MemoExoticComponent<({ node, cardContext, actionOptions, showServerActions, useAlternativePreloader, view, getPos, isOverlayEnabled, isPulseEnabled, pluginInjectionApi, isSelected, onClick, }: SmartCardProps) => JSX.Element | null>;

package/dist/types/plugin.d.ts

@@ -2,6 +2,7 @@ import type { CardPluginActions } from '@atlaskit/editor-common/card';
 import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { DecorationsPlugin } from '@atlaskit/editor-plugin-decorations';
+import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { FloatingToolbarPlugin } from '@atlaskit/editor-plugin-floating-toolbar';
 import type { GridPlugin } from '@atlaskit/editor-plugin-grid';
@@ -13,6 +14,7 @@ export type CardPlugin = NextEditorPlugin<'card', {
     dependencies: [
         OptionalPlugin<FeatureFlagsPlugin>,
         OptionalPlugin<AnalyticsPlugin>,
+        OptionalPlugin<EditorViewModePlugin>,
         WidthPlugin,
         DecorationsPlugin,
         GridPlugin,

package/dist/types/types.d.ts

@@ -1,6 +1,6 @@
 import type { UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import type { ACTION } from '@atlaskit/editor-common/analytics';
-import type { CardOptions, CardReplacementInputMethod } from '@atlaskit/editor-common/card';
+import type { CardOptions, CardReplacementInputMethod, OnClickCallback } from '@atlaskit/editor-common/card';
 import type { CardAppearance, CardProvider } from '@atlaskit/editor-common/provider-factory';
 import type { DatasourceModalType, EditorAppearance, LinkPickerOptions } from '@atlaskit/editor-common/types';
 import type { DatasourceAdfView } from '@atlaskit/linking-common';
@@ -100,6 +100,7 @@ export type CardPluginOptions = CardOptions & {
     cardPluginEvents?: EditorCardPluginEvents<CardPluginEvent>;
     lpLinkPicker?: boolean;
     disableFloatingToolbar?: boolean;
+    onClickCallback?: OnClickCallback;
 };
 export type SetProvider = {
     type: 'SET_PROVIDER';

package/dist/types-ts4.5/nodeviews/blockCard.d.ts

@@ -6,7 +6,6 @@ import type { Decoration, DecorationSource } from '@atlaskit/editor-prosemirror/
 import type { SmartCardProps } from './genericCard';
 export declare class BlockCardComponent extends React.PureComponent<SmartCardProps> {
     private scrollContainer?;
-    onClick: () => void;
     static contextTypes: {
         contextAdapter: PropTypes.Requireable<object>;
     };
@@ -21,7 +20,7 @@ export declare class BlockCardComponent extends React.PureComponent<SmartCardPro
     }) => void;
     render(): JSX.Element;
 }
-export type BlockCardNodeViewProps = Pick<SmartCardProps, 'platform' | 'actionOptions' | 'showServerActions'>;
+export type BlockCardNodeViewProps = Pick<SmartCardProps, 'platform' | 'actionOptions' | 'showServerActions' | 'pluginInjectionApi' | 'onClickCallback'>;
 export declare class BlockCard extends ReactNodeView<BlockCardNodeViewProps> {
     createDomRef(): HTMLElement;
     validUpdate(currentNode: Node, newNode: Node): boolean;

package/dist/types-ts4.5/nodeviews/embedCard.d.ts

@@ -13,7 +13,6 @@ export declare class EmbedCardComponent extends React.PureComponent<SmartCardPro
     private scrollContainer?;
     private embedIframeRef;
     context: any;
-    onClick: () => void;
     static contextTypes: {
         contextAdapter: PropTypes.Requireable<object>;
     };
@@ -39,7 +38,7 @@ export declare class EmbedCardComponent extends React.PureComponent<SmartCardPro
     }) => void;
     render(): JSX.Element;
 }
-export type EmbedCardNodeViewProps = Pick<SmartCardProps, 'eventDispatcher' | 'allowResizing' | 'platform' | 'fullWidthMode' | 'dispatchAnalyticsEvent' | 'pluginInjectionApi' | 'actionOptions' | 'showServerActions'>;
+export type EmbedCardNodeViewProps = Pick<SmartCardProps, 'eventDispatcher' | 'allowResizing' | 'platform' | 'fullWidthMode' | 'dispatchAnalyticsEvent' | 'pluginInjectionApi' | 'actionOptions' | 'showServerActions' | 'onClickCallback'>;
 export declare class EmbedCard extends ReactNodeView<EmbedCardNodeViewProps> {
     viewShouldUpdate(nextNode: PMNode): boolean;
     createDomRef(): HTMLElement;

package/dist/types-ts4.5/nodeviews/genericCard.d.ts

@@ -1,12 +1,14 @@
 import React from 'react';
+import type { EventHandler, KeyboardEvent, MouseEvent } from 'react';
 import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
+import type { OnClickCallback } from '@atlaskit/editor-common/card';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import type { getPosHandler, ReactComponentProps } from '@atlaskit/editor-common/react-node-view';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
-import type { CardContext } from '@atlaskit/link-provider';
+import { type CardContext } from '@atlaskit/link-provider';
 import type { CardProps as BaseCardProps, CardPlatform } from '@atlaskit/smart-card';
 import type { cardPlugin } from '../index';
 export type EditorContext<T> = React.Context<T> & {
@@ -40,8 +42,11 @@ export interface CardProps extends CardNodeViewProps {
     isPulseEnabled?: boolean;
     linkPosition?: number;
     isSelected?: boolean;
+    onClickCallback?: OnClickCallback;
 }
 export interface SmartCardProps extends CardProps {
+    pluginInjectionApi?: ExtractInjectionAPI<typeof cardPlugin>;
     cardContext?: EditorContext<CardContext | undefined>;
+    onClick?: EventHandler<MouseEvent | KeyboardEvent> | undefined;
 }
 export declare function Card(SmartCardComponent: React.ComponentType<React.PropsWithChildren<SmartCardProps>>, UnsupportedComponent: React.ComponentType<React.PropsWithChildren<unknown>>): React.ComponentType<React.PropsWithChildren<CardProps>>;

package/dist/types-ts4.5/nodeviews/inlineCard.d.ts

@@ -4,7 +4,6 @@ import type { InlineNodeViewComponentProps } from '@atlaskit/editor-common/react
 import type { SmartCardProps } from './genericCard';
 export declare class InlineCardComponent extends React.PureComponent<SmartCardProps> {
     private scrollContainer?;
-    private onClick;
     static contextTypes: {
         contextAdapter: PropTypes.Requireable<object>;
     };
@@ -19,7 +18,7 @@ export declare class InlineCardComponent extends React.PureComponent<SmartCardPr
     }) => void;
     render(): JSX.Element | null;
 }
-export type InlineCardNodeViewProps = Pick<SmartCardProps, 'useAlternativePreloader' | 'actionOptions' | 'showServerActions' | 'allowEmbeds' | 'allowBlockCards' | 'enableInlineUpgradeFeatures' | 'pluginInjectionApi'>;
+export type InlineCardNodeViewProps = Pick<SmartCardProps, 'useAlternativePreloader' | 'actionOptions' | 'showServerActions' | 'allowEmbeds' | 'allowBlockCards' | 'enableInlineUpgradeFeatures' | 'pluginInjectionApi' | 'onClickCallback'>;
 type InlineCardWithAwarenessProps = {
     allowEmbeds?: boolean;
     allowBlockCards?: boolean;

package/dist/types-ts4.5/nodeviews/inlineCardWithAwareness.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { SmartCardProps } from './genericCard';
-export declare const InlineCardWithAwareness: React.MemoExoticComponent<({ node, cardContext, actionOptions, showServerActions, useAlternativePreloader, view, getPos, isOverlayEnabled, isPulseEnabled, pluginInjectionApi, isSelected, }: SmartCardProps) => JSX.Element | null>;
+export declare const InlineCardWithAwareness: React.MemoExoticComponent<({ node, cardContext, actionOptions, showServerActions, useAlternativePreloader, view, getPos, isOverlayEnabled, isPulseEnabled, pluginInjectionApi, isSelected, onClick, }: SmartCardProps) => JSX.Element | null>;

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

@@ -2,6 +2,7 @@ import type { CardPluginActions } from '@atlaskit/editor-common/card';
 import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { DecorationsPlugin } from '@atlaskit/editor-plugin-decorations';
+import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { FloatingToolbarPlugin } from '@atlaskit/editor-plugin-floating-toolbar';
 import type { GridPlugin } from '@atlaskit/editor-plugin-grid';
@@ -13,6 +14,7 @@ export type CardPlugin = NextEditorPlugin<'card', {
     dependencies: [
         OptionalPlugin<FeatureFlagsPlugin>,
         OptionalPlugin<AnalyticsPlugin>,
+        OptionalPlugin<EditorViewModePlugin>,
         WidthPlugin,
         DecorationsPlugin,
         GridPlugin,

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

@@ -1,6 +1,6 @@
 import type { UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import type { ACTION } from '@atlaskit/editor-common/analytics';
-import type { CardOptions, CardReplacementInputMethod } from '@atlaskit/editor-common/card';
+import type { CardOptions, CardReplacementInputMethod, OnClickCallback } from '@atlaskit/editor-common/card';
 import type { CardAppearance, CardProvider } from '@atlaskit/editor-common/provider-factory';
 import type { DatasourceModalType, EditorAppearance, LinkPickerOptions } from '@atlaskit/editor-common/types';
 import type { DatasourceAdfView } from '@atlaskit/linking-common';
@@ -100,6 +100,7 @@ export type CardPluginOptions = CardOptions & {
     cardPluginEvents?: EditorCardPluginEvents<CardPluginEvent>;
     lpLinkPicker?: boolean;
     disableFloatingToolbar?: boolean;
+    onClickCallback?: OnClickCallback;
 };
 export type SetProvider = {
     type: 'SET_PROVIDER';