@atlaskit/editor-common 109.15.0 → 109.16.0

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # @atlaskit/editor-common
 
+## 109.16.0
+
+### Minor Changes
+
+- [`687c1b8fa7801`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/687c1b8fa7801) -
+  EDITOR-1566 bump adf-schema + update validator
+- [`578ac13fd9edd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/578ac13fd9edd) -
+  Add Sync Block provider as new package
+
+### Patch Changes
+
+- [`f43856916489c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f43856916489c) -
+  [EDITOR-1748] Properly calculate if selection is at the start of a blockTaskItem with an extension
+  instead of a paragraph
+- Updated dependencies
+
+## 109.15.1
+
+### Patch Changes
+
+- [`b1acfd162fa8a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b1acfd162fa8a) -
+  use latest browser util for editor-common
+- [`096440b378eeb`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/096440b378eeb) -
+  [ux] EDITOR-1786 - fix update stream errors
+- Updated dependencies
+
 ## 109.15.0
 
 ### Minor Changes

package/dist/cjs/copy-button/index.js

@@ -9,8 +9,9 @@ exports.toDOM = void 0;
 var _model = require("@atlaskit/editor-prosemirror/model");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _clipboard = require("../clipboard");
-var _utils2 = require("../utils");
+var _browser = require("../utils/browser");
 function getSelectedNodeOrNodeParentByNodeType(_ref) {
   var nodeType = _ref.nodeType,
     selection = _ref.selection;
@@ -28,6 +29,7 @@ var copyDomNode = exports.copyDomNode = function copyDomNode(domNode, nodeType,
     var div = document.createElement('div');
     div.appendChild(domNode);
     var schema = selection.$from.doc.type.schema;
+    var browser = (0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) ? (0, _browser.getBrowserInfo)() : _browser.browser;
 
     // if copying inline content
     if (nodeType.inlineContent) {
@@ -47,7 +49,7 @@ var copyDomNode = exports.copyDomNode = function copyDomNode(domNode, nodeType,
     }
     // 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
     // MEX-2528 safari has a bug related to the mediaSingle node with border or link. The image tag within the clipboard is not recognized as HTML when using the ClipboardItem API. To address this, we have to switch to ClipboardPolyfill
-    if (_utils2.browser.safari && selection instanceof _state.NodeSelection && (selection.node.type === schema.nodes.extension || selection.node.type === schema.nodes.mediaSingle)) {
+    if (browser.safari && selection instanceof _state.NodeSelection && (selection.node.type === schema.nodes.extension || selection.node.type === schema.nodes.mediaSingle)) {
       (0, _clipboard.copyHTMLToClipboardPolyfill)(div);
     } else {
       (0, _clipboard.copyHTMLToClipboard)(div);

package/dist/cjs/keymaps/index.js

@@ -110,8 +110,9 @@ var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
 var _w3cKeyname = require("w3c-keyname");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _editorCommands = require("../preset/editor-commands");
-var _utils = require("../utils");
+var _browser = require("../utils/browser");
 var _consts = require("./consts");
 var _keymap = require("./keymap");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
@@ -236,7 +237,8 @@ var tooltipShortcutStyle = (0, _react2.css)({
 });
 function formatShortcut(keymap) {
   var shortcut;
-  if (_utils.browser.mac) {
+  var browser = (0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) ? (0, _browser.getBrowserInfo)() : _browser.browser;
+  if (browser.mac) {
     // for reference: https://wincent.com/wiki/Unicode_representations_of_modifier_keys
     shortcut = keymap.mac
     // Ignored via go/ees005
@@ -269,7 +271,7 @@ function formatShortcut(keymap) {
     lastKey = lastKey.toUpperCase();
   }
   keys[keys.length - 1] = arrowKeysMap[lastKey.toUpperCase()] || lastKey;
-  return keys.join(_utils.browser.mac ? '' : '+');
+  return keys.join(browser.mac ? '' : '+');
 }
 function tooltip(keymap, description) {
   if (keymap) {
@@ -317,17 +319,19 @@ function findShortcutByDescription(description) {
   return;
 }
 function findShortcutByKeymap(keymap) {
-  if (_utils.browser.mac) {
+  var browser = (0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) ? (0, _browser.getBrowserInfo)() : _browser.browser;
+  if (browser.mac) {
     return keymap.mac;
   }
   return keymap.windows;
 }
 function getAriaKeyshortcuts(keymap) {
   var keyShortcuts;
+  var browser = (0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) ? (0, _browser.getBrowserInfo)() : _browser.browser;
   if (typeof keymap === 'string') {
     keyShortcuts = keymap;
   } else if ((0, _typeof2.default)(keymap) === 'object') {
-    keyShortcuts = keymap[_utils.browser.mac ? 'mac' : 'windows'];
+    keyShortcuts = keymap[browser.mac ? 'mac' : 'windows'];
   }
   if (keyShortcuts) {
     return keyShortcuts.toLowerCase().split('-').map(function (modifier) {
@@ -414,7 +418,8 @@ function bindKeymapWithEditorCommand(shortcut, cmd, keymap) {
 }
 function findKeyMapForBrowser(keyMap) {
   if (keyMap) {
-    if (_utils.browser.mac) {
+    var browser = (0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) ? (0, _browser.getBrowserInfo)() : _browser.browser;
+    if (browser.mac) {
       return keyMap.mac;
     }
     return keyMap.windows;

package/dist/cjs/link/LinkPicker/HyperlinkAddToolbar/HyperlinkAddToolbar.js

@@ -32,6 +32,7 @@ var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _analytics = require("../../../analytics");
 var _ui = require("../../../ui");
 var _utils = require("../../../utils");
+var _browser = require("../../../utils/browser");
 var _LinkSearchList = _interopRequireWildcard(require("../../LinkSearch/LinkSearchList"));
 var _ToolbarComponents = require("../../LinkSearch/ToolbarComponents");
 var _transformTimeStamp = require("../../LinkSearch/transformTimeStamp");
@@ -877,10 +878,11 @@ var HyperlinkLinkAddToolbar = exports.HyperlinkLinkAddToolbar = /*#__PURE__*/fun
       var ariaActiveDescendant = selectedIndex > -1 ? "link-search-list-item-".concat(selectedIndex) : '';
       var linkSearchInputId = 'search-recent-links-field-id';
       var displayTextInputId = 'display-text-filed-id';
+      var browser = (0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) ? (0, _browser.getBrowserInfo)() : _browser.browser;
       // Added workaround with a screen reader Announcer specifically for VoiceOver + Safari
       // as the Aria design pattern for combobox does not work in this case
       // for details: https://a11y-internal.atlassian.net/browse/AK-740
-      var screenReaderText = _utils.browser.safari && this.getScreenReaderText();
+      var screenReaderText = browser.safari && this.getScreenReaderText();
       return (0, _react2.jsx)("div", {
         "aria-label": "Hyperlink Edit"
         // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766

package/dist/cjs/monitoring/error.js

@@ -16,7 +16,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 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 = "109.14.1";
+var packageVersion = "109.15.1";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/cjs/resizer/BreakoutResizer.js

@@ -11,6 +11,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _bindEventListener = require("bind-event-listener");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _analytics = require("../analytics");
 var _styles = require("../styles");
@@ -140,6 +141,7 @@ var BreakoutResizer = exports.BreakoutResizer = function BreakoutResizer(_ref) {
     currentLayout = _useBreakoutGuideline.currentLayout,
     guidelines = _useBreakoutGuideline.guidelines,
     setCurrentWidth = _useBreakoutGuideline.setCurrentWidth;
+  var browser = (0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) ? (0, _browser.getBrowserInfo)() : _browser.browser;
   (0, _react.useEffect)(function () {
     if (displayGuidelines) {
       displayGuidelines(guidelines || []);
@@ -263,7 +265,7 @@ var BreakoutResizer = exports.BreakoutResizer = function BreakoutResizer(_ref) {
   }, [handleResizeStop, maxWidth, minWidth, parentRef]);
   var resizeHandleKeyDownHandler = (0, _react.useCallback)(function (event) {
     var isBracketKey = event.code === 'BracketRight' || event.code === 'BracketLeft';
-    var metaKey = _browser.browser.mac ? event.metaKey : event.ctrlKey;
+    var metaKey = browser.mac ? event.metaKey : event.ctrlKey;
     if (event.altKey || metaKey || event.shiftKey) {
       areResizeMetaKeysPressed.current = true;
     }
@@ -275,7 +277,7 @@ var BreakoutResizer = exports.BreakoutResizer = function BreakoutResizer(_ref) {
     } else if (!areResizeMetaKeysPressed.current) {
       handleEscape();
     }
-  }, [handleEscape, handleLayoutSizeChangeOnKeypress]);
+  }, [handleEscape, handleLayoutSizeChangeOnKeypress, browser]);
   var resizeHandleKeyUpHandler = (0, _react.useCallback)(function (event) {
     if (event.altKey || event.metaKey) {
       areResizeMetaKeysPressed.current = false;
@@ -287,7 +289,7 @@ var BreakoutResizer = exports.BreakoutResizer = function BreakoutResizer(_ref) {
       return;
     }
     var resizeHandleThumbEl = resizerRef.current.getResizerThumbEl();
-    var metaKey = _browser.browser.mac ? event.metaKey : event.ctrlKey;
+    var metaKey = browser.mac ? event.metaKey : event.ctrlKey;
     var isTargetResizeHandle = event.target instanceof HTMLElement && event.target.classList.contains('resizer-handle-thumb');
     if (event.altKey && event.shiftKey && metaKey && event.code === 'KeyR' || isTargetResizeHandle && (event.altKey || metaKey || event.shiftKey)) {
       event.preventDefault();
@@ -301,7 +303,7 @@ var BreakoutResizer = exports.BreakoutResizer = function BreakoutResizer(_ref) {
         inline: 'nearest'
       });
     }
-  }, [resizerRef]);
+  }, [resizerRef, browser]);
   (0, _react.useLayoutEffect)(function () {
     if (!resizerRef.current || !editorView) {
       return;

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

@@ -57,10 +57,10 @@ var firstNodeWithNotMarginTop = function firstNodeWithNotMarginTop() {
   (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t> :nth-child(1 of :not(style, .ProseMirror-gapcursor, .ProseMirror-widget, span)) {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\t\t\t"]))) : // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
   (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t> :first-child:not(style),\n\t\t\t\t> style:first-child + * {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\n\t\t\t\t> .ProseMirror-gapcursor:first-child + *,\n\t\t\t\t> style:first-child + .ProseMirror-gapcursor + * {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\n\t\t\t\t> .ProseMirror-gapcursor:first-child + span + *,\n\t\t\t\t> style:first-child + .ProseMirror-gapcursor + span + * {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\t\t\t"])));
 };
-
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Appears safe to auto-fix, but leaving it up to the team to remediate as the readability only gets worse with autofixing
 var tableSharedStyle = exports.tableSharedStyle = function tableSharedStyle() {
-  return (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n\t", "\n\t.", " {\n\t\tposition: relative;\n\t\tmargin: 0 auto ", ";\n\t\tbox-sizing: border-box;\n\n\t\t/**\n     * Fix block top alignment inside table cells.\n     */\n\t\t.decisionItemView-content-wrap:first-of-type > div {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.", "[data-number-column='true'] {\n\t\tpadding-left: ", "px;\n\t\tclear: both;\n\t}\n\n\t.", " {\n\t\twill-change: width, margin-left;\n\t}\n\n\t.", " table {\n\t\twill-change: width;\n\t}\n\n\t.", " > table {\n\t\tmargin: ", " 0 0 0;\n\t}\n\n\t.", " > table,\n\t.", " > table {\n\t\tmargin: ", " ", " 0 0;\n\t}\n\n\t/* support panel nested in table */\n\t", "\n\n\t/* avoid applying styles to nested tables (possible via extensions) */\n\t.", " > table,\n\t.", " > table,\n\t.", " > table {\n\t\tborder-collapse: collapse;\n\t\tborder: ", "px solid\n\t\t\t", ";\n\t\ttable-layout: fixed;\n\t\tfont-size: 1em;\n\t\twidth: 100%;\n\n\t\t&[data-autosize='true'] {\n\t\t\ttable-layout: auto;\n\t\t}\n\n\t\t& {\n\t\t\t* {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t}\n\t\t\thr {\n\t\t\t\tbox-sizing: content-box;\n\t\t\t}\n\n\t\t\ttbody {\n\t\t\t\tborder-bottom: none;\n\t\t\t}\n\t\t\tth td {\n\t\t\t\tbackground-color: ", ";\n\t\t\t}\n\n\t\t\t> tbody > tr > th,\n\t\t\t> tbody > tr > td {\n\t\t\t\tmin-width: ", "px;\n\t\t\t\tfont-weight: ", ";\n\t\t\t\tvertical-align: top;\n\t\t\t\tborder: 1px solid ", ";\n\t\t\t\tborder-right-width: 0;\n\t\t\t\tborder-bottom-width: 0;\n\n\t\t\t\tpadding: ", ";\n\t\t\t\t/* https://stackoverflow.com/questions/7517127/borders-not-shown-in-firefox-with-border-collapse-on-table-position-relative-o */\n\t\t\t\t", "\n\n\t\t\t\t", "\n\n\t\t\t\tth p:not(:first-of-type),\n\t\t\t\ttd p:not(:first-of-type) {\n\t\t\t\t\tmargin-top: ", ";\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t/* Ensures nested tables are compatible with parent table background color - uses specificity to ensure tables nested by extensions are not affected */\n\t\t\t> tbody > tr > td {\n\t\t\t\tbackground-color: ", ";\n\t\t\t}\n\n\t\t\tth {\n\t\t\t\tbackground-color: ", ";\n\t\t\t\ttext-align: left;\n\n\t\t\t\t/* only apply this styling to codeblocks in default background headercells */\n\t\t\t\t/* TODO this needs to be overhauled as it relies on unsafe selectors */\n\t\t\t\t", " {\n\t\t\t\t\t.", ":not(.danger) {\n\t\t\t\t\t\tbackground-color: ", ";\n\n\t\t\t\t\t\t:not(.", ") {\n\t\t\t\t\t\t\tbox-shadow: 0px 0px 0px 1px ", ";\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t.", " {\n\t\t\t\t\t\t\tbackground-image: ", ";\n\n\t\t\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t.", " {\n\t\t\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t/* this is only relevant to the element taken care of by renderer */\n\t\t\t\t\t\t> [data-ds--code--code-block] {\n\t\t\t\t\t\t\tbackground-image: ", "!important;\n\n\t\t\t\t\t\t\tbackground-color: ", "!important;\n\n\t\t\t\t\t\t\t/* selector lives inside @atlaskit/code */\n\t\t\t\t\t\t\t--ds--code--line-number-bg-color: ", ";\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n"])), (0, _tableCell.tableCellBackgroundStyleOverride)(), TableSharedCssClassName.TABLE_CONTAINER, "var(--ds-space-200, 16px)", TableSharedCssClassName.TABLE_CONTAINER, _editorSharedStyles.akEditorTableNumberColumnWidth - 1, TableSharedCssClassName.TABLE_RESIZER_CONTAINER, TableSharedCssClassName.TABLE_RESIZER_CONTAINER, TableSharedCssClassName.TABLE_NODE_WRAPPER, "var(--ds-space-300, 24px)", TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_STICKY_WRAPPER, "var(--ds-space-300, 24px)", "var(--ds-space-100, 8px)", (0, _platformFeatureFlags.fg)('platform_editor_bordered_panel_nested_in_table') ? ".".concat(TableSharedCssClassName.TABLE_NODE_WRAPPER, " .ak-editor-panel {\n\t\t\tborder: ", "var(--ds-border-width, 1px)", " solid ", "var(--ds-border, #d9dbea)", ";\n\t\t}") : '', TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_NODE_WRAPPER, TableSharedCssClassName.TABLE_STICKY_WRAPPER, tableCellBorderWidth, "var(--ds-background-accent-gray-subtler, ".concat(_editorSharedStyles.akEditorTableBorder, ")"), "var(--ds-background-neutral-subtle, white)", tableCellMinWidth, "var(--ds-font-weight-regular, 400)", "var(--ds-background-accent-gray-subtler, ".concat(_editorSharedStyles.akEditorTableBorder, ")"), "var(--ds-space-100, 8px)", _browser.browser.gecko || _browser.browser.ie || _browser.browser.mac && _browser.browser.chrome ? 'background-clip: padding-box;' : '', firstNodeWithNotMarginTop(), "var(--ds-space-150, 12px)", "var(--ds-surface, #FFFFFF)", "var(--ds-background-accent-gray-subtlest, ".concat(_editorSharedStyles.akEditorTableToolbar, ")"), (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? '&:not(.danger)' : '&:not([style]):not(.danger)', _codeBlock.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, "var(--ds-surface-raised, rgb(235, 237, 240))", _editorSharedStyles.akEditorSelectedNodeClassName, "var(--ds-border, transparent)", _codeBlock.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER, (0, _editorSharedStyles.overflowShadow)({
+  var browser = (0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) ? (0, _browser.getBrowserInfo)() : _browser.browser;
+  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Appears safe to auto-fix, but leaving it up to the team to remediate as the readability only gets worse with autofixing
+  return (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n\t\t", "\n\t\t.", " {\n\t\t\tposition: relative;\n\t\t\tmargin: 0 auto ", ";\n\t\t\tbox-sizing: border-box;\n\n\t\t\t/**\n     * Fix block top alignment inside table cells.\n     */\n\t\t\t.decisionItemView-content-wrap:first-of-type > div {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\t\t.", "[data-number-column='true'] {\n\t\t\tpadding-left: ", "px;\n\t\t\tclear: both;\n\t\t}\n\n\t\t.", " {\n\t\t\twill-change: width, margin-left;\n\t\t}\n\n\t\t.", " table {\n\t\t\twill-change: width;\n\t\t}\n\n\t\t.", " > table {\n\t\t\tmargin: ", " 0 0 0;\n\t\t}\n\n\t\t.", " > table,\n\t\t.", " > table {\n\t\t\tmargin: ", " ", " 0 0;\n\t\t}\n\n\t\t/* support panel nested in table */\n\t\t", "\n\n\t\t/* avoid applying styles to nested tables (possible via extensions) */\n\t.", " > table,\n\t.", " > table,\n\t.", " > table {\n\t\t\tborder-collapse: collapse;\n\t\t\tborder: ", "px solid\n\t\t\t\t", ";\n\t\t\ttable-layout: fixed;\n\t\t\tfont-size: 1em;\n\t\t\twidth: 100%;\n\n\t\t\t&[data-autosize='true'] {\n\t\t\t\ttable-layout: auto;\n\t\t\t}\n\n\t\t\t& {\n\t\t\t\t* {\n\t\t\t\t\tbox-sizing: border-box;\n\t\t\t\t}\n\t\t\t\thr {\n\t\t\t\t\tbox-sizing: content-box;\n\t\t\t\t}\n\n\t\t\t\ttbody {\n\t\t\t\t\tborder-bottom: none;\n\t\t\t\t}\n\t\t\t\tth td {\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t}\n\n\t\t\t\t> tbody > tr > th,\n\t\t\t\t> tbody > tr > td {\n\t\t\t\t\tmin-width: ", "px;\n\t\t\t\t\tfont-weight: ", ";\n\t\t\t\t\tvertical-align: top;\n\t\t\t\t\tborder: 1px solid ", ";\n\t\t\t\t\tborder-right-width: 0;\n\t\t\t\t\tborder-bottom-width: 0;\n\n\t\t\t\t\tpadding: ", ";\n\t\t\t\t\t/* https://stackoverflow.com/questions/7517127/borders-not-shown-in-firefox-with-border-collapse-on-table-position-relative-o */\n\t\t\t\t\t", "\n\n\t\t\t\t\t", "\n\n\t\t\t\tth p:not(:first-of-type),\n\t\t\t\ttd p:not(:first-of-type) {\n\t\t\t\t\t\tmargin-top: ", ";\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t/* Ensures nested tables are compatible with parent table background color - uses specificity to ensure tables nested by extensions are not affected */\n\t\t\t\t> tbody > tr > td {\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t}\n\n\t\t\t\tth {\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\ttext-align: left;\n\n\t\t\t\t\t/* only apply this styling to codeblocks in default background headercells */\n\t\t\t\t\t/* TODO this needs to be overhauled as it relies on unsafe selectors */\n\t\t\t\t\t", " {\n\t\t\t\t\t\t.", ":not(.danger) {\n\t\t\t\t\t\t\tbackground-color: ", ";\n\n\t\t\t\t\t\t\t:not(.", ") {\n\t\t\t\t\t\t\t\tbox-shadow: 0px 0px 0px 1px ", ";\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t.", " {\n\t\t\t\t\t\t\t\tbackground-image: ", ";\n\n\t\t\t\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t.", " {\n\t\t\t\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t/* this is only relevant to the element taken care of by renderer */\n\t\t\t\t\t\t\t> [data-ds--code--code-block] {\n\t\t\t\t\t\t\t\tbackground-image: ", "!important;\n\n\t\t\t\t\t\t\t\tbackground-color: ", "!important;\n\n\t\t\t\t\t\t\t\t/* selector lives inside @atlaskit/code */\n\t\t\t\t\t\t\t\t--ds--code--line-number-bg-color: ", ";\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t"])), (0, _tableCell.tableCellBackgroundStyleOverride)(), TableSharedCssClassName.TABLE_CONTAINER, "var(--ds-space-200, 16px)", TableSharedCssClassName.TABLE_CONTAINER, _editorSharedStyles.akEditorTableNumberColumnWidth - 1, TableSharedCssClassName.TABLE_RESIZER_CONTAINER, TableSharedCssClassName.TABLE_RESIZER_CONTAINER, TableSharedCssClassName.TABLE_NODE_WRAPPER, "var(--ds-space-300, 24px)", TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_STICKY_WRAPPER, "var(--ds-space-300, 24px)", "var(--ds-space-100, 8px)", (0, _platformFeatureFlags.fg)('platform_editor_bordered_panel_nested_in_table') ? ".".concat(TableSharedCssClassName.TABLE_NODE_WRAPPER, " .ak-editor-panel {\n\t\t\tborder: ", "var(--ds-border-width, 1px)", " solid ", "var(--ds-border, #d9dbea)", ";\n\t\t}") : '', TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_NODE_WRAPPER, TableSharedCssClassName.TABLE_STICKY_WRAPPER, tableCellBorderWidth, "var(--ds-background-accent-gray-subtler, ".concat(_editorSharedStyles.akEditorTableBorder, ")"), "var(--ds-background-neutral-subtle, white)", tableCellMinWidth, "var(--ds-font-weight-regular, 400)", "var(--ds-background-accent-gray-subtler, ".concat(_editorSharedStyles.akEditorTableBorder, ")"), "var(--ds-space-100, 8px)", browser.gecko || browser.ie || browser.mac && browser.chrome ? 'background-clip: padding-box;' : '', firstNodeWithNotMarginTop(), "var(--ds-space-150, 12px)", "var(--ds-surface, #FFFFFF)", "var(--ds-background-accent-gray-subtlest, ".concat(_editorSharedStyles.akEditorTableToolbar, ")"), (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? '&:not(.danger)' : '&:not([style]):not(.danger)', _codeBlock.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, "var(--ds-surface-raised, rgb(235, 237, 240))", _editorSharedStyles.akEditorSelectedNodeClassName, "var(--ds-border, transparent)", _codeBlock.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER, (0, _editorSharedStyles.overflowShadow)({
     leftCoverWidth: "var(--ds-space-300, 24px)"
   }), "var(--ds-background-neutral, rgb(235, 237, 240))", _codeBlock.CodeBlockSharedCssClassName.CODEBLOCK_LINE_NUMBER_GUTTER, "var(--ds-background-neutral, rgb(226, 229, 233))", (0, _editorSharedStyles.overflowShadow)({
     leftCoverWidth: "var(--ds-space-300, 24px)"

package/dist/cjs/sync-block.js

@@ -9,11 +9,4 @@ Object.defineProperty(exports, "SyncBlockSharedCssClassName", {
     return _syncBlock.SyncBlockSharedCssClassName;
   }
 });
-Object.defineProperty(exports, "SyncBlockStoreManager", {
-  enumerable: true,
-  get: function get() {
-    return _index.SyncBlockStoreManager;
-  }
-});
-var _syncBlock = require("./styles/shared/sync-block");
-var _index = require("./sync-block/index");
+var _syncBlock = require("./styles/shared/sync-block");

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

@@ -24,7 +24,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 = "109.14.1";
+var packageVersion = "109.15.1";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var fadeIn = (0, _react2.keyframes)({

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

@@ -14,7 +14,8 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
 var _react2 = require("@emotion/react");
-var _utils = require("../../utils");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
+var _browser = require("../../utils/browser");
 var _styles = require("./styles");
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
@@ -173,11 +174,12 @@ var PanelTextInput = exports.default = /*#__PURE__*/function (_PureComponent) {
     // Ignored via go/ees005
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     function isUndoEvent(event) {
+      var browser = (0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) ? (0, _browser.getBrowserInfo)() : _browser.browser;
       return event.keyCode === KeyZCode && (
       // cmd + z for mac
-      _utils.browser.mac && event.metaKey && !event.shiftKey ||
+      browser.mac && event.metaKey && !event.shiftKey ||
       // ctrl + z for non-mac
-      !_utils.browser.mac && event.ctrlKey);
+      !browser.mac && event.ctrlKey);
     }
 
     // Ignored via go/ees005
@@ -185,9 +187,10 @@ var PanelTextInput = exports.default = /*#__PURE__*/function (_PureComponent) {
   }, {
     key: "isRedoEvent",
     value: function isRedoEvent(event) {
+      var browser = (0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) ? (0, _browser.getBrowserInfo)() : _browser.browser;
       return (
         // ctrl + y for non-mac
-        !_utils.browser.mac && event.ctrlKey && event.keyCode === KeyYCode || _utils.browser.mac && event.metaKey && event.shiftKey && event.keyCode === KeyZCode || event.ctrlKey && event.shiftKey && event.keyCode === KeyZCode
+        !browser.mac && event.ctrlKey && event.keyCode === KeyYCode || browser.mac && event.metaKey && event.shiftKey && event.keyCode === KeyZCode || event.ctrlKey && event.shiftKey && event.keyCode === KeyZCode
       );
     }
   }]);

package/dist/cjs/utils/browser.js

@@ -104,6 +104,42 @@ var getSecondMatch = function getSecondMatch(regexp, ua) {
   return match && match.length > 0 && match[2] || '';
 };
 
+// Helper functions to safely access browser properties
+var getSafeUserAgent = function getSafeUserAgent() {
+  var _window$navigator;
+  if (typeof window === 'undefined') {
+    return undefined;
+  }
+
+  // Check for SSR user agent first
+  if (process.env.REACT_SSR) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    var ssrUserAgent = window.__SSR_USER_AGENT__;
+    if (ssrUserAgent) {
+      return ssrUserAgent;
+    }
+  }
+
+  // Fallback to navigator.userAgent with proper null checking
+  return (_window$navigator = window.navigator) === null || _window$navigator === void 0 ? void 0 : _window$navigator.userAgent;
+};
+var getSafePlatform = function getSafePlatform() {
+  var _window$navigator2;
+  if (typeof window === 'undefined') {
+    return undefined;
+  }
+  return (_window$navigator2 = window.navigator) === null || _window$navigator2 === void 0 ? void 0 : _window$navigator2.platform;
+};
+var hasIntersectionObserver = function hasIntersectionObserver() {
+  return typeof window !== 'undefined' && 'IntersectionObserver' in window && 'IntersectionObserverEntry' in window &&
+  // Ignored via go/ees005
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  'intersectionRatio' in window.IntersectionObserverEntry.prototype;
+};
+var hasResizeObserver = function hasResizeObserver() {
+  return typeof window !== 'undefined' && 'ResizeObserver' in window && 'ResizeObserverEntry' in window;
+};
+
 // New API to get the browser info on demand
 var getBrowserInfo = exports.getBrowserInfo = (0, _memoizeOne.default)(function () {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -124,9 +160,8 @@ var getBrowserInfo = exports.getBrowserInfo = (0, _memoizeOne.default)(function
     supportsIntersectionObserver: false,
     supportsResizeObserver: false
   };
-  var userAgent = process.env.REACT_SSR ?
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  window.__SSR_USER_AGENT__ : navigator.userAgent;
+  var userAgent = getSafeUserAgent();
+  var platform = getSafePlatform();
   if (userAgent) {
     // inspired from https://github.com/bowser-js/bowser/blob/master/src/parser-browsers.js
     // Ignored via go/ees005
@@ -137,9 +172,11 @@ var getBrowserInfo = exports.getBrowserInfo = (0, _memoizeOne.default)(function
     // eslint-disable-next-line require-unicode-regexp
     var internetExplorer = /msie|trident/i.test(userAgent);
 
+    // Ideally we should use userAgent instead of platform, but we have lots of keymap tests failure when we change it
+    // So leave it as is for now.
     // Ignored via go/ees005
     // eslint-disable-next-line require-unicode-regexp
-    result.mac = /macintosh/i.test(userAgent);
+    result.mac = platform && /Mac/.test(platform);
 
     // Previously relied on navigator.userAgentData?.platform and userAgent, now used only userAgent
     result.windows =
@@ -194,11 +231,8 @@ var getBrowserInfo = exports.getBrowserInfo = (0, _memoizeOne.default)(function
     // Previously we relied on documentElement.style.WebkitAppearance, now changed to userAgent
     // eslint-disable-next-line require-unicode-regexp
     result.webkit = /(apple)?webkit/i.test(userAgent);
-    result.supportsIntersectionObserver = typeof window !== 'undefined' && 'IntersectionObserver' in window && 'IntersectionObserverEntry' in window &&
-    // Ignored via go/ees005
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    'intersectionRatio' in window.IntersectionObserverEntry.prototype;
-    result.supportsResizeObserver = typeof window !== 'undefined' && 'ResizeObserver' in window && 'ResizeObserverEntry' in window;
+    result.supportsIntersectionObserver = hasIntersectionObserver();
+    result.supportsResizeObserver = hasResizeObserver();
   }
   return result;
 });

package/dist/cjs/utils/commands.js

@@ -309,9 +309,19 @@ var isEmptySelectionAtStart = exports.isEmptySelectionAtStart = function isEmpty
     // Else, check if the parent is a blockTaskItem
     else if ($from.parent.type === blockTaskItem) {
       // Check if the selection is at the start of the blockTaskItem
-      var blockTaskItemDepth = $from.depth - 1;
-      var DISTANCE_FROM_PARENT_FOR_GAP_CURSOR = 1;
-      var firstPosInBlockTaskItem = $from.start(blockTaskItemDepth) + DISTANCE_FROM_PARENT_FOR_GAP_CURSOR;
+      var firstPosInBlockTaskItem = 0;
+      if ((0, _platformFeatureFlags.fg)('platform_editor_blocktaskitem_patch_2')) {
+        var blockTaskItemDepth = $from.depth;
+
+        // When cleaning up platform_editor_blocktaskitem_patch_2, set firstPosInBlockTaskItem as const
+        firstPosInBlockTaskItem = $from.start(blockTaskItemDepth);
+      } else {
+        var _blockTaskItemDepth = $from.depth - 1;
+        var DISTANCE_FROM_PARENT_FOR_GAP_CURSOR = 1;
+        firstPosInBlockTaskItem = $from.start(_blockTaskItemDepth) + DISTANCE_FROM_PARENT_FOR_GAP_CURSOR;
+      }
+
+      // Is the selection at the first possible position inside the blockTaskItem
       return $from.pos === firstPosInBlockTaskItem;
     }
   }

package/dist/cjs/utils/validator.js

@@ -10,6 +10,7 @@ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers
 var _adfSchema = require("@atlaskit/adf-schema");
 var _schemaDefault = require("@atlaskit/adf-schema/schema-default");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 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 ADFStages = exports.ADFStages = {
@@ -850,6 +851,18 @@ var getValidNode = exports.getValidNode = function getValidNode(originalNode) {
             marks: marks
           };
         }
+      case 'syncBlock':
+        {
+          if (adfStage === 'stage0' && (0, _expValEquals.expValEquals)('platform_synced_block', 'isEnabled', true)) {
+            return {
+              type: type,
+              attrs: attrs,
+              marks: marks
+            };
+          } else {
+            return getValidUnknownNode(node);
+          }
+        }
     }
   }
   return getValidUnknownNode(node);

package/dist/es2019/copy-button/index.js

@@ -1,8 +1,9 @@
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfType, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { copyHTMLToClipboard, copyHTMLToClipboardPolyfill } from '../clipboard';
-import { browser } from '../utils';
+import { browser as browserLegacy, getBrowserInfo } from '../utils/browser';
 export function getSelectedNodeOrNodeParentByNodeType({
   nodeType,
   selection
@@ -21,6 +22,7 @@ export const copyDomNode = (domNode, nodeType, selection) => {
     const div = document.createElement('div');
     div.appendChild(domNode);
     const schema = selection.$from.doc.type.schema;
+    const browser = expValEquals('platform_editor_hydratable_ui', 'isEnabled', true) ? getBrowserInfo() : browserLegacy;
 
     // if copying inline content
     if (nodeType.inlineContent) {

package/dist/es2019/keymaps/index.js

@@ -7,8 +7,9 @@ import React, { Fragment } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { base, keyName } from 'w3c-keyname';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorCommandToPMCommand } from '../preset/editor-commands';
-import { browser } from '../utils';
+import { browser as browserLegacy, getBrowserInfo } from '../utils/browser';
 export const addAltText = makeKeyMapWithCommon('Add Alt Text', 'Mod-Alt-y');
 export const navToEditorToolbar = makeKeyMapWithCommon('Navigate to editor toolbar', 'Alt-F9');
 export const navToFloatingToolbar = makeKeyMapWithCommon('Navigate to floating toolbar', 'Alt-F10');
@@ -123,6 +124,7 @@ const tooltipShortcutStyle = css({
 });
 export function formatShortcut(keymap) {
   let shortcut;
+  const browser = expValEquals('platform_editor_hydratable_ui', 'isEnabled', true) ? getBrowserInfo() : browserLegacy;
   if (browser.mac) {
     // for reference: https://wincent.com/wiki/Unicode_representations_of_modifier_keys
     shortcut = keymap.mac
@@ -201,6 +203,7 @@ export function findShortcutByDescription(description) {
   return;
 }
 export function findShortcutByKeymap(keymap) {
+  const browser = expValEquals('platform_editor_hydratable_ui', 'isEnabled', true) ? getBrowserInfo() : browserLegacy;
   if (browser.mac) {
     return keymap.mac;
   }
@@ -208,6 +211,7 @@ export function findShortcutByKeymap(keymap) {
 }
 export function getAriaKeyshortcuts(keymap) {
   let keyShortcuts;
+  const browser = expValEquals('platform_editor_hydratable_ui', 'isEnabled', true) ? getBrowserInfo() : browserLegacy;
   if (typeof keymap === 'string') {
     keyShortcuts = keymap;
   } else if (typeof keymap === 'object') {
@@ -298,6 +302,7 @@ export function bindKeymapWithEditorCommand(shortcut, cmd, keymap) {
 }
 export function findKeyMapForBrowser(keyMap) {
   if (keyMap) {
+    const browser = expValEquals('platform_editor_hydratable_ui', 'isEnabled', true) ? getBrowserInfo() : browserLegacy;
     if (browser.mac) {
       return keyMap.mac;
     }

package/dist/es2019/link/LinkPicker/HyperlinkAddToolbar/HyperlinkAddToolbar.js

@@ -22,7 +22,8 @@ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import Tooltip from '@atlaskit/tooltip';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, fireAnalyticsEvent, INPUT_METHOD } from '../../../analytics';
 import { Announcer, PanelTextInput } from '../../../ui';
-import { browser, normalizeUrl } from '../../../utils';
+import { normalizeUrl } from '../../../utils';
+import { browser as browserLegacy, getBrowserInfo } from '../../../utils/browser';
 import LinkSearchList, { LinkSearchListNext } from '../../LinkSearch/LinkSearchList';
 import { container, containerWithProvider, inputWrapper } from '../../LinkSearch/ToolbarComponents';
 import { transformTimeStamp } from '../../LinkSearch/transformTimeStamp';
@@ -729,6 +730,7 @@ export class HyperlinkLinkAddToolbar extends PureComponent {
     const ariaActiveDescendant = selectedIndex > -1 ? `link-search-list-item-${selectedIndex}` : '';
     const linkSearchInputId = 'search-recent-links-field-id';
     const displayTextInputId = 'display-text-filed-id';
+    const browser = expValEquals('platform_editor_hydratable_ui', 'isEnabled', true) ? getBrowserInfo() : browserLegacy;
     // Added workaround with a screen reader Announcer specifically for VoiceOver + Safari
     // as the Aria design pattern for combobox does not work in this case
     // for details: https://a11y-internal.atlassian.net/browse/AK-740

package/dist/es2019/monitoring/error.js

@@ -1,7 +1,7 @@
 import { isFedRamp } from './environment';
 const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-const packageVersion = "109.14.1";
+const packageVersion = "109.15.1";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/es2019/resizer/BreakoutResizer.js

@@ -2,10 +2,11 @@ import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useSta
 import { bind, bindAll } from 'bind-event-listener';
 import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../analytics';
 import { LAYOUT_COLUMN_PADDING, LAYOUT_SECTION_MARGIN } from '../styles';
-import { browser } from '../utils/browser';
+import { browser as browserLegacy, getBrowserInfo } from '../utils/browser';
 import Resizer from './Resizer';
 import { ResizerBreakoutModeLabel } from './ResizerBreakoutModeLabel';
 import { SNAP_GAP, useBreakoutGuidelines } from './useBreakoutGuidelines';
@@ -129,6 +130,7 @@ const BreakoutResizer = ({
     guidelines,
     setCurrentWidth
   } = useBreakoutGuidelines(getEditorWidth, isResizing && editorExperiment('single_column_layouts', true), dynamicFullWidthGuidelineOffset);
+  const browser = expValEquals('platform_editor_hydratable_ui', 'isEnabled', true) ? getBrowserInfo() : browserLegacy;
   useEffect(() => {
     if (displayGuidelines) {
       displayGuidelines(guidelines || []);
@@ -271,7 +273,7 @@ const BreakoutResizer = ({
     } else if (!areResizeMetaKeysPressed.current) {
       handleEscape();
     }
-  }, [handleEscape, handleLayoutSizeChangeOnKeypress]);
+  }, [handleEscape, handleLayoutSizeChangeOnKeypress, browser]);
   const resizeHandleKeyUpHandler = useCallback(event => {
     if (event.altKey || event.metaKey) {
       areResizeMetaKeysPressed.current = false;
@@ -297,7 +299,7 @@ const BreakoutResizer = ({
         inline: 'nearest'
       });
     }
-  }, [resizerRef]);
+  }, [resizerRef, browser]);
   useLayoutEffect(() => {
     if (!resizerRef.current || !editorView) {
       return;