@atlaskit/editor-plugin-extension 0.6.2 → 0.7.0

package/dist/es2019/ui/ConfigPanel/ConfigPanel.js

@@ -10,9 +10,8 @@ import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/custom-theme-button';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { isTabGroup } from '@atlaskit/editor-common/extensions';
-import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import Form, { FormFooter } from '@atlaskit/form';
-import { pluginKey as extensionPluginKey } from '../../plugin-key';
 import { ALLOWED_LOGGED_MACRO_PARAMS } from './constants';
 import ErrorMessage from './ErrorMessage';
 import FormContent from './FormContent';
@@ -352,7 +351,8 @@ class ConfigPanel extends React.Component {
       errorMessage,
       fields,
       isLoading,
-      onCancel
+      onCancel,
+      api
     } = this.props;
     const {
       currentParameters,
@@ -380,36 +380,66 @@ class ConfigPanel extends React.Component {
           noValidate: true,
           onKeyDown: handleKeyDown,
           "data-testid": "extension-config-panel"
-        }), this.renderHeader(extensionManifest), /*#__PURE__*/React.createElement(WithPluginState, {
-          plugins: {
-            extension: extensionPluginKey
-          },
-          render: ({
-            extension
-          }) => /*#__PURE__*/React.createElement(FormErrorBoundary, {
-            contextIdentifierProvider: extension === null || extension === void 0 ? void 0 : extension.contextIdentifierProvider,
-            extensionKey: extensionManifest.key,
-            fields: fields || []
-          }, /*#__PURE__*/React.createElement(ConfigFormIntl, {
-            canSave: !autoSave,
-            errorMessage: errorMessage,
-            extensionManifest: extensionManifest,
-            fields: fields,
-            firstVisibleFieldName: firstVisibleFieldName,
-            hasParsedParameters: hasParsedParameters,
-            isLoading: isLoading || false,
-            onCancel: onCancel,
-            onFieldChange: onFieldChange,
-            parameters: currentParameters,
-            submitting: submitting,
-            contextIdentifierProvider: extension === null || extension === void 0 ? void 0 : extension.contextIdentifierProvider,
-            featureFlags: featureFlags
-          }))
+        }), this.renderHeader(extensionManifest), /*#__PURE__*/React.createElement(ConfigFormIntlWithBoundary, {
+          api: api,
+          canSave: !autoSave,
+          errorMessage: errorMessage,
+          extensionManifest: extensionManifest,
+          fields: fields !== null && fields !== void 0 ? fields : [],
+          firstVisibleFieldName: firstVisibleFieldName,
+          hasParsedParameters: hasParsedParameters,
+          isLoading: isLoading || false,
+          onCancel: onCancel,
+          onFieldChange: onFieldChange,
+          parameters: currentParameters,
+          submitting: submitting,
+          featureFlags: featureFlags
         }));
       });
     });
   }
 }
+function ConfigFormIntlWithBoundary({
+  api,
+  fields,
+  submitting,
+  parameters,
+  featureFlags,
+  canSave,
+  extensionManifest,
+  onFieldChange,
+  onCancel,
+  isLoading,
+  hasParsedParameters,
+  firstVisibleFieldName,
+  errorMessage
+}) {
+  const {
+    contextIdentifierState
+  } = useSharedPluginState(api, ['contextIdentifier']);
+  const {
+    contextIdentifierProvider
+  } = contextIdentifierState !== null && contextIdentifierState !== void 0 ? contextIdentifierState : {};
+  return /*#__PURE__*/React.createElement(FormErrorBoundary, {
+    contextIdentifierProvider: contextIdentifierProvider,
+    extensionKey: extensionManifest.key,
+    fields: fields
+  }, /*#__PURE__*/React.createElement(ConfigFormIntl, {
+    canSave: canSave,
+    errorMessage: errorMessage,
+    extensionManifest: extensionManifest,
+    fields: fields,
+    firstVisibleFieldName: firstVisibleFieldName,
+    hasParsedParameters: hasParsedParameters,
+    isLoading: isLoading || false,
+    onCancel: onCancel,
+    onFieldChange: onFieldChange,
+    parameters: parameters,
+    submitting: submitting,
+    contextIdentifierProvider: contextIdentifierProvider,
+    featureFlags: featureFlags
+  }));
+}
 export default withAnalyticsContext({
   source: 'ConfigPanel'
 })(withAnalyticsEvents()(ConfigPanel));

