@atlaskit/editor-plugin-panel 3.1.0 → 3.1.2

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/editor-plugin-panel
 
+## 3.1.2
+
+### Patch Changes
+
+- [#163321](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/163321)
+  [`9cbf3468984dc`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/9cbf3468984dc) -
+  ED-25609: migrates expand plugin ReactDOM references to portalprovider
+- Updated dependencies
+
+## 3.1.1
+
+### Patch Changes
+
+- [#160699](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/160699)
+  [`3f6d3eca921ed`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3f6d3eca921ed) -
+  ED-25575: migrate panel plugin node rendering to portals
+
 ## 3.1.0
 
 ### Minor Changes

package/dist/cjs/nodeviews/panel.js

@@ -9,6 +9,7 @@ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/cl
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _react = _interopRequireDefault(require("react"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
+var _v = _interopRequireDefault(require("uuid/v4"));
 var _adfSchema = require("@atlaskit/adf-schema");
 var _emoji = require("@atlaskit/editor-common/emoji");
 var _hooks = require("@atlaskit/editor-common/hooks");
@@ -17,6 +18,7 @@ var _panel = require("@atlaskit/editor-common/panel");
 var _model = require("@atlaskit/editor-prosemirror/model");
 var _consts = require("@atlaskit/editor-shared-styles/consts");
 var _hint = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/hint"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _utils = require("../utils");
 var panelIcons = exports.panelIcons = {
   info: _icons.PanelInfoIcon,
@@ -60,12 +62,15 @@ var PanelIcon = exports.PanelIcon = function PanelIcon(props) {
   });
 };
 var PanelNodeView = /*#__PURE__*/function () {
-  function PanelNodeView(node, view, getPos, pluginOptions, api, providerFactory) {
+  function PanelNodeView(node, view, getPos, pluginOptions, api, nodeViewPortalProviderAPI, providerFactory) {
+    var _this = this;
     (0, _classCallCheck2.default)(this, PanelNodeView);
+    this.nodeViewPortalProviderAPI = nodeViewPortalProviderAPI;
     this.providerFactory = providerFactory;
     this.pluginOptions = pluginOptions;
     this.view = view;
     this.node = node;
+    this.key = (0, _v.default)();
     var _DOMSerializer$render = _model.DOMSerializer.renderSpec(document, (0, _utils.panelAttrsToDom)(node.attrs, pluginOptions.allowCustomPanel || false)),
       dom = _DOMSerializer$render.dom,
       contentDOM = _DOMSerializer$render.contentDOM;
@@ -78,12 +83,23 @@ var PanelNodeView = /*#__PURE__*/function () {
     }
     // set contentEditable as false to be able to select the custom panels with keyboard
     this.icon.contentEditable = 'false';
-    _reactDom.default.render( /*#__PURE__*/_react.default.createElement(PanelIcon, {
-      pluginInjectionApi: api,
-      allowCustomPanel: pluginOptions.allowCustomPanel,
-      panelAttributes: node.attrs,
-      providerFactory: this.providerFactory
-    }), this.icon);
+    if ((0, _platformFeatureFlags.fg)('platform_editor_react18_plugin_portalprovider')) {
+      this.nodeViewPortalProviderAPI.render(function () {
+        return /*#__PURE__*/_react.default.createElement(PanelIcon, {
+          pluginInjectionApi: api,
+          allowCustomPanel: pluginOptions.allowCustomPanel,
+          panelAttributes: node.attrs,
+          providerFactory: _this.providerFactory
+        });
+      }, this.icon, this.key);
+    } else {
+      _reactDom.default.render( /*#__PURE__*/_react.default.createElement(PanelIcon, {
+        pluginInjectionApi: api,
+        allowCustomPanel: pluginOptions.allowCustomPanel,
+        panelAttributes: node.attrs,
+        providerFactory: this.providerFactory
+      }), this.icon);
+    }
   }
   (0, _createClass2.default)(PanelNodeView, [{
     key: "ignoreMutation",
@@ -97,11 +113,18 @@ var PanelNodeView = /*#__PURE__*/function () {
       var isInsideIcon = this.icon.contains(mutation.target);
       return isIcon || isInsideIcon;
     }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      if ((0, _platformFeatureFlags.fg)('platform_editor_react18_plugin_portalprovider')) {
+        this.nodeViewPortalProviderAPI.remove(this.key);
+      }
+    }
   }]);
   return PanelNodeView;
 }();
-var getPanelNodeView = exports.getPanelNodeView = function getPanelNodeView(pluginOptions, api, providerFactory) {
+var getPanelNodeView = exports.getPanelNodeView = function getPanelNodeView(pluginOptions, api, nodeViewPortalProviderAPI, providerFactory) {
   return function (node, view, getPos) {
-    return new PanelNodeView(node, view, getPos, pluginOptions, api, providerFactory);
+    return new PanelNodeView(node, view, getPos, pluginOptions, api, nodeViewPortalProviderAPI, providerFactory);
   };
 };

package/dist/cjs/plugin.js

@@ -33,8 +33,9 @@ var panelPlugin = function panelPlugin(_ref) {
         name: 'panel',
         plugin: function plugin(_ref2) {
           var providerFactory = _ref2.providerFactory,
-            dispatch = _ref2.dispatch;
-          return (0, _main.createPlugin)(dispatch, providerFactory, options, api);
+            dispatch = _ref2.dispatch,
+            nodeViewPortalProviderAPI = _ref2.nodeViewPortalProviderAPI;
+          return (0, _main.createPlugin)(dispatch, providerFactory, options, api, nodeViewPortalProviderAPI);
         }
       }, {
         name: 'panelKeyMap',

package/dist/cjs/pm-plugins/main.js

@@ -10,7 +10,7 @@ var _selection = require("@atlaskit/editor-common/selection");
 var _panel2 = require("../nodeviews/panel");
 var _types = require("../types");
 var _utils = require("../utils");
-var createPlugin = exports.createPlugin = function createPlugin(dispatch, providerFactory, pluginOptions, api) {
+var createPlugin = exports.createPlugin = function createPlugin(dispatch, providerFactory, pluginOptions, api, nodeViewPortalProviderAPI) {
   var _pluginOptions$useLon = pluginOptions.useLongPressSelection,
     useLongPressSelection = _pluginOptions$useLon === void 0 ? false : _pluginOptions$useLon;
   return new _safePlugin.SafePlugin({
@@ -25,7 +25,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, provid
     },
     props: {
       nodeViews: {
-        panel: (0, _panel2.getPanelNodeView)(pluginOptions, api, providerFactory)
+        panel: (0, _panel2.getPanelNodeView)(pluginOptions, api, nodeViewPortalProviderAPI, providerFactory)
       },
       handleClickOn: (0, _selection.createSelectionClickHandler)(['panel'], function (target) {
         return !!target.closest(".".concat(_panel.PanelSharedCssClassName.prefix));

package/dist/es2019/nodeviews/panel.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
+import uuid from 'uuid/v4';
 import { PanelType } from '@atlaskit/adf-schema';
 import { Emoji } from '@atlaskit/editor-common/emoji';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
@@ -8,6 +9,7 @@ import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
 import { akEditorCustomIconSize } from '@atlaskit/editor-shared-styles/consts';
 import TipIcon from '@atlaskit/icon/glyph/editor/hint';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { panelAttrsToDom } from '../utils';
 export const panelIcons = {
   info: PanelInfoIcon,
@@ -55,11 +57,13 @@ export const PanelIcon = props => {
   });
 };
 class PanelNodeView {
-  constructor(node, view, getPos, pluginOptions, api, providerFactory) {
+  constructor(node, view, getPos, pluginOptions, api, nodeViewPortalProviderAPI, providerFactory) {
+    this.nodeViewPortalProviderAPI = nodeViewPortalProviderAPI;
     this.providerFactory = providerFactory;
     this.pluginOptions = pluginOptions;
     this.view = view;
     this.node = node;
+    this.key = uuid();
     const {
       dom,
       contentDOM
@@ -73,12 +77,21 @@ class PanelNodeView {
     }
     // set contentEditable as false to be able to select the custom panels with keyboard
     this.icon.contentEditable = 'false';
-    ReactDOM.render( /*#__PURE__*/React.createElement(PanelIcon, {
-      pluginInjectionApi: api,
-      allowCustomPanel: pluginOptions.allowCustomPanel,
-      panelAttributes: node.attrs,
-      providerFactory: this.providerFactory
-    }), this.icon);
+    if (fg('platform_editor_react18_plugin_portalprovider')) {
+      this.nodeViewPortalProviderAPI.render(() => /*#__PURE__*/React.createElement(PanelIcon, {
+        pluginInjectionApi: api,
+        allowCustomPanel: pluginOptions.allowCustomPanel,
+        panelAttributes: node.attrs,
+        providerFactory: this.providerFactory
+      }), this.icon, this.key);
+    } else {
+      ReactDOM.render( /*#__PURE__*/React.createElement(PanelIcon, {
+        pluginInjectionApi: api,
+        allowCustomPanel: pluginOptions.allowCustomPanel,
+        panelAttributes: node.attrs,
+        providerFactory: this.providerFactory
+      }), this.icon);
+    }
   }
   ignoreMutation(mutation) {
     // ignore mutation if it caused by the icon.
@@ -90,7 +103,12 @@ class PanelNodeView {
     const isInsideIcon = this.icon.contains(mutation.target);
     return isIcon || isInsideIcon;
   }
+  destroy() {
+    if (fg('platform_editor_react18_plugin_portalprovider')) {
+      this.nodeViewPortalProviderAPI.remove(this.key);
+    }
+  }
 }
-export const getPanelNodeView = (pluginOptions, api, providerFactory) => (node, view, getPos) => {
-  return new PanelNodeView(node, view, getPos, pluginOptions, api, providerFactory);
+export const getPanelNodeView = (pluginOptions, api, nodeViewPortalProviderAPI, providerFactory) => (node, view, getPos) => {
+  return new PanelNodeView(node, view, getPos, pluginOptions, api, nodeViewPortalProviderAPI, providerFactory);
 };

package/dist/es2019/plugin.js

@@ -25,8 +25,9 @@ const panelPlugin = ({
       name: 'panel',
       plugin: ({
         providerFactory,
-        dispatch
-      }) => createPlugin(dispatch, providerFactory, options, api)
+        dispatch,
+        nodeViewPortalProviderAPI
+      }) => createPlugin(dispatch, providerFactory, options, api, nodeViewPortalProviderAPI)
     }, {
       name: 'panelKeyMap',
       plugin: () => keymap()

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

@@ -4,7 +4,7 @@ import { createSelectionClickHandler } from '@atlaskit/editor-common/selection';
 import { getPanelNodeView } from '../nodeviews/panel';
 import { pluginKey } from '../types';
 import { handleCut } from '../utils';
-export const createPlugin = (dispatch, providerFactory, pluginOptions, api) => {
+export const createPlugin = (dispatch, providerFactory, pluginOptions, api, nodeViewPortalProviderAPI) => {
   const {
     useLongPressSelection = false
   } = pluginOptions;
@@ -18,7 +18,7 @@ export const createPlugin = (dispatch, providerFactory, pluginOptions, api) => {
     },
     props: {
       nodeViews: {
-        panel: getPanelNodeView(pluginOptions, api, providerFactory)
+        panel: getPanelNodeView(pluginOptions, api, nodeViewPortalProviderAPI, providerFactory)
       },
       handleClickOn: createSelectionClickHandler(['panel'], target => !!target.closest(`.${PanelSharedCssClassName.prefix}`), {
         useLongPressSelection

package/dist/esm/nodeviews/panel.js

@@ -2,6 +2,7 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import React from 'react';
 import ReactDOM from 'react-dom';
+import uuid from 'uuid/v4';
 import { PanelType } from '@atlaskit/adf-schema';
 import { Emoji } from '@atlaskit/editor-common/emoji';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
@@ -10,6 +11,7 @@ import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
 import { akEditorCustomIconSize } from '@atlaskit/editor-shared-styles/consts';
 import TipIcon from '@atlaskit/icon/glyph/editor/hint';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { panelAttrsToDom } from '../utils';
 export var panelIcons = {
   info: PanelInfoIcon,
@@ -53,12 +55,15 @@ export var PanelIcon = function PanelIcon(props) {
   });
 };
 var PanelNodeView = /*#__PURE__*/function () {
-  function PanelNodeView(node, view, getPos, pluginOptions, api, providerFactory) {
+  function PanelNodeView(node, view, getPos, pluginOptions, api, nodeViewPortalProviderAPI, providerFactory) {
+    var _this = this;
     _classCallCheck(this, PanelNodeView);
+    this.nodeViewPortalProviderAPI = nodeViewPortalProviderAPI;
     this.providerFactory = providerFactory;
     this.pluginOptions = pluginOptions;
     this.view = view;
     this.node = node;
+    this.key = uuid();
     var _DOMSerializer$render = DOMSerializer.renderSpec(document, panelAttrsToDom(node.attrs, pluginOptions.allowCustomPanel || false)),
       dom = _DOMSerializer$render.dom,
       contentDOM = _DOMSerializer$render.contentDOM;
@@ -71,12 +76,23 @@ var PanelNodeView = /*#__PURE__*/function () {
     }
     // set contentEditable as false to be able to select the custom panels with keyboard
     this.icon.contentEditable = 'false';
-    ReactDOM.render( /*#__PURE__*/React.createElement(PanelIcon, {
-      pluginInjectionApi: api,
-      allowCustomPanel: pluginOptions.allowCustomPanel,
-      panelAttributes: node.attrs,
-      providerFactory: this.providerFactory
-    }), this.icon);
+    if (fg('platform_editor_react18_plugin_portalprovider')) {
+      this.nodeViewPortalProviderAPI.render(function () {
+        return /*#__PURE__*/React.createElement(PanelIcon, {
+          pluginInjectionApi: api,
+          allowCustomPanel: pluginOptions.allowCustomPanel,
+          panelAttributes: node.attrs,
+          providerFactory: _this.providerFactory
+        });
+      }, this.icon, this.key);
+    } else {
+      ReactDOM.render( /*#__PURE__*/React.createElement(PanelIcon, {
+        pluginInjectionApi: api,
+        allowCustomPanel: pluginOptions.allowCustomPanel,
+        panelAttributes: node.attrs,
+        providerFactory: this.providerFactory
+      }), this.icon);
+    }
   }
   _createClass(PanelNodeView, [{
     key: "ignoreMutation",
@@ -90,11 +106,18 @@ var PanelNodeView = /*#__PURE__*/function () {
       var isInsideIcon = this.icon.contains(mutation.target);
       return isIcon || isInsideIcon;
     }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      if (fg('platform_editor_react18_plugin_portalprovider')) {
+        this.nodeViewPortalProviderAPI.remove(this.key);
+      }
+    }
   }]);
   return PanelNodeView;
 }();
-export var getPanelNodeView = function getPanelNodeView(pluginOptions, api, providerFactory) {
+export var getPanelNodeView = function getPanelNodeView(pluginOptions, api, nodeViewPortalProviderAPI, providerFactory) {
   return function (node, view, getPos) {
-    return new PanelNodeView(node, view, getPos, pluginOptions, api, providerFactory);
+    return new PanelNodeView(node, view, getPos, pluginOptions, api, nodeViewPortalProviderAPI, providerFactory);
   };
 };

package/dist/esm/plugin.js

@@ -26,8 +26,9 @@ var panelPlugin = function panelPlugin(_ref) {
         name: 'panel',
         plugin: function plugin(_ref2) {
           var providerFactory = _ref2.providerFactory,
-            dispatch = _ref2.dispatch;
-          return createPlugin(dispatch, providerFactory, options, api);
+            dispatch = _ref2.dispatch,
+            nodeViewPortalProviderAPI = _ref2.nodeViewPortalProviderAPI;
+          return createPlugin(dispatch, providerFactory, options, api, nodeViewPortalProviderAPI);
         }
       }, {
         name: 'panelKeyMap',

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

@@ -4,7 +4,7 @@ import { createSelectionClickHandler } from '@atlaskit/editor-common/selection';
 import { getPanelNodeView } from '../nodeviews/panel';
 import { pluginKey } from '../types';
 import { handleCut } from '../utils';
-export var createPlugin = function createPlugin(dispatch, providerFactory, pluginOptions, api) {
+export var createPlugin = function createPlugin(dispatch, providerFactory, pluginOptions, api, nodeViewPortalProviderAPI) {
   var _pluginOptions$useLon = pluginOptions.useLongPressSelection,
     useLongPressSelection = _pluginOptions$useLon === void 0 ? false : _pluginOptions$useLon;
   return new SafePlugin({
@@ -19,7 +19,7 @@ export var createPlugin = function createPlugin(dispatch, providerFactory, plugi
     },
     props: {
       nodeViews: {
-        panel: getPanelNodeView(pluginOptions, api, providerFactory)
+        panel: getPanelNodeView(pluginOptions, api, nodeViewPortalProviderAPI, providerFactory)
       },
       handleClickOn: createSelectionClickHandler(['panel'], function (target) {
         return !!target.closest(".".concat(PanelSharedCssClassName.prefix));

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

@@ -1,6 +1,7 @@
 import React from 'react';
 import type { PanelAttributes } from '@atlaskit/adf-schema';
 import { PanelType } from '@atlaskit/adf-schema';
+import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import type { ExtractInjectionAPI, getPosHandler, getPosHandlerNode } from '@atlaskit/editor-common/types';
 import type { Node } from '@atlaskit/editor-prosemirror/model';
@@ -26,12 +27,15 @@ declare class PanelNodeView {
     getPos: getPosHandlerNode;
     view: EditorView;
     providerFactory?: ProviderFactory;
+    nodeViewPortalProviderAPI: PortalProviderAPI;
     pluginOptions: PanelPluginOptions;
-    constructor(node: Node, view: EditorView, getPos: getPosHandlerNode, pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined, providerFactory?: ProviderFactory);
+    key: string;
+    constructor(node: Node, view: EditorView, getPos: getPosHandlerNode, pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined, nodeViewPortalProviderAPI: PortalProviderAPI, providerFactory?: ProviderFactory);
     ignoreMutation(mutation: MutationRecord | {
         type: 'selection';
         target: Element;
     }): boolean;
+    destroy(): void;
 }
-export declare const getPanelNodeView: (pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined, providerFactory?: ProviderFactory) => (node: Node, view: EditorView, getPos: getPosHandler) => PanelNodeView;
+export declare const getPanelNodeView: (pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined, nodeViewPortalProviderAPI: PortalProviderAPI, providerFactory?: ProviderFactory) => (node: Node, view: EditorView, getPos: getPosHandler) => PanelNodeView;
 export {};

package/dist/types/pm-plugins/main.d.ts

@@ -1,4 +1,5 @@
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
+import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';
@@ -9,4 +10,4 @@ export type PanelOptions = {
     emojiId?: string;
     emojiText?: string;
 };
-export declare const createPlugin: (dispatch: Dispatch, providerFactory: ProviderFactory, pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined) => SafePlugin<any>;
+export declare const createPlugin: (dispatch: Dispatch, providerFactory: ProviderFactory, pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined, nodeViewPortalProviderAPI: PortalProviderAPI) => SafePlugin<any>;

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

@@ -1,6 +1,7 @@
 import React from 'react';
 import type { PanelAttributes } from '@atlaskit/adf-schema';
 import { PanelType } from '@atlaskit/adf-schema';
+import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import type { ExtractInjectionAPI, getPosHandler, getPosHandlerNode } from '@atlaskit/editor-common/types';
 import type { Node } from '@atlaskit/editor-prosemirror/model';
@@ -26,12 +27,15 @@ declare class PanelNodeView {
     getPos: getPosHandlerNode;
     view: EditorView;
     providerFactory?: ProviderFactory;
+    nodeViewPortalProviderAPI: PortalProviderAPI;
     pluginOptions: PanelPluginOptions;
-    constructor(node: Node, view: EditorView, getPos: getPosHandlerNode, pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined, providerFactory?: ProviderFactory);
+    key: string;
+    constructor(node: Node, view: EditorView, getPos: getPosHandlerNode, pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined, nodeViewPortalProviderAPI: PortalProviderAPI, providerFactory?: ProviderFactory);
     ignoreMutation(mutation: MutationRecord | {
         type: 'selection';
         target: Element;
     }): boolean;
+    destroy(): void;
 }
-export declare const getPanelNodeView: (pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined, providerFactory?: ProviderFactory) => (node: Node, view: EditorView, getPos: getPosHandler) => PanelNodeView;
+export declare const getPanelNodeView: (pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined, nodeViewPortalProviderAPI: PortalProviderAPI, providerFactory?: ProviderFactory) => (node: Node, view: EditorView, getPos: getPosHandler) => PanelNodeView;
 export {};

package/dist/types-ts4.5/pm-plugins/main.d.ts

@@ -1,4 +1,5 @@
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
+import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';
@@ -9,4 +10,4 @@ export type PanelOptions = {
     emojiId?: string;
     emojiText?: string;
 };
-export declare const createPlugin: (dispatch: Dispatch, providerFactory: ProviderFactory, pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined) => SafePlugin<any>;
+export declare const createPlugin: (dispatch: Dispatch, providerFactory: ProviderFactory, pluginOptions: PanelPluginOptions, api: ExtractInjectionAPI<PanelPlugin> | undefined, nodeViewPortalProviderAPI: PortalProviderAPI) => SafePlugin<any>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-panel",
-	"version": "3.1.0",
+	"version": "3.1.2",
 	"description": "Panel plugin for @atlaskit/editor-core.",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -32,7 +32,7 @@
 	},
 	"dependencies": {
 		"@atlaskit/adf-schema": "^44.2.0",
-		"@atlaskit/editor-common": "^94.13.0",
+		"@atlaskit/editor-common": "^94.19.0",
 		"@atlaskit/editor-palette": "1.6.3",
 		"@atlaskit/editor-plugin-analytics": "^1.10.0",
 		"@atlaskit/editor-plugin-decorations": "^1.3.0",
@@ -43,8 +43,9 @@
 		"@atlaskit/icon": "^22.24.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
 		"@atlaskit/theme": "^14.0.0",
-		"@atlaskit/tmp-editor-statsig": "^2.12.0",
-		"@babel/runtime": "^7.0.0"
+		"@atlaskit/tmp-editor-statsig": "^2.14.0",
+		"@babel/runtime": "^7.0.0",
+		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
 		"react": "^16.8.0 || ^17.0.0 || ~18.2.0",
@@ -90,6 +91,9 @@
 	"platform-feature-flags": {
 		"platform_editor_remove_copy_button_from_view_mode": {
 			"type": "boolean"
+		},
+		"platform_editor_react18_plugin_portalprovider": {
+			"type": "boolean"
 		}
 	},
 	"stricter": {