@atlaskit/editor-common 98.2.4 → 98.2.6

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/editor-common
 
+## 98.2.6
+
+### Patch Changes
+
+- [#100162](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100162)
+  [`e80e57fc37719`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e80e57fc37719) -
+  [ux] ED-26089: Add 4px gap to main nav bar items
+
+## 98.2.5
+
+### Patch Changes
+
+- [#100845](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100845)
+  [`bd4c63b5f9688`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/bd4c63b5f9688) -
+  [ED-26055] Export a function from adf-utils used to detect the use of the nested-tables extension,
+  and add calculation of unexpectedly nested tables to editor-common utils
+- Updated dependencies
+
 ## 98.2.4
 
 ### Patch Changes

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 = "98.2.4";
+var packageVersion = "98.2.6";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/cjs/styles/index.js

@@ -159,6 +159,12 @@ Object.defineProperty(exports, "buttonGroupStyle", {
     return _plugins.buttonGroupStyle;
   }
 });
+Object.defineProperty(exports, "buttonGroupStyleBeforeVisualRefresh", {
+  enumerable: true,
+  get: function get() {
+    return _plugins.buttonGroupStyleBeforeVisualRefresh;
+  }
+});
 Object.defineProperty(exports, "calcTableWidth", {
   enumerable: true,
   get: function get() {

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

@@ -3,11 +3,28 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.wrapperStyle = exports.triggerWrapperStylesWithPadding = exports.triggerWrapperStyles = exports.separatorStyles = exports.disableBlueBorderStyles = exports.buttonGroupStyle = void 0;
+exports.wrapperStyle = exports.triggerWrapperStylesWithPadding = exports.triggerWrapperStyles = exports.separatorStyles = exports.disableBlueBorderStyles = exports.buttonGroupStyleBeforeVisualRefresh = exports.buttonGroupStyle = void 0;
 var _react = require("@emotion/react");
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, -- Ignored via go/DSP-18766
+var buttonGroupStyleBeforeVisualRefresh = exports.buttonGroupStyleBeforeVisualRefresh = (0, _react.css)({
+  display: 'inline-flex',
+  alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '& > div': {
+    display: 'flex'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  button: {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+    '&:not([disabled])::after': {
+      border: 'none' // remove blue border when an item has been selected
+    }
+  }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 var buttonGroupStyle = exports.buttonGroupStyle = (0, _react.css)({
   display: 'inline-flex',
   alignItems: 'center',
@@ -21,6 +38,11 @@ var buttonGroupStyle = exports.buttonGroupStyle = (0, _react.css)({
     '&:not([disabled])::after': {
       border: 'none' // remove blue border when an item has been selected
     }
+  },
+  gap: "var(--ds-space-050, 4px)",
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  'div[role=group]': {
+    gap: "var(--ds-space-050, 4px)"
   }
 });
 

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 = "98.2.4";
+var packageVersion = "98.2.6";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 // Ignored via go/ees005

package/dist/cjs/ui-menu/ColorPickerButton/index.js

@@ -10,9 +10,11 @@ var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _withAnalyticsContext = _interopRequireDefault(require("@atlaskit/analytics-next/withAnalyticsContext"));
 var _withAnalyticsEvents = _interopRequireDefault(require("@atlaskit/analytics-next/withAnalyticsEvents"));
+var _new = _interopRequireDefault(require("@atlaskit/button/new"));
 var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
 var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-down"));
 var _chevronDown2 = _interopRequireDefault(require("@atlaskit/icon/utility/chevron-down"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _primitives = require("@atlaskit/primitives");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _analytics = require("../../analytics");
@@ -38,6 +40,21 @@ var colorPickerExpandContainer = (0, _primitives.xcss)({
   marginLeft: 'space.negative.050',
   marginRight: 'space.negative.050'
 });
+var colorPickerExpandContainerVisualRefresh = (0, _primitives.xcss)({
+  marginTop: 'space.negative.025',
+  marginRight: 'space.negative.050'
+});
+var colorPickerButtonStyle = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  button: {
+    '&::after': {
+      border: 'none'
+    },
+    '&:hover': {
+      backgroundColor: "var(--ds-background-selected, #E9F2FF)"
+    }
+  }
+});
 
 // Control the size of color picker buttons and preview
 // TODO: https://product-fabric.atlassian.net/browse/DSP-4134
@@ -212,12 +229,69 @@ var ColorPickerButton = function ColorPickerButton(props) {
       }
     });
   };
+  var buttonStyleVisualRefresh = function buttonStyleVisualRefresh() {
+    var _props$size4, _props$size5, _props$size6;
+    return (0, _react2.css)({
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      height: "".concat(!!((_props$size4 = props.size) !== null && _props$size4 !== void 0 && _props$size4.height) ? 'inherit' : ''),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+      '&:before': {
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        alignSelf: 'center',
+        content: "''",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        border: "1px solid ".concat(_uiColor.DEFAULT_BORDER_COLOR),
+        borderRadius: "var(--ds-border-radius, 3px)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        backgroundColor: currentColor || 'transparent',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        width: ((_props$size5 = props.size) === null || _props$size5 === void 0 ? void 0 : _props$size5.width) || '14px',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        height: ((_props$size6 = props.size) === null || _props$size6 === void 0 ? void 0 : _props$size6.height) || '14px',
+        marginTop: "var(--ds-space-025, 2px)"
+      }
+    });
+  };
   return (0, _react2.jsx)("div", {
     css: colorPickerButtonWrapper
   }, (0, _react2.jsx)(_tooltip.default, {
     content: title,
     position: "top"
-  }, (0, _react2.jsx)(_standardButton.default, {
+  },
+  // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
+  (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ? (0, _react2.jsx)("div", {
+    css: colorPickerButtonStyle
+  }, (0, _react2.jsx)(_new.default, {
+    appearance: 'subtle',
+    ref: buttonRef,
+    "aria-label": title,
+    "aria-expanded": props.isAriaExpanded ? isPopupOpen : undefined,
+    spacing: "compact",
+    onClick: togglePopup,
+    onKeyDown: function onKeyDown(event) {
+      if (event.key === 'Enter' || event.key === ' ') {
+        event.preventDefault();
+        togglePopup();
+        setIsOpenedByKeyboard(true);
+      }
+    },
+    "data-selected-color": props.currentColor,
+    isSelected: isPopupOpen
+  }, (0, _react2.jsx)(_primitives.Inline, {
+    alignBlock: "start"
+  }, (0, _react2.jsx)("span", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    css: buttonStyleVisualRefresh
+  }), (0, _react2.jsx)(_primitives.Box, {
+    xcss: colorPickerExpandContainerVisualRefresh
+  }, (0, _react2.jsx)(_chevronDown2.default, {
+    color: "currentColor",
+    spacing: "spacious",
+    LEGACY_fallbackIcon: _chevronDown.default,
+    label: "color-picker-chevron-down"
+  }))))) : (0, _react2.jsx)(_standardButton.default, {
     appearance: 'subtle',
     ref: buttonRef,
     "aria-label": title,
@@ -231,7 +305,6 @@ var ColorPickerButton = function ColorPickerButton(props) {
         setIsOpenedByKeyboard(true);
       }
     }
-    // TODO: (from codemod) Buttons with "component", "css" or "style" prop can't be automatically migrated with codemods. Please migrate it manually.
     // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides
     ,
     css: buttonStyle,

package/dist/cjs/utils/page-element-counts.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getPageElementCounts = void 0;
+var _transforms = require("@atlaskit/adf-utils/transforms");
 var _traverse = require("@atlaskit/adf-utils/traverse");
 /**
  * Traverses a JSON document and counts the number of unique elements, text formatting and macros.
@@ -13,7 +14,8 @@ var getPageElementCounts = exports.getPageElementCounts = function getPageElemen
   var pageElementCounts = {
     elements: {},
     textFormats: {},
-    macros: {}
+    macros: {},
+    unexpectedElements: {}
   };
   (0, _traverse.reduce)(doc, function (acc, node) {
     if (node.type === 'text') {
@@ -32,6 +34,22 @@ var getPageElementCounts = exports.getPageElementCounts = function getPageElemen
       if ('attrs' in node && node.attrs && 'extensionKey' in node.attrs && node.attrs.extensionKey) {
         var _acc$macros$extension;
         var extensionKey = node.attrs.extensionKey;
+
+        // If there is a nested table extension
+        if ((0, _transforms.isNestedTableExtension)(node)) {
+          if ('parameters' in node.attrs && node.attrs.parameters && 'adf' in node.attrs.parameters) {
+            // Check to see if the ADF contains a nested table
+            var adfString = node.attrs.parameters.adf;
+            var adf = JSON.parse(adfString);
+            if (adfString.includes('{"type":"table"')) {
+              if (getHasNestedTable(adf)) {
+                var _acc$unexpectedElemen;
+                acc.unexpectedElements['tablesNestedMoreThanOnce'] = ((_acc$unexpectedElemen = acc.unexpectedElements['tablesNestedMoreThanOnce']) !== null && _acc$unexpectedElemen !== void 0 ? _acc$unexpectedElemen : 0) + 1;
+              }
+            }
+          }
+        }
+
         // If macros extensionKey has <UUID>/<UUID>/static/ prepended to it, remove the prefix
         if (extensionKey.includes('/static/')) {
           var extensionKeyParts = extensionKey.split('/');
@@ -46,4 +64,24 @@ var getPageElementCounts = exports.getPageElementCounts = function getPageElemen
     return acc;
   }, pageElementCounts);
   return pageElementCounts;
+};
+
+/**
+ * Return true is the JSON document contains a table nested within a table
+ */
+var getHasNestedTable = function getHasNestedTable(node) {
+  return (0, _traverse.reduce)(node, function (hasNestedTable, node) {
+    if (hasNestedTable) {
+      return hasNestedTable;
+    }
+    if (node.type === 'table') {
+      return (0, _traverse.reduce)(node, function (acc, node) {
+        if (node.type === 'table') {
+          return true;
+        }
+        return acc;
+      }, false);
+    }
+    return hasNestedTable;
+  }, false);
 };

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 = "98.2.4";
+const packageVersion = "98.2.6";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/es2019/styles/index.js

@@ -30,7 +30,7 @@ export { resizerStyles, resizerHandleClassName, resizerHandleTrackClassName, res
 export { gridStyles, GRID_GUTTER } from './shared/grid';
 export { smartCardStyles, FLOATING_TOOLBAR_LINKPICKER_CLASSNAME, DATASOURCE_INNER_CONTAINER_CLASSNAME } from './shared/smartCard';
 export { embedCardStyles, embedSpacingStyles } from './shared/embedCard';
-export { buttonGroupStyle, disableBlueBorderStyles, separatorStyles, wrapperStyle, triggerWrapperStyles, triggerWrapperStylesWithPadding } from './shared/plugins';
+export { buttonGroupStyle, buttonGroupStyleBeforeVisualRefresh, disableBlueBorderStyles, separatorStyles, wrapperStyle, triggerWrapperStyles, triggerWrapperStylesWithPadding } from './shared/plugins';
 export { UnsupportedSharedCssClassName, unsupportedStyles } from './shared/unsupported-content';
 export { expandIconWrapperStyle, expandClassNames, expandIconContainerStyle } from './shared/expand';
 export { sharedExpandStyles } from '../ui/Expand/sharedStyles';

package/dist/es2019/styles/shared/plugins.js

@@ -1,6 +1,23 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, -- Ignored via go/DSP-18766
+export const buttonGroupStyleBeforeVisualRefresh = css({
+  display: 'inline-flex',
+  alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '& > div': {
+    display: 'flex'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  button: {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+    '&:not([disabled])::after': {
+      border: 'none' // remove blue border when an item has been selected
+    }
+  }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export const buttonGroupStyle = css({
   display: 'inline-flex',
   alignItems: 'center',
@@ -14,6 +31,11 @@ export const buttonGroupStyle = css({
     '&:not([disabled])::after': {
       border: 'none' // remove blue border when an item has been selected
     }
+  },
+  gap: "var(--ds-space-050, 4px)",
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  'div[role=group]': {
+    gap: "var(--ds-space-050, 4px)"
   }
 });
 

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

@@ -13,7 +13,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "98.2.4";
+const packageVersion = "98.2.6";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 // Ignored via go/ees005

package/dist/es2019/ui-menu/ColorPickerButton/index.js

@@ -8,10 +8,12 @@ import React from 'react';
 import { css, jsx } from '@emotion/react';
 import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext';
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
-import Button from '@atlaskit/button/standard-button';
+import Button from '@atlaskit/button/new';
+import LegacyButton from '@atlaskit/button/standard-button';
 import LegacyExpandIcon from '@atlaskit/icon/glyph/chevron-down';
 import ChevronDownIcon from '@atlaskit/icon/utility/chevron-down';
-import { Box, xcss } from '@atlaskit/primitives';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { Box, xcss, Inline } from '@atlaskit/primitives';
 import Tooltip from '@atlaskit/tooltip';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, editorAnalyticsChannel, EVENT_TYPE } from '../../analytics';
 import { ColorPalette, DEFAULT_BORDER_COLOR, getSelectedRowAndColumnFromPalette } from '../../ui-color';
@@ -30,6 +32,21 @@ const colorPickerExpandContainer = xcss({
   marginLeft: 'space.negative.050',
   marginRight: 'space.negative.050'
 });
+const colorPickerExpandContainerVisualRefresh = xcss({
+  marginTop: 'space.negative.025',
+  marginRight: 'space.negative.050'
+});
+const colorPickerButtonStyle = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  button: {
+    '&::after': {
+      border: 'none'
+    },
+    '&:hover': {
+      backgroundColor: `${"var(--ds-background-selected, #E9F2FF)"}`
+    }
+  }
+});
 
 // Control the size of color picker buttons and preview
 // TODO: https://product-fabric.atlassian.net/browse/DSP-4134
@@ -192,12 +209,69 @@ const ColorPickerButton = props => {
       }
     });
   };
+  const buttonStyleVisualRefresh = () => {
+    var _props$size4, _props$size5, _props$size6;
+    return css({
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      height: `${!!((_props$size4 = props.size) !== null && _props$size4 !== void 0 && _props$size4.height) ? 'inherit' : ''}`,
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+      '&:before': {
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        alignSelf: 'center',
+        content: "''",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        border: `1px solid ${DEFAULT_BORDER_COLOR}`,
+        borderRadius: "var(--ds-border-radius, 3px)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        backgroundColor: currentColor || 'transparent',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        width: ((_props$size5 = props.size) === null || _props$size5 === void 0 ? void 0 : _props$size5.width) || '14px',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        height: ((_props$size6 = props.size) === null || _props$size6 === void 0 ? void 0 : _props$size6.height) || '14px',
+        marginTop: `${"var(--ds-space-025, 2px)"}`
+      }
+    });
+  };
   return jsx("div", {
     css: colorPickerButtonWrapper
   }, jsx(Tooltip, {
     content: title,
     position: "top"
+  },
+  // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
+  fg('platform-visual-refresh-icons') ? jsx("div", {
+    css: colorPickerButtonStyle
   }, jsx(Button, {
+    appearance: 'subtle',
+    ref: buttonRef,
+    "aria-label": title,
+    "aria-expanded": props.isAriaExpanded ? isPopupOpen : undefined,
+    spacing: "compact",
+    onClick: togglePopup,
+    onKeyDown: event => {
+      if (event.key === 'Enter' || event.key === ' ') {
+        event.preventDefault();
+        togglePopup();
+        setIsOpenedByKeyboard(true);
+      }
+    },
+    "data-selected-color": props.currentColor,
+    isSelected: isPopupOpen
+  }, jsx(Inline, {
+    alignBlock: "start"
+  }, jsx("span", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    css: buttonStyleVisualRefresh
+  }), jsx(Box, {
+    xcss: colorPickerExpandContainerVisualRefresh
+  }, jsx(ChevronDownIcon, {
+    color: "currentColor",
+    spacing: "spacious",
+    LEGACY_fallbackIcon: LegacyExpandIcon,
+    label: "color-picker-chevron-down"
+  }))))) : jsx(LegacyButton, {
     appearance: 'subtle',
     ref: buttonRef,
     "aria-label": title,
@@ -211,7 +285,6 @@ const ColorPickerButton = props => {
         setIsOpenedByKeyboard(true);
       }
     }
-    // TODO: (from codemod) Buttons with "component", "css" or "style" prop can't be automatically migrated with codemods. Please migrate it manually.
     // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides
     ,
     css: buttonStyle,

package/dist/es2019/utils/page-element-counts.js

@@ -1,3 +1,4 @@
+import { isNestedTableExtension } from '@atlaskit/adf-utils/transforms';
 import { reduce } from '@atlaskit/adf-utils/traverse';
 /**
  * Traverses a JSON document and counts the number of unique elements, text formatting and macros.
@@ -7,7 +8,8 @@ export const getPageElementCounts = doc => {
   const pageElementCounts = {
     elements: {},
     textFormats: {},
-    macros: {}
+    macros: {},
+    unexpectedElements: {}
   };
   reduce(doc, (acc, node) => {
     if (node.type === 'text') {
@@ -26,6 +28,22 @@ export const getPageElementCounts = doc => {
       if ('attrs' in node && node.attrs && 'extensionKey' in node.attrs && node.attrs.extensionKey) {
         var _acc$macros$extension;
         let extensionKey = node.attrs.extensionKey;
+
+        // If there is a nested table extension
+        if (isNestedTableExtension(node)) {
+          if ('parameters' in node.attrs && node.attrs.parameters && 'adf' in node.attrs.parameters) {
+            // Check to see if the ADF contains a nested table
+            const adfString = node.attrs.parameters.adf;
+            const adf = JSON.parse(adfString);
+            if (adfString.includes('{"type":"table"')) {
+              if (getHasNestedTable(adf)) {
+                var _acc$unexpectedElemen;
+                acc.unexpectedElements['tablesNestedMoreThanOnce'] = ((_acc$unexpectedElemen = acc.unexpectedElements['tablesNestedMoreThanOnce']) !== null && _acc$unexpectedElemen !== void 0 ? _acc$unexpectedElemen : 0) + 1;
+              }
+            }
+          }
+        }
+
         // If macros extensionKey has <UUID>/<UUID>/static/ prepended to it, remove the prefix
         if (extensionKey.includes('/static/')) {
           const extensionKeyParts = extensionKey.split('/');
@@ -40,4 +58,24 @@ export const getPageElementCounts = doc => {
     return acc;
   }, pageElementCounts);
   return pageElementCounts;
+};
+
+/**
+ * Return true is the JSON document contains a table nested within a table
+ */
+const getHasNestedTable = node => {
+  return reduce(node, (hasNestedTable, node) => {
+    if (hasNestedTable) {
+      return hasNestedTable;
+    }
+    if (node.type === 'table') {
+      return reduce(node, (acc, node) => {
+        if (node.type === 'table') {
+          return true;
+        }
+        return acc;
+      }, false);
+    }
+    return hasNestedTable;
+  }, false);
 };

package/dist/esm/monitoring/error.js

@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { isFedRamp } from './environment';
 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 = "98.2.4";
+var packageVersion = "98.2.6";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/esm/styles/index.js

@@ -30,7 +30,7 @@ export { resizerStyles, resizerHandleClassName, resizerHandleTrackClassName, res
 export { gridStyles, GRID_GUTTER } from './shared/grid';
 export { smartCardStyles, FLOATING_TOOLBAR_LINKPICKER_CLASSNAME, DATASOURCE_INNER_CONTAINER_CLASSNAME } from './shared/smartCard';
 export { embedCardStyles, embedSpacingStyles } from './shared/embedCard';
-export { buttonGroupStyle, disableBlueBorderStyles, separatorStyles, wrapperStyle, triggerWrapperStyles, triggerWrapperStylesWithPadding } from './shared/plugins';
+export { buttonGroupStyle, buttonGroupStyleBeforeVisualRefresh, disableBlueBorderStyles, separatorStyles, wrapperStyle, triggerWrapperStyles, triggerWrapperStylesWithPadding } from './shared/plugins';
 export { UnsupportedSharedCssClassName, unsupportedStyles } from './shared/unsupported-content';
 export { expandIconWrapperStyle, expandClassNames, expandIconContainerStyle } from './shared/expand';
 export { sharedExpandStyles } from '../ui/Expand/sharedStyles';

package/dist/esm/styles/shared/plugins.js

@@ -1,6 +1,23 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, -- Ignored via go/DSP-18766
+export var buttonGroupStyleBeforeVisualRefresh = css({
+  display: 'inline-flex',
+  alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '& > div': {
+    display: 'flex'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  button: {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+    '&:not([disabled])::after': {
+      border: 'none' // remove blue border when an item has been selected
+    }
+  }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
 export var buttonGroupStyle = css({
   display: 'inline-flex',
   alignItems: 'center',
@@ -14,6 +31,11 @@ export var buttonGroupStyle = css({
     '&:not([disabled])::after': {
       border: 'none' // remove blue border when an item has been selected
     }
+  },
+  gap: "var(--ds-space-050, 4px)",
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  'div[role=group]': {
+    gap: "var(--ds-space-050, 4px)"
   }
 });
 

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

@@ -20,7 +20,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "98.2.4";
+var packageVersion = "98.2.6";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 // Ignored via go/ees005

package/dist/esm/ui-menu/ColorPickerButton/index.js

@@ -9,10 +9,12 @@ import React from 'react';
 import { css, jsx } from '@emotion/react';
 import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext';
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
-import Button from '@atlaskit/button/standard-button';
+import Button from '@atlaskit/button/new';
+import LegacyButton from '@atlaskit/button/standard-button';
 import LegacyExpandIcon from '@atlaskit/icon/glyph/chevron-down';
 import ChevronDownIcon from '@atlaskit/icon/utility/chevron-down';
-import { Box, xcss } from '@atlaskit/primitives';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { Box, xcss, Inline } from '@atlaskit/primitives';
 import Tooltip from '@atlaskit/tooltip';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, editorAnalyticsChannel, EVENT_TYPE } from '../../analytics';
 import { ColorPalette, DEFAULT_BORDER_COLOR, getSelectedRowAndColumnFromPalette } from '../../ui-color';
@@ -31,6 +33,21 @@ var colorPickerExpandContainer = xcss({
   marginLeft: 'space.negative.050',
   marginRight: 'space.negative.050'
 });
+var colorPickerExpandContainerVisualRefresh = xcss({
+  marginTop: 'space.negative.025',
+  marginRight: 'space.negative.050'
+});
+var colorPickerButtonStyle = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  button: {
+    '&::after': {
+      border: 'none'
+    },
+    '&:hover': {
+      backgroundColor: "var(--ds-background-selected, #E9F2FF)"
+    }
+  }
+});
 
 // Control the size of color picker buttons and preview
 // TODO: https://product-fabric.atlassian.net/browse/DSP-4134
@@ -205,12 +222,69 @@ var ColorPickerButton = function ColorPickerButton(props) {
       }
     });
   };
+  var buttonStyleVisualRefresh = function buttonStyleVisualRefresh() {
+    var _props$size4, _props$size5, _props$size6;
+    return css({
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      height: "".concat(!!((_props$size4 = props.size) !== null && _props$size4 !== void 0 && _props$size4.height) ? 'inherit' : ''),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+      '&:before': {
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        alignSelf: 'center',
+        content: "''",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        border: "1px solid ".concat(DEFAULT_BORDER_COLOR),
+        borderRadius: "var(--ds-border-radius, 3px)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        backgroundColor: currentColor || 'transparent',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        width: ((_props$size5 = props.size) === null || _props$size5 === void 0 ? void 0 : _props$size5.width) || '14px',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        height: ((_props$size6 = props.size) === null || _props$size6 === void 0 ? void 0 : _props$size6.height) || '14px',
+        marginTop: "var(--ds-space-025, 2px)"
+      }
+    });
+  };
   return jsx("div", {
     css: colorPickerButtonWrapper
   }, jsx(Tooltip, {
     content: title,
     position: "top"
+  },
+  // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
+  fg('platform-visual-refresh-icons') ? jsx("div", {
+    css: colorPickerButtonStyle
   }, jsx(Button, {
+    appearance: 'subtle',
+    ref: buttonRef,
+    "aria-label": title,
+    "aria-expanded": props.isAriaExpanded ? isPopupOpen : undefined,
+    spacing: "compact",
+    onClick: togglePopup,
+    onKeyDown: function onKeyDown(event) {
+      if (event.key === 'Enter' || event.key === ' ') {
+        event.preventDefault();
+        togglePopup();
+        setIsOpenedByKeyboard(true);
+      }
+    },
+    "data-selected-color": props.currentColor,
+    isSelected: isPopupOpen
+  }, jsx(Inline, {
+    alignBlock: "start"
+  }, jsx("span", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    css: buttonStyleVisualRefresh
+  }), jsx(Box, {
+    xcss: colorPickerExpandContainerVisualRefresh
+  }, jsx(ChevronDownIcon, {
+    color: "currentColor",
+    spacing: "spacious",
+    LEGACY_fallbackIcon: LegacyExpandIcon,
+    label: "color-picker-chevron-down"
+  }))))) : jsx(LegacyButton, {
     appearance: 'subtle',
     ref: buttonRef,
     "aria-label": title,
@@ -224,7 +298,6 @@ var ColorPickerButton = function ColorPickerButton(props) {
         setIsOpenedByKeyboard(true);
       }
     }
-    // TODO: (from codemod) Buttons with "component", "css" or "style" prop can't be automatically migrated with codemods. Please migrate it manually.
     // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides
     ,
     css: buttonStyle,

package/dist/esm/utils/page-element-counts.js

@@ -1,3 +1,4 @@
+import { isNestedTableExtension } from '@atlaskit/adf-utils/transforms';
 import { reduce } from '@atlaskit/adf-utils/traverse';
 /**
  * Traverses a JSON document and counts the number of unique elements, text formatting and macros.
@@ -7,7 +8,8 @@ export var getPageElementCounts = function getPageElementCounts(doc) {
   var pageElementCounts = {
     elements: {},
     textFormats: {},
-    macros: {}
+    macros: {},
+    unexpectedElements: {}
   };
   reduce(doc, function (acc, node) {
     if (node.type === 'text') {
@@ -26,6 +28,22 @@ export var getPageElementCounts = function getPageElementCounts(doc) {
       if ('attrs' in node && node.attrs && 'extensionKey' in node.attrs && node.attrs.extensionKey) {
         var _acc$macros$extension;
         var extensionKey = node.attrs.extensionKey;
+
+        // If there is a nested table extension
+        if (isNestedTableExtension(node)) {
+          if ('parameters' in node.attrs && node.attrs.parameters && 'adf' in node.attrs.parameters) {
+            // Check to see if the ADF contains a nested table
+            var adfString = node.attrs.parameters.adf;
+            var adf = JSON.parse(adfString);
+            if (adfString.includes('{"type":"table"')) {
+              if (getHasNestedTable(adf)) {
+                var _acc$unexpectedElemen;
+                acc.unexpectedElements['tablesNestedMoreThanOnce'] = ((_acc$unexpectedElemen = acc.unexpectedElements['tablesNestedMoreThanOnce']) !== null && _acc$unexpectedElemen !== void 0 ? _acc$unexpectedElemen : 0) + 1;
+              }
+            }
+          }
+        }
+
         // If macros extensionKey has <UUID>/<UUID>/static/ prepended to it, remove the prefix
         if (extensionKey.includes('/static/')) {
           var extensionKeyParts = extensionKey.split('/');
@@ -40,4 +58,24 @@ export var getPageElementCounts = function getPageElementCounts(doc) {
     return acc;
   }, pageElementCounts);
   return pageElementCounts;
+};
+
+/**
+ * Return true is the JSON document contains a table nested within a table
+ */
+var getHasNestedTable = function getHasNestedTable(node) {
+  return reduce(node, function (hasNestedTable, node) {
+    if (hasNestedTable) {
+      return hasNestedTable;
+    }
+    if (node.type === 'table') {
+      return reduce(node, function (acc, node) {
+        if (node.type === 'table') {
+          return true;
+        }
+        return acc;
+      }, false);
+    }
+    return hasNestedTable;
+  }, false);
 };

package/dist/types/styles/index.d.ts

@@ -27,7 +27,7 @@ export { resizerStyles, resizerHandleClassName, resizerHandleTrackClassName, res
 export { gridStyles, GRID_GUTTER } from './shared/grid';
 export { smartCardStyles, FLOATING_TOOLBAR_LINKPICKER_CLASSNAME, DATASOURCE_INNER_CONTAINER_CLASSNAME, } from './shared/smartCard';
 export { embedCardStyles, embedSpacingStyles } from './shared/embedCard';
-export { buttonGroupStyle, disableBlueBorderStyles, separatorStyles, wrapperStyle, triggerWrapperStyles, triggerWrapperStylesWithPadding, } from './shared/plugins';
+export { buttonGroupStyle, buttonGroupStyleBeforeVisualRefresh, disableBlueBorderStyles, separatorStyles, wrapperStyle, triggerWrapperStyles, triggerWrapperStylesWithPadding, } from './shared/plugins';
 export { UnsupportedSharedCssClassName, unsupportedStyles } from './shared/unsupported-content';
 export { expandIconWrapperStyle, expandClassNames, expandIconContainerStyle, } from './shared/expand';
 export { sharedExpandStyles } from '../ui/Expand/sharedStyles';

package/dist/types/styles/shared/plugins.d.ts

@@ -1,3 +1,4 @@
+export declare const buttonGroupStyleBeforeVisualRefresh: import("@emotion/react").SerializedStyles;
 export declare const buttonGroupStyle: import("@emotion/react").SerializedStyles;
 export declare const separatorStyles: import("@emotion/react").SerializedStyles;
 export declare const wrapperStyle: import("@emotion/react").SerializedStyles;

package/dist/types/utils/page-element-counts.d.ts

@@ -9,6 +9,9 @@ export type PageElementCounts = {
     macros: {
         [key: string]: number;
     };
+    unexpectedElements: {
+        [key: string]: number;
+    };
 };
 /**
  * Traverses a JSON document and counts the number of unique elements, text formatting and macros.

package/dist/types-ts4.5/styles/index.d.ts

@@ -27,7 +27,7 @@ export { resizerStyles, resizerHandleClassName, resizerHandleTrackClassName, res
 export { gridStyles, GRID_GUTTER } from './shared/grid';
 export { smartCardStyles, FLOATING_TOOLBAR_LINKPICKER_CLASSNAME, DATASOURCE_INNER_CONTAINER_CLASSNAME, } from './shared/smartCard';
 export { embedCardStyles, embedSpacingStyles } from './shared/embedCard';
-export { buttonGroupStyle, disableBlueBorderStyles, separatorStyles, wrapperStyle, triggerWrapperStyles, triggerWrapperStylesWithPadding, } from './shared/plugins';
+export { buttonGroupStyle, buttonGroupStyleBeforeVisualRefresh, disableBlueBorderStyles, separatorStyles, wrapperStyle, triggerWrapperStyles, triggerWrapperStylesWithPadding, } from './shared/plugins';
 export { UnsupportedSharedCssClassName, unsupportedStyles } from './shared/unsupported-content';
 export { expandIconWrapperStyle, expandClassNames, expandIconContainerStyle, } from './shared/expand';
 export { sharedExpandStyles } from '../ui/Expand/sharedStyles';

package/dist/types-ts4.5/styles/shared/plugins.d.ts

@@ -1,3 +1,4 @@
+export declare const buttonGroupStyleBeforeVisualRefresh: import("@emotion/react").SerializedStyles;
 export declare const buttonGroupStyle: import("@emotion/react").SerializedStyles;
 export declare const separatorStyles: import("@emotion/react").SerializedStyles;
 export declare const wrapperStyle: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/utils/page-element-counts.d.ts

@@ -9,6 +9,9 @@ export type PageElementCounts = {
     macros: {
         [key: string]: number;
     };
+    unexpectedElements: {
+        [key: string]: number;
+    };
 };
 /**
  * Traverses a JSON document and counts the number of unique elements, text formatting and macros.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "98.2.4",
+	"version": "98.2.6",
 	"description": "A package that contains common classes and components for editor and renderer",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -113,7 +113,7 @@
 	"dependencies": {
 		"@atlaskit/activity-provider": "^2.5.0",
 		"@atlaskit/adf-schema": "^46.1.0",
-		"@atlaskit/adf-utils": "^19.14.0",
+		"@atlaskit/adf-utils": "^19.15.0",
 		"@atlaskit/analytics-listeners": "^8.13.0",
 		"@atlaskit/analytics-namespaced-context": "^6.12.0",
 		"@atlaskit/analytics-next": "^10.2.0",
@@ -154,7 +154,7 @@
 		"@atlaskit/spinner": "^16.3.0",
 		"@atlaskit/task-decision": "^17.11.0",
 		"@atlaskit/textfield": "^6.7.0",
-		"@atlaskit/tmp-editor-statsig": "^2.32.0",
+		"@atlaskit/tmp-editor-statsig": "^2.33.0",
 		"@atlaskit/tokens": "^2.5.0",
 		"@atlaskit/tooltip": "^19.0.0",
 		"@atlaskit/width-detector": "^4.3.0",