@atlaskit/editor-core 167.0.3 → 169.1.0

package/dist/es2019/plugins/toolbar-lists-indentation/ui/index.js

@@ -0,0 +1,49 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import { onItemActivated } from './onItemActivated';
+import { ToolbarDropdown } from './ToolbarDropdown';
+import { Toolbar } from './Toolbar';
+export default function ToolbarListsIndentation(props) {
+  const {
+    disabled,
+    isSmall,
+    isReducedSpacing,
+    bulletListActive,
+    bulletListDisabled,
+    orderedListActive,
+    orderedListDisabled,
+    showIndentationButtons,
+    popupsMountPoint,
+    popupsBoundariesElement,
+    popupsScrollableElement
+  } = props;
+
+  if (isSmall) {
+    return jsx(ToolbarDropdown, {
+      editorView: props.editorView,
+      isReducedSpacing: isReducedSpacing,
+      popupsMountPoint: popupsMountPoint,
+      popupsBoundariesElement: popupsBoundariesElement,
+      popupsScrollableElement: popupsScrollableElement,
+      bulletListActive: bulletListActive,
+      bulletListDisabled: bulletListDisabled,
+      showIndentationButtons: showIndentationButtons,
+      orderedListActive: orderedListActive,
+      orderedListDisabled: orderedListDisabled,
+      disabled: disabled,
+      onItemActivated: onItemActivated
+    });
+  }
+
+  return jsx(Toolbar, {
+    editorView: props.editorView,
+    isReducedSpacing: isReducedSpacing,
+    bulletListActive: bulletListActive,
+    bulletListDisabled: bulletListDisabled,
+    showIndentationButtons: showIndentationButtons,
+    orderedListActive: orderedListActive,
+    orderedListDisabled: orderedListDisabled,
+    disabled: disabled,
+    onItemActivated: onItemActivated
+  });
+}

package/dist/es2019/plugins/toolbar-lists-indentation/ui/onItemActivated.js

@@ -0,0 +1,35 @@
+import { toggleBulletList, toggleOrderedList } from '../../list/commands';
+import { INPUT_METHOD } from '../../analytics';
+export function onItemActivated({
+  buttonName,
+  editorView
+}) {
+  switch (buttonName) {
+    case 'bullet_list':
+      toggleBulletList(editorView, INPUT_METHOD.TOOLBAR);
+      break;
+
+    case 'ordered_list':
+      toggleOrderedList(editorView, INPUT_METHOD.TOOLBAR);
+      break;
+
+    case 'indent':
+      editorView.someProp('handleKeyDown', handleKeyDown => handleKeyDown(editorView, new KeyboardEvent('keydown', {
+        bubbles: true,
+        cancelable: true,
+        key: 'Tab',
+        code: 'Tab'
+      })));
+      break;
+
+    case 'outdent':
+      editorView.someProp('handleKeyDown', handleKeyDown => handleKeyDown(editorView, new KeyboardEvent('keydown', {
+        bubbles: true,
+        cancelable: true,
+        shiftKey: true,
+        key: 'Tab',
+        code: 'Tab'
+      })));
+      break;
+  }
+}

package/dist/es2019/plugins/type-ahead/ui/TypeAheadList.js

@@ -1,9 +1,8 @@
 /** @jsx jsx */
 import React, { useMemo, useEffect, useRef, useCallback, useLayoutEffect } from 'react';
-import { jsx, css } from '@emotion/react'; // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-
-import { ItemGroup } from '@atlaskit/item';
-import { ICON_HEIGHT, itemTheme, ITEM_PADDING } from './TypeAheadListItem';
+import { jsx, css } from '@emotion/react';
+import { MenuGroup } from '@atlaskit/menu';
+import { ICON_HEIGHT, ITEM_PADDING } from './TypeAheadListItem';
 import { VariableSizeList as List } from 'react-window';
 import { ResizeObserverProvider } from './hooks/use-resize-observer';
 import { useDynamicListHeightCalculation } from './hooks/use-dynamic-list-height-calculation';
@@ -100,12 +99,11 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
 
   const estimatedHeight = items.length * LIST_ITEM_ESTIMATED_HEIGHT;
   const height = Math.min(typeof renderedListHeight === 'number' ? renderedListHeight : estimatedHeight, fitHeight);
