@atlaskit/editor-core 179.1.2 → 180.1.0

package/dist/esm/ui/ColorPickerButton/index.js

@@ -5,9 +5,12 @@ var _templateObject, _templateObject2, _templateObject3;
 import React from 'react';
 import { css, jsx } from '@emotion/react';
 import { Popup, withOuterListeners } from '@atlaskit/editor-common/ui';
+import { ArrowKeyNavigationProvider, ArrowKeyNavigationType } from '@atlaskit/editor-common/ui-menu';
+import { getSelectedRowAndColumnFromPalette } from '@atlaskit/editor-common/ui-color';
 import Button from '@atlaskit/button';
 import Tooltip from '@atlaskit/tooltip';
-import { N60A } from '@atlaskit/theme/colors';
+import { DN50, N0, N60A } from '@atlaskit/theme/colors';
+import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import ColorPalette from '../ColorPalette';
 import { DEFAULT_BORDER_COLOR } from '../ColorPalette/Palettes/common';
@@ -20,7 +23,12 @@ var colorPickerButtonWrapper = css(_templateObject || (_templateObject = _tagged
 // Control the size of color picker buttons and preview
 // TODO: https://product-fabric.atlassian.net/browse/DSP-4134
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-var colorPickerWrapper = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  border-radius: ", "px;\n  background-color: white;\n  box-shadow: 0 4px 8px -2px ", ", 0 0 1px ", ";\n  padding: 8px 0px;\n"])), borderRadius(), N60A, N60A);
+var colorPickerWrapper = function colorPickerWrapper(theme) {
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  border-radius: ", "px;\n  background-color: ", ";\n  box-shadow: 0 4px 8px -2px ", ", 0 0 1px ", ";\n  padding: 8px 0px;\n"])), borderRadius(), themed({
+    light: "var(--ds-surface-overlay, ".concat(N0, ")"),
+    dark: "var(--ds-surface-overlay, ".concat(DN50, ")")
+  })(theme), N60A, N60A);
+};
 /* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
 
 var ColorPickerButton = function ColorPickerButton(props) {
@@ -30,8 +38,20 @@ var ColorPickerButton = function ColorPickerButton(props) {
     _React$useState2 = _slicedToArray(_React$useState, 2),
     isPopupOpen = _React$useState2[0],
     setIsPopupOpen = _React$useState2[1];
+  var _React$useState3 = React.useState(false),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    isPopupPositioned = _React$useState4[0],
+    setIsPopupPositioned = _React$useState4[1];
+  var _React$useState5 = React.useState(false),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    isOpenedByKeyboard = _React$useState6[0],
+    setIsOpenedByKeyboard = _React$useState6[1];
   var togglePopup = function togglePopup() {
     setIsPopupOpen(!isPopupOpen);
+    if (!isPopupOpen) {
+      setIsOpenedByKeyboard(false);
+      setIsPopupPositioned(false);
+    }
   };
   React.useEffect(function () {
     if (props.setDisableParentScroll) {
@@ -39,9 +59,25 @@ var ColorPickerButton = function ColorPickerButton(props) {
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isPopupOpen]);
+  var focusButton = function focusButton() {
+    var _buttonRef$current;
+    (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 ? void 0 : _buttonRef$current.focus();
+  };
+  var handleEsc = React.useCallback(function () {
+    setIsOpenedByKeyboard(false);
+    setIsPopupPositioned(false);
+    setIsPopupOpen(false);
+    focusButton();
+  }, []);
+  var onPositionCalculated = React.useCallback(function (position) {
+    setIsPopupPositioned(true);
+    return position;
+  }, []);
   var ColorPaletteWithListeners = withOuterListeners(ColorPalette);
   var onColorSelected = function onColorSelected(color, label) {
+    setIsOpenedByKeyboard(false);
     setIsPopupOpen(false);
+    setIsPopupPositioned(false);
     if (props.onChange) {
       if (props.createAnalyticsEvent) {
         // fire analytics
@@ -63,11 +99,16 @@ var ColorPickerButton = function ColorPickerButton(props) {
       });
       newPalette && props.onChange(newPalette);
     }
+    focusButton();
   };
   var renderPopup = function renderPopup() {
     if (!isPopupOpen || !buttonRef.current) {
       return;
     }
+    var selectedColor = props.currentColor || null;
+    var _getSelectedRowAndCol = getSelectedRowAndColumnFromPalette(props.colorPalette, selectedColor, props.cols),
+      selectedRowIndex = _getSelectedRowAndCol.selectedRowIndex,
+      selectedColumnIndex = _getSelectedRowAndCol.selectedColumnIndex;
     return jsx(Popup, {
       target: buttonRef.current,
       fitHeight: 350,
@@ -80,20 +121,34 @@ var ColorPickerButton = function ColorPickerButton(props) {
       // we need an index of > 500 to display over it
       ,
       zIndex: props.setDisableParentScroll ? 600 : undefined,
-      ariaLabel: "Color picker popup"
+      ariaLabel: "Color picker popup",
+      onPositionCalculated: onPositionCalculated
     }, jsx("div", {
       css: colorPickerWrapper,
       "data-test-id": "color-picker-menu"
+    }, jsx(ArrowKeyNavigationProvider, {
+      type: ArrowKeyNavigationType.COLOR,
+      selectedRowIndex: selectedRowIndex,
+      selectedColumnIndex: selectedColumnIndex,
+      closeOnTab: true,
+      handleClose: function handleClose() {
+        return setIsPopupOpen(false);
+      },
+      isOpenedByKeyboard: isOpenedByKeyboard,
+      isPopupPositioned: isPopupPositioned
     }, jsx(ColorPaletteWithListeners, {
       palette: props.colorPalette,
       cols: props.cols,
-      selectedColor: props.currentColor || null,
+      selectedColor: selectedColor,
       onClick: onColorSelected,
-      handleClickOutside: togglePopup
-    })));
+      handleClickOutside: togglePopup,
+      handleEscapeKeydown: handleEsc,
+      hexToPaletteColor: props.hexToPaletteColor
+    }))));
   };
   var title = props.title || '';
-  var buttonStyle = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    padding: 6px;\n    background-color: ", ";\n    &:before {\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      align-self: center;\n      content: '';\n      border: 1px solid ", ";\n      border-radius: ", "px;\n      background-color: ", ";\n      width: ", "px;\n      height: ", "px;\n      padding: 0;\n    }\n  "])), "var(--ds-background-neutral, transparent)", DEFAULT_BORDER_COLOR, borderRadius(), props.currentColor || 'transparent', ((_props$size = props.size) === null || _props$size === void 0 ? void 0 : _props$size.width) || 14, ((_props$size2 = props.size) === null || _props$size2 === void 0 ? void 0 : _props$size2.height) || 14);
+  var currentColor = props.currentColor && props.hexToPaletteColor ? props.hexToPaletteColor(props.currentColor) : props.currentColor;
+  var buttonStyle = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    padding: 6px;\n    background-color: ", ";\n    &:before {\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      align-self: center;\n      content: '';\n      border: 1px solid ", ";\n      border-radius: ", "px;\n      background-color: ", ";\n      width: ", "px;\n      height: ", "px;\n      padding: 0;\n    }\n  "])), "var(--ds-background-neutral, transparent)", DEFAULT_BORDER_COLOR, borderRadius(), currentColor || 'transparent', ((_props$size = props.size) === null || _props$size === void 0 ? void 0 : _props$size.width) || 14, ((_props$size2 = props.size) === null || _props$size2 === void 0 ? void 0 : _props$size2.height) || 14);
   return jsx("div", {
     css: colorPickerButtonWrapper
   }, jsx(Tooltip, {
@@ -104,6 +159,13 @@ var ColorPickerButton = function ColorPickerButton(props) {
     "aria-label": title,
     spacing: "compact",
     onClick: togglePopup,
+    onKeyDown: function onKeyDown(event) {
+      if (event.key === 'Enter' || event.key === ' ') {
+        event.preventDefault();
+        togglePopup();
+        setIsOpenedByKeyboard(true);
+      }
+    },
     css: buttonStyle
   })), renderPopup());
 };

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

@@ -17,7 +17,7 @@ import Form from '@atlaskit/form';
 import { isTabGroup } from '@atlaskit/editor-common/extensions';
 import _isEqual from 'lodash/isEqual';
 import _mergeRecursive from 'lodash/merge';
-import { fireAnalyticsEvent, EVENT_TYPE, ACTION_SUBJECT, ACTION } from '../../plugins/analytics';
+import { fireAnalyticsEvent, EVENT_TYPE, ACTION_SUBJECT, ACTION } from '@atlaskit/editor-common/analytics';
 import LoadingState from './LoadingState';
 import Header from './Header';
 import ErrorMessage from './ErrorMessage';

package/dist/esm/ui/ContextPanel/context.js

@@ -24,14 +24,12 @@ import React from 'react';
 // able to position and add margins to handle certain elements like inline comment dialogues overlapping the context
 // panel
 
-var _React$createContext = /*#__PURE__*/React.createContext({
-    width: 0,
-    positionedOverEditor: false,
-    broadcastWidth: function broadcastWidth() {},
-    broadcastPosition: function broadcastPosition() {}
-  }),
-  Provider = _React$createContext.Provider,
-  Consumer = _React$createContext.Consumer;
+export var ContextPanel = /*#__PURE__*/React.createContext({
+  width: 0,
+  positionedOverEditor: false,
+  broadcastWidth: function broadcastWidth() {},
+  broadcastPosition: function broadcastPosition() {}
+});
 export var ContextPanelWidthProvider = /*#__PURE__*/function (_React$Component) {
   _inherits(ContextPanelWidthProvider, _React$Component);
   var _super = _createSuper(ContextPanelWidthProvider);
@@ -77,4 +75,6 @@ export var ContextPanelWidthProvider = /*#__PURE__*/function (_React$Component)
   }]);
   return ContextPanelWidthProvider;
 }(React.Component);
