@atlaskit/editor-core 182.0.3 → 182.1.0

package/.eslintrc.js

@@ -19,12 +19,14 @@ module.exports = {
         ],
       },
     ],
+    'react/no-danger': 'error',
   },
   overrides: [
     {
       files: ['**/__tests__/**/*.{js,ts,tsx}', 'examples/**/*.{js,ts,tsx}'],
       rules: {
         'import/no-restricted-paths': ['off'],
+        'react/no-danger': 'off',
       },
     },
   ],

package/CHANGELOG.md

@@ -1,5 +1,45 @@
 # @atlaskit/editor-core
 
+## 182.1.0
+
+### Minor Changes
+
+- [`ba95f121a52`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ba95f121a52) - ED-17378 Added assistiveLabel prop to Editor.
+- [`c2385dcb8f7`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c2385dcb8f7) - [ux] ED-17043 Expanded table chart colors from 20 to 36 colors.
+- [`e88e54a14e3`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e88e54a14e3) - [ux] [ux] Added 'allowAlignment' and 'allowWrapping' as options in 'cardOptions' to let Trello to disable the features
+- [`d9a8fe191f2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d9a8fe191f2) - [ED-17295] Update feature flag usage for media plugin
+- [`0237059f136`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0237059f136) - Integrates @atlaskit/link-analytics for improved tracking of links
+  This can be enabled via the `lp-analytics-events-next` feature flag.
+  When enabled, tracks links changed in every transaction and fires `link created`, `link deleted` and `link updated` accordingly.
+
+  ```ts
+  <SmartCardProvider
+    featureFlags={{
+      enableResolveMetadataForLinkAnalytics: true,
+    }}
+  >
+    <Editor
+      featureFlags={{
+        'lp-analytics-events-next': true,
+      }}
+    />
+  </SmartCardProvider>
+  ```
+
+- [`21b20f571fa`](https://bitbucket.org/atlassian/atlassian-frontend/commits/21b20f571fa) - [ED-17382] Update feature flag usage for rule plugin
+- [`b289da93d3c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b289da93d3c) - [ED-17384] Remove feature flags context plugin
+- [`f99b84adfab`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f99b84adfab) - Fix backspace behaviour in block quotes to prevent merging into panels
+- [`2cfb05a2cf8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/2cfb05a2cf8) - [ux] ED-17278 - Added shortcuts to Editor Help dialog
+
+### Patch Changes
+
+- [`2e01c9c74b5`](https://bitbucket.org/atlassian/atlassian-frontend/commits/2e01c9c74b5) - DUMMY remove before merging to master; dupe adf-schema via adf-utils
+- [`e9422d1b0c9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e9422d1b0c9) - [ED-17383] Update feature flag usage in text color plugin
+- [`b6ee3d64a94`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b6ee3d64a94) - Improves internal getStepRange utility accuracy
+- [`3e612ba32a6`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3e612ba32a6) - [ED-17381] Update feature flag usage in paste plugin
+- [`1be4313d684`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1be4313d684) - Removes redundant code paths related to outstanding card requests from internal card plugin
+- Updated dependencies
+
 ## 182.0.3
 
 ### Patch Changes

package/README.md

@@ -0,0 +1,20 @@
+# editor-core
+
+Main package for the Atlassian Editor.
+
+## Quick Start
+
+Current devloop involves leveraging the atlaskit website shell to build out examples.
+
+0. After following https://developer.atlassian.com/cloud/framework/atlassian-frontend/getting-started/getting-started/
+1. `yarn start editor-core`
+
+Then hit http://localhost:9000/examples/editor/editor-core
+
+This opts you into the default esbuild configuration. If needing to fall back to webpack, this can be done via
+`yarn start editor-core --experimental=webpack`
+
+Running visual regression tests will also use the webpack build, due to the slight variation in how those assets are built for styling
+`VISUAL_REGRESSION=true yarn start editor-core`
+
+If you need to override the default port and run multiple builds side by side, use the `PORT` env variable: `PORT=9005 yarn start editor-core`

package/architecture/0001-record-architecture-decisions.md

