@atlaskit/renderer 149.0.4 → 149.0.6

package/dist/cjs/react/nodes/mention.js

@@ -1,12 +1,13 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _mention = require("@atlaskit/editor-common/mention");
+var _uiMention = _interopRequireDefault(require("@atlaskit/editor-common/ui-mention"));
 var _fg = require("@atlaskit/platform-feature-flags/fg");
 var _useInlineAnnotationProps = require("../../ui/annotations/element/useInlineAnnotationProps");
 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); }
@@ -25,7 +26,7 @@ var _default_1 = /*#__PURE__*/(0, _react.memo)(function MentionItem(props) {
       /*#__PURE__*/
       // Ignored via go/ees005
       // eslint-disable-next-line react/jsx-props-no-spreading
-      _react.default.createElement("span", inlineAnnotationProps, /*#__PURE__*/_react.default.createElement(_mention.Mention, {
+      _react.default.createElement("span", inlineAnnotationProps, /*#__PURE__*/_react.default.createElement(_uiMention.default, {
         id: id,
         text: text,
         accessLevel: accessLevel,
@@ -37,7 +38,7 @@ var _default_1 = /*#__PURE__*/(0, _react.memo)(function MentionItem(props) {
       }))
     );
   }
-  return /*#__PURE__*/_react.default.createElement(_mention.Mention, {
+  return /*#__PURE__*/_react.default.createElement(_uiMention.default, {
     id: id,
     text: text,
     accessLevel: accessLevel,

package/dist/cjs/react/nodes/multiBodiedExtension/actions.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useMultiBodiedExtensionActions = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _analytics = require("@atlaskit/editor-common/analytics");
+var _enums = require("@atlaskit/editor-common/analytics/types/enums");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var useMultiBodiedExtensionActions = exports.useMultiBodiedExtensionActions = function useMultiBodiedExtensionActions(_ref) {
   var updateActiveChild = _ref.updateActiveChild,
@@ -27,13 +27,13 @@ var useMultiBodiedExtensionActions = exports.useMultiBodiedExtensionActions = fu
         updateActiveChild(index);
         if ((0, _expValEquals.expValEquals)('confluence_native_tabs_experiment', 'isEnabled', true)) {
           fireAnalyticsEvent === null || fireAnalyticsEvent === void 0 || fireAnalyticsEvent({
-            action: _analytics.ACTION.CHANGE_ACTIVE,
-            actionSubject: _analytics.ACTION_SUBJECT.MULTI_BODIED_EXTENSION,
+            action: _enums.ACTION.CHANGE_ACTIVE,
+            actionSubject: _enums.ACTION_SUBJECT.MULTI_BODIED_EXTENSION,
             attributes: {
               extensionType: extensionType,
               extensionKey: extensionKey
             },
-            eventType: _analytics.EVENT_TYPE.TRACK
+            eventType: _enums.EVENT_TYPE.TRACK
           });
         }
         return true;

package/dist/cjs/react/nodes/multiBodiedExtension/context.js

@@ -8,9 +8,9 @@ exports.useMultiBodiedExtensionContext = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireDefault(require("react"));
 var _memoizeOne = _interopRequireDefault(require("memoize-one"));
-var _extensions = require("@atlaskit/editor-common/extensions");
-var _providerFactory = require("@atlaskit/editor-common/provider-factory");
-var _utils = require("@atlaskit/editor-common/utils");
+var _extensionHandlers = require("@atlaskit/editor-common/extensions/extension-handlers");
+var _context = require("@atlaskit/editor-common/provider-factory/context");
+var _extensionHandler = require("@atlaskit/editor-common/utils/extension-handler");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var getExtensionHandlerNode = function getExtensionHandlerNode(extensionHandler) {
   return function (_ref) {
@@ -26,7 +26,7 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
     extensionKey = _ref2.extensionKey;
   var isMounted = _react.default.useRef(true);
   var localGetNodeRenderer = _react.default.useMemo(function () {
-    return (0, _memoizeOne.default)(_extensions.getNodeRenderer);
+    return (0, _memoizeOne.default)(_extensionHandlers.getNodeRenderer);
   }, []);
   var _React$useState = _react.default.useState(),
     _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
@@ -37,9 +37,9 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
     _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
     privateProps = _React$useState4[0],
     setPrivateProps = _React$useState4[1];
-  var providerPromise = (0, _providerFactory.useProvider)('extensionProvider');
+  var providerPromise = (0, _context.useProvider)('extensionProvider');
   var ExtensionHandlerNode = _react.default.useMemo(function () {
-    var extensionHandler = extensionHandlers && extensionHandlers[extensionType] && (0, _utils.getExtensionRenderer)(extensionHandlers[extensionType]);
+    var extensionHandler = extensionHandlers && extensionHandlers[extensionType] && (0, _extensionHandler.getExtensionRenderer)(extensionHandlers[extensionType]);
     if (extensionHandler) {
       return getExtensionHandlerNode(extensionHandler);
     }
@@ -51,7 +51,7 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
         if (isMounted.current) {
           setProvider(p);
         }
-        return (0, _extensions.getExtensionModuleNodePrivateProps)(p, extensionType, extensionKey);
+        return (0, _extensionHandlers.getExtensionModuleNodePrivateProps)(p, extensionType, extensionKey);
       }).then(function (pr) {
         if (isMounted.current) {
           setPrivateProps(pr);

package/dist/cjs/react/nodes/nodes.js

@@ -5,7 +5,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.nodes = void 0;
-var _ui = require("@atlaskit/editor-common/ui");
+var _UnsupportedBlock = _interopRequireDefault(require("@atlaskit/editor-common/UnsupportedBlock"));
+var _UnsupportedInline = _interopRequireDefault(require("@atlaskit/editor-common/UnsupportedInline"));
 var _Expand = _interopRequireDefault(require("../../ui/Expand"));
 var _blockCard = _interopRequireDefault(require("./blockCard"));
 var _blockquote = _interopRequireDefault(require("./blockquote"));
@@ -98,7 +99,7 @@ var nodes = exports.nodes = {
   taskItem: _taskItem.default,
   taskList: _taskList.default,
   unknownBlock: _unknownBlock.default,
-  unsupportedBlock: _ui.UnsupportedBlock,
-  unsupportedInline: _ui.UnsupportedInline,
+  unsupportedBlock: _UnsupportedBlock.default,
+  unsupportedInline: _UnsupportedInline.default,
   windowedCodeBlock: _windowedCodeBlock.default
 };

package/dist/cjs/react/nodes/orderedList.js

@@ -8,21 +8,22 @@ exports.default = OrderedList;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _orderedList = require("@atlaskit/adf-schema/ordered-list");
-var _styles = require("@atlaskit/editor-common/styles");
+var _lists = require("@atlaskit/editor-common/styles/lists");
 var _utils = require("@atlaskit/editor-common/utils");
-var _lists = require("../utils/lists");
+var _list = require("@atlaskit/editor-common/utils/list");
+var _lists2 = require("../utils/lists");
 function OrderedList(props) {
   var _props$getContent;
   var extraProps = {};
 
   // Item count drives the marker column width, so losing it narrows the gutter by a digit.
   var itemsCount = (_props$getContent = props.getContent) === null || _props$getContent === void 0 || (_props$getContent = _props$getContent.call(props)) === null || _props$getContent === void 0 ? void 0 : _props$getContent.length;
-  var itemCounterDigitsSize = (0, _utils.getItemCounterDigitsSize)({
+  var itemCounterDigitsSize = (0, _list.getItemCounterDigitsSize)({
     order: props.order,
     itemsCount: itemsCount
   });
   if (itemCounterDigitsSize && itemCounterDigitsSize > 1) {
-    extraProps.style = (0, _styles.getOrderedListInlineStyles)(itemCounterDigitsSize, 'object');
+    extraProps.style = (0, _lists.getOrderedListInlineStyles)(itemCounterDigitsSize, 'object');
   }
   if (props.order !== undefined) {
     extraProps.start = (0, _utils.resolveOrder)(props.order);
@@ -31,7 +32,7 @@ function OrderedList(props) {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: _orderedList.orderedListSelector.substr(1),
     "data-local-id": props.localId,
-    "data-indent-level": props.path ? (0, _lists.getListIndentLevel)(props.path) : 1,
+    "data-indent-level": props.path ? (0, _lists2.getListIndentLevel)(props.path) : 1,
     start: props.start
     // Ignored via go/ees005
     // eslint-disable-next-line react/jsx-props-no-spreading

package/dist/cjs/react/nodes/panel-compiled.js

@@ -13,7 +13,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
 var _panel = require("@atlaskit/adf-schema/panel");
-var _editorPalette = require("@atlaskit/editor-palette");
+var _background = require("@atlaskit/editor-palette/background");
 var _consts = require("@atlaskit/editor-shared-styles/consts");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _excluded = ["backgroundColor", "children", "className", "hasIcon"];
@@ -44,7 +44,7 @@ var PanelStyledCompiled = exports.PanelStyledCompiled = function PanelStyledComp
     className = _ref.className,
     hasIcon = _ref.hasIcon,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var customBackgroundColor = backgroundColor ? (0, _editorPalette.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : undefined;
+  var customBackgroundColor = backgroundColor ? (0, _background.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : undefined;
   return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, props, {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- intentional: preserve existing PanelSharedCssClassName.prefix class
     className: (0, _runtime.ax)(["_lklzfajl _imyb1bbz _50vakb7n _19agidpf _1q6xf1ug _jde2v77o _1bi2v77o _gb1eidpf _11k7idpf _fc9iidpf _1554u2gc _1eiopxbi _1w22u2gc _66ohu2gc _1it3jmsf _19s71txw _18w0h2mm _13n84jg8 _6qwr1hna _ujht1s93 _iqv91kw7 _1l9midpf _1v1c1ejb _11wb1ejb _1oah1ntv _1pciu2gc _1cgk1h6o _5zphglyw _wz94glyw _zs6jglyw _1n3wglyw _1yw1vq3b _1h33yhbg _1a3fnkob _1uvd116y _1hauowts _7c6p1t9x _udsa1o8l _nlelp2ly _18y8qm1h _e5ovn729 _g8a34pcx _1g6dibhp _1udservl _15sp1vk5 _1fe7s4qr _s4ldn729 _gt7x4pcx", (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) && "_niep1s93 _a9e5p2ly _giv8n729 _vy90n729 _eba1ibhp _18hz1vk5 _93eu1aok", (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) && "_19mdyhbg", !hasIcon && "_1whxutpp _1b0jutpp", props['data-panel-type'] === _panel.PanelType.CUSTOM && backgroundColor && "_122m1aok", "_9dunutpp _pzbautpp", "_1wvnia51", className]),

package/dist/cjs/react/nodes/panel-emotion.js

@@ -10,7 +10,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _panel = require("@atlaskit/adf-schema/panel");
-var _editorPalette = require("@atlaskit/editor-palette");
+var _background = require("@atlaskit/editor-palette/background");
 var _consts = require("@atlaskit/editor-shared-styles/consts");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _excluded = ["backgroundColor", "hasIcon"];
@@ -205,7 +205,7 @@ var PanelStyledEmotion = exports.PanelStyledEmotion = function PanelStyledEmotio
   var backgroundColor = _ref.backgroundColor,
     hasIcon = _ref.hasIcon,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var customBackgroundColor = backgroundColor ? (0, _editorPalette.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : undefined;
+  var customBackgroundColor = backgroundColor ? (0, _background.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : undefined;
   return (0, _react2.jsx)("div", (0, _extends2.default)({
     style:
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop

package/dist/cjs/react/nodes/panel.js

@@ -7,8 +7,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _panel = require("@atlaskit/adf-schema/panel");
-var _icons = require("@atlaskit/editor-common/icons");
-var _panel2 = require("@atlaskit/editor-common/panel");
+var _PanelErrorIcon = require("@atlaskit/editor-common/icons/PanelErrorIcon");
+var _PanelInfoIcon = require("@atlaskit/editor-common/icons/PanelInfoIcon");
+var _PanelNoteIcon = require("@atlaskit/editor-common/icons/PanelNoteIcon");
+var _PanelSuccessIcon = require("@atlaskit/editor-common/icons/PanelSuccessIcon");
+var _PanelWarningIcon = require("@atlaskit/editor-common/icons/PanelWarningIcon");
+var _panel2 = require("@atlaskit/editor-common/styles/panel");
 var _emoji = _interopRequireDefault(require("@atlaskit/icon/core/emoji"));
 var _lightbulb = _interopRequireDefault(require("@atlaskit/icon/core/lightbulb"));
 var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
@@ -17,12 +21,12 @@ var _emoji2 = _interopRequireDefault(require("./emoji"));
 var _panelCompiled = require("./panel-compiled");
 var _panelEmotion = require("./panel-emotion");
 var panelIcons = {
-  info: _icons.PanelInfoIcon,
-  success: _icons.PanelSuccessIcon,
-  note: _icons.PanelNoteIcon,
+  info: _PanelInfoIcon.PanelInfoIcon,
+  success: _PanelSuccessIcon.PanelSuccessIcon,
+  note: _PanelNoteIcon.PanelNoteIcon,
   tip: _lightbulb.default,
-  warning: _icons.PanelWarningIcon,
-  error: _icons.PanelErrorIcon,
+  warning: _PanelWarningIcon.PanelWarningIcon,
+  error: _PanelErrorIcon.PanelErrorIcon,
   custom: _emoji.default
 };
 var PanelStyledMigration = (0, _componentWithCondition.componentWithCondition)(function () {

package/dist/cjs/react/nodes/table/colgroup.js

@@ -9,9 +9,9 @@ exports.colWidthSum = exports.Colgroup = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _nodeWidth = require("@atlaskit/editor-common/node-width");
-var _styles = require("@atlaskit/editor-common/styles");
-var _ui = require("@atlaskit/editor-common/ui");
-var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _table = require("@atlaskit/editor-common/styles/table");
+var _WidthProvider = require("@atlaskit/editor-common/WidthProvider");
+var _constants = require("@atlaskit/editor-shared-styles/constants");
 var _rendererContext = require("../../../renderer-context");
 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); }
 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; }
@@ -41,13 +41,13 @@ var fixColumnWidth = function fixColumnWidth(_ref) {
   // We scale up the columns to meet the minimum of the table layout.
   if (zeroWidthColumnsCount === 0 && scaleDownPercent) {
     var scaled = Math.floor((1 - scaleDownPercent) * columnWidth);
-    return skipMinWidth ? scaled : Math.max(scaled, _styles.tableCellMinWidth);
+    return skipMinWidth ? scaled : Math.max(scaled, _table.tableCellMinWidth);
   }
-  var adjusted = columnWidth - _styles.tableCellBorderWidth;
+  var adjusted = columnWidth - _table.tableCellBorderWidth;
   if (skipMinWidth) {
     return adjusted;
   }
-  return Math.max(adjusted, zeroWidthColumnsCount ? _editorSharedStyles.akEditorTableLegacyCellMinWidth : _styles.tableCellMinWidth);
+  return Math.max(adjusted, zeroWidthColumnsCount ? _constants.akEditorTableLegacyCellMinWidth : _table.tableCellMinWidth);
 };
 var calcScalePercent = function calcScalePercent(_ref2) {
   var renderWidth = _ref2.renderWidth,
@@ -57,7 +57,7 @@ var calcScalePercent = function calcScalePercent(_ref2) {
   var noNumColumnScalePercent = renderWidth / tableWidth;
   // when numbered column is enabled, we need to calculate the scale percent without the akEditorTableNumberColumnWidth
   // As numbered column width is not scaled down
-  var numColumnScalePercent = (renderWidth - _editorSharedStyles.akEditorTableNumberColumnWidth) / (tableWidth - _editorSharedStyles.akEditorTableNumberColumnWidth);
+  var numColumnScalePercent = (renderWidth - _constants.akEditorTableNumberColumnWidth) / (tableWidth - _constants.akEditorTableNumberColumnWidth);
   var diffPercent = 1 - noNumColumnScalePercent;
   return diffPercent < maxScale ? isNumberColumnEnabled ? 1 - numColumnScalePercent : diffPercent : maxScale;
 };
@@ -71,7 +71,7 @@ var colWidthSum = exports.colWidthSum = function colWidthSum(columnWidths) {
  * Returns the data-column available width: total width minus the fixed number column if enabled.
  */
 var getDataColumnWidth = function getDataColumnWidth(totalWidth, isNumberColumnEnabled) {
-  return isNumberColumnEnabled ? totalWidth - _editorSharedStyles.akEditorTableNumberColumnWidth : totalWidth;
+  return isNumberColumnEnabled ? totalWidth - _constants.akEditorTableNumberColumnWidth : totalWidth;
 };
 
 /**
@@ -85,15 +85,15 @@ var scaleColumnsToWidth = function scaleColumnsToWidth(columnWidths, availableWi
   }, 0);
   var scaleFactor = availableWidth / rawTotalWidth;
   var scaledWidths = columnWidths.map(function (colWidth) {
-    return Math.max(Math.floor(colWidth * scaleFactor), _styles.tableCellMinWidth);
+    return Math.max(Math.floor(colWidth * scaleFactor), _table.tableCellMinWidth);
   });
   var totalScaled = scaledWidths.reduce(function (sum, w) {
     return sum + w;
   }, 0);
   var diff = availableWidth - totalScaled;
-  if (diff !== 0 && Math.abs(diff) < _styles.tableCellMinWidth) {
+  if (diff !== 0 && Math.abs(diff) < _table.tableCellMinWidth) {
     for (var i = 0; i < scaledWidths.length; i++) {
-      if (scaledWidths[i] + diff > _styles.tableCellMinWidth) {
+      if (scaledWidths[i] + diff > _table.tableCellMinWidth) {
         scaledWidths[i] += diff;
         break;
       }
@@ -142,7 +142,7 @@ var renderSyncBlockColgroup = function renderSyncBlockColgroup(_ref3) {
   // WidthObserver has measured the real container, which would skip this branch and produce
   // column widths scaled to the full viewport.
   if (renderWidthProp <= 0) {
-    var fullTableWidth = isNumberColumnEnabled ? rawTotalWidth + _editorSharedStyles.akEditorTableNumberColumnWidth : rawTotalWidth;
+    var fullTableWidth = isNumberColumnEnabled ? rawTotalWidth + _constants.akEditorTableNumberColumnWidth : rawTotalWidth;
     return columnWidths.map(function (colWidth) {
       return {
         width: "".concat(colWidth / fullTableWidth * 100, "%")
@@ -161,7 +161,7 @@ var renderSyncBlockColgroup = function renderSyncBlockColgroup(_ref3) {
   if (availableWidth >= rawTotalWidth) {
     return columnWidths.map(function (colWidth) {
       return {
-        width: "".concat(Math.max(colWidth - _styles.tableCellBorderWidth, _styles.tableCellMinWidth), "px")
+        width: "".concat(Math.max(colWidth - _table.tableCellBorderWidth, _table.tableCellMinWidth), "px")
       };
     });
   }
@@ -218,7 +218,7 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
   var tableContainerWidth = rendererAppearance === 'comment' && !(tableNode !== null && tableNode !== void 0 && tableNode.attrs.width) || isRendererNested && !isNumberColumnEnabled ? renderWidth : (0, _nodeWidth.getTableContainerWidth)(tableNode);
   if (allowTableResizing && !isInsideOfBlockNode && !isInsideOfTable && !isinsideMultiBodiedExtension && !tableColumnResized) {
     // when no columns are resized, each column should have equal width, equals to tableWidth / noOfColumns
-    var _tableWidth = (isNumberColumnEnabled ? tableContainerWidth - _editorSharedStyles.akEditorTableNumberColumnWidth : tableContainerWidth) - 1;
+    var _tableWidth = (isNumberColumnEnabled ? tableContainerWidth - _constants.akEditorTableNumberColumnWidth : tableContainerWidth) - 1;
     var defaultColumnWidth = _tableWidth / noOfColumns;
     targetWidths = new Array(noOfColumns).fill(defaultColumnWidth);
   } else if (!tableColumnResized) {
@@ -234,8 +234,8 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
   // when table resized and number column is enabled, we need to scale down the table in render
   if (forceScaleForNumColumn) {
     var calculatedTableContainerWidth = rendererAppearance === 'comment' ? sumOfColumns : tableContainerWidth;
-    var scalePercentage = +((calculatedTableContainerWidth - _editorSharedStyles.akEditorTableNumberColumnWidth) / calculatedTableContainerWidth);
-    var targetMaxWidth = calculatedTableContainerWidth - _editorSharedStyles.akEditorTableNumberColumnWidth;
+    var scalePercentage = +((calculatedTableContainerWidth - _constants.akEditorTableNumberColumnWidth) / calculatedTableContainerWidth);
+    var targetMaxWidth = calculatedTableContainerWidth - _constants.akEditorTableNumberColumnWidth;
     var totalWidthAfterScale = 0;
     var newScaledTargetWidths = columnWidths.map(function (width) {
       // we need to scale each column UP, to ensure total width of table matches table container
@@ -246,10 +246,10 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     });
     var diff = targetMaxWidth - totalWidthAfterScale;
     targetWidths = newScaledTargetWidths;
-    if (diff > 0 || diff < 0 && Math.abs(diff) < _styles.tableCellMinWidth) {
+    if (diff > 0 || diff < 0 && Math.abs(diff) < _table.tableCellMinWidth) {
       var updated = false;
       targetWidths = targetWidths.map(function (width) {
-        if (!updated && width + diff > _styles.tableCellMinWidth) {
+        if (!updated && width + diff > _table.tableCellMinWidth) {
           updated = true;
           width += diff;
         }
@@ -261,7 +261,7 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
 
   // @see ED-6056
   var maxTableWidth = renderWidth < tableContainerWidth ? renderWidth : tableContainerWidth;
-  var tableWidth = isNumberColumnEnabled ? _editorSharedStyles.akEditorTableNumberColumnWidth : 0;
+  var tableWidth = isNumberColumnEnabled ? _constants.akEditorTableNumberColumnWidth : 0;
   var minTableWidth = tableWidth;
   var zeroWidthColumnsCount = 0;
   targetWidths.forEach(function (width) {
@@ -270,7 +270,7 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     } else {
       zeroWidthColumnsCount += 1;
     }
-    minTableWidth += Math.ceil(width) || _editorSharedStyles.akEditorTableLegacyCellMinWidth;
+    minTableWidth += Math.ceil(width) || _constants.akEditorTableLegacyCellMinWidth;
   });
   var cellMinWidth = 0;
   var scaleDownPercent = 0;
@@ -282,7 +282,7 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
   if (zeroWidthColumnsCount > 0) {
     if (minTableWidth > maxTableWidth) {
       var minWidth = Math.ceil((maxTableWidth - tableWidth) / zeroWidthColumnsCount);
-      cellMinWidth = minWidth < _editorSharedStyles.akEditorTableLegacyCellMinWidth ? _editorSharedStyles.akEditorTableLegacyCellMinWidth : minWidth;
+      cellMinWidth = minWidth < _constants.akEditorTableLegacyCellMinWidth ? _constants.akEditorTableLegacyCellMinWidth : minWidth;
     }
   }
   // scaling down
@@ -306,7 +306,7 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     var sumFixedColumnWidths = colWidthSum(fixedColWidths);
     return fixedColWidths.map(function (colWidth) {
       var width = Math.max(colWidth, cellMinWidth);
-      if (colWidth > _editorSharedStyles.akEditorTableCellMinWidth) {
+      if (colWidth > _constants.akEditorTableCellMinWidth) {
         // To make sure the numbered column isn't scaled, use
         // percentages for the other columns.
         // Calculate the percentage based on the sum of the fixed column widths
@@ -343,7 +343,7 @@ var Colgroup = exports.Colgroup = function Colgroup(props) {
     nestedRendererType = _useRendererContext.nestedRendererType;
   var columnWidths = props.columnWidths,
     isNumberColumnEnabled = props.isNumberColumnEnabled;
-  var _useContext = (0, _react.useContext)(_ui.WidthContext),
+  var _useContext = (0, _react.useContext)(_WidthProvider.WidthContext),
     contextWidth = _useContext.width;
   if (!columnWidths) {
     return null;
@@ -377,7 +377,7 @@ var Colgroup = exports.Colgroup = function Colgroup(props) {
   return /*#__PURE__*/_react.default.createElement("colgroup", null, isNumberColumnEnabled && /*#__PURE__*/_react.default.createElement("col", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     style: {
-      width: _editorSharedStyles.akEditorTableNumberColumnWidth
+      width: _constants.akEditorTableNumberColumnWidth
     },
     "data-test-id": 'num'
   }), colStyles.map(function (style, idx) {

package/dist/cjs/react/nodes/table/sticky.js

@@ -12,7 +12,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _styles = require("@atlaskit/editor-common/styles");
-var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _constants = require("@atlaskit/editor-shared-styles/constants");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _injectProps = require("../../utils/inject-props");
 var _table = require("./table");
@@ -82,7 +82,7 @@ var FixedTableDiv = function FixedTableDiv(props) {
   if (allowTableResizing) {
     stickyHeaderZIndex = 13;
   } else {
-    stickyHeaderZIndex = _editorSharedStyles.akEditorStickyHeaderZIndex;
+    stickyHeaderZIndex = _constants.akEditorStickyHeaderZIndex;
   }
   var attrs = {
     mode: mode

package/dist/cjs/react/nodes/table/table.js

@@ -8,11 +8,11 @@ exports.Table = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _nodeWidth = require("@atlaskit/editor-common/node-width");
-var _table = require("@atlaskit/editor-common/table");
-var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _contentMode = require("@atlaskit/editor-common/table/content-mode");
+var _constants = require("@atlaskit/editor-shared-styles/constants");
 var _fg = require("@atlaskit/platform-feature-flags/fg");
 var _colgroup = require("./colgroup");
-var _contentMode = require("./content-mode");
+var _contentMode2 = require("./content-mode");
 var Table = exports.Table = /*#__PURE__*/_react.default.memo(function (_ref) {
   var _tableNode$attrs;
   var innerRef = _ref.innerRef,
@@ -33,7 +33,7 @@ var Table = exports.Table = /*#__PURE__*/_react.default.memo(function (_ref) {
     fixTableSSRResizing = _ref$fixTableSSRResiz === void 0 ? false : _ref$fixTableSSRResiz,
     _ref$allowFixedColumn = _ref.allowFixedColumnWidthOption,
     allowFixedColumnWidthOption = _ref$allowFixedColumn === void 0 ? false : _ref$allowFixedColumn;
-  var tableWidth = tableNode ? (0, _nodeWidth.getTableContainerWidth)(tableNode) : _editorSharedStyles.akEditorDefaultLayoutWidth;
+  var tableWidth = tableNode ? (0, _nodeWidth.getTableContainerWidth)(tableNode) : _constants.akEditorDefaultLayoutWidth;
   var tableColumnWidths = columnWidths;
   if (rendererAppearance === 'comment' && allowTableResizing && tableNode && !((_tableNode$attrs = tableNode.attrs) !== null && _tableNode$attrs !== void 0 && _tableNode$attrs.width)) {
     tableWidth = 'inherit';
@@ -45,9 +45,9 @@ var Table = exports.Table = /*#__PURE__*/_react.default.memo(function (_ref) {
   }
   var tableLayout = tableNode === null || tableNode === void 0 ? void 0 : tableNode.attrs.layout;
   var tableDisplayMode = tableNode === null || tableNode === void 0 ? void 0 : tableNode.attrs.displayMode;
-  var isContentMode = (0, _table.isTableInContentMode)({
+  var isContentMode = (0, _contentMode.isTableInContentMode)({
     tableNode: tableNode,
-    isSupported: (0, _contentMode.isContentModeSupported)({
+    isSupported: (0, _contentMode2.isContentModeSupported)({
       allowTableResizing: allowTableResizing,
       rendererAppearance: rendererAppearance
     }),

package/dist/cjs/react/nodes/table.js

@@ -15,12 +15,15 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _nodeWidth = require("@atlaskit/editor-common/node-width");
+var _OverflowShadow = _interopRequireDefault(require("@atlaskit/editor-common/OverflowShadow"));
 var _styles = require("@atlaskit/editor-common/styles");
-var _table = require("@atlaskit/editor-common/table");
+var _table = require("@atlaskit/editor-common/styles/table");
+var _contentMode = require("@atlaskit/editor-common/table/content-mode");
 var _types = require("@atlaskit/editor-common/types");
-var _ui = require("@atlaskit/editor-common/ui");
 var _utils = require("@atlaskit/editor-common/utils");
-var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _compareNodes = require("@atlaskit/editor-common/utils/compareNodes");
+var _compose = require("@atlaskit/editor-common/utils/compose");
+var _constants = require("@atlaskit/editor-shared-styles/constants");
 var _fg = require("@atlaskit/platform-feature-flags/fg");
 var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
@@ -29,7 +32,7 @@ var _rendererContext = require("../../renderer-context");
 var _style = require("../../ui/Renderer/style");
 var _SmartCardStorage = require("../../ui/SmartCardStorage");
 var _appearance = require("../utils/appearance");
-var _contentMode = require("./table/content-mode");
+var _contentMode2 = require("./table/content-mode");
 var _sticky = require("./table/sticky");
 var _table2 = require("./table/table");
 var _tableCell = require("./tableCell");
@@ -70,7 +73,7 @@ var orderChildren = exports.orderChildren = function orderChildren(children, tab
   }
   var order = tableOrderStatus.order,
     columnIndex = tableOrderStatus.columnIndex;
-  var compareNodesInOrder = (0, _utils.createCompareNodes)({
+  var compareNodesInOrder = (0, _compareNodes.createCompareNodes)({
     getInlineCardTextFromStore: function getInlineCardTextFromStore(attrs) {
       var _ref = attrs,
         url = _ref.url;
@@ -553,7 +556,7 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
       if (!this.tableRef.current || !this.stickyHeaderRef.current) {
         return;
       }
-      return this.tableRef.current.offsetHeight - this.stickyHeaderRef.current.offsetHeight + _styles.tableMarginTop - _sticky.tableStickyPadding;
+      return this.tableRef.current.offsetHeight - this.stickyHeaderRef.current.offsetHeight + _table.tableMarginTop - _sticky.tableStickyPadding;
     }
 
     /**
@@ -615,7 +618,7 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
         isPresentational = _this$props.isPresentational,
         allowFixedColumnWidthOption = _this$props.allowFixedColumnWidthOption;
       var stickyMode = this.state.stickyMode;
-      var lineLengthFixedWidth = _editorSharedStyles.akEditorDefaultLayoutWidth;
+      var lineLengthFixedWidth = _constants.akEditorDefaultLayoutWidth;
       var updatedLayout;
       var fullPageRendererWidthCSS = (0, _editorExperiment.editorExperiment)('platform_editor_preview_panel_responsiveness', true, {
         exposure: true
@@ -623,9 +626,9 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
       var renderWidthCSS = rendererAppearance === 'full-page' ? fullPageRendererWidthCSS : "100cqw";
       var calcDefaultLayoutWidthByAppearance = function calcDefaultLayoutWidthByAppearance(rendererAppearance, tableNode) {
         if (rendererAppearance === 'max' && !(tableNode !== null && tableNode !== void 0 && tableNode.attrs.width)) {
-          return "min(".concat(_editorSharedStyles.akEditorMaxWidthLayoutWidth, "px, ").concat(renderWidthCSS, ")");
+          return "min(".concat(_constants.akEditorMaxWidthLayoutWidth, "px, ").concat(renderWidthCSS, ")");
         } else if (rendererAppearance === 'full-width' && !(tableNode !== null && tableNode !== void 0 && tableNode.attrs.width)) {
-          return "min(".concat(_editorSharedStyles.akEditorFullWidthLayoutWidth, "px, ").concat(renderWidthCSS, ")");
+          return "min(".concat(_constants.akEditorFullWidthLayoutWidth, "px, ").concat(renderWidthCSS, ")");
         } else if (rendererAppearance === 'comment' && allowTableResizing && !(tableNode !== null && tableNode !== void 0 && tableNode.attrs.width)) {
           return renderWidthCSS;
         } else {
@@ -638,8 +641,8 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
 
       // Logic for table alignment in renderer
       var isTableAlignStart = tableNode && tableNode.attrs && tableNode.attrs.layout === 'align-start' && allowTableAlignment;
-      var fullWidthLineLengthCSS = "min(".concat(_editorSharedStyles.akEditorFullWidthLayoutWidth, "px, ").concat(renderWidthCSS, ")");
-      var maxWidthLineLengthCSS = "min(".concat(_editorSharedStyles.akEditorMaxWidthLayoutWidth, "px, ").concat(renderWidthCSS, ")");
+      var fullWidthLineLengthCSS = "min(".concat(_constants.akEditorFullWidthLayoutWidth, "px, ").concat(renderWidthCSS, ")");
+      var maxWidthLineLengthCSS = "min(".concat(_constants.akEditorMaxWidthLayoutWidth, "px, ").concat(renderWidthCSS, ")");
       var isCommentAppearanceAndTableAlignmentEnabled = (0, _appearance.isCommentAppearance)(rendererAppearance) && allowTableAlignment;
       var lineLengthCSS = (0, _appearance.isFullWidthAppearance)(rendererAppearance) ? fullWidthLineLengthCSS : (0, _appearance.isMaxWidthAppearance)(rendererAppearance) ? maxWidthLineLengthCSS : isCommentAppearanceAndTableAlignmentEnabled ? renderWidthCSS : "".concat(lineLengthFixedWidth, "px");
       var tableWidthNew = (0, _nodeWidth.getTableContainerWidth)(tableNode);
@@ -683,7 +686,7 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
 
         // !NOTE: it a table resized to 760 is copied from 'full-page' editor and pasted in comment editor
         // where (allowTableResizing && !allowTableAlignment), the table will loose 760px width.
-        finalTableContainerWidth = tableNode !== null && tableNode !== void 0 && tableNode.attrs.width && (tableNode === null || tableNode === void 0 ? void 0 : tableNode.attrs.width) !== _editorSharedStyles.akEditorDefaultLayoutWidth ? "calc(".concat(tableWidthCSS, ")") : 'inherit';
+        finalTableContainerWidth = tableNode !== null && tableNode !== void 0 && tableNode.attrs.width && (tableNode === null || tableNode === void 0 ? void 0 : tableNode.attrs.width) !== _constants.akEditorDefaultLayoutWidth ? "calc(".concat(tableWidthCSS, ")") : 'inherit';
       }
       if (rendererAppearance === 'comment' && allowTableResizing && allowTableAlignment) {
         // If table alignment is enabled and layout is not 'align-start' or 'center', we are loading a table that was
@@ -691,9 +694,9 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
         // instead of 760 that was set on tableNode when the table had been published.
         finalTableContainerWidth = ((tableNode === null || tableNode === void 0 ? void 0 : tableNode.attrs.layout) === 'align-start' || (tableNode === null || tableNode === void 0 ? void 0 : tableNode.attrs.layout) === 'center') && tableNode !== null && tableNode !== void 0 && tableNode.attrs.width ? "calc(".concat(tableWidthCSS, ")") : 'inherit';
       }
-      var isContentModeTable = (0, _table.isTableInContentMode)({
+      var isContentModeTable = (0, _contentMode.isTableInContentMode)({
         tableNode: tableNode,
-        isSupported: (0, _contentMode.isContentModeSupported)({
+        isSupported: (0, _contentMode2.isContentModeSupported)({
           allowTableResizing: allowTableResizing,
           rendererAppearance: rendererAppearance
         }),
@@ -981,7 +984,7 @@ var TableProcessorWithContainerStyles = exports.TableProcessorWithContainerStyle
       }
       var childrenArray = _react.default.Children.toArray(children);
       var childrenWithTableEdgeProps = (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? addTableCellEdgePropsThroughWrappers(childrenArray, tableNode, isNumberColumnEnabled) : childrenArray;
-      var orderedChildren = (0, _utils.compose)(this.addNumberColumnIndexes, this.addSortableColumn
+      var orderedChildren = (0, _compose.compose)(this.addNumberColumnIndexes, this.addSortableColumn
       // @ts-expect-error TS2345: Argument of type '(ReactChild | ReactFragment | ReactPortal)[]' is not assignable to parameter of type 'ReactElement<any, string | JSXElementConstructor<any>>[]'
       )(childrenWithTableEdgeProps);
       return /*#__PURE__*/_react.default.createElement(TableContainer, {
@@ -1010,7 +1013,7 @@ var TableProcessorWithContainerStyles = exports.TableProcessorWithContainerStyle
     }
   }]);
 }(_react.default.Component); // eslint-disable-next-line @typescript-eslint/no-explicit-any
-var TableWithShadowsAndContainerStyles = (0, _ui.overflowShadow)(TableProcessorWithContainerStyles, {
+var TableWithShadowsAndContainerStyles = (0, _OverflowShadow.default)(TableProcessorWithContainerStyles, {
   /**
    * The :scope is in reference to table container and we are selecting only
    * direct children that match the table node wrapper selector, not their