package/dist/es2019/ui/ConfigPanel/ConfigPanelFieldsLoader.js

@@ -73,7 +73,8 @@ export default function FieldsLoader({
   showHeader,
   featureFlags,
   onChange,
-  onCancel
+  onCancel,
+  api
 }) {
   const [extensionManifest] = useStateFromPromise(() => extensionProvider.getExtension(extensionType, extensionKey), [extensionProvider, extensionType, extensionKey]);
   const [errorMessage, setErrorMessage] = useState(null);
@@ -83,6 +84,7 @@ export default function FieldsLoader({
     nodeKey: nodeKey,
     extensionParameters: extensionParameters
   }, fields => /*#__PURE__*/React.createElement(ConfigPanel, {
+    api: api,
     extensionManifest: extensionManifest,
     isLoading: !extensionManifest || errorMessage === null && !fields,
     fields: fields,

package/dist/esm/actions.js

@@ -153,28 +153,13 @@ var updateExtensionParams = function updateExtensionParams(editorAnalyticsAPI) {
     }();
   };
 };
-
-// This is to decouple extensions from editor core
-// Ideally in the future we completely deprecate `EditorActions`
-export var editSelectedExtension = function editSelectedExtension(editorActions) {
-  var editorView = editorActions._privateGetEditorView();
-  var _getPluginState = getPluginState(editorView.state),
-    updateExtension = _getPluginState.updateExtension,
-    applyChangeToContextPanel = _getPluginState.applyChangeToContextPanel;
-  // The analytics API cannot be accessed in this case because
-  // we do not have access to the plugin injection API. Rather
-  // than change the way this works - we just won't use analytics
-  // here for now.
-  var editorAnalyticsAPI = undefined;
-  return editExtension(null, applyChangeToContextPanel, editorAnalyticsAPI, updateExtension)(editorView.state, editorView.dispatch, editorView);
-};
 export var editExtension = function editExtension(macroProvider, applyChangeToContextPanel, editorAnalyticsAPI, updateExtension) {
   return function (state, dispatch, view) {
     if (!view) {
       return false;
     }
-    var _getPluginState2 = getPluginState(state),
-      localId = _getPluginState2.localId;
+    var _getPluginState = getPluginState(state),
+      localId = _getPluginState.localId;
     var nodeWithPos = findExtensionWithLocalId(state, localId);
     if (!nodeWithPos) {
       return false;
@@ -212,15 +197,15 @@ export var editExtension = function editExtension(macroProvider, applyChangeToCo
 };
 export var createEditSelectedExtensionAction = function createEditSelectedExtensionAction(_ref2) {
   var editorViewRef = _ref2.editorViewRef,
-    editorAnalyticsAPI = _ref2.editorAnalyticsAPI;
+    editorAnalyticsAPI = _ref2.editorAnalyticsAPI,
+    applyChangeToContextPanel = _ref2.applyChangeToContextPanel;
   return function () {
     var view = editorViewRef.current;
     if (!view) {
       return false;
     }
-    var _getPluginState3 = getPluginState(view.state),
-      updateExtension = _getPluginState3.updateExtension,
-      applyChangeToContextPanel = _getPluginState3.applyChangeToContextPanel;
+    var _getPluginState2 = getPluginState(view.state),
+      updateExtension = _getPluginState2.updateExtension;
     return editExtension(null, applyChangeToContextPanel, editorAnalyticsAPI, updateExtension)(view.state, view.dispatch, view);
   };
 };

package/dist/esm/context-panel.js

@@ -38,9 +38,11 @@ export var duplicateSelection = function duplicateSelection(selectionToDuplicate
   }
 };
 export var getContextPanel = function getContextPanel(getEditorView) {
-  return function (allowAutoSave, featureFlags, applyChange) {
+  return function (api, allowAutoSave, featureFlags) {
     return function (state) {
+      var _api$contextPanel;
       var nodeWithPos = getSelectedExtension(state, true);
+      var applyChange = api === null || api === void 0 || (_api$contextPanel = api.contextPanel) === null || _api$contextPanel === void 0 ? void 0 : _api$contextPanel.actions.applyChange;
 
       // Adding checks to bail out early
       if (!nodeWithPos) {
@@ -74,6 +76,7 @@ export var getContextPanel = function getContextPanel(getEditorView) {
             return null;
           }
           return /*#__PURE__*/React.createElement(ConfigPanelLoader, {
+            api: api,
             showHeader: true,
             closeOnEsc: true,
             extensionType: extensionType,

package/dist/esm/plugin.js

@@ -12,7 +12,7 @@ import { createPlugin, pluginKey } from './pm-plugins/main';
 import { createPlugin as createUniqueIdPlugin } from './pm-plugins/unique-id';
 import { getToolbarConfig } from './toolbar';
 export var extensionPlugin = function extensionPlugin(_ref) {
-  var _api$featureFlags, _api$analytics2, _api$analytics3, _api$decorations, _api$contextPanel3, _api$analytics4, _api$contextPanel4;
+  var _api$featureFlags, _api$analytics2, _api$analytics3, _api$contextPanel3, _api$decorations, _api$contextPanel4, _api$analytics4;
   var _ref$config = _ref.config,
     options = _ref$config === void 0 ? {} : _ref$config,
     _api = _ref.api;
@@ -119,7 +119,8 @@ export var extensionPlugin = function extensionPlugin(_ref) {
       insertMacroFromMacroBrowser: insertMacroFromMacroBrowser(_api === null || _api === void 0 || (_api$analytics2 = _api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions),
       editSelectedExtension: createEditSelectedExtensionAction({
         editorViewRef: editorViewRef,
-        editorAnalyticsAPI: _api === null || _api === void 0 || (_api$analytics3 = _api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions
+        editorAnalyticsAPI: _api === null || _api === void 0 || (_api$analytics3 = _api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions,
+        applyChangeToContextPanel: _api === null || _api === void 0 || (_api$contextPanel3 = _api.contextPanel) === null || _api$contextPanel3 === void 0 ? void 0 : _api$contextPanel3.actions.applyChange
       }),
       runMacroAutoConvert: runMacroAutoConvert,
       forceAutoSave: forceAutoSave
@@ -128,13 +129,13 @@ export var extensionPlugin = function extensionPlugin(_ref) {
       floatingToolbar: getToolbarConfig({
         breakoutEnabled: options.breakoutEnabled,
         hoverDecoration: _api === null || _api === void 0 || (_api$decorations = _api.decorations) === null || _api$decorations === void 0 ? void 0 : _api$decorations.actions.hoverDecoration,
-        applyChangeToContextPanel: _api === null || _api === void 0 || (_api$contextPanel3 = _api.contextPanel) === null || _api$contextPanel3 === void 0 ? void 0 : _api$contextPanel3.actions.applyChange,
+        applyChangeToContextPanel: _api === null || _api === void 0 || (_api$contextPanel4 = _api.contextPanel) === null || _api$contextPanel4 === void 0 ? void 0 : _api$contextPanel4.actions.applyChange,
         editorAnalyticsAPI: _api === null || _api === void 0 || (_api$analytics4 = _api.analytics) === null || _api$analytics4 === void 0 ? void 0 : _api$analytics4.actions
       }),
       contextPanel: getContextPanel(function () {
         var _editorViewRef$curren;
         return (_editorViewRef$curren = editorViewRef.current) !== null && _editorViewRef$curren !== void 0 ? _editorViewRef$curren : undefined;
-      })(options.allowAutoSave, featureFlags, _api === null || _api === void 0 || (_api$contextPanel4 = _api.contextPanel) === null || _api$contextPanel4 === void 0 ? void 0 : _api$contextPanel4.actions.applyChange)
+      })(_api, options.allowAutoSave, featureFlags)
     }
   };
 };

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

@@ -97,50 +97,12 @@ export var createExtensionProviderHandler = function createExtensionProviderHand
     };
   }();
 };
-export var createContextIdentifierProviderHandler = function createContextIdentifierProviderHandler(view) {
-  return /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(name, provider) {
-      var contextIdentifierProvider;
-      return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-        while (1) switch (_context3.prev = _context3.next) {
-          case 0:
-            if (!(name === 'contextIdentifierProvider' && provider)) {
-              _context3.next = 11;
-              break;
-            }
-            _context3.prev = 1;
-            _context3.next = 4;
-            return provider;
-          case 4:
-            contextIdentifierProvider = _context3.sent;
-            updateState({
-              contextIdentifierProvider: contextIdentifierProvider
-            })(view.state, view.dispatch);
-            _context3.next = 11;
-            break;
-          case 8:
-            _context3.prev = 8;
-            _context3.t0 = _context3["catch"](1);
-            updateState({
-              contextIdentifierProvider: undefined
-            })(view.state, view.dispatch);
-          case 11:
-          case "end":
-            return _context3.stop();
-        }
-      }, _callee3, null, [[1, 8]]);
-    }));
-    return function (_x6, _x7) {
-      return _ref3.apply(this, arguments);
-    };
-  }();
-};
-export var handleUpdate = function handleUpdate(_ref4) {
-  var view = _ref4.view,
-    prevState = _ref4.prevState,
-    domAtPos = _ref4.domAtPos,
-    extensionHandlers = _ref4.extensionHandlers,
-    applyChange = _ref4.applyChange;
+export var handleUpdate = function handleUpdate(_ref3) {
+  var view = _ref3.view,
+    prevState = _ref3.prevState,
+    domAtPos = _ref3.domAtPos,
+    extensionHandlers = _ref3.extensionHandlers,
+    applyChange = _ref3.applyChange;
   var state = view.state,
     dispatch = view.dispatch;
   var _getPluginState = getPluginState(state),
@@ -198,13 +160,11 @@ export var handleUpdate = function handleUpdate(_ref4) {
   return true;
 };
 var createPlugin = function createPlugin(dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, pluginInjectionApi) {
-  var _pluginInjectionApi$c;
   var useLongPressSelection = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
   var options = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : {};
   var state = createPluginState(dispatch, {
     showEditButton: false,
-    showContextPanel: false,
-    applyChangeToContextPanel: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c = pluginInjectionApi.contextPanel) === null || _pluginInjectionApi$c === void 0 || (_pluginInjectionApi$c = _pluginInjectionApi$c.actions) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.applyChange
+    showContextPanel: false
   });
   var extensionNodeViewOptions = {
     appearance: options.appearance
@@ -214,23 +174,20 @@ var createPlugin = function createPlugin(dispatch, providerFactory, extensionHan
     view: function view(editorView) {
       var domAtPos = editorView.domAtPos.bind(editorView);
       var extensionProviderHandler = createExtensionProviderHandler(editorView);
-      var contextIdentificationProviderHandler = createContextIdentifierProviderHandler(editorView);
       providerFactory.subscribe('extensionProvider', extensionProviderHandler);
-      providerFactory.subscribe('contextIdentificationProvider', contextIdentificationProviderHandler);
       return {
         update: function update(view, prevState) {
-          var _pluginInjectionApi$c2;
+          var _pluginInjectionApi$c;
           handleUpdate({
             view: view,
             prevState: prevState,
             domAtPos: domAtPos,
             extensionHandlers: extensionHandlers,
-            applyChange: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c2 = pluginInjectionApi.contextPanel) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions.applyChange
+            applyChange: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c = pluginInjectionApi.contextPanel) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.actions.applyChange
           });
         },
         destroy: function destroy() {
           providerFactory.unsubscribe('extensionProvider', extensionProviderHandler);
-          providerFactory.unsubscribe('contextIdentificationProvider', contextIdentificationProviderHandler);
         }
       };
     },
@@ -287,7 +244,7 @@ var createPlugin = function createPlugin(dispatch, providerFactory, extensionHan
         inlineExtension: ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions, pluginInjectionApi),
         multiBodiedExtension: ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions, pluginInjectionApi)
       },
-      handleClickOn: createSelectionClickHandler(['extension', 'bodiedExtension'], function (target) {
+      handleClickOn: createSelectionClickHandler(['extension', 'bodiedExtension', 'multiBodiedExtension'], function (target) {
         return !target.closest('.extension-content');
       }, {
         useLongPressSelection: useLongPressSelection

package/dist/esm/toolbar.js

@@ -179,8 +179,12 @@ export var getToolbarConfig = function getToolbarConfig(_ref) {
            *
            */
           var frameheight = mbeFrameRect.height > 0 ? mbeFrameRect.height : 102;
+          // MBE wrapper header height includes, top margin 8px + bottom margin 8px + Line height of 16px + padding top 8px
+          // Ref: platform/packages/editor/editor-common/src/extensibility/MultiBodiedExtension/styles.ts
+          var wrapperHeaderHeight = 40;
+          var toolbarTopPos = mbeNodeRect.top + frameheight + wrapperHeaderHeight + scrollWrapper.scrollTop;
           return {
-            top: mbeNodeRect.top + frameheight + scrollWrapper.scrollTop,
+            top: toolbarTopPos,
             left: nextPos.left
           };
         },

package/dist/esm/ui/ConfigPanel/ConfigPanel.js

@@ -22,9 +22,8 @@ import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/custom-theme-button';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { isTabGroup } from '@atlaskit/editor-common/extensions';
-import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import Form, { FormFooter } from '@atlaskit/form';
-import { pluginKey as extensionPluginKey } from '../../plugin-key';
 import { ALLOWED_LOGGED_MACRO_PARAMS } from './constants';
 import ErrorMessage from './ErrorMessage';
 import FormContent from './FormContent';
@@ -404,7 +403,8 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
         errorMessage = _this$props7.errorMessage,
         fields = _this$props7.fields,
         isLoading = _this$props7.isLoading,
-        onCancel = _this$props7.onCancel;
+        onCancel = _this$props7.onCancel,
+        api = _this$props7.api;
       var _this$state = this.state,
         currentParameters = _this$state.currentParameters,
         hasParsedParameters = _this$state.hasParsedParameters,
@@ -427,32 +427,20 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
             noValidate: true,
             onKeyDown: handleKeyDown,
             "data-testid": "extension-config-panel"
-          }), _this2.renderHeader(extensionManifest), /*#__PURE__*/React.createElement(WithPluginState, {
-            plugins: {
-              extension: extensionPluginKey
-            },
-            render: function render(_ref6) {
-              var extension = _ref6.extension;
-              return /*#__PURE__*/React.createElement(FormErrorBoundary, {
-                contextIdentifierProvider: extension === null || extension === void 0 ? void 0 : extension.contextIdentifierProvider,
-                extensionKey: extensionManifest.key,
-                fields: fields || []
-              }, /*#__PURE__*/React.createElement(ConfigFormIntl, {
-                canSave: !autoSave,
-                errorMessage: errorMessage,
-                extensionManifest: extensionManifest,
-                fields: fields,
-                firstVisibleFieldName: firstVisibleFieldName,
-                hasParsedParameters: hasParsedParameters,
-                isLoading: isLoading || false,
-                onCancel: onCancel,
-                onFieldChange: onFieldChange,
-                parameters: currentParameters,
-                submitting: submitting,
-                contextIdentifierProvider: extension === null || extension === void 0 ? void 0 : extension.contextIdentifierProvider,
-                featureFlags: featureFlags
-              }));
-            }
+          }), _this2.renderHeader(extensionManifest), /*#__PURE__*/React.createElement(ConfigFormIntlWithBoundary, {
+            api: api,
+            canSave: !autoSave,
+            errorMessage: errorMessage,
+            extensionManifest: extensionManifest,
+            fields: fields !== null && fields !== void 0 ? fields : [],
+            firstVisibleFieldName: firstVisibleFieldName,
+            hasParsedParameters: hasParsedParameters,
+            isLoading: isLoading || false,
+            onCancel: onCancel,
+            onFieldChange: onFieldChange,
+            parameters: currentParameters,
+            submitting: submitting,
+            featureFlags: featureFlags
           }));
         });
       });
@@ -460,6 +448,44 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
   }]);
   return ConfigPanel;
 }(React.Component);
