@atlaskit/editor-core 233.0.2 → 234.0.1

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-core
 
+## 234.0.1
+
+### Patch Changes
+
+- [`b31a1d76b3076`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b31a1d76b3076) -
+  Restore render tracking behind the opt-in platform_editor_enable_rerender_tracking experiment.
+- Updated dependencies
+
+## 234.0.0
+
+### Patch Changes
+
+- [`3a3e46e16b55c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3a3e46e16b55c) -
+  Use the shared `TABS_MENU_ITEM` key when ranking Tabs in the Structure section of the `/` menu.
+- Updated dependencies
+
 ## 233.0.2
 
 ### Patch Changes

package/dist/cjs/composable-editor/core-editor.js

@@ -50,6 +50,9 @@ function Editor(passedProps) {
   var editorActions = editorContext.editorActions || editorActionsPlaceholderInstance;
   var _useAnalyticsEvents = (0, _useAnalyticsEvents2.useAnalyticsEvents)(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  var handleAnalyticsEvent = (0, _react.useCallback)(function (data) {
+    (0, _analytics.fireAnalyticsEvent)(createAnalyticsEvent)(data);
+  }, [createAnalyticsEvent]);
   var getFeatureFlagsFromRef = (0, _react.useCallback)(function () {
     var _propsRef$current$col, _propsRef$current$col2;
     return _objectSpread(_objectSpread({}, (0, _featureFlagsFromProps.createFeatureFlagsFromProps)(propsRef.current.featureFlags)), {}, {
@@ -88,6 +91,7 @@ function Editor(passedProps) {
   }, [onSaveFromProps]);
   return /*#__PURE__*/_react.default.createElement(_editorInternal.EditorInternal, {
     props: props,
+    handleAnalyticsEvent: handleAnalyticsEvent,
     createAnalyticsEvent: createAnalyticsEvent,
     preset: props.preset,
     handleSave: handleSave,

package/dist/cjs/composable-editor/editor-internal.js

@@ -9,8 +9,10 @@ exports.EditorInternal = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
+var _analytics = require("@atlaskit/editor-common/analytics");
 var _portal = require("@atlaskit/editor-common/portal");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
 var _componentWithCondition = require("@atlaskit/platform-feature-flags-react/component-with-condition");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _ErrorBoundary = _interopRequireDefault(require("../create-editor/ErrorBoundary"));
@@ -18,6 +20,7 @@ var _ReactEditorView = _interopRequireDefault(require("../create-editor/ReactEdi
 var _EditorContext = _interopRequireDefault(require("../ui/EditorContext"));
 var _IntlProviderIfMissingWrapper = require("../ui/IntlProviderIfMissingWrapper/IntlProviderIfMissingWrapper");
 var _featureFlagsFromProps = require("../utils/feature-flags-from-props");
+var _RenderTracking = require("../utils/performance/components/RenderTracking");
 var _BaseThemeWrapper = require("./BaseThemeWrapper");
 var _editorInternalCompiled = require("./editor-internal-compiled");
 var _editorInternalEmotion = require("./editor-internal-emotion");
@@ -28,12 +31,15 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 var EditorInternalContainerMigration = (0, _componentWithCondition.componentWithCondition)(function () {
   return (0, _expValEquals.expValEquals)('platform_editor_core_non_ecc_static_css', 'isEnabled', true);
 }, _editorInternalCompiled.EditorInternalContainerCompiled, _editorInternalEmotion.EditorInternalContainerEmotion);
+var DEFAULT_VALUE_PROP_TO_IGNORE = ['defaultValue'];
+
 /**
  * EditorInternalComponent is used to capture the common component
  * from the `render` method of `Editor` and share it with `EditorNext`.
  */
 var EditorInternal = exports.EditorInternal = /*#__PURE__*/(0, _react.memo)(function (_ref) {
   var props = _ref.props,
+    handleAnalyticsEvent = _ref.handleAnalyticsEvent,
     createAnalyticsEvent = _ref.createAnalyticsEvent,
     handleSave = _ref.handleSave,
     editorActions = _ref.editorActions,
@@ -48,6 +54,7 @@ var EditorInternal = exports.EditorInternal = /*#__PURE__*/(0, _react.memo)(func
     analyticsHandler: undefined
   });
   var featureFlags = (0, _featureFlagsFromProps.createFeatureFlagsFromProps)(props.featureFlags);
+  var renderTrackingEnabled = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_enable_rerender_tracking') && !featureFlags.lcmPreventRenderTracking;
   var _usePortalProvider = (0, _portal.usePortalProvider)(),
     _usePortalProvider2 = (0, _slicedToArray2.default)(_usePortalProvider, 2),
     portalProviderAPI = _usePortalProvider2[0],
@@ -56,13 +63,21 @@ var EditorInternal = exports.EditorInternal = /*#__PURE__*/(0, _react.memo)(func
     _usePortalProvider4 = (0, _slicedToArray2.default)(_usePortalProvider3, 2),
     nodeViewPortalProviderAPI = _usePortalProvider4[0],
     NodeViewPortalRenderer = _usePortalProvider4[1];
+  var propsToIgnore = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_perf_lint_cleanup') ? DEFAULT_VALUE_PROP_TO_IGNORE : ['defaultValue'];
   var baseFontSize = (0, _getBaseFontSize.getBaseFontSize)(props.appearance, props.contentMode);
-  var fontSize = (0, _expValEquals.expValEquals)('platform_editor_core_non_ecc_static_css', 'isEnabled', true) || (0, _expValEquals.expValEquals)('platform_editor_core_static_css', 'isEnabled', true) ? (0, _editorSharedStyles.editorFontSize)({
+  var fontSize = (0, _editorSharedStyles.editorFontSize)({
     theme: {
       baseFontSize: baseFontSize
     }
-  }) : undefined;
-  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_ErrorBoundary.default, {
+  });
+  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, renderTrackingEnabled && /*#__PURE__*/_react.default.createElement(_RenderTracking.RenderTracking, {
+    componentProps: props,
+    action: _analytics.ACTION.RE_RENDERED,
+    actionSubject: _analytics.ACTION_SUBJECT.EDITOR,
+    handleAnalyticsEvent: handleAnalyticsEvent,
+    propsToIgnore: propsToIgnore,
+    useShallow: false
+  }), /*#__PURE__*/_react.default.createElement(_ErrorBoundary.default, {
     errorTracking: true,
     createAnalyticsEvent: createAnalyticsEvent,
     contextIdentifierProvider: props.contextIdentifierProvider,

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

@@ -48,6 +48,7 @@ var _getNodesCountWithExtensionKeys = require("../utils/getNodesCountWithExtensi
 var _getNodesVisibleInViewport = require("../utils/getNodesVisibleInViewport");
 var _isChromeless = require("../utils/is-chromeless");
 var _isFullPage = require("../utils/is-full-page");
+var _RenderTracking = require("../utils/performance/components/RenderTracking");
 var _measureEnum = _interopRequireDefault(require("../utils/performance/measure-enum"));
 var _consts = require("./consts");
 var _createEditor = require("./create-editor");
@@ -1193,13 +1194,20 @@ function ReactEditorView(props) {
   // We should follow-up
   // eslint-disable-next-line react-hooks/exhaustive-deps
   [props.editorProps.assistiveLabel, props.editorProps.assistiveDescribedBy, ssrEditor]);
+  var renderTrackingEnabled = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_enable_rerender_tracking') && !featureFlags.lcmPreventRenderTracking;
   return /*#__PURE__*/_react.default.createElement(_ssrMeasures.SSRRenderMeasure, {
     segmentName: SSR_TRACE_SEGMENT_NAME,
     startTimestampRef: firstRenderStartTimestampRef,
     onSSRMeasure: onSSRMeasure
   }, /*#__PURE__*/_react.default.createElement(_uiReact.ReactEditorViewContext.Provider, {
     value: reactEditorViewContext
-  }, props.render ? (_props$render = (_props$render2 = props.render) === null || _props$render2 === void 0 ? void 0 : _props$render2.call(props, {
+  }, renderTrackingEnabled && /*#__PURE__*/_react.default.createElement(_RenderTracking.RenderTracking, {
+    componentProps: props,
+    action: _analytics.ACTION.RE_RENDERED,
+    actionSubject: _analytics.ACTION_SUBJECT.REACT_EDITOR_VIEW,
+    handleAnalyticsEvent: handleAnalyticsEvent,
+    useShallow: true
+  }), props.render ? (_props$render = (_props$render2 = props.render) === null || _props$render2 === void 0 ? void 0 : _props$render2.call(props, {
     editor: editor,
     view: viewRef.current,
     config: config.current,

package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea-emotion.js

@@ -17,7 +17,6 @@ var _hooks = require("@atlaskit/editor-common/hooks");
 var _messages = require("@atlaskit/editor-common/messages");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
 var _ClickAreaBlock = _interopRequireDefault(require("../../Addon/ClickAreaBlock"));
 var _contentComponentWrapper = require("../../Addon/ClickAreaBlock/contentComponentWrapper");
@@ -284,14 +283,13 @@ var CONTENT_AREA_TEST_ID = exports.CONTENT_AREA_TEST_ID = 'ak-editor-fp-content-
 var EDITOR_CONTAINER = exports.EDITOR_CONTAINER = 'ak-editor-container';
 var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$editorAPI, _props$editorAPI$bloc, _props$editorAPI2, _contentAreaRef$curre, _allowScrollGutter$gu, _allowScrollGutter$gu2;
-  var theme = (0, _react2.useTheme)();
   var fullWidthMode = props.appearance === 'full-width';
   var maxWidthMode = props.appearance === 'max';
   var scrollContainerRef = (0, _react.useRef)(null);
   var contentAreaRef = (0, _react.useRef)(null);
   var containerRef = (0, _react.useRef)(null);
   var allowScrollGutter = (_props$editorAPI = props.editorAPI) === null || _props$editorAPI === void 0 || (_props$editorAPI = _props$editorAPI.base) === null || _props$editorAPI === void 0 || (_props$editorAPI = _props$editorAPI.sharedState.currentState()) === null || _props$editorAPI === void 0 ? void 0 : _props$editorAPI.allowScrollGutter;
-  var contentAreaMaxWidth = getTotalPadding() + (!fullWidthMode ? maxWidthMode ? akEditorUltraWideLayoutWidth : (0, _expValEquals.expValEquals)('platform_editor_core_non_ecc_static_css', 'isEnabled', true) || (0, _expValEquals.expValEquals)('platform_editor_core_static_css', 'isEnabled', true) ? _editorSharedStyles.akEditorDefaultLayoutWidth : theme.layoutMaxWidth : akEditorFullWidthLayoutWidth);
+  var contentAreaMaxWidth = getTotalPadding() + (!fullWidthMode ? maxWidthMode ? akEditorUltraWideLayoutWidth : _editorSharedStyles.akEditorDefaultLayoutWidth : akEditorFullWidthLayoutWidth);
 
   // Get useStandardNodeWidth from block menu plugin shared state
   // Only access editorAPI when the experiment is enabled to avoid performance impact

package/dist/cjs/ui/EditorContentContainer/EditorContentContainer.js

@@ -4,16 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _componentWithCondition = require("@atlaskit/platform-feature-flags-react/component-with-condition");
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _EditorContentContainerCompiled = require("./EditorContentContainer-compiled");
-var _EditorContentContainerEmotion = require("./EditorContentContainer-emotion");
 /**
- * Compiled Migration is WIP
- * If you are touching EditorContentContainerEmotion, please contact with #proj-cc-editor-full-compiled-css-migration
- * https://home.atlassian.com/o/2346a038-3c8c-498b-a79b-e7847859868d/s/a436116f-02ce-4520-8fbb-7301462a1674/project/ATLAS-120555
+ * The emotion implementation has been removed as part of the
+ * platform_editor_core_static_css cleanup — the compiled implementation is now
+ * the only one. This module stays as the entry point so consumers keep
+ * importing from `./EditorContentContainer`.
  */
-var EditorContentContainer = (0, _componentWithCondition.componentWithCondition)(function () {
-  return (0, _expValEquals.expValEquals)('platform_editor_core_static_css', 'isEnabled', true);
-}, _EditorContentContainerCompiled.EditorContentContainerCompiled, _EditorContentContainerEmotion.EditorContentContainerEmotion);
+var EditorContentContainer = _EditorContentContainerCompiled.EditorContentContainerCompiled;
 var _default = exports.default = EditorContentContainer;

package/dist/cjs/ui/quick-insert/getExtensionQuickInsertComponents.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getExtensionQuickInsertComponents = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _createQuickInsertMatcher = require("@atlaskit/editor-common/quick-insert/create-quick-insert-matcher");
 var _getMenuItemParents = require("@atlaskit/editor-common/quick-insert/get-menu-item-parents");
@@ -16,16 +16,9 @@ var _rank = require("@atlaskit/editor-common/quick-insert/rank");
 var _ExtensionQuickInsertMenuItem = require("./ExtensionQuickInsertMenuItem");
 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) { (0, _defineProperty2.default)(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; }
-var structureExtensionItemKeyRanks = {
-  'toc:toc': 600,
-  'native-tabs:native-tabs': 1900,
-  'cards:quick-insert': 2000,
-  'carousel:quick-insert': 2100,
-  'spotlight:quick-insert': 2200,
-  'create-from-template:create-from-template': 2700,
-  'anchor:anchor': 2900,
-  'smart-button:quick-insert': 3000
-};
+var structureExtensionItemKeyRanks = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
+  'toc:toc': 600
+}, _keys.TABS_MENU_ITEM.key, 1900), 'cards:quick-insert', 2000), 'carousel:quick-insert', 2100), 'spotlight:quick-insert', 2200), 'create-from-template:create-from-template', 2700), 'anchor:anchor', 2900), 'smart-button:quick-insert', 3000);
 var UNRECOGNIZED_STRUCTURE_EXTENSION_ITEM_RANK = 3100;
 var APP_DATA_AND_CHARTS_ITEM_RANK = 2700;
 var APP_EMBED_ITEM_RANK = _rank.EXTENSION_ITEM_RANK;

package/dist/cjs/utils/performance/components/RenderTracking.js

@@ -0,0 +1,44 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RenderTracking = RenderTracking;
+var _react = require("react");
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
+var _analytics = require("@atlaskit/editor-common/analytics");
+var _useComponentRenderTracking = require("@atlaskit/editor-common/use-component-render-tracking");
+function RenderTracking(props) {
+  var debouncedHandleAnalyticsEvent = (0, _react.useMemo)(function () {
+    return (0, _debounce.default)(props.handleAnalyticsEvent, 500);
+  }, [props.handleAnalyticsEvent]);
+  (0, _useComponentRenderTracking.useComponentRenderTracking)({
+    onRender: function onRender(_ref) {
+      var renderCount = _ref.renderCount,
+        propsDifference = _ref.propsDifference;
+      if (!renderCount) {
+        return;
+      }
+      debouncedHandleAnalyticsEvent({
+        payload: {
+          action: props.action,
+          actionSubject: props.actionSubject,
+          attributes: {
+            count: renderCount,
+            propsDifference: propsDifference
+          },
+          eventType: _analytics.EVENT_TYPE.OPERATIONAL
+        }
+      });
+    },
+    propsDiffingOptions: {
+      enabled: true,
+      props: props.componentProps,
+      propsToIgnore: props.propsToIgnore,
+      useShallow: props.useShallow
+    },
+    zeroBasedCount: true
+  });
+  return null;
+}

package/dist/cjs/version-wrapper.js

@@ -6,4 +6,4 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.name = void 0;
 var name = exports.name = "@atlaskit/editor-core";
 // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
-var version = exports.version = "233.0.1";
+var version = exports.version = "234.0.0";

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

@@ -5,7 +5,7 @@ import isEqual from 'lodash/isEqual';
 import { v4 as uuid } from 'uuid';
 import { FabricEditorAnalyticsContext } from '@atlaskit/analytics-namespaced-context/FabricEditorAnalyticsContext';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next/useAnalyticsEvents';
-import { ACTION } from '@atlaskit/editor-common/analytics';
+import { ACTION, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { startMeasure, stopMeasure } from '@atlaskit/editor-common/performance-measures';
 import { getAnalyticsAppearance } from '@atlaskit/editor-common/utils/analytics';
 import EditorActions from '../actions';
@@ -38,6 +38,9 @@ function Editor(passedProps) {
   const {
     createAnalyticsEvent
   } = useAnalyticsEvents();
+  const handleAnalyticsEvent = useCallback(data => {
+    fireAnalyticsEvent(createAnalyticsEvent)(data);
+  }, [createAnalyticsEvent]);
   const getFeatureFlagsFromRef = useCallback(() => {
     var _propsRef$current$col, _propsRef$current$col2;
     return {
@@ -82,6 +85,7 @@ function Editor(passedProps) {
   }, [onSaveFromProps]);
   return /*#__PURE__*/React.createElement(EditorInternal, {
     props: props,
+    handleAnalyticsEvent: handleAnalyticsEvent,
     createAnalyticsEvent: createAnalyticsEvent,
     preset: props.preset,
     handleSave: handleSave,

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

@@ -1,6 +1,8 @@
 import React, { Fragment, memo } from 'react';
+import { ACTION, ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
 import { usePortalProvider } from '@atlaskit/editor-common/portal';
 import { editorFontSize } from '@atlaskit/editor-shared-styles';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { componentWithCondition } from '@atlaskit/platform-feature-flags-react/component-with-condition';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import ErrorBoundary from '../create-editor/ErrorBoundary';
@@ -8,17 +10,21 @@ import ReactEditorViewNext from '../create-editor/ReactEditorView';
 import EditorContext from '../ui/EditorContext';
 import { IntlProviderIfMissingWrapper } from '../ui/IntlProviderIfMissingWrapper/IntlProviderIfMissingWrapper';
 import { createFeatureFlagsFromProps } from '../utils/feature-flags-from-props';
+import { RenderTracking } from '../utils/performance/components/RenderTracking';
 import { BaseThemeWrapper } from './BaseThemeWrapper';
 import { EditorInternalContainerCompiled } from './editor-internal-compiled';
 import { EditorInternalContainerEmotion } from './editor-internal-emotion';
 import { getBaseFontSize } from './utils/getBaseFontSize';
 const EditorInternalContainerMigration = componentWithCondition(() => expValEquals('platform_editor_core_non_ecc_static_css', 'isEnabled', true), EditorInternalContainerCompiled, EditorInternalContainerEmotion);
+const DEFAULT_VALUE_PROP_TO_IGNORE = ['defaultValue'];
+
 /**
  * EditorInternalComponent is used to capture the common component
  * from the `render` method of `Editor` and share it with `EditorNext`.
  */
 export const EditorInternal = /*#__PURE__*/memo(({
   props,
+  handleAnalyticsEvent,
   createAnalyticsEvent,
   handleSave,
   editorActions,
@@ -35,15 +41,24 @@ export const EditorInternal = /*#__PURE__*/memo(({
     analyticsHandler: undefined
   };
   const featureFlags = createFeatureFlagsFromProps(props.featureFlags);
+  const renderTrackingEnabled = isExperimentEnabled('platform_editor_enable_rerender_tracking') && !featureFlags.lcmPreventRenderTracking;
   const [portalProviderAPI, PortalRenderer] = usePortalProvider();
   const [nodeViewPortalProviderAPI, NodeViewPortalRenderer] = usePortalProvider();
+  const propsToIgnore = isExperimentEnabled('platform_editor_perf_lint_cleanup') ? DEFAULT_VALUE_PROP_TO_IGNORE : ['defaultValue'];
   const baseFontSize = getBaseFontSize(props.appearance, props.contentMode);
-  const fontSize = expValEquals('platform_editor_core_non_ecc_static_css', 'isEnabled', true) || expValEquals('platform_editor_core_static_css', 'isEnabled', true) ? editorFontSize({
+  const fontSize = editorFontSize({
     theme: {
       baseFontSize
     }
-  }) : undefined;
-  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(ErrorBoundary, {
+  });
+  return /*#__PURE__*/React.createElement(Fragment, null, renderTrackingEnabled && /*#__PURE__*/React.createElement(RenderTracking, {
+    componentProps: props,
+    action: ACTION.RE_RENDERED,
+    actionSubject: ACTION_SUBJECT.EDITOR,
+    handleAnalyticsEvent: handleAnalyticsEvent,
+    propsToIgnore: propsToIgnore,
+    useShallow: false
+  }), /*#__PURE__*/React.createElement(ErrorBoundary, {
     errorTracking: true,
     createAnalyticsEvent: createAnalyticsEvent,
     contextIdentifierProvider: props.contextIdentifierProvider,

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

@@ -37,6 +37,7 @@ import { getNodesCountWithExtensionKeys } from '../utils/getNodesCountWithExtens
 import { getNodesVisibleInViewport } from '../utils/getNodesVisibleInViewport';
 import { isChromeless } from '../utils/is-chromeless';
 import { isFullPage } from '../utils/is-full-page';
+import { RenderTracking } from '../utils/performance/components/RenderTracking';
 import measurements from '../utils/performance/measure-enum';
 import { PROSEMIRROR_RENDERED_DEGRADED_SEVERITY_THRESHOLD, PROSEMIRROR_RENDERED_NORMAL_SEVERITY_THRESHOLD } from './consts';
 import { processPluginsList } from './create-editor';
@@ -1109,13 +1110,20 @@ export function ReactEditorView(props) {
   // We should follow-up
   // eslint-disable-next-line react-hooks/exhaustive-deps
   [props.editorProps.assistiveLabel, props.editorProps.assistiveDescribedBy, ssrEditor]);
+  const renderTrackingEnabled = isExperimentEnabled('platform_editor_enable_rerender_tracking') && !featureFlags.lcmPreventRenderTracking;
   return /*#__PURE__*/React.createElement(SSRRenderMeasure, {
     segmentName: SSR_TRACE_SEGMENT_NAME,
     startTimestampRef: firstRenderStartTimestampRef,
     onSSRMeasure: onSSRMeasure
   }, /*#__PURE__*/React.createElement(ReactEditorViewContext.Provider, {
     value: reactEditorViewContext
-  }, props.render ? (_props$render = (_props$render2 = props.render) === null || _props$render2 === void 0 ? void 0 : _props$render2.call(props, {
+  }, renderTrackingEnabled && /*#__PURE__*/React.createElement(RenderTracking, {
+    componentProps: props,
+    action: ACTION.RE_RENDERED,
+    actionSubject: ACTION_SUBJECT.REACT_EDITOR_VIEW,
+    handleAnalyticsEvent: handleAnalyticsEvent,
+    useShallow: true
+  }), props.render ? (_props$render = (_props$render2 = props.render) === null || _props$render2 === void 0 ? void 0 : _props$render2.call(props, {
     editor,
     view: viewRef.current,
     config: config.current,

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

@@ -6,7 +6,7 @@
 import React, { useImperativeHandle, useRef } from 'react';
 
 /* eslint-disable @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic */
-import { css, jsx, useTheme } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import classnames from 'classnames';
 import { injectIntl } from 'react-intl';
 import { decisionListSelector } from '@atlaskit/adf-schema/decision-list';
@@ -15,7 +15,6 @@ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks'
 import { fullPageMessages as messages } from '@atlaskit/editor-common/messages';
 import { akEditorFullPageNarrowBreakout, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 // Ignored via go/ees005
 // eslint-disable-next-line import/no-named-as-default
@@ -278,14 +277,13 @@ export const CONTENT_AREA_TEST_ID = 'ak-editor-fp-content-area';
 export const EDITOR_CONTAINER = 'ak-editor-container';
 const Content = /*#__PURE__*/React.forwardRef((props, ref) => {
   var _props$editorAPI, _props$editorAPI$base, _props$editorAPI$base2, _props$editorAPI$bloc, _props$editorAPI2, _props$editorAPI2$blo, _props$editorAPI2$blo2, _props$editorAPI2$blo3, _contentAreaRef$curre, _allowScrollGutter$gu, _allowScrollGutter$gu2;
-  const theme = useTheme();
   const fullWidthMode = props.appearance === 'full-width';
   const maxWidthMode = props.appearance === 'max';
   const scrollContainerRef = useRef(null);
   const contentAreaRef = useRef(null);
   const containerRef = useRef(null);
   const allowScrollGutter = (_props$editorAPI = props.editorAPI) === null || _props$editorAPI === void 0 ? void 0 : (_props$editorAPI$base = _props$editorAPI.base) === null || _props$editorAPI$base === void 0 ? void 0 : (_props$editorAPI$base2 = _props$editorAPI$base.sharedState.currentState()) === null || _props$editorAPI$base2 === void 0 ? void 0 : _props$editorAPI$base2.allowScrollGutter;
-  const contentAreaMaxWidth = getTotalPadding() + (!fullWidthMode ? maxWidthMode ? akEditorUltraWideLayoutWidth : expValEquals('platform_editor_core_non_ecc_static_css', 'isEnabled', true) || expValEquals('platform_editor_core_static_css', 'isEnabled', true) ? akEditorDefaultLayoutWidth : theme.layoutMaxWidth : akEditorFullWidthLayoutWidth);
+  const contentAreaMaxWidth = getTotalPadding() + (!fullWidthMode ? maxWidthMode ? akEditorUltraWideLayoutWidth : akEditorDefaultLayoutWidth : akEditorFullWidthLayoutWidth);
 
   // Get useStandardNodeWidth from block menu plugin shared state
   // Only access editorAPI when the experiment is enabled to avoid performance impact

package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js

@@ -1,12 +1,10 @@
-import { componentWithCondition } from '@atlaskit/platform-feature-flags-react/component-with-condition';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { EditorContentContainerCompiled } from './EditorContentContainer-compiled';
-import { EditorContentContainerEmotion } from './EditorContentContainer-emotion';
 
 /**
- * Compiled Migration is WIP
- * If you are touching EditorContentContainerEmotion, please contact with #proj-cc-editor-full-compiled-css-migration
- * https://home.atlassian.com/o/2346a038-3c8c-498b-a79b-e7847859868d/s/a436116f-02ce-4520-8fbb-7301462a1674/project/ATLAS-120555
+ * The emotion implementation has been removed as part of the
+ * platform_editor_core_static_css cleanup — the compiled implementation is now
+ * the only one. This module stays as the entry point so consumers keep
+ * importing from `./EditorContentContainer`.
  */
-const EditorContentContainer = componentWithCondition(() => expValEquals('platform_editor_core_static_css', 'isEnabled', true), EditorContentContainerCompiled, EditorContentContainerEmotion);
+const EditorContentContainer = EditorContentContainerCompiled;
 export default EditorContentContainer;

package/dist/es2019/ui/quick-insert/getExtensionQuickInsertComponents.js

@@ -1,12 +1,12 @@
 import React from 'react';
 import { createQuickInsertMatcher } from '@atlaskit/editor-common/quick-insert/create-quick-insert-matcher';
 import { getQuickInsertMenuItemParents } from '@atlaskit/editor-common/quick-insert/get-menu-item-parents';
-import { DATA_AND_CHARTS_SECTION, EMBED_SECTION, MEDIA_SECTION, OTHER_SECTION, STRUCTURE_SECTION } from '@atlaskit/editor-common/quick-insert/keys';
+import { DATA_AND_CHARTS_SECTION, EMBED_SECTION, MEDIA_SECTION, OTHER_SECTION, STRUCTURE_SECTION, TABS_MENU_ITEM } from '@atlaskit/editor-common/quick-insert/keys';
 import { CREATE_SECTION_RANK, EXTENSION_ITEM_RANK, MEDIA_SECTION_RANK } from '@atlaskit/editor-common/quick-insert/rank';
 import { ExtensionQuickInsertMenuItem } from './ExtensionQuickInsertMenuItem';
 const structureExtensionItemKeyRanks = {
   'toc:toc': 600,
-  'native-tabs:native-tabs': 1900,
+  [TABS_MENU_ITEM.key]: 1900,
   'cards:quick-insert': 2000,
   'carousel:quick-insert': 2100,
   'spotlight:quick-insert': 2200,

package/dist/es2019/utils/performance/components/RenderTracking.js

@@ -0,0 +1,36 @@
+import { useMemo } from 'react';
+import debounce from 'lodash/debounce';
+import { EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { useComponentRenderTracking } from '@atlaskit/editor-common/use-component-render-tracking';
+export function RenderTracking(props) {
+  const debouncedHandleAnalyticsEvent = useMemo(() => debounce(props.handleAnalyticsEvent, 500), [props.handleAnalyticsEvent]);
+  useComponentRenderTracking({
+    onRender: ({
+      renderCount,
+      propsDifference
+    }) => {
+      if (!renderCount) {
+        return;
+      }
+      debouncedHandleAnalyticsEvent({
+        payload: {
+          action: props.action,
+          actionSubject: props.actionSubject,
+          attributes: {
+            count: renderCount,
+            propsDifference: propsDifference
+          },
+          eventType: EVENT_TYPE.OPERATIONAL
+        }
+      });
+    },
+    propsDiffingOptions: {
+      enabled: true,
+      props: props.componentProps,
+      propsToIgnore: props.propsToIgnore,
+      useShallow: props.useShallow
+    },
+    zeroBasedCount: true
+  });
+  return null;
+}

package/dist/es2019/version-wrapper.js

@@ -1,3 +1,3 @@
 export const name = "@atlaskit/editor-core";
 // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
-export const version = "233.0.1";
+export const version = "234.0.0";

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

@@ -8,7 +8,7 @@ import isEqual from 'lodash/isEqual';
 import { v4 as uuid } from 'uuid';
 import { FabricEditorAnalyticsContext } from '@atlaskit/analytics-namespaced-context/FabricEditorAnalyticsContext';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next/useAnalyticsEvents';
-import { ACTION } from '@atlaskit/editor-common/analytics';
+import { ACTION, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { startMeasure, stopMeasure } from '@atlaskit/editor-common/performance-measures';
 import { getAnalyticsAppearance } from '@atlaskit/editor-common/utils/analytics';
 import EditorActions from '../actions';
@@ -42,6 +42,9 @@ function Editor(passedProps) {
   var editorActions = editorContext.editorActions || editorActionsPlaceholderInstance;
   var _useAnalyticsEvents = useAnalyticsEvents(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  var handleAnalyticsEvent = useCallback(function (data) {
+    fireAnalyticsEvent(createAnalyticsEvent)(data);
+  }, [createAnalyticsEvent]);
   var getFeatureFlagsFromRef = useCallback(function () {
     var _propsRef$current$col, _propsRef$current$col2;
     return _objectSpread(_objectSpread({}, createFeatureFlagsFromProps(propsRef.current.featureFlags)), {}, {
@@ -80,6 +83,7 @@ function Editor(passedProps) {
   }, [onSaveFromProps]);
   return /*#__PURE__*/React.createElement(EditorInternal, {
     props: props,
+    handleAnalyticsEvent: handleAnalyticsEvent,
     createAnalyticsEvent: createAnalyticsEvent,
     preset: props.preset,
     handleSave: handleSave,

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

@@ -3,8 +3,10 @@ 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; }
 import React, { Fragment, memo } from 'react';
+import { ACTION, ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
 import { usePortalProvider } from '@atlaskit/editor-common/portal';
 import { editorFontSize } from '@atlaskit/editor-shared-styles';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { componentWithCondition } from '@atlaskit/platform-feature-flags-react/component-with-condition';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import ErrorBoundary from '../create-editor/ErrorBoundary';
@@ -12,6 +14,7 @@ import ReactEditorViewNext from '../create-editor/ReactEditorView';
 import EditorContext from '../ui/EditorContext';
 import { IntlProviderIfMissingWrapper } from '../ui/IntlProviderIfMissingWrapper/IntlProviderIfMissingWrapper';
 import { createFeatureFlagsFromProps } from '../utils/feature-flags-from-props';
+import { RenderTracking } from '../utils/performance/components/RenderTracking';
 import { BaseThemeWrapper } from './BaseThemeWrapper';
 import { EditorInternalContainerCompiled } from './editor-internal-compiled';
 import { EditorInternalContainerEmotion } from './editor-internal-emotion';
@@ -19,12 +22,15 @@ import { getBaseFontSize } from './utils/getBaseFontSize';
 var EditorInternalContainerMigration = componentWithCondition(function () {
   return expValEquals('platform_editor_core_non_ecc_static_css', 'isEnabled', true);
 }, EditorInternalContainerCompiled, EditorInternalContainerEmotion);
+var DEFAULT_VALUE_PROP_TO_IGNORE = ['defaultValue'];
+
 /**
  * EditorInternalComponent is used to capture the common component
  * from the `render` method of `Editor` and share it with `EditorNext`.
  */
 export var EditorInternal = /*#__PURE__*/memo(function (_ref) {
   var props = _ref.props,
+    handleAnalyticsEvent = _ref.handleAnalyticsEvent,
     createAnalyticsEvent = _ref.createAnalyticsEvent,
     handleSave = _ref.handleSave,
     editorActions = _ref.editorActions,
@@ -39,6 +45,7 @@ export var EditorInternal = /*#__PURE__*/memo(function (_ref) {
     analyticsHandler: undefined
   });
   var featureFlags = createFeatureFlagsFromProps(props.featureFlags);
+  var renderTrackingEnabled = isExperimentEnabled('platform_editor_enable_rerender_tracking') && !featureFlags.lcmPreventRenderTracking;
   var _usePortalProvider = usePortalProvider(),
     _usePortalProvider2 = _slicedToArray(_usePortalProvider, 2),
     portalProviderAPI = _usePortalProvider2[0],
@@ -47,13 +54,21 @@ export var EditorInternal = /*#__PURE__*/memo(function (_ref) {
     _usePortalProvider4 = _slicedToArray(_usePortalProvider3, 2),
     nodeViewPortalProviderAPI = _usePortalProvider4[0],
     NodeViewPortalRenderer = _usePortalProvider4[1];
+  var propsToIgnore = isExperimentEnabled('platform_editor_perf_lint_cleanup') ? DEFAULT_VALUE_PROP_TO_IGNORE : ['defaultValue'];
   var baseFontSize = getBaseFontSize(props.appearance, props.contentMode);
-  var fontSize = expValEquals('platform_editor_core_non_ecc_static_css', 'isEnabled', true) || expValEquals('platform_editor_core_static_css', 'isEnabled', true) ? editorFontSize({
+  var fontSize = editorFontSize({
     theme: {
       baseFontSize: baseFontSize
     }
-  }) : undefined;
-  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(ErrorBoundary, {
+  });
+  return /*#__PURE__*/React.createElement(Fragment, null, renderTrackingEnabled && /*#__PURE__*/React.createElement(RenderTracking, {
+    componentProps: props,
+    action: ACTION.RE_RENDERED,
+    actionSubject: ACTION_SUBJECT.EDITOR,
+    handleAnalyticsEvent: handleAnalyticsEvent,
+    propsToIgnore: propsToIgnore,
+    useShallow: false
+  }), /*#__PURE__*/React.createElement(ErrorBoundary, {
     errorTracking: true,
     createAnalyticsEvent: createAnalyticsEvent,
     contextIdentifierProvider: props.contextIdentifierProvider,

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

@@ -45,6 +45,7 @@ import { getNodesCountWithExtensionKeys } from '../utils/getNodesCountWithExtens
 import { getNodesVisibleInViewport } from '../utils/getNodesVisibleInViewport';
 import { isChromeless } from '../utils/is-chromeless';
 import { isFullPage } from '../utils/is-full-page';
+import { RenderTracking } from '../utils/performance/components/RenderTracking';
 import measurements from '../utils/performance/measure-enum';
 import { PROSEMIRROR_RENDERED_DEGRADED_SEVERITY_THRESHOLD, PROSEMIRROR_RENDERED_NORMAL_SEVERITY_THRESHOLD } from './consts';
 import { processPluginsList } from './create-editor';
@@ -1184,13 +1185,20 @@ export function ReactEditorView(props) {
   // We should follow-up
   // eslint-disable-next-line react-hooks/exhaustive-deps
   [props.editorProps.assistiveLabel, props.editorProps.assistiveDescribedBy, ssrEditor]);
+  var renderTrackingEnabled = isExperimentEnabled('platform_editor_enable_rerender_tracking') && !featureFlags.lcmPreventRenderTracking;
   return /*#__PURE__*/React.createElement(SSRRenderMeasure, {
     segmentName: SSR_TRACE_SEGMENT_NAME,
     startTimestampRef: firstRenderStartTimestampRef,
     onSSRMeasure: onSSRMeasure
   }, /*#__PURE__*/React.createElement(ReactEditorViewContext.Provider, {
     value: reactEditorViewContext
-  }, props.render ? (_props$render = (_props$render2 = props.render) === null || _props$render2 === void 0 ? void 0 : _props$render2.call(props, {
+  }, renderTrackingEnabled && /*#__PURE__*/React.createElement(RenderTracking, {
+    componentProps: props,
+    action: ACTION.RE_RENDERED,
+    actionSubject: ACTION_SUBJECT.REACT_EDITOR_VIEW,
+    handleAnalyticsEvent: handleAnalyticsEvent,
+    useShallow: true
+  }), props.render ? (_props$render = (_props$render2 = props.render) === null || _props$render2 === void 0 ? void 0 : _props$render2.call(props, {
     editor: editor,
     view: viewRef.current,
     config: config.current,