@atlaskit/editor-plugin-code-block-advanced 1.0.2 → 1.0.3

package/dist/es2019/nodeviews/extensions/prosemirrorDecorations.js

@@ -0,0 +1,107 @@
+import { ViewPlugin, WidgetType, Decoration as CodeMirrorDecoration } from '@codemirror/view';
+class PMWidget extends WidgetType {
+  constructor(toDOMElement) {
+    super();
+    this.toDOMElement = toDOMElement;
+  }
+  toDOM() {
+    return this.toDOMElement;
+  }
+  ignoreEvent() {
+    return false;
+  }
+}
+
+// This type is not exposed publically by ProseMirror but we need it to map to CodeMirror
+// See: https://github.com/ProseMirror/prosemirror-view/blob/master/src/decoration.ts
+
+// This type is not exposed publically by ProseMirror but we need it to map to CodeMirror
+// See: https://github.com/ProseMirror/prosemirror-view/blob/master/src/decoration.ts
+
+// This type is not exposed publically by ProseMirror but we need it to map to CodeMirror
+// See: https://github.com/ProseMirror/prosemirror-view/blob/master/src/decoration.ts
+function isExtendedDecoration(decoration) {
+  return decoration.inline !== undefined && decoration.widget !== undefined && decoration.type !== undefined;
+}
+const getHTMLElement = (toDOM, view, getPos) => {
+  if (toDOM instanceof Function) {
+    const element = toDOM(view, getPos);
+    return element instanceof HTMLElement ? element : undefined;
+  } else if (toDOM instanceof HTMLElement) {
+    return toDOM;
+  }
+};
+const mapPMDecorationToCMDecoration = (decoration, view, getPos) => {
+  if (!isExtendedDecoration(decoration)) {
+    return undefined;
+  }
+  if (decoration.inline) {
+    const markDecoration = CodeMirrorDecoration.mark({
+      attributes: decoration.type.attrs
+    });
+    return markDecoration.range(decoration.from, decoration.to);
+  } else if (decoration.widget) {
+    var _decoration$type;
+    const toDOM = getHTMLElement(decoration === null || decoration === void 0 ? void 0 : (_decoration$type = decoration.type) === null || _decoration$type === void 0 ? void 0 : _decoration$type.toDOM, view, getPos);
+    if (!toDOM) {
+      return undefined;
+    }
+    const widgetDecoration = CodeMirrorDecoration.widget({
+      widget: new PMWidget(toDOM),
+      side: decoration.type.side
+    });
+    return widgetDecoration.range(decoration.from, decoration.to);
+  }
+};
+function isDefined(value) {
+  return value !== undefined;
+}
+
+/**
+ * Creates CodeMirror versions of the decorations provided by ProseMirror.
+ *
+ * Inline ProseMirror decorations -> Mark CodeMirror decorations
+ * Widget ProseMirror decorations -> Widget CodeMirror decorations
+ *
+ * This way any decorations applied in ProseMirror land should automatically be supported
+ * by the CodeMirror editor
+ *
+ * @param updateDecorationsEffect Facet for the prosemirror decorations
+ * @returns CodeMirror extension
+ */
+export const prosemirrorDecorationPlugin = (updateDecorationsEffect, editorView, getPos) => ViewPlugin.fromClass(class {
+  constructor(view) {
+    this.decorations = this.updateDecorations(view);
+  }
+  updateDecorations(view) {
+    const {
+      from,
+      to
+    } = view.viewport;
+    const innnerDecorations = view.state.facet(updateDecorationsEffect);
+    const allDecorations = [];
+    innnerDecorations === null || innnerDecorations === void 0 ? void 0 : innnerDecorations.map(source => {
+      // Temporary: this only exists on prosemirror-view@1.34.0. Since post-office is lower it causes an error.
+      // Once we do our prosemirror bump (very soon) we should remove this.
+      // https://product-fabric.atlassian.net/browse/ED-26398
+      // @ts-ignore
+      source === null || source === void 0 ? void 0 : source.forEachSet(set => {
+        const decorations = set.find(from, to)
+        // Do not render the code block line decorations
+        // Temporary: this only exists on prosemirror-view@1.34.0. Since post-office is lower it causes an error.
+        // Once we do our prosemirror bump (very soon) we should remove this.
+        // https://product-fabric.atlassian.net/browse/ED-26398
+        // @ts-ignore
+        .filter(dec => dec.spec.type !== 'decorationWidgetType');
+        allDecorations.push(...decorations);
+      });
+    });
+    const cmDecorations = allDecorations.sort((a, b) => a.from < b.from ? -1 : 1).map(decoration => mapPMDecorationToCMDecoration(decoration, editorView, getPos)).filter(isDefined);
+    return CodeMirrorDecoration.set(cmDecorations);
+  }
+  update(update) {
+    this.decorations = this.updateDecorations(update.view);
+  }
+}, {
+  decorations: v => v.decorations
+});