+function ConfigFormIntlWithBoundary(_ref6) {
+  var api = _ref6.api,
+    fields = _ref6.fields,
+    submitting = _ref6.submitting,
+    parameters = _ref6.parameters,
+    featureFlags = _ref6.featureFlags,
+    canSave = _ref6.canSave,
+    extensionManifest = _ref6.extensionManifest,
+    onFieldChange = _ref6.onFieldChange,
+    onCancel = _ref6.onCancel,
+    isLoading = _ref6.isLoading,
+    hasParsedParameters = _ref6.hasParsedParameters,
+    firstVisibleFieldName = _ref6.firstVisibleFieldName,
+    errorMessage = _ref6.errorMessage;
+  var _useSharedPluginState = useSharedPluginState(api, ['contextIdentifier']),
+    contextIdentifierState = _useSharedPluginState.contextIdentifierState;
+  var _ref7 = contextIdentifierState !== null && contextIdentifierState !== void 0 ? contextIdentifierState : {},
+    contextIdentifierProvider = _ref7.contextIdentifierProvider;
+  return /*#__PURE__*/React.createElement(FormErrorBoundary, {
+    contextIdentifierProvider: contextIdentifierProvider,
+    extensionKey: extensionManifest.key,
+    fields: fields
+  }, /*#__PURE__*/React.createElement(ConfigFormIntl, {
+    canSave: canSave,
+    errorMessage: errorMessage,
+    extensionManifest: extensionManifest,
+    fields: fields,
+    firstVisibleFieldName: firstVisibleFieldName,
+    hasParsedParameters: hasParsedParameters,
+    isLoading: isLoading || false,
+    onCancel: onCancel,
+    onFieldChange: onFieldChange,
+    parameters: parameters,
+    submitting: submitting,
+    contextIdentifierProvider: contextIdentifierProvider,
+    featureFlags: featureFlags
+  }));
+}
 export default withAnalyticsContext({
   source: 'ConfigPanel'
 })(withAnalyticsEvents()(ConfigPanel));

