@atlaskit/editor-core 176.0.2 → 177.0.0

package/dist/cjs/utils/commands.js

@@ -142,12 +142,27 @@ var applyMarkOnRange = function applyMarkOnRange(from, to, removeMark, mark, tr)
 
 exports.applyMarkOnRange = applyMarkOnRange;
 
+var entireSelectionContainsMark = function entireSelectionContainsMark(mark, doc, fromPos, toPos) {
+  var onlyContainsMark = true;
+  doc.nodesBetween(fromPos, toPos, function (node) {
+    // Skip recursion once we've found text which doesn't include the mark
+    if (!onlyContainsMark) {
+      return false;
+    }
+
+    if (node.isText) {
+      onlyContainsMark && (onlyContainsMark = mark.isInSet(node.marks));
+    }
+  });
+  return onlyContainsMark;
+};
+
 var toggleMarkInRange = function toggleMarkInRange(mark) {
   return function (state, dispatch) {
     var tr = state.tr;
 
     if (state.selection instanceof _cellSelection.CellSelection) {
-      var markInRange = false;
+      var removeMark = true;
       var cells = [];
       state.selection.forEachCell(function (cell, cellPos) {
         cells.push({
@@ -156,30 +171,27 @@ var toggleMarkInRange = function toggleMarkInRange(mark) {
         });
         var from = cellPos;
         var to = cellPos + cell.nodeSize;
-
-        if (!markInRange) {
-          markInRange = state.doc.rangeHasMark(from, to, mark);
-        }
+        removeMark && (removeMark = entireSelectionContainsMark(mark, state.doc, from, to));
       });
 
       for (var i = cells.length - 1; i >= 0; i--) {
         var cell = cells[i];
         var from = cell.pos;
         var to = from + cell.node.nodeSize;
-        applyMarkOnRange(from, to, markInRange, mark, tr);
+        applyMarkOnRange(from, to, removeMark, mark, tr);
       }
     } else {
       var _state$selection3 = state.selection,
           $from = _state$selection3.$from,
-          $to = _state$selection3.$to; // The type for `rangeHasMark` only accepts a `MarkType` as a third param,
-      // Yet the internals use a method that exists on both MarkType and Mark (one checks attributes the other doesnt)
-      // For example, with our subsup mark: We use the same mark with different attributes to convert
-      // different formatting but when using `MarkType.isInSet(marks)` it returns true for both.
-      // Calling `Mark.isInSet(marks)` compares attributes as well.
+          $to = _state$selection3.$to; // We decide to remove the mark only if the entire selection contains the mark
+      // Examples with *bold* text
+      // Scenario 1: Selection contains both bold and non-bold text -> bold entire selection
+      // Scenario 2: Selection contains only bold text -> un-bold entire selection
+      // Scenario 3: Selection contains no bold text -> bold entire selection
 
-      var _markInRange = state.doc.rangeHasMark($from.pos, $to.pos, mark);
+      var _removeMark = entireSelectionContainsMark(mark, state.doc, $from.pos, $to.pos);
 
-      applyMarkOnRange($from.pos, $to.pos, _markInRange, mark, tr);
+      applyMarkOnRange($from.pos, $to.pos, _removeMark, mark, tr);
     }
 
     if (tr.docChanged) {

package/dist/cjs/utils/input-rules.js

@@ -9,8 +9,6 @@ exports.ruleWithTransform = exports.ruleWithAnalytics = exports.createWrappingTe
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _prosemirrorHistory = require("prosemirror-history");
-
 var _prosemirrorState = require("prosemirror-state");
 
 var _prosemirrorTransform = require("prosemirror-transform");
@@ -21,6 +19,12 @@ var _prosemirrorInputRules = require("@atlaskit/prosemirror-input-rules");
 
 var _analytics = require("../plugins/analytics");
 
+var _prosemirrorHistory = require("prosemirror-history");
+
+var _prosemirrorUtils = require("prosemirror-utils");
+
+var _featureFlagsContext = require("../plugins/feature-flags-context");
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -158,6 +162,26 @@ var createWrappingJoinRule = function createWrappingJoinRule(_ref3) {
     }
 
     tr.wrap(range, wrapping);
+    var featureFlags = (0, _featureFlagsContext.getFeatureFlags)(state);
+
+    if (featureFlags !== null && featureFlags !== void 0 && featureFlags.restartNumberedLists && nodeType === state.schema.nodes.orderedList) {
+      // if an orderedList node would be inserted by the input rule match, and
+      // that orderedList node is being added directly before another orderedList
+      // node, then join those nodes
+      var $end = tr.doc.resolve(tr.mapping.map(end));
+
+      var _node = (0, _prosemirrorUtils.findParentNodeOfTypeClosestToPos)($end, nodeType);
+
+      if (_node) {
+        var nodeEnd = _node.pos + _node.node.nodeSize;
+        var after = tr.doc.resolve(nodeEnd).nodeAfter;
+
+        if (after && after.type === nodeType && (0, _prosemirrorTransform.canJoin)(tr.doc, nodeEnd) && (!joinPredicate || joinPredicate(match, after))) {
+          tr.join(nodeEnd);
+        }
+      }
+    }
+
     var before = tr.doc.resolve(fixedStart - 1).nodeBefore;
 
     if (before && before.type === nodeType && (0, _prosemirrorTransform.canJoin)(tr.doc, fixedStart - 1) && (!joinPredicate || joinPredicate(match, before))) {

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.nextMajorVersion = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "176.0.2";
+var version = "177.0.0";
 exports.version = version;
 
 var nextMajorVersion = function nextMajorVersion() {

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "176.0.2",
+	"version": "177.0.0",
 	"sideEffects": false
 }

package/dist/es2019/create-editor/ReactEditorView.js

@@ -4,6 +4,7 @@ import PropTypes from 'prop-types';
 import { EditorState, Selection } from 'prosemirror-state';
 import { EditorView } from 'prosemirror-view';
 import { injectIntl } from 'react-intl-next';
+import { editorMessages } from './messages';
 import { browser, getAnalyticsEventSeverity, getResponseEndTime, measureRender, startMeasure, stopMeasure, shouldForceTracking } from '@atlaskit/editor-common/utils';
 import { ExperienceStore, EditorExperience, RELIABILITY_INTERVAL } from '@atlaskit/editor-common/ufo';
 import { createDispatch, EventDispatcher } from '../event-dispatcher';
@@ -586,7 +587,7 @@ export class ReactEditorView extends React.Component {
       className: getUAPrefix(),
       key: "ProseMirror",
       ref: this.handleEditorViewRef,
-      "aria-label": "Main content area",
+      "aria-label": this.props.intl.formatMessage(editorMessages.editorAssistiveLabel),
       role: "textbox"
     }));
 

package/dist/es2019/create-editor/create-plugins-list.js

@@ -69,7 +69,6 @@ export function getDefaultPresetOptionsFromEditorProps(props, createAnalyticsEve
     },
     placeholder: {
       placeholder: props.placeholder,
-      placeholderHints: props.placeholderHints,
       placeholderBracketHint: props.placeholderBracketHint
     },
     textFormatting: { ...(props.textFormatting || {}),
@@ -146,7 +145,11 @@ export default function createPluginsList(props, prevProps, createAnalyticsEvent
   } // Needs to be after allowTextColor as order of buttons in toolbar depends on it
 
 
-  preset.add(listPlugin);
+  preset.add([listPlugin, {
+    restartNumberedLists: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.restartNumberedLists,
+    restartNumberedListsToolbar: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.restartNumberedListsToolbar,
+    listNumberContinuity: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.listNumberContinuity
+  }]);
 
   if (props.allowRule) {
     preset.add(rulePlugin);
@@ -233,10 +236,10 @@ export default function createPluginsList(props, prevProps, createAnalyticsEvent
   }
 
   if (props.allowHelpDialog) {
-    preset.add([helpDialogPlugin, props.legacyImageUploadProvider]);
+    preset.add([helpDialogPlugin, !!props.legacyImageUploadProvider]);
   }
 
-  if (props.saveOnEnter) {
+  if (props.saveOnEnter && props.onSave) {
     preset.add([saveOnEnterPlugin, props.onSave]);
   }
 
@@ -306,7 +309,7 @@ export default function createPluginsList(props, prevProps, createAnalyticsEvent
 
 
   if (!props.annotationProviders && props.allowConfluenceInlineComment) {
-    preset.add(annotationPlugin);
+    preset.add([annotationPlugin, undefined]);
   }
 
   if (props.allowDate) {
@@ -423,7 +426,7 @@ export default function createPluginsList(props, prevProps, createAnalyticsEvent
   }
 
   if (featureFlags.enableViewUpdateSubscription) {
-    preset.add([viewUpdateSubscriptionPlugin]);
+    preset.add(viewUpdateSubscriptionPlugin);
   }
 
   preset.add([codeBidiWarningPlugin, {

package/dist/es2019/create-editor/messages.js

@@ -0,0 +1,8 @@
+import { defineMessages } from 'react-intl-next';
+export const editorMessages = defineMessages({
+  editorAssistiveLabel: {
+    id: 'fabric.editor.editorAssistiveLabel',
+    defaultMessage: 'Main content area, start typing to enter text.',
+    description: 'Text that is read out by screen reader when the main editor is in focus'
+  }
+});

package/dist/es2019/i18n/en.js

@@ -100,8 +100,8 @@ export default {
   'fabric.editor.error': 'Error',
   'fabric.editor.errorPanel': 'Error panel',
   'fabric.editor.errorPanel.description': 'Call out errors in a colored panel',
-  'fabric.editor.extension.confirmDeleteLinkedModalMessage': 'Removing this extension will break anything connected to it.',
-  'fabric.editor.extension.confirmDeleteLinkedModalOKButton': 'Remove extension',
+  'fabric.editor.extension.confirmDeleteLinkedModalMessage': 'Deleting {nodeName} will break anything connected to it.',
+  'fabric.editor.extension.confirmDeleteLinkedModalOKButton': 'Delete',
   'fabric.editor.extensions.config-panel.save-indicator': 'All changes are always autosaved',
   'fabric.editor.find': 'Find',
   'fabric.editor.findNext': 'Find next',

package/dist/es2019/i18n/en_GB.js

@@ -100,8 +100,8 @@ export default {
   'fabric.editor.error': 'Error',
   'fabric.editor.errorPanel': 'Error panel',
   'fabric.editor.errorPanel.description': 'Call out errors in a coloured panel',
-  'fabric.editor.extension.confirmDeleteLinkedModalMessage': 'Removing this extension will break anything connected to it.',
-  'fabric.editor.extension.confirmDeleteLinkedModalOKButton': 'Remove extension',
+  'fabric.editor.extension.confirmDeleteLinkedModalMessage': 'Deleting {nodeName} will break anything connected to it.',
+  'fabric.editor.extension.confirmDeleteLinkedModalOKButton': 'Delete',
   'fabric.editor.extensions.config-panel.save-indicator': 'All changes are always autosaved',
   'fabric.editor.find': 'Find',
   'fabric.editor.findNext': 'Find next',

package/dist/es2019/i18n/en_ZZ.js

@@ -100,8 +100,8 @@ export default {
   'fabric.editor.error': '⁣⁢Error؜‌⁡‌؜⁡‌⁣⁤',
   'fabric.editor.errorPanel': '⁣⁢Error panel⁠‍؜⁠⁠؜‍⁠⁠⁡⁣⁤',
   'fabric.editor.errorPanel.description': '⁣⁢Call out errors in a colored panel⁡⁠؜⁡‍‌‍؜‍⁣⁤',
-  'fabric.editor.extension.confirmDeleteLinkedModalMessage': '⁣⁢Removing this extension will break anything connected to it.⁠؜⁡‌‌‍‌⁡⁠⁡⁡⁡⁡⁣⁤',
-  'fabric.editor.extension.confirmDeleteLinkedModalOKButton': '⁣⁢Remove extension⁡‍‌‍⁠‌‍‍⁠⁠⁣⁤',
+  'fabric.editor.extension.confirmDeleteLinkedModalMessage': 'Deleting {nodeName} will break anything connected to it.⁠؜⁡‌‌‍‌⁡⁠⁡⁡⁡⁡⁣⁤',
+  'fabric.editor.extension.confirmDeleteLinkedModalOKButton': '⁣Delete⁡⁤',
   'fabric.editor.extensions.config-panel.save-indicator': '⁣⁢All changes are always autosaved⁠‍؜‌‌‍‍⁡‌‌‍‌‌⁣⁤',
   'fabric.editor.find': '⁣⁢Find⁠‌⁠‌⁠‍؜⁣⁤',
   'fabric.editor.findNext': '⁣⁢Find next؜‌؜‌؜⁠⁣⁤',

package/dist/es2019/i18n/index.js

@@ -1,13 +1,15 @@
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
- * DO NOT CHANGE IT BY HAND or your changes will be lost.
+ * ED-16073:
+ * This was manually updated since the original `@atlaskit/i18n-tools` has been deprecated
  */
 export { default as zh } from './zh';
 export { default as zh_TW } from './zh_TW';
 export { default as cs } from './cs';
 export { default as da } from './da';
+export { default as en } from './en';
+export { default as en_GB } from './en_GB';
 export { default as nl } from './nl';
 export { default as et } from './et';
 export { default as fi } from './fi';
@@ -29,7 +31,5 @@ export { default as th } from './th';
 export { default as tr } from './tr';
 export { default as uk } from './uk';
 export { default as vi } from './vi';
-export { default as en } from './en';
-export { default as en_GB } from './en_GB';
 export { default as is } from './is';
 export { default as ro } from './ro';

package/dist/es2019/i18n/languages.js

@@ -1,14 +1,15 @@
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
- * DO NOT CHANGE IT BY HAND or your changes will be lost.
+ * ED-16073:
+ * This was manually updated since the original `@atlaskit/i18n-tools` has been deprecated
  */
 export default {
   zh: 'Chinese',
+  zh_TW: 'Chinese (Traditional)',
   cs: 'Czech',
-  da: 'Danish',
   nl: 'Dutch',
+  da: 'Danish',
   en: 'English',
   en_GB: 'English (United Kingdom)',
   et: 'Estonian',
@@ -28,5 +29,9 @@ export default {
   ru: 'Russian',
   sk: 'Slovak',
   es: 'Spanish',
-  sv: 'Swedish'
+  sv: 'Swedish',
+  th: 'Thai',
+  tr: 'Turkish',
+  uk: 'Ukrainian',
+  vi: 'Vietnamese'
 };

package/dist/es2019/labs/next/presets/mobile.js

@@ -79,8 +79,8 @@ export function useMobilePreset({
     allowBlockCards: true,
     platform: 'mobile'
   }]);
-  preset.add([mentionsPlugin]);
-  preset.add([emojiPlugin]); // End
+  preset.add(mentionsPlugin);
+  preset.add(emojiPlugin); // End
 
   if (maxContentSize) {
     preset.add([maxContentSizePlugin, maxContentSize]);

package/dist/es2019/labs/next/presets/preset.js

@@ -1,15 +1,31 @@
 export class Preset {
-  constructor() {
-    this.plugins = [];
+  constructor(...more) {
+    this.data = [...more] || [];
   }
 
-  add(plugin) {
-    this.plugins.push(plugin);
-    return this;
+  add(nextOrTuple) {
+    const newPreset = new Preset(nextOrTuple, ...this.data); // TODO: remove this `this.data.push`,
+    // once refactoring `create-plugins-list` to address this complexity:
+
+    /**
+     * preset.add(x)
+     * preset.add(y)
+     * preset.add(z)
+     */
+    // to:
+
+    /**
+     * immutablePreset = preset.add(x).add(foo).add(bar)
+     * presetWithY = presetWithY.add(y)
+     * presetWithZ = preset.add(z)
+     */
+
+    this.data.push(nextOrTuple);
+    return newPreset;
   }
 
   has(plugin) {
-    return this.plugins.some(pluginPreset => {
+    return this.data.some(pluginPreset => {
       if (Array.isArray(pluginPreset)) {
         return pluginPreset[0] === plugin;
       }
@@ -25,7 +41,7 @@ export class Preset {
 
   processEditorPlugins() {
     const cache = new Map();
-    this.plugins.forEach(pluginEntry => {
+    this.data.forEach(pluginEntry => {
       if (Array.isArray(pluginEntry)) {
         const [fn, options] = pluginEntry;
         cache.set(fn, options);
@@ -49,6 +65,11 @@ export class Preset {
     cache.forEach((options, fn) => {
       plugins.push(fn(options));
     });
+
+    if (plugins.some(plugin => typeof plugin === 'function')) {
+      throw new Error("!!! NextEditorPluginWithDependencies detected in presets. That's an unsupported runtime use case right now.");
+    }
+
     return plugins;
   }
 

package/dist/es2019/plugins/annotation/nodeviews/index.js

@@ -19,6 +19,7 @@ export class AnnotationNodeView extends ReactNodeView {
       /*#__PURE__*/
       // all inline comment states are now set in decorations at ../pm-plugins/inline-comment.ts
       React.createElement("span", {
+        "data-mark-type": "annotation",
         ref: forwardRef
       })
     );

package/dist/es2019/plugins/block-type/ui/ToolbarBlockType/index.js

@@ -11,6 +11,7 @@ import { NORMAL_TEXT } from '../../types';
 import { blockTypeMenuItemStyle, keyboardShortcut, keyboardShortcutSelect } from './styled';
 import { tooltip, findKeymapByDescription } from '../../../../keymaps';
 import { BlockTypeButton } from './blocktype-button';
+import { getAriaKeyshortcuts } from '@atlaskit/editor-common/keymaps';
 
 class ToolbarBlockType extends React.PureComponent {
   constructor(...args) {
@@ -46,16 +47,19 @@ class ToolbarBlockType extends React.PureComponent {
         const isActive = currentBlockType === blockType;
         const tagName = blockType.tagName || 'p';
         const Tag = tagName;
+        const keyMap = findKeymapByDescription(blockType.title.defaultMessage);
         return {
           content: jsx("div", {
             css: blockTypeMenuItemStyle(tagName, isActive)
           }, jsx(Tag, null, formatMessage(blockType.title))),
           value: blockType,
           label: formatMessage(blockType.title),
+          'aria-label': tooltip(keyMap, formatMessage(blockType.title)),
+          keyShortcuts: getAriaKeyshortcuts(keyMap),
           key: `${blockType.name}-${index}`,
           elemAfter: jsx("div", {
             css: [keyboardShortcut, isActive && keyboardShortcutSelect]
-          }, tooltip(findKeymapByDescription(blockType.title.defaultMessage))),
+          }, tooltip(keyMap)),
           isActive
         };
       });

package/dist/es2019/plugins/breakout/ui/LayoutButton.js

@@ -20,6 +20,7 @@ import { getPluginState } from '../plugin-key';
 import { NodeSelection } from 'prosemirror-state';
 import { isSupportedNodeForBreakout } from '../utils/is-supported-node';
 import { token } from '@atlaskit/tokens';
+import { layers } from '@atlaskit/theme/constants';
 const toolbarButtonWrapper = css`
   && button {
     background: ${token('color.background.neutral', N20A)};
@@ -108,6 +109,7 @@ class LayoutButton extends React.Component {
     const titleMessage = getTitle(breakoutMode);
     const title = formatMessage(titleMessage);
     const nextBreakoutMode = getNextBreakoutMode(breakoutMode);
+    const belowOtherPopupsZIndex = layers.layer() - 1;
     let pluginState = getPluginState(state);
     let element = getBreakoutNodeElement(pluginState, state.selection, editorView);
 
@@ -131,7 +133,8 @@ class LayoutButton extends React.Component {
       boundariesElement: boundariesElement,
       scrollableElement: scrollableElement,
       stick: true,
-      forcePlacement: true
+      forcePlacement: true,
+      zIndex: belowOtherPopupsZIndex
     }, jsx("div", {
       css: toolbarButtonWrapper
     }, jsx(ToolbarButton, {

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

@@ -1,17 +1,16 @@
-import { NodeSelection } from 'prosemirror-state';
 import { closeHistory } from 'prosemirror-history';
-import { pluginKey } from './plugin-key';
-import { queueCards, resolveCard } from './actions';
-import { appearanceForNodeType } from '../utils';
-import { nodesBetweenChanged, processRawValue } from '../../../utils';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, addAnalytics, EVENT_TYPE, INPUT_METHOD } from '../../../plugins/analytics';
+import { NodeSelection } from 'prosemirror-state';
 import { isSafeUrl } from '@atlaskit/adf-schema';
-import { isFromCurrentDomain } from '../../hyperlink/utils';
-import { shouldReplaceLink } from './shouldReplaceLink';
+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 { getFeatureFlags } from '../../feature-flags-context';
+import { isFromCurrentDomain } from '../../hyperlink/utils';
+import { appearanceForNodeType } from '../utils';
+import { queueCards, resolveCard } from './actions';
+import { pluginKey } from './plugin-key';
+import { shouldReplaceLink } from './shouldReplaceLink';
 /**
  * Attempt to replace the link into the respective card.
  */
@@ -198,17 +197,13 @@ export const changeSelectedCardToLink = (text, href, sendAnalytics, node, pos) =
 
   if (sendAnalytics) {
     if (selectedNode) {
-      const {
-        viewChangingExperimentToolbarStyle
-      } = getFeatureFlags(state);
       addAnalytics(state, tr, {
         action: ACTION.CHANGED_TYPE,
         actionSubject: ACTION_SUBJECT.SMART_LINK,
         eventType: EVENT_TYPE.TRACK,
         attributes: {
           newType: SMART_LINK_TYPE.URL,
-          previousType: appearanceForNodeType(selectedNode.type),
-          featureFlag: viewChangingExperimentToolbarStyle || 'noChange'
+          previousType: appearanceForNodeType(selectedNode.type)
         }
       });
     }
@@ -333,17 +328,13 @@ export const setSelectedCardAppearance = appearance => (state, dispatch) => {
   } = state.selection;
   const nodeType = getLinkNodeType(appearance, state.schema.nodes);
   const tr = state.tr.setNodeMarkup(from, nodeType, attrs, selectedNode.marks);
-  const {
-    viewChangingExperimentToolbarStyle
-  } = getFeatureFlags(state);
   addAnalytics(state, tr, {
     action: ACTION.CHANGED_TYPE,
     actionSubject: ACTION_SUBJECT.SMART_LINK,
     eventType: EVENT_TYPE.TRACK,
     attributes: {
       newType: appearance,
-      previousType: appearanceForNodeType(selectedNode.type),
-      featureFlag: viewChangingExperimentToolbarStyle || 'noChange'
+      previousType: appearanceForNodeType(selectedNode.type)
     }
   });
 

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

@@ -1,14 +1,13 @@
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import rafSchedule from 'raf-schd';
 import { getInlineNodeViewProducer } from '../../../nodeviews/getInlineNodeViewProducer';
-import reducer from './reducers';
+import { BlockCard } from '../nodeviews/blockCard';
+import { EmbedCard } from '../nodeviews/embedCard';
+import { InlineCardNodeView } from '../nodeviews/inlineCard';
 import { pluginKey } from './plugin-key';
+import reducer from './reducers';
 import { handleProvider, resolveWithProvider } from './util/resolve';
 import { getNewRequests, getPluginState, getPluginStateWithUpdatedPos } from './util/state';
-import { EmbedCard } from '../nodeviews/embedCard';
-import { BlockCard } from '../nodeviews/blockCard';
-import { InlineCardNodeView } from '../nodeviews/inlineCard';
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../../../plugins/analytics';
 export { pluginKey } from './plugin-key';
 export const createPlugin = options => pmPluginFactoryParams => {
   const {
@@ -21,20 +20,6 @@ export const createPlugin = options => pmPluginFactoryParams => {
   return new SafePlugin({
     state: {
       init() {
-        const {
-          viewChangingExperimentToolbarStyle
-        } = pmPluginFactoryParams.featureFlags;
-        pmPluginFactoryParams.dispatchAnalyticsEvent({
-          eventType: EVENT_TYPE.OPERATIONAL,
-          action: ACTION.EXPOSED,
-          actionSubject: ACTION_SUBJECT.FEATURE,
-          attributes: {
-            flagKey: 'confluence.frontend.fabric.editor.view-changing-experiment-toolbar-style',
-            value: viewChangingExperimentToolbarStyle || 'noChange'
-          },
-          source: '@atlaskit/feature-flag-client',
-          tags: ['measurement']
-        });
         return {
           requests: [],
           provider: null,

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

@@ -83,6 +83,8 @@ export const openLinkSettings = (state, dispatch) => {
 };
 export const floatingToolbar = (cardOptions, platform, linkPickerOptions) => {
   return (state, intl, providerFactory) => {
+    var _linkPickerOptions$pl;
+
     const {
       inlineCard,
       blockCard,
@@ -109,10 +111,22 @@ export const floatingToolbar = (cardOptions, platform, linkPickerOptions) => {
     } : {}; // Applies padding override for when link picker is currently displayed
 
     const className = pluginState.showLinkingToolbar ? FLOATING_TOOLBAR_LINKPICKER_CLASSNAME : undefined;
+    /**
+     * Enable focus trap only if feature flag is enabled AND for the new version of the picker
+     */
+
+    const {
+      lpLinkPicker,
+      lpLinkPickerFocusTrap,
+      preventPopupOverflow
+    } = getFeatureFlags(state);
+    const shouldEnableFocusTrap = lpLinkPicker && lpLinkPickerFocusTrap;
+    const isLinkPickerEnabled = !!lpLinkPicker && !!(linkPickerOptions !== null && linkPickerOptions !== void 0 && (_linkPickerOptions$pl = linkPickerOptions.plugins) !== null && _linkPickerOptions$pl !== void 0 && _linkPickerOptions$pl.length);
     return {
       title: intl.formatMessage(messages.card),
       className,
       nodeType,
+      preventPopupOverflow,
       ...toolbarOffset,
       getDomRef: view => {
         const element = findDomRefAtPos(view.state.selection.from, view.domAtPos.bind(view));
@@ -128,8 +142,9 @@ export const floatingToolbar = (cardOptions, platform, linkPickerOptions) => {
         return element;
       },
       items: generateToolbarItems(state, intl, providerFactory, cardOptions, platform, linkPickerOptions),
-      ...(pluginState.showLinkingToolbar ? editLinkToolbarConfig : {}),
-      scrollable: pluginState.showLinkingToolbar ? false : true
+      scrollable: pluginState.showLinkingToolbar ? false : true,
+      focusTrap: shouldEnableFocusTrap && pluginState.showLinkingToolbar,
+      ...editLinkToolbarConfig(pluginState.showLinkingToolbar, isLinkPickerEnabled)
     };
   };
 };
@@ -213,6 +228,7 @@ const generateToolbarItems = (state, intl, providerFactory, cardOptions, platfor
       }]
     }, ...getSettingsButtonGroup(state, intl), {
       id: 'editor.link.delete',
+      focusEditoronEnter: true,
       type: 'button',
       appearance: 'danger',
       icon: RemoveIcon,
@@ -267,6 +283,7 @@ const generateToolbarItems = (state, intl, providerFactory, cardOptions, platfor
 const getUnlinkButtonGroup = (state, intl, node, inlineCard) => {
   return node.type === inlineCard ? [{
     id: 'editor.link.unlink',
+    focusEditoronEnter: true,
     type: 'button',
     title: intl.formatMessage(linkToolbarMessages.unlink),
     icon: UnlinkIcon,

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

@@ -2,7 +2,7 @@ import React from 'react';
 import HyperlinkToolbar from '../../hyperlink/ui/HyperlinkAddToolbar';
 import { showLinkToolbar, hideLinkToolbar } from '../pm-plugins/actions';
 import { addAnalytics } from '../../analytics';
-import { RECENT_SEARCH_HEIGHT_IN_PX, RECENT_SEARCH_WIDTH_IN_PX } from '../../../ui/LinkSearch/ToolbarComponents';
+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';
@@ -72,8 +72,8 @@ export const buildEditLinkToolbar = ({
 }) => {
   return {
     type: 'custom',
-    fallback: [],
     disableArrowNavigation: true,
+    fallback: [],
     render: (view, idx) => {
       if (!view || !providerFactory) {
         return null;
@@ -106,8 +106,10 @@ export const buildEditLinkToolbar = ({
     }
   };
 };
-export const editLinkToolbarConfig = {
-  height: RECENT_SEARCH_HEIGHT_IN_PX,
-  width: RECENT_SEARCH_WIDTH_IN_PX,
-  forcePlacement: true
+export const editLinkToolbarConfig = (showLinkingToolbar, linkPickerOptions) => {
+  return showLinkingToolbar ? {
+    height: linkPickerOptions ? LINKPICKER_HEIGHT_IN_PX : RECENT_SEARCH_HEIGHT_IN_PX,
+    width: RECENT_SEARCH_WIDTH_IN_PX,
+    forcePlacement: true
+  } : {};
 };