-  return jsx(ItemGroup, {
+  return jsx(MenuGroup, {
     role: "listbox",
     "aria-live": "polite",
     "aria-label": intl.formatMessage(typeAheadListMessages.typeAheadResultLabel),
-    "aria-relevant": "additions removals",
-    theme: itemTheme
+    "aria-relevant": "additions removals"
   }, jsx(ResizeObserverProvider, null, jsx(UpdateListItemHeightContext.Provider, {
     value: setListItemHeight
   }, jsx(ListItemActionsContext.Provider, {
@@ -125,9 +123,12 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
     height: height,
     overscanCount: 3,
     css: css`
-                    // temporary solution before we migrated off dst/item
-                    & span[class^='ItemParts__Before'] {
-                      margin-right: 12px;
+                    button {
+                      padding: 12px 12px 11px;
+
+                      span:last-child span:last-child {
+                        white-space: normal;
+                      }
                     }
                   `
   }, DynamicHeightListItem))))));

package/dist/es2019/plugins/type-ahead/ui/TypeAheadListItem.js

@@ -1,11 +1,10 @@
 /** @jsx jsx */
 import React, { useCallback, useMemo, useRef, useLayoutEffect } from 'react';
 import { css, jsx } from '@emotion/react';
-import { text as colorsText, N200, N20, DN70, N800, DN600, DN300 } from '@atlaskit/theme/colors';
+import { DN600, N200, N800 } from '@atlaskit/theme/colors';
 import { themed } from '@atlaskit/theme/components';
-import { borderRadius } from '@atlaskit/theme/constants'; // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-
-import Item, { itemThemeNamespace } from '@atlaskit/item';
+import { borderRadius } from '@atlaskit/theme/constants';
+import { ButtonItem } from '@atlaskit/menu';
 import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import IconFallback from '../../quick-insert/assets/fallback';
 import { shortcutStyle } from '../../../ui/styles';
@@ -14,41 +13,6 @@ import { token } from '@atlaskit/tokens';
 export const ICON_HEIGHT = 40;
 export const ICON_WIDTH = 40;
 export const ITEM_PADDING = 12;
-export const itemTheme = {
-  [itemThemeNamespace]: {
-    padding: {
-      default: {
-        bottom: ITEM_PADDING,
-        left: ITEM_PADDING,
-        right: ITEM_PADDING,
-        top: ITEM_PADDING
-      }
-    },
-    beforeItemSpacing: {
-      default: () => ITEM_PADDING
-    },
-    borderRadius: () => 0,
-    hover: {
-      // background: colors.transparent, transparent is not a thing
-      text: colorsText,
-      secondaryText: token('color.text.subtlest', N200)
-    },
-    selected: {
-      background: themed({
-        light: token('color.background.neutral.subtle.hovered', N20),
-        dark: token('color.background.neutral.subtle.hovered', DN70)
-      }),
-      text: themed({
-        light: token('color.text', N800),
-        dark: token('color.text', DN600)
-      }),
-      secondaryText: themed({
-        light: token('color.text.subtlest', N200),
-        dark: token('color.text.subtlest', DN300)
-      })
-    }
-  }
-};
 export const itemIcon = css`
   width: ${ICON_WIDTH}px;
   height: ${ICON_HEIGHT}px;
@@ -73,14 +37,20 @@ const itemBody = css`
   justify-content: space-between;
   line-height: 1.4;
 `;
-const itemText = css`
+
+const itemText = theme => css`
   white-space: initial;
+  color: ${themed({
+  light: token('color.text', N800),
+  dark: token('color.text', DN600)
+})(theme)};
   .item-description {
     font-size: ${relativeFontSizeToBase16(11.67)};
     color: ${token('color.text.subtlest', N200)};
     margin-top: 4px;
   }
 `;
+
 const itemAfter = css`
   flex: 0 0 auto;
 `;
@@ -162,26 +132,25 @@ export const TypeAheadListItem = ({
     return customItem;
   }
 
-  return jsx(Item, {
+  return jsx("span", {
+    onMouseMove: onMouseMove
+  }, jsx(ButtonItem, {
     onClick: insertSelectedItem,
-    onMouseMove: onMouseMove,
-    elemBefore: elementIcon,
+    iconBefore: elementIcon,
     isSelected: isSelected,
     "aria-selected": isSelected,
     "aria-label": item.title,
     role: "option",
-    theme: itemTheme
+    description: item.description
   }, jsx("div", {
     css: itemBody
   }, jsx("div", {
     css: itemText
   }, jsx("div", {
     className: "item-title"
-  }, item.title), item.description && jsx("div", {
-    className: "item-description"
-  }, item.description)), jsx("div", {
+  }, item.title)), jsx("div", {
     css: itemAfter
   }, item.keyshortcut && jsx("div", {
     css: shortcutStyle
-  }, item.keyshortcut))));
+  }, item.keyshortcut)))));
 };