package/dist/esm/nodeviews/codeBlockAdvanced.js

@@ -4,7 +4,7 @@ import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { closeBrackets } from '@codemirror/autocomplete';
 import { syntaxHighlighting, bracketMatching } from '@codemirror/language';
-import { Compartment, EditorSelection } from '@codemirror/state';
+import { Compartment, EditorSelection, Facet } from '@codemirror/state';
 import { EditorView as CodeMirror, lineNumbers, gutters } from '@codemirror/view';
 import { isCodeBlockWordWrapEnabled } from '@atlaskit/editor-common/code-block';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
@@ -12,13 +12,12 @@ import { highlightStyle } from '../ui/syntaxHighlightingTheme';
 import { cmTheme } from '../ui/theme';
 import { syncCMWithPM } from './codemirrorSync/syncCMWithPM';
 import { updateCMSelection } from './codemirrorSync/updateCMSelection';
-import { bidiCharWarningExtension } from './extensions/bidiCharWarning';
-import { copyButtonDecorations } from './extensions/copyButtonDecorations';
 import { keymapExtension } from './extensions/keymap';
+import { manageSelectionMarker } from './extensions/manageSelectionMarker';
+import { prosemirrorDecorationPlugin } from './extensions/prosemirrorDecorations';
 import { LanguageLoader } from './languages/loader';
 // Based on: https://prosemirror.net/examples/codemirror/
 var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
