@atlaskit/editor-common 103.5.0 → 103.7.0

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @atlaskit/editor-common
 
+## 103.7.0
+
+### Minor Changes
+
+- [#137973](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/137973)
+  [`5cc195689bfb2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5cc195689bfb2) -
+  ED-27400 add resize layout to single column layout
+
+## 103.6.0
+
+### Minor Changes
+
+- [#134613](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/134613)
+  [`be20cc186939b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/be20cc186939b) -
+  ED-26247 Remove feature flag platform_media_extended_resize_experience and replace it with a new
+  media prop which defaults to false allowPixelResizing
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 103.5.0
 
 ### Minor Changes

package/dist/cjs/analytics/types/enums.js

@@ -433,6 +433,7 @@ var ACTION_SUBJECT_ID = exports.ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTIO
   ACTION_SUBJECT_ID["PICKER_MEDIA"] = "mediaPicker";
   ACTION_SUBJECT_ID["PICKER_COLOR"] = "colorPicker";
   ACTION_SUBJECT_ID["PICKER_EMOJI"] = "emojiPicker";
+  ACTION_SUBJECT_ID["DOCKED_PRIMARY_TOOLBAR"] = "dockedPrimaryToolbar";
   ACTION_SUBJECT_ID["PLACEHOLDER_TEXT"] = "placeholderText";
   ACTION_SUBJECT_ID["POST_QUERY_SEARCH_RESULTS"] = "postQuerySearchResults";
   ACTION_SUBJECT_ID["PRE_QUERY_SEARCH_RESULTS"] = "preQuerySearchResults";

package/dist/cjs/card/MediaAndEmbedsToolbar/index.js

@@ -24,7 +24,6 @@ var _alignImageLeft2 = _interopRequireDefault(require("@atlaskit/icon/glyph/edit
 var _alignImageRight2 = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/align-image-right"));
 var _mediaWrapLeft = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/media-wrap-left"));
 var _mediaWrapRight = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/media-wrap-right"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _analytics = require("../../analytics");
 var _coreUtils = require("../../core-utils");
 var _messages = _interopRequireWildcard(require("../../messages"));
@@ -119,7 +118,7 @@ var getNodeWidth = function getNodeWidth(node, schema) {
   }
   return node.firstChild && node.firstChild.attrs.width || node.attrs.width;
 };
-var makeAlign = function makeAlign(layout, nodeType, widthPluginDependencyApi, analyticsApi) {
+var makeAlign = function makeAlign(layout, nodeType, widthPluginDependencyApi, analyticsApi, allowPixelResizing) {
   return function (state, dispatch) {
     var _ref = state.selection,
       node = _ref.node;
@@ -133,7 +132,7 @@ var makeAlign = function makeAlign(layout, nodeType, widthPluginDependencyApi, a
       return false;
     }
     var nodeWidth = getNodeWidth(node, state.schema);
-    var newAttrs = (0, _platformFeatureFlags.fg)('platform_editor_media_extended_resize_experience') ? // with extended experience, change alignment does not change media single width
+    var newAttrs = allowPixelResizing ? // with extended experience, change alignment does not change media single width
     _objectSpread(_objectSpread({}, node.attrs), {}, {
       layout: layout
     }) : (0, _utils2.alignAttributes)(layout, node.attrs, undefined, nodeWidth, widthPluginState.lineLength);
@@ -165,13 +164,13 @@ var makeAlign = function makeAlign(layout, nodeType, widthPluginDependencyApi, a
     return true;
   };
 };
-var getToolbarLayout = function getToolbarLayout(layout) {
-  if (_utils2.nonWrappedLayouts.includes(layout) && (0, _platformFeatureFlags.fg)('platform_editor_media_extended_resize_experience')) {
+var getToolbarLayout = function getToolbarLayout(layout, allowPixelResizing) {
+  if (_utils2.nonWrappedLayouts.includes(layout) && allowPixelResizing) {
     return 'center';
   }
   return layout;
 };
-var mapIconsToToolbarItem = function mapIconsToToolbarItem(icons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled) {
+var mapIconsToToolbarItem = function mapIconsToToolbarItem(icons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled, allowPixelResizing) {
   return icons.map(function (toolbarItem) {
     var id = toolbarItem.id,
       value = toolbarItem.value;
@@ -180,8 +179,8 @@ var mapIconsToToolbarItem = function mapIconsToToolbarItem(icons, layout, intl,
       type: 'button',
       icon: toolbarItem.icon,
       title: intl.formatMessage(layoutToMessages[value]),
-      selected: getToolbarLayout(layout) === value,
-      onClick: makeAlign(value, nodeType, widthPluginDependencyApi, analyticsApi)
+      selected: getToolbarLayout(layout, allowPixelResizing) === value,
+      onClick: makeAlign(value, nodeType, widthPluginDependencyApi, analyticsApi, allowPixelResizing)
     }, isChangingLayoutDisabled && {
       disabled: value !== 'center'
     });
@@ -195,14 +194,15 @@ var buildLayoutButtons = function buildLayoutButtons(state, intl, nodeType, widt
   var allowWrapping = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : true;
   var allowAlignment = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : true;
   var isChangingLayoutDisabled = arguments.length > 9 ? arguments[9] : undefined;
+  var allowPixelResizing = arguments.length > 10 ? arguments[10] : undefined;
   var selection = state.selection;
   if (!(selection instanceof _state.NodeSelection) || !selection.node || !nodeType || shouldHideLayoutToolbar(selection, state.schema, allowResizingInTables)) {
     return [];
   }
   var layout = selection.node.attrs.layout;
-  var alignmentToolbarItems = allowAlignment ? mapIconsToToolbarItem(alignmentIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled) : [];
-  var wrappingToolbarItems = allowWrapping ? mapIconsToToolbarItem(wrappingIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled) : [];
-  var breakOutToolbarItems = !allowResizing ? mapIconsToToolbarItem(breakoutIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi) : [];
+  var alignmentToolbarItems = allowAlignment ? mapIconsToToolbarItem(alignmentIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled, allowPixelResizing) : [];
+  var wrappingToolbarItems = allowWrapping ? mapIconsToToolbarItem(wrappingIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled, allowPixelResizing) : [];
+  var breakOutToolbarItems = !allowResizing ? mapIconsToToolbarItem(breakoutIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, allowPixelResizing) : [];
   var items = [].concat((0, _toConsumableArray2.default)(alignmentToolbarItems), (0, _toConsumableArray2.default)(getSeparatorBetweenAlignmentAndWrapping(allowAlignment, allowWrapping)), (0, _toConsumableArray2.default)(wrappingToolbarItems), (0, _toConsumableArray2.default)(getSeparatorBeforeBreakoutItems(allowAlignment, allowWrapping, allowResizing)), (0, _toConsumableArray2.default)(breakOutToolbarItems));
   return items;
 };

package/dist/cjs/i18n/da.js

@@ -334,6 +334,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': 'Rediger søgning',
   'fabric.editor.date': 'Dato',
   'fabric.editor.date.description': 'Tilføj en dato med en kalender',
+  'fabric.editor.datePickerOpenedAlert': 'Pop op-vinduet til datoredigering er åbnet. Tryk på Tabulatorknappen for at få adgang til pop op-vinduet',
   'fabric.editor.decision': 'Beslutning',
   'fabric.editor.decision.description': 'Registrér beslutninger, så de er lette at finde igen',
   'fabric.editor.decisionPlaceholder': 'Tilføj en beslutning ...',

package/dist/cjs/i18n/de.js

@@ -712,6 +712,7 @@ var _default = exports.default = {
   'fabric.editor.toolbarLabel': 'Editor',
   'fabric.editor.toolbarMediaTitle': 'Bild, Video oder Datei hinzufügen',
   'fabric.editor.toolbarPositionFixedAtTop': 'Oben fixiert',
+  'fabric.editor.toolbarPositionInline': 'Auf gleicher Höhe wie der Text',
   'fabric.editor.tooltip.blockPanel': 'ein Panel',
   'fabric.editor.tooltip.bulletList': 'eine Liste',
   'fabric.editor.tooltip.decisionList': 'eine Entscheidungsliste',

package/dist/cjs/i18n/hu.js

@@ -333,6 +333,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': 'Keresési lekérdezés szerkesztése',
   'fabric.editor.date': 'Dátum',
   'fabric.editor.date.description': 'Dátum hozzáadása naptár használatával',
+  'fabric.editor.datePickerOpenedAlert': 'Megnyílt a dátumszerkesztő előugró ablak, amelyet a Tab billentyűvel érhetsz el',
   'fabric.editor.decision': 'Döntés',
   'fabric.editor.decision.description': 'Döntések rögzítése az egyszerű nyomon követés érdekében',
   'fabric.editor.decisionPlaceholder': 'Döntés hozzáadása...',

package/dist/cjs/i18n/ja.js

@@ -335,6 +335,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': '検索クエリを編集',
   'fabric.editor.date': '日付',
   'fabric.editor.date.description': 'カレンダーを使用して日付を追加',
+  'fabric.editor.datePickerOpenedAlert': '日付エディターのポップアップが開きました。Tab キーを押してポップアップにアクセスしてください',
   'fabric.editor.decision': '決定事項',
   'fabric.editor.decision.description': '決定事項をキャプチャして簡単に追跡',
   'fabric.editor.decisionPlaceholder': '決定事項を追加…',

package/dist/cjs/i18n/ko.js

@@ -335,6 +335,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': '검색 쿼리 편집',
   'fabric.editor.date': '날짜',
   'fabric.editor.date.description': '캘린더로 날짜 추가',
+  'fabric.editor.datePickerOpenedAlert': '날짜 편집기 팝업이 열렸습니다. Tab 키를 눌러 팝업에 액세스하세요',
   'fabric.editor.decision': '결정',
   'fabric.editor.decision.description': '결정을 추적하기 쉽도록 캡처',
   'fabric.editor.decisionPlaceholder': '결정 추가...',

package/dist/cjs/i18n/nb.js

@@ -334,6 +334,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': 'Rediger søkespørring',
   'fabric.editor.date': 'Dato',
   'fabric.editor.date.description': 'Legg til en dato med en kalender',
+  'fabric.editor.datePickerOpenedAlert': 'Pop-up for å redigere dato er åpnet, trykk på Tab for å gå til pop-up-vinduet',
   'fabric.editor.decision': 'Beslutning',
   'fabric.editor.decision.description': 'Registrer beslutninger slik at det er lett å spore dem',
   'fabric.editor.decisionPlaceholder': 'Legg til en beslutning …',

package/dist/cjs/i18n/pt_BR.js

@@ -333,6 +333,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': 'Editar consulta de pesquisa',
   'fabric.editor.date': 'Data',
   'fabric.editor.date.description': 'Adicionar data usando um calendário',
+  'fabric.editor.datePickerOpenedAlert': 'O pop-up do editor de data foi aberto, pressione Tab para acessar',
   'fabric.editor.decision': 'Decisão',
   'fabric.editor.decision.description': 'Registre decisões para facilitar o acompanhamento',
   'fabric.editor.decisionPlaceholder': 'Adicionar uma decisão...',

package/dist/cjs/i18n/ru.js

@@ -335,6 +335,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': 'Изменить поисковый запрос',
   'fabric.editor.date': 'Дата',
   'fabric.editor.date.description': 'Добавление даты из календаря',
+  'fabric.editor.datePickerOpenedAlert': 'Открылось всплывающее окно реактора даты. Для перехода к всплывающему окну нажмите клавишу табуляции',
   'fabric.editor.decision': 'Решение',
   'fabric.editor.decision.description': 'Записывайте решения для удобного отслеживания',
   'fabric.editor.decisionPlaceholder': 'Добавить решение…',

package/dist/cjs/i18n/th.js

@@ -320,6 +320,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': 'แก้ไขคำถามการค้นหา',
   'fabric.editor.date': 'วันที่',
   'fabric.editor.date.description': 'เพิ่มวันที่โดยใช้ปฏิทิน',
+  'fabric.editor.datePickerOpenedAlert': 'เปิดป๊อบอัพแก้ไขวันที่ แล้วกดที่ "แท็บ" เพื่อเข้าถึงป๊อบอัพ',
   'fabric.editor.decision': 'การตัดสินใจ',
   'fabric.editor.decision.description': 'สร้างกรอบการตัดสินใจเพื่อให้คุณติดตามได้ง่าย',
   'fabric.editor.decisionPlaceholder': 'เพิ่มการตัดสินใจ…',

package/dist/cjs/i18n/uk.js

@@ -320,6 +320,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': 'Редагувати пошуковий запит',
   'fabric.editor.date': 'Дата',
   'fabric.editor.date.description': 'Вставити дату через календар',
+  'fabric.editor.datePickerOpenedAlert': 'Відкрито спливне вікно редактора дат. Натисніть Tab, щоб викликати його.',
   'fabric.editor.decision': 'Рішення',
   'fabric.editor.decision.description': 'Зафіксувати рішення, щоб його було легко знайти',
   'fabric.editor.decisionPlaceholder': 'Додати рішення...',

package/dist/cjs/i18n/vi.js

@@ -320,6 +320,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': 'Sửa truy vấn tìm kiếm',
   'fabric.editor.date': 'Ngày',
   'fabric.editor.date.description': 'Thêm ngày bằng cách sử dụng lịch',
+  'fabric.editor.datePickerOpenedAlert': 'Cửa sổ bật lên của trình chỉnh sửa ngày đã mở, hãy nhấn Tab để truy cập cửa sổ bật lên',
   'fabric.editor.decision': 'Quyết định',
   'fabric.editor.decision.description': 'Thu thập các quyết định để dễ dàng theo dõi',
   'fabric.editor.decisionPlaceholder': 'Thêm quyết định…',

package/dist/cjs/i18n/zh.js

@@ -335,6 +335,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': '编辑搜索查询',
   'fabric.editor.date': '日期',
   'fabric.editor.date.description': '使用日历添加日期',
+  'fabric.editor.datePickerOpenedAlert': '日期编辑器弹出窗口已打开，按 Tab 键可访问弹出窗口',
   'fabric.editor.decision': '决定',
   'fabric.editor.decision.description': '捕获决策，以便轻松跟踪',
   'fabric.editor.decisionPlaceholder': '添加决定...',

package/dist/cjs/i18n/zh_TW.js

@@ -335,6 +335,7 @@ var _default = exports.default = {
   'fabric.editor.datasourceTitle': '編輯搜尋查詢',
   'fabric.editor.date': '日期',
   'fabric.editor.date.description': '使用日曆新增日期',
+  'fabric.editor.datePickerOpenedAlert': '日期編輯器快顯視窗已開啟，按 Tab 即可前往快顯視窗',
   'fabric.editor.decision': '決定',
   'fabric.editor.decision.description': '擷取決定以便追蹤',
   'fabric.editor.decisionPlaceholder': '新增決定…',

package/dist/cjs/messages/breakout.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.messages = void 0;
+var _reactIntlNext = require("react-intl-next");
+var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
+  fullWidthLabel: {
+    id: 'fabric.editor.breakoutFullWidthLabel',
+    defaultMessage: 'Full-width',
+    description: 'Resize current element to full-width mode'
+  },
+  wideWidthLabel: {
+    id: 'fabric.editor.breakoutWideWidthLabel',
+    defaultMessage: 'Wide',
+    description: 'Resize current element to wide mode'
+  }
+});

package/dist/cjs/messages/index.js

@@ -33,6 +33,12 @@ Object.defineProperty(exports, "blockTypeMessages", {
     return _blockType.messages;
   }
 });
+Object.defineProperty(exports, "breakoutMessages", {
+  enumerable: true,
+  get: function get() {
+    return _breakout.messages;
+  }
+});
 Object.defineProperty(exports, "cardMessages", {
   enumerable: true,
   get: function get() {
@@ -217,6 +223,7 @@ Object.defineProperty(exports, "unsupportedContentMessages", {
 var _reactIntlNext = require("react-intl-next");
 var _alignment = require("./alignment");
 var _annotation = require("./annotation");
+var _breakout = require("./breakout");
 var _blockType = require("./block-type");
 var _codeBidiWarning = require("./codeBidiWarning");
 var _link = require("./link");

package/dist/cjs/monitoring/error.js

@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "103.5.0";
+var packageVersion = "103.7.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/cjs/resizer/BreakoutResizer.js

@@ -16,6 +16,7 @@ var _analytics = require("../analytics");
 var _styles = require("../styles");
 var _browser = require("../utils/browser");
 var _Resizer = _interopRequireDefault(require("./Resizer"));
+var _ResizerBreakoutModeLabel = require("./ResizerBreakoutModeLabel");
 var _useBreakoutGuidelines = require("./useBreakoutGuidelines");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -75,7 +76,6 @@ var defaultStyles = {
   display: 'grid'
 };
 var RESIZE_STEP_VALUE = 10;
-
 /**
  * BreakoutResizer is a common component used to resize nodes that support the 'Breakout' mark, so it requires
  * correct ADF support.
@@ -92,7 +92,8 @@ var BreakoutResizer = exports.BreakoutResizer = function BreakoutResizer(_ref) {
     parentRef = _ref.parentRef,
     displayGuidelines = _ref.displayGuidelines,
     editorAnalyticsApi = _ref.editorAnalyticsApi,
-    displayGapCursor = _ref.displayGapCursor;
+    displayGapCursor = _ref.displayGapCursor,
+    onResizeStart = _ref.onResizeStart;
   var _useState = (0, _react.useState)({
       minWidth: undefined,
       maxWidth: undefined,
@@ -135,6 +136,7 @@ var BreakoutResizer = exports.BreakoutResizer = function BreakoutResizer(_ref) {
     return $from.pos >= startPos && endPos >= $to.pos;
   }, [editorView.state.doc, editorView.state.selection, getPos]);
   var handleResizeStart = (0, _react.useCallback)(function () {
+    onResizeStart === null || onResizeStart === void 0 || onResizeStart();
     var newMinWidth;
     var newMaxWidth;
     var widthState = getEditorWidth();
@@ -151,7 +153,7 @@ var BreakoutResizer = exports.BreakoutResizer = function BreakoutResizer(_ref) {
       maxWidth: newMaxWidth
     });
     dispatch(state.tr.setMeta('is-resizer-resizing', true));
-  }, [getEditorWidth, editorView, displayGapCursor]);
+  }, [onResizeStart, getEditorWidth, editorView, displayGapCursor]);
   var handleResize = (0, _react.useCallback)(function (originalState, delta) {
     if ((0, _experiments.editorExperiment)('single_column_layouts', true)) {
       var newWidth = originalState.width + delta.width;
@@ -325,6 +327,9 @@ var BreakoutResizer = exports.BreakoutResizer = function BreakoutResizer(_ref) {
     handleSize: "clamped",
     handleHighlight: "full-height",
     handlePositioning: "adjacent",
-    handleAlignmentMethod: "sticky"
+    handleAlignmentMethod: "sticky",
+    labelComponent: currentLayout && (0, _experiments.editorExperiment)('single_column_layouts', true) && ['full-width', 'wide'].includes(currentLayout || '') && /*#__PURE__*/_react.default.createElement(_ResizerBreakoutModeLabel.ResizerBreakoutModeLabel, {
+      layout: currentLayout
+    })
   });
 };

package/dist/cjs/resizer/Resizer.js

@@ -13,13 +13,25 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = _interopRequireWildcard(require("react"));
 var _classnames3 = _interopRequireDefault(require("classnames"));
 var _reResizable = require("re-resizable");
+var _primitives = require("@atlaskit/primitives");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _resizer = require("../styles/shared/resizer");
-var _excluded = ["width", "children", "handleClassName", "className", "handleResize", "handleResizeStart", "handleResizeStop", "handleSize", "handleAlignmentMethod", "handlePositioning", "appearance", "handleStyles", "resizeRatio", "snap", "snapGap", "isHandleVisible", "handleHighlight", "handleTooltipContent", "needExtendedResizeZone", "childrenDOMRef"];
+var _excluded = ["width", "children", "handleClassName", "className", "handleResize", "handleResizeStart", "handleResizeStop", "handleSize", "handleAlignmentMethod", "handlePositioning", "appearance", "handleStyles", "resizeRatio", "snap", "snapGap", "isHandleVisible", "handleHighlight", "handleTooltipContent", "needExtendedResizeZone", "childrenDOMRef", "labelComponent"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var resizerLabelStyles = (0, _primitives.xcss)({
+  position: 'absolute',
+  bottom: "var(--ds-space-negative-400, -32px)",
+  width: '100%',
+  overflow: 'visible',
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  height: "var(--ds-space-0, 0px)"
+});
 var SUPPORTED_HANDLES = ['left', 'right'];
 var inheritedCSS = {
   position: 'inherit',
@@ -71,6 +83,7 @@ var ResizerNext = function ResizerNext(props, ref) {
     _props$needExtendedRe = props.needExtendedResizeZone,
     needExtendedResizeZone = _props$needExtendedRe === void 0 ? true : _props$needExtendedRe,
     childrenDOMRef = props.childrenDOMRef,
+    labelComponent = props.labelComponent,
     otherProps = (0, _objectWithoutProperties2.default)(props, _excluded);
   var onResizeStart = (0, _react.useCallback)(function (event) {
     // prevent creating a drag event on Firefox
@@ -209,6 +222,8 @@ var ResizerNext = function ResizerNext(props, ref) {
     ref: function ref(_ref) {
       return childrenDOMRef && childrenDOMRef(_ref);
     }
-  }, children));
+  }, children), labelComponent && (0, _experiments.editorExperiment)('single_column_layouts', true) && /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+    xcss: resizerLabelStyles
+  }, labelComponent));
 };
 var _default = exports.default = /*#__PURE__*/(0, _react.forwardRef)(ResizerNext);

package/dist/cjs/resizer/ResizerBreakoutModeLabel.js

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ResizerBreakoutModeLabel = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _primitives = require("@atlaskit/primitives");
+var _messages = require("../messages");
+var fullWidthLabelWrapperStyles = (0, _primitives.xcss)({
+  height: "var(--ds-space-400, 32px)",
+  display: 'flex',
+  backgroundColor: 'elevation.surface.overlay',
+  borderRadius: 'border.radius',
+  boxShadow: 'elevation.shadow.overlay',
+  boxSizing: 'border-box',
+  alignItems: 'center'
+});
+var fullWidthLabelStyles = (0, _primitives.xcss)({
+  marginLeft: 'space.100',
+  marginRight: 'space.100',
+  paddingLeft: 'space.075',
+  paddingRight: 'space.075',
+  paddingTop: 'space.050',
+  paddingBottom: 'space.050'
+});
+var ResizerBreakoutModeLabel = exports.ResizerBreakoutModeLabel = function ResizerBreakoutModeLabel(_ref) {
+  var breaktoutLayout = _ref.layout;
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var message = _react.default.useMemo(function () {
+    switch (breaktoutLayout) {
+      case 'full-width':
+        return formatMessage(_messages.breakoutMessages.fullWidthLabel);
+      case 'wide':
+        return formatMessage(_messages.breakoutMessages.wideWidthLabel);
+      default:
+        return null;
+    }
+  }, [breaktoutLayout, formatMessage]);
+  return message && /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+    xcss: fullWidthLabelWrapperStyles
+  }, /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
+    xcss: fullWidthLabelStyles
+  }, message));
+};

package/dist/cjs/resizer/index.js

@@ -10,6 +10,12 @@ Object.defineProperty(exports, "BreakoutResizer", {
     return _BreakoutResizer.BreakoutResizer;
   }
 });
+Object.defineProperty(exports, "ResizerBreakoutModeLabel", {
+  enumerable: true,
+  get: function get() {
+    return _ResizerBreakoutModeLabel.ResizerBreakoutModeLabel;
+  }
+});
 Object.defineProperty(exports, "ResizerNext", {
   enumerable: true,
   get: function get() {
@@ -30,4 +36,5 @@ Object.defineProperty(exports, "useBreakoutGuidelines", {
 });
 var _Resizer = _interopRequireDefault(require("./Resizer"));
 var _BreakoutResizer = require("./BreakoutResizer");
-var _useBreakoutGuidelines = require("./useBreakoutGuidelines");
+var _useBreakoutGuidelines = require("./useBreakoutGuidelines");
+var _ResizerBreakoutModeLabel = require("./ResizerBreakoutModeLabel");

package/dist/cjs/styles/index.js

@@ -399,6 +399,12 @@ Object.defineProperty(exports, "tableCellPadding", {
     return _table.tableCellPadding;
   }
 });
+Object.defineProperty(exports, "tableControlsSpacing", {
+  enumerable: true,
+  get: function get() {
+    return _table.tableControlsSpacing;
+  }
+});
 Object.defineProperty(exports, "tableMarginBottom", {
   enumerable: true,
   get: function get() {
@@ -429,6 +435,12 @@ Object.defineProperty(exports, "tableNewColumnMinWidth", {
     return _table.tableNewColumnMinWidth;
   }
 });
+Object.defineProperty(exports, "tablePadding", {
+  enumerable: true,
+  get: function get() {
+    return _table.tablePadding;
+  }
+});
 Object.defineProperty(exports, "tableResizeHandleWidth", {
   enumerable: true,
   get: function get() {

package/dist/cjs/styles/shared/table.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.tableSharedStyle = exports.tableResizeHandleWidth = exports.tableNewColumnMinWidth = exports.tableMarginTopWithControl = exports.tableMarginTop = exports.tableMarginSides = exports.tableMarginBottom = exports.tableCellPadding = exports.tableCellMinWidth = exports.tableCellBorderWidth = exports.calcTableWidth = exports.TableSharedCssClassName = void 0;
+exports.tableSharedStyle = exports.tableResizeHandleWidth = exports.tablePadding = exports.tableNewColumnMinWidth = exports.tableMarginTopWithControl = exports.tableMarginTop = exports.tableMarginSides = exports.tableMarginBottom = exports.tableControlsSpacing = exports.tableCellPadding = exports.tableCellMinWidth = exports.tableCellBorderWidth = exports.calcTableWidth = exports.TableSharedCssClassName = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("@emotion/react");
 var _adfSchema = require("@atlaskit/adf-schema");
@@ -23,6 +23,8 @@ var tableNewColumnMinWidth = exports.tableNewColumnMinWidth = 140;
 var tableCellBorderWidth = exports.tableCellBorderWidth = 1;
 var tableCellPadding = exports.tableCellPadding = 8;
 var tableResizeHandleWidth = exports.tableResizeHandleWidth = 6;
+var tablePadding = exports.tablePadding = 8;
+var tableControlsSpacing = exports.tableControlsSpacing = tableMarginTop + tablePadding - tableCellBorderWidth;
 var TableSharedCssClassName = exports.TableSharedCssClassName = {
   TABLE_CONTAINER: "".concat(_adfSchema.tablePrefixSelector, "-container"),
   TABLE_NODE_WRAPPER: "".concat(_adfSchema.tablePrefixSelector, "-wrapper"),

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

@@ -23,7 +23,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
  * @jsx jsx
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "103.5.0";
+var packageVersion = "103.7.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 // Ignored via go/ees005

package/dist/es2019/analytics/types/enums.js

@@ -427,6 +427,7 @@ export let ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
   ACTION_SUBJECT_ID["PICKER_MEDIA"] = "mediaPicker";
   ACTION_SUBJECT_ID["PICKER_COLOR"] = "colorPicker";
   ACTION_SUBJECT_ID["PICKER_EMOJI"] = "emojiPicker";
+  ACTION_SUBJECT_ID["DOCKED_PRIMARY_TOOLBAR"] = "dockedPrimaryToolbar";
   ACTION_SUBJECT_ID["PLACEHOLDER_TEXT"] = "placeholderText";
   ACTION_SUBJECT_ID["POST_QUERY_SEARCH_RESULTS"] = "postQuerySearchResults";
   ACTION_SUBJECT_ID["PRE_QUERY_SEARCH_RESULTS"] = "preQuerySearchResults";

package/dist/es2019/card/MediaAndEmbedsToolbar/index.js

@@ -14,7 +14,6 @@ import EditorAlignImageLeft from '@atlaskit/icon/glyph/editor/align-image-left';
 import EditorAlignImageRight from '@atlaskit/icon/glyph/editor/align-image-right';
 import WrapLeftIcon from '@atlaskit/icon/glyph/editor/media-wrap-left';
 import WrapRightIcon from '@atlaskit/icon/glyph/editor/media-wrap-right';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '../../analytics';
 import { insideTable } from '../../core-utils';
 import commonMessages, { mediaAndEmbedToolbarMessages as toolbarMessages } from '../../messages';
@@ -98,7 +97,7 @@ const getNodeWidth = (node, schema) => {
   }
   return node.firstChild && node.firstChild.attrs.width || node.attrs.width;
 };
-const makeAlign = (layout, nodeType, widthPluginDependencyApi, analyticsApi) => {
+const makeAlign = (layout, nodeType, widthPluginDependencyApi, analyticsApi, allowPixelResizing) => {
   return (state, dispatch) => {
     const {
       node
@@ -117,7 +116,7 @@ const makeAlign = (layout, nodeType, widthPluginDependencyApi, analyticsApi) =>
       return false;
     }
     const nodeWidth = getNodeWidth(node, state.schema);
-    const newAttrs = fg('platform_editor_media_extended_resize_experience') ?
+    const newAttrs = allowPixelResizing ?
     // with extended experience, change alignment does not change media single width
     {
       ...node.attrs,
@@ -161,13 +160,13 @@ const makeAlign = (layout, nodeType, widthPluginDependencyApi, analyticsApi) =>
     return true;
   };
 };
-const getToolbarLayout = layout => {
-  if (nonWrappedLayouts.includes(layout) && fg('platform_editor_media_extended_resize_experience')) {
+const getToolbarLayout = (layout, allowPixelResizing) => {
+  if (nonWrappedLayouts.includes(layout) && allowPixelResizing) {
     return 'center';
   }
   return layout;
 };
-const mapIconsToToolbarItem = (icons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled) => icons.map(toolbarItem => {
+const mapIconsToToolbarItem = (icons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled, allowPixelResizing) => icons.map(toolbarItem => {
   const {
     id,
     value
@@ -177,8 +176,8 @@ const mapIconsToToolbarItem = (icons, layout, intl, nodeType, widthPluginDepende
     type: 'button',
     icon: toolbarItem.icon,
     title: intl.formatMessage(layoutToMessages[value]),
-    selected: getToolbarLayout(layout) === value,
-    onClick: makeAlign(value, nodeType, widthPluginDependencyApi, analyticsApi),
+    selected: getToolbarLayout(layout, allowPixelResizing) === value,
+    onClick: makeAlign(value, nodeType, widthPluginDependencyApi, analyticsApi, allowPixelResizing),
     ...(isChangingLayoutDisabled && {
       disabled: value !== 'center'
     })
@@ -189,7 +188,7 @@ const shouldHideLayoutToolbar = (selection, {
 }, allowResizingInTables) => {
   return hasParentNodeOfType([nodes.bodiedExtension, nodes.extensionFrame, nodes.listItem, nodes.expand, nodes.nestedExpand, ...(allowResizingInTables ? [] : [nodes.table])].filter(Boolean))(selection);
 };
-const buildLayoutButtons = (state, intl, nodeType, widthPluginDependencyApi, analyticsApi, allowResizing, allowResizingInTables, allowWrapping = true, allowAlignment = true, isChangingLayoutDisabled) => {
+const buildLayoutButtons = (state, intl, nodeType, widthPluginDependencyApi, analyticsApi, allowResizing, allowResizingInTables, allowWrapping = true, allowAlignment = true, isChangingLayoutDisabled, allowPixelResizing) => {
   const {
     selection
   } = state;
@@ -199,9 +198,9 @@ const buildLayoutButtons = (state, intl, nodeType, widthPluginDependencyApi, ana
   const {
     layout
   } = selection.node.attrs;
-  const alignmentToolbarItems = allowAlignment ? mapIconsToToolbarItem(alignmentIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled) : [];
-  const wrappingToolbarItems = allowWrapping ? mapIconsToToolbarItem(wrappingIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled) : [];
-  const breakOutToolbarItems = !allowResizing ? mapIconsToToolbarItem(breakoutIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi) : [];
+  const alignmentToolbarItems = allowAlignment ? mapIconsToToolbarItem(alignmentIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled, allowPixelResizing) : [];
+  const wrappingToolbarItems = allowWrapping ? mapIconsToToolbarItem(wrappingIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, isChangingLayoutDisabled, allowPixelResizing) : [];
+  const breakOutToolbarItems = !allowResizing ? mapIconsToToolbarItem(breakoutIcons, layout, intl, nodeType, widthPluginDependencyApi, analyticsApi, allowPixelResizing) : [];
   const items = [...alignmentToolbarItems, ...getSeparatorBetweenAlignmentAndWrapping(allowAlignment, allowWrapping), ...wrappingToolbarItems, ...getSeparatorBeforeBreakoutItems(allowAlignment, allowWrapping, allowResizing), ...breakOutToolbarItems];
   return items;
 };

package/dist/es2019/i18n/da.js

@@ -328,6 +328,7 @@ export default {
   'fabric.editor.datasourceTitle': 'Rediger søgning',
   'fabric.editor.date': 'Dato',
   'fabric.editor.date.description': 'Tilføj en dato med en kalender',
+  'fabric.editor.datePickerOpenedAlert': 'Pop op-vinduet til datoredigering er åbnet. Tryk på Tabulatorknappen for at få adgang til pop op-vinduet',
   'fabric.editor.decision': 'Beslutning',
   'fabric.editor.decision.description': 'Registrér beslutninger, så de er lette at finde igen',
   'fabric.editor.decisionPlaceholder': 'Tilføj en beslutning ...',

package/dist/es2019/i18n/de.js

@@ -706,6 +706,7 @@ export default {
   'fabric.editor.toolbarLabel': 'Editor',
   'fabric.editor.toolbarMediaTitle': 'Bild, Video oder Datei hinzufügen',
   'fabric.editor.toolbarPositionFixedAtTop': 'Oben fixiert',
+  'fabric.editor.toolbarPositionInline': 'Auf gleicher Höhe wie der Text',
   'fabric.editor.tooltip.blockPanel': 'ein Panel',
   'fabric.editor.tooltip.bulletList': 'eine Liste',
   'fabric.editor.tooltip.decisionList': 'eine Entscheidungsliste',

package/dist/es2019/i18n/hu.js

@@ -327,6 +327,7 @@ export default {
   'fabric.editor.datasourceTitle': 'Keresési lekérdezés szerkesztése',
   'fabric.editor.date': 'Dátum',
   'fabric.editor.date.description': 'Dátum hozzáadása naptár használatával',
+  'fabric.editor.datePickerOpenedAlert': 'Megnyílt a dátumszerkesztő előugró ablak, amelyet a Tab billentyűvel érhetsz el',
   'fabric.editor.decision': 'Döntés',
   'fabric.editor.decision.description': 'Döntések rögzítése az egyszerű nyomon követés érdekében',
   'fabric.editor.decisionPlaceholder': 'Döntés hozzáadása...',