+var Provider = ContextPanel.Provider,
+  Consumer = ContextPanel.Consumer;
 export { Provider as ContextPanelProvider, Consumer as ContextPanelConsumer };

package/dist/esm/ui/Dropdown/index.js

@@ -1,16 +1,21 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _extends from "@babel/runtime/helpers/extends";
+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) { _defineProperty(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; }
 import { Dropdown as DropdownComponent } from '@atlaskit/editor-common/ui-menu';
 import React, { useContext } from 'react';
 import { KeyDownHandlerContext } from '../ToolbarArrowKeyNavigationProvider';
 var Dropdown = /*#__PURE__*/React.memo(function (_ref) {
   var props = _extends({}, _ref);
-  var keydownHandlerContext = useContext(KeyDownHandlerContext);
+  var keyDownHandlerContext = useContext(KeyDownHandlerContext);
   return (
     /*#__PURE__*/
     //This context is to handle the tab, Arrow Right/Left key events for dropdown.
     //Default context has the void callbacks for above key events
     React.createElement(DropdownComponent, _extends({
-      keyDownHandlerContext: keydownHandlerContext
+      arrowKeyNavigationProviderOptions: _objectSpread(_objectSpread({}, props.arrowKeyNavigationProviderOptions), {}, {
+        keyDownHandlerContext: keyDownHandlerContext
+      })
     }, props))
   );
 });

package/dist/esm/ui/DropdownMenu/index.js

@@ -1,14 +1,19 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _extends from "@babel/runtime/helpers/extends";
+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) { _defineProperty(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; }
 import { DropdownMenu as DropdownComponent } from '@atlaskit/editor-common/ui-menu';
 import React, { useContext } from 'react';
 import { KeyDownHandlerContext } from '../ToolbarArrowKeyNavigationProvider';
 var DropdownMenu = /*#__PURE__*/React.memo(function (_ref) {
   var props = _extends({}, _ref);
-  var keydownHandlerContext = useContext(KeyDownHandlerContext);
+  var keyDownHandlerContext = useContext(KeyDownHandlerContext);
   //This context is to handle the tab, Arrow Right/Left key events for dropdown.
   //Default context has the void callbacks for above key events
   return /*#__PURE__*/React.createElement(DropdownComponent, _extends({
-    keyDownHandlerContext: keydownHandlerContext
+    arrowKeyNavigationProviderOptions: _objectSpread(_objectSpread({}, props.arrowKeyNavigationProviderOptions), {}, {
+      keyDownHandlerContext: keyDownHandlerContext
+    })
   }, props));
 });
 export default DropdownMenu;

package/dist/esm/ui/ElementBrowser/components/CategoryList.js

@@ -16,7 +16,7 @@ import Button from '@atlaskit/button/custom-theme-button';
 import { withAnalyticsContext } from '@atlaskit/analytics-next';
 import { DEVICE_BREAKPOINT_NUMBERS, GRID_SIZE } from '../constants';
 import useFocus from '../hooks/use-focus';
-import { fireAnalyticsEvent, EVENT_TYPE, ACTION_SUBJECT, ACTION_SUBJECT_ID, ACTION } from '../../../plugins/analytics';
+import { fireAnalyticsEvent, EVENT_TYPE, ACTION_SUBJECT, ACTION_SUBJECT_ID, ACTION } from '@atlaskit/editor-common/analytics';
 function CategoryList(_ref) {
   var _ref$categories = _ref.categories,
     categories = _ref$categories === void 0 ? [] : _ref$categories,

package/dist/esm/ui/ElementBrowser/components/ElementList/ElementList.js

@@ -14,7 +14,7 @@ import { B100, N200 } from '@atlaskit/theme/colors';
 import Tooltip from '@atlaskit/tooltip';
 import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import { withAnalyticsContext } from '@atlaskit/analytics-next';
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent } from '../../../../plugins/analytics';
+import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import IconFallback from '../../../../plugins/quick-insert/assets/fallback';
 import { itemIcon } from '../../../../plugins/type-ahead/ui/TypeAheadListItem';
 import { shortcutStyle } from '../../../styles';

package/dist/esm/ui/ElementBrowser/components/StatelessElementBrowser.js

@@ -7,7 +7,7 @@ import React, { memo, useState, useCallback, useEffect } from 'react';
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
 import { withAnalyticsContext, withAnalyticsEvents } from '@atlaskit/analytics-next';
-import { fireAnalyticsEvent, EVENT_TYPE, ACTION_SUBJECT, ACTION } from '../../../plugins/analytics';
+import { fireAnalyticsEvent, EVENT_TYPE, ACTION_SUBJECT, ACTION } from '@atlaskit/editor-common/analytics';
 import ElementList from './ElementList/ElementList';
 import CategoryList from './CategoryList';
 import ElementSearch from './ElementSearch';

package/dist/esm/ui/PanelTextInput/index.js

@@ -86,11 +86,11 @@ var PanelTextInput = /*#__PURE__*/function (_PureComponent) {
     return _this;
   }
   _createClass(PanelTextInput, [{
-    key: "UNSAFE_componentWillReceiveProps",
-    value: function UNSAFE_componentWillReceiveProps(nextProps) {
-      if (nextProps.defaultValue !== this.props.defaultValue) {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      if (prevProps.defaultValue !== this.props.defaultValue) {
         this.setState({
-          value: nextProps.defaultValue
+          value: this.props.defaultValue
         });
       }
     }

package/dist/esm/ui/PortalProvider/index.js

@@ -14,7 +14,7 @@ import { createPortal, unstable_renderSubtreeIntoContainer, unmountComponentAtNo
 import PropTypes from 'prop-types';
 import { default as AnalyticsReactContext } from '@atlaskit/analytics-next-stable-react-context';
 import { EventDispatcher } from '../../event-dispatcher';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '../../plugins/analytics/types/enums';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { useIntl, RawIntlProvider, injectIntl } from 'react-intl-next';
 import { useGlobalTheme } from '@atlaskit/theme/components';
 import { PortalProviderThemeProviders } from './PortalProviderThemesProvider';

package/dist/esm/ui/WidthEmitter/index.js

@@ -1,41 +1,32 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import React from 'react';
+import React, { useEffect, useContext, useState } from 'react';
 import { pluginKey as widthPluginKey } from '../../plugins/width';
-import { WidthConsumer } from '@atlaskit/editor-common/ui';
-import { ContextPanelConsumer } from '../ContextPanel/context';
-function useCreateWidthCallbacks(_ref) {
-  var setContextPanelWidth = _ref.setContextPanelWidth,
-    setContainerWidth = _ref.setContainerWidth;
-  var contextPanelWidthCallback = React.useCallback(function (_ref2) {
-    var width = _ref2.width;
-    setContextPanelWidth(width);
-    return null;
-  }, [setContextPanelWidth]);
-  var containerWidthCallback = React.useCallback(function (_ref3) {
-    var width = _ref3.width;
-    setContainerWidth(width);
-    return null;
-  }, [setContainerWidth]);
-  return [contextPanelWidthCallback, containerWidthCallback];
-}
-var WidthEmitter = function WidthEmitter(_ref4) {
-  var editorView = _ref4.editorView;
-  var _React$useState = React.useState(0),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    contextPanelWidth = _React$useState2[0],
-    setContextPanelWidth = _React$useState2[1];
-  var _React$useState3 = React.useState(0),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    containerWidth = _React$useState4[0],
-    setContainerWidth = _React$useState4[1];
-  var _useCreateWidthCallba = useCreateWidthCallbacks({
-      setContextPanelWidth: setContextPanelWidth,
-      setContainerWidth: setContainerWidth
-    }),
-    _useCreateWidthCallba2 = _slicedToArray(_useCreateWidthCallba, 2),
-    contextPanelWidthCallback = _useCreateWidthCallba2[0],
-    containerWidthCallback = _useCreateWidthCallba2[1];
-  React.useEffect(function () {
+import { WidthContext } from '@atlaskit/editor-common/ui';
+import { ContextPanel } from '../ContextPanel/context';
+// Why do we need this? Why not just use the width from the context directly rather than this?
+// Well my friend - some of the VR tests break, seemingly due to the fact that existing behaviour
+// assumes the initial value is 0, the width from context may not start from 0 however.
+// We should investigate further if we can remove this entirely but for now we'll do this
+// awkward workaround to keep the behaviour consistent.
+var useListener = function useListener(contextValue) {
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1];
+  useEffect(function () {
+    setValue(contextValue);
+  }, [contextValue]);
+  return value;
+};
+var WidthEmitter = function WidthEmitter(_ref) {
+  var editorView = _ref.editorView;
+  var _useContext = useContext(ContextPanel),
+    contextPanelWidthContext = _useContext.width;
+  var _useContext2 = useContext(WidthContext),
+    containerWidthContext = _useContext2.width;
+  var containerWidth = useListener(containerWidthContext);
+  var contextPanelWidth = useListener(contextPanelWidthContext);
+  useEffect(function () {
     var width = containerWidth - contextPanelWidth;
     if (width <= 0 || isNaN(width) || !editorView) {
       return;
@@ -51,6 +42,6 @@ var WidthEmitter = function WidthEmitter(_ref4) {
     dispatch(tr);
     return function () {};
   }, [editorView, contextPanelWidth, containerWidth]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ContextPanelConsumer, null, contextPanelWidthCallback), /*#__PURE__*/React.createElement(WidthConsumer, null, containerWidthCallback));
+  return /*#__PURE__*/React.createElement(React.Fragment, null);
 };
 export default WidthEmitter;

package/dist/esm/utils/document.js

@@ -1,5 +1,5 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import { Node } from 'prosemirror-model';
+import { Node, Fragment } from 'prosemirror-model';
 import { transformMediaLinkMarks, transformTextLinkCodeMarks, transformDedupeMarks, transformNodesMissingContent, transformIndentationMarks, transformInvalidMediaContent } from '@atlaskit/adf-utils/transforms';
 import { sanitizeNodeForPrivacy } from '../utils/filter/privacy-filter';
 import { validateADFEntity, findAndTrackUnsupportedContentNodes } from '@atlaskit/editor-common/utils';
@@ -107,6 +107,20 @@ export function bracketTyped(state) {
   }
   return false;
 }
+export function processRawFragmentValue(schema, value, providerFactory, sanitizePrivateContent, contentTransformer, dispatchAnalyticsEvent) {
+  if (!value) {
+    return;
+  }
+  var adfEntities = value.map(function (item) {
+    return processRawValue(schema, item, providerFactory, sanitizePrivateContent, contentTransformer, dispatchAnalyticsEvent);
+  }).filter(function (item) {
+    return Boolean(item);
+  });
+  if (adfEntities.length === 0) {
+    return;
+  }
+  return Fragment.from(adfEntities);
+}
 export function processRawValue(schema, value, providerFactory, sanitizePrivateContent, contentTransformer, dispatchAnalyticsEvent) {
   if (!value) {
     return;

package/dist/esm/utils/extensions.js

@@ -4,9 +4,7 @@ import React from 'react';
 import Loadable from 'react-loadable';
 import { getQuickInsertItemsFromModule, resolveImport } from '@atlaskit/editor-common/extensions';
 import { combineProviders } from '@atlaskit/editor-common/provider-helpers';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '../plugins/analytics/types/enums';
-import { fireAnalyticsEvent } from '../plugins/analytics';
-
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 /**
  * Utils to send analytics event when a extension is inserted using quickInsert
  */

package/dist/esm/utils/get-editor-plugins.js

@@ -0,0 +1,25 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import { createEditorSelectionAPI } from '../selection-api/api';
+import createPluginsList from '../create-editor/create-plugins-list';
+
+/**
+ *
+ * Retrieve the editor props using createPluginList default behaviour.
+ *
+ * @param GetEditorPlugins props used to initialise the plugins
+ * @returns list of editor plugins
+ */
+var getEditorPlugins = function getEditorPlugins(_ref) {
+  var _props$dangerouslyApp, _props$dangerouslyApp2;
+  var props = _ref.props,
+    prevAppearance = _ref.prevAppearance,
+    createAnalyticsEvent = _ref.createAnalyticsEvent,
+    insertNodeAPI = _ref.insertNodeAPI,
+    editorAnalyticsAPI = _ref.editorAnalyticsAPI;
+  var dangerouslyAppendedPlugins = (_props$dangerouslyApp = (_props$dangerouslyApp2 = props.dangerouslyAppendPlugins) === null || _props$dangerouslyApp2 === void 0 ? void 0 : _props$dangerouslyApp2.__plugins) !== null && _props$dangerouslyApp !== void 0 ? _props$dangerouslyApp : [];
+  var selectionAPI = createEditorSelectionAPI();
+  return [].concat(_toConsumableArray(createPluginsList(props, {
+    appearance: prevAppearance
+  }, createAnalyticsEvent, insertNodeAPI, editorAnalyticsAPI, selectionAPI)), _toConsumableArray(dangerouslyAppendedPlugins));
+};
+export default getEditorPlugins;

package/dist/esm/utils/linking-utils.js

@@ -1,4 +1,4 @@
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE, ACTION_SUBJECT_ID, INPUT_METHOD } from '../plugins/analytics';
+import { ACTION, ACTION_SUBJECT, EVENT_TYPE, ACTION_SUBJECT_ID, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 export var buildEditLinkPayload = function buildEditLinkPayload(type) {
   return {
     action: ACTION.CLICKED,

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

@@ -1,7 +1,7 @@
 import { useMemo } from 'react';
 import debounce from 'lodash/debounce';
 import { useComponentRenderTracking } from '@atlaskit/editor-common/utils';
-import { EVENT_TYPE } from '../../../plugins/analytics';
+import { EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 export function RenderTracking(props) {
   var debouncedHandleAnalyticsEvent = useMemo(function () {
     return debounce(props.handleAnalyticsEvent, 500);

package/dist/esm/utils/performance/safer-transactions.js

@@ -1,4 +1,4 @@
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../../plugins/analytics';
+import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 export var UNSAFE_PROPERTY_SET_ERROR = 'Setting an unsafe property on transaction after dispatch!';
 
 // since selection uses curSelection under the hood, we guard setSelection instead

package/dist/esm/utils/prepare-extension-provider.js

@@ -0,0 +1,17 @@
+import { combineExtensionProviders } from '@atlaskit/editor-common/extensions';
+import memoizeOne from 'memoize-one';
+function prepareExtensionProvidersInternal(editorActions, extensionProviders) {
+  if (!extensionProviders) {
+    return;
+  }
+  if (typeof extensionProviders === 'function') {
+    return combineExtensionProviders(extensionProviders(editorActions));
+  }
+  return combineExtensionProviders(extensionProviders);
+}
+var prepareExtensionProvider = function prepareExtensionProvider(getEditorActions) {
+  return memoizeOne(function (extensionProviders) {
+    return prepareExtensionProvidersInternal(getEditorActions(), extensionProviders);
+  });
+};
+export default prepareExtensionProvider;

package/dist/esm/version-wrapper.js

@@ -1,5 +1,5 @@
 export var name = "@atlaskit/editor-core";
-export var version = "179.1.2";
+export var version = "180.1.0";
 export var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/esm/version.json

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

package/dist/types/actions/index.d.ts

@@ -1,5 +1,5 @@
 import { Node } from 'prosemirror-model';
-import { EditorActionsOptions, ContextUpdateHandler } from '@atlaskit/editor-common/types';
+import { EditorActionsOptions, ContextUpdateHandler, ReplaceRawValue } from '@atlaskit/editor-common/types';
 import { EditorView } from 'prosemirror-view';
 import { EventDispatcher } from '../event-dispatcher';
 import { AnalyticsEventPayload } from '@atlaskit/analytics-next/AnalyticsEvent';
@@ -34,7 +34,7 @@ export default class EditorActions<T = any> implements EditorActionsOptions<T> {
     replaceDocument(rawValue: any, shouldScrollToBottom?: boolean, 
     /** @deprecated [ED-14158] shouldAddToHistory is not being used in this function */
     shouldAddToHistory?: boolean): boolean;
-    replaceSelection(rawValue: Node | Object | string, tryToReplace?: boolean): boolean;
+    replaceSelection(rawValue: ReplaceRawValue | Array<ReplaceRawValue>, tryToReplace?: boolean): boolean;
     appendText(text: string): boolean;
     dispatchAnalyticsEvent: (payload: AnalyticsEventPayload) => void;
     /**

package/dist/types/create-editor/ReactEditorView.d.ts

@@ -1,113 +1,11 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { EditorState } from 'prosemirror-state';
-import { DirectEditorProps, EditorView } from 'prosemirror-view';
-import { Node as PMNode } from 'prosemirror-model';
-import { WrappedComponentProps } from 'react-intl-next';
-import { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
-import { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
-import { ErrorReporter } from '@atlaskit/editor-common/utils';
-import { ExperienceStore } from '@atlaskit/editor-common/ufo';
-import { Transformer } from '@atlaskit/editor-common/types';
-import { Dispatch, EventDispatcher } from '../event-dispatcher';
-import { AnalyticsEventPayload, DispatchAnalyticsEvent, FULL_WIDTH_MODE } from '../plugins/analytics';
-import { EditorAppearance, EditorConfig, EditorReactContext, EditorPlugin, EditorProps } from '../types';
-import { PortalProviderAPI } from '../ui/PortalProvider';
-import { SEVERITY } from '@atlaskit/editor-common/utils';
-import { TransactionTracker } from '../utils/performance/track-transactions';
-import { FireAnalyticsCallback } from '../plugins/analytics/fire-analytics-event';
-export interface EditorViewProps {
-    editorProps: EditorProps;
-    createAnalyticsEvent?: CreateUIAnalyticsEvent;
-    providerFactory: ProviderFactory;
-    portalProviderAPI: PortalProviderAPI;
-    allowAnalyticsGASV3?: boolean;
-    disabled?: boolean;
-    experienceStore?: ExperienceStore;
-    render?: (props: {
-        editor: JSX.Element;
-        view?: EditorView;
-        config: EditorConfig;
-        eventDispatcher: EventDispatcher;
-        transformer?: Transformer<string>;
-        dispatchAnalyticsEvent: DispatchAnalyticsEvent;
-        editorRef: React.RefObject<HTMLDivElement>;
-    }) => JSX.Element;
-    onEditorCreated: (instance: {
-        view: EditorView;
-        config: EditorConfig;
-        eventDispatcher: EventDispatcher;
-        transformer?: Transformer<string>;
-    }) => void;
-    onEditorDestroyed: (instance: {
-        view: EditorView;
-        config: EditorConfig;
-        eventDispatcher: EventDispatcher;
-        transformer?: Transformer<string>;
-    }) => void;
-}
-export declare function shouldReconfigureState(props: EditorProps, nextProps: EditorProps): boolean;
-interface CreateEditorStateOptions {
-    props: EditorViewProps;
-    context: EditorReactContext;
-    doc?: string | Object | PMNode;
-    resetting?: boolean;
-    selectionAtStart?: boolean;
-}
-export declare class ReactEditorView<T = {}> extends React.Component<EditorViewProps & WrappedComponentProps & T, {}, EditorReactContext> {
-    view?: EditorView;
-    eventDispatcher: EventDispatcher;
-    contentTransformer?: Transformer<string>;
-    config: EditorConfig;
-    editorState: EditorState;
-    errorReporter: ErrorReporter;
-    dispatch: Dispatch;
-    proseMirrorRenderedSeverity?: SEVERITY;
-    transactionTracker: TransactionTracker;
-    validTransactionCount: number;
-    experienceStore?: ExperienceStore;
-    editorRef: React.RefObject<HTMLDivElement>;
-    static contextTypes: {
-        getAtlaskitAnalyticsEventHandlers: PropTypes.Requireable<(...args: any[]) => any>;
+/// <reference types="react" />
+import { ReactEditorView as BaseReactEditorView } from './ReactEditorViewInternal';
+export declare class ReactEditorView<T = {}> extends BaseReactEditorView<T> {
+    static defaultProps: {
+        getEditorPlugins: import("../types/get-editor-props").GetEditorPlugins;
     };
-    private canDispatchTransactions;
-    private focusTimeoutId?;
-    private reliabilityInterval?;
-    private pluginPerformanceObserver;
-    private featureFlags;
-    private onPluginObservation;
-    get transactionTracking(): import("../types/performance-tracking").TransactionTracking;
-    private getPluginNames;
-    private countNodes;
-    constructor(props: EditorViewProps & WrappedComponentProps & T, context: EditorReactContext);
-    UNSAFE_componentWillReceiveProps(nextProps: EditorViewProps): void;
-    formatFullWidthAppearance: (appearance: EditorAppearance | undefined) => FULL_WIDTH_MODE;
-    resetEditorState: ({ doc, shouldScrollToBottom, }: {
-        doc: string;
-        shouldScrollToBottom: boolean;
-    }) => void;
-    blur: () => void;
-    reconfigureState: (props: EditorViewProps) => void;
-    handleAnalyticsEvent: FireAnalyticsCallback;
-    componentDidMount(): void;
-    /**
-     * Clean up any non-PM resources when the editor is unmounted
-     */
-    componentWillUnmount(): void;
-    private editorPlugins;
-    getPlugins(editorProps: EditorProps, prevEditorProps?: EditorProps, createAnalyticsEvent?: CreateUIAnalyticsEvent): EditorPlugin[];
-    createEditorState: (options: CreateEditorStateOptions) => EditorState<any>;
-    private onEditorViewStateUpdated;
-    private trackValidTransactions;
-    private dispatchTransaction;
-    getDirectEditorProps: (state?: EditorState<any> | undefined) => DirectEditorProps;
-    private createEditorView;
-    handleEditorViewRef: (node: HTMLDivElement) => void;
-    dispatchAnalyticsEvent: (payload: AnalyticsEventPayload) => void;
-    private editor;
-    render(): JSX.Element;
 }
-declare const _default: React.FC<import("react-intl-next").WithIntlProps<EditorViewProps & WrappedComponentProps<"intl">>> & {
-    WrappedComponent: React.ComponentType<EditorViewProps & WrappedComponentProps<"intl">>;
+declare const _default: import("react").FC<import("react-intl-next").WithIntlProps<import("./ReactEditorViewInternal").EditorViewProps & import("react-intl-next").WrappedComponentProps<"intl">>> & {
+    WrappedComponent: import("react").ComponentType<import("./ReactEditorViewInternal").EditorViewProps & import("react-intl-next").WrappedComponentProps<"intl">>;
 };
 export default _default;