-  // eslint-disable-next-line @typescript-eslint/max-params
   function CodeBlockAdvancedNodeView(node, view, getPos, config) {
     var _config$api,
       _this = this,
@@ -28,8 +27,9 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
     _defineProperty(this, "lineWrappingCompartment", new Compartment());
     _defineProperty(this, "languageCompartment", new Compartment());
     _defineProperty(this, "readOnlyCompartment", new Compartment());
-    _defineProperty(this, "copyDecoCompartment", new Compartment());
+    _defineProperty(this, "pmDecorationsCompartment", new Compartment());
     _defineProperty(this, "maybeTryingToReachNodeSelection", false);
+    _defineProperty(this, "pmFacet", Facet.define());
     _defineProperty(this, "wordWrappingEnabled", false);
     this.node = node;
     this.view = view;
@@ -44,13 +44,6 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
     this.cleanupDisabledState = (_config$api2 = config.api) === null || _config$api2 === void 0 || (_config$api2 = _config$api2.editorDisabled) === null || _config$api2 === void 0 ? void 0 : _config$api2.sharedState.onChange(function () {
       _this.updateReadonlyState();
     });
-    this.cleanupCopyButtonDecoration = (_config$api3 = config.api) === null || _config$api3 === void 0 || (_config$api3 = _config$api3.codeBlock) === null || _config$api3 === void 0 ? void 0 : _config$api3.sharedState.onChange(function (_ref) {
-      var nextSharedState = _ref.nextSharedState,
-        prevSharedState = _ref.prevSharedState;
-      if ((nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.copyButtonHoverNode) !== (prevSharedState === null || prevSharedState === void 0 ? void 0 : prevSharedState.copyButtonHoverNode)) {
-        _this.addCopyButtonDecoration(nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.copyButtonHoverNode);
-      }
-    });
     this.languageLoader = new LanguageLoader(function (lang) {
       _this.updating = true;
       _this.cm.dispatch({
@@ -60,12 +53,13 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
     });
     this.cm = new CodeMirror({
       doc: this.node.textContent,
-      extensions: [].concat(_toConsumableArray(config.extensions), [this.lineWrappingCompartment.of([]), this.languageCompartment.of([]), this.copyDecoCompartment.of([]), keymapExtension({
+      extensions: [].concat(_toConsumableArray(config.extensions), [this.lineWrappingCompartment.of([]), this.languageCompartment.of([]), this.pmDecorationsCompartment.of([]), keymapExtension({
         view: view,
         getPos: getPos,
         getNode: getNode,
         selectCodeBlockNode: this.selectCodeBlockNode.bind(this),
-        onMaybeNodeSelection: onMaybeNodeSelection
+        onMaybeNodeSelection: onMaybeNodeSelection,
+        customFindReplace: Boolean((_config$api3 = config.api) === null || _config$api3 === void 0 ? void 0 : _config$api3.findReplace)
       }), cmTheme, syntaxHighlighting(highlightStyle), bracketMatching(), lineNumbers(),
       // Explicitly disable "sticky" positioning on line numbers to match
       // Renderer behaviour
@@ -75,7 +69,7 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
         return _this.forwardUpdate(update);
       }), this.readOnlyCompartment.of(CodeMirror.editable.of(this.view.editable)), closeBrackets(), CodeMirror.editorAttributes.of({
         class: 'code-block'
-      }), bidiCharWarningExtension])
+      }), manageSelectionMarker(config.api), prosemirrorDecorationPlugin(this.pmFacet, view, getPos)])
     });
 
     // The editor's outer node is our DOM representation
@@ -89,9 +83,8 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
   return _createClass(CodeBlockAdvancedNodeView, [{
     key: "destroy",
     value: function destroy() {
-      var _this$cleanupDisabled, _this$cleanupCopyButt;
+      var _this$cleanupDisabled;
       (_this$cleanupDisabled = this.cleanupDisabledState) === null || _this$cleanupDisabled === void 0 || _this$cleanupDisabled.call(this);
-      (_this$cleanupCopyButt = this.cleanupCopyButtonDecoration) === null || _this$cleanupCopyButt === void 0 || _this$cleanupCopyButt.call(this);
     }
   }, {
     key: "forwardUpdate",
@@ -148,15 +141,6 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
         this.view.dispatch(tr);
       }
     }
-  }, {
-    key: "addCopyButtonDecoration",
-    value: function addCopyButtonDecoration(node) {
-      this.updating = true;
-      this.cm.dispatch({
-        effects: [this.copyDecoCompartment.reconfigure(node && node === this.node ? copyButtonDecorations : [])]
-      });
-      this.updating = false;
-    }
   }, {
     key: "updateWordWrap",
     value: function updateWordWrap(node) {
@@ -171,7 +155,7 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
     }
   }, {
     key: "update",
-    value: function update(node) {
+    value: function update(node, _, innerDecorations) {
       var _this2 = this;
       this.maybeTryingToReachNodeSelection = false;
       if (node.type !== this.node.type) {
@@ -190,8 +174,27 @@ var CodeBlockAdvancedNodeView = /*#__PURE__*/function () {
         _this2.cm.dispatch(tr);
         _this2.updating = false;
       });
+      this.updateProseMirrorDecorations(innerDecorations);
       return true;
     }
+
+    /**
+     * Updates a facet which stores information on the prosemirror decorations
+     *
+     * This then gets translated to codemirror decorations in `prosemirrorDecorationPlugin`
+     */
+  }, {
+    key: "updateProseMirrorDecorations",
+    value: function updateProseMirrorDecorations(decorationSource) {
+      this.updating = true;
+      var computedFacet = this.pmFacet.compute([], function () {
+        return decorationSource;
+      });
+      this.cm.dispatch({
+        effects: this.pmDecorationsCompartment.reconfigure(computedFacet)
+      });
+      this.updating = false;
+    }
   }, {
     key: "stopEvent",
     value: function stopEvent(e) {

package/dist/esm/nodeviews/codemirrorSync/syncCMWithPM.js

@@ -17,7 +17,6 @@ export var syncCMWithPM = function syncCMWithPM(_ref) {
   var pmSel = view.state.selection;
   if (update.docChanged || pmSel.from !== selFrom || pmSel.to !== selTo) {
     var tr = view.state.tr;
-    // eslint-disable-next-line @typescript-eslint/max-params
     update.changes.iterChanges(function (fromA, toA, fromB, toB, text) {
       if (text.length) {
         tr.replaceWith(offset + fromA, offset + toA, view.state.schema.text(text.toString()));

package/dist/esm/nodeviews/extensions/keymap/index.js

@@ -1,6 +1,7 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import { defaultKeymap, indentWithTab } from '@codemirror/commands';
 import { keymap as cmKeymap } from '@codemirror/view';
+import { browser } from '@atlaskit/editor-common/browser';
 import { exitCode } from '@atlaskit/editor-prosemirror/commands';
 import { undo, redo } from '@atlaskit/editor-prosemirror/history';
 import { backspaceKeymap } from './backspace';
@@ -10,13 +11,15 @@ export var keymapExtension = function keymapExtension(_ref) {
     getNode = _ref.getNode,
     getPos = _ref.getPos,
     selectCodeBlockNode = _ref.selectCodeBlockNode,
-    onMaybeNodeSelection = _ref.onMaybeNodeSelection;
+    onMaybeNodeSelection = _ref.onMaybeNodeSelection,
+    customFindReplace = _ref.customFindReplace;
   return cmKeymap.of(codeBlockKeymap({
     view: view,
     getNode: getNode,
     getPos: getPos,
     selectCodeBlockNode: selectCodeBlockNode,
-    onMaybeNodeSelection: onMaybeNodeSelection
+    onMaybeNodeSelection: onMaybeNodeSelection,
+    customFindReplace: customFindReplace
   }));
 };
 var codeBlockKeymap = function codeBlockKeymap(_ref2) {
@@ -24,7 +27,8 @@ var codeBlockKeymap = function codeBlockKeymap(_ref2) {
     getNode = _ref2.getNode,
     getPos = _ref2.getPos,
     selectCodeBlockNode = _ref2.selectCodeBlockNode,
-    onMaybeNodeSelection = _ref2.onMaybeNodeSelection;
+    onMaybeNodeSelection = _ref2.onMaybeNodeSelection,
+    customFindReplace = _ref2.customFindReplace;
   return [{
     key: 'ArrowUp',
     run: function run(cm) {
@@ -81,6 +85,22 @@ var codeBlockKeymap = function codeBlockKeymap(_ref2) {
         onMaybeNodeSelection: onMaybeNodeSelection
       });
     }
+  }, {
+    key: 'Ctrl-f',
+    mac: 'Cmd-f',
+    run: function run() {
+      // Pass synthetic event to prosemirror
+      if (customFindReplace) {
+        view.dispatchEvent(new KeyboardEvent('keydown', {
+          key: 'f',
+          code: 'KeyF',
+          metaKey: browser.mac ? true : false,
+          ctrlKey: browser.mac ? false : true
+        }));
+        return true;
+      }
+      return false;
+    }
   }, {
     key: 'Ctrl-Enter',
     run: function run() {

package/dist/esm/nodeviews/extensions/manageSelectionMarker.js

@@ -0,0 +1,22 @@
+import { EditorView as CodeMirror } from '@codemirror/view';
+/**
+ * Hides selection marker decoration when focused on codemirror editor and re-enables on blur
+ *
+ * @param api
+ * @returns CodeMirror Extension
+ */
+export var manageSelectionMarker = function manageSelectionMarker(api) {
+  var decoHide;
+  return CodeMirror.focusChangeEffect.of(function (_state, focusing) {
+    if (focusing) {
+      var _api$selectionMarker;
+      api === null || api === void 0 || (_api$selectionMarker = api.selectionMarker) === null || _api$selectionMarker === void 0 || _api$selectionMarker.actions.queueHideDecoration(function (hideDecoration) {
+        decoHide = hideDecoration;
+      });
+    } else {
+      var _decoHide;
+      (_decoHide = decoHide) === null || _decoHide === void 0 || _decoHide();
+    }
+    return null;
+  });
+};

package/dist/esm/nodeviews/extensions/prosemirrorDecorations.js

@@ -0,0 +1,135 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/inherits";
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+import { ViewPlugin, WidgetType, Decoration as CodeMirrorDecoration } from '@codemirror/view';
+var PMWidget = /*#__PURE__*/function (_WidgetType) {
+  function PMWidget(toDOMElement) {
+    var _this;
+    _classCallCheck(this, PMWidget);
+    _this = _callSuper(this, PMWidget);
+    _this.toDOMElement = toDOMElement;
+    return _this;
+  }
+  _inherits(PMWidget, _WidgetType);
+  return _createClass(PMWidget, [{
+    key: "toDOM",
+    value: function toDOM() {
+      return this.toDOMElement;
+    }
+  }, {
+    key: "ignoreEvent",
+    value: function ignoreEvent() {
+      return false;
+    }
+  }]);
+}(WidgetType); // This type is not exposed publically by ProseMirror but we need it to map to CodeMirror
+// See: https://github.com/ProseMirror/prosemirror-view/blob/master/src/decoration.ts
+// This type is not exposed publically by ProseMirror but we need it to map to CodeMirror
+// See: https://github.com/ProseMirror/prosemirror-view/blob/master/src/decoration.ts
+// This type is not exposed publically by ProseMirror but we need it to map to CodeMirror
+// See: https://github.com/ProseMirror/prosemirror-view/blob/master/src/decoration.ts
+function isExtendedDecoration(decoration) {
+  return decoration.inline !== undefined && decoration.widget !== undefined && decoration.type !== undefined;
+}
+var getHTMLElement = function getHTMLElement(toDOM, view, getPos) {
+  if (toDOM instanceof Function) {
+    var element = toDOM(view, getPos);
+    return element instanceof HTMLElement ? element : undefined;
+  } else if (toDOM instanceof HTMLElement) {
+    return toDOM;
+  }
+};
+var mapPMDecorationToCMDecoration = function mapPMDecorationToCMDecoration(decoration, view, getPos) {
+  if (!isExtendedDecoration(decoration)) {
+    return undefined;
+  }
+  if (decoration.inline) {
+    var markDecoration = CodeMirrorDecoration.mark({
+      attributes: decoration.type.attrs
+    });
+    return markDecoration.range(decoration.from, decoration.to);
+  } else if (decoration.widget) {
+    var _decoration$type;
+    var toDOM = getHTMLElement(decoration === null || decoration === void 0 || (_decoration$type = decoration.type) === null || _decoration$type === void 0 ? void 0 : _decoration$type.toDOM, view, getPos);
+    if (!toDOM) {
+      return undefined;
+    }
+    var widgetDecoration = CodeMirrorDecoration.widget({
+      widget: new PMWidget(toDOM),
+      side: decoration.type.side
+    });
+    return widgetDecoration.range(decoration.from, decoration.to);
+  }
+};
+function isDefined(value) {
+  return value !== undefined;
+}
+
+/**
+ * Creates CodeMirror versions of the decorations provided by ProseMirror.
+ *
+ * Inline ProseMirror decorations -> Mark CodeMirror decorations
+ * Widget ProseMirror decorations -> Widget CodeMirror decorations
+ *
+ * This way any decorations applied in ProseMirror land should automatically be supported
+ * by the CodeMirror editor
+ *
+ * @param updateDecorationsEffect Facet for the prosemirror decorations
+ * @returns CodeMirror extension
+ */
+export var prosemirrorDecorationPlugin = function prosemirrorDecorationPlugin(updateDecorationsEffect, editorView, getPos) {
+  return ViewPlugin.fromClass( /*#__PURE__*/function () {
+    function _class(view) {
+      _classCallCheck(this, _class);
+      this.decorations = this.updateDecorations(view);
+    }
+    return _createClass(_class, [{
+      key: "updateDecorations",
+      value: function updateDecorations(view) {
+        var _view$viewport = view.viewport,
+          from = _view$viewport.from,
+          to = _view$viewport.to;
+        var innnerDecorations = view.state.facet(updateDecorationsEffect);
+        var allDecorations = [];
+        innnerDecorations === null || innnerDecorations === void 0 || innnerDecorations.map(function (source) {
+          // Temporary: this only exists on prosemirror-view@1.34.0. Since post-office is lower it causes an error.
+          // Once we do our prosemirror bump (very soon) we should remove this.
+          // https://product-fabric.atlassian.net/browse/ED-26398
+          // @ts-ignore
+          source === null || source === void 0 || source.forEachSet(function (set) {
+            var decorations = set.find(from, to)
+            // Do not render the code block line decorations
+            // Temporary: this only exists on prosemirror-view@1.34.0. Since post-office is lower it causes an error.
+            // Once we do our prosemirror bump (very soon) we should remove this.
+            // https://product-fabric.atlassian.net/browse/ED-26398
+            // @ts-ignore
+            .filter(function (dec) {
+              return dec.spec.type !== 'decorationWidgetType';
+            });
+            allDecorations.push.apply(allDecorations, _toConsumableArray(decorations));
+          });
+        });
+        var cmDecorations = allDecorations.sort(function (a, b) {
+          return a.from < b.from ? -1 : 1;
+        }).map(function (decoration) {
+          return mapPMDecorationToCMDecoration(decoration, editorView, getPos);
+        }).filter(isDefined);
+        return CodeMirrorDecoration.set(cmDecorations);
+      }
+    }, {
+      key: "update",
+      value: function update(_update) {
+        this.decorations = this.updateDecorations(_update.view);
+      }
+    }]);
+  }(), {
+    decorations: function decorations(v) {
+      return v.decorations;
+    }
+  });
+};

package/dist/types/codeBlockAdvancedPluginType.d.ts

@@ -2,9 +2,17 @@ import type { Extension } from '@codemirror/state';
 import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { CodeBlockPlugin } from '@atlaskit/editor-plugin-code-block';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
+import type { FindReplacePlugin } from '@atlaskit/editor-plugin-find-replace';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
+import type { SelectionMarkerPlugin } from '@atlaskit/editor-plugin-selection-marker';
 export type CodeBlockAdvancedPlugin = NextEditorPlugin<'codeBlockAdvanced', {
-    dependencies: [CodeBlockPlugin, SelectionPlugin, OptionalPlugin<EditorDisabledPlugin>];
+    dependencies: [
+        CodeBlockPlugin,
+        SelectionPlugin,
+        OptionalPlugin<EditorDisabledPlugin>,
+        OptionalPlugin<SelectionMarkerPlugin>,
+        OptionalPlugin<FindReplacePlugin>
+    ];
     pluginConfiguration: {
         extensions?: Extension[];
     } | undefined;

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

@@ -2,7 +2,7 @@ import { Extension } from '@codemirror/state';
 import { ViewUpdate } from '@codemirror/view';
 import type { getPosHandler, getPosHandlerNode, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
+import type { Decoration, DecorationSource, EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
 import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
 interface ConfigProps {
     api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
@@ -15,15 +15,15 @@ declare class CodeBlockAdvancedNodeView implements NodeView {
     private lineWrappingCompartment;
     private languageCompartment;
     private readOnlyCompartment;
-    private copyDecoCompartment;
+    private pmDecorationsCompartment;
     private node;
     private getPos;
     private cm;
     private selectionAPI;
     private maybeTryingToReachNodeSelection;
     private cleanupDisabledState;
-    private cleanupCopyButtonDecoration;
     private languageLoader;
+    private pmFacet;
     constructor(node: PMNode, view: EditorView, getPos: getPosHandlerNode, config: ConfigProps);
     destroy(): void;
     forwardUpdate(update: ViewUpdate): void;
@@ -31,10 +31,15 @@ declare class CodeBlockAdvancedNodeView implements NodeView {
     private updateReadonlyState;
     private updateLanguage;
     private selectCodeBlockNode;
-    private addCopyButtonDecoration;
     private wordWrappingEnabled;
     private updateWordWrap;
-    update(node: PMNode): boolean;
+    update(node: PMNode, _: readonly Decoration[], innerDecorations: DecorationSource): boolean;
+    /**
+     * Updates a facet which stores information on the prosemirror decorations
+     *
+     * This then gets translated to codemirror decorations in `prosemirrorDecorationPlugin`
+     */
+    private updateProseMirrorDecorations;
     stopEvent(e: Event): boolean;
 }
 export declare const getCodeBlockAdvancedNodeView: (props: ConfigProps) => (node: PMNode, view: EditorView, getPos: getPosHandler) => CodeBlockAdvancedNodeView;

package/dist/types/nodeviews/extensions/keymap/index.d.ts

@@ -9,6 +9,7 @@ interface KeymapProps {
     getPos: getPosHandlerNode;
     selectCodeBlockNode: (relativeSelectionPos: RelativeSelectionPos | undefined) => void;
     onMaybeNodeSelection: () => void;
+    customFindReplace: boolean;
 }
-export declare const keymapExtension: ({ view, getNode, getPos, selectCodeBlockNode, onMaybeNodeSelection, }: KeymapProps) => Extension;
+export declare const keymapExtension: ({ view, getNode, getPos, selectCodeBlockNode, onMaybeNodeSelection, customFindReplace, }: KeymapProps) => Extension;
 export {};

package/dist/types/nodeviews/extensions/manageSelectionMarker.d.ts

@@ -0,0 +1,10 @@
+import { Extension } from '@codemirror/state';
+import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { CodeBlockAdvancedPlugin } from '../../codeBlockAdvancedPluginType';
+/**
+ * Hides selection marker decoration when focused on codemirror editor and re-enables on blur
+ *
+ * @param api
+ * @returns CodeMirror Extension
+ */
+export declare const manageSelectionMarker: (api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined) => Extension;

package/dist/types/nodeviews/extensions/prosemirrorDecorations.d.ts

@@ -0,0 +1,20 @@
+import { Facet } from '@codemirror/state';
+import { ViewPlugin, EditorView as CodeMirror, DecorationSet, ViewUpdate } from '@codemirror/view';
+import type { EditorView, DecorationSource } from '@atlaskit/editor-prosemirror/view';
+/**
+ * Creates CodeMirror versions of the decorations provided by ProseMirror.
+ *
+ * Inline ProseMirror decorations -> Mark CodeMirror decorations
+ * Widget ProseMirror decorations -> Widget CodeMirror decorations
+ *
+ * This way any decorations applied in ProseMirror land should automatically be supported
+ * by the CodeMirror editor
+ *
+ * @param updateDecorationsEffect Facet for the prosemirror decorations
+ * @returns CodeMirror extension
+ */
+export declare const prosemirrorDecorationPlugin: (updateDecorationsEffect: Facet<DecorationSource>, editorView: EditorView, getPos: () => number | undefined) => ViewPlugin<{
+    decorations: DecorationSet;
+    updateDecorations(view: CodeMirror): DecorationSet;
+    update(update: ViewUpdate): void;
+}>;

package/dist/types-ts4.5/codeBlockAdvancedPluginType.d.ts

@@ -2,12 +2,16 @@ import type { Extension } from '@codemirror/state';
 import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { CodeBlockPlugin } from '@atlaskit/editor-plugin-code-block';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
+import type { FindReplacePlugin } from '@atlaskit/editor-plugin-find-replace';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
+import type { SelectionMarkerPlugin } from '@atlaskit/editor-plugin-selection-marker';
 export type CodeBlockAdvancedPlugin = NextEditorPlugin<'codeBlockAdvanced', {
     dependencies: [
         CodeBlockPlugin,
         SelectionPlugin,
-        OptionalPlugin<EditorDisabledPlugin>
+        OptionalPlugin<EditorDisabledPlugin>,
+        OptionalPlugin<SelectionMarkerPlugin>,
+        OptionalPlugin<FindReplacePlugin>
     ];
     pluginConfiguration: {
         extensions?: Extension[];

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

@@ -2,7 +2,7 @@ import { Extension } from '@codemirror/state';
 import { ViewUpdate } from '@codemirror/view';
 import type { getPosHandler, getPosHandlerNode, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
+import type { Decoration, DecorationSource, EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
 import type { CodeBlockAdvancedPlugin } from '../codeBlockAdvancedPluginType';
 interface ConfigProps {
     api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined;
@@ -15,15 +15,15 @@ declare class CodeBlockAdvancedNodeView implements NodeView {
     private lineWrappingCompartment;
     private languageCompartment;
     private readOnlyCompartment;
-    private copyDecoCompartment;
+    private pmDecorationsCompartment;
     private node;
     private getPos;
     private cm;
     private selectionAPI;
     private maybeTryingToReachNodeSelection;
     private cleanupDisabledState;
-    private cleanupCopyButtonDecoration;
     private languageLoader;
+    private pmFacet;
     constructor(node: PMNode, view: EditorView, getPos: getPosHandlerNode, config: ConfigProps);
     destroy(): void;
     forwardUpdate(update: ViewUpdate): void;
@@ -31,10 +31,15 @@ declare class CodeBlockAdvancedNodeView implements NodeView {
     private updateReadonlyState;
     private updateLanguage;
     private selectCodeBlockNode;
-    private addCopyButtonDecoration;
     private wordWrappingEnabled;
     private updateWordWrap;
-    update(node: PMNode): boolean;
+    update(node: PMNode, _: readonly Decoration[], innerDecorations: DecorationSource): boolean;
+    /**
+     * Updates a facet which stores information on the prosemirror decorations
+     *
+     * This then gets translated to codemirror decorations in `prosemirrorDecorationPlugin`
+     */
+    private updateProseMirrorDecorations;
     stopEvent(e: Event): boolean;
 }
 export declare const getCodeBlockAdvancedNodeView: (props: ConfigProps) => (node: PMNode, view: EditorView, getPos: getPosHandler) => CodeBlockAdvancedNodeView;

package/dist/types-ts4.5/nodeviews/extensions/keymap/index.d.ts

@@ -9,6 +9,7 @@ interface KeymapProps {
     getPos: getPosHandlerNode;
     selectCodeBlockNode: (relativeSelectionPos: RelativeSelectionPos | undefined) => void;
     onMaybeNodeSelection: () => void;
+    customFindReplace: boolean;
 }
-export declare const keymapExtension: ({ view, getNode, getPos, selectCodeBlockNode, onMaybeNodeSelection, }: KeymapProps) => Extension;
+export declare const keymapExtension: ({ view, getNode, getPos, selectCodeBlockNode, onMaybeNodeSelection, customFindReplace, }: KeymapProps) => Extension;
 export {};

package/dist/types-ts4.5/nodeviews/extensions/manageSelectionMarker.d.ts

@@ -0,0 +1,10 @@
+import { Extension } from '@codemirror/state';
+import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { CodeBlockAdvancedPlugin } from '../../codeBlockAdvancedPluginType';
+/**
+ * Hides selection marker decoration when focused on codemirror editor and re-enables on blur
+ *
+ * @param api
+ * @returns CodeMirror Extension
+ */
+export declare const manageSelectionMarker: (api: ExtractInjectionAPI<CodeBlockAdvancedPlugin> | undefined) => Extension;