@atlaskit/editor-common 82.3.0 → 82.5.0

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # @atlaskit/editor-common
 
+## 82.5.0
+
+### Minor Changes
+
+- [#108718](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/108718)
+  [`1aad4f15416c2`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/1aad4f15416c2) -
+  [EDF-737] Add content warning to the floating toolbar of the ai panels, extended extensions
+  floating toolbar API to allow custom JSX
+- [#108805](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/108805)
+  [`5c0926002a5ac`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5c0926002a5ac) -
+  Add new element drag and drop analytic events
+
+### Patch Changes
+
+- [#110426](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110426)
+  [`f423990451a12`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f423990451a12) -
+  [ED-23348] Fixed the feature flag set-up for the text highlight decorator
+
+## 82.4.0
+
+### Minor Changes
+
+- [#107302](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/107302)
+  [`b1279657d678b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b1279657d678b) -
+  [ux] [ED-23162] Add keyboard shortcut to toggle highlight color palette
+
 ## 82.3.0
 
 ### Minor Changes

package/dist/cjs/analytics/types/element-events.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

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

@@ -15,6 +15,7 @@ var ACTION = exports.ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["ACTIVATED"] = "activated";
   ACTION["ADDED"] = "added";
   ACTION["BROWSER_FREEZE"] = "browserFreeze";
+  ACTION["CANCELLED"] = "cancelled";
   ACTION["CAUGHT_DOM_ERROR"] = "caughtDomError";
   ACTION["CHANGED_BACKGROUND_COLOR"] = "changedBackgroundColor";
   ACTION["CHANGED_ICON"] = "changedIcon";
@@ -40,6 +41,7 @@ var ACTION = exports.ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["DISMISSED"] = "dismissed";
   ACTION["DISPATCHED_INVALID_TRANSACTION"] = "dispatchedInvalidTransaction";
   ACTION["DISPATCHED_VALID_TRANSACTION"] = "dispatchedValidTransaction";
+  ACTION["DRAGGED"] = "dragged";
   ACTION["EDITED"] = "edited";
   ACTION["EDITOR_CRASHED"] = "unhandledErrorCaught";
   ACTION["EDITOR_CRASHED_ADDITIONAL_INFORMATION"] = "unhandledErrorCaughtAdditionalInfov2";
@@ -154,6 +156,7 @@ var INPUT_METHOD = exports.INPUT_METHOD = /*#__PURE__*/function (INPUT_METHOD) {
   INPUT_METHOD["CONFIG_PANEL"] = "configPanel";
   INPUT_METHOD["CONTEXT_MENU"] = "contextMenu";
   INPUT_METHOD["DRAG_AND_DROP"] = "dragAndDrop";
+  INPUT_METHOD["DRAG"] = "drag";
   INPUT_METHOD["EXTERNAL"] = "external";
   INPUT_METHOD["EXTENSION_API"] = "extensionApi";
   INPUT_METHOD["FLOATING_TB"] = "floatingToolbar";
@@ -231,6 +234,9 @@ var ACTION_SUBJECT = exports.ACTION_SUBJECT = /*#__PURE__*/function (ACTION_SUBJ
   ACTION_SUBJECT["LOOM"] = "loom";
   ACTION_SUBJECT["MULTI_BODIED_EXTENSION"] = "multiBodiedExtension";
   ACTION_SUBJECT["BODIED_EXTENSION"] = "bodiedExtension";
+  ACTION_SUBJECT["DROP_TARGET"] = "dropTarget";
+  ACTION_SUBJECT["DRAG"] = "drag";
+  ACTION_SUBJECT["ELEMENT"] = "element";
   return ACTION_SUBJECT;
 }({});
 var ACTION_SUBJECT_ID = exports.ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
@@ -260,6 +266,8 @@ var ACTION_SUBJECT_ID = exports.ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTIO
   ACTION_SUBJECT_ID["DECISION"] = "decision";
   ACTION_SUBJECT_ID["DIVIDER"] = "divider";
   ACTION_SUBJECT_ID["EDIT_LINK"] = "editLink";
+  ACTION_SUBJECT_ID["ELEMENT_DRAG_HANDLE"] = "elementDragHandle";
+  ACTION_SUBJECT_ID["ELEMENT_DROP_TARGET"] = "elementDropTarget";
   ACTION_SUBJECT_ID["EMBEDS"] = "embeds";
   ACTION_SUBJECT_ID["EMOJI"] = "emoji";
   ACTION_SUBJECT_ID["EXPAND"] = "expand";

package/dist/cjs/collab/index.js

@@ -128,7 +128,7 @@ var TELEPOINTER_DIM_CLASS = exports.TELEPOINTER_DIM_CLASS = 'telepointer-dim';
 
 // ED-22557: Safely convert to object styling
 // Disable top: -14px since it is necessary to align to cursor
-// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/design-system/no-exported-css
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/design-system/no-exported-css, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var telepointerStyle = exports.telepointerStyle = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror .telepointer {\n\t\tposition: relative;\n\t\ttransition: opacity 200ms;\n\n\t\t&.telepointer-selection {\n\t\t\tline-height: 1.2;\n\t\t\tpointer-events: none;\n\t\t\tuser-select: none;\n\t\t}\n\n\t\t&.telepointer-selection-badge::after {\n\t\t\tcontent: attr(data-initial);\n\t\t\tposition: absolute;\n\t\t\tdisplay: block;\n\t\t\ttop: -14px;\n\t\t\tfont-size: ", ";\n\t\t\tpadding: ", ";\n\t\t\tcolor: ", ";\n\t\t\tleft: 0px;\n\t\t\tborder-radius: 2px 2px 2px 0;\n\t\t\tline-height: initial;\n\t\t}\n\n\t\t&.", " {\n\t\t\topacity: 0.2;\n\t\t}\n\n\t\t", ";\n\t}\n"])), (0, _editorSharedStyles.relativeFontSizeToBase16)(9), "var(--ds-space-025, 2px)", "var(--ds-text-inverse, #FFFFFF)", TELEPOINTER_DIM_CLASS, _editorSharedStyles.avatarColors.map(function (color, index) {
   return telepointerColorStyle(color, index);
 }));

package/dist/cjs/element-browser/ViewMore.js

@@ -37,6 +37,7 @@ var ViewMore = exports.ViewMore = function ViewMore(_ref) {
     "aria-describedby": item.title,
     "data-testid": "view-more-elements-item"
     // @ts-ignore Overriding Menu styles is not supported
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     ,
     css: (0, _react2.css)({
       padding: "0px ".concat("var(--ds-space-150, 12px)")

package/dist/cjs/element-browser/components/CategoryList.js

@@ -191,9 +191,11 @@ function CategoryListItem(_ref2) {
   }, category.title));
 }
 var buttonWrapper = (0, _react2.css)((0, _defineProperty2.default)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: "".concat(_constants.GRID_SIZE * 4, "px"),
   margin: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-050, 4px)", " ", "var(--ds-space-050, 4px)", " 0")
 }, "@media (min-width: ".concat(_constants.DEVICE_BREAKPOINT_NUMBERS.medium, "px)"), {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   ':not(:last-child)': {
     marginBottom: 0
   }

package/dist/cjs/element-browser/components/ElementList/ElementList.js

@@ -39,16 +39,20 @@ 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 && Object.prototype.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 ICON_HEIGHT = exports.ICON_HEIGHT = 40;
 var ICON_WIDTH = exports.ICON_WIDTH = 40;
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var itemIcon = exports.itemIcon = (0, _react2.css)({
   width: "".concat(ICON_WIDTH, "px"),
   height: "".concat(ICON_HEIGHT, "px"),
   overflow: 'hidden',
   border: "1px solid ".concat("var(--ds-border, rgba(223, 225, 229, 0.5))"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   borderRadius: "".concat((0, _constants.borderRadius)(), "px"),
   boxSizing: 'border-box',
   display: 'flex',
   justifyContent: 'center',
   alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   div: {
     width: "".concat(ICON_WIDTH, "px"),
     height: "".concat(ICON_HEIGHT, "px")
@@ -181,8 +185,11 @@ function ElementList(_ref) {
         columnIndex: columnIndex,
         parent: parent
       }, (0, _react2.jsx)("div", {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         style: style,
-        key: key,
+        key: key
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766 -- Ignored via go/DSP-18766
+        ,
         className: "element-item-wrapper",
         css: elementItemWrapper,
         onKeyDown: (0, _platformFeatureFlags.getBooleanFF)('platform.editor.a11y-focus-order-for-element-browser-categories_ztiw1') ? function (e) {
@@ -385,21 +392,28 @@ var elementItemsWrapper = (0, _react2.css)({
   justifyContent: 'flex-start',
   overflow: 'hidden',
   padding: "var(--ds-space-025, 2px)",
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '.ReactVirtualized__Collection, .ReactVirtualized__Grid': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     borderRadius: '3px',
     outline: 'none',
     '&:focus': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       boxShadow: "0 0 0 ".concat(_constants2.ELEMENT_LIST_PADDING, "px ", "var(--ds-border-focused, ".concat(_colors.B100, ")"))
     }
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '.ReactVirtualized__Collection__innerScrollContainer, .ReactVirtualized__Grid__innerScrollContainer': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
     "div[class='element-item-wrapper']:last-child": {
       paddingBottom: "var(--ds-space-050, 4px)"
     }
   }
 });
 var elementItemWrapper = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   div: {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     button: {
       minHeight: '75px',
       alignItems: 'flex-start',
@@ -426,8 +440,11 @@ var multilineStyle = (0, _react2.css)({
   WebkitLineClamp: 2,
   WebkitBoxOrient: 'vertical'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 var itemDescription = (0, _react2.css)(multilineStyle, {
   overflow: 'hidden',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   fontSize: (0, _editorSharedStyles.relativeFontSizeToBase16)(11.67),
   color: "var(--ds-text-subtle, ".concat(_colors.N200, ")"),
   marginTop: "var(--ds-space-025, 2px)"
@@ -452,6 +469,7 @@ var itemAfter = (0, _react2.css)({
   marginBottom: "var(--ds-space-negative-025, -2px)"
 });
 var itemIconStyle = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   img: {
     height: '40px',
     width: '40px',

package/dist/cjs/element-browser/components/ElementSearch.js

@@ -83,67 +83,79 @@ function ElementSearch(_ref) {
   var assistiveMessage = getFormattedMessage(items === null || items === void 0 ? void 0 : items.length);
   var isInputNotFocusedAndItemSelected = !inputFocused && selectedItemIndex !== undefined;
   var ariaActiveDescendant = isInputNotFocusedAndItemSelected ? "searched-item-".concat(selectedItemIndex) : undefined;
-  return (0, _react2.jsx)("div", {
-    css: [wrapper, mode === _types.Modes.inline && wrapperInline]
-  }, (0, _react2.jsx)(_textfield.default, {
-    ref: ref,
-    onChange: onChange,
-    onClick: onClick,
-    onFocus: onFocus,
-    onKeyDown: onKeyDown,
-    onBlur: onBlur,
-    elemBeforeInput: (0, _react2.jsx)("div", {
-      css: elementBeforeInput,
-      "data-testid": "element_search__element_before_input",
-      "aria-hidden": "true"
-    }, (0, _react2.jsx)(_search.default, {
-      size: "medium",
-      label: "Advanced search",
-      primaryColor: "inherit"
-    })),
-    elemAfterInput: (0, _react2.jsx)("div", {
-      css: elementAfterInput,
-      "data-testid": "element_search__element_after_input"
-    }, (0, _react2.jsx)("div", {
-      css: styledShortcut
-    }, "\u23CE ", formatMessage(_messages.default.elementAfterInputMessage))),
-    placeholder: formatMessage(_messages.default.placeHolderMessage),
-    "aria-label": "search",
-    "aria-labelledby": "search-assistive"
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: "js-search-input",
-    role: "combobox",
-    "aria-activedescendant": ariaActiveDescendant,
-    value: searchTerm
-  }), (0, _react2.jsx)("span", {
-    id: "search-assistive",
-    ref: assistiveTextRef,
-    "aria-live": "polite",
-    "aria-atomic": "true"
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: "assistive"
-  }, assistiveMessage));
+  return (
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    (0, _react2.jsx)("div", {
+      css: [wrapper, mode === _types.Modes.inline && wrapperInline]
+    }, (0, _react2.jsx)(_textfield.default, {
+      ref: ref,
+      onChange: onChange,
+      onClick: onClick,
+      onFocus: onFocus,
+      onKeyDown: onKeyDown,
+      onBlur: onBlur,
+      elemBeforeInput: (0, _react2.jsx)("div", {
+        css: elementBeforeInput,
+        "data-testid": "element_search__element_before_input",
+        "aria-hidden": "true"
+      }, (0, _react2.jsx)(_search.default, {
+        size: "medium",
+        label: "Advanced search",
+        primaryColor: "inherit"
+      })),
+      elemAfterInput: (0, _react2.jsx)("div", {
+        css: elementAfterInput,
+        "data-testid": "element_search__element_after_input"
+      }, (0, _react2.jsx)("div", {
+        css: styledShortcut
+      }, "\u23CE ", formatMessage(_messages.default.elementAfterInputMessage))),
+      placeholder: formatMessage(_messages.default.placeHolderMessage),
+      "aria-label": "search",
+      "aria-labelledby": "search-assistive"
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      ,
+      className: "js-search-input",
+      role: "combobox",
+      "aria-activedescendant": ariaActiveDescendant,
+      value: searchTerm
+    }), (0, _react2.jsx)("span", {
+      id: "search-assistive",
+      ref: assistiveTextRef,
+      "aria-live": "polite",
+      "aria-atomic": "true"
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      ,
+      className: "assistive"
+    }, assistiveMessage))
+  );
 }
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 var styledShortcut = (0, _react2.css)(_shortcut.shortcutStyle, {
   padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-100, 8px)"),
   width: "var(--ds-space-600, 48px)"
 });
 var wrapper = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > [data-ds--text-field--container]': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     height: "".concat(_constants.GRID_SIZE * 6, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     borderRadius: "".concat(_constants.GRID_SIZE, "px"),
     flex: '1 1 100%',
     overflow: 'visible',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '& > [data-ds--text-field--input]': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       fontSize: (0, _editorSharedStyles.relativeFontSizeToBase16)(14),
       padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-075, 6px)", " ", "var(--ds-space-100, 8px)", " 0")
     }
   }
 });
 var wrapperInline = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > [data-ds--text-field--container]': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     height: "".concat(_constants.GRID_SIZE * 5, "px"),
     flex: 'none',
     overflow: 'revert'
@@ -152,6 +164,7 @@ var wrapperInline = (0, _react2.css)({
 var elementBeforeInput = (0, _react2.css)({
   margin: "1px ".concat("var(--ds-space-075, 6px)", " 0 ", "var(--ds-space-100, 8px)"),
   color: "var(--ds-icon, ".concat(_colors.N200, ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   'span, svg': {
     height: '20px',
     width: '20px'
@@ -159,6 +172,7 @@ var elementBeforeInput = (0, _react2.css)({
 });
 var elementAfterInput = (0, _react2.css)({
   margin: "0 ".concat("var(--ds-space-100, 8px)"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: _constants.SEARCH_ITEM_HEIGHT_WIDTH,
   textAlign: 'center'
 });

package/dist/cjs/element-browser/components/StatelessElementBrowser.js

@@ -35,9 +35,13 @@ var baseBrowserContainerStyles = (0, _react2.css)({
   height: '100%',
   minHeight: '-webkit-fill-available'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 var mobileElementBrowserContainer = (0, _react2.css)(baseBrowserContainerStyles, {
   flexDirection: 'column'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 var elementBrowserContainer = (0, _react2.css)(baseBrowserContainerStyles, {
   flexDirection: 'row'
 });
@@ -47,20 +51,28 @@ var baseSidebarStyles = (0, _react2.css)({
   overflowX: 'auto',
   overflowY: 'hidden'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 var mobileSideBar = (0, _react2.css)(baseSidebarStyles, {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   flex: "0 0 ".concat(_constants.INLINE_SIDEBAR_HEIGHT),
   padding: "var(--ds-space-150, 12px)".concat(" ", "var(--ds-space-150, 12px)", " 0 ", "var(--ds-space-150, 12px)")
 });
 var mobileSideBarShowCategories = (0, _react2.css)({
   flex: '0 0 auto'
 });
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 var sideBar = (0, _react2.css)(baseSidebarStyles, {
   flex: "0 0 'auto'"
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 var sideBarShowCategories = (0, _react2.css)(baseSidebarStyles, {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   flex: "0 0 ".concat(_constants.SIDEBAR_WIDTH)
 });
 var sidebarHeading = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   flex: "0 0 ".concat(_constants.SIDEBAR_HEADING_WRAPPER_HEIGHT),
   display: 'inline-flex',
   alignItems: 'center',
@@ -74,6 +86,8 @@ var mobileMainContent = (0, _react2.css)({
   overflowY: 'auto',
   height: '100%'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 var mainContent = (0, _react2.css)(mobileMainContent, {
   marginLeft: "var(--ds-space-200, 16px)",
   height: 'auto'
@@ -85,14 +99,18 @@ var mobileCategoryListWrapper = (0, _react2.css)({
   display: 'flex',
   overflowX: 'auto',
   padding: "var(--ds-space-200, 8px)".concat(" 0 ", "var(--ds-space-200, 16px)", " 0"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   minHeight: "".concat(_constants.GRID_SIZE * 4, "px"),
   overflow: '-moz-scrollbars-none',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '&::-webkit-scrollbar': {
     display: 'none'
   },
   scrollbarWidth: 'none',
   MsOverflowStyle: 'none'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 var categoryListWrapper = (0, _react2.css)(mobileCategoryListWrapper, {
   padding: 0,
   marginTop: "var(--ds-space-200, 24px)",

package/dist/cjs/extensibility/Extension/Extension/index.js

@@ -117,7 +117,9 @@ function ExtensionWithPluginState(props) {
     "data-layout": node.attrs.layout
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
-    className: classNames,
+    className: classNames
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
+    ,
     css: _styles2.wrapperStyle
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
     ,
@@ -135,6 +137,7 @@ function ExtensionWithPluginState(props) {
     className: 'extension-overlay',
     css: _styles.overlay
   }), (0, _react2.jsx)("div", {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: _styles2.header,
     contentEditable: false
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -145,11 +148,12 @@ function ExtensionWithPluginState(props) {
     node: node,
     showMacroInteractionDesignUpdates: showMacroInteractionDesignUpdates
   }), children), hasBody &&
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
   (0, _react2.jsx)("div", {
     css: newContentStyles,
     className: newContentClassNames
   }, (0, _react2.jsx)("div", {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: _styles2.content,
     ref: handleContentDOMRef
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766

package/dist/cjs/extensibility/Extension/Extension/styles.js

@@ -8,36 +8,49 @@ var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
 var _styles = require("../styles");
 var widerLayoutClassName = exports.widerLayoutClassName = 'wider-layout';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 var wrapperStyle = exports.wrapperStyle = (0, _react.css)(_styles.wrapperDefault, {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.without-frame': {
     background: 'transparent'
   },
   cursor: 'pointer',
   width: '100%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '.extension-overflow-wrapper:not(.with-body)': {
     overflowX: 'auto'
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-bodied-border': {
     boxShadow: "0 0 0 1px ".concat("var(--ds-border, ".concat(_colors.N30, ")"))
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-hover-border': {
     boxShadow: "0 0 0 1px ".concat("var(--ds-border-input, ".concat(_colors.N500, ")"))
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-margin-styles': {
     margin: "0 ".concat("var(--ds-space-negative-150, -12px)"),
     padding: "0 ".concat("var(--ds-space-150, 12px)")
   }
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var header = exports.header = (0, _react.css)({
   padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-050, 4px)", " 0px"),
   verticalAlign: 'middle',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '&.with-children:not(.without-frame)': {
     padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-100, 8px)", " ", "var(--ds-space-100, 8px)")
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.without-frame': {
     padding: 0
   }
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var content = exports.content = (0, _react.css)({
   padding: "var(--ds-space-100, 8px)",
   background: "var(--ds-surface, white)",
@@ -45,19 +58,26 @@ var content = exports.content = (0, _react.css)({
   borderRadius: "var(--ds-border-radius, 3px)",
   cursor: 'initial',
   width: '100%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.remove-border': {
     border: 'none'
   }
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var contentWrapper = exports.contentWrapper = (0, _react.css)({
   padding: "0 ".concat("var(--ds-space-100, 8px)", " ", "var(--ds-space-100, 8px)"),
   display: 'flex',
   justifyContent: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-padding-styles': {
     padding: "var(--ds-space-100, 8px)"
   }
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var overflowWrapperStyles = exports.overflowWrapperStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-margin-styles': {
     margin: "0 ".concat("var(--ds-space-negative-150, -12px)")
   }

package/dist/cjs/extensibility/Extension/InlineExtension/index.js

@@ -51,7 +51,9 @@ var InlineExtension = function InlineExtension(props) {
     showMacroInteractionDesignUpdates: showMacroInteractionDesignUpdates,
     setIsNodeHovered: setIsNodeHovered
   }), (0, _react2.jsx)("div", {
-    "data-testid": "inline-extension-wrapper",
+    "data-testid": "inline-extension-wrapper"
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
+    ,
     css: [_styles2.wrapperStyle, extendedInlineExtension && _styles2.inlineWrapperStyles]
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,

package/dist/cjs/extensibility/Extension/InlineExtension/styles.js

@@ -7,10 +7,12 @@ exports.wrapperStyle = exports.inlineWrapperStyles = void 0;
 var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
 var _styles = require("../styles");
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 var wrapperStyle = exports.wrapperStyle = (0, _react.css)(_styles.wrapperDefault, {
   cursor: 'pointer',
   display: 'inline-flex',
   margin: "1px 1px ".concat("var(--ds-space-050, 4px)"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '> img': {
     borderRadius: "var(--ds-border-radius, 3px)"
   },
@@ -20,19 +22,25 @@ var wrapperStyle = exports.wrapperStyle = (0, _react.css)(_styles.wrapperDefault
     width: '1px',
     content: "''"
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-children': {
     padding: 0,
     background: "var(--ds-background-neutral-subtle, white)"
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-hover-border': {
     boxShadow: "0 0 0 1px ".concat("var(--ds-border-input, ".concat(_colors.N500, ")"))
   }
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var inlineWrapperStyles = exports.inlineWrapperStyles = (0, _react.css)({
   maxWidth: '100%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   'tr &': {
     maxWidth: 'inherit'
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '.rich-media-item': {
     maxWidth: '100%'
   }

package/dist/cjs/extensibility/Extension/Lozenge/ExtensionLabel.js

@@ -20,11 +20,13 @@ var labelStyles = (0, _react2.css)({
   // Unfortunately, these need to be these exact numbers - otherwise there will be a noticeable gap/overlap
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
   top: '-19px',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.inline': {
     // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
     top: '-18px',
     marginLeft: "var(--ds-space-150, 12px)"
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.show-label': {
     cursor: 'pointer',
     background: "var(--ds-background-accent-gray-subtle-pressed, ".concat(_colors.N40, ")"),
@@ -33,14 +35,17 @@ var labelStyles = (0, _react2.css)({
   },
   borderRadius: "var(--ds-border-radius, 3px)".concat(" ", "var(--ds-border-radius, 3px)", " 0 0"),
   lineHeight: 1,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.nested': {
     // Need to add indent if the node is nested since we removed previous indentation styles to make it fit properly
     // in the nested component
     marginLeft: "var(--ds-space-150, 12px)"
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.bodied-background': {
     background: "var(--ds-surface, ".concat(_colors.N0, ")")
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.bodied-border': {
     boxShadow: "0 0 0 1px ".concat("var(--ds-border, ".concat(_colors.N30, ")"))
   }
@@ -54,6 +59,7 @@ var containerStyles = (0, _react2.css)({
   textAlign: 'left',
   zIndex: 1,
   position: 'relative',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.bodied': {
     marginTop: "var(--ds-space-300, 24px)"
   }
@@ -89,7 +95,9 @@ var ExtensionLabel = exports.ExtensionLabel = function ExtensionLabel(_ref) {
   }, [setIsNodeHovered]);
   return (0, _react2.jsx)("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    css: containerStyles,
+    css: containerStyles
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+    ,
     className: containerClassNames
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
     ,