@atlaskit/editor-core 189.6.0 → 189.6.2

package/dist/es2019/composable-editor/editor.js

@@ -7,7 +7,6 @@ import { ACTION, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { EditorExperience, ExperienceStore } from '@atlaskit/editor-common/ufo';
 import { getAnalyticsAppearance, startMeasure, stopMeasure } from '@atlaskit/editor-common/utils';
 import { basePlugin } from '@atlaskit/editor-plugin-base';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import EditorActions from '../actions';
 import { createFeatureFlagsFromProps } from '../create-editor/feature-flags-from-props';
 import { name, version } from '../version-wrapper';
@@ -20,187 +19,17 @@ import sendDurationAnalytics from './utils/sendDurationAnalytics';
 import trackEditorActions from './utils/trackEditorActions';
 import useMeasureEditorMountTime from './hooks/useMeasureEditorMountTime';
 import useProviderFactory from './hooks/useProviderFactory';
+import useMemoEditorProps from './hooks/useMemoEditorProps';
 
 /**
  * Editor wrapper that deals with the lifecycle logic of the editor
  */
 function Editor(passedProps) {
-  var _editorContext$editor;
-  const defaultProps = {
-    appearance: 'comment',
-    disabled: false,
-    quickInsert: true
-  };
-  const props = {
-    ...defaultProps,
-    ...passedProps
-  };
-  const editorContext = useEditorContext();
-  const editorActions = useRef((_editorContext$editor = editorContext === null || editorContext === void 0 ? void 0 : editorContext.editorActions) !== null && _editorContext$editor !== void 0 ? _editorContext$editor : new EditorActions());
-  const startTime = useRef(performance.now());
-  const {
-    createAnalyticsEvent
-  } = useAnalyticsEvents();
-  const experienceStore = useRef();
-  const handleAnalyticsEvent = data => fireAnalyticsEvent(createAnalyticsEvent)(data);
-  useConstructor(() => {
-    trackEditorActions(editorActions.current, props.performanceTracking, value => handleAnalyticsEvent(value));
-  });
-  const getExperienceStore = () => experienceStore.current;
-  const onEditorCreated = instance => {
-    var _props$featureFlags;
-    editorActions.current._privateRegisterEditor(instance.view, instance.eventDispatcher, instance.transformer, () => createFeatureFlagsFromProps(props));
-    if ((_props$featureFlags = props.featureFlags) !== null && _props$featureFlags !== void 0 && _props$featureFlags.ufo) {
-      var _experienceStore$curr;
-      experienceStore.current = ExperienceStore.getInstance(instance.view);
-      (_experienceStore$curr = experienceStore.current) === null || _experienceStore$curr === void 0 ? void 0 : _experienceStore$curr.start(EditorExperience.loadEditor, startTime.current);
-    }
-    if (props.onEditorReady) {
-      var _props$performanceTra, _props$performanceTra2, _props$featureFlags2;
-      const measureEditorReady = (props === null || props === void 0 ? void 0 : (_props$performanceTra = props.performanceTracking) === null || _props$performanceTra === void 0 ? void 0 : (_props$performanceTra2 = _props$performanceTra.onEditorReadyCallbackTracking) === null || _props$performanceTra2 === void 0 ? void 0 : _props$performanceTra2.enabled) || ((_props$featureFlags2 = props.featureFlags) === null || _props$featureFlags2 === void 0 ? void 0 : _props$featureFlags2.ufo);
-      measureEditorReady && startMeasure(measurements.ON_EDITOR_READY_CALLBACK);
-      props.onEditorReady(editorActions.current);
-      measureEditorReady && stopMeasure(measurements.ON_EDITOR_READY_CALLBACK, sendDurationAnalytics(ACTION.ON_EDITOR_READY_CALLBACK, props, getExperienceStore, createAnalyticsEvent));
-    }
-  };
-  const onEditorDestroyed = _instance => {
-    var _props$onDestroy;
-    editorActions.current._privateUnregisterEditor();
-    (_props$onDestroy = props.onDestroy) === null || _props$onDestroy === void 0 ? void 0 : _props$onDestroy.call(props);
-  };
-  useMeasureEditorMountTime(props, getExperienceStore, createAnalyticsEvent);
-  const providerFactory = useProviderFactory(props, editorActions.current, createAnalyticsEvent);
-  return jsx(EditorInternal, {
-    props: props,
-    handleAnalyticsEvent: handleAnalyticsEvent,
-    createAnalyticsEvent: createAnalyticsEvent,
-    preset: props.preset,
-    handleSave: view => {
-      var _props$onSave;
-      return (_props$onSave = props.onSave) === null || _props$onSave === void 0 ? void 0 : _props$onSave.call(props, view);
-    },
-    editorActions: editorActions.current,
-    onEditorCreated: onEditorCreated,
-    onEditorDestroyed: onEditorDestroyed,
-    providerFactory: providerFactory
-  });
-}
-/**
- * Improved memonization for  Editor wrapper that deals with the lifecycle logic of the editor
- */
-function EditorButBetter(passedProps) {
   const propsRef = useRef(passedProps);
-  const props = useMemo(() => {
-    // That sounds awful but this is the only way to make sure we didn't missed any EditorProps
-    const allProps = {
-      preset: passedProps.preset,
-      appearance: passedProps.appearance,
-      contentComponents: passedProps.contentComponents,
-      primaryToolbarIconBefore: passedProps.primaryToolbarIconBefore,
-      secondaryToolbarComponents: passedProps.secondaryToolbarComponents,
-      persistScrollGutter: passedProps.persistScrollGutter,
-      quickInsert: passedProps.quickInsert,
-      shouldFocus: passedProps.shouldFocus,
-      disabled: passedProps.disabled,
-      contextPanel: passedProps.contextPanel,
-      errorReporterHandler: passedProps.errorReporterHandler,
-      contentTransformerProvider: passedProps.contentTransformerProvider,
-      maxHeight: passedProps.maxHeight,
-      minHeight: passedProps.minHeight,
-      placeholder: passedProps.placeholder,
-      placeholderBracketHint: passedProps.placeholderBracketHint,
-      defaultValue: passedProps.defaultValue,
-      assistiveLabel: passedProps.assistiveLabel,
-      popupsMountPoint: passedProps.popupsMountPoint,
-      popupsBoundariesElement: passedProps.popupsBoundariesElement,
-      popupsScrollableElement: passedProps.popupsScrollableElement,
-      editorActions: passedProps.editorActions,
-      onEditorReady: passedProps.onEditorReady,
-      onDestroy: passedProps.onDestroy,
-      onChange: passedProps.onChange,
-      onCancel: passedProps.onCancel,
-      inputSamplingLimit: passedProps.inputSamplingLimit,
-      extensionProviders: passedProps.extensionProviders,
-      UNSAFE_useAnalyticsContext: passedProps.UNSAFE_useAnalyticsContext,
-      trackValidTransactions: passedProps.trackValidTransactions,
-      useStickyToolbar: passedProps.useStickyToolbar,
-      featureFlags: passedProps.featureFlags,
-      onSave: passedProps.onSave,
-      performanceTracking: passedProps.performanceTracking,
-      sanitizePrivateContent: passedProps.sanitizePrivateContent,
-      media: passedProps.media,
-      collabEdit: passedProps.collabEdit,
-      primaryToolbarComponents: passedProps.primaryToolbarComponents,
-      allowUndoRedoButtons: passedProps.allowUndoRedoButtons,
-      linking: passedProps.linking,
-      hideAvatarGroup: passedProps.hideAvatarGroup,
-      activityProvider: passedProps.activityProvider,
-      searchProvider: passedProps.searchProvider,
-      annotationProviders: passedProps.annotationProviders,
-      collabEditProvider: passedProps.collabEditProvider,
-      presenceProvider: passedProps.presenceProvider,
-      emojiProvider: passedProps.emojiProvider,
-      taskDecisionProvider: passedProps.taskDecisionProvider,
-      legacyImageUploadProvider: passedProps.legacyImageUploadProvider,
-      mentionProvider: passedProps.mentionProvider,
-      autoformattingProvider: passedProps.autoformattingProvider,
-      macroProvider: passedProps.macroProvider,
-      contextIdentifierProvider: passedProps.contextIdentifierProvider,
-      allowExpand: passedProps.allowExpand,
-      allowNestedTasks: passedProps.allowNestedTasks,
-      allowBlockType: passedProps.allowBlockType,
-      allowTasksAndDecisions: passedProps.allowTasksAndDecisions,
-      allowBreakout: passedProps.allowBreakout,
-      allowRule: passedProps.allowRule,
-      allowHelpDialog: passedProps.allowHelpDialog,
-      allowJiraIssue: passedProps.allowJiraIssue,
-      allowPanel: passedProps.allowPanel,
-      allowExtension: passedProps.allowExtension,
-      allowConfluenceInlineComment: passedProps.allowConfluenceInlineComment,
-      allowTemplatePlaceholders: passedProps.allowTemplatePlaceholders,
-      allowDate: passedProps.allowDate,
-      allowLayouts: passedProps.allowLayouts,
-      allowStatus: passedProps.allowStatus,
-      allowTextAlignment: passedProps.allowTextAlignment,
-      allowIndentation: passedProps.allowIndentation,
-      showIndentationButtons: passedProps.showIndentationButtons,
-      allowNewInsertionBehaviour: passedProps.allowNewInsertionBehaviour,
-      allowFindReplace: passedProps.allowFindReplace,
-      UNSAFE_allowBorderMark: passedProps.UNSAFE_allowBorderMark,
-      allowBorderMark: passedProps.allowBorderMark,
-      allowFragmentMark: passedProps.allowFragmentMark,
-      autoScrollIntoView: passedProps.autoScrollIntoView,
-      elementBrowser: passedProps.elementBrowser,
-      maxContentSize: passedProps.maxContentSize,
-      saveOnEnter: passedProps.saveOnEnter,
-      feedbackInfo: passedProps.feedbackInfo,
-      mention: passedProps.mention,
-      mentionInsertDisplayName: passedProps.mentionInsertDisplayName,
-      uploadErrorHandler: passedProps.uploadErrorHandler,
-      waitForMediaUpload: passedProps.waitForMediaUpload,
-      extensionHandlers: passedProps.extensionHandlers,
-      allowTextColor: passedProps.allowTextColor,
-      allowTables: passedProps.allowTables,
-      insertMenuItems: passedProps.insertMenuItems,
-      UNSAFE_cards: passedProps.UNSAFE_cards,
-      smartLinks: passedProps.smartLinks,
-      allowAnalyticsGASV3: passedProps.allowAnalyticsGASV3,
-      codeBlock: passedProps.codeBlock,
-      textFormatting: passedProps.textFormatting,
-      dangerouslyAppendPlugins: passedProps.dangerouslyAppendPlugins
-    };
-    const defaultProps = {
-      appearance: 'comment',
-      disabled: false,
-      quickInsert: true
-    };
-    const nextProps = {
-      ...defaultProps,
-      ...allProps
-    };
-    propsRef.current = nextProps;
-    return nextProps;
-  }, [passedProps.preset, passedProps.appearance, passedProps.contentComponents, passedProps.primaryToolbarIconBefore, passedProps.secondaryToolbarComponents, passedProps.persistScrollGutter, passedProps.quickInsert, passedProps.shouldFocus, passedProps.disabled, passedProps.contextPanel, passedProps.errorReporterHandler, passedProps.contentTransformerProvider, passedProps.maxHeight, passedProps.minHeight, passedProps.placeholder, passedProps.placeholderBracketHint, passedProps.defaultValue, passedProps.assistiveLabel, passedProps.popupsMountPoint, passedProps.popupsBoundariesElement, passedProps.popupsScrollableElement, passedProps.editorActions, passedProps.onEditorReady, passedProps.onDestroy, passedProps.onChange, passedProps.onCancel, passedProps.inputSamplingLimit, passedProps.extensionProviders, passedProps.UNSAFE_useAnalyticsContext, passedProps.trackValidTransactions, passedProps.useStickyToolbar, passedProps.featureFlags, passedProps.onSave, passedProps.performanceTracking, passedProps.sanitizePrivateContent, passedProps.media, passedProps.collabEdit, passedProps.primaryToolbarComponents, passedProps.allowUndoRedoButtons, passedProps.linking, passedProps.hideAvatarGroup, passedProps.activityProvider, passedProps.searchProvider, passedProps.annotationProviders, passedProps.collabEditProvider, passedProps.presenceProvider, passedProps.emojiProvider, passedProps.taskDecisionProvider, passedProps.legacyImageUploadProvider, passedProps.mentionProvider, passedProps.autoformattingProvider, passedProps.macroProvider, passedProps.contextIdentifierProvider, passedProps.allowExpand, passedProps.allowNestedTasks, passedProps.allowBlockType, passedProps.allowTasksAndDecisions, passedProps.allowBreakout, passedProps.allowRule, passedProps.allowHelpDialog, passedProps.allowJiraIssue, passedProps.allowPanel, passedProps.allowExtension, passedProps.allowConfluenceInlineComment, passedProps.allowTemplatePlaceholders, passedProps.allowDate, passedProps.allowLayouts, passedProps.allowStatus, passedProps.allowTextAlignment, passedProps.allowIndentation, passedProps.showIndentationButtons, passedProps.allowNewInsertionBehaviour, passedProps.allowFindReplace, passedProps.UNSAFE_allowBorderMark, passedProps.allowBorderMark, passedProps.allowFragmentMark, passedProps.autoScrollIntoView, passedProps.elementBrowser, passedProps.maxContentSize, passedProps.saveOnEnter, passedProps.feedbackInfo, passedProps.mention, passedProps.mentionInsertDisplayName, passedProps.uploadErrorHandler, passedProps.waitForMediaUpload, passedProps.extensionHandlers, passedProps.allowTextColor, passedProps.allowTables, passedProps.insertMenuItems, passedProps.UNSAFE_cards, passedProps.smartLinks, passedProps.allowAnalyticsGASV3, passedProps.codeBlock, passedProps.textFormatting, passedProps.dangerouslyAppendPlugins]);
+  const props = useMemoEditorProps(passedProps);
+  useMemo(() => {
+    propsRef.current = props;
+  }, [props]);
   const editorContext = useEditorContext();
   const editorActionsPlaceholderInstance = useMemo(() => new EditorActions(), []);
   const editorActions = editorContext.editorActions || editorActionsPlaceholderInstance;
@@ -230,9 +59,9 @@ function EditorButBetter(passedProps) {
     } = propsRef.current;
     editorActions._privateRegisterEditor(instance.view, instance.eventDispatcher, instance.transformer, getFeatureFlagsFromRef);
     if (featureFlags !== null && featureFlags !== void 0 && featureFlags.ufo) {
-      var _experienceStore$curr2;
+      var _experienceStore$curr;
       experienceStore.current = ExperienceStore.getInstance(instance.view);
-      (_experienceStore$curr2 = experienceStore.current) === null || _experienceStore$curr2 === void 0 ? void 0 : _experienceStore$curr2.start(EditorExperience.loadEditor, startTime.current);
+      (_experienceStore$curr = experienceStore.current) === null || _experienceStore$curr === void 0 ? void 0 : _experienceStore$curr.start(EditorExperience.loadEditor, startTime.current);
     }
     if (onEditorReady) {
       var _performanceTracking$;
@@ -287,13 +116,6 @@ export function ComposableEditor(props) {
       editorSessionId: editorSessionId.current
     };
   }, [props.appearance]);
-  if (getBooleanFF('platform.editor.less-editor-props-rerendering')) {
-    return jsx(FabricEditorAnalyticsContext
-    // @ts-expect-error Type 'string' is not assignable to type '"editorCore" | "renderer"'.
-    , {
-      data: data
-    }, jsx(EditorButBetter, props));
-  }
   return jsx(FabricEditorAnalyticsContext
   // @ts-expect-error Type 'string' is not assignable to type '"editorCore" | "renderer"'.
   , {

package/dist/es2019/composable-editor/hooks/useMemoEditorProps.js

@@ -0,0 +1,115 @@
+import { useMemo } from 'react';
+export const useMemoEditorProps = passedProps => {
+  const memodProps = useMemo(() => {
+    // That sounds awful but this is the only way to make sure we didn't missed any EditorProps
+    const allProps = {
+      preset: passedProps.preset,
+      appearance: passedProps.appearance,
+      contentComponents: passedProps.contentComponents,
+      primaryToolbarIconBefore: passedProps.primaryToolbarIconBefore,
+      secondaryToolbarComponents: passedProps.secondaryToolbarComponents,
+      persistScrollGutter: passedProps.persistScrollGutter,
+      quickInsert: passedProps.quickInsert,
+      shouldFocus: passedProps.shouldFocus,
+      disabled: passedProps.disabled,
+      contextPanel: passedProps.contextPanel,
+      errorReporterHandler: passedProps.errorReporterHandler,
+      contentTransformerProvider: passedProps.contentTransformerProvider,
+      maxHeight: passedProps.maxHeight,
+      minHeight: passedProps.minHeight,
+      placeholder: passedProps.placeholder,
+      placeholderBracketHint: passedProps.placeholderBracketHint,
+      defaultValue: passedProps.defaultValue,
+      assistiveLabel: passedProps.assistiveLabel,
+      popupsMountPoint: passedProps.popupsMountPoint,
+      popupsBoundariesElement: passedProps.popupsBoundariesElement,
+      popupsScrollableElement: passedProps.popupsScrollableElement,
+      editorActions: passedProps.editorActions,
+      onEditorReady: passedProps.onEditorReady,
+      onDestroy: passedProps.onDestroy,
+      onChange: passedProps.onChange,
+      onCancel: passedProps.onCancel,
+      inputSamplingLimit: passedProps.inputSamplingLimit,
+      extensionProviders: passedProps.extensionProviders,
+      UNSAFE_useAnalyticsContext: passedProps.UNSAFE_useAnalyticsContext,
+      trackValidTransactions: passedProps.trackValidTransactions,
+      useStickyToolbar: passedProps.useStickyToolbar,
+      featureFlags: passedProps.featureFlags,
+      onSave: passedProps.onSave,
+      performanceTracking: passedProps.performanceTracking,
+      sanitizePrivateContent: passedProps.sanitizePrivateContent,
+      media: passedProps.media,
+      collabEdit: passedProps.collabEdit,
+      primaryToolbarComponents: passedProps.primaryToolbarComponents,
+      allowUndoRedoButtons: passedProps.allowUndoRedoButtons,
+      linking: passedProps.linking,
+      hideAvatarGroup: passedProps.hideAvatarGroup,
+      activityProvider: passedProps.activityProvider,
+      searchProvider: passedProps.searchProvider,
+      annotationProviders: passedProps.annotationProviders,
+      collabEditProvider: passedProps.collabEditProvider,
+      presenceProvider: passedProps.presenceProvider,
+      emojiProvider: passedProps.emojiProvider,
+      taskDecisionProvider: passedProps.taskDecisionProvider,
+      legacyImageUploadProvider: passedProps.legacyImageUploadProvider,
+      mentionProvider: passedProps.mentionProvider,
+      autoformattingProvider: passedProps.autoformattingProvider,
+      macroProvider: passedProps.macroProvider,
+      contextIdentifierProvider: passedProps.contextIdentifierProvider,
+      allowExpand: passedProps.allowExpand,
+      allowNestedTasks: passedProps.allowNestedTasks,
+      allowBlockType: passedProps.allowBlockType,
+      allowTasksAndDecisions: passedProps.allowTasksAndDecisions,
+      allowBreakout: passedProps.allowBreakout,
+      allowRule: passedProps.allowRule,
+      allowHelpDialog: passedProps.allowHelpDialog,
+      allowJiraIssue: passedProps.allowJiraIssue,
+      allowPanel: passedProps.allowPanel,
+      allowExtension: passedProps.allowExtension,
+      allowConfluenceInlineComment: passedProps.allowConfluenceInlineComment,
+      allowTemplatePlaceholders: passedProps.allowTemplatePlaceholders,
+      allowDate: passedProps.allowDate,
+      allowLayouts: passedProps.allowLayouts,
+      allowStatus: passedProps.allowStatus,
+      allowTextAlignment: passedProps.allowTextAlignment,
+      allowIndentation: passedProps.allowIndentation,
+      showIndentationButtons: passedProps.showIndentationButtons,
+      allowNewInsertionBehaviour: passedProps.allowNewInsertionBehaviour,
+      allowFindReplace: passedProps.allowFindReplace,
+      UNSAFE_allowBorderMark: passedProps.UNSAFE_allowBorderMark,
+      allowBorderMark: passedProps.allowBorderMark,
+      allowFragmentMark: passedProps.allowFragmentMark,
+      autoScrollIntoView: passedProps.autoScrollIntoView,
+      elementBrowser: passedProps.elementBrowser,
+      maxContentSize: passedProps.maxContentSize,
+      saveOnEnter: passedProps.saveOnEnter,
+      feedbackInfo: passedProps.feedbackInfo,
+      mention: passedProps.mention,
+      mentionInsertDisplayName: passedProps.mentionInsertDisplayName,
+      uploadErrorHandler: passedProps.uploadErrorHandler,
+      waitForMediaUpload: passedProps.waitForMediaUpload,
+      extensionHandlers: passedProps.extensionHandlers,
+      allowTextColor: passedProps.allowTextColor,
+      allowTables: passedProps.allowTables,
+      insertMenuItems: passedProps.insertMenuItems,
+      UNSAFE_cards: passedProps.UNSAFE_cards,
+      smartLinks: passedProps.smartLinks,
+      allowAnalyticsGASV3: passedProps.allowAnalyticsGASV3,
+      codeBlock: passedProps.codeBlock,
+      textFormatting: passedProps.textFormatting,
+      dangerouslyAppendPlugins: passedProps.dangerouslyAppendPlugins
+    };
+    const defaultProps = {
+      appearance: 'comment',
+      disabled: false,
+      quickInsert: true
+    };
+    const nextProps = {
+      ...defaultProps,
+      ...allProps
+    };
+    return nextProps;
+  }, [passedProps.preset, passedProps.appearance, passedProps.contentComponents, passedProps.primaryToolbarIconBefore, passedProps.secondaryToolbarComponents, passedProps.persistScrollGutter, passedProps.quickInsert, passedProps.shouldFocus, passedProps.disabled, passedProps.contextPanel, passedProps.errorReporterHandler, passedProps.contentTransformerProvider, passedProps.maxHeight, passedProps.minHeight, passedProps.placeholder, passedProps.placeholderBracketHint, passedProps.defaultValue, passedProps.assistiveLabel, passedProps.popupsMountPoint, passedProps.popupsBoundariesElement, passedProps.popupsScrollableElement, passedProps.editorActions, passedProps.onEditorReady, passedProps.onDestroy, passedProps.onChange, passedProps.onCancel, passedProps.inputSamplingLimit, passedProps.extensionProviders, passedProps.UNSAFE_useAnalyticsContext, passedProps.trackValidTransactions, passedProps.useStickyToolbar, passedProps.featureFlags, passedProps.onSave, passedProps.performanceTracking, passedProps.sanitizePrivateContent, passedProps.media, passedProps.collabEdit, passedProps.primaryToolbarComponents, passedProps.allowUndoRedoButtons, passedProps.linking, passedProps.hideAvatarGroup, passedProps.activityProvider, passedProps.searchProvider, passedProps.annotationProviders, passedProps.collabEditProvider, passedProps.presenceProvider, passedProps.emojiProvider, passedProps.taskDecisionProvider, passedProps.legacyImageUploadProvider, passedProps.mentionProvider, passedProps.autoformattingProvider, passedProps.macroProvider, passedProps.contextIdentifierProvider, passedProps.allowExpand, passedProps.allowNestedTasks, passedProps.allowBlockType, passedProps.allowTasksAndDecisions, passedProps.allowBreakout, passedProps.allowRule, passedProps.allowHelpDialog, passedProps.allowJiraIssue, passedProps.allowPanel, passedProps.allowExtension, passedProps.allowConfluenceInlineComment, passedProps.allowTemplatePlaceholders, passedProps.allowDate, passedProps.allowLayouts, passedProps.allowStatus, passedProps.allowTextAlignment, passedProps.allowIndentation, passedProps.showIndentationButtons, passedProps.allowNewInsertionBehaviour, passedProps.allowFindReplace, passedProps.UNSAFE_allowBorderMark, passedProps.allowBorderMark, passedProps.allowFragmentMark, passedProps.autoScrollIntoView, passedProps.elementBrowser, passedProps.maxContentSize, passedProps.saveOnEnter, passedProps.feedbackInfo, passedProps.mention, passedProps.mentionInsertDisplayName, passedProps.uploadErrorHandler, passedProps.waitForMediaUpload, passedProps.extensionHandlers, passedProps.allowTextColor, passedProps.allowTables, passedProps.insertMenuItems, passedProps.UNSAFE_cards, passedProps.smartLinks, passedProps.allowAnalyticsGASV3, passedProps.codeBlock, passedProps.textFormatting, passedProps.dangerouslyAppendPlugins]);
+  return memodProps;
+};
+export default useMemoEditorProps;

package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js

@@ -51,7 +51,7 @@ const Content = /*#__PURE__*/React.forwardRef((props, ref) => {
       css: editorContentGutterStyle,
       className: ['ak-editor-content-area', fullWidthMode ? 'fabric-editor--full-width-mode' : ''].join(' '),
       ref: contentAreaRef
-    }, props.customContentComponents, jsx(PluginSlot, {
+    }, !!props.customContentComponents && 'before' in props.customContentComponents ? props.customContentComponents.before : props.customContentComponents, jsx(PluginSlot, {
       editorView: props.editorView,
       editorActions: props.editorActions,
       eventDispatcher: props.eventDispatcher,
@@ -67,7 +67,7 @@ const Content = /*#__PURE__*/React.forwardRef((props, ref) => {
       containerElement: scrollContainerRef.current,
       dispatchAnalyticsEvent: props.dispatchAnalyticsEvent,
       wrapperElement: props.wrapperElement
-    }), props.editorDOMElement)))), jsx("div", {
+    }), props.editorDOMElement, !!props.customContentComponents && 'after' in props.customContentComponents ? props.customContentComponents.after : null)))), jsx("div", {
       css: sidebarArea
     }, props.contextPanel || jsx(ContextPanel, {
       visible: false

package/dist/es2019/version-wrapper.js

@@ -1,2 +1,2 @@
 export const name = "@atlaskit/editor-core";
-export const version = "189.6.0";
+export const version = "189.6.2";

package/dist/esm/composable-editor/editor.js

@@ -1,6 +1,3 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /** @jsx jsx */
 import { useRef, useCallback, useMemo } from 'react';
 import { jsx } from '@emotion/react';
@@ -10,7 +7,6 @@ import { ACTION, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { EditorExperience, ExperienceStore } from '@atlaskit/editor-common/ufo';
 import { getAnalyticsAppearance, startMeasure, stopMeasure } from '@atlaskit/editor-common/utils';
 import { basePlugin } from '@atlaskit/editor-plugin-base';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import EditorActions from '../actions';
 import { createFeatureFlagsFromProps } from '../create-editor/feature-flags-from-props';
 import { name, version } from '../version-wrapper';
@@ -23,196 +19,25 @@ import sendDurationAnalytics from './utils/sendDurationAnalytics';
 import trackEditorActions from './utils/trackEditorActions';
 import useMeasureEditorMountTime from './hooks/useMeasureEditorMountTime';
 import useProviderFactory from './hooks/useProviderFactory';
+import useMemoEditorProps from './hooks/useMemoEditorProps';
 
 /**
  * Editor wrapper that deals with the lifecycle logic of the editor
  */
 function Editor(passedProps) {
-  var _editorContext$editor;
-  var defaultProps = {
-    appearance: 'comment',
-    disabled: false,
-    quickInsert: true
-  };
-  var props = _objectSpread(_objectSpread({}, defaultProps), passedProps);
-  var editorContext = useEditorContext();
-  var editorActions = useRef((_editorContext$editor = editorContext === null || editorContext === void 0 ? void 0 : editorContext.editorActions) !== null && _editorContext$editor !== void 0 ? _editorContext$editor : new EditorActions());
-  var startTime = useRef(performance.now());
-  var _useAnalyticsEvents = useAnalyticsEvents(),
-    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
-  var experienceStore = useRef();
-  var handleAnalyticsEvent = function handleAnalyticsEvent(data) {
-    return fireAnalyticsEvent(createAnalyticsEvent)(data);
-  };
-  useConstructor(function () {
-    trackEditorActions(editorActions.current, props.performanceTracking, function (value) {
-      return handleAnalyticsEvent(value);
-    });
-  });
-  var getExperienceStore = function getExperienceStore() {
-    return experienceStore.current;
-  };
-  var onEditorCreated = function onEditorCreated(instance) {
-    var _props$featureFlags;
-    editorActions.current._privateRegisterEditor(instance.view, instance.eventDispatcher, instance.transformer, function () {
-      return createFeatureFlagsFromProps(props);
-    });
-    if ((_props$featureFlags = props.featureFlags) !== null && _props$featureFlags !== void 0 && _props$featureFlags.ufo) {
-      var _experienceStore$curr;
-      experienceStore.current = ExperienceStore.getInstance(instance.view);
-      (_experienceStore$curr = experienceStore.current) === null || _experienceStore$curr === void 0 || _experienceStore$curr.start(EditorExperience.loadEditor, startTime.current);
-    }
-    if (props.onEditorReady) {
-      var _props$performanceTra, _props$featureFlags2;
-      var measureEditorReady = (props === null || props === void 0 || (_props$performanceTra = props.performanceTracking) === null || _props$performanceTra === void 0 || (_props$performanceTra = _props$performanceTra.onEditorReadyCallbackTracking) === null || _props$performanceTra === void 0 ? void 0 : _props$performanceTra.enabled) || ((_props$featureFlags2 = props.featureFlags) === null || _props$featureFlags2 === void 0 ? void 0 : _props$featureFlags2.ufo);
-      measureEditorReady && startMeasure(measurements.ON_EDITOR_READY_CALLBACK);
-      props.onEditorReady(editorActions.current);
-      measureEditorReady && stopMeasure(measurements.ON_EDITOR_READY_CALLBACK, sendDurationAnalytics(ACTION.ON_EDITOR_READY_CALLBACK, props, getExperienceStore, createAnalyticsEvent));
-    }
-  };
-  var onEditorDestroyed = function onEditorDestroyed(_instance) {
-    var _props$onDestroy;
-    editorActions.current._privateUnregisterEditor();
-    (_props$onDestroy = props.onDestroy) === null || _props$onDestroy === void 0 || _props$onDestroy.call(props);
-  };
-  useMeasureEditorMountTime(props, getExperienceStore, createAnalyticsEvent);
-  var providerFactory = useProviderFactory(props, editorActions.current, createAnalyticsEvent);
-  return jsx(EditorInternal, {
-    props: props,
-    handleAnalyticsEvent: handleAnalyticsEvent,
-    createAnalyticsEvent: createAnalyticsEvent,
-    preset: props.preset,
-    handleSave: function handleSave(view) {
-      var _props$onSave;
-      return (_props$onSave = props.onSave) === null || _props$onSave === void 0 ? void 0 : _props$onSave.call(props, view);
-    },
-    editorActions: editorActions.current,
-    onEditorCreated: onEditorCreated,
-    onEditorDestroyed: onEditorDestroyed,
-    providerFactory: providerFactory
-  });
-}
-/**
- * Improved memonization for  Editor wrapper that deals with the lifecycle logic of the editor
- */
-function EditorButBetter(passedProps) {
   var propsRef = useRef(passedProps);
-  var props = useMemo(function () {
-    // That sounds awful but this is the only way to make sure we didn't missed any EditorProps
-    var allProps = {
-      preset: passedProps.preset,
-      appearance: passedProps.appearance,
-      contentComponents: passedProps.contentComponents,
-      primaryToolbarIconBefore: passedProps.primaryToolbarIconBefore,
-      secondaryToolbarComponents: passedProps.secondaryToolbarComponents,
-      persistScrollGutter: passedProps.persistScrollGutter,
-      quickInsert: passedProps.quickInsert,
-      shouldFocus: passedProps.shouldFocus,
-      disabled: passedProps.disabled,
-      contextPanel: passedProps.contextPanel,
-      errorReporterHandler: passedProps.errorReporterHandler,
-      contentTransformerProvider: passedProps.contentTransformerProvider,
-      maxHeight: passedProps.maxHeight,
-      minHeight: passedProps.minHeight,
-      placeholder: passedProps.placeholder,
-      placeholderBracketHint: passedProps.placeholderBracketHint,
-      defaultValue: passedProps.defaultValue,
-      assistiveLabel: passedProps.assistiveLabel,
-      popupsMountPoint: passedProps.popupsMountPoint,
-      popupsBoundariesElement: passedProps.popupsBoundariesElement,
-      popupsScrollableElement: passedProps.popupsScrollableElement,
-      editorActions: passedProps.editorActions,
-      onEditorReady: passedProps.onEditorReady,
-      onDestroy: passedProps.onDestroy,
-      onChange: passedProps.onChange,
-      onCancel: passedProps.onCancel,
-      inputSamplingLimit: passedProps.inputSamplingLimit,
-      extensionProviders: passedProps.extensionProviders,
-      UNSAFE_useAnalyticsContext: passedProps.UNSAFE_useAnalyticsContext,
-      trackValidTransactions: passedProps.trackValidTransactions,
-      useStickyToolbar: passedProps.useStickyToolbar,
-      featureFlags: passedProps.featureFlags,
-      onSave: passedProps.onSave,
-      performanceTracking: passedProps.performanceTracking,
-      sanitizePrivateContent: passedProps.sanitizePrivateContent,
-      media: passedProps.media,
-      collabEdit: passedProps.collabEdit,
-      primaryToolbarComponents: passedProps.primaryToolbarComponents,
-      allowUndoRedoButtons: passedProps.allowUndoRedoButtons,
-      linking: passedProps.linking,
-      hideAvatarGroup: passedProps.hideAvatarGroup,
-      activityProvider: passedProps.activityProvider,
-      searchProvider: passedProps.searchProvider,
-      annotationProviders: passedProps.annotationProviders,
-      collabEditProvider: passedProps.collabEditProvider,
-      presenceProvider: passedProps.presenceProvider,
-      emojiProvider: passedProps.emojiProvider,
-      taskDecisionProvider: passedProps.taskDecisionProvider,
-      legacyImageUploadProvider: passedProps.legacyImageUploadProvider,
-      mentionProvider: passedProps.mentionProvider,
-      autoformattingProvider: passedProps.autoformattingProvider,
-      macroProvider: passedProps.macroProvider,
-      contextIdentifierProvider: passedProps.contextIdentifierProvider,
-      allowExpand: passedProps.allowExpand,
-      allowNestedTasks: passedProps.allowNestedTasks,
-      allowBlockType: passedProps.allowBlockType,
-      allowTasksAndDecisions: passedProps.allowTasksAndDecisions,
-      allowBreakout: passedProps.allowBreakout,
-      allowRule: passedProps.allowRule,
-      allowHelpDialog: passedProps.allowHelpDialog,
-      allowJiraIssue: passedProps.allowJiraIssue,
-      allowPanel: passedProps.allowPanel,
-      allowExtension: passedProps.allowExtension,
-      allowConfluenceInlineComment: passedProps.allowConfluenceInlineComment,
-      allowTemplatePlaceholders: passedProps.allowTemplatePlaceholders,
-      allowDate: passedProps.allowDate,
-      allowLayouts: passedProps.allowLayouts,
-      allowStatus: passedProps.allowStatus,
-      allowTextAlignment: passedProps.allowTextAlignment,
-      allowIndentation: passedProps.allowIndentation,
-      showIndentationButtons: passedProps.showIndentationButtons,
-      allowNewInsertionBehaviour: passedProps.allowNewInsertionBehaviour,
-      allowFindReplace: passedProps.allowFindReplace,
-      UNSAFE_allowBorderMark: passedProps.UNSAFE_allowBorderMark,
-      allowBorderMark: passedProps.allowBorderMark,
-      allowFragmentMark: passedProps.allowFragmentMark,
-      autoScrollIntoView: passedProps.autoScrollIntoView,
-      elementBrowser: passedProps.elementBrowser,
-      maxContentSize: passedProps.maxContentSize,
-      saveOnEnter: passedProps.saveOnEnter,
-      feedbackInfo: passedProps.feedbackInfo,
-      mention: passedProps.mention,
-      mentionInsertDisplayName: passedProps.mentionInsertDisplayName,
-      uploadErrorHandler: passedProps.uploadErrorHandler,
-      waitForMediaUpload: passedProps.waitForMediaUpload,
-      extensionHandlers: passedProps.extensionHandlers,
-      allowTextColor: passedProps.allowTextColor,
-      allowTables: passedProps.allowTables,
-      insertMenuItems: passedProps.insertMenuItems,
-      UNSAFE_cards: passedProps.UNSAFE_cards,
-      smartLinks: passedProps.smartLinks,
-      allowAnalyticsGASV3: passedProps.allowAnalyticsGASV3,
-      codeBlock: passedProps.codeBlock,
-      textFormatting: passedProps.textFormatting,
-      dangerouslyAppendPlugins: passedProps.dangerouslyAppendPlugins
-    };
-    var defaultProps = {
-      appearance: 'comment',
-      disabled: false,
-      quickInsert: true
-    };
-    var nextProps = _objectSpread(_objectSpread({}, defaultProps), allProps);
-    propsRef.current = nextProps;
-    return nextProps;
-  }, [passedProps.preset, passedProps.appearance, passedProps.contentComponents, passedProps.primaryToolbarIconBefore, passedProps.secondaryToolbarComponents, passedProps.persistScrollGutter, passedProps.quickInsert, passedProps.shouldFocus, passedProps.disabled, passedProps.contextPanel, passedProps.errorReporterHandler, passedProps.contentTransformerProvider, passedProps.maxHeight, passedProps.minHeight, passedProps.placeholder, passedProps.placeholderBracketHint, passedProps.defaultValue, passedProps.assistiveLabel, passedProps.popupsMountPoint, passedProps.popupsBoundariesElement, passedProps.popupsScrollableElement, passedProps.editorActions, passedProps.onEditorReady, passedProps.onDestroy, passedProps.onChange, passedProps.onCancel, passedProps.inputSamplingLimit, passedProps.extensionProviders, passedProps.UNSAFE_useAnalyticsContext, passedProps.trackValidTransactions, passedProps.useStickyToolbar, passedProps.featureFlags, passedProps.onSave, passedProps.performanceTracking, passedProps.sanitizePrivateContent, passedProps.media, passedProps.collabEdit, passedProps.primaryToolbarComponents, passedProps.allowUndoRedoButtons, passedProps.linking, passedProps.hideAvatarGroup, passedProps.activityProvider, passedProps.searchProvider, passedProps.annotationProviders, passedProps.collabEditProvider, passedProps.presenceProvider, passedProps.emojiProvider, passedProps.taskDecisionProvider, passedProps.legacyImageUploadProvider, passedProps.mentionProvider, passedProps.autoformattingProvider, passedProps.macroProvider, passedProps.contextIdentifierProvider, passedProps.allowExpand, passedProps.allowNestedTasks, passedProps.allowBlockType, passedProps.allowTasksAndDecisions, passedProps.allowBreakout, passedProps.allowRule, passedProps.allowHelpDialog, passedProps.allowJiraIssue, passedProps.allowPanel, passedProps.allowExtension, passedProps.allowConfluenceInlineComment, passedProps.allowTemplatePlaceholders, passedProps.allowDate, passedProps.allowLayouts, passedProps.allowStatus, passedProps.allowTextAlignment, passedProps.allowIndentation, passedProps.showIndentationButtons, passedProps.allowNewInsertionBehaviour, passedProps.allowFindReplace, passedProps.UNSAFE_allowBorderMark, passedProps.allowBorderMark, passedProps.allowFragmentMark, passedProps.autoScrollIntoView, passedProps.elementBrowser, passedProps.maxContentSize, passedProps.saveOnEnter, passedProps.feedbackInfo, passedProps.mention, passedProps.mentionInsertDisplayName, passedProps.uploadErrorHandler, passedProps.waitForMediaUpload, passedProps.extensionHandlers, passedProps.allowTextColor, passedProps.allowTables, passedProps.insertMenuItems, passedProps.UNSAFE_cards, passedProps.smartLinks, passedProps.allowAnalyticsGASV3, passedProps.codeBlock, passedProps.textFormatting, passedProps.dangerouslyAppendPlugins]);
+  var props = useMemoEditorProps(passedProps);
+  useMemo(function () {
+    propsRef.current = props;
+  }, [props]);
   var editorContext = useEditorContext();
   var editorActionsPlaceholderInstance = useMemo(function () {
     return new EditorActions();
   }, []);
   var editorActions = editorContext.editorActions || editorActionsPlaceholderInstance;
   var startTime = useRef(performance.now());
-  var _useAnalyticsEvents2 = useAnalyticsEvents(),
-    createAnalyticsEvent = _useAnalyticsEvents2.createAnalyticsEvent;
+  var _useAnalyticsEvents = useAnalyticsEvents(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var experienceStore = useRef();
   var handleAnalyticsEvent = useCallback(function (data) {
     fireAnalyticsEvent(createAnalyticsEvent)(data);
@@ -236,9 +61,9 @@ function EditorButBetter(passedProps) {
       featureFlags = _propsRef$current.featureFlags;
     editorActions._privateRegisterEditor(instance.view, instance.eventDispatcher, instance.transformer, getFeatureFlagsFromRef);
     if (featureFlags !== null && featureFlags !== void 0 && featureFlags.ufo) {
-      var _experienceStore$curr2;
+      var _experienceStore$curr;
       experienceStore.current = ExperienceStore.getInstance(instance.view);
-      (_experienceStore$curr2 = experienceStore.current) === null || _experienceStore$curr2 === void 0 || _experienceStore$curr2.start(EditorExperience.loadEditor, startTime.current);
+      (_experienceStore$curr = experienceStore.current) === null || _experienceStore$curr === void 0 || _experienceStore$curr.start(EditorExperience.loadEditor, startTime.current);
     }
     if (onEditorReady) {
       var _performanceTracking$;
@@ -289,13 +114,6 @@ export function ComposableEditor(props) {
       editorSessionId: editorSessionId.current
     };
   }, [props.appearance]);
-  if (getBooleanFF('platform.editor.less-editor-props-rerendering')) {
-    return jsx(FabricEditorAnalyticsContext
-    // @ts-expect-error Type 'string' is not assignable to type '"editorCore" | "renderer"'.
-    , {
-      data: data
-    }, jsx(EditorButBetter, props));
-  }
   return jsx(FabricEditorAnalyticsContext
   // @ts-expect-error Type 'string' is not assignable to type '"editorCore" | "renderer"'.
   , {