package/dist/es2019/ui/ElementBrowser/InsertMenu.js

@@ -1,10 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 
 /** @jsx jsx */
-import React, { useState, useCallback } from 'react';
+import { useState, useCallback } from 'react';
 import { css, jsx } from '@emotion/react';
-// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-import Item, { itemThemeNamespace } from '@atlaskit/item'; // AFP-2532 TODO: Fix automatic suppressions below
+import { Section, ButtonItem } from '@atlaskit/menu'; // AFP-2532 TODO: Fix automatic suppressions below
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
 
 import { borderRadius, gridSize } from '@atlaskit/theme';
@@ -94,26 +93,19 @@ const InsertMenu = ({
 const ViewMore = ({
   item
 }) => {
-  const onKeyPress = useCallback(e => {
-    const SPACE_KEY = 32;
-    const ENTER_KEY = 13;
-
-    if (e.which === ENTER_KEY || e.which === SPACE_KEY) {
-      // @ts-ignore We manually transformed "view more" to a quickInsert item
-      // action would always toggle the ModalElementBrowser
-      item.action();
-    }
-  }, [item]);
-  return jsx(Item, {
+  return jsx(Section, {
+    hasSeparator: true
+  }, jsx(ButtonItem, {
     onClick: item.action,
-    elemBefore: jsx("div", {
+    iconBefore: jsx("div", {
       css: itemBefore
     }, item.icon()),
     "aria-describedby": item.title,
     "data-testid": "view-more-elements-item",
-    onKeyPress: onKeyPress,
-    theme: viewMoreItemTheme
-  }, item.title);
+    css: css`
+          padding: 0px 12px;
+        `
+  }, item.title));
 };
 
 const getSvgIconForItem = ({
@@ -173,18 +165,6 @@ const itemBefore = css`
   align-items: center;
   margin-right: ${gridSize() / 2}px;
 `;
-const PADDING_LEFT = 14;
-const HEIGHT = 40;
-const viewMoreItemTheme = {
-  [itemThemeNamespace]: {
-    padding: {
-      default: {
-        left: PADDING_LEFT
-      }
-    },
-    height: HEIGHT
-  }
-};
 const flexWrapperStyles = css`
   display: flex;
   flex: 1;

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

@@ -3,12 +3,10 @@ import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
 import React, { Fragment, memo, useCallback, useEffect, useMemo } from 'react';
 import { css, jsx } from '@emotion/react';
-import memoizeOne from 'memoize-one';
 import { AutoSizer } from 'react-virtualized/dist/commonjs/AutoSizer';
 import { Collection } from 'react-virtualized/dist/commonjs/Collection';
-// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-import Item from '@atlaskit/item';
-import { B100, N20, N200 } from '@atlaskit/theme/colors';
+import { ButtonItem } from '@atlaskit/menu';
+import { B100, N200 } from '@atlaskit/theme/colors';
 import Tooltip from '@atlaskit/tooltip';
 import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import { token } from '@atlaskit/tokens';
@@ -17,7 +15,7 @@ import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent } from '../../..
 import IconFallback from '../../../../plugins/quick-insert/assets/fallback';
 import { itemIcon } from '../../../../plugins/type-ahead/ui/TypeAheadListItem';
 import { shortcutStyle } from '../../../styles';
-import { ELEMENT_ITEM_HEIGHT, ELEMENT_LIST_PADDING, GRID_SIZE, SCROLLBAR_THUMB_COLOR, SCROLLBAR_TRACK_COLOR, SCROLLBAR_WIDTH } from '../../constants';
+import { ELEMENT_LIST_PADDING, SCROLLBAR_THUMB_COLOR, SCROLLBAR_TRACK_COLOR, SCROLLBAR_WIDTH } from '../../constants';
 import useContainerWidth from '../../hooks/use-container-width';
 import useFocus from '../../hooks/use-focus';
 import { Modes } from '../../types';
@@ -114,44 +112,9 @@ function ElementList({
   })))));
 }
 
-const getStyles = memoizeOne(mode => {
-  return { ...(mode === Modes.full && {
-      '-ms-flex': 'auto',
-      position: 'relative',
-      boxSizing: 'border-box'
-    }),
-    height: {
-      default: ELEMENT_ITEM_HEIGHT
-    },
-    padding: {
-      default: {
-        top: GRID_SIZE * 1.5,
-        right: GRID_SIZE * 1.5,
-        bottom: GRID_SIZE * 1.5,
-        left: GRID_SIZE * 1.5
-      }
-    },
-    borderRadius: GRID_SIZE / 2,
-    // TODO: apply a different background for when a selected item is hovered.
-    // Not possible due to current implementation of @atlaskit/item component.
-    selected: {
-      background: token('color.background.selected', N20)
-    },
-    hover: {
-      background: token('color.background.neutral.subtle.hovered', 'rgb(244, 245, 247)')
-    },
-    active: {
-      background: token('color.background.neutral.subtle.pressed', 'rgb(244, 245, 247)')
-    },
-    beforeItemSpacing: {
-      default: GRID_SIZE * 1.5
-    }
-  };
-});
 const MemoizedElementItem = /*#__PURE__*/memo(ElementItem);
 MemoizedElementItem.displayName = 'MemoizedElementItem';
-
-function ElementItem({
+export function ElementItem({
   inlineMode,
   selected,
   item,
@@ -161,9 +124,6 @@ function ElementItem({
   setFocusedItemIndex
 }) {
   const ref = useFocus(focus);
-  const theme = useMemo(() => ({
-    '@atlaskit-shared-theme/item': getStyles(inlineMode ? 'inline' : 'full')
-  }), [inlineMode]);
   /**
    * Note: props.onSelectItem(item) is not called here as the StatelessElementBrowser's
    * useEffect would trigger it on selectedItemIndex change. (Line 106-110)
@@ -175,33 +135,29 @@ function ElementItem({
     e.stopPropagation();
     setFocusedItemIndex(index);
 
-    if (inlineMode) {
-      onInsertItem(item);
-    }
-  }, [index, inlineMode, item, onInsertItem, setFocusedItemIndex]);
-  const onDoubleClick = useCallback(e => {
-    if (inlineMode) {
-      return;
-    }
+    switch (e.nativeEvent.detail) {
+      case 0:
+        onInsertItem(item);
+        break;
 
-    e.preventDefault();
-    e.stopPropagation();
-    setFocusedItemIndex(index);
-    onInsertItem(item);
-  }, [inlineMode, setFocusedItemIndex, index, onInsertItem, item]); // After tabbing we wanna select the item on enter/space key press from item level,
-  // preventing the default top level component behavior.
+      case 1:
+        if (inlineMode) {
+          onInsertItem(item);
+        }
+
+        break;
 
-  const onKeyPress = useCallback(e => {
-    const SPACE_KEY = 32;
-    const ENTER_KEY = 13;
+      case 2:
+        if (!inlineMode) {
+          onInsertItem(item);
+        }
 
-    if (e.which === ENTER_KEY || e.which === SPACE_KEY) {
-      e.preventDefault();
-      e.stopPropagation();
-      setFocusedItemIndex(index);
-      onInsertItem(item);
+        break;
+
+      default:
+        return;
     }
-  }, [index, item, onInsertItem, setFocusedItemIndex]);
+  }, [index, inlineMode, item, onInsertItem, setFocusedItemIndex]);
   const {
     icon,
     title,
@@ -211,35 +167,28 @@ function ElementItem({
   return jsx(Tooltip, {
     content: description,
     testId: `element-item-tooltip-${index}`
-  }, jsx(Item, {
+  }, jsx(ButtonItem, {
     onClick: onClick,
-    onDoubleClick: onDoubleClick,
-    elemBefore: jsx(ElementBefore, {
+    iconBefore: jsx(ElementBefore, {
       icon: icon,
       title: title
     }),
     isSelected: selected,
     "aria-describedby": title,
-    innerRef: ref,
-    onKeyPress: onKeyPress,
-    "data-testid": `element-item-${index}`,
-    tabIndex: 0,
-    style: inlineMode ? null : itemStyleOverrides,
-    theme: theme
+    ref: ref,
+    testId: `element-item-${index}`
   }, jsx(ItemContent, {
+    style: inlineMode ? null : itemStyleOverrides,
+    tabIndex: 0,
     title: title,
     description: description,
     keyshortcut: keyshortcut
   })));
 }
 /**
- * Some properties (specified in 'BaseItem' packages/design-system/item/src/styled/Item.js) cannot be changed with
- * ThemeProvider as they are of higher specificity.
- *
  * Inline mode should use the existing Align-items:center value.
  */
 
-
 const itemStyleOverrides = {
   alignItems: 'flex-start'
 };
@@ -308,21 +257,13 @@ const elementItemsWrapper = css`
       padding-bottom: 4px;
     }
   }
-
-  // temporary solution before we migrated off dst/item
-  & span[class^='ItemParts__Before'] {
-    margin-right: 12px;
-  }
 `;
 const elementItemWrapper = css`
-  /**
-     * Since we are using "Item" component's content itself for description,
-     * the height of description overflows the parent container padding/margin.
-     * manually setting it to take 100% of parent.
-     */
-  span {
-    span:nth-of-type(2) {
-      max-height: 100%;
+  div {
+    button {
+      height: 75px;
+      align-items: flex-start;
+      padding: 12px 12px 11px;
     }
   }
 `;

package/dist/es2019/utils/clipboard.js

@@ -1,3 +1,4 @@
+import * as clipboard from 'clipboard-polyfill';
 export function checkClipboardTypes(type, item) {
   const isDOMStringList = t => !t.indexOf && !!t.contains;
 
@@ -35,4 +36,29 @@ export const copyToClipboard = async textToCopy => {
   } else {
     throw new Error('Clipboard api is not supported');
   }
+};
+export const copyHTMLToClipboard = async htmlToCopy => {
+  // @ts-ignore
+  if (isClipboardApiSupported() && typeof ClipboardItem !== 'undefined') {
+    try {
+      const blobInput = new Blob([htmlToCopy], {
+        type: 'text/html'
+      }); // @ts-ignore
+
+      const data = [new ClipboardItem({
+        'text/html': blobInput
+      })]; // @ts-ignore
+
+      navigator.clipboard.write(data);
+    } catch (error) {
+      throw new Error('Clipboard api is not supported');
+    }
+  } else {
+    // At the time of development, Firefox doesn't support ClipboardItem API
+    // Hence of use of this polyfill
+    const Clipboard = clipboard;
+    const dt = new Clipboard.DT();
+    dt.setData('text/html', htmlToCopy);
+    Clipboard.write(dt);
+  }
 };

package/dist/es2019/version-wrapper.js

@@ -1,5 +1,5 @@
 export const name = "@atlaskit/editor-core";
-export const version = "167.0.3";
+export const version = "169.1.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": "167.0.3",
+	"version": "169.1.0",
 	"sideEffects": false
 }

package/dist/esm/actions/index.js

@@ -1,8 +1,8 @@
-import _regeneratorRuntime from "@babel/runtime/regenerator";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { Node } from 'prosemirror-model';
 import { TextSelection, NodeSelection } from 'prosemirror-state';
 import { findParentNode } from 'prosemirror-utils';

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

@@ -1,4 +1,3 @@
-import _regeneratorRuntime from "@babel/runtime/regenerator";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
@@ -7,6 +6,7 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 
 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; }
 

package/dist/esm/create-editor/create-plugins-list.js

@@ -5,7 +5,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 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 { breakoutPlugin, collabEditPlugin, dataConsumerMarkPlugin, datePlugin, emojiPlugin, extensionPlugin, fragmentMarkPlugin, helpDialogPlugin, imageUploadPlugin, insertBlockPlugin, jiraIssuePlugin, layoutPlugin, listPlugin, macroPlugin, maxContentSizePlugin, mediaPlugin, mentionsPlugin, panelPlugin, placeholderTextPlugin, rulePlugin, saveOnEnterPlugin, tablesPlugin, tasksAndDecisionsPlugin, textColorPlugin, cardPlugin, gridPlugin, statusPlugin, alignmentPlugin, indentationPlugin, analyticsPlugin, customAutoformatPlugin, feedbackDialogPlugin, historyPlugin, expandPlugin, isExpandInsertionEnabled, scrollIntoViewPlugin, mobileDimensionsPlugin, findReplacePlugin, contextPanelPlugin, mobileSelectionPlugin, annotationPlugin, captionPlugin, avatarGroupPlugin, viewUpdateSubscriptionPlugin, beforePrimaryToolbarPlugin, codeBidiWarningPlugin } from '../plugins';
+import { breakoutPlugin, collabEditPlugin, dataConsumerMarkPlugin, datePlugin, emojiPlugin, extensionPlugin, fragmentMarkPlugin, helpDialogPlugin, imageUploadPlugin, insertBlockPlugin, jiraIssuePlugin, layoutPlugin, listPlugin, toolbarListsIndentationPlugin, macroPlugin, maxContentSizePlugin, mediaPlugin, mentionsPlugin, panelPlugin, placeholderTextPlugin, rulePlugin, saveOnEnterPlugin, tablesPlugin, tasksAndDecisionsPlugin, textColorPlugin, cardPlugin, gridPlugin, statusPlugin, alignmentPlugin, indentationPlugin, analyticsPlugin, customAutoformatPlugin, feedbackDialogPlugin, historyPlugin, expandPlugin, isExpandInsertionEnabled, scrollIntoViewPlugin, mobileDimensionsPlugin, findReplacePlugin, contextPanelPlugin, mobileSelectionPlugin, annotationPlugin, captionPlugin, avatarGroupPlugin, viewUpdateSubscriptionPlugin, beforePrimaryToolbarPlugin, codeBidiWarningPlugin, copyButtonPlugin } from '../plugins';
 import { isFullPage as fullPageCheck } from '../utils/is-full-page';
 import { GUTTER_SIZE_MOBILE_IN_PX } from '../plugins/base/pm-plugins/scroll-gutter';
 import { createFeatureFlagsFromProps } from '../plugins/feature-flags-context/feature-flags-from-props';
@@ -363,6 +363,9 @@ export default function createPluginsList(props, prevProps, createAnalyticsEvent
   } // UI only plugins
 
 
+  preset.add([toolbarListsIndentationPlugin, {
+    showIndentationButtons: !!featureFlags.indentationButtonsInTheToolbar
+  }]);
   preset.add([insertBlockPlugin, {
     allowTables: !!props.allowTables,
     allowExpand: isExpandInsertionEnabled(props),
@@ -415,6 +418,10 @@ export default function createPluginsList(props, prevProps, createAnalyticsEvent
     }]);
   }
 
+  if (featureFlags.floatingToolbarCopyButton) {
+    preset.add(copyButtonPlugin);
+  }
+
   var excludes = new Set();
 
   if (!isCodeBlockAllowed({

package/dist/esm/editor.js

@@ -1,4 +1,3 @@
-import _regeneratorRuntime from "@babel/runtime/regenerator";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
@@ -15,6 +14,8 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 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 _regeneratorRuntime from "@babel/runtime/regenerator";
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(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; } }

package/dist/esm/plugins/analytics/types/toolbar-button.js

@@ -14,4 +14,6 @@ export var TOOLBAR_ACTION_SUBJECT_ID;
   TOOLBAR_ACTION_SUBJECT_ID["TEXT_FORMATTING_ITALIC"] = "italic";
   TOOLBAR_ACTION_SUBJECT_ID["UNDO"] = "undo";
   TOOLBAR_ACTION_SUBJECT_ID["REDO"] = "redo";
+  TOOLBAR_ACTION_SUBJECT_ID["INDENT"] = "indent";
+  TOOLBAR_ACTION_SUBJECT_ID["OUTDENT"] = "outdent";
 })(TOOLBAR_ACTION_SUBJECT_ID || (TOOLBAR_ACTION_SUBJECT_ID = {}));

package/dist/esm/plugins/annotation/pm-plugins/inline-comment.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { RESOLVE_METHOD } from './../../analytics/types/inline-comment-events';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { AnnotationTypes } from '@atlaskit/adf-schema';

package/dist/esm/plugins/breakout/index.js

@@ -25,6 +25,13 @@ var BreakoutView = /*#__PURE__*/function () {
     _classCallCheck(this, BreakoutView);
 
     _defineProperty(this, "updateWidth", function (widthState) {
+      // we skip updating the width of breakout nodes if the editorView dom
+      // element was hidden (to avoid breakout width and button thrashing
+      // when an editor is hidden, re-rendered and unhidden).
+      if (widthState.width === 0) {
+        return;
+      }
+
       var width = calcBreakoutWidth(_this.node.attrs.mode, widthState.width);
       var newStyle = "width: ".concat(width, "; ");
       var lineLength = widthState.lineLength;