@atlaskit/editor-core 185.6.5 → 185.8.0

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

@@ -0,0 +1,36 @@
+import React from 'react';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { HyperlinkToolbarAppearance } from '../ui/HyperlinkToolbarAppearance';
+export const mountHyperlinkPlugin = (pluginInjectionApi, options) => {
+  return new SafePlugin({
+    view(editorView) {
+      requestAnimationFrame(() => {
+        var _pluginInjectionApi$d, _pluginInjectionApi$d2;
+        pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies.hyperlink) === null || _pluginInjectionApi$d === void 0 ? void 0 : (_pluginInjectionApi$d2 = _pluginInjectionApi$d.actions) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.prependToolbarButtons({
+          items: (state, intl, providerFactory, link) => [{
+            type: 'custom',
+            fallback: [],
+            render: editorView => {
+              var _pluginInjectionApi$d3, _pluginInjectionApi$d4;
+              return /*#__PURE__*/React.createElement(HyperlinkToolbarAppearance, {
+                key: "link-appearance",
+                url: link,
+                intl: intl,
+                editorView: editorView,
+                editorState: state,
+                cardOptions: options,
+                providerFactory: providerFactory,
+                platform: options === null || options === void 0 ? void 0 : options.platform,
+                editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d3 = pluginInjectionApi.dependencies.analytics) === null || _pluginInjectionApi$d3 === void 0 ? void 0 : _pluginInjectionApi$d3.actions,
+                cardActions: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d4 = pluginInjectionApi.dependencies.card) === null || _pluginInjectionApi$d4 === void 0 ? void 0 : _pluginInjectionApi$d4.actions
+              });
+            }
+          }],
+          onEscapeCallback: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.dependencies.card.actions.hideLinkToolbar,
+          view: editorView
+        });
+      });
+      return {};
+    }
+  });
+};

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

