@atlaskit/editor-core 182.0.2 → 182.1.0

package/dist/esm/plugins/card/pm-plugins/doc.js

@@ -5,13 +5,14 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import { NodeSelection, TextSelection } from 'prosemirror-state';
 import { closeHistory } from 'prosemirror-history';
 import { isSafeUrl } from '@atlaskit/adf-schema';
+import { addLinkMetadata } from '@atlaskit/editor-common/card';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, addAnalytics, EVENT_TYPE, INPUT_METHOD } from '../../../plugins/analytics';
 import { SMART_LINK_TYPE } from '../../../plugins/analytics/types/node-events';
 import { getLinkCreationAnalyticsEvent } from '../../../plugins/hyperlink/analytics';
 import { nodesBetweenChanged, processRawValue } from '../../../utils';
 import { unlinkPayload } from '../../../utils/linking-utils';
 import { isFromCurrentDomain } from '../../hyperlink/utils';
-import { appearanceForNodeType } from '../utils';
+import { appearanceForNodeType, selectedCardAppearance } from '../utils';
 import { queueCards, resolveCard } from './actions';
 import { pluginKey } from './plugin-key';
 import { shouldReplaceLink } from './shouldReplaceLink';
@@ -46,7 +47,7 @@ function replaceLinksToCards(tr, cardAdf, schema, request) {
   tr.replaceWith(pos, pos + (node.text || url).length, nodes);
   return $pos.node($pos.depth - 1).type.name;
 }