package/dist/esm/ui/ConfigPanel/ConfigPanelFieldsLoader.js

@@ -77,7 +77,8 @@ export default function FieldsLoader(_ref) {
     showHeader = _ref.showHeader,
     featureFlags = _ref.featureFlags,
     onChange = _ref.onChange,
-    onCancel = _ref.onCancel;
+    onCancel = _ref.onCancel,
+    api = _ref.api;
   var _useStateFromPromise = useStateFromPromise(function () {
       return extensionProvider.getExtension(extensionType, extensionKey);
     }, [extensionProvider, extensionType, extensionKey]),
@@ -94,6 +95,7 @@ export default function FieldsLoader(_ref) {
     extensionParameters: extensionParameters
   }, function (fields) {
     return /*#__PURE__*/React.createElement(ConfigPanel, {
+      api: api,
       extensionManifest: extensionManifest,
       isLoading: !extensionManifest || errorMessage === null && !fields,
       fields: fields,

package/dist/types/actions.d.ts

@@ -8,13 +8,10 @@ import type { Fragment, Mark, Node as PmNode, Schema } from '@atlaskit/editor-pr
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 export declare const buildExtensionNode: <S extends Schema<any, any>>(type: 'inlineExtension' | 'extension' | 'bodiedExtension' | 'multiBodiedExtension', schema: S, attrs: object, content?: Fragment, marks?: readonly Mark[]) => PmNode;
 export declare const performNodeUpdate: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => (type: 'inlineExtension' | 'extension' | 'bodiedExtension' | 'multiBodiedExtension', newAttrs: object, content: Fragment, marks: readonly Mark[], shouldScrollIntoView: boolean) => Command;
-interface EditorActions {
-    _privateGetEditorView: () => EditorView | undefined;
-}
-export declare const editSelectedExtension: (editorActions: EditorActions) => boolean;
 export declare const editExtension: (macroProvider: MacroProvider | null | undefined, applyChangeToContextPanel: ApplyChangeHandler | undefined, editorAnalyticsAPI: EditorAnalyticsAPI | undefined, updateExtension?: Promise<UpdateExtension<object> | void>) => Command;
 type Props = {
     editorViewRef: Record<'current', EditorView | null>;
     editorAnalyticsAPI: EditorAnalyticsAPI | undefined;
+    applyChangeToContextPanel: ApplyChangeHandler | undefined;
 };
-export declare const createEditSelectedExtensionAction: ({ editorViewRef, editorAnalyticsAPI }: Props) => () => boolean;
+export declare const createEditSelectedExtensionAction: ({ editorViewRef, editorAnalyticsAPI, applyChangeToContextPanel }: Props) => () => boolean;

package/dist/types/context-panel.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
-import type { FeatureFlags } from '@atlaskit/editor-common/types';
-import type { ApplyChangeHandler } from '@atlaskit/editor-plugin-context-panel';
+import type { ExtractInjectionAPI, FeatureFlags } from '@atlaskit/editor-common/types';
 import type { Node } from '@atlaskit/editor-prosemirror/model';
 import type { EditorState, Selection } from '@atlaskit/editor-prosemirror/state';
 import type { ContentNodeWithPos } from '@atlaskit/editor-prosemirror/utils';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { ExtensionPlugin } from './types';
 export declare const duplicateSelection: (selectionToDuplicate: Selection, doc: Node) => Selection | undefined;
-export declare const getContextPanel: (getEditorView?: () => EditorView | undefined) => (allowAutoSave?: boolean, featureFlags?: FeatureFlags, applyChange?: ApplyChangeHandler) => (state: EditorState) => JSX.Element | undefined;
+export declare const getContextPanel: (getEditorView?: () => EditorView | undefined) => (api: ExtractInjectionAPI<ExtensionPlugin> | undefined, allowAutoSave?: boolean, featureFlags?: FeatureFlags) => (state: EditorState) => JSX.Element | undefined;
 export declare function onChangeAction(editorView: EditorView, updatedParameters: object | undefined, oldParameters: object | undefined, nodeWithPos: ContentNodeWithPos, onSaving?: () => void): Promise<void>;

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

@@ -1,7 +1,7 @@
 import type { Dispatch, EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { ExtensionHandlers, ExtensionProvider } from '@atlaskit/editor-common/extensions';
 import type { PortalProviderAPI } from '@atlaskit/editor-common/portal-provider';
-import type { ContextIdentifierProvider, ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import type { EditorAppearance, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { ApplyChangeHandler } from '@atlaskit/editor-plugin-context-panel';
@@ -11,7 +11,6 @@ import { createCommand, getPluginState } from '../plugin-factory';
 import { pluginKey } from '../plugin-key';
 import type { ExtensionPlugin } from '../types';
 export declare const createExtensionProviderHandler: (view: EditorView) => (name: string, provider?: Promise<ExtensionProvider>) => Promise<void>;
-export declare const createContextIdentifierProviderHandler: (view: EditorView) => (name: string, provider?: Promise<ContextIdentifierProvider>) => Promise<void>;
 export declare const handleUpdate: ({ view, prevState, domAtPos, extensionHandlers, applyChange, }: {
     view: EditorView;
     prevState: EditorState;

package/dist/types/types.d.ts

@@ -1,8 +1,9 @@
 import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { ExtensionAPI, ExtensionHandlers, ExtensionProvider, Parameters, TransformAfter, TransformBefore, UpdateExtension } from '@atlaskit/editor-common/extensions';
-import type { ContextIdentifierProvider, MacroProvider } from '@atlaskit/editor-common/provider-factory';
+import type { MacroProvider } from '@atlaskit/editor-common/provider-factory';
 import type { EditorAppearance, LongPressSelectionPluginOptions, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
+import type { ContextIdentifierPlugin } from '@atlaskit/editor-plugin-context-identifier';
 import type { ApplyChangeHandler, ContextPanelPlugin } from '@atlaskit/editor-plugin-context-panel';
 import type { DecorationsPlugin } from '@atlaskit/editor-plugin-decorations';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
@@ -21,11 +22,9 @@ export type ExtensionState<T extends Parameters = Parameters> = {
     updateExtension?: Promise<UpdateExtension<T> | void>;
     element?: HTMLElement;
     extensionProvider?: ExtensionProvider<T>;
-    contextIdentifierProvider?: ContextIdentifierProvider;
     processParametersBefore?: TransformBefore<T>;
     processParametersAfter?: TransformAfter<T>;
     positions?: Record<number, number>;
-    applyChangeToContextPanel: ApplyChangeHandler | undefined;
 };
 export type ExtensionAction<T extends Parameters = Parameters> = {
     type: 'UPDATE_STATE';
@@ -53,7 +52,8 @@ export type ExtensionPlugin = NextEditorPlugin<'extension', {
         OptionalPlugin<FeatureFlagsPlugin>,
         WidthPlugin,
         DecorationsPlugin,
-        OptionalPlugin<ContextPanelPlugin>
+        OptionalPlugin<ContextPanelPlugin>,
+        OptionalPlugin<ContextIdentifierPlugin>
     ];
     sharedState: {
         showContextPanel: boolean | undefined;

package/dist/types/ui/ConfigPanel/ConfigPanel.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
 import type { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
 import type { ExtensionManifest, FieldDefinition, OnSaveCallback, Parameters } from '@atlaskit/editor-common/extensions';
-import type { FeatureFlags } from '@atlaskit/editor-common/types';
-import type { RejectSave } from '../../types';
+import type { ExtractInjectionAPI, FeatureFlags } from '@atlaskit/editor-common/types';
+import type { ExtensionPlugin, RejectSave } from '../../types';
 type Props = {
     extensionManifest?: ExtensionManifest;
     fields?: FieldDefinition[];
@@ -17,6 +17,7 @@ type Props = {
     errorMessage: string | null;
     isLoading?: boolean;
     featureFlags?: FeatureFlags;
+    api: ExtractInjectionAPI<ExtensionPlugin> | undefined;
 } & WithAnalyticsEventsProps;
-declare const _default: React.ForwardRefExoticComponent<Pick<Omit<Props, keyof WithAnalyticsEventsProps> & React.RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "featureFlags" | "autoSaveReject" | "key" | "parameters" | "autoSave" | "onChange" | "errorMessage" | "analyticsContext" | "fields" | "extensionManifest" | "isLoading" | "onCancel" | "autoSaveTrigger" | "showHeader" | "closeOnEsc"> & React.RefAttributes<any>>;
+declare const _default: React.ForwardRefExoticComponent<Pick<Omit<Props, keyof WithAnalyticsEventsProps> & React.RefAttributes<any> & import("@atlaskit/analytics-next").WithContextProps, "featureFlags" | "api" | "autoSaveReject" | "key" | "parameters" | "autoSave" | "onChange" | "errorMessage" | "analyticsContext" | "fields" | "extensionManifest" | "isLoading" | "onCancel" | "autoSaveTrigger" | "showHeader" | "closeOnEsc"> & React.RefAttributes<any>>;
 export default _default;

package/dist/types/ui/ConfigPanel/ConfigPanelFieldsLoader.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { ExtensionKey, ExtensionProvider, ExtensionType, Parameters } from '@atlaskit/editor-common/extensions';
-import type { FeatureFlags } from '@atlaskit/editor-common/types';
-import type { RejectSave } from '../../types';
+import type { ExtractInjectionAPI, FeatureFlags } from '@atlaskit/editor-common/types';
+import type { ExtensionPlugin, RejectSave } from '../../types';
 export type PublicProps = {
     extensionProvider: ExtensionProvider;
     extensionType: ExtensionType;
@@ -17,5 +17,6 @@ export type PublicProps = {
     featureFlags?: FeatureFlags;
     onChange: (data: Parameters) => void;
     onCancel: () => void;
+    api: ExtractInjectionAPI<ExtensionPlugin> | undefined;
 };
-export default function FieldsLoader({ extensionType, extensionKey, nodeKey, extensionProvider, extensionParameters, parameters, autoSave, autoSaveTrigger, autoSaveReject, closeOnEsc, showHeader, featureFlags, onChange, onCancel, }: PublicProps): JSX.Element;
+export default function FieldsLoader({ extensionType, extensionKey, nodeKey, extensionProvider, extensionParameters, parameters, autoSave, autoSaveTrigger, autoSaveReject, closeOnEsc, showHeader, featureFlags, onChange, onCancel, api, }: PublicProps): JSX.Element;

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

@@ -8,13 +8,10 @@ import type { Fragment, Mark, Node as PmNode, Schema } from '@atlaskit/editor-pr
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 export declare const buildExtensionNode: <S extends Schema<any, any>>(type: 'inlineExtension' | 'extension' | 'bodiedExtension' | 'multiBodiedExtension', schema: S, attrs: object, content?: Fragment, marks?: readonly Mark[]) => PmNode;
 export declare const performNodeUpdate: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => (type: 'inlineExtension' | 'extension' | 'bodiedExtension' | 'multiBodiedExtension', newAttrs: object, content: Fragment, marks: readonly Mark[], shouldScrollIntoView: boolean) => Command;
-interface EditorActions {
-    _privateGetEditorView: () => EditorView | undefined;
-}
-export declare const editSelectedExtension: (editorActions: EditorActions) => boolean;
 export declare const editExtension: (macroProvider: MacroProvider | null | undefined, applyChangeToContextPanel: ApplyChangeHandler | undefined, editorAnalyticsAPI: EditorAnalyticsAPI | undefined, updateExtension?: Promise<UpdateExtension<object> | void>) => Command;
 type Props = {
     editorViewRef: Record<'current', EditorView | null>;
     editorAnalyticsAPI: EditorAnalyticsAPI | undefined;
+    applyChangeToContextPanel: ApplyChangeHandler | undefined;
 };
-export declare const createEditSelectedExtensionAction: ({ editorViewRef, editorAnalyticsAPI }: Props) => () => boolean;
+export declare const createEditSelectedExtensionAction: ({ editorViewRef, editorAnalyticsAPI, applyChangeToContextPanel }: Props) => () => boolean;