@atlaskit/editor-core 172.0.5 → 172.1.0

package/CHANGELOG.md

@@ -1,5 +1,49 @@
 # @atlaskit/editor-core
 
+## 172.1.0
+
+### Minor Changes
+
+- [`0a2a2ff14d9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0a2a2ff14d9) - [ux] ED-15284 Updated shared styles to add margin-top to paragraphs and headings with indentation mark. Prior to this, indented content had different spacing to the rest of the document.
+- [`d7c4506066d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d7c4506066d) - [ux][ed-15295] improve code block copy button label to better indicate to users what will end up in the clipboard when used.
+- [`82d38ab18c1`](https://bitbucket.org/atlassian/atlassian-frontend/commits/82d38ab18c1) - [ux] ED-11600 Fixed - Keyboard composition in code block removes texts
+- [`1c7de731b84`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1c7de731b84) - [ux][ed-15135] Add image and video to keywords of files & images typeahead item
+- [`a7e0b90de6a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a7e0b90de6a) - [ux] ED-15243 fixed page scroll unexpectedly on action item check
+- [`84b5a76c7d5`](https://bitbucket.org/atlassian/atlassian-frontend/commits/84b5a76c7d5) - [ux] Add link settings button to hyperlink and smart card toolbars.
+
+### Patch Changes
+
+- [`a6df7e823d8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a6df7e823d8) - [ux] Fixed trello card overflow issue in table cells & fixed merged table cells selection / hover state
+- [`d3d1dd0a666`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d3d1dd0a666) - Hyperlink: Fix embed option not showing on toolbar after converting smart link to url
+- [`f5f3d1a0db9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f5f3d1a0db9) - Smart Links: Fix edit unresolved link lost link url
+- [`f01b0350e42`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f01b0350e42) - Repaints editor nodes when theme mode changes.
+- [`da7d675ec1e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/da7d675ec1e) - [ux] ED-15363: Preserve leading and trailing whitespaces when pasting plain text into Editor
+- [`bd524db3926`](https://bitbucket.org/atlassian/atlassian-frontend/commits/bd524db3926) - ED-15380 Update fragment prosemirror-schema to match ADF schema
+- [`d28c3de46fe`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d28c3de46fe) - ED-14771 Replaced react-window with react-virtualized
+- [`c64c93a5cab`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c64c93a5cab) - Internal ED-12831 changes to not to log deprecated warnings in prod mode"
+- [`f718a9eb83a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f718a9eb83a) - Fixing usage of diffLines return types in 23-diffing example to be pulled from @types/diff
+- [`c73fb17957a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c73fb17957a) - [ux] ED-10207 When the floating toolbar unmounts or updates, remove any temporary styling that was added to the node via hovering over a floating toolbar button.
+- [`688f1d012a9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/688f1d012a9) - [ux][ed-15181] Fix typeahead not opening when typing really quickly
+- [`d3ae8684731`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d3ae8684731) - [ux] ED-14658 Pressing escape in edit mode when popover open shouldn't cancel changes
+
+  - Moved keydown listener from document to editor element .akEditor to be able to prevent bubbling
+  - Applies to toolbar menus and typeahead, date, emoji picker
+
+- [`9b778e5cd54`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9b778e5cd54) - [ME-2621] Remove legacy code that imposes risks
+- [`cb72385b5f4`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cb72385b5f4) - [ux] Prevented cursor selecting table corner controls
+- [`15c39553e92`](https://bitbucket.org/atlassian/atlassian-frontend/commits/15c39553e92) - [ux] ED-15130: Make tableRenderOptimization flag default enabled to fix table row control heights being incorrect when smart link inlineCards finish rendering
+- [`45b6d35ea96`](https://bitbucket.org/atlassian/atlassian-frontend/commits/45b6d35ea96) - [ME-1327] Added new upload methods to editor mobile bridge to support previews and progress for media cards.
+- [`1bdeac4d8a5`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1bdeac4d8a5) - [ux] ED-13528 Fixed - Unable to exit list with an empty character after cursor
+- [`a75f0f02c24`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a75f0f02c24) - [ux] ED-14683 fix arrow keys in code block unpredictable
+
+  Fixed cursor jumping to expand title when pressing up in a code
+  block in an expand.
+
+- [`e2d54b5e990`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e2d54b5e990) - ED-9738 selection should work when editor is disabled
+- [`1ac9c1f7234`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1ac9c1f7234) - [ux] Fixes analytics not firing and ctrl+z not downgrading a smart link paste when smartLinks.resolveBeforeMacros and featureFlags.smartCards.macro-override are enabled.
+- [`cbc6a5ed686`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cbc6a5ed686) - Fixes a bug where active states for Editor dropdown menus rendered incorrectly
+- Updated dependencies
+
 ## 172.0.5
 
 ### Patch Changes

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

@@ -82,6 +82,8 @@ var _consts = require("./consts");
 
 var _contextIdentifier = require("../plugins/base/pm-plugins/context-identifier");
 
+var _ReactEditorViewContext = _interopRequireDefault(require("./ReactEditorViewContext"));
+
 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; }
@@ -133,6 +135,7 @@ var ReactEditorView = /*#__PURE__*/function (_React$Component) {
 
     (0, _classCallCheck2.default)(this, ReactEditorView);
     _this = _super.call(this, _props, context);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "editorRef", /*#__PURE__*/_react.default.createRef());
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "canDispatchTransactions", true);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onPluginObservation", function (report, editorState) {
       _this.dispatchAnalyticsEvent({
@@ -848,7 +851,12 @@ var ReactEditorView = /*#__PURE__*/function (_React$Component) {
       var renderTracking = (_this$props$editorPro9 = this.props.editorProps.performanceTracking) === null || _this$props$editorPro9 === void 0 ? void 0 : (_this$props$editorPro10 = _this$props$editorPro9.renderTracking) === null || _this$props$editorPro10 === void 0 ? void 0 : _this$props$editorPro10.reactEditorView;
       var renderTrackingEnabled = renderTracking === null || renderTracking === void 0 ? void 0 : renderTracking.enabled;
       var useShallow = renderTracking === null || renderTracking === void 0 ? void 0 : renderTracking.useShallow;
-      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, renderTrackingEnabled && /*#__PURE__*/_react.default.createElement(_RenderTracking.RenderTracking, {
+      return /*#__PURE__*/_react.default.createElement(_ReactEditorViewContext.default.Provider, {
+        value: {
+          editorRef: this.editorRef,
+          editorView: this.view
+        }
+      }, renderTrackingEnabled && /*#__PURE__*/_react.default.createElement(_RenderTracking.RenderTracking, {
         componentProps: this.props,
         action: _analytics.ACTION.RE_RENDERED,
         actionSubject: _analytics.ACTION_SUBJECT.REACT_EDITOR_VIEW,
@@ -860,7 +868,8 @@ var ReactEditorView = /*#__PURE__*/function (_React$Component) {
         config: this.config,
         eventDispatcher: this.eventDispatcher,
         transformer: this.contentTransformer,
-        dispatchAnalyticsEvent: this.dispatchAnalyticsEvent
+        dispatchAnalyticsEvent: this.dispatchAnalyticsEvent,
+        editorRef: this.editorRef
       }) : this.editor);
     }
   }]);

package/dist/cjs/create-editor/ReactEditorViewContext.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var ReactEditorViewContext = /*#__PURE__*/_react.default.createContext({});
+
+var _default = ReactEditorViewContext;
+exports.default = _default;

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

@@ -118,7 +118,8 @@ function getDefaultPresetOptionsFromEditorProps(props, createAnalyticsEvent) {
     cardOptions: cardOptions,
     hyperlinkOptions: {
       linkPicker: (_props$linking2 = props.linking) === null || _props$linking2 === void 0 ? void 0 : _props$linking2.linkPicker,
-      cardOptions: cardOptions
+      cardOptions: cardOptions,
+      platform: isMobile ? 'mobile' : 'web'
     },
     codeBlock: _objectSpread(_objectSpread({}, props.codeBlock), {}, {
       useLongPressSelection: false,

package/dist/cjs/editor.js

@@ -439,6 +439,10 @@ var Editor = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "deprecationWarnings",
     value: function deprecationWarnings(props) {
+      if (process.env.NODE_ENV === 'production') {
+        return;
+      }
+
       var nextVersion = (0, _versionWrapper.nextMajorVersion)();
       var deprecatedProperties = {
         allowTasksAndDecisions: {
@@ -608,10 +612,12 @@ var Editor = /*#__PURE__*/function (_React$Component) {
                       view = _ref3.view,
                       eventDispatcher = _ref3.eventDispatcher,
                       config = _ref3.config,
-                      dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent;
+                      dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent,
+                      editorRef = _ref3.editorRef;
                   return (0, _react2.jsx)(_ui.BaseTheme, {
                     baseFontSize: _this5.getBaseFontSize()
                   }, (0, _react2.jsx)(Component, {
+                    innerRef: editorRef,
                     appearance: _this5.props.appearance,
                     disabled: _this5.props.disabled,
                     editorActions: _this5.editorActions,

package/dist/cjs/labs/next/mobile.js

@@ -30,14 +30,16 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function MobileEditor(props) {
   var maxHeight = props.maxHeight,
-      createAnalyticsEvent = props.createAnalyticsEvent;
+      createAnalyticsEvent = props.createAnalyticsEvent,
+      disabled = props.disabled;
   var handleAnalyticsEvent = (0, _useAnalytics.useCreateAnalyticsHandler)(createAnalyticsEvent);
   var renderWithConfig = (0, _react.useCallback)(function (config) {
     return /*#__PURE__*/_react.default.createElement(_Mobile.MobileAppearance, {
       editorView: config && config.editorView,
-      maxHeight: maxHeight
+      maxHeight: maxHeight,
+      editorDisabled: disabled
     }, /*#__PURE__*/_react.default.createElement(_Editor.EditorContent, null));
-  }, [maxHeight]);
+  }, [maxHeight, disabled]);
   return /*#__PURE__*/_react.default.createElement(_contextAdapter.ContextAdapter, null, /*#__PURE__*/_react.default.createElement(_Editor.Editor, (0, _extends2.default)({}, props, {
     onAnalyticsEvent: handleAnalyticsEvent
   }), /*#__PURE__*/_react.default.createElement(_Editor.EditorSharedConfigConsumer, null, renderWithConfig)));

package/dist/cjs/messages.js

@@ -78,6 +78,11 @@ var linkToolbarMessages = (0, _reactIntlNext.defineMessages)({
     id: 'fabric.editor.emptyLink',
     defaultMessage: 'Please enter a link.',
     description: 'Please enter a link.'
+  },
+  settingsLink: {
+    id: 'fabric.editor.settingsLinks',
+    defaultMessage: 'Go to Link Preferences',
+    description: 'Go to Link Preferences'
   }
 });
 exports.linkToolbarMessages = linkToolbarMessages;

package/dist/cjs/plugins/analytics/types/enums.js

@@ -321,6 +321,7 @@ exports.ACTION_SUBJECT_ID = ACTION_SUBJECT_ID;
   ACTION_SUBJECT_ID["EDIT_LINK"] = "editLink";
   ACTION_SUBJECT_ID["UNLINK"] = "unlink";
   ACTION_SUBJECT_ID["OPEN_LINK"] = "openLink";
+  ACTION_SUBJECT_ID["GOTO_SMART_LINK_SETTINGS"] = "goToSmartLinkSettings";
   ACTION_SUBJECT_ID["EMBEDS"] = "embeds";
   ACTION_SUBJECT_ID["HYPERLINK"] = "hyperlink";
 })(ACTION_SUBJECT_ID || (exports.ACTION_SUBJECT_ID = ACTION_SUBJECT_ID = {}));

package/dist/cjs/plugins/block-type/ui/ToolbarBlockType/styled.js

@@ -23,7 +23,7 @@ var _templateObject, _templateObject2, _templateObject3;
 
 var blockTypeMenuItemStyle = function blockTypeMenuItemStyle(tagName, selected) {
   // TEMP FIX: See https://product-fabric.atlassian.net/browse/ED-13878
-  var selectedStyle = selected ? "".concat(tagName, " { color: ").concat((0, _tokens.token)('color.text.inverse', 'white'), " !important; }") : '';
+  var selectedStyle = selected ? "".concat(tagName, " { color: ").concat((0, _tokens.token)('color.text', 'white'), " !important; }") : '';
   return function (themeProps) {
     return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    ", ";\n    > {\n      h1,\n      h2,\n      h3,\n      h4,\n      h5,\n      h6 {\n        margin-top: 0;\n      }\n    }\n    ", ";\n  "])), (0, _styles.headingsSharedStyles)(themeProps), selectedStyle);
   };

package/dist/cjs/plugins/card/nodeviews/inlineCard.js

@@ -77,6 +77,13 @@ var InlineCardComponent = /*#__PURE__*/function (_React$PureComponent) {
         })(view.state.tr));
       })();
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onError", function (data) {
+      var url = data.url;
+
+      _this.onResolve({
+        url: url
+      });
+    });
     return _this;
   }
 
@@ -108,6 +115,7 @@ var InlineCardComponent = /*#__PURE__*/function (_React$PureComponent) {
         onClick: this.onClick,
         container: this.scrollContainer,
         onResolve: this.onResolve,
+        onError: this.onError,
         inlinePreloaderStyle: useAlternativePreloader ? 'on-right-without-skeleton' : undefined
       })); // [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

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

@@ -5,9 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.handleFallbackWithAnalytics = exports.convertHyperlinkToSmartCard = exports.changeSelectedCardToText = exports.changeSelectedCardToLinkFallback = exports.changeSelectedCardToLink = void 0;
-exports.insertCard = insertCard;
-exports.updateCard = exports.setSelectedCardAppearance = exports.replaceQueuedUrlWithCard = exports.queueCardsFromChangedTr = void 0;
+exports.updateCard = exports.setSelectedCardAppearance = exports.replaceQueuedUrlWithCard = exports.queueCardsFromChangedTr = exports.handleFallbackWithAnalytics = exports.convertHyperlinkToSmartCard = exports.changeSelectedCardToText = exports.changeSelectedCardToLinkFallback = exports.changeSelectedCardToLink = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
@@ -15,8 +13,6 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 
 var _prosemirrorState = require("prosemirror-state");
 
-var _prosemirrorModel = require("prosemirror-model");
-
 var _prosemirrorHistory = require("prosemirror-history");
 
 var _pluginKey = require("./plugin-key");
@@ -47,24 +43,10 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 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; }
 
-function insertCard(tr, cardAdf, schema) {
-  var inlineCard = schema.nodes.inlineCard; // ED-5638: add an extra space after inline cards to avoid re-rendering them
-
-  var nodes = [cardAdf];
-
-  if (cardAdf.type === inlineCard) {
-    nodes.push(schema.text(' '));
-  }
-
-  return tr.replaceSelection(new _prosemirrorModel.Slice(_prosemirrorModel.Fragment.fromArray(nodes), 0, 0));
-}
 /**
  * Attempt to replace the link into the respective card.
  */
-
-
 function replaceLinksToCards(tr, cardAdf, schema, request) {
-  var inlineCard = schema.nodes.inlineCard;
   var url = request.url;
 
   if (!(0, _adfSchema.isSafeUrl)(url)) {
@@ -84,15 +66,9 @@ function replaceLinksToCards(tr, cardAdf, schema, request) {
 
   if (!replaceLink) {
     return;
-  } // ED-5638: add an extra space after inline cards to avoid re-rendering them
-
-
-  var nodes = [cardAdf];
-
-  if (cardAdf.type === inlineCard) {
-    nodes.push(schema.text(' '));
   }
 
+  var nodes = [cardAdf];
   tr.replaceWith(pos, pos + (node.text || url).length, nodes);
   return $pos.node($pos.depth - 1).type.name;
 }

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

@@ -7,12 +7,12 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.visitCardLink = exports.removeCard = exports.floatingToolbar = void 0;
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+exports.visitCardLink = exports.removeCard = exports.openLinkSettings = exports.floatingToolbar = void 0;
 
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _react = _interopRequireDefault(require("react"));
 
 var _prosemirrorState = require("prosemirror-state");
@@ -23,6 +23,8 @@ var _remove = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/remove
 
 var _unlink = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/unlink"));
 
+var _settings = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/settings"));
+
 var _shortcut = _interopRequireDefault(require("@atlaskit/icon/glyph/shortcut"));
 
 var _analytics = require("../analytics");
@@ -55,6 +57,8 @@ var _styles2 = require("./styles");
 
 var _toolbar = require("../copy-button/toolbar");
 
+var _featureFlagsContext = require("../feature-flags-context");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -112,6 +116,76 @@ var visitCardLink = function visitCardLink(state, dispatch) {
 
 exports.visitCardLink = visitCardLink;
 
+var openLinkSettings = function openLinkSettings(state, dispatch) {
+  if (!(state.selection instanceof _prosemirrorState.NodeSelection)) {
+    return false;
+  }
+
+  window.open('https://id.atlassian.com/manage-profile/link-preferences');
+
+  if (dispatch) {
+    var type = state.selection.node.type;
+    dispatch((0, _analytics.addAnalytics)(state, state.tr, (0, _linkingUtils.buildOpenedSettingsPayload)(type.name)));
+  }
+
+  return true;
+};
+
+exports.openLinkSettings = openLinkSettings;
+
+var floatingToolbar = function floatingToolbar(cardOptions, platform, linkPickerOptions) {
+  return function (state, intl, providerFactory) {
+    var _state$schema$nodes = state.schema.nodes,
+        inlineCard = _state$schema$nodes.inlineCard,
+        blockCard = _state$schema$nodes.blockCard,
+        embedCard = _state$schema$nodes.embedCard;
+    var nodeType = [inlineCard, blockCard, embedCard];
+
+    var pluginState = _main.pluginKey.getState(state);
+
+    if (!(state.selection instanceof _prosemirrorState.NodeSelection)) {
+      return;
+    }
+
+    var selectedNode = state.selection.node;
+
+    if (!selectedNode) {
+      return;
+    }
+
+    var isEmbedCard = (0, _utils.appearanceForNodeType)(selectedNode.type) === 'embed';
+    /* add an offset to embeds due to extra padding */
+
+    var toolbarOffset = isEmbedCard ? {
+      offset: [0, 24]
+    } : {}; // Applies padding override for when link picker is currently displayed
+
+    var className = pluginState.showLinkingToolbar ? _styles2.FLOATING_TOOLBAR_LINKPICKER_CLASSNAME : undefined;
+    return _objectSpread(_objectSpread({
+      title: intl.formatMessage(_messages2.messages.card),
+      className: className,
+      nodeType: nodeType
+    }, toolbarOffset), {}, {
+      getDomRef: function getDomRef(view) {
+        var element = (0, _prosemirrorUtils.findDomRefAtPos)(view.state.selection.from, view.domAtPos.bind(view));
+
+        if (!element) {
+          return undefined;
+        }
+
+        if (isEmbedCard) {
+          return element.querySelector(".".concat(_styles.richMediaClassName));
+        }
+
+        return element;
+      },
+      items: generateToolbarItems(state, intl, providerFactory, cardOptions, platform, linkPickerOptions)
+    }, pluginState.showLinkingToolbar ? _EditLinkToolbar.editLinkToolbarConfig : {});
+  };
+};
+
+exports.floatingToolbar = floatingToolbar;
+
 var unlinkCard = function unlinkCard(node, state) {
   var displayInfo = (0, _utils.displayInfoForCard)(node, (0, _utils.findCardInfo)(state));
   var text = displayInfo.title || displayInfo.url;
@@ -129,40 +203,6 @@ var buildAlignmentOptions = function buildAlignmentOptions(state, intl) {
   return (0, _MediaAndEmbedsToolbar.default)(state, intl, state.schema.nodes.embedCard, true, true);
 };
 
-var generateDeleteButton = function generateDeleteButton(node, state, intl) {
-  var inlineCard = state.schema.nodes.inlineCard;
-  var removeButton = {
-    id: 'editor.link.delete',
-    type: 'button',
-    appearance: 'danger',
-    icon: _remove.default,
-    onMouseEnter: (0, _decoration.hoverDecoration)(node.type, true),
-    onMouseLeave: (0, _decoration.hoverDecoration)(node.type, false),
-    onFocus: (0, _decoration.hoverDecoration)(node.type, true),
-    onBlur: (0, _decoration.hoverDecoration)(node.type, false),
-    title: intl.formatMessage(_messages.default.remove),
-    onClick: removeCard
-  };
-  var copyButton = (0, _toConsumableArray2.default)(state && (0, _toolbar.showCopyButton)(state) ? [(0, _toolbar.getCopyButtonConfig)(state, intl.formatMessage, node.type), {
-    type: 'separator'
-  }] : []);
-
-  if (node.type === inlineCard) {
-    var unlinkButtonWithSeparator = [{
-      id: 'editor.link.unlink',
-      type: 'button',
-      title: intl.formatMessage(_messages.linkToolbarMessages.unlink),
-      icon: _unlink.default,
-      onClick: unlinkCard(node, state)
-    }, {
-      type: 'separator'
-    }];
-    return [].concat(unlinkButtonWithSeparator, (0, _toConsumableArray2.default)(copyButton), [removeButton]);
-  }
-
-  return [].concat((0, _toConsumableArray2.default)(copyButton), [removeButton]);
-};
-
 var generateToolbarItems = function generateToolbarItems(state, intl, providerFactory, cardOptions, platform, linkPicker) {
   return function (node) {
     var _titleUrlPairFromNode2 = (0, _utils.titleUrlPairFromNode)(node),
@@ -194,6 +234,7 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
         node: node
       })];
     } else {
+      var inlineCard = state.schema.nodes.inlineCard;
       var toolbarItems = [{
         id: 'editor.link.edit',
         type: 'button',
@@ -215,7 +256,18 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
         onClick: visitCardLink
       }, {
         type: 'separator'
-      }].concat((0, _toConsumableArray2.default)(generateDeleteButton(node, state, intl)));
+      }].concat((0, _toConsumableArray2.default)(getUnlinkButtonGroup(state, intl, node, inlineCard)), (0, _toConsumableArray2.default)(getCopyButtonGroup(state, intl, node)), (0, _toConsumableArray2.default)(getSettingsButtonGroup(state, intl)), [{
+        id: 'editor.link.delete',
+        type: 'button',
+        appearance: 'danger',
+        icon: _remove.default,
+        onMouseEnter: (0, _decoration.hoverDecoration)(node.type, true),
+        onMouseLeave: (0, _decoration.hoverDecoration)(node.type, false),
+        onFocus: (0, _decoration.hoverDecoration)(node.type, true),
+        onBlur: (0, _decoration.hoverDecoration)(node.type, false),
+        title: intl.formatMessage(_messages.default.remove),
+        onClick: removeCard
+      }]);
 
       if (currentAppearance === 'embed') {
         var alignmentOptions = buildAlignmentOptions(state, intl);
@@ -258,55 +310,35 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
   };
 };
 
-var floatingToolbar = function floatingToolbar(cardOptions, platform, linkPickerOptions) {
-  return function (state, intl, providerFactory) {
-    var _state$schema$nodes = state.schema.nodes,
-        inlineCard = _state$schema$nodes.inlineCard,
-        blockCard = _state$schema$nodes.blockCard,
-        embedCard = _state$schema$nodes.embedCard;
-    var nodeType = [inlineCard, blockCard, embedCard];
-
-    var pluginState = _main.pluginKey.getState(state);
-
-    if (!(state.selection instanceof _prosemirrorState.NodeSelection)) {
-      return;
-    }
-
-    var selectedNode = state.selection.node;
-
-    if (!selectedNode) {
-      return;
-    }
-
-    var isEmbedCard = (0, _utils.appearanceForNodeType)(selectedNode.type) === 'embed';
-    /* add an offset to embeds due to extra padding */
-
-    var toolbarOffset = isEmbedCard ? {
-      offset: [0, 24]
-    } : {}; // Applies padding override for when link picker is currently displayed
-
-    var className = pluginState.showLinkingToolbar ? _styles2.FLOATING_TOOLBAR_LINKPICKER_CLASSNAME : undefined;
-    return _objectSpread(_objectSpread({
-      title: intl.formatMessage(_messages2.messages.card),
-      className: className,
-      nodeType: nodeType
-    }, toolbarOffset), {}, {
-      getDomRef: function getDomRef(view) {
-        var element = (0, _prosemirrorUtils.findDomRefAtPos)(view.state.selection.from, view.domAtPos.bind(view));
-
-        if (!element) {
-          return undefined;
-        }
+var getUnlinkButtonGroup = function getUnlinkButtonGroup(state, intl, node, inlineCard) {
+  return node.type === inlineCard ? [{
+    id: 'editor.link.unlink',
+    type: 'button',
+    title: intl.formatMessage(_messages.linkToolbarMessages.unlink),
+    icon: _unlink.default,
+    onClick: unlinkCard(node, state)
+  }, {
+    type: 'separator'
+  }] : [];
+};
 
-        if (isEmbedCard) {
-          return element.querySelector(".".concat(_styles.richMediaClassName));
-        }
+var getSettingsButtonGroup = function getSettingsButtonGroup(state, intl) {
+  var _getFeatureFlags = (0, _featureFlagsContext.getFeatureFlags)(state),
+      floatingToolbarLinkSettingsButton = _getFeatureFlags.floatingToolbarLinkSettingsButton;
 
-        return element;
-      },
-      items: generateToolbarItems(state, intl, providerFactory, cardOptions, platform, linkPickerOptions)
-    }, pluginState.showLinkingToolbar ? _EditLinkToolbar.editLinkToolbarConfig : {});
-  };
+  return floatingToolbarLinkSettingsButton === 'true' ? [{
+    id: 'editor.link.settings',
+    type: 'button',
+    icon: _settings.default,
+    title: intl.formatMessage(_messages.linkToolbarMessages.settingsLink),
+    onClick: openLinkSettings
+  }, {
+    type: 'separator'
+  }] : [];
 };
 
-exports.floatingToolbar = floatingToolbar;
+var getCopyButtonGroup = function getCopyButtonGroup(state, intl, node) {
+  return state && (0, _toolbar.showCopyButton)(state) ? [(0, _toolbar.getCopyButtonConfig)(state, intl.formatMessage, node.type), {
+    type: 'separator'
+  }] : [];
+};

package/dist/cjs/plugins/code-block/nodeviews/code-block.js

@@ -33,6 +33,9 @@ var toDOM = function toDOM(node) {
   return ['div', {
     class: 'code-block'
   }, ['div', {
+    class: _classNames.codeBlockClassNames.start,
+    contenteditable: 'false'
+  }], ['div', {
     class: _classNames.codeBlockClassNames.gutter,
     contenteditable: 'false'
   }], ['div', {
@@ -40,8 +43,12 @@ var toDOM = function toDOM(node) {
   }, ['code', {
     'data-language': node.attrs.language || '',
     spellcheck: 'false',
-    contenteditable: 'true'
-  }, 0]]];
+    contenteditable: 'true',
+    'data-testid': 'code-block--code'
+  }, 0]], ['div', {
+    class: _classNames.codeBlockClassNames.end,
+    contenteditable: 'false'
+  }]];
 };
 
 var CodeBlockView = /*#__PURE__*/function () {

package/dist/cjs/plugins/code-block/pm-plugins/ide-ux.js

@@ -27,13 +27,49 @@ var _lineHandling = require("../ide-ux/line-handling");
 
 var _commands2 = require("../ide-ux/commands");
 
+var codeBlockIDEKeyBindingsKey = new _prosemirrorState.PluginKey('codeBlockIDEKeyBindings');
+
 var _default = new _safePlugin.SafePlugin({
+  key: codeBlockIDEKeyBindingsKey,
+  state: {
+    init: function init() {
+      return {
+        isComposing: false
+      };
+    },
+    apply: function apply(tr, value) {
+      var isComposing = tr.getMeta(codeBlockIDEKeyBindingsKey);
+
+      if (typeof isComposing === 'undefined') {
+        return value;
+      }
+
+      return {
+        isComposing: isComposing
+      };
+    }
+  },
   props: {
+    handleDOMEvents: {
+      compositionstart: function compositionstart(view, event) {
+        var tr = view.state.tr;
+        tr.setMeta(codeBlockIDEKeyBindingsKey, true);
+        view.dispatch(tr);
+        return false;
+      },
+      compositionend: function compositionend(view, event) {
+        var tr = view.state.tr;
+        tr.setMeta(codeBlockIDEKeyBindingsKey, false);
+        view.dispatch(tr);
+        return false;
+      }
+    },
     handleTextInput: function handleTextInput(view, from, to, text) {
       var state = view.state,
           dispatch = view.dispatch;
+      var isComposing = codeBlockIDEKeyBindingsKey.getState(state).isComposing;
 
-      if ((0, _lineHandling.isCursorInsideCodeBlock)(state)) {
+      if ((0, _lineHandling.isCursorInsideCodeBlock)(state) && !isComposing) {
         var beforeText = (0, _lineHandling.getStartOfCurrentLine)(state).text;
         var afterText = (0, _lineHandling.getEndOfCurrentLine)(state).text; // If text is a closing bracket/quote and we've already inserted it, move the selection after
 

package/dist/cjs/plugins/code-block/toolbar.js

@@ -19,6 +19,8 @@ var _actions = require("./actions");
 
 var _messages = _interopRequireDefault(require("../../messages"));
 
+var _messages2 = require("@atlaskit/editor-common/messages");
+
 var _codeBlockCopySelectionPlugin = require("./pm-plugins/codeBlockCopySelectionPlugin");
 
 var _decoration = require("../base/pm-plugins/decoration");
@@ -96,7 +98,7 @@ var getToolbarConfig = function getToolbarConfig() {
       // note: copyContentToClipboard contains logic that also removes the
       // visual feedback for the copy button
       onClick: _actions.copyContentToClipboard,
-      title: formatMessage(codeBlockState.contentCopied ? _messages.default.copiedToClipboard : _messages.default.copyToClipboard),
+      title: formatMessage(codeBlockState.contentCopied ? _messages2.codeBlockCopyButtonMessages.copiedCodeToClipboard : _messages2.codeBlockCopyButtonMessages.copyCodeToClipboard),
       onMouseEnter: _codeBlockCopySelectionPlugin.provideVisualFeedbackForCopyButton,
       // note: resetCopiedState contains logic that also removes the
       // visual feedback for the copy button

package/dist/cjs/plugins/code-block/ui/class-names.js

@@ -8,6 +8,8 @@ exports.codeBlockClassNames = void 0;
 var _styles = require("@atlaskit/editor-common/styles");
 
 var codeBlockClassNames = {
+  start: _styles.CodeBlockSharedCssClassName.CODEBLOCK_START,
+  end: _styles.CodeBlockSharedCssClassName.CODEBLOCK_END,
   gutter: _styles.CodeBlockSharedCssClassName.CODEBLOCK_LINE_NUMBER_GUTTER,
   content: _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT
 };