@@ -15,8 +15,8 @@ import { editDatasource, buildEditLinkToolbar, editLink, editLinkToolbarConfig,
 import { displayInfoForCard, findCardInfo, titleUrlPairFromNode, appearanceForNodeType } from './utils';
 import { isSafeUrl } from '@atlaskit/adf-schema';
 import { LinkToolbarAppearance } from './ui/LinkToolbarAppearance';
-import { messages } from './messages';
-import { FLOATING_TOOLBAR_LINKPICKER_CLASSNAME } from './styles';
+import { cardMessages as messages } from '@atlaskit/editor-common/messages';
+import { FLOATING_TOOLBAR_LINKPICKER_CLASSNAME } from '@atlaskit/editor-common/styles';
 import { ACTION, ACTION_SUBJECT, INPUT_METHOD, EVENT_TYPE, buildOpenedSettingsPayload, buildVisitedLinkPayload } from '@atlaskit/editor-common/analytics';
 import { SmallerEditIcon } from './ui/SmallerEditIcon';
 export const removeCard = editorAnalyticsApi => commandWithMetadata((state, dispatch) => {
@@ -286,7 +286,8 @@ const generateToolbarItems = (state, featureFlags, intl, providerFactory, cardOp
           allowEmbeds: allowEmbeds,
           allowBlockCards: allowBlockCards,
           platform: platform,
-          editorAnalyticsApi: editorAnalyticsApi
+          editorAnalyticsApi: editorAnalyticsApi,
+          cardActions: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.dependencies.card.actions
         })
       }, {
         type: 'separator'

package/dist/es2019/plugins/{hyperlink → card/ui}/HyperlinkToolbarAppearance.js

@@ -1,7 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import { Component } from 'react';
-import { LinkToolbarAppearance } from '../card/ui/LinkToolbarAppearance';
+import { LinkToolbarAppearance } from './LinkToolbarAppearance';
 export class HyperlinkToolbarAppearance extends Component {
   constructor(...args) {
     super(...args);
@@ -61,7 +61,8 @@ export class HyperlinkToolbarAppearance extends Component {
       editorState,
       cardOptions,
       platform,
-      editorAnalyticsApi
+      editorAnalyticsApi,
+      cardActions
     } = this.props;
     const {
       supportedUrlsMap
@@ -78,7 +79,8 @@ export class HyperlinkToolbarAppearance extends Component {
       allowEmbeds: cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowEmbeds,
       allowBlockCards: cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowBlockCards,
       platform: platform,
-      editorAnalyticsApi: editorAnalyticsApi
+      editorAnalyticsApi: editorAnalyticsApi,
+      cardActions: cardActions
     });
   }
 }

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

@@ -1,19 +1,16 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import { ACTION, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { Fragment } from 'prosemirror-model';
-import React from 'react';
-import nodeNames from '@atlaskit/editor-common/messages';
+import { ACTION, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import nodeNames, { cardMessages as messages } from '@atlaskit/editor-common/messages';
 import { isSupportedInParent } from '@atlaskit/editor-common/utils';
-import { messages } from '../messages';
-import { commandWithMetadata } from '@atlaskit/editor-common/card';
-import { changeSelectedCardToLink, setSelectedCardAppearance } from '../pm-plugins/doc';
-import { getButtonGroupOption } from './link-toolbar-button-group-options';
-import { LinkToolbarButtonGroup } from './LinkToolbarButtonGroup';
+import { getButtonGroupOption, LinkToolbarButtonGroup, commandWithMetadata } from '@atlaskit/editor-common/card';
 export class LinkToolbarAppearance extends React.Component {
   constructor(...args) {
     super(...args);
     _defineProperty(this, "renderDropdown", (view, cardContext) => {
+      var _cardActions$setSelec, _cardActions$setSelec2, _cardActions$changeSe, _cardActions$setSelec3;
       const {
         url,
         intl,
@@ -22,9 +19,11 @@ export class LinkToolbarAppearance extends React.Component {
         allowEmbeds,
         allowBlockCards = true,
         platform,
-        editorAnalyticsApi
+        editorAnalyticsApi,
+        cardActions
       } = this.props;
       const preview = allowEmbeds && cardContext && url && cardContext.extractors.getPreview(url, platform);
+      const defaultCommand = () => false;
       if (url) {
         var _cardContext$store, _urlState$error;
         const urlState = cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$store = cardContext.store) === null || _cardContext$store === void 0 ? void 0 : _cardContext$store.getState()[url];
@@ -37,7 +36,7 @@ export class LinkToolbarAppearance extends React.Component {
       const embedOption = allowEmbeds && preview && {
         appearance: 'embed',
         title: intl.formatMessage(messages.embed),
-        onClick: setSelectedCardAppearance('embed', editorAnalyticsApi),
+        onClick: (_cardActions$setSelec = cardActions === null || cardActions === void 0 ? void 0 : cardActions.setSelectedCardAppearance('embed', editorAnalyticsApi)) !== null && _cardActions$setSelec !== void 0 ? _cardActions$setSelec : defaultCommand,
         selected: currentAppearance === 'embed',
         hidden: false,
         testId: 'embed-appearance',
@@ -47,7 +46,7 @@ export class LinkToolbarAppearance extends React.Component {
       const blockCardOption = allowBlockCards && {
         appearance: 'block',
         title: intl.formatMessage(messages.block),
-        onClick: setSelectedCardAppearance('block', editorAnalyticsApi),
+        onClick: (_cardActions$setSelec2 = cardActions === null || cardActions === void 0 ? void 0 : cardActions.setSelectedCardAppearance('block', editorAnalyticsApi)) !== null && _cardActions$setSelec2 !== void 0 ? _cardActions$setSelec2 : defaultCommand,
         selected: currentAppearance === 'block',
         testId: 'block-appearance',
         disabled: !isBlockCardLinkSupportedInParent,
@@ -55,7 +54,7 @@ export class LinkToolbarAppearance extends React.Component {
       };
       const options = [{
         title: intl.formatMessage(messages.url),
-        onClick: commandWithMetadata(changeSelectedCardToLink(url, url, true, undefined, undefined, editorAnalyticsApi), {
+        onClick: commandWithMetadata((_cardActions$changeSe = cardActions === null || cardActions === void 0 ? void 0 : cardActions.changeSelectedCardToLink(url, url, true, undefined, undefined, editorAnalyticsApi)) !== null && _cardActions$changeSe !== void 0 ? _cardActions$changeSe : defaultCommand, {
           action: ACTION.CHANGED_TYPE
         }),
         selected: !currentAppearance,
@@ -63,7 +62,7 @@ export class LinkToolbarAppearance extends React.Component {
       }, {
         appearance: 'inline',
         title: intl.formatMessage(messages.inline),
-        onClick: setSelectedCardAppearance('inline', editorAnalyticsApi),
+        onClick: (_cardActions$setSelec3 = cardActions === null || cardActions === void 0 ? void 0 : cardActions.setSelectedCardAppearance('inline', editorAnalyticsApi)) !== null && _cardActions$setSelec3 !== void 0 ? _cardActions$setSelec3 : defaultCommand,
         selected: currentAppearance === 'inline',
         testId: 'inline-appearance'
       }];

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

@@ -8,7 +8,7 @@ import { calcColumnsFromPx, calcPctFromPx, calcPxFromColumns, wrappedLayouts } f
 import { akEditorMediaResizeHandlerPaddingWide, akEditorBreakoutPadding, akEditorWideLayoutWidth, breakoutWideScaleRatio, DEFAULT_EMBED_CARD_HEIGHT, DEFAULT_EMBED_CARD_WIDTH } from '@atlaskit/editor-shared-styles';
 import { embedHeaderHeight } from '@atlaskit/smart-card';
 import { wrapperStyle, Resizer, handleSides, imageAlignmentMap, snapTo, calcMediaPxWidth } from '@atlaskit/editor-common/ui';
-import { embedSpacingStyles } from './styled';
+import { embedSpacingStyles } from '@atlaskit/editor-common/styles';
 export default class ResizableEmbedCard extends React.Component {
   constructor(...args) {
     super(...args);

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

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import EditIcon from '@atlaskit/icon/glyph/edit';
-import { editIconStyles } from './styled';
+import { editIconStyles } from '@atlaskit/editor-common/styles';
 export const SmallerEditIcon = () => {
   return jsx("div", {
     css: editIconStyles

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

@@ -1,7 +1,5 @@
 import { NodeSelection } from 'prosemirror-state';
-import { Slice, Fragment } from 'prosemirror-model';
 import { pluginKey } from './pm-plugins/plugin-key';
-import { isSupportedInParent, mapChildren } from '@atlaskit/editor-common/utils';
 export const appearanceForNodeType = spec => {
   if (spec.name === 'inlineCard') {
     return 'inline';
@@ -42,30 +40,4 @@ export const displayInfoForCard = (node, info) => mergeCardInfo(titleUrlPairFrom
 export const findCardInfo = state => {
   const pluginState = pluginKey.getState(state);
   return pluginState.cards.find(cardInfo => cardInfo.pos === state.selection.from);
-};
-export const transformUnsupportedBlockCardToInline = (slice, state, cardOptions) => {
-  const {
-    blockCard,
-    inlineCard
-  } = state.schema.nodes;
-  const children = [];
-  mapChildren(slice.content, (node, i, frag) => {
-    var _cardOptions$allowBlo;
-    if (node.type === blockCard && !isBlockCardSupported(state, frag, (_cardOptions$allowBlo = cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowBlockCards) !== null && _cardOptions$allowBlo !== void 0 ? _cardOptions$allowBlo : false)) {
-      children.push(inlineCard.createChecked(node.attrs, node.content, node.marks));
-    } else {
-      children.push(node);
-    }
-  });
-  return new Slice(Fragment.fromArray(children), slice.openStart, slice.openEnd);
-};
-/**
- * Function to determine if a block card is supported by the editor
- * @param state
- * @param frag
- * @param allowBlockCards
- * @returns
- */
-const isBlockCardSupported = (state, frag, allowBlockCards) => {
-  return allowBlockCards && isSupportedInParent(state, frag);
 };

package/dist/es2019/plugins/hyperlink/Toolbar.js

@@ -10,24 +10,28 @@ import { normalizeUrl } from '@atlaskit/editor-common/utils';
 import { linkToolbarMessages as linkToolbarCommonMessages, linkMessages } from '../../messages';
 import { isSafeUrl } from '@atlaskit/adf-schema';
 import { LINKPICKER_HEIGHT_IN_PX, RECENT_SEARCH_HEIGHT_IN_PX, RECENT_SEARCH_WIDTH_IN_PX } from '@atlaskit/editor-common/ui';
-import { HyperlinkToolbarAppearance } from './HyperlinkToolbarAppearance';
 import { ACTION_SUBJECT_ID, ACTION, INPUT_METHOD, buildVisitedLinkPayload, buildOpenedSettingsPayload } from '@atlaskit/editor-common/analytics';
-import { addAnalytics } from '../analytics';
+import { toolbarKey } from './pm-plugins/toolbar-buttons';
+
 /* type guard for edit links */
 function isEditLink(linkMark) {
   return linkMark.pos !== undefined;
 }
-const dispatchAnalytics = (dispatch, state, analyticsBuilder) => {
+const dispatchAnalytics = (dispatch, state, analyticsBuilder, editorAnalyticsApi) => {
   if (dispatch) {
-    dispatch(addAnalytics(state, state.tr, analyticsBuilder(ACTION_SUBJECT_ID.HYPERLINK)));
+    const {
+      tr
+    } = state;
+    editorAnalyticsApi === null || editorAnalyticsApi === void 0 ? void 0 : editorAnalyticsApi.attachAnalyticsEvent(analyticsBuilder(ACTION_SUBJECT_ID.HYPERLINK))(tr);
+    dispatch(tr);
   }
 };
-const visitHyperlink = () => (state, dispatch) => {
-  dispatchAnalytics(dispatch, state, buildVisitedLinkPayload);
+const visitHyperlink = editorAnalyticsApi => (state, dispatch) => {
+  dispatchAnalytics(dispatch, state, buildVisitedLinkPayload, editorAnalyticsApi);
   return true;
 };
-const openLinkSettings = () => (state, dispatch) => {
-  dispatchAnalytics(dispatch, state, buildOpenedSettingsPayload);
+const openLinkSettings = editorAnalyticsApi => (state, dispatch) => {
+  dispatchAnalytics(dispatch, state, buildOpenedSettingsPayload, editorAnalyticsApi);
   return true;
 };
 function getLinkText(activeLinkMark, state) {
@@ -42,7 +46,7 @@ function getLinkText(activeLinkMark, state) {
   }
   return activeLinkMark.node.text;
 }
-const getSettingsButtonGroup = (state, intl, featureFlags) => {
+const getSettingsButtonGroup = (state, intl, featureFlags, editorAnalyticsApi) => {
   const {
     floatingToolbarLinkSettingsButton
   } = featureFlags;
@@ -53,16 +57,18 @@ const getSettingsButtonGroup = (state, intl, featureFlags) => {
     type: 'button',
     icon: CogIcon,
     title: intl.formatMessage(linkToolbarCommonMessages.settingsLink),
-    onClick: openLinkSettings(),
+    onClick: openLinkSettings(editorAnalyticsApi),
     href: 'https://id.atlassian.com/manage-profile/link-preferences',
     target: '_blank'
   }] : [];
 };
-export const getToolbarConfig = (options, featureFlags, editorAnalyticsApi) => (state, intl, providerFactory) => {
+export const getToolbarConfig = (options, featureFlags, pluginInjectionApi) => (state, intl, providerFactory) => {
+  var _pluginInjectionApi$d;
   const {
     formatMessage
   } = intl;
   const linkState = stateKey.getState(state);
+  const editorAnalyticsApi = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies.analytics) === null || _pluginInjectionApi$d === void 0 ? void 0 : _pluginInjectionApi$d.actions;
 
   /**
    * Enable focus trap only if feature flag is enabled AND for the new version of the picker
@@ -87,6 +93,7 @@ export const getToolbarConfig = (options, featureFlags, editorAnalyticsApi) => (
     switch (activeLinkMark.type) {
       case 'EDIT':
         {
+          var _toolbarKey$getState$, _toolbarKey$getState;
           const {
             pos,
             node
@@ -109,23 +116,7 @@ export const getToolbarConfig = (options, featureFlags, editorAnalyticsApi) => (
             ...hyperLinkToolbar,
             height: 32,
             width: 250,
-            items: [{
-              type: 'custom',
-              fallback: [],
-              render: editorView => {
-                return /*#__PURE__*/React.createElement(HyperlinkToolbarAppearance, {
-                  key: "link-appearance",
-                  url: link,
-                  intl: intl,
-                  editorView: editorView,
-                  editorState: state,
-                  cardOptions: options === null || options === void 0 ? void 0 : options.cardOptions,
-                  providerFactory: providerFactory,
-                  platform: options === null || options === void 0 ? void 0 : options.platform,
-                  editorAnalyticsApi: editorAnalyticsApi
-                });
-              }
-            }, {
+            items: [...((_toolbarKey$getState$ = (_toolbarKey$getState = toolbarKey.getState(state)) === null || _toolbarKey$getState === void 0 ? void 0 : _toolbarKey$getState.items(state, intl, providerFactory, link)) !== null && _toolbarKey$getState$ !== void 0 ? _toolbarKey$getState$ : []), {
               id: 'editor.link.edit',
               type: 'button',
               onClick: editInsertedLink(),
@@ -141,7 +132,7 @@ export const getToolbarConfig = (options, featureFlags, editorAnalyticsApi) => (
               disabled: !isValidUrl,
               target: '_blank',
               href: isValidUrl ? link : undefined,
-              onClick: visitHyperlink(),
+              onClick: visitHyperlink(editorAnalyticsApi),
               selected: false,
               title: labelOpenLink,
               icon: OpenIcon,
@@ -169,7 +160,7 @@ export const getToolbarConfig = (options, featureFlags, editorAnalyticsApi) => (
                 formatMessage: formatMessage,
                 markType: state.schema.marks.link
               }]
-            }, ...getSettingsButtonGroup(state, intl, featureFlags)],
+            }, ...getSettingsButtonGroup(state, intl, featureFlags, editorAnalyticsApi)],
             scrollable: true
           };
         }

package/dist/es2019/plugins/hyperlink/commands.js

@@ -189,10 +189,13 @@ export function showLinkToolbar(inputMethod = INPUT_METHOD.TOOLBAR) {
 export function hideLinkToolbar() {
   return function (state, dispatch) {
     if (dispatch) {
-      dispatch(state.tr.setMeta(stateKey, {
-        type: LinkAction.HIDE_TOOLBAR
-      }));
+      dispatch(hideLinkToolbarSetMeta(state.tr));
     }
     return true;
   };
+}
+export function hideLinkToolbarSetMeta(tr) {
+  return tr.setMeta(stateKey, {
+    type: LinkAction.HIDE_TOOLBAR
+  });
 }

package/dist/es2019/plugins/hyperlink/index.js

@@ -4,13 +4,14 @@ import { createInputRulePlugin } from './pm-plugins/input-rule';
 import { createKeymapPlugin } from './pm-plugins/keymap';
 import { plugin, stateKey, LinkAction } from './pm-plugins/main';
 import fakeCursorToolbarPlugin from './pm-plugins/fake-cursor-for-toolbar';
+import { toolbarButtonsPlugin, prependToolbarButtons } from './pm-plugins/toolbar-buttons';
 import { ACTION, ACTION_SUBJECT, INPUT_METHOD, EVENT_TYPE, ACTION_SUBJECT_ID } from '@atlaskit/editor-common/analytics';
 import { getToolbarConfig } from './Toolbar';
 import { tooltip, addLink } from '../../keymaps';
 import { IconLink } from '../quick-insert/assets';
 import { messages } from '../insert-block/ui/ToolbarInsertBlock/messages';
 const hyperlinkPlugin = (options = {}, api) => {
-  var _api$dependencies, _api$dependencies$fea, _api$dependencies$ana;
+  var _api$dependencies, _api$dependencies$fea;
   const featureFlags = (api === null || api === void 0 ? void 0 : (_api$dependencies = api.dependencies) === null || _api$dependencies === void 0 ? void 0 : (_api$dependencies$fea = _api$dependencies.featureFlags) === null || _api$dependencies$fea === void 0 ? void 0 : _api$dependencies$fea.sharedState.currentState()) || {};
   return {
     name: 'hyperlink',
@@ -20,6 +21,9 @@ const hyperlinkPlugin = (options = {}, api) => {
         mark: link
       }];
     },
+    actions: {
+      prependToolbarButtons
+    },
     pmPlugins() {
       var _options$cardOptions;
       // Skip analytics if card provider is available, as they will be
@@ -42,6 +46,9 @@ const hyperlinkPlugin = (options = {}, api) => {
       }, {
         name: 'hyperlinkKeymap',
         plugin: () => createKeymapPlugin(skipAnalytics)
+      }, {
+        name: 'hyperlinkToolbarButtons',
+        plugin: toolbarButtonsPlugin
       }];
     },
     pluginsOptions: {
@@ -74,7 +81,7 @@ const hyperlinkPlugin = (options = {}, api) => {
           return analyticsAttached !== false ? tr : false;
         }
       }],
-      floatingToolbar: getToolbarConfig(options, featureFlags, api === null || api === void 0 ? void 0 : (_api$dependencies$ana = api.dependencies.analytics) === null || _api$dependencies$ana === void 0 ? void 0 : _api$dependencies$ana.actions)
+      floatingToolbar: getToolbarConfig(options, featureFlags, api)
     }
   };
 };

package/dist/es2019/plugins/hyperlink/pm-plugins/toolbar-buttons.js

@@ -0,0 +1,37 @@
+import { PluginKey } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+export const toolbarKey = new PluginKey('hyperlinkToolbarItems');
+export const prependToolbarButtons = ({
+  items,
+  onEscapeCallback,
+  view
+}) => {
+  const {
+    state: {
+      tr
+    },
+    dispatch
+  } = view;
+  tr.setMeta(toolbarKey, {
+    items,
+    onEscapeCallback
+  });
+  dispatch(tr);
+};
+export const toolbarButtonsPlugin = () => {
+  return new SafePlugin({
+    key: toolbarKey,
+    state: {
+      init: (_, state) => {
+        return undefined;
+      },
+      apply: (tr, pluginState) => {
+        const metaState = tr.getMeta(toolbarKey);
+        if (metaState) {
+          return metaState;
+        }
+        return pluginState;
+      }
+    }
+  });
+};

package/dist/es2019/plugins/hyperlink/ui/EditorLinkPicker/index.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { LinkPicker } from '@atlaskit/link-picker';
-import { hideLinkToolbar as cardHideLinkToolbar } from '../../../card/pm-plugins/actions';
-import { hideLinkToolbar } from '../../commands';
+import { hideLinkToolbarSetMeta, hideLinkToolbar } from '../../commands';
+import { toolbarKey } from '../../pm-plugins/toolbar-buttons';
 import { useEscapeClickaway } from './useEscapeClickaway';
 import { AnalyticsContext } from '@atlaskit/analytics-next';
 import { getAnalyticsEditorAppearance } from '@atlaskit/editor-common/utils';
@@ -39,8 +39,15 @@ export const EditorLinkPicker = ({
     return (_onCloseRef$current = onCloseRef.current) === null || _onCloseRef$current === void 0 ? void 0 : _onCloseRef$current.call(onCloseRef);
   }, []);
   const onEscape = useCallback(() => {
-    hideLinkToolbar()(view.state, view.dispatch);
-    view.dispatch(cardHideLinkToolbar(view.state.tr));
+    var _toolbarKey$getState, _toolbarKey$getState$;
+    const {
+      state: {
+        tr
+      }
+    } = view;
+    hideLinkToolbarSetMeta(tr);
+    (_toolbarKey$getState = toolbarKey.getState(view.state)) === null || _toolbarKey$getState === void 0 ? void 0 : (_toolbarKey$getState$ = _toolbarKey$getState.onEscapeCallback) === null || _toolbarKey$getState$ === void 0 ? void 0 : _toolbarKey$getState$.call(_toolbarKey$getState, tr);
+    view.dispatch(tr);
     onCancel === null || onCancel === void 0 ? void 0 : onCancel();
   }, [view, onCancel]);
   const onClickAway = useCallback(() => {

package/dist/es2019/plugins/hyperlink/ui/HyperlinkAddToolbar/HyperlinkAddToolbar.js

@@ -12,7 +12,7 @@ import Tooltip from '@atlaskit/tooltip';
 import { PureComponent } from 'react';
 import { defineMessages, injectIntl } from 'react-intl-next';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
-import { linkToolbarMessages as linkToolbarCommonMessages } from '../../../../messages';
+import { linkToolbarMessages as linkToolbarCommonMessages } from '@atlaskit/editor-common/messages';
 import PanelTextInput from '../../../../ui/PanelTextInput';
 import LinkSearchList from '../../../../ui/LinkSearch/LinkSearchList';
 import { container, containerWithProvider, inputWrapper } from '../../../../ui/LinkSearch/ToolbarComponents';
@@ -21,12 +21,12 @@ import { normalizeUrl } from '@atlaskit/editor-common/utils';
 import { filterUniqueItems } from '../../../../utils/array';
 import debounce from 'lodash/debounce';
 import { mapContentTypeToIcon, sha1, wordCount } from './utils';
-import { hideLinkToolbar } from '../../commands';
-import { hideLinkToolbar as cardHideLinkToolbar } from '../../../card/pm-plugins/actions';
+import { hideLinkToolbar, hideLinkToolbarSetMeta } from '../../commands';
 import { visuallyHiddenStyles } from '../../styles';
 import { browser } from '@atlaskit/editor-common/utils';
 import { transformTimeStamp } from '../../../../ui/LinkSearch/transformTimeStamp';
 import Announcer from '../../../../utils/announcer/announcer';
+import { toolbarKey } from '../../pm-plugins/toolbar-buttons';
 export const RECENT_SEARCH_LIST_SIZE = 5;
 const clearText = css`
   cursor: pointer;
@@ -434,10 +434,18 @@ export class HyperlinkLinkAddToolbar extends PureComponent {
       const KEY_CODE_ARROW_DOWN = 40;
       const KEY_CODE_ARROW_UP = 38;
       if (keyCode === KEY_CODE_ESCAPE) {
+        var _toolbarKey$getState, _toolbarKey$getState$;
         // escape
         event.preventDefault();
-        hideLinkToolbar()(view.state, view.dispatch);
-        view.dispatch(cardHideLinkToolbar(view.state.tr));
+        const {
+          state: {
+            tr
+          },
+          dispatch
+        } = view;
+        hideLinkToolbarSetMeta(tr);
+        (_toolbarKey$getState = toolbarKey.getState(view.state)) === null || _toolbarKey$getState === void 0 ? void 0 : (_toolbarKey$getState$ = _toolbarKey$getState.onEscapeCallback) === null || _toolbarKey$getState$ === void 0 ? void 0 : _toolbarKey$getState$.call(_toolbarKey$getState, tr);
+        dispatch(tr);
         return;
       }
       if (!items || !items.length) {

package/dist/es2019/plugins/media/index.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { PluginKey, NodeSelection } from 'prosemirror-state';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { media, mediaGroup, mediaSingle, mediaSingleWithCaption, mediaInline } from '@atlaskit/adf-schema';
+import { media, mediaGroup, mediaInline, mediaSingleSpec } from '@atlaskit/adf-schema';
 import { stateKey as pluginKey, createPlugin } from './pm-plugins/main';
 import { getMediaFeatureFlag } from '@atlaskit/media-common';
 import { createPlugin as createMediaAltTextPlugin } from './pm-plugins/alt-text';
@@ -22,6 +22,7 @@ import { messages } from '../insert-block/ui/ToolbarInsertBlock/messages';
 import { ReactMediaNode } from './nodeviews/mediaNodeView';
 import { ReactMediaInlineNode } from './nodeviews/mediaInline';
 import { stateKey } from './pm-plugins/plugin-key';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 export { insertMediaSingleNode } from './utils/media-single';
 const mediaPlugin = (options = {}, api) => {
   var _api$dependencies, _api$dependencies$fea;
@@ -42,7 +43,14 @@ const mediaPlugin = (options = {}, api) => {
       } = options || {};
       const captions = getMediaFeatureFlag('captions', mediaFeatureFlags);
       const allowMediaInline = getMediaFeatureFlag('mediaInline', mediaFeatureFlags);
-      const mediaSingleNode = captions ? mediaSingleWithCaption : mediaSingle;
+      const mediaSingleOption = getBooleanFF('platform.editor.media.extended-resize-experience') ? {
+        withCaption: captions,
+        withExtendedWidthTypes: true
+      } : {
+        withCaption: captions,
+        withExtendedWidthTypes: false
+      };
+      const mediaSingleNode = mediaSingleSpec(mediaSingleOption);
       return [{
         name: 'mediaGroup',
         node: mediaGroup

package/dist/es2019/plugins/media/toolbar/index.js

@@ -15,7 +15,7 @@ import { showLinkingToolbar } from '../commands/linking';
 import { LinkToolbarAppearance } from './linking-toolbar-appearance';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { messages } from '@atlaskit/media-ui';
-import { messages as cardMessages } from '../../card/messages';
+import { cardMessages } from '@atlaskit/editor-common/messages';
 import { FilePreviewItem } from './filePreviewItem';
 import { downloadMedia, removeMediaGroupNode } from './utils';
 import { changeInlineToMediaCard, changeMediaCardToInline, removeInlineCard, setBorderMark, toggleBorderMark } from './commands';

package/dist/es2019/plugins/media/utils/media-common.js

@@ -7,7 +7,7 @@ import { mapSlice } from '../../../utils/slice';
 import { walkUpTreeUntil, removeNestedEmptyEls, unwrap } from '../../../utils/dom';
 import { isImage } from './is-image';
 import { atTheBeginningOfBlock, atTheBeginningOfDoc, atTheEndOfBlock, endPositionOfParent, startPositionOfParent } from '../../../utils/prosemirror/position';
-import { GapCursorSelection } from '../../selection/gap-cursor/selection';
+import { GapCursorSelection } from '@atlaskit/editor-common/selection';
 import { isMediaBlobUrl } from '@atlaskit/media-client';
 export const isMediaBlobUrlFromAttrs = attrs => {
   return !!(attrs && attrs.type === 'external' && isMediaBlobUrl(attrs.url));