@atlaskit/editor-core 187.4.11 → 187.5.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/editor-core
 
+## 187.5.0
+
+### Minor Changes
+
+- [`164ab991f40`](https://bitbucket.org/atlassian/atlassian-frontend/commits/164ab991f40) - Updating the composable editor (@atlaskit/editor-core/composable-editor) to a functional component.
+
 ## 187.4.11
 
 ### Patch Changes

package/dist/cjs/editor-next/index.js

@@ -4,142 +4,120 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+exports.Editor = Editor;
+exports.default = EditorNext;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
+var _react = require("react");
 var _react2 = require("@emotion/react");
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _v = _interopRequireDefault(require("uuid/v4"));
 var _analyticsNamespacedContext = require("@atlaskit/analytics-namespaced-context");
 var _analytics = require("@atlaskit/editor-common/analytics");
-var _ui = require("@atlaskit/editor-common/ui");
+var _ufo = require("@atlaskit/editor-common/ufo");
 var _utils = require("@atlaskit/editor-common/utils");
+var _plugins = require("../plugins");
 var _actions = _interopRequireDefault(require("../actions"));
 var _featureFlagsFromProps = require("../create-editor/feature-flags-from-props");
-var _plugins = require("../plugins");
 var _versionWrapper = require("../version-wrapper");
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _hooks = require("@atlaskit/editor-common/hooks");
+var _EditorContext = require("../ui/EditorContext");
+var _measureEnum = _interopRequireDefault(require("../utils/performance/measure-enum"));
 var _editorInternal = _interopRequireDefault(require("./editor-internal"));
 var _deprecationWarnings = _interopRequireDefault(require("./utils/deprecationWarnings"));
-var _editorPropTypes = require("./utils/editorPropTypes");
-var _onEditorCreated2 = _interopRequireDefault(require("./utils/onEditorCreated"));
+var _sendDurationAnalytics = _interopRequireDefault(require("./utils/sendDurationAnalytics"));
 var _trackEditorActions = _interopRequireDefault(require("./utils/trackEditorActions"));
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /** @jsx jsx */
-var EditorNext = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(EditorNext, _React$Component);
-  var _super = _createSuper(EditorNext);
-  function EditorNext(props, context) {
-    var _this;
-    (0, _classCallCheck2.default)(this, EditorNext);
-    _this = _super.call(this, props);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleSave", function (view) {
-      var _this$props$onSave, _this$props;
-      return (_this$props$onSave = (_this$props = _this.props).onSave) === null || _this$props$onSave === void 0 ? void 0 : _this$props$onSave.call(_this$props, view);
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleAnalyticsEvent", function (data) {
-      return (0, _analytics.fireAnalyticsEvent)(_this.createAnalyticsEvent)(data);
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFeatureFlags", function () {
-      return (0, _featureFlagsFromProps.createFeatureFlagsFromProps)(_this.props);
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getExperienceStore", function () {
-      return _this.experienceStore;
-    });
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /** @jsx jsx */
+function Editor(passedProps) {
+  var _editorContext$editor;
+  var defaultProps = {
+    appearance: 'comment',
+    disabled: false,
+    quickInsert: true
+  };
+  var props = _objectSpread(_objectSpread({}, defaultProps), passedProps);
+  var editorContext = (0, _EditorContext.useEditorContext)();
+  var editorActions = (0, _react.useRef)((_editorContext$editor = editorContext === null || editorContext === void 0 ? void 0 : editorContext.editorActions) !== null && _editorContext$editor !== void 0 ? _editorContext$editor : new _actions.default());
+  var startTime = (0, _react.useRef)(performance.now());
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  var experienceStore = (0, _react.useRef)();
+  var handleAnalyticsEvent = function handleAnalyticsEvent(data) {
+    return (0, _analytics.fireAnalyticsEvent)(createAnalyticsEvent)(data);
+  };
+  (0, _hooks.useConstructor)(function () {
     (0, _deprecationWarnings.default)(props);
-    _this.editorActions = (context || {}).editorActions || new _actions.default();
-    _this.editorSessionId = (0, _v.default)();
-    _this.startTime = performance.now();
-    _this.onEditorCreated = _this.onEditorCreated.bind((0, _assertThisInitialized2.default)(_this));
-    _this.onEditorDestroyed = _this.onEditorDestroyed.bind((0, _assertThisInitialized2.default)(_this));
-    _this.getExperienceStore = _this.getExperienceStore.bind((0, _assertThisInitialized2.default)(_this));
-    (0, _trackEditorActions.default)(_this.editorActions, props.performanceTracking, function (value) {
-      return _this.handleAnalyticsEvent(value);
+    (0, _trackEditorActions.default)(editorActions.current, props.performanceTracking, function (value) {
+      return handleAnalyticsEvent(value);
     });
-    return _this;
-  }
-  (0, _createClass2.default)(EditorNext, [{
-    key: "onEditorCreated",
-    value: function onEditorCreated(instance) {
-      var _this2 = this;
-      (0, _onEditorCreated2.default)(instance, this.props, function (experienceStore) {
-        return _this2.experienceStore = experienceStore;
-      }, this.getExperienceStore, function () {
-        return _this2.createAnalyticsEvent;
-      }, this.editorActions, this.startTime, function (view, dispatcher, transformerForActions) {
-        return _this2.registerEditorForActions(view, dispatcher, transformerForActions);
-      });
-    }
-  }, {
-    key: "onEditorDestroyed",
-    value: function onEditorDestroyed(_instance) {
-      var _this$props$onDestroy, _this$props2;
-      this.unregisterEditorFromActions();
-      (_this$props$onDestroy = (_this$props2 = this.props).onDestroy) === null || _this$props$onDestroy === void 0 ? void 0 : _this$props$onDestroy.call(_this$props2);
+  });
+  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 (0, _featureFlagsFromProps.createFeatureFlagsFromProps)(props);
+    });
+    if ((_props$featureFlags = props.featureFlags) !== null && _props$featureFlags !== void 0 && _props$featureFlags.ufo) {
+      var _experienceStore$curr;
+      experienceStore.current = _ufo.ExperienceStore.getInstance(instance.view);
+      (_experienceStore$curr = experienceStore.current) === null || _experienceStore$curr === void 0 ? void 0 : _experienceStore$curr.start(_ufo.EditorExperience.loadEditor, startTime.current);
     }
-  }, {
-    key: "registerEditorForActions",
-    value: function registerEditorForActions(editorView, eventDispatcher, contentTransformer) {
-      this.editorActions._privateRegisterEditor(editorView, eventDispatcher, contentTransformer, this.getFeatureFlags);
+    if (props.onEditorReady) {
+      var _props$performanceTra, _props$performanceTra2, _props$featureFlags2;
+      var 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 && (0, _utils.startMeasure)(_measureEnum.default.ON_EDITOR_READY_CALLBACK);
+      props.onEditorReady(editorActions.current);
+      measureEditorReady && (0, _utils.stopMeasure)(_measureEnum.default.ON_EDITOR_READY_CALLBACK, (0, _sendDurationAnalytics.default)(_analytics.ACTION.ON_EDITOR_READY_CALLBACK, props, getExperienceStore, createAnalyticsEvent));
     }
-  }, {
-    key: "unregisterEditorFromActions",
-    value: function unregisterEditorFromActions() {
-      this.editorActions._privateUnregisterEditor();
+  };
+  var onEditorDestroyed = function onEditorDestroyed(_instance) {
+    var _props$onDestroy;
+    editorActions.current._privateUnregisterEditor();
+    (_props$onDestroy = props.onDestroy) === null || _props$onDestroy === void 0 ? void 0 : _props$onDestroy.call(props);
+  };
+  return (0, _react2.jsx)(_editorInternal.default, {
+    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,
+    getExperienceStore: getExperienceStore,
+    onEditorCreated: onEditorCreated,
+    onEditorDestroyed: onEditorDestroyed
+  });
+}
+function EditorNext(props) {
+  var editorSessionId = (0, _react.useRef)((0, _v.default)());
+  return (0, _react2.jsx)(_analyticsNamespacedContext.FabricEditorAnalyticsContext, {
+    data: {
+      packageName: _versionWrapper.name,
+      packageVersion: _versionWrapper.version,
+      componentName: 'editorCore',
+      appearance: (0, _utils.getAnalyticsAppearance)(props.appearance),
+      editorSessionId: editorSessionId.current
     }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this3 = this;
-      return (0, _react2.jsx)(_analyticsNamespacedContext.FabricEditorAnalyticsContext, {
-        data: {
-          packageName: _versionWrapper.name,
-          packageVersion: _versionWrapper.version,
-          componentName: 'editorCore',
-          appearance: (0, _utils.getAnalyticsAppearance)(this.props.appearance),
-          editorSessionId: this.editorSessionId
-        }
-      }, (0, _react2.jsx)(_ui.WithCreateAnalyticsEvent, {
-        render: function render(createAnalyticsEvent) {
-          return (_this3.createAnalyticsEvent = createAnalyticsEvent) && (0, _react2.jsx)(_editorInternal.default, {
-            props: _this3.props,
-            handleAnalyticsEvent: _this3.handleAnalyticsEvent,
-            createAnalyticsEvent: _this3.createAnalyticsEvent,
-            preset: _this3.props.preset,
-            handleSave: _this3.handleSave,
-            editorActions: _this3.editorActions,
-            getExperienceStore: _this3.getExperienceStore,
-            onEditorCreated: _this3.onEditorCreated,
-            onEditorDestroyed: _this3.onEditorDestroyed
-          });
-        }
-      }));
+  }, (0, _react2.jsx)(Editor, props));
+}
+EditorNext.propTypes = {
+  minHeight: function minHeight(_ref) {
+    var appearance = _ref.appearance,
+      _minHeight = _ref.minHeight;
+    if (_minHeight && appearance && !['comment', 'chromeless'].includes(appearance)) {
+      return new Error('minHeight only supports editor appearance chromeless and comment for Editor');
     }
-  }]);
-  return EditorNext;
-}(_react.default.Component);
-exports.default = EditorNext;
-(0, _defineProperty2.default)(EditorNext, "defaultProps", {
-  appearance: 'comment',
-  disabled: false,
-  quickInsert: true
-});
-(0, _defineProperty2.default)(EditorNext, "contextTypes", {
-  editorActions: _propTypes.default.object
-});
-(0, _defineProperty2.default)(EditorNext, "propTypes", _objectSpread(_objectSpread({}, (0, _editorPropTypes.propTypes)('minHeight only supports editor appearance chromeless and comment for EditorNext')), {}, {
-  preset: function preset(_ref) {
-    var _preset = _ref.preset;
+    return null;
+  },
+  preset: function preset(_ref2) {
+    var _preset = _ref2.preset;
     if (!_preset.has(_plugins.basePlugin)) {
       return new Error('Presets must contain the base plugin');
     }
     return null;
   }
-}));
+};

package/dist/cjs/editor.js

@@ -14,7 +14,6 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
-var _editorPropTypes = require("./editor-next/utils/editorPropTypes");
 var _editorNext = _interopRequireDefault(require("./editor-next"));
 var _useUniversalPreset = _interopRequireDefault(require("./labs/next/presets/useUniversalPreset"));
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
@@ -46,4 +45,11 @@ var Editor = /*#__PURE__*/function (_React$Component) {
   return Editor;
 }(_react.default.Component);
 exports.default = Editor;
-(0, _defineProperty2.default)(Editor, "defaultProps", _editorPropTypes.defaultProps);
+(0, _defineProperty2.default)(Editor, "defaultProps", {
+  appearance: 'comment',
+  disabled: false,
+  extensionHandlers: {},
+  allowHelpDialog: true,
+  allowNewInsertionBehaviour: true,
+  quickInsert: true
+});

package/dist/cjs/ui/CollapsedEditor/index.js

@@ -41,7 +41,7 @@ var CollapsedEditor = /*#__PURE__*/function (_React$Component) {
   (0, _createClass2.default)(CollapsedEditor, [{
     key: "componentDidUpdate",
     value: function componentDidUpdate() {
-      if (this.props.isExpanded && this.editorComponent && (!this.previouslyExpanded || this.previouslyExpanded === undefined)) {
+      if (this.props.isExpanded && (this.editorComponent || this.functionalEditor) && (!this.previouslyExpanded || this.previouslyExpanded === undefined)) {
         var _this$props$onExpand, _this$props;
         (_this$props$onExpand = (_this$props = this.props).onExpand) === null || _this$props$onExpand === void 0 ? void 0 : _this$props$onExpand.call(_this$props);
       }
@@ -55,12 +55,18 @@ var CollapsedEditor = /*#__PURE__*/function (_React$Component) {
       if (child.type !== _editor.default && child.type !== _EditorWithActions.default && child.type !== _editorNext.default) {
         throw new Error('Expected child to be of type `Editor`');
       }
+      this.functionalEditor = child.type === _editorNext.default;
       if (!this.props.isExpanded) {
         return /*#__PURE__*/_react.default.createElement(_ui.IntlProviderIfMissingWrapper, null, /*#__PURE__*/_react.default.createElement(_ChromeCollapsed.default, {
           onFocus: this.props.onFocus,
           text: this.props.placeholder
         }));
       }
+
+      // Let's avoid ref logic for functional Editor
+      if (this.functionalEditor) {
+        return child;
+      }
       return /*#__PURE__*/_react.default.cloneElement(child, {
         ref: function ref(editorComponent) {
           return _this2.handleEditorRef(editorComponent, child.ref);

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.nextMajorVersion = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "187.4.11";
+var version = "187.5.0";
 exports.version = version;
 var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "187.4.11",
+	"version": "187.5.0",
 	"sideEffects": false
 }

package/dist/es2019/editor-next/index.js

@@ -1,91 +1,105 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /** @jsx jsx */
-import React from 'react';
+import { useRef } from 'react';
 import { jsx } from '@emotion/react';
-import PropTypes from 'prop-types';
 import uuid from 'uuid/v4';
 import { FabricEditorAnalyticsContext } from '@atlaskit/analytics-namespaced-context';
-import { fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
-import { WithCreateAnalyticsEvent } from '@atlaskit/editor-common/ui';
-import { getAnalyticsAppearance } from '@atlaskit/editor-common/utils';
+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 '../plugins';
 import EditorActions from '../actions';
 import { createFeatureFlagsFromProps } from '../create-editor/feature-flags-from-props';
-import { basePlugin } from '../plugins';
 import { name, version } from '../version-wrapper';
+import { useAnalyticsEvents } from '@atlaskit/analytics-next';
+import { useConstructor } from '@atlaskit/editor-common/hooks';
+import { useEditorContext } from '../ui/EditorContext';
+import measurements from '../utils/performance/measure-enum';
 import EditorInternal from './editor-internal';
 import deprecationWarnings from './utils/deprecationWarnings';
-import { propTypes } from './utils/editorPropTypes';
-import onEditorCreated from './utils/onEditorCreated';
+import sendDurationAnalytics from './utils/sendDurationAnalytics';
 import trackEditorActions from './utils/trackEditorActions';
-export default class EditorNext extends React.Component {
-  constructor(props, context) {
-    super(props);
-    _defineProperty(this, "handleSave", view => {
-      var _this$props$onSave, _this$props;
-      return (_this$props$onSave = (_this$props = this.props).onSave) === null || _this$props$onSave === void 0 ? void 0 : _this$props$onSave.call(_this$props, view);
-    });
-    _defineProperty(this, "handleAnalyticsEvent", data => fireAnalyticsEvent(this.createAnalyticsEvent)(data));
-    _defineProperty(this, "getFeatureFlags", () => {
-      return createFeatureFlagsFromProps(this.props);
-    });
-    _defineProperty(this, "getExperienceStore", () => this.experienceStore);
+export 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(() => {
     deprecationWarnings(props);
-    this.editorActions = (context || {}).editorActions || new EditorActions();
-    this.editorSessionId = uuid();
-    this.startTime = performance.now();
-    this.onEditorCreated = this.onEditorCreated.bind(this);
-    this.onEditorDestroyed = this.onEditorDestroyed.bind(this);
-    this.getExperienceStore = this.getExperienceStore.bind(this);
-    trackEditorActions(this.editorActions, props.performanceTracking, value => this.handleAnalyticsEvent(value));
-  }
-  onEditorCreated(instance) {
-    onEditorCreated(instance, this.props, experienceStore => this.experienceStore = experienceStore, this.getExperienceStore, () => this.createAnalyticsEvent, this.editorActions, this.startTime, (view, dispatcher, transformerForActions) => this.registerEditorForActions(view, dispatcher, transformerForActions));
-  }
-  onEditorDestroyed(_instance) {
-    var _this$props$onDestroy, _this$props2;
-    this.unregisterEditorFromActions();
-    (_this$props$onDestroy = (_this$props2 = this.props).onDestroy) === null || _this$props$onDestroy === void 0 ? void 0 : _this$props$onDestroy.call(_this$props2);
-  }
-  registerEditorForActions(editorView, eventDispatcher, contentTransformer) {
-    this.editorActions._privateRegisterEditor(editorView, eventDispatcher, contentTransformer, this.getFeatureFlags);
-  }
-  unregisterEditorFromActions() {
-    this.editorActions._privateUnregisterEditor();
-  }
-  render() {
-    return jsx(FabricEditorAnalyticsContext, {
-      data: {
-        packageName: name,
-        packageVersion: version,
-        componentName: 'editorCore',
-        appearance: getAnalyticsAppearance(this.props.appearance),
-        editorSessionId: this.editorSessionId
-      }
-    }, jsx(WithCreateAnalyticsEvent, {
-      render: createAnalyticsEvent => (this.createAnalyticsEvent = createAnalyticsEvent) && jsx(EditorInternal, {
-        props: this.props,
-        handleAnalyticsEvent: this.handleAnalyticsEvent,
-        createAnalyticsEvent: this.createAnalyticsEvent,
-        preset: this.props.preset,
-        handleSave: this.handleSave,
-        editorActions: this.editorActions,
-        getExperienceStore: this.getExperienceStore,
-        onEditorCreated: this.onEditorCreated,
-        onEditorDestroyed: this.onEditorDestroyed
-      })
-    }));
-  }
+    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);
+  };
+  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,
+    getExperienceStore: getExperienceStore,
+    onEditorCreated: onEditorCreated,
+    onEditorDestroyed: onEditorDestroyed
+  });
+}
+export default function EditorNext(props) {
+  const editorSessionId = useRef(uuid());
+  return jsx(FabricEditorAnalyticsContext, {
+    data: {
+      packageName: name,
+      packageVersion: version,
+      componentName: 'editorCore',
+      appearance: getAnalyticsAppearance(props.appearance),
+      editorSessionId: editorSessionId.current
+    }
+  }, jsx(Editor, props));
 }
-_defineProperty(EditorNext, "defaultProps", {
-  appearance: 'comment',
-  disabled: false,
-  quickInsert: true
-});
-_defineProperty(EditorNext, "contextTypes", {
-  editorActions: PropTypes.object
-});
-_defineProperty(EditorNext, "propTypes", {
-  ...propTypes('minHeight only supports editor appearance chromeless and comment for EditorNext'),
+EditorNext.propTypes = {
+  minHeight: ({
+    appearance,
+    minHeight
+  }) => {
+    if (minHeight && appearance && !['comment', 'chromeless'].includes(appearance)) {
+      return new Error('minHeight only supports editor appearance chromeless and comment for Editor');
+    }
+    return null;
+  },
   preset: ({
     preset
   }) => {
@@ -94,4 +108,4 @@ _defineProperty(EditorNext, "propTypes", {
     }
     return null;
   }
-});
+};

package/dist/es2019/editor.js

@@ -3,7 +3,6 @@ import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
 import React from 'react';
 import { jsx } from '@emotion/react';
-import { defaultProps } from './editor-next/utils/editorPropTypes';
 import EditorNext from './editor-next';
 import useUniversalPreset from './labs/next/presets/useUniversalPreset';
 const EditorNextWrapper = ({
@@ -23,4 +22,11 @@ export default class Editor extends React.Component {
     });
   }
 }
-_defineProperty(Editor, "defaultProps", defaultProps);
+_defineProperty(Editor, "defaultProps", {
+  appearance: 'comment',
+  disabled: false,
+  extensionHandlers: {},
+  allowHelpDialog: true,
+  allowNewInsertionBehaviour: true,
+  quickInsert: true
+});

package/dist/es2019/ui/CollapsedEditor/index.js

@@ -16,7 +16,7 @@ export default class CollapsedEditor extends React.Component {
     });
   }
   componentDidUpdate() {
-    if (this.props.isExpanded && this.editorComponent && (!this.previouslyExpanded || this.previouslyExpanded === undefined)) {
+    if (this.props.isExpanded && (this.editorComponent || this.functionalEditor) && (!this.previouslyExpanded || this.previouslyExpanded === undefined)) {
       var _this$props$onExpand, _this$props;
       (_this$props$onExpand = (_this$props = this.props).onExpand) === null || _this$props$onExpand === void 0 ? void 0 : _this$props$onExpand.call(_this$props);
     }
@@ -27,12 +27,18 @@ export default class CollapsedEditor extends React.Component {
     if (child.type !== Editor && child.type !== EditorWithActions && child.type !== EditorNext) {
       throw new Error('Expected child to be of type `Editor`');
     }
+    this.functionalEditor = child.type === EditorNext;
     if (!this.props.isExpanded) {
       return /*#__PURE__*/React.createElement(IntlProviderIfMissingWrapper, null, /*#__PURE__*/React.createElement(ChromeCollapsed, {
         onFocus: this.props.onFocus,
         text: this.props.placeholder
       }));
     }
+
+    // Let's avoid ref logic for functional Editor
+    if (this.functionalEditor) {
+      return child;
+    }
     return /*#__PURE__*/React.cloneElement(child, {
       ref: editorComponent => this.handleEditorRef(editorComponent, child.ref)
     });

package/dist/es2019/version-wrapper.js

@@ -1,5 +1,5 @@
 export const name = "@atlaskit/editor-core";
-export const version = "187.4.11";
+export const version = "187.5.0";
 export const nextMajorVersion = () => {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "187.4.11",
+	"version": "187.5.0",
 	"sideEffects": false
 }