@atlaskit/editor-plugin-card 6.4.4 → 6.4.5

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/editor-plugin-card
 
+## 6.4.5
+
+### Patch Changes
+
+- [#163546](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/163546)
+  [`d3faab1b963ad`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d3faab1b963ad) -
+  [ux] ED-28147 smart link support for cmd/ctrl click to open in new tab
+- Updated dependencies
+
 ## 6.4.4
 
 ### Patch Changes

package/dist/cjs/nodeviews/inlineCard.js

@@ -13,6 +13,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = _interopRequireWildcard(require("react"));
 var _rafSchd = _interopRequireDefault(require("raf-schd"));
 var _v = _interopRequireDefault(require("uuid/v4"));
+var _analytics = require("@atlaskit/editor-common/analytics");
 var _hooks = require("@atlaskit/editor-common/hooks");
 var _link = require("@atlaskit/editor-common/link");
 var _ui = require("@atlaskit/editor-common/ui");
@@ -21,9 +22,11 @@ var _state = require("@atlaskit/editor-prosemirror/state");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _smartCard = require("@atlaskit/smart-card");
 var _ssr = require("@atlaskit/smart-card/ssr");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _actions = require("../pm-plugins/actions");
 var _utils = require("../pm-plugins/utils");
 var _ConfigureOverlay = _interopRequireDefault(require("../ui/ConfigureOverlay"));
+var _toolbar = require("../ui/toolbar");
 var _genericCard = require("./genericCard");
 var _inlineCardWithAwareness = require("./inlineCardWithAwareness");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
@@ -39,7 +42,8 @@ var InlineCard = exports.InlineCard = /*#__PURE__*/(0, _react.memo)(function (_r
     isHovered = _ref.isHovered,
     showHoverPreview = _ref.showHoverPreview,
     hoverPreviewOptions = _ref.hoverPreviewOptions,
-    isPageSSRed = _ref.isPageSSRed;
+    isPageSSRed = _ref.isPageSSRed,
+    pluginInjectionApi = _ref.pluginInjectionApi;
   var _node$attrs = node.attrs,
     url = _node$attrs.url,
     data = _node$attrs.data;
@@ -95,13 +99,28 @@ var InlineCard = exports.InlineCard = /*#__PURE__*/(0, _react.memo)(function (_r
       url: url
     });
   }, [onResolve]);
+  var handleOnClick = (0, _react.useCallback)(function (event) {
+    onClick === null || onClick === void 0 || onClick(event);
+    if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _experiments.editorExperiment)('platform_editor_smart_link_cmd_ctrl_click', true, {
+      exposure: true
+    })) {
+      // open link in new tab when performing a cmd/ctrl + click
+      if (event.metaKey || event.ctrlKey) {
+        var _pluginInjectionApi$a;
+        var _ref2 = (_pluginInjectionApi$a = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.analytics) !== null && _pluginInjectionApi$a !== void 0 ? _pluginInjectionApi$a : {},
+          editorAnalyticsApi = _ref2.actions;
+        (0, _toolbar.visitCardLinkAnalyticsOnly)(editorAnalyticsApi, _analytics.INPUT_METHOD.META_CLICK)(view.state, view.dispatch);
+        window.open(url, '_blank');
+      }
+    }
+  }, [onClick, url, view, pluginInjectionApi]);
   var card = (0, _react.useMemo)(function () {
     if (isPageSSRed && url && (0, _platformFeatureFlags.fg)('platform_ssr_smartlinks_editor')) {
       return /*#__PURE__*/_react.default.createElement(_ssr.CardSSR, {
         key: url,
         url: url,
         appearance: "inline",
-        onClick: onClick,
+        onClick: handleOnClick,
         container: scrollContainer,
         onResolve: onResolve,
         onError: onError,
@@ -116,7 +135,7 @@ var InlineCard = exports.InlineCard = /*#__PURE__*/(0, _react.memo)(function (_r
       key: url,
       url: url !== null && url !== void 0 ? url : data.url,
       appearance: "inline",
-      onClick: onClick,
+      onClick: handleOnClick,
       container: scrollContainer,
       onResolve: onResolve,
       onError: onError,
@@ -126,7 +145,7 @@ var InlineCard = exports.InlineCard = /*#__PURE__*/(0, _react.memo)(function (_r
       showHoverPreview: showHoverPreview,
       hoverPreviewOptions: hoverPreviewOptions
     });
-  }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed]);
+  }, [url, data, handleOnClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed]);
 
   // [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
@@ -206,9 +225,9 @@ function InlineCardNodeView(props) {
       view: view,
       isHoveredCallback: setIsOverlayHovered,
       onOpenLinkClick: function onOpenLinkClick(event) {
-        var _pluginInjectionApi$a;
+        var _pluginInjectionApi$a2;
         (0, _link.handleNavigation)({
-          fireAnalyticsEvent: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.fireAnalyticsEvent,
+          fireAnalyticsEvent: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a2 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a2 === void 0 ? void 0 : _pluginInjectionApi$a2.actions.fireAnalyticsEvent,
           onClickCallback: onClickCallback,
           url: url,
           event: event
@@ -230,8 +249,8 @@ function InlineCardNodeView(props) {
     // eslint-disable-next-line react/jsx-props-no-spreading
   }, enableInlineUpgradeFeatures && (0, _utils.getAwarenessProps)(view.state, getPos, allowEmbeds, allowBlockCards, mode === 'view'))), (0, _platformFeatureFlags.fg)('prompt_whiteboard_competitor_link_gate') && CompetitorPromptComponent);
 }
-var inlineCardNodeView = exports.inlineCardNodeView = function inlineCardNodeView(_ref2) {
-  var inlineCardViewProducer = _ref2.inlineCardViewProducer;
+var inlineCardNodeView = exports.inlineCardNodeView = function inlineCardNodeView(_ref3) {
+  var inlineCardViewProducer = _ref3.inlineCardViewProducer;
   return function (node, view, getPos, decorations) {
     return inlineCardViewProducer(node, view, getPos, decorations);
   };

package/dist/cjs/nodeviews/inlineCardWithAwareness.js

@@ -31,7 +31,7 @@ var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (
   };
 });
 var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0, _react.memo)(function (_ref) {
-  var _pluginInjectionApi$c, _pluginInjectionApi$a;
+  var _pluginInjectionApi$c;
   var node = _ref.node,
     cardContext = _ref.cardContext,
     actionOptions = _ref.actionOptions,
@@ -58,8 +58,6 @@ var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0,
     isResolvedViewRendered = _useState6[0],
     setIsResolvedViewRendered = _useState6[1];
   var editorAppearance = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c = pluginInjectionApi.card.sharedState.currentState()) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.editorAppearance;
-  var _ref2 = (_pluginInjectionApi$a = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.analytics) !== null && _pluginInjectionApi$a !== void 0 ? _pluginInjectionApi$a : {},
-    editorAnalyticsApi = _ref2.actions;
   var onResolve = (0, _react.useCallback)(function (tr, title) {
     var metadata = tr.getMeta(_pluginKey.pluginKey);
     if (metadata && metadata.type === 'REGISTER') {
@@ -88,11 +86,12 @@ var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0,
   var _useSharedState = useSharedState(pluginInjectionApi),
     mode = _useSharedState.mode;
   var innerCardWithOpenButtonOverlay = (0, _react.useMemo)(function () {
+    var _pluginInjectionApi$a;
     return /*#__PURE__*/_react.default.createElement(_OpenButtonOverlay.default, {
       isVisible: isResolvedViewRendered,
       url: node.attrs.url,
       editorAppearance: editorAppearance,
-      editorAnalyticsApi: editorAnalyticsApi,
+      editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
       view: view
     }, /*#__PURE__*/_react.default.createElement(_inlineCard.InlineCard, {
       node: node,
@@ -104,9 +103,10 @@ var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0,
       onClick: onClick,
       cardContext: cardContext,
       isHovered: isHovered,
-      isPageSSRed: isPageSSRed
+      isPageSSRed: isPageSSRed,
+      pluginInjectionApi: pluginInjectionApi
     }));
-  }, [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed, editorAnalyticsApi]);
+  }, [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed, pluginInjectionApi]);
   var innerCardOriginal = (0, _react.useMemo)(function () {
     return /*#__PURE__*/_react.default.createElement(_inlineCard.InlineCard, {
       node: node,
@@ -118,9 +118,10 @@ var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0,
       onClick: onClick,
       cardContext: cardContext,
       isHovered: isHovered,
-      isPageSSRed: isPageSSRed
+      isPageSSRed: isPageSSRed,
+      pluginInjectionApi: pluginInjectionApi
     });
-  }, [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed]);
+  }, [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed, pluginInjectionApi]);
   var shouldShowOpenButtonOverlay = (0, _react.useMemo)(function () {
     var shouldShowOpenButtonOverlayInChomeless = editorAppearance === 'chromeless' && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_8');
     return (mode === 'edit' || editorAppearance === 'comment' && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6') || shouldShowOpenButtonOverlayInChomeless) && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');

package/dist/cjs/ui/toolbar.js

@@ -84,7 +84,7 @@ var visitCardLink = exports.visitCardLink = function visitCardLink(editorAnalyti
     // EDM-12466:
     // During smart_link_editor_update_toolbar_open_link clean up
     // Consider updating the code to use visitCardLink or visitCardLinkAnalyticsOnly for all input methods:
-    // INPUT_METHOD.FLOATING_TB | INPUT_METHOD.TOOLBAR | NPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK
+    // INPUT_METHOD.FLOATING_TB | INPUT_METHOD.TOOLBAR | INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK || INPUT_METHOD.META_CLICK
     if (!(0, _platformFeatureFlags.fg)('smart_link_editor_update_toolbar_open_link')) {
       var _titleUrlPairFromNode = (0, _utils3.titleUrlPairFromNode)(state.selection.node),
         url = _titleUrlPairFromNode.url;

package/dist/es2019/nodeviews/inlineCard.js

@@ -2,17 +2,20 @@ import _extends from "@babel/runtime/helpers/extends";
 import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import rafSchedule from 'raf-schd';
 import uuid from 'uuid/v4';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { sharedPluginStateHookMigratorFactory, useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { handleNavigation } from '@atlaskit/editor-common/link';
-import { findOverflowScrollParent, UnsupportedInline } from '@atlaskit/editor-common/ui';
+import { UnsupportedInline, findOverflowScrollParent } from '@atlaskit/editor-common/ui';
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { Card as SmartCard } from '@atlaskit/smart-card';
 import { CardSSR } from '@atlaskit/smart-card/ssr';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { registerCard, removeCard } from '../pm-plugins/actions';
 import { getAwarenessProps } from '../pm-plugins/utils';
 import OverlayWrapper from '../ui/ConfigureOverlay';
+import { visitCardLinkAnalyticsOnly } from '../ui/toolbar';
 import { Card } from './genericCard';
 import { InlineCardWithAwareness } from './inlineCardWithAwareness';
 export const InlineCard = /*#__PURE__*/memo(({
@@ -27,7 +30,8 @@ export const InlineCard = /*#__PURE__*/memo(({
   isHovered,
   showHoverPreview,
   hoverPreviewOptions,
-  isPageSSRed
+  isPageSSRed,
+  pluginInjectionApi
 }) => {
   const {
     url,
@@ -89,13 +93,29 @@ export const InlineCard = /*#__PURE__*/memo(({
       url
     });
   }, [onResolve]);
+  const handleOnClick = useCallback(event => {
+    onClick === null || onClick === void 0 ? void 0 : onClick(event);
+    if (editorExperiment('platform_editor_controls', 'variant1') && editorExperiment('platform_editor_smart_link_cmd_ctrl_click', true, {
+      exposure: true
+    })) {
+      // open link in new tab when performing a cmd/ctrl + click
+      if (event.metaKey || event.ctrlKey) {
+        var _pluginInjectionApi$a;
+        const {
+          actions: editorAnalyticsApi
+        } = (_pluginInjectionApi$a = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.analytics) !== null && _pluginInjectionApi$a !== void 0 ? _pluginInjectionApi$a : {};
+        visitCardLinkAnalyticsOnly(editorAnalyticsApi, INPUT_METHOD.META_CLICK)(view.state, view.dispatch);
+        window.open(url, '_blank');
+      }
+    }
+  }, [onClick, url, view, pluginInjectionApi]);
   const card = useMemo(() => {
     if (isPageSSRed && url && fg('platform_ssr_smartlinks_editor')) {
       return /*#__PURE__*/React.createElement(CardSSR, {
         key: url,
         url: url,
         appearance: "inline",
-        onClick: onClick,
+        onClick: handleOnClick,
         container: scrollContainer,
         onResolve: onResolve,
         onError: onError,
@@ -110,7 +130,7 @@ export const InlineCard = /*#__PURE__*/memo(({
       key: url,
       url: url !== null && url !== void 0 ? url : data.url,
       appearance: "inline",
-      onClick: onClick,
+      onClick: handleOnClick,
       container: scrollContainer,
       onResolve: onResolve,
       onError: onError,
@@ -120,7 +140,7 @@ export const InlineCard = /*#__PURE__*/memo(({
       showHoverPreview: showHoverPreview,
       hoverPreviewOptions: hoverPreviewOptions
     });
-  }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed]);
+  }, [url, data, handleOnClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed]);
 
   // [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
@@ -201,9 +221,9 @@ export function InlineCardNodeView(props) {
       view: view,
       isHoveredCallback: setIsOverlayHovered,
       onOpenLinkClick: event => {
-        var _pluginInjectionApi$a;
+        var _pluginInjectionApi$a2;
         handleNavigation({
-          fireAnalyticsEvent: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.fireAnalyticsEvent,
+          fireAnalyticsEvent: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a2 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a2 === void 0 ? void 0 : _pluginInjectionApi$a2.actions.fireAnalyticsEvent,
           onClickCallback,
           url,
           event

package/dist/es2019/nodeviews/inlineCardWithAwareness.js

@@ -36,14 +36,11 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
   isPageSSRed,
   appearance
 }) => {
-  var _pluginInjectionApi$c, _pluginInjectionApi$a;
+  var _pluginInjectionApi$c;
   const [isHovered, setIsHovered] = useState(false);
   const [isInserted, setIsInserted] = useState(false);
   const [isResolvedViewRendered, setIsResolvedViewRendered] = useState(false);
   const editorAppearance = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$c = pluginInjectionApi.card.sharedState.currentState()) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.editorAppearance;
-  const {
-    actions: editorAnalyticsApi
-  } = (_pluginInjectionApi$a = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.analytics) !== null && _pluginInjectionApi$a !== void 0 ? _pluginInjectionApi$a : {};
   const onResolve = useCallback((tr, title) => {
     const metadata = tr.getMeta(pluginKey);
     if (metadata && metadata.type === 'REGISTER') {
@@ -68,24 +65,28 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
   const {
     mode
   } = useSharedState(pluginInjectionApi);
-  const innerCardWithOpenButtonOverlay = useMemo(() => /*#__PURE__*/React.createElement(OpenButtonOverlay, {
-    isVisible: isResolvedViewRendered,
-    url: node.attrs.url,
-    editorAppearance: editorAppearance,
-    editorAnalyticsApi: editorAnalyticsApi,
-    view: view
-  }, /*#__PURE__*/React.createElement(InlineCard, {
-    node: node,
-    view: view,
-    getPos: getPos,
-    useAlternativePreloader: useAlternativePreloader,
-    actionOptions: actionOptions,
-    onResolve: onResolve,
-    onClick: onClick,
-    cardContext: cardContext,
-    isHovered: isHovered,
-    isPageSSRed: isPageSSRed
-  })), [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed, editorAnalyticsApi]);
+  const innerCardWithOpenButtonOverlay = useMemo(() => {
+    var _pluginInjectionApi$a;
+    return /*#__PURE__*/React.createElement(OpenButtonOverlay, {
+      isVisible: isResolvedViewRendered,
+      url: node.attrs.url,
+      editorAppearance: editorAppearance,
+      editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
+      view: view
+    }, /*#__PURE__*/React.createElement(InlineCard, {
+      node: node,
+      view: view,
+      getPos: getPos,
+      useAlternativePreloader: useAlternativePreloader,
+      actionOptions: actionOptions,
+      onResolve: onResolve,
+      onClick: onClick,
+      cardContext: cardContext,
+      isHovered: isHovered,
+      isPageSSRed: isPageSSRed,
+      pluginInjectionApi: pluginInjectionApi
+    }));
+  }, [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed, pluginInjectionApi]);
   const innerCardOriginal = useMemo(() => /*#__PURE__*/React.createElement(InlineCard, {
     node: node,
     view: view,
@@ -96,8 +97,9 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
     onClick: onClick,
     cardContext: cardContext,
     isHovered: isHovered,
-    isPageSSRed: isPageSSRed
-  }), [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed]);
+    isPageSSRed: isPageSSRed,
+    pluginInjectionApi: pluginInjectionApi
+  }), [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed, pluginInjectionApi]);
   const shouldShowOpenButtonOverlay = useMemo(() => {
     const shouldShowOpenButtonOverlayInChomeless = editorAppearance === 'chromeless' && fg('platform_editor_controls_patch_8');
     return (mode === 'edit' || editorAppearance === 'comment' && fg('platform_editor_controls_patch_6') || shouldShowOpenButtonOverlayInChomeless) && editorExperiment('platform_editor_controls', 'variant1');

package/dist/es2019/ui/toolbar.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { isSafeUrl } from '@atlaskit/adf-schema';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID as ACTION_SUBJECTID, buildOpenedSettingsPayload, buildVisitedNonHyperLinkPayload, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID as ACTION_SUBJECTID, EVENT_TYPE, INPUT_METHOD, buildOpenedSettingsPayload, buildVisitedNonHyperLinkPayload } from '@atlaskit/editor-common/analytics';
 import { buildLayoutButtons, buildLayoutDropdown, commandWithMetadata } from '@atlaskit/editor-common/card';
 import { getLinkPreferencesURLFromENV } from '@atlaskit/editor-common/link';
 import commonMessages, { annotationMessages, linkMessages, linkToolbarMessages, cardMessages as messages } from '@atlaskit/editor-common/messages';
@@ -72,7 +72,7 @@ export const visitCardLink = (editorAnalyticsApi, inputMethod) => (state, dispat
   // EDM-12466:
   // During smart_link_editor_update_toolbar_open_link clean up
   // Consider updating the code to use visitCardLink or visitCardLinkAnalyticsOnly for all input methods:
-  // INPUT_METHOD.FLOATING_TB | INPUT_METHOD.TOOLBAR | NPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK
+  // INPUT_METHOD.FLOATING_TB | INPUT_METHOD.TOOLBAR | INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK || INPUT_METHOD.META_CLICK
   if (!fg('smart_link_editor_update_toolbar_open_link')) {
     const {
       url

package/dist/esm/nodeviews/inlineCard.js

@@ -3,17 +3,20 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import rafSchedule from 'raf-schd';
 import uuid from 'uuid/v4';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { sharedPluginStateHookMigratorFactory, useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { handleNavigation } from '@atlaskit/editor-common/link';
-import { findOverflowScrollParent, UnsupportedInline } from '@atlaskit/editor-common/ui';
+import { UnsupportedInline, findOverflowScrollParent } from '@atlaskit/editor-common/ui';
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { Card as SmartCard } from '@atlaskit/smart-card';
 import { CardSSR } from '@atlaskit/smart-card/ssr';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { registerCard, removeCard } from '../pm-plugins/actions';
 import { getAwarenessProps } from '../pm-plugins/utils';
 import OverlayWrapper from '../ui/ConfigureOverlay';
+import { visitCardLinkAnalyticsOnly } from '../ui/toolbar';
 import { Card } from './genericCard';
 import { InlineCardWithAwareness } from './inlineCardWithAwareness';
 export var InlineCard = /*#__PURE__*/memo(function (_ref) {
@@ -28,7 +31,8 @@ export var InlineCard = /*#__PURE__*/memo(function (_ref) {
     isHovered = _ref.isHovered,
     showHoverPreview = _ref.showHoverPreview,
     hoverPreviewOptions = _ref.hoverPreviewOptions,
-    isPageSSRed = _ref.isPageSSRed;
+    isPageSSRed = _ref.isPageSSRed,
+    pluginInjectionApi = _ref.pluginInjectionApi;
   var _node$attrs = node.attrs,
     url = _node$attrs.url,
     data = _node$attrs.data;
@@ -84,13 +88,28 @@ export var InlineCard = /*#__PURE__*/memo(function (_ref) {
       url: url
     });
   }, [onResolve]);
+  var handleOnClick = useCallback(function (event) {
+    onClick === null || onClick === void 0 || onClick(event);
+    if (editorExperiment('platform_editor_controls', 'variant1') && editorExperiment('platform_editor_smart_link_cmd_ctrl_click', true, {
+      exposure: true
+    })) {
+      // open link in new tab when performing a cmd/ctrl + click
+      if (event.metaKey || event.ctrlKey) {
+        var _pluginInjectionApi$a;
+        var _ref2 = (_pluginInjectionApi$a = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.analytics) !== null && _pluginInjectionApi$a !== void 0 ? _pluginInjectionApi$a : {},
+          editorAnalyticsApi = _ref2.actions;
+        visitCardLinkAnalyticsOnly(editorAnalyticsApi, INPUT_METHOD.META_CLICK)(view.state, view.dispatch);
+        window.open(url, '_blank');
+      }
+    }
+  }, [onClick, url, view, pluginInjectionApi]);
   var card = useMemo(function () {
     if (isPageSSRed && url && fg('platform_ssr_smartlinks_editor')) {
       return /*#__PURE__*/React.createElement(CardSSR, {
         key: url,
         url: url,
         appearance: "inline",
-        onClick: onClick,
+        onClick: handleOnClick,
         container: scrollContainer,
         onResolve: onResolve,
         onError: onError,
@@ -105,7 +124,7 @@ export var InlineCard = /*#__PURE__*/memo(function (_ref) {
       key: url,
       url: url !== null && url !== void 0 ? url : data.url,
       appearance: "inline",
-      onClick: onClick,
+      onClick: handleOnClick,
       container: scrollContainer,
       onResolve: onResolve,
       onError: onError,
@@ -115,7 +134,7 @@ export var InlineCard = /*#__PURE__*/memo(function (_ref) {
       showHoverPreview: showHoverPreview,
       hoverPreviewOptions: hoverPreviewOptions
     });
-  }, [url, data, onClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed]);
+  }, [url, data, handleOnClick, scrollContainer, onResolve, onError, useAlternativePreloader, actionOptions, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed]);
 
   // [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
@@ -195,9 +214,9 @@ export function InlineCardNodeView(props) {
       view: view,
       isHoveredCallback: setIsOverlayHovered,
       onOpenLinkClick: function onOpenLinkClick(event) {
-        var _pluginInjectionApi$a;
+        var _pluginInjectionApi$a2;
         handleNavigation({
-          fireAnalyticsEvent: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.fireAnalyticsEvent,
+          fireAnalyticsEvent: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a2 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a2 === void 0 ? void 0 : _pluginInjectionApi$a2.actions.fireAnalyticsEvent,
           onClickCallback: onClickCallback,
           url: url,
           event: event
@@ -219,8 +238,8 @@ export function InlineCardNodeView(props) {
     // eslint-disable-next-line react/jsx-props-no-spreading
   }, enableInlineUpgradeFeatures && getAwarenessProps(view.state, getPos, allowEmbeds, allowBlockCards, mode === 'view'))), fg('prompt_whiteboard_competitor_link_gate') && CompetitorPromptComponent);
 }
-export var inlineCardNodeView = function inlineCardNodeView(_ref2) {
-  var inlineCardViewProducer = _ref2.inlineCardViewProducer;
+export var inlineCardNodeView = function inlineCardNodeView(_ref3) {
+  var inlineCardViewProducer = _ref3.inlineCardViewProducer;
   return function (node, view, getPos, decorations) {
     return inlineCardViewProducer(node, view, getPos, decorations);
   };

package/dist/esm/nodeviews/inlineCardWithAwareness.js

@@ -22,7 +22,7 @@ var useSharedState = sharedPluginStateHookMigratorFactory(function (pluginInject
   };
 });
 export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
-  var _pluginInjectionApi$c, _pluginInjectionApi$a;
+  var _pluginInjectionApi$c;
   var node = _ref.node,
     cardContext = _ref.cardContext,
     actionOptions = _ref.actionOptions,
@@ -49,8 +49,6 @@ export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
     isResolvedViewRendered = _useState6[0],
     setIsResolvedViewRendered = _useState6[1];
   var editorAppearance = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c = pluginInjectionApi.card.sharedState.currentState()) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.editorAppearance;
-  var _ref2 = (_pluginInjectionApi$a = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.analytics) !== null && _pluginInjectionApi$a !== void 0 ? _pluginInjectionApi$a : {},
-    editorAnalyticsApi = _ref2.actions;
   var onResolve = useCallback(function (tr, title) {
     var metadata = tr.getMeta(pluginKey);
     if (metadata && metadata.type === 'REGISTER') {
@@ -79,11 +77,12 @@ export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
   var _useSharedState = useSharedState(pluginInjectionApi),
     mode = _useSharedState.mode;
   var innerCardWithOpenButtonOverlay = useMemo(function () {
+    var _pluginInjectionApi$a;
     return /*#__PURE__*/React.createElement(OpenButtonOverlay, {
       isVisible: isResolvedViewRendered,
       url: node.attrs.url,
       editorAppearance: editorAppearance,
-      editorAnalyticsApi: editorAnalyticsApi,
+      editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
       view: view
     }, /*#__PURE__*/React.createElement(InlineCard, {
       node: node,
@@ -95,9 +94,10 @@ export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
       onClick: onClick,
       cardContext: cardContext,
       isHovered: isHovered,
-      isPageSSRed: isPageSSRed
+      isPageSSRed: isPageSSRed,
+      pluginInjectionApi: pluginInjectionApi
     }));
-  }, [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed, editorAnalyticsApi]);
+  }, [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed, pluginInjectionApi]);
   var innerCardOriginal = useMemo(function () {
     return /*#__PURE__*/React.createElement(InlineCard, {
       node: node,
@@ -109,9 +109,10 @@ export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
       onClick: onClick,
       cardContext: cardContext,
       isHovered: isHovered,
-      isPageSSRed: isPageSSRed
+      isPageSSRed: isPageSSRed,
+      pluginInjectionApi: pluginInjectionApi
     });
-  }, [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed]);
+  }, [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed, pluginInjectionApi]);
   var shouldShowOpenButtonOverlay = useMemo(function () {
     var shouldShowOpenButtonOverlayInChomeless = editorAppearance === 'chromeless' && fg('platform_editor_controls_patch_8');
     return (mode === 'edit' || editorAppearance === 'comment' && fg('platform_editor_controls_patch_6') || shouldShowOpenButtonOverlayInChomeless) && editorExperiment('platform_editor_controls', 'variant1');

package/dist/esm/ui/toolbar.js

@@ -4,7 +4,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React from 'react';
 import { isSafeUrl } from '@atlaskit/adf-schema';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID as ACTION_SUBJECTID, buildOpenedSettingsPayload, buildVisitedNonHyperLinkPayload, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID as ACTION_SUBJECTID, EVENT_TYPE, INPUT_METHOD, buildOpenedSettingsPayload, buildVisitedNonHyperLinkPayload } from '@atlaskit/editor-common/analytics';
 import { buildLayoutButtons, buildLayoutDropdown, commandWithMetadata } from '@atlaskit/editor-common/card';
 import { getLinkPreferencesURLFromENV } from '@atlaskit/editor-common/link';
 import commonMessages, { annotationMessages, linkMessages, linkToolbarMessages, cardMessages as messages } from '@atlaskit/editor-common/messages';
@@ -75,7 +75,7 @@ export var visitCardLink = function visitCardLink(editorAnalyticsApi, inputMetho
     // EDM-12466:
     // During smart_link_editor_update_toolbar_open_link clean up
     // Consider updating the code to use visitCardLink or visitCardLinkAnalyticsOnly for all input methods:
-    // INPUT_METHOD.FLOATING_TB | INPUT_METHOD.TOOLBAR | NPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK
+    // INPUT_METHOD.FLOATING_TB | INPUT_METHOD.TOOLBAR | INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK || INPUT_METHOD.META_CLICK
     if (!fg('smart_link_editor_update_toolbar_open_link')) {
       var _titleUrlPairFromNode = titleUrlPairFromNode(state.selection.node),
         url = _titleUrlPairFromNode.url;

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

@@ -1,10 +1,10 @@
-import React from 'react';
 import type { EventHandler, KeyboardEvent, MouseEvent } from 'react';
+import React 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 { ReactComponentProps, getPosHandler } 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 Transaction } from '@atlaskit/editor-prosemirror/state';

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

@@ -4,7 +4,7 @@ import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { Decoration, EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { SmartCardProps } from './genericCard';
 import { type InlineCardWithAwarenessProps } from './inlineCardWithAwareness';
-export declare const InlineCard: React.MemoExoticComponent<({ node, cardContext, actionOptions, useAlternativePreloader, view, getPos, onClick, onResolve: onRes, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, }: SmartCardProps) => React.JSX.Element | null>;
+export declare const InlineCard: React.MemoExoticComponent<({ node, cardContext, actionOptions, useAlternativePreloader, view, getPos, onClick, onResolve: onRes, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, pluginInjectionApi, }: SmartCardProps) => React.JSX.Element | null>;
 export type InlineCardNodeViewProps = Pick<SmartCardProps, 'useAlternativePreloader' | 'actionOptions' | 'allowEmbeds' | 'allowBlockCards' | 'enableInlineUpgradeFeatures' | 'pluginInjectionApi' | 'onClickCallback' | '__livePage' | 'isPageSSRed' | 'CompetitorPrompt'>;
 /**
  *

package/dist/types/ui/toolbar.d.ts

@@ -8,7 +8,7 @@ import type { cardPlugin } from '../index';
 import type { CardPluginOptions } from '../types';
 export declare const removeCard: (editorAnalyticsApi: EditorAnalyticsAPI | undefined) => Command;
 export declare const visitCardLink: (editorAnalyticsApi: EditorAnalyticsAPI | undefined, inputMethod: INPUT_METHOD.FLOATING_TB | INPUT_METHOD.TOOLBAR) => Command;
-export declare const visitCardLinkAnalyticsOnly: (editorAnalyticsApi: EditorAnalyticsAPI | undefined, inputMethod: INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK) => Command;
+export declare const visitCardLinkAnalyticsOnly: (editorAnalyticsApi: EditorAnalyticsAPI | undefined, inputMethod: INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK | INPUT_METHOD.META_CLICK) => Command;
 export declare const openLinkSettings: (editorAnalyticsApi: EditorAnalyticsAPI | undefined) => Command;
 export declare const floatingToolbar: (cardOptions: CardOptions, lpLinkPicker: boolean, linkPickerOptions?: LinkPickerOptions, pluginInjectionApi?: ExtractInjectionAPI<typeof cardPlugin>, disableFloatingToolbar?: boolean) => FloatingToolbarHandler;
 export declare const getSettingsButton: (intl: IntlShape, editorAnalyticsApi: EditorAnalyticsAPI | undefined, userPreferencesLink?: string) => FloatingToolbarItem<Command>;

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

@@ -1,10 +1,10 @@
-import React from 'react';
 import type { EventHandler, KeyboardEvent, MouseEvent } from 'react';
+import React 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 { ReactComponentProps, getPosHandler } 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 Transaction } from '@atlaskit/editor-prosemirror/state';

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

@@ -4,7 +4,7 @@ import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { Decoration, EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { SmartCardProps } from './genericCard';
 import { type InlineCardWithAwarenessProps } from './inlineCardWithAwareness';
-export declare const InlineCard: React.MemoExoticComponent<({ node, cardContext, actionOptions, useAlternativePreloader, view, getPos, onClick, onResolve: onRes, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, }: SmartCardProps) => React.JSX.Element | null>;
+export declare const InlineCard: React.MemoExoticComponent<({ node, cardContext, actionOptions, useAlternativePreloader, view, getPos, onClick, onResolve: onRes, isHovered, showHoverPreview, hoverPreviewOptions, isPageSSRed, pluginInjectionApi, }: SmartCardProps) => React.JSX.Element | null>;
 export type InlineCardNodeViewProps = Pick<SmartCardProps, 'useAlternativePreloader' | 'actionOptions' | 'allowEmbeds' | 'allowBlockCards' | 'enableInlineUpgradeFeatures' | 'pluginInjectionApi' | 'onClickCallback' | '__livePage' | 'isPageSSRed' | 'CompetitorPrompt'>;
 /**
  *

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

@@ -8,7 +8,7 @@ import type { cardPlugin } from '../index';
 import type { CardPluginOptions } from '../types';
 export declare const removeCard: (editorAnalyticsApi: EditorAnalyticsAPI | undefined) => Command;
 export declare const visitCardLink: (editorAnalyticsApi: EditorAnalyticsAPI | undefined, inputMethod: INPUT_METHOD.FLOATING_TB | INPUT_METHOD.TOOLBAR) => Command;
-export declare const visitCardLinkAnalyticsOnly: (editorAnalyticsApi: EditorAnalyticsAPI | undefined, inputMethod: INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK) => Command;
+export declare const visitCardLinkAnalyticsOnly: (editorAnalyticsApi: EditorAnalyticsAPI | undefined, inputMethod: INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK | INPUT_METHOD.META_CLICK) => Command;
 export declare const openLinkSettings: (editorAnalyticsApi: EditorAnalyticsAPI | undefined) => Command;
 export declare const floatingToolbar: (cardOptions: CardOptions, lpLinkPicker: boolean, linkPickerOptions?: LinkPickerOptions, pluginInjectionApi?: ExtractInjectionAPI<typeof cardPlugin>, disableFloatingToolbar?: boolean) => FloatingToolbarHandler;
 export declare const getSettingsButton: (intl: IntlShape, editorAnalyticsApi: EditorAnalyticsAPI | undefined, userPreferencesLink?: string) => FloatingToolbarItem<Command>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-card",
-	"version": "6.4.4",
+	"version": "6.4.5",
 	"description": "Card plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -61,9 +61,9 @@
 		"@atlaskit/menu": "^8.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^14.8.0",
-		"@atlaskit/smart-card": "^38.5.0",
+		"@atlaskit/smart-card": "^38.6.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tmp-editor-statsig": "^5.8.0",
+		"@atlaskit/tmp-editor-statsig": "^5.10.0",
 		"@atlaskit/tokens": "^5.0.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
@@ -73,7 +73,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/link-provider": "^3.2.0",
+		"@atlaskit/link-provider": "^3.3.0",
 		"react": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
 	},