-export var replaceQueuedUrlWithCard = function replaceQueuedUrlWithCard(url, cardData, analyticsAction, createAnalyticsEvent) {
+export var replaceQueuedUrlWithCard = function replaceQueuedUrlWithCard(url, cardData, analyticsAction) {
   return function (editorState, dispatch) {
     var state = pluginKey.getState(editorState);
     if (!state) {
@@ -84,15 +85,22 @@ export var replaceQueuedUrlWithCard = function replaceQueuedUrlWithCard(url, car
         if (state.smartLinkEvents) {
           state.smartLinkEvents.insertSmartLink(domainName, 'inline', state.createAnalyticsEvent);
         }
+
+        /**
+         * TODO:
+         * What if each request has a different source?
+         * Unlikely, but need to define behaviour.
+         * Ignore analytics event? take first? provide 'mixed' as well?
+         */
+        var inputMethod = requests[0].source;
+        var sourceEvent = requests[0].sourceEvent;
         addAnalytics(editorState, tr, {
           action: analyticsAction || ACTION.INSERTED,
           actionSubject: ACTION_SUBJECT.DOCUMENT,
           actionSubjectId: ACTION_SUBJECT_ID.SMART_LINK,
           eventType: EVENT_TYPE.TRACK,
           attributes: {
-            inputMethod: requests[0].source /* TODO: what if each request has a different source?
-                                             unlikely, but need to define behaviour.
-                                              ignore analytics event? take first? provide 'mixed' as well?*/,
+            inputMethod: inputMethod,
             nodeType: nodeType,
             nodeContext: nodeContext,
             fromCurrentDomain: isFromCurrentDomain(url)
@@ -101,6 +109,12 @@ export var replaceQueuedUrlWithCard = function replaceQueuedUrlWithCard(url, car
             domainName: domainName
           }
         });
+        addLinkMetadata(editorState.selection, tr, {
+          action: analyticsAction,
+          inputMethod: inputMethod,
+          cardAction: 'RESOLVE',
+          sourceEvent: sourceEvent
+        });
       }
     }
     if (dispatch) {
@@ -109,22 +123,29 @@ export var replaceQueuedUrlWithCard = function replaceQueuedUrlWithCard(url, car
     return true;
   };
 };
-export var handleFallbackWithAnalytics = function handleFallbackWithAnalytics(url, source) {
-  return function (editorState, dispatch) {
-    var state = pluginKey.getState(editorState);
-    if (!state) {
+export var handleFallbackWithAnalytics = function handleFallbackWithAnalytics(request) {
+  return function (state, dispatch) {
+    var cardState = pluginKey.getState(state);
+    if (!cardState) {
       return false;
     }
-    var tr = editorState.tr;
-    addAnalytics(editorState, tr, getLinkCreationAnalyticsEvent(source, url));
+    var tr = state.tr;
+    if (request.source !== INPUT_METHOD.FLOATING_TB) {
+      addAnalytics(state, tr, getLinkCreationAnalyticsEvent(request.source, request.url));
+    }
+    addLinkMetadata(state.selection, tr, {
+      action: request.analyticsAction,
+      inputMethod: request.source
+    });
     if (dispatch) {
-      dispatch(resolveCard(url)(tr));
+      dispatch(resolveCard(request.url)(tr));
     }
     return true;
   };
 };
-export var queueCardsFromChangedTr = function queueCardsFromChangedTr(state, tr, source) {
-  var normalizeLinkText = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
+export var queueCardsFromChangedTr = function queueCardsFromChangedTr(state, tr, source, analyticsAction) {
+  var normalizeLinkText = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : true;
+  var sourceEvent = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : undefined;
   var schema = state.schema;
   var link = schema.marks.link;
   var requests = [];
@@ -144,11 +165,52 @@ export var queueCardsFromChangedTr = function queueCardsFromChangedTr(state, tr,
         pos: pos,
         appearance: 'inline',
         compareLinkText: normalizeLinkText,
-        source: source
+        source: source,
+        analyticsAction: analyticsAction,
+        sourceEvent: sourceEvent
       });
     }
     return false;
   });
+  addLinkMetadata(state.selection, tr, {
+    action: analyticsAction
+  });
+  return queueCards(requests)(tr);
+};
+export var queueCardFromChangedTr = function queueCardFromChangedTr(state, tr, source, analyticsAction) {
+  var normalizeLinkText = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : true;
+  var sourceEvent = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : undefined;
+  var previousAppearance = arguments.length > 6 ? arguments[6] : undefined;
+  var schema = state.schema;
+  var link = schema.marks.link;
+  var requests = [];
+  nodesBetweenChanged(tr, function (node, pos) {
+    if (!node.isText) {
+      return true;
+    }
+    var linkMark = node.marks.find(function (mark) {
+      return mark.type === link;
+    });
+    if (linkMark) {
+      if (!shouldReplaceLink(node, normalizeLinkText)) {
+        return false;
+      }
+      requests.push({
+        url: linkMark.attrs.href,
+        pos: pos,
+        appearance: 'inline',
+        previousAppearance: previousAppearance,
+        compareLinkText: normalizeLinkText,
+        source: source,
+        analyticsAction: analyticsAction,
+        sourceEvent: sourceEvent
+      });
+    }
+    return false;
+  });
+  addLinkMetadata(state.selection, tr, {
+    action: analyticsAction
+  });
   return queueCards(requests)(tr);
 };
 export var convertHyperlinkToSmartCard = function convertHyperlinkToSmartCard(state, source, appearance) {
@@ -161,18 +223,21 @@ export var convertHyperlinkToSmartCard = function convertHyperlinkToSmartCard(st
       return mark.type === link;
     });
     if (linkMark) {
-      var request = {
+      requests.push({
         url: linkMark.attrs.href,
         pos: pos,
         appearance: appearance,
+        previousAppearance: 'url',
         compareLinkText: normalizeLinkText,
         source: source,
         analyticsAction: ACTION.CHANGED_TYPE,
         shouldReplaceLink: true
-      };
-      requests.push(request);
+      });
     }
   });
+  addLinkMetadata(state.selection, state.tr, {
+    action: ACTION.CHANGED_TYPE
+  });
   return queueCards(requests)(state.tr);
 };
 export var changeSelectedCardToLink = function changeSelectedCardToLink(text, href, sendAnalytics, node, pos) {
@@ -227,14 +292,15 @@ export var changeSelectedCardToLinkFallback = function changeSelectedCardToLinkF
     return true;
   };
 };