@@ -0,0 +1,25 @@
+# 1. Record architecture decisions
+
+Date: 2023-04-05
+
+## Status
+
+Accepted
+
+## Context
+
+We need to record some lightweight architectural decisions made on this project.
+
+## Decision
+
+As a mechanism for a more "lightweight" RFC approach for smaller decisions.
+
+Scope could also include larger ones summarised once an RFC/DACI might be accepted.
+
+Some of the dates will be backdated to port/transfer over some of the decisions from our decision log/registry.
+
+We will use Architecture Decision Records, as [described by Michael Nygard](http://thinkrelevance.com/blog/2011/11/15/documenting-architecture-decisions).
+
+## Consequences
+
+See Michael Nygard's article, linked above. For a lightweight ADR toolset, see Nat Pryce's [adr-tools](https://github.com/npryce/adr-tools).

package/architecture/0002-deep-equality-check-for-getsharedstate.md

@@ -0,0 +1,67 @@
+# 2. Deep equality check for getSharedState
+
+Date: 2023-03-17
+
+## Status
+
+Accepted
+
+## Context
+
+via @Rodrigo Vieira https://atlassian.slack.com/archives/C046RBH9HT5/p1679018928924739
+
+People, we have a optimisation situation with the getSharedState.
+
+Right now, it is expect to be a pure function, That means return the same value for the same input, but you could do something like that
+
+```ts
+getSharedState(editorState) {
+  if (isDocumentEmpty(editorState) ) {
+    return {
+      isDocEmpty: true,
+    };
+  }
+
+  return {
+      isDocEmpty: false,
+  };
+}
+```
+
+Right we are doing a shallow check before call the onChange listeners:
+
+```ts
+// Dumb check - should we do a deepcheck?
+if (isInitialization || prevSharedState !== nextSharedState) {
+  (listeners.get(pluginName) || new Set<Callback>()).forEach((callback) => {
+    callbacks.push(
+      callback.bind(callback, { nextSharedState, prevSharedState }),
+    );
+  });
+}
+```
+
+As expected, we need to improve it.
+
+We have two possible approaches
+
+1. Do the same as ProseMirror does
+2. Do a deep check
+
+### Same as ProseMirror does
+
+We can give the last shared state to the getSharedState and the dev would be responsible to return the same object in case there is no change
+
+### Do a deep check
+
+We can use something like `isEqual` and let dev do whatever they want to
+
+## Decision
+
+Use a deep check.
+
+See https://bitbucket.org/%7B%7D/%7Bc8e2f021-38d2-46d0-9b7a-b3f7b428f724%7D/pull-requests/31238
+
+## Consequences
+
+Slight additional performance cost incurred, trading off for safety against plugins having to do the deep check itself.

package/architecture/0003-explicit-plugin-dependencies.md

@@ -0,0 +1,291 @@
+# 3. Explicit Plugin Dependencies
+
+Date: 2023-04-06
+
+## Status
+
+Accepted
+
+## Context
+
+Editor plugins are extremely dependent on each other, and import from each other.
+
+Sometimes to the point of having circular dependencies.
+
+This has many massive side effects, to name just a few:
+
+- Complexity!
+  - devs not being able to clearly reason about the implicit dependencies between plugins
+  - extremely difficult to ship features, bug fixes, without breaking something unintended or even unrelated
+- Performance!
+  - products not being able to integrate a lighter weight of the Atlassian Editor
+  - single bundle size whether you only use a handful of features in a small Editor, or the entire weight of the Full Page Editor
+
+We learned from the [table extraction effort](https://product-fabric.atlassian.net/wiki/spaces/E/pages/3289779107/Editor+DACI+019+Bring+Tables+back) that it was feasible to extract and untangle one of our most complex Editor Plugins, with some temporary APIs to prevent cross importing.
+
+## Decision
+
+We must now prevent plugins from importing one another to reduce complexity within the Editor. In doing so, we can eliminate intricate dependency chains and, using the `getSharedState()` and `actions()` APIs, offer a clear understanding of how different plugins share their state.
+
+Although making this choice is essential, the aim is to address the initial necessity for cross imports to begin with by outlining some "migration examples" and documentation below. This ADR outlines two of the APIs that are now in place, to address some of the challenges and insights gained from the initial table plugin extraction.
+
+### Prevention
+
+Linting errors will now be present for any new code that gets added, where we continue to attempt importing from one plugin into another. (See `ELR101`, `ELR102` in `repo-docs/content/cloud/framework/atlassian-frontend/editor/lint.md`).
+
+### Other resources
+
+- https://product-fabric.atlassian.net/wiki/spaces/EA/pages/3097395592/EXPLORE+Project+Poster+Composable+Editor+prev+Architecture+V3
+- https://product-fabric.atlassian.net/wiki/spaces/EA/pages/3308192650/Composable+Editor+Table+Extraction
+- https://product-fabric.atlassian.net/wiki/spaces/EA/pages/3352725568/MAKE+Project+Poster+Editor+Scalability
+- https://product-fabric.atlassian.net/wiki/spaces/E/pages/3350692271/Editor+RFC+028+Composition+EditorPlugin+Dependency+Injection
+
+## Consequences
+
+Devs will need to stop importing from one plugin into another, and eventually be blocked on it when we upgrade the lint error from warning to erroring.
+
+We are mitigating this, by presenting some samples of how to quickly migrate / "turn on" a plugin into utilising the new `actions()` and `getSharedState()` APIs in EditorPlugin.
+
+A brief "HOWTO" / "HOW TO" guide of how you can migrate existing or new "cross imports", and get the same functionality:
+
+## 1. `getSharedState()` (and `useSharedPluginState()` hook for React Components)
+
+**Problem**: Let's say you want to access the state from `Foo` plugin, into a second Plugin `Bar`. Something like `previouslyInternalStateA`. Previously, you needed to import that plugin key, and then use it. Now we can use `getSharedState()` and 2 methods `currentState()` & `onChange` methods on `api.dependencies.[plugin-name].sharedState`.
+
+### **Before**
+
+**Implicit state dependency**, you are using `Foo` plugin internals from `Bar` plugin.
+
+```ts
+// editor-core/src/plugins/bar-plugin/index.ts
+import { pluginKey as internalFooPluginKey } from '../plugins/foo/pm-plugins/some-internal-to-foo-prosemirror-plugin';
+//...
+const previouslyInternalStateC = internalFooPluginKey.getState(view.state);
+doSomethingBasedOnAnotherPluginInternalState(previouslyInternalStateC);
+///...
+```
+
+### **After**
+
+**Explicit state dependency**, `Foo` plugin "pushes" out, explicitly publicly, shares state surfaced from `internalFooPlugin` prosemirror state internals, for _any_ plugin to use.
+
+### Usage inside general `EditorPlugin` and prosemirror plugins:
+
+```ts
+// editor-core/src/plugins/bar-plugin/index.ts
+
+// Note that this type import can come from a fully extracted plugin, or from a plugin inside editor-core. Cross importing _types_ is OK at this stage
+import type { fooPlugin } from '@atlaskit/editor-plugin-foo';
+// import type { fooPlugin } from '../../src/plugins/editor-plugin-foo/index.ts';
+
+const barPlugin: NextEditorPlugin<
+  'bar',
+  {
+    pluginConfiguration: BarPluginOptions | undefined;
+    dependencies: [typeof fooPlugin];
+  }
+> = (options, api) => {
+  const {
+    nowExplicitStateA,
+    nowExplicitStateB,
+    nowExplicitStateC
+  } = api?.dependencies?.foo?.sharedState.currentState();
+
+  return {
+    name: 'bar',
+    pmPlugins() {//... use nowExplicitStateA
+    }
+    nodes() {...}
+    marks() {...}
+    contentComponent() {//... use nowExplicitStateB
+    }
+    primaryToolbarComponent() {//... use nowExplicitStateC
+    }
+  }
+}
+```
+
+### New `getSharedState()` to expose all explicitly shared state from plugin `Foo`
+
+```ts
+// editor-core/src/plugins/foo-plugin/index.ts
+const fooPlugin: NextEditorPlugin <...> {
+  getSharedState(editorState) {
+    if (!editorState) {
+      return {
+        nowExplicitStateA: null,
+        nowExplicitStateB: false,
+        nowExplicitStateC: "and so on"
+      };
+    }
+
+    const { nowExplicitStateA, nowExplicitStateB, nowExplicitStateC } =
+      selfInternalPluginKey.getState(editorState);
+
+    return {
+      nowExplicitStateA,
+      nowExplicitStateB,
+      nowExplicitStateC,
+    };
+  }
+}
+```
+
+### **The "new parts" again:**
+
+```diff
+// editor-core/src/plugins/bar-plugin/index.ts
+- import { pluginKey as internalFooPluginKey } from '../plugins/foo/pm-plugins/some-internal-to-foo-prosemirror-plugin';
+
+  // Note that this type import can come from a fully extracted plugin, or from a plugin inside editor-core. Cross importing _types_ is OK at this stage
++ import type { fooPlugin } from '@atlaskit/editor-plugin-foo';
+  // import type { fooPlugin } from '../../src/plugins/editor-plugin-foo/index.ts';
+
+  const fooPlugin: NextEditorPlugin<
+    'bar',
+    {
+      pluginConfiguration: SomePluginOptions | undefined;
++     dependencies: [typeof fooPlugin];
+    }
+  > = (options, api) => {
+    const {
++     nowExplicitStateA,
++     nowExplicitStateB,
++     nowExplicitStateC,
++   } = api?.dependencies?.foo?.sharedState.currentState();
+
+    return {
+      name: 'bar',
++     pmPlugins() {//... use nowExplicitStateA
+        // deeper inside the pm plugins...
+-       const previouslyInternalStateC = internalFooPluginKey.getState(view.state);
+      }
+      nodes() {...}
+      marks() {...}
++     contentComponent() {//... use nowExplicitStateB
+      }
++     primaryToolbarComponent() {//... use nowExplicitStateC
+      }
+    }
+  }
+```
+
+### Usage inside a React component
+
+(See date plugin at `packages/editor/editor-core/src/plugins/date/index.tsx` for a full code sample of using `useSharedPluginState`)
+
+```ts
+// editor-core/src/plugins/bar-some-react-component-based-plugin/index.tsx
+function SomeBarComponent({ dependencyApi }) {
+  const { fooState } = useSharedPluginState(
+    dependencyApi,
+    ['foo'],
+  );
+  const { nowExplicitStateA, nowExplicitStateB, nowExplicitStateC } = fooState;
+}
+
+const barPlugin: NextEditorPlugin<
+  'bar',
+  {
+    pluginConfiguration: BarPluginOptions | undefined;
+    dependencies: [typeof fooPlugin];
+  }
+> = (options, api) => {
+  return {
+    name: 'cat',
+    pmPlugins() {}
+    contentComponent() {
+      return <SomeBarComponent dependencyApi={api} />
+    }
+  }
+}
+
+```
+
+Important parts to note:
+
+1. You will need to implement a new `getSharedState()` function inside the current `EditorPlugin` that you require the state from, to expose any "public state" that you would like to make available to other plugins. **Treat this state as "public API" for other plugins**, as any plugin will be able to depend on this and react to it.
+
+2. You _may_ need to update `packages/editor/editor-core/src/labs/next/presets/universal.ts`, if you are creating a new EditorPlugin to depend on.
+
+3. Anywhere where we used to use `WithPluginState` and import plugin keys, you can now use `useSharedPluginState`
+
+## 2. `actions()`
+
+For a full code sample, please see `actions()` implementation in https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/31264?w=1#chg_packages/editor/editor-core/src/plugins/analytics/plugin.ts_newline116
+
+Our first attempt with actions, was on the analytics plugin, which touches almost all plugins and surfaced some other issues. However the same approach can be applied at a smaller scale, for smaller plugins that have "cross action dependencies".
+
+**Problem**: Let's say you had an "`addAnalytics()`" action, used in the `Foo` plugin, and wanted to use it inside of a second, `Bar` plugin.
+
+### **Before**
+
+Again, cross importing from `Foo` plugin, into `Bar` plugin:
+
+```ts
+// editor-core/src/plugins/bar-plugin/index.tsx
+import { addAnalytics } from "../foo-plugin/pm-plugins/actions";
+
+const barPlugin: NextEditorPlugin<
+  'bar'
+> = () => ({
+  someBarPluginCode() {
+    addAnalytics();
+  }
+}
+```
+
+### **After**
+
+```ts
+// editor-core/src/plugins/foo-plugin/index.tsx
+const fooPlugin: NextEditorPlugin<
+  'foo',
+  {
+    dependencies: [typeof fooPlugin],
+  }
+> = (options, api) => ({
+  actions() {
+    addAnalytics() {
+      // Do something
+      // return something
+    }
+  }
+}
+```
+
+```ts
+// editor-core/src/plugins/bar-plugin/index.tsx
+import type { default as fooPlugin } from "../foo-plugin";
+
+const barPlugin: NextEditorPlugin<
+  'bar',
+  {
+    dependencies: [typeof fooPlugin],
+  }
+> = (options, api) => ({
+  someBarPluginCode() {
+    api.externalPlugins?.foo?.actions?.addAnalytics();
+  }
+}
+```
+
+### **The "new parts" again:**
+
+```diff
+// editor-core/src/plugins/bar-plugin/index.tsx
+-  import { addAnalytics as crossImportedAddAnalytics } from "../foo-plugin/pm-plugins/actions";
++  import type { default as fooPlugin } from "../foo-plugin";
+
+  const barPlugin: NextEditorPlugin<
+    'bar',
+    {
++     dependencies: [typeof fooPlugin],
+    }
+  > = (options, api) => ({
+    someBarPluginCode() {
+-     const addAnalytics = crossImportedAddAnalytics;
++     const addAnalytics = api.externalPlugins?.foo?.actions?.addAnalytics();
+    }
+  }
+```

package/dist/cjs/actions/index.js

@@ -17,7 +17,6 @@ var _prosemirrorUtils = require("prosemirror-utils");
 var _eventDispatcher = require("../event-dispatcher");
 var _nativeCollabProviderPlugin = require("../plugins/collab-edit/native-collab-provider-plugin");
 var _utils2 = require("../plugins/extension/utils");
-var _getFeatureFlags = require("../plugins/feature-flags-context/get-feature-flags");
 var _utils3 = require("../utils");
 var _action = require("../utils/action");
 var _deprecationWarnings = _interopRequireDefault(require("../utils/deprecation-warnings"));
@@ -39,19 +38,19 @@ var EditorActions = /*#__PURE__*/function () {
     });
     (0, _defineProperty2.default)(this, "getResolvedEditorState", /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
       var _getCollabProvider;
-      var featureFlags, editorValue, editorView;
+      var _this$getFeatureFlags, useNativeCollabPlugin, editorValue, editorView;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
+              _this$getFeatureFlags = _this.getFeatureFlags(), useNativeCollabPlugin = _this$getFeatureFlags.useNativeCollabPlugin;
               if (_this.editorView) {
-                _context.next = 2;
+                _context.next = 3;
                 break;
               }
               throw new Error('Called getResolvedEditorState before editorView is ready');
-            case 2:
-              featureFlags = (0, _getFeatureFlags.getFeatureFlags)(_this.editorView.state);
-              if (featureFlags.useNativeCollabPlugin) {
+            case 3:
+              if (useNativeCollabPlugin) {
                 _context.next = 10;
                 break;
               }
@@ -97,13 +96,22 @@ var EditorActions = /*#__PURE__*/function () {
     value: function _privateGetEventDispatcher() {
       return this.eventDispatcher;
     }
+  }, {
+    key: "getFeatureFlags",
+    value: function getFeatureFlags() {
+      return {};
+    }
 
     // This method needs to be public for EditorContext component.
   }, {
     key: "_privateRegisterEditor",
     value: function _privateRegisterEditor(editorView, eventDispatcher, contentTransformer) {
+      var getFeatureFlags = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : function () {
+        return {};
+      };
       this.contentTransformer = contentTransformer;
       this.eventDispatcher = eventDispatcher;
+      this.getFeatureFlags = getFeatureFlags;
       if (!this.editorView && editorView) {
         this.editorView = editorView;
         this.listeners.forEach(function (cb) {
@@ -125,6 +133,9 @@ var EditorActions = /*#__PURE__*/function () {
       this.contentTransformer = undefined;
       this.contentEncode = undefined;
       this.eventDispatcher = undefined;
+      this.getFeatureFlags = function () {
+        return {};
+      };
     }
   }, {
     key: "_privateSubscribe",

package/dist/cjs/analytics-api/attach-payload-into-transaction.js

@@ -17,10 +17,11 @@ var attachPayloadIntoTransaction = function attachPayloadIntoTransaction(_ref) {
   payload = (0, _editorStateContext.getStateContext)(editorState, payload);
   payload = (0, _mapAttributes.mapActionSubjectIdToAttributes)(payload);
   var storedMarks = tr.storedMarks;
+  var pos = tr.mapping.map(editorState.selection.$from.pos, -1);
   tr.step(new _steps.AnalyticsStep([{
     payload: payload,
     channel: channel
-  }], actionsToIgnore, editorState.selection.$from.pos) // We need to create the step based on a position, this prevent split history for relative changes.
+  }], actionsToIgnore, pos) // We need to create the step based on a position, this prevent split history for relative changes.
   );
 
   // When you add a new step all the storedMarks are removed it

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

@@ -14,7 +14,6 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _memoizeOne = _interopRequireDefault(require("memoize-one"));
 var _react = _interopRequireDefault(require("react"));
 var _uuid = _interopRequireDefault(require("uuid"));
 var _ufo = require("@atlaskit/editor-common/ufo");
@@ -22,7 +21,6 @@ var _ui = require("@atlaskit/editor-common/ui");
 var _utils = require("@atlaskit/editor-common/utils");
 var _analytics = require("../plugins/analytics");
 var _consts = require("../plugins/analytics/consts");
-var _featureFlagsContext = require("../plugins/feature-flags-context");
 var _documentLogger = require("../utils/document-logger");
 var _WithEditorView = require("./WithEditorView");
 function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = Object.defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof Symbol ? Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return Object.defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = Object.create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = Object.getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype); function defineIteratorMethods(prototype) { ["next", "throw", "return"].forEach(function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], tryLocsList.forEach(pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) { keys.push(key); } return keys.reverse(), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, catch: function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
@@ -41,12 +39,6 @@ var ErrorBoundaryWithEditorView = /*#__PURE__*/function (_React$Component) {
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
       error: undefined
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFeatureFlags", (0, _memoizeOne.default)(function (editorView) {
-      if (!editorView) {
-        return {};
-      }
-      return (0, _featureFlagsContext.getFeatureFlags)(editorView.state);
-    }));
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "sendErrorData", /*#__PURE__*/function () {
       var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(analyticsErrorPayload) {
         var _window, _window$navigator;
@@ -153,20 +145,13 @@ var ErrorBoundaryWithEditorView = /*#__PURE__*/function (_React$Component) {
         docStructure: attributes.docStructure
       };
     });
+    _this.featureFlags = props.featureFlags;
     if (props.editorView) {
       _this.experienceStore = _ufo.ExperienceStore.getInstance(props.editorView);
     }
     return _this;
   }
   (0, _createClass2.default)(ErrorBoundaryWithEditorView, [{
-    key: "featureFlags",
-    get:
-    // Memoizing this as react alternative suggestion of https://reactjs.org/docs/react-component.html#unsafe_componentwillreceiveprops
-
-    function get() {
-      return this.getFeatureFlags(this.props.editorView);
-    }
-  }, {
     key: "componentDidCatch",
     value: function componentDidCatch(error, errorInfo) {
       var _this2 = this;

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

@@ -27,7 +27,7 @@ var _RenderTracking = require("../utils/performance/components/RenderTracking");
 var _nodes = require("../utils/nodes");
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _featureFlagsFromProps = require("./feature-flags-from-props");
-var _getEnabledFeatureFlagKeys = require("../plugins/feature-flags-context/get-enabled-feature-flag-keys");
+var _normalizeFeatureFlags = require("@atlaskit/editor-common/normalize-feature-flags");
 var _createEditor = require("./create-editor");
 var _documentLogger = require("../utils/document-logger");
 var _isFullPage = require("../utils/is-full-page");
@@ -484,7 +484,7 @@ var ReactEditorView = /*#__PURE__*/function (_React$Component) {
       className: getUAPrefix(),
       key: "ProseMirror",
       ref: _this.handleEditorViewRef,
-      "aria-label": _this.props.intl.formatMessage(_messages.editorMessages.editorAssistiveLabel),
+      "aria-label": _this.props.editorProps.assistiveLabel ? _this.props.editorProps.assistiveLabel : _this.props.intl.formatMessage(_messages.editorMessages.editorAssistiveLabel),
       role: "textbox"
     }));
     _this.pluginInjectionAPI = new _preset.EditorPluginInjectionAPI({
@@ -507,7 +507,7 @@ var ReactEditorView = /*#__PURE__*/function (_React$Component) {
     });
     _this.validTransactionCount = 0;
     _this.featureFlags = (0, _featureFlagsFromProps.createFeatureFlagsFromProps)(_this.props.editorProps);
-    var featureFlagsEnabled = _this.featureFlags ? (0, _getEnabledFeatureFlagKeys.getEnabledFeatureFlagKeys)(_this.featureFlags) : [];
+    var featureFlagsEnabled = _this.featureFlags ? (0, _normalizeFeatureFlags.getEnabledFeatureFlagKeys)(_this.featureFlags) : [];
 
     // START TEMPORARY CODE ED-10584
     if (_this.props.createAnalyticsEvent) {

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

@@ -75,7 +75,8 @@ function EditorInternalWithoutHooks(_ref) {
     useShallow: useShallow
   }), (0, _react.jsx)(_ErrorBoundary.default, {
     createAnalyticsEvent: createAnalyticsEvent,
-    contextIdentifierProvider: props.contextIdentifierProvider
+    contextIdentifierProvider: props.contextIdentifierProvider,
+    featureFlags: featureFlags
   }, (0, _react.jsx)(_ui.WidthProvider, {
     css: (0, _react.css)({
       height: '100%'