@atlaskit/editor-core 183.1.1 → 184.0.0

package/dist/es2019/i18n/nb.js

@@ -140,11 +140,11 @@ export default {
   'fabric.editor.helpDialogTips': 'Trykk på {keyMap} for å åpne denne dialogen',
   'fabric.editor.hyperlink.linkAriaLabel': 'Koblingsetikett',
   'fabric.editor.hyperlink.searchLinkAriaDescription': 'Forslag vises nedenfor etter hvert som du skriver inn i feltet',
-  'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {finner ingen resultater} one {fant {count,number} resultat} other {fant {count,number} resultater}}',
+  'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {fant ingen resultater} one {fant {count,number} resultat} other {fant {count,number} resultater}}',
   'fabric.editor.hyperlinkToolbarPlaceholder': 'Lim inn eller søk etter kobling',
   'fabric.editor.imageBorderBold': 'Fet',
   'fabric.editor.imageBorderColor': 'Farge',
-  'fabric.editor.imageBorderMedium': 'Medium',
+  'fabric.editor.imageBorderMedium': 'Middels',
   'fabric.editor.imageBorderOptions': 'Alternativer for kantlinje',
   'fabric.editor.imageBorderSize': 'Størrelse',
   'fabric.editor.imageBorderSubtle': 'Diskret',
@@ -158,7 +158,7 @@ export default {
   'fabric.editor.inputQueryAssistiveTxt': 'Når resultater for autofullføring er tilgjengelig, bruker du pil opp og pil ned for å se gjennom og enter for å velge. Brukere av berøringsenheter kan utforske ved å berøre eller sveipe.',
   'fabric.editor.invalidDateError': 'Oppgi en gyldig dato',
   'fabric.editor.invalidLink': 'Skriv inn en gyldig kobling.',
-  'fabric.editor.inviteItem.title': '{userRole, select, admin {Inviter teammedlem til {productName}} trusted {Inviter teammedlem til {productName}} other {Legg til teammedlem i {productName}}}',
+  'fabric.editor.inviteItem.title': '{userRole, select, admin {Inviter teammedlemmer til {productName}} trusted {Inviter teammedlemmer til {productName}} other {Legg til teammedlem i {productName}}}',
   'fabric.editor.italic': 'Kursiv',
   'fabric.editor.keyboardShortcuts': 'Tastatursnarveier',
   'fabric.editor.leftSidebar': 'Sidelinje til venstre',

package/dist/es2019/i18n/nl.js

@@ -8,7 +8,7 @@
 //Dutch (Netherlands)
 export default {
   'fabric.editor.addAltText': 'Alt-tekst',
-  'fabric.editor.addImageBorder': 'Rand toevoegen',
+  'fabric.editor.addImageBorder': 'Kader toevoegen',
   'fabric.editor.alignCenter': 'Midden uitgelijnd',
   'fabric.editor.alignLeft': 'Links uitlijnen',
   'fabric.editor.alignRight': 'Rechts uitgelijnd',
@@ -145,7 +145,7 @@ export default {
   'fabric.editor.imageBorderBold': 'Vet',
   'fabric.editor.imageBorderColor': 'Kleur',
   'fabric.editor.imageBorderMedium': 'Medium',
-  'fabric.editor.imageBorderOptions': 'Randopties',
+  'fabric.editor.imageBorderOptions': 'Kaderopties',
   'fabric.editor.imageBorderSize': 'Grootte',
   'fabric.editor.imageBorderSubtle': 'Subtiel',
   'fabric.editor.improvement': 'Verbetering',
@@ -158,7 +158,7 @@ export default {
   'fabric.editor.inputQueryAssistiveTxt': 'Wanneer resultaten voor automatisch aanvullen beschikbaar zijn, kun je de pijlen naar boven en beneden gebruiken om ze te bekijken en Enter om ze te selecteren. Touch-apparaatgebruikers verkennen door middel van aanraking of met veegbewegingen.',
   'fabric.editor.invalidDateError': 'Voer een geldige datum in',
   'fabric.editor.invalidLink': 'Voer een geldige link in.',
-  'fabric.editor.inviteItem.title': '{userRole, select, admin {Nodig teamgenoot uit voor {productName}} trusted {Nodig teamgenoot uit voor {productName}} other {Voeg teamgenoot toe aan {productName}}}',
+  'fabric.editor.inviteItem.title': '{userRole, select, admin {Nodig teamgenoten uit voor {productName}} trusted {Nodig teamgenoten uit voor {productName}} other {Voeg teamgenoten toe aan {productName}}}',
   'fabric.editor.italic': 'Cursief',
   'fabric.editor.keyboardShortcuts': 'Sneltoetsen',
   'fabric.editor.leftSidebar': 'Zijbalk aan linkerkant',
@@ -195,7 +195,7 @@ export default {
   'fabric.editor.placeholderTextPlaceholder': 'Voeg plaatsaanduidingstekst toe',
   'fabric.editor.quickInsert': 'Snel invoegen',
   'fabric.editor.redo': 'Pas opnieuw toe',
-  'fabric.editor.removeImageBorder': 'Rand verwijderen',
+  'fabric.editor.removeImageBorder': 'Kader verwijderen',
   'fabric.editor.replace': 'Vervangen',
   'fabric.editor.replaceAll': 'Alles vervangen',
   'fabric.editor.replaceWith': 'Vervangen met',

package/dist/es2019/i18n/pl.js

@@ -140,7 +140,7 @@ export default {
   'fabric.editor.helpDialogTips': 'Naciśnij {keyMap}, aby szybko otworzyć okno dialogowe w dowolnym momencie',
   'fabric.editor.hyperlink.linkAriaLabel': 'Etykieta łącza',
   'fabric.editor.hyperlink.searchLinkAriaDescription': 'Sugestie będą pojawiały się poniżej w miarę wpisywania tekstu w polu',
-  'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {Nie znaleziono wyników} one {znaleziono {count,number} wynik} few {znaleziono {count,number} wyniki} many {znaleziono {count,number} wyników} other {znaleziono {count,number} wyniku}}',
+  'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {nie znaleziono wyników} one {znaleziono {count,number} wynik} few {znaleziono {count,number} wyniki} many {znaleziono {count,number} wyników} other {znaleziono {count,number} wyniku}}',
   'fabric.editor.hyperlinkToolbarPlaceholder': 'Wklej lub wyszukaj łącze',
   'fabric.editor.imageBorderBold': 'Pogrubiony',
   'fabric.editor.imageBorderColor': 'Kolor',

package/dist/es2019/i18n/pt_BR.js

@@ -158,7 +158,7 @@ export default {
   'fabric.editor.inputQueryAssistiveTxt': 'Quando os resultados do preenchimento automático estiverem disponíveis, use as setas para cima e para baixo para analisar e a tecla enter para selecionar. Toque nos usuários do dispositivo, explore por toque ou com gestos de deslizar.',
   'fabric.editor.invalidDateError': 'Informe uma data válida',
   'fabric.editor.invalidLink': 'Insira um link válido.',
-  'fabric.editor.inviteItem.title': '{userRole, select, admin {Convidar colega de equipe para {productName}} trusted {Convidar colega de equipe para {productName}} other {Adicionar colega de equipe ao {productName}}}',
+  'fabric.editor.inviteItem.title': '{userRole, select, admin {Convidar colega de equipe para {productName}} trusted {Convidar colega de equipe para {productName}} other {Adicionar colega de equipe para {productName}}}',
   'fabric.editor.italic': 'Itálico',
   'fabric.editor.keyboardShortcuts': 'Atalhos de teclado',
   'fabric.editor.leftSidebar': 'Barra lateral esquerda',

package/dist/es2019/i18n/ru.js

@@ -140,7 +140,7 @@ export default {
   'fabric.editor.helpDialogTips': 'Это окно можно быстро открыть в любое время нажатием {keyMap}',
   'fabric.editor.hyperlink.linkAriaLabel': 'Метка для ссылки',
   'fabric.editor.hyperlink.searchLinkAriaDescription': 'Предложения будут появляться по мере ввода текста в поле',
-  'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {ничего не найдено} one {найден {count,number} результат} few {найдено {count,number} результата} many {найдено {count,number} результатов} other {найдено {count,number} результата}}',
+  'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {нет результатов} one {найден {count,number} результат} few {найдено {count,number} результата} many {найдено {count,number} результатов} other {найдено {count,number} результата}}',
   'fabric.editor.hyperlinkToolbarPlaceholder': 'Вставить или искать ссылку',
   'fabric.editor.imageBorderBold': 'Широкая',
   'fabric.editor.imageBorderColor': 'Цвет',

package/dist/es2019/i18n/th.js

@@ -142,7 +142,7 @@ export default {
   'fabric.editor.hyperlink.searchLinkAriaDescription': 'ข้อเสนอแนะจะปรากฏด้านล่างเมื่อคุณพิมพ์ลงในช่อง',
   'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {ไม่พบผลลัพธ์} other {พบผลลัพธ์ {count,number} รายการ}}',
   'fabric.editor.hyperlinkToolbarPlaceholder': 'วางหรือค้นหาลิงก์',
-  'fabric.editor.imageBorderBold': 'เข้ม',
+  'fabric.editor.imageBorderBold': 'ตัวหนา',
   'fabric.editor.imageBorderColor': 'สี',
   'fabric.editor.imageBorderMedium': 'ปานกลาง',
   'fabric.editor.imageBorderOptions': 'ตัวเลือกขอบ',
@@ -158,7 +158,7 @@ export default {
   'fabric.editor.inputQueryAssistiveTxt': 'เมื่อผลการป้อนอัตโนมัติพร้อมใช้งานแล้ว ให้ใช้ลูกศรขึ้นและลงเพื่อตรวจสอบและกด Enter เพื่อเลือก ผู้ใช้อุปกรณ์สัมผัส สำรวจโดยการแตะหรือการปัดนิ้ว',
   'fabric.editor.invalidDateError': 'ป้อนวันที่ที่ถูกต้อง',
   'fabric.editor.invalidLink': 'โปรดป้อนลิงก์ที่ถูกต้อง',
-  'fabric.editor.inviteItem.title': '{userRole, select, admin {เชิญเพื่อนร่วมทีมไปยัง {productName}} trusted {เชิญเพื่อนร่วมทีมไปยัง {productName}} other {เพิ่มเพื่อนร่วมทีมไปยัง {productName}}}',
+  'fabric.editor.inviteItem.title': '{userRole, select, admin {เชิญเพื่อนร่วมทีมให้ไปยัง {productName}} trusted {เชิญเพื่อนร่วมทีมให้ไปยัง {productName}} other {เพิ่มเพื่อนร่วมทีมไปยัง {productName}}}',
   'fabric.editor.italic': 'ตัวเอียง',
   'fabric.editor.keyboardShortcuts': 'ปุ่มลัด',
   'fabric.editor.leftSidebar': 'แถบด้านซ้าย',

package/dist/es2019/i18n/uk.js

@@ -140,7 +140,7 @@ export default {
   'fabric.editor.helpDialogTips': 'Натисніть {keyMap}, щоб відкрити це вікно будь-коли',
   'fabric.editor.hyperlink.linkAriaLabel': 'Мітка посилання',
   'fabric.editor.hyperlink.searchLinkAriaDescription': 'Коли ви будете набирати у полі текст, нижче з’явиться список варіантів',
-  'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {Немає результатів} one {{count,number} результат} few {{count,number} результати} many {{count,number} результатів} other {{count,number} результатів}}',
+  'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {нічого не знайдено} one {{count,number} результат} few {{count,number} результати} many {{count,number} результатів} other {{count,number} результатів}}',
   'fabric.editor.hyperlinkToolbarPlaceholder': 'Вставте або знайдіть посилання',
   'fabric.editor.imageBorderBold': 'Жирна',
   'fabric.editor.imageBorderColor': 'Колір',

package/dist/es2019/i18n/vi.js

@@ -140,7 +140,7 @@ export default {
   'fabric.editor.helpDialogTips': 'Nhấn {keyMap} để mở nhanh hộp thoại này bất kỳ lúc nào',
   'fabric.editor.hyperlink.linkAriaLabel': 'Nhãn liên kết',
   'fabric.editor.hyperlink.searchLinkAriaDescription': 'Các đề xuất sẽ xuất hiện bên dưới khi bạn nhập thông tin vào trường',
-  'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {không tìm thấy kết quả nào} other {Đã tìm thấy {count,number} kết quả}}',
+  'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {không tìm thấy kết quả} other {Đã tìm thấy {count,number} kết quả}}',
   'fabric.editor.hyperlinkToolbarPlaceholder': 'Dán hoặc tìm kiếm liên kết',
   'fabric.editor.imageBorderBold': 'In đậm',
   'fabric.editor.imageBorderColor': 'Màu sắc',
@@ -158,7 +158,7 @@ export default {
   'fabric.editor.inputQueryAssistiveTxt': 'Khi có sẵn kết quả tự hoàn tất, hãy dùng các mũi tên lên và xuống để xem lại và enter để chọn. Người dùng thiết bị cảm ứng, khám phá bằng thao tác chạm hoặc bằng các cử chỉ vuốt.',
   'fabric.editor.invalidDateError': 'Nhập ngày hợp lệ',
   'fabric.editor.invalidLink': 'Vui lòng nhập một liên kết hợp lệ.',
-  'fabric.editor.inviteItem.title': '{userRole, select, admin {Mời đồng nghiệp cùng nhóm vào {productName}} trusted {Mời đồng nghiệp cùng nhóm vào {productName}} other {Thêm đồng nghiệp cùng nhóm vào {productName}}}',
+  'fabric.editor.inviteItem.title': '{userRole, select, admin {Mời thành viên cùng nhóm vào {productName}} trusted {Mời thành viên cùng nhóm vào {productName}} other {Thêm thành viên cùng nhóm vào {productName}}}',
   'fabric.editor.italic': 'In nghiêng',
   'fabric.editor.keyboardShortcuts': 'Phím tắt bàn phím',
   'fabric.editor.leftSidebar': 'Thanh bên trái',

package/dist/es2019/i18n/zh.js

@@ -142,7 +142,7 @@ export default {
   'fabric.editor.hyperlink.searchLinkAriaDescription': '在字段中输入内容时，下方会显示建议内容',
   'fabric.editor.hyperlink.searchLinkResults': '{count, plural, =0 {未找到结果} other {找到 {count,number} 个结果}}',
   'fabric.editor.hyperlinkToolbarPlaceholder': '粘贴或搜索链接',
-  'fabric.editor.imageBorderBold': '粗体',
+  'fabric.editor.imageBorderBold': '加粗',
   'fabric.editor.imageBorderColor': '颜色',
   'fabric.editor.imageBorderMedium': '中等',
   'fabric.editor.imageBorderOptions': '边框选项',

package/dist/es2019/labs/next/full-page.js

@@ -8,7 +8,6 @@ import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { BaseTheme } from '@atlaskit/editor-common/ui';
 import { akEditorMenuZIndex, akEditorToolbarKeylineHeight } from '@atlaskit/editor-shared-styles';
 import ContentStyles from '../../ui/ContentStyles';
-import WidthEmitter from '../../ui/WidthEmitter';
 import { ClickAreaBlock } from '../../ui/Addon';
 import { scrollbarStyles } from '../../ui/styles';
 import { tableFullPageEditorStyles } from '@atlaskit/editor-plugin-table/ui/common-styles';
@@ -17,7 +16,7 @@ import { Editor, EditorContent, useEditorSharedConfig } from './Editor';
 import { Toolbar } from './Toolbar';
 import { ContentComponents } from './ContentComponents';
 import { useCreateAnalyticsHandler } from './internal/hooks/use-analytics';
-import { ContextPanelWidthProvider } from '../../ui/ContextPanel/context';
+import { ContextPanelWidthProvider } from '@atlaskit/editor-common/ui';
 const fullPageEditorWrapper = css`
   min-width: 340px;
   height: 100%;
@@ -186,9 +185,7 @@ function FullPage(props) {
     containerElement: scrollContainerRef.current
   }))))), contextPanel && jsx("div", {
     css: sidebarArea
-  }, contextPanel), jsx(WidthEmitter, {
-    editorView: config === null || config === void 0 ? void 0 : config.editorView
-  }))))));
+  }, contextPanel))))));
 }
 FullPage.displayName = 'FullPageEditor';
 const FullPageWithAnalytics = withAnalyticsEvents()(FullPage);

package/dist/es2019/labs/next/presets/create-stub-internal-apis.js

@@ -23,8 +23,10 @@ export const createStubInternalApis = () => {
     // That means, there is no createAnalyticsEvent available at all.
     // This should not happen, but if it does, we will send a mock function to avoid
     // regression on SmartLinks (they are the only one using this function directly)
-    // eslint-disable-next-line no-console
-    console.error('This should never be called, if it does we have a problem');
+    if (process.env.NODE_ENV === 'development') {
+      // eslint-disable-next-line no-console
+      console.error('This should never be called, if it does we have a problem');
+    }
     return {
       fire: () => {}
     };

package/dist/es2019/labs/next/presets/default.js

@@ -5,7 +5,7 @@ import blockTypePlugin from '../../../plugins/block-type';
 import clearMarksOnChangeToEmptyDocumentPlugin from '../../../plugins/clear-marks-on-change-to-empty-document';
 import hyperlinkPlugin from '../../../plugins/hyperlink';
 import textFormattingPlugin from '../../../plugins/text-formatting';
-import widthPlugin from '../../../plugins/width';
+import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import unsupportedContentPlugin from '../../../plugins/unsupported-content';
 import basePlugin from '../../../plugins/base';
 import editorDisabledPlugin from '../../../plugins/editor-disabled';

package/dist/es2019/labs/next/presets/universal.js

@@ -1,4 +1,5 @@
-import { breakoutPlugin, collabEditPlugin, dataConsumerMarkPlugin, datePlugin, emojiPlugin, extensionPlugin, fragmentMarkPlugin, helpDialogPlugin, imageUploadPlugin, insertBlockPlugin, jiraIssuePlugin, layoutPlugin, listPlugin, toolbarListsIndentationPlugin, macroPlugin, maxContentSizePlugin, mediaPlugin, mentionsPlugin, panelPlugin, placeholderTextPlugin, rulePlugin, saveOnEnterPlugin, tasksAndDecisionsPlugin, textColorPlugin, gridPlugin, statusPlugin, alignmentPlugin, indentationPlugin, customAutoformatPlugin, feedbackDialogPlugin, historyPlugin, expandPlugin, isExpandInsertionEnabled, scrollIntoViewPlugin, mobileDimensionsPlugin, findReplacePlugin, contextPanelPlugin, mobileSelectionPlugin, annotationPlugin, captionPlugin, avatarGroupPlugin, viewUpdateSubscriptionPlugin, beforePrimaryToolbarPlugin, codeBidiWarningPlugin, copyButtonPlugin, borderPlugin } 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, tasksAndDecisionsPlugin, textColorPlugin, statusPlugin, alignmentPlugin, indentationPlugin, customAutoformatPlugin, feedbackDialogPlugin, historyPlugin, expandPlugin, isExpandInsertionEnabled, scrollIntoViewPlugin, mobileDimensionsPlugin, findReplacePlugin, contextPanelPlugin, mobileSelectionPlugin, annotationPlugin, captionPlugin, avatarGroupPlugin, viewUpdateSubscriptionPlugin, beforePrimaryToolbarPlugin, codeBidiWarningPlugin, copyButtonPlugin, borderPlugin } from '../../../plugins';
+import { gridPlugin } from '@atlaskit/editor-plugin-grid';
 import cardPlugin from '../../../plugins/card';
 import { tablesPlugin } from '@atlaskit/editor-plugin-table';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';

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

@@ -3,13 +3,12 @@ import React from 'react';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { breakout } from '@atlaskit/adf-schema';
 import { calcBreakoutWidthPx } from '@atlaskit/editor-common/utils';
-import WithPluginState from '../../ui/WithPluginState';
-import { pluginKey as widthPluginKey } from '../width';
 import LayoutButton from './ui/LayoutButton';
 import { BreakoutCssClassName } from './constants';
 import { pluginKey } from './plugin-key';
 import { findSupportedNodeForBreakout } from './utils/find-breakout-node';
 import { akEditorSwoopCubicBezier } from '@atlaskit/editor-shared-styles';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 class BreakoutView {
   constructor(
   /**
@@ -17,12 +16,12 @@ class BreakoutView {
    * of the prosemirror and prosemirror types mean using PMNode
    * is not problematic.
    */
-  mark, view, eventDispatcher) {
+  mark, view, pluginInjectionApi) {
     _defineProperty(this, "updateWidth", 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) {
+      if (widthState === undefined || widthState.width === 0) {
         return;
       }
       let containerStyle = ``;
@@ -81,14 +80,16 @@ class BreakoutView {
     this.mark = mark;
     this.view = view;
     this.contentDOM = contentDOM;
-    this.eventDispatcher = eventDispatcher;
-    eventDispatcher.on(widthPluginKey.key, this.updateWidth);
-    this.updateWidth(widthPluginKey.getState(this.view.state));
+    this.unsubscribe = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.dependencies.width.sharedState.onChange(({
+      nextSharedState
+    }) => this.updateWidth(nextSharedState));
+    this.updateWidth(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.dependencies.width.sharedState.currentState());
   }
   // NOTE: Lifecycle events doesn't work for mark NodeView. So currently this is a no-op.
   // @see https://github.com/ProseMirror/prosemirror/issues/1082
   destroy() {
-    this.eventDispatcher.off(widthPluginKey.key, this.updateWidth);
+    var _this$unsubscribe;
+    (_this$unsubscribe = this.unsubscribe) === null || _this$unsubscribe === void 0 ? void 0 : _this$unsubscribe.call(this);
   }
 }
 function shouldPluginStateUpdate(newBreakoutNode, currentBreakoutNode) {
@@ -97,9 +98,8 @@ function shouldPluginStateUpdate(newBreakoutNode, currentBreakoutNode) {
   }
   return newBreakoutNode || currentBreakoutNode ? true : false;
 }
-function createPlugin({
-  dispatch,
-  eventDispatcher
+function createPlugin(pluginInjectionApi, {
+  dispatch
 }) {
   return new SafePlugin({
     state: {
@@ -130,18 +130,38 @@ function createPlugin({
         // See the following link for more details:
         // https://prosemirror.net/docs/ref/#view.EditorProps.nodeViews.
         breakout: (mark, view) => {
-          return new BreakoutView(mark, view, eventDispatcher);
+          return new BreakoutView(mark, view, pluginInjectionApi);
         }
       }
     }
   });
 }
-const breakoutPlugin = options => ({
+const LayoutButtonWrapper = ({
+  api,
+  editorView,
+  boundariesElement,
+  scrollableElement,
+  mountPoint
+}) => {
+  var _breakoutState$breako;
+  // Re-render with `width` (but don't use state) due to https://bitbucket.org/atlassian/%7Bc8e2f021-38d2-46d0-9b7a-b3f7b428f724%7D/pull-requests/24272
+  const {
+    breakoutState
+  } = useSharedPluginState(api, ['width', 'breakout']);
+  return /*#__PURE__*/React.createElement(LayoutButton, {
+    editorView: editorView,
+    mountPoint: mountPoint,
+    boundariesElement: boundariesElement,
+    scrollableElement: scrollableElement,
+    node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 ? void 0 : breakoutState.breakoutNode) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
+  });
+};
+const breakoutPlugin = (options, api) => ({
   name: 'breakout',
   pmPlugins() {
     return [{
       name: 'breakout',
-      plugin: createPlugin
+      plugin: props => createPlugin(api, props)
     }];
   },
   marks() {
@@ -150,6 +170,14 @@ const breakoutPlugin = options => ({
       mark: breakout
     }];
   },
+  getSharedState(editorState) {
+    if (!editorState) {
+      return {
+        breakoutNode: undefined
+      };
+    }
+    return pluginKey.getState(editorState);
+  },
   contentComponent({
     editorView,
     popupsMountPoint,
@@ -160,23 +188,12 @@ const breakoutPlugin = options => ({
     if (options && !options.allowBreakoutButton) {
       return null;
     }
-    return /*#__PURE__*/React.createElement(WithPluginState, {
-      plugins: {
-        breakoutPluginState: pluginKey,
-        widthPluginState: widthPluginKey
-      },
-      render: ({
-        breakoutPluginState
-      }) => {
-        var _breakoutPluginState$;
-        return /*#__PURE__*/React.createElement(LayoutButton, {
-          editorView: editorView,
-          mountPoint: popupsMountPoint,
-          boundariesElement: popupsBoundariesElement,
-          scrollableElement: popupsScrollableElement,
-          node: (_breakoutPluginState$ = breakoutPluginState === null || breakoutPluginState === void 0 ? void 0 : breakoutPluginState.breakoutNode) !== null && _breakoutPluginState$ !== void 0 ? _breakoutPluginState$ : null
-        });
-      }
+    return /*#__PURE__*/React.createElement(LayoutButtonWrapper, {
+      api: api,
+      mountPoint: popupsMountPoint,
+      editorView: editorView,
+      boundariesElement: popupsBoundariesElement,
+      scrollableElement: popupsScrollableElement
     });
   }
 });

package/dist/es2019/plugins/card/toolbar.js

@@ -158,8 +158,8 @@ const unlinkCard = (node, state, editorAnalyticsApi) => {
   }
   return () => false;
 };
-const buildAlignmentOptions = (state, intl, cardOptions) => {
-  return buildLayoutButtons(state, intl, state.schema.nodes.embedCard, true, true, cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowWrapping, cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowAlignment);
+const buildAlignmentOptions = (state, intl, widthPluginDependencyApi, cardOptions) => {
+  return buildLayoutButtons(state, intl, state.schema.nodes.embedCard, widthPluginDependencyApi, true, true, cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowWrapping, cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowAlignment);
 };
 const withToolbarMetadata = command => commandWithMetadata(command, {
   inputMethod: INPUT_METHOD.FLOATING_TB
@@ -245,7 +245,8 @@ const generateToolbarItems = (state, featureFlags, intl, providerFactory, cardOp
       onClick: withToolbarMetadata(removeCard(editorAnalyticsApi))
     }];
     if (currentAppearance === 'embed') {
-      const alignmentOptions = buildAlignmentOptions(state, intl, cardOptions);
+      var _pluginInjectionApi$d5;
+      const alignmentOptions = buildAlignmentOptions(state, intl, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d5 = pluginInjectionApi.dependencies) === null || _pluginInjectionApi$d5 === void 0 ? void 0 : _pluginInjectionApi$d5.width, cardOptions);
       if (alignmentOptions.length) {
         alignmentOptions.push({
           type: 'separator'

package/dist/es2019/plugins/collab-edit/plugin-state.js

@@ -89,10 +89,8 @@ export class PluginState {
           remove = remove.concat(oldPointers);
         }
         const endOfDocPos = tr.doc.nodeSize - 2;
-        const {
-          anchor,
-          head
-        } = telepointerData.selection;
+        const anchor = telepointerData.selection.anchor;
+        const head = telepointerData.selection.head;
         let rawFrom = anchor < head ? anchor : head;
         let rawTo = anchor >= head ? anchor : head;
         if (rawFrom > endOfDocPos) {

package/dist/es2019/plugins/copy-button/commands.js

@@ -1,9 +1,11 @@
 import { copyButtonPluginKey } from './pm-plugins/plugin-key';
 import { hoverDecoration } from '../base/pm-plugins/decoration';
-import { copyHTMLToClipboard } from '../../utils/clipboard';
+import { NodeSelection } from 'prosemirror-state';
+import { copyHTMLToClipboard, copyHTMLToClipboardPolyfill } from '../../utils/clipboard';
 import { getSelectedNodeOrNodeParentByNodeType, toDOM } from './utils';
 import { addAnalytics, ACTION, INPUT_METHOD } from '../analytics';
 import { getAnalyticsPayload } from '../clipboard/pm-plugins/main';
+import { browser } from '@atlaskit/editor-common/utils';
 export function createToolbarCopyCommandForMark(markType) {
   function command(state, dispatch) {
     const textNode = state.tr.selection.$head.parent.maybeChild(state.tr.selection.$head.index());
@@ -121,7 +123,12 @@ export const createToolbarCopyCommandForNode = nodeType => (state, dispatch) =>
         // https://github.com/ProseMirror/prosemirror-view/blob/master/src/clipboard.ts#L32
         div.firstChild.setAttribute('data-pm-slice', '0 0 []');
       }
-      copyHTMLToClipboard(div);
+      // ED-17083 safari seems have bugs for extension copy because exntension do not have a child text(innerText) and it will not recognized as html in clipboard, this could be merge into one if this extension fixed children issue or safari fix the copy bug
+      if (browser.safari && state.selection instanceof NodeSelection && state.selection.node.type === state.schema.nodes.extension) {
+        copyHTMLToClipboardPolyfill(div);
+      } else {
+        copyHTMLToClipboard(div);
+      }
     }
     copyToClipboardTr.setMeta('scrollIntoView', false);
     dispatch(copyToClipboardTr);

package/dist/es2019/plugins/extension/index.js

@@ -31,7 +31,7 @@ const extensionPlugin = (options = {}, api) => {
           eventDispatcher
         }) => {
           const extensionHandlers = options.extensionHandlers || {};
-          return createPlugin(dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, options.useLongPressSelection, {
+          return createPlugin(dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, api, options.useLongPressSelection, {
             appearance: options.appearance
           });
         }

package/dist/es2019/plugins/extension/nodeviews/extension.js

@@ -43,17 +43,19 @@ export class ExtensionNode extends ReactNodeView {
       providerFactory: props.providerFactory,
       handleContentDOMRef: forwardRef,
       extensionHandlers: props.extensionHandlers,
-      editorAppearance: (_props$extensionNodeV = props.extensionNodeViewOptions) === null || _props$extensionNodeV === void 0 ? void 0 : _props$extensionNodeV.appearance
+      editorAppearance: (_props$extensionNodeV = props.extensionNodeViewOptions) === null || _props$extensionNodeV === void 0 ? void 0 : _props$extensionNodeV.appearance,
+      pluginInjectionApi: props.pluginInjectionApi
     }));
   }
 }
-export default function ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions) {
+export default function ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions, pluginInjectionApi) {
   return (node, view, getPos) => {
     const hasIntlContext = true;
     return new ExtensionNode(node, view, getPos, portalProviderAPI, eventDispatcher, {
       providerFactory,
       extensionHandlers,
-      extensionNodeViewOptions
+      extensionNodeViewOptions,
+      pluginInjectionApi
     }, undefined, undefined, undefined, hasIntlContext).init();
   };
 }

package/dist/es2019/plugins/extension/pm-plugins/main.js

@@ -125,7 +125,7 @@ export const handleUpdate = ({
   }
   return true;
 };
-const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, useLongPressSelection = false, options = {}) => {
+const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, pluginInjectionApi, useLongPressSelection = false, options = {}) => {
   const state = createPluginState(dispatch, {
     showEditButton: false,
     showContextPanel: false
@@ -160,11 +160,11 @@ const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProvid
     props: {
       nodeViews: {
         // WARNING: referentiality-plugin also creates these nodeviews
-        extension: ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions),
+        extension: ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions, pluginInjectionApi),
         // WARNING: referentiality-plugin also creates these nodeviews
-        bodiedExtension: ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions),
+        bodiedExtension: ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions, pluginInjectionApi),
         // WARNING: referentiality-plugin also creates these nodeviews
-        inlineExtension: ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions)
+        inlineExtension: ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions, pluginInjectionApi)
       },
       handleClickOn: createSelectionClickHandler(['extension', 'bodiedExtension'], target => !target.closest('.extension-content'), {
         useLongPressSelection

package/dist/es2019/plugins/extension/ui/Extension/Extension/index.js

@@ -7,9 +7,8 @@ import { calculateBreakoutStyles } from '@atlaskit/editor-common/utils';
 import { wrapperStyle, header, content, contentWrapper, widerLayoutClassName } from './styles';
 import { overlay } from '../styles';
 import ExtensionLozenge from '../Lozenge';
-import { pluginKey as widthPluginKey } from '../../../../width';
-import WithPluginState from '../../../../../ui/WithPluginState';
 import classnames from 'classnames';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 function ExtensionWithPluginState(props) {
   const {
     node,
@@ -92,6 +91,39 @@ function ExtensionWithPluginState(props) {
   }))));
 }
 const Extension = props => {
+  // TODO: ED-17836 This code is here because confluence injects
+  // the `editor-referentiality` plugin via `dangerouslyAppendPlugins`
+  // which cannot access the `pluginInjectionApi`. When we move
+  // Confluence to using presets we can remove this workaround.
+  const {
+    pluginInjectionApi
+  } = props;
+  return pluginInjectionApi === undefined ? jsx(ExtensionDeprecated, props) : jsx(ExtensionWithSharedState, props);
+};
+const ExtensionWithSharedState = props => {
+  const {
+    pluginInjectionApi
+  } = props;
+  const {
+    widthState
+  } = useSharedPluginState(pluginInjectionApi, ['width']);
+  return jsx(ExtensionWithPluginState, _extends({
+    widthState: widthState
+  }, props));
+};
+import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
+// TODO: ED-17836 This code is here because Confluence injects
+// the `editor-referentiality` plugin via `dangerouslyAppendPlugins`
+// which cannot access the `pluginInjectionApi`. When we move
+// Confluence to using presets we can remove this workaround.
+// @ts-ignore
+const widthPluginKey = {
+  key: 'widthPlugin$',
+  getState: state => {
+    return state['widthPlugin$'];
+  }
+};
+const ExtensionDeprecated = props => {
   return jsx(WithPluginState, {
     editorView: props.view,
     plugins: {
@@ -104,6 +136,10 @@ const Extension = props => {
     }, props))
   });
 };
+/**
+ * End workaround
+ */
+
 export default overflowShadow(Extension, {
   overflowSelector: '.extension-overflow-wrapper'
 });

package/dist/es2019/plugins/extension/ui/Extension/ExtensionComponent.js

@@ -134,7 +134,8 @@ export default class ExtensionComponent extends Component {
       handleContentDOMRef,
       editorView,
       references,
-      editorAppearance
+      editorAppearance,
+      pluginInjectionApi
     } = this.props;
     const extensionHandlerResult = this.tryExtensionHandler();
     switch (node.type.name) {
@@ -148,7 +149,8 @@ export default class ExtensionComponent extends Component {
           handleContentDOMRef: handleContentDOMRef,
           view: editorView,
           editorAppearance: editorAppearance,
-          hideFrame: (_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__hideFrame
+          hideFrame: (_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__hideFrame,
+          pluginInjectionApi: pluginInjectionApi
         }, extensionHandlerResult);
       case 'inlineExtension':
         return /*#__PURE__*/React.createElement(InlineExtension, {

package/dist/es2019/plugins/extension/ui/Extension/index.js

@@ -16,7 +16,8 @@ export default class Extension extends Component {
         handleContentDOMRef,
         extensionHandlers,
         references,
-        editorAppearance
+        editorAppearance,
+        pluginInjectionApi
       } = this.props;
       return /*#__PURE__*/React.createElement(ExtensionComponent, {
         editorView: editorView,
@@ -26,7 +27,8 @@ export default class Extension extends Component {
         extensionProvider: extensionProvider,
         handleContentDOMRef: handleContentDOMRef,
         extensionHandlers: extensionHandlers,
-        editorAppearance: editorAppearance
+        editorAppearance: editorAppearance,
+        pluginInjectionApi: pluginInjectionApi
       });
     });
     this.providerFactory = props.providerFactory || new ProviderFactory();