-export var updateCard = function updateCard(href) {
+export var updateCard = function updateCard(href, sourceEvent) {
   return function (state, dispatch) {
     var selectedNode = state.selection instanceof NodeSelection && state.selection.node;
     if (!selectedNode) {
       return false;
     }
+    var cardAppearance = selectedCardAppearance(state);
     var tr = cardToLinkWithTransaction(state, href, href);
-    queueCardsFromChangedTr(state, tr, INPUT_METHOD.MANUAL);
+    queueCardFromChangedTr(state, tr, INPUT_METHOD.MANUAL, ACTION.UPDATED, undefined, sourceEvent, cardAppearance);
     if (dispatch) {
       dispatch(tr.scrollIntoView());
     }
@@ -268,7 +334,11 @@ export var changeSelectedCardToText = function changeSelectedCardToText(text) {
     }
     var tr = state.tr.replaceSelectionWith(state.schema.text(text), false);
     if (dispatch) {
-      dispatch(addAnalytics(state, tr.scrollIntoView(), unlinkPayload(ACTION_SUBJECT_ID.CARD_INLINE)));
+      addLinkMetadata(state.selection, tr, {
+        action: ACTION.UNLINK
+      });
+      addAnalytics(state, tr.scrollIntoView(), unlinkPayload(ACTION_SUBJECT_ID.CARD_INLINE));
+      dispatch(tr);
     }
     return true;
   };
@@ -280,8 +350,11 @@ export var setSelectedCardAppearance = function setSelectedCardAppearance(appear
     if (!selectedNode) {
       // When there is no selected node, we insert a new one
       // and replace the existing blue link
-      var _tr = convertHyperlinkToSmartCard(state, INPUT_METHOD.MANUAL, appearance);
+      var _tr = convertHyperlinkToSmartCard(state, INPUT_METHOD.FLOATING_TB, appearance);
       if (dispatch) {
+        addLinkMetadata(state.selection, _tr, {
+          action: ACTION.CHANGED_TYPE
+        });
         dispatch(_tr.scrollIntoView());
       }
       return false;
@@ -318,6 +391,9 @@ export var setSelectedCardAppearance = function setSelectedCardAppearance(appear
         previousType: appearanceForNodeType(selectedNode.type)
       }
     });
+    addLinkMetadata(state.selection, tr, {
+      action: ACTION.CHANGED_TYPE
+    });
     if (dispatch) {
       dispatch(tr.scrollIntoView());
     }

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

@@ -1,3 +1,4 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import rafSchedule from 'raf-schd';
 import { getInlineNodeViewProducer } from '../../../nodeviews/getInlineNodeViewProducer';
@@ -8,9 +9,12 @@ import { pluginKey } from './plugin-key';
 import reducer from './reducers';
 import { handleProvider, resolveWithProvider } from './util/resolve';
 import { getNewRequests, getPluginState, getPluginStateWithUpdatedPos } from './util/state';
+import { createAnalyticsQueue, eventsFromTransaction } from './analytics';
 export { pluginKey } from './plugin-key';
 export var createPlugin = function createPlugin(options) {
   return function (pmPluginFactoryParams) {
+    var lpAnalyticsEventsNext = pmPluginFactoryParams.featureFlags.lpAnalyticsEventsNext;
+    var analyticsQueue = createAnalyticsQueue(!!lpAnalyticsEventsNext);
     var editorAppearance = options.editorAppearance,
       platform = options.platform,
       allowResizing = options.allowResizing,
@@ -27,25 +31,31 @@ export var createPlugin = function createPlugin(options) {
             cards: [],
             showLinkingToolbar: false,
             smartLinkEvents: undefined,
+            smartLinkEventsNext: undefined,
             createAnalyticsEvent: createAnalyticsEvent,
             editorAppearance: editorAppearance
           };
         },
-        apply: function apply(tr, pluginState) {
+        apply: function apply(tr, pluginState, prevEditorState) {
           // Update all the positions of outstanding requests and
           // cards in the plugin state.
           var pluginStateWithUpdatedPos = getPluginStateWithUpdatedPos(pluginState, tr);
+
           // apply any actions
           var meta = tr.getMeta(pluginKey);
+          var events = eventsFromTransaction(tr, prevEditorState);
+          analyticsQueue.push.apply(analyticsQueue, _toConsumableArray(events));
           if (meta) {
-            var nextPluginState = reducer(pluginStateWithUpdatedPos, meta);
-            return nextPluginState;
+            var nextState = reducer(pluginStateWithUpdatedPos, meta);
+            if (!pluginState.smartLinkEventsNext && nextState.smartLinkEventsNext) {
+              analyticsQueue.setCallbacks(nextState.smartLinkEventsNext);
+            }
+            return nextState;
           }
           return pluginStateWithUpdatedPos;
         }
       },
       view: function view(_view) {
-        var outstandingRequests = {};
         var subscriptionHandler = function subscriptionHandler(name, provider) {
           return handleProvider(name, provider, _view);
         };
@@ -71,19 +81,15 @@ export var createPlugin = function createPlugin(options) {
                  * other tasks as per common implementations of the JavaScript event loop in browsers.
                  */
                 var invoke = rafSchedule(function () {
-                  return resolveWithProvider(view, outstandingRequests, provider, request, options);
+                  return resolveWithProvider(view, provider, request, options);
                 });
                 rafCancellationCallbacks.push(invoke.cancel);
                 invoke();
               });
             }
+            analyticsQueue.flush();
           },
           destroy: function destroy() {
-            // Cancel all outstanding requests
-            Object.keys(outstandingRequests).forEach(function (url) {
-              return Promise.reject(outstandingRequests[url]);
-            });
-
             // Cancel any outstanding raf callbacks.
             rafCancellationCallbacks.forEach(function (cancellationCallback) {
               return cancellationCallback();

package/dist/esm/plugins/card/pm-plugins/reducers.js

@@ -34,6 +34,11 @@ var registerEvents = function registerEvents(state, action) {
     smartLinkEvents: action.smartLinkEvents
   });
 };
+var registerEventsNext = function registerEventsNext(state, action) {
+  return _objectSpread(_objectSpread({}, state), {}, {
+    smartLinkEventsNext: action.smartLinkEvents
+  });
+};
 var setLinkToolbar = function setLinkToolbar(state, action) {
   return _objectSpread(_objectSpread({}, state), {}, {
     showLinkingToolbar: action.type === 'SHOW_LINK_TOOLBAR'
@@ -51,6 +56,8 @@ export default (function (state, action) {
       return register(state, action);
     case 'REGISTER_EVENTS':
       return registerEvents(state, action);
+    case 'REGISTER_EVENTS_NEXT':
+      return registerEventsNext(state, action);
     case 'SHOW_LINK_TOOLBAR':
     case 'HIDE_LINK_TOOLBAR':
       return setLinkToolbar(state, action);

package/dist/esm/plugins/card/pm-plugins/util/resolve.js

@@ -5,18 +5,14 @@ import { replaceQueuedUrlWithCard, handleFallbackWithAnalytics } from '../doc';
 // ============================================================================ //
 // Used for all interactions with the EditorCardProvider.
 // ============================================================================ //
-export var resolveWithProvider = function resolveWithProvider(view, outstandingRequests, provider, request, options) {
+export var resolveWithProvider = function resolveWithProvider(view, provider, request, options) {
   // When user manually changes appearance from blue link to smart link, we should respect that,
   var shouldForceAppearance =
   // This flag is set to true only in one place atm:
   // packages/editor/editor-core/src/plugins/card/pm-plugins/doc.ts @ convertHyperlinkToSmartCard
   // Which is used when user switching from URL to smart link appearance.
   !!request.shouldReplaceLink;
-  var handleResolve = provider.resolve(request.url, request.appearance, shouldForceAppearance).then(function (resolvedCard) {
-    delete outstandingRequests[request.url];
-    return resolvedCard;
-  }).then(handleResolved(view, request, options), handleRejected(view, request));
-  outstandingRequests[request.url] = handleResolve;
+  var handleResolve = provider.resolve(request.url, request.appearance, shouldForceAppearance).then(handleResolved(view, request, options), handleRejected(view, request));
   return handleResolve;
 };
 var updateCardType = function updateCardType(resolvedCard, options) {
@@ -37,7 +33,7 @@ var handleResolved = function handleResolved(view, request, options) {
 };
 var handleRejected = function handleRejected(view, request) {
   return function () {
-    handleFallbackWithAnalytics(request.url, request.source)(view.state, view.dispatch);
+    handleFallbackWithAnalytics(request)(view.state, view.dispatch);
   };
 };
 

package/dist/esm/plugins/card/toolbar.js

@@ -14,6 +14,7 @@ import { linkToolbarMessages, linkMessages } from '../../messages';
 import commonMessages from '../../messages';
 import { hoverDecoration } from '../base/pm-plugins/decoration';
 import { changeSelectedCardToText } from './pm-plugins/doc';
+import { commandWithMetadata } from '@atlaskit/editor-common/card';
 import { pluginKey } from './pm-plugins/main';
 import { richMediaClassName } from '@atlaskit/editor-common/styles';
 import { buildEditLinkToolbar, editLink, editLinkToolbarConfig } from './ui/EditLinkToolbar';
@@ -24,7 +25,7 @@ import { messages } from './messages';
 import buildLayoutButtons from '../../ui/MediaAndEmbedsToolbar';
 import { buildOpenedSettingsPayload, buildVisitedLinkPayload } from '../../utils/linking-utils';
 import { FLOATING_TOOLBAR_LINKPICKER_CLASSNAME } from './styles';
-export var removeCard = function removeCard(state, dispatch) {
+export var removeCard = commandWithMetadata(function (state, dispatch) {
   if (!(state.selection instanceof NodeSelection)) {
     return false;
   }
@@ -43,7 +44,9 @@ export var removeCard = function removeCard(state, dispatch) {
     dispatch(addAnalytics(state, removeSelectedNode(state.tr), payload));
   }
   return true;
-};
+}, {
+  action: ACTION.DELETED
+});
 export var visitCardLink = function visitCardLink(state, dispatch) {
   if (!(state.selection instanceof NodeSelection)) {
     return false;
@@ -130,14 +133,21 @@ var unlinkCard = function unlinkCard(node, state) {
   var displayInfo = displayInfoForCard(node, findCardInfo(state));
   var text = displayInfo.title || displayInfo.url;
   if (text) {
-    return changeSelectedCardToText(text);
+    return commandWithMetadata(changeSelectedCardToText(text), {
+      action: ACTION.UNLINK
+    });
   }
   return function () {
     return false;
   };
 };
-var buildAlignmentOptions = function buildAlignmentOptions(state, intl) {
-  return buildLayoutButtons(state, intl, state.schema.nodes.embedCard, true, true);
+var buildAlignmentOptions = function buildAlignmentOptions(state, intl, cardOptions) {
+  return buildLayoutButtons(state, intl, state.schema.nodes.embedCard, true, true, cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowWrapping, cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowAlignment);
+};
+var withToolbarMetadata = function withToolbarMetadata(command) {
+  return commandWithMetadata(command, {
+    inputMethod: INPUT_METHOD.FLOATING_TB
+  });
 };
 var generateToolbarItems = function generateToolbarItems(state, featureFlags, intl, providerFactory, cardOptions, platform, linkPicker) {
   return function (node) {
@@ -208,10 +218,10 @@ var generateToolbarItems = function generateToolbarItems(state, featureFlags, in
         onFocus: hoverDecoration(node.type, true),
         onBlur: hoverDecoration(node.type, false),
         title: intl.formatMessage(commonMessages.remove),
-        onClick: removeCard
+        onClick: withToolbarMetadata(removeCard)
       }]);
       if (currentAppearance === 'embed') {
-        var alignmentOptions = buildAlignmentOptions(state, intl);
+        var alignmentOptions = buildAlignmentOptions(state, intl, cardOptions);
         if (alignmentOptions.length) {
           alignmentOptions.push({
             type: 'separator'
@@ -256,7 +266,7 @@ var getUnlinkButtonGroup = function getUnlinkButtonGroup(state, intl, node, inli
     type: 'button',
     title: intl.formatMessage(linkToolbarMessages.unlink),
     icon: UnlinkIcon,
-    onClick: unlinkCard(node, state)
+    onClick: withToolbarMetadata(unlinkCard(node, state))
   }, {
     type: 'separator'
   }] : [];

package/dist/esm/plugins/card/ui/EditLinkToolbar.js

@@ -8,16 +8,17 @@ 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() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 import React from 'react';
+import { withOuterListeners } from '@atlaskit/editor-common/ui';
+import { commandWithMetadata } from '@atlaskit/editor-common/card';
 import HyperlinkToolbar from '../../hyperlink/ui/HyperlinkAddToolbar';
 import { showLinkToolbar, hideLinkToolbar as _hideLinkToolbar } from '../pm-plugins/actions';
-import { addAnalytics, INPUT_METHOD } from '../../analytics';
+import { addAnalytics, INPUT_METHOD, ACTION } from '../../analytics';
 import { LINKPICKER_HEIGHT_IN_PX, RECENT_SEARCH_HEIGHT_IN_PX, RECENT_SEARCH_WIDTH_IN_PX } from '../../../ui/LinkSearch/ToolbarComponents';
 import { changeSelectedCardToLink, updateCard } from '../pm-plugins/doc';
 import { findCardInfo, displayInfoForCard } from '../utils';
 import { NodeSelection } from 'prosemirror-state';
 import { buildEditLinkPayload } from '../../../utils/linking-utils';
 import { forceFocusSelector } from '../../floating-toolbar/pm-plugins/force-focus';
-import { withOuterListeners } from '@atlaskit/editor-common/ui';
 import { linkToolbarMessages } from '../../../messages';
 var HyperLinkToolbarWithListeners = withOuterListeners(HyperlinkToolbar);
 export var EditLinkToolbar = /*#__PURE__*/function (_React$Component) {
@@ -81,10 +82,10 @@ export var EditLinkToolbar = /*#__PURE__*/function (_React$Component) {
         ,
         invokeMethod: INPUT_METHOD.FLOATING_TB,
         featureFlags: featureFlags,
-        onSubmit: function onSubmit(href, title, displayText) {
+        onSubmit: function onSubmit(href, title, displayText, _, analytic) {
           _this2.hideLinkToolbar();
           if (_onSubmit) {
-            _onSubmit(href, displayText || title);
+            _onSubmit(href, displayText || title, analytic);
           }
         }
       });
@@ -126,19 +127,22 @@ export var buildEditLinkToolbar = function buildEditLinkToolbar(_ref) {
         text: displayInfo.title || '',
         node: node,
         featureFlags: featureFlags,
-        onSubmit: function onSubmit(newHref, newText) {
+        onSubmit: function onSubmit(newHref, newText, analytic) {
           var urlChanged = newHref !== displayInfo.url;
           var titleChanged = newText !== displayInfo.title;
 
           // If the title is changed in a smartlink, convert to standard blue hyperlink
           // (even if the url was also changed) - we don't want to lose the custom title.
           if (titleChanged) {
-            return changeSelectedCardToLink(newText, newHref)(view.state, view.dispatch);
-          } else if (urlChanged) {
+            return commandWithMetadata(changeSelectedCardToLink(newText, newHref), {
+              action: ACTION.UPDATED,
+              sourceEvent: analytic
+            })(view.state, view.dispatch);
+          }
+          if (urlChanged) {
             // If *only* the url is changed in a smart link, reresolve
-            return updateCard(newHref)(view.state, view.dispatch);
+            return updateCard(newHref, analytic)(view.state, view.dispatch);
           }
-          return;
         }
       });
     }