@atlaskit/editor-plugin-alignment 2.0.0 → 3.0.1

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @atlaskit/editor-plugin-alignment
 
+## 3.0.1
+
+### Patch Changes
+
+- [#120533](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/120533)
+  [`f1bec731e278f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f1bec731e278f) -
+  Adds a `sideEffects` field to ensure this package does not have Compiled styles tree-shaken in the
+  future to avoid an accidental regression.
+
+  This is related to
+  https://community.developer.atlassian.com/t/rfc-73-migrating-our-components-to-compiled-css-in-js/85953
+
+## 3.0.0
+
+### Major Changes
+
+- [#117947](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/117947)
+  [`2c672e958d395`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2c672e958d395) -
+  [ux] EDF-2346 - [MD] Remove emotion references
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 2.0.0
 
 ### Major Changes

package/dist/cjs/ui/Alignment/index.compiled.css

@@ -0,0 +1,8 @@
+
+._1fvdglyw button:not([disabled]):after{border:none}._19bvu2gc{padding-left:var(--ds-space-100,8px)}
+._1e0c1txw{display:flex}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._gy1pv77o{column-gap:var(--ds-space-025,2px)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._p12f1q5e{max-width:var(--_4v9t68)}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}

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

@@ -1,23 +1,26 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
 "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 = require("@emotion/react");
+require("./index.compiled.css");
+var React = _interopRequireWildcard(require("react"));
+var _runtime = require("@compiled/react/runtime");
 var _reactIntlNext = require("react-intl-next");
 var _keymaps = require("@atlaskit/editor-common/keymaps");
 var _messages = require("@atlaskit/editor-common/messages");
 var _iconMap = require("../ToolbarAlignment/icon-map");
 var _AlignmentButton = _interopRequireDefault(require("./AlignmentButton"));
-var _styles = require("./styles");
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var alignmentWrapper = null;
 
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- This rule thinks this isn't a `css()` call due to the name mapping
+var alignmentWrapperStylesUnbounded = null;
 var alignCenterKeyboardShortcut = _keymaps.alignCenter;
 var alignRightKeyboardShortcut = _keymaps.alignRight;
 var alignmentOptions = [{
@@ -38,21 +41,23 @@ function Alignment(_ref) {
     selectedAlignment = _ref.selectedAlignment,
     className = _ref.className,
     intl = _ref.intl;
-  return (0, _react.jsx)("div", {
+  return /*#__PURE__*/React.createElement("div", {
     "data-testid": "alignment-buttons"
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     ,
-    css: _styles.alignmentWrapper
+
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: className
+    className: (0, _runtime.ax)(["_1e0c1txw _ca0qze3t _n3tdze3t _19bvu2gc _u5f3u2gc _p12f1q5e _gy1pv77o", "_1fvdglyw", className]),
+    style: {
+      "--_4v9t68": (0, _runtime.ix)("".concat(3 * 32 + 2 * 2, "px"))
+    }
   }, alignmentOptions.map(function (alignment) {
     var value = alignment.value,
       title = alignment.title,
       shortcut = alignment.shortcut;
     var message = intl.formatMessage(title);
-    return (0, _react.jsx)(_AlignmentButton.default, {
-      content: (0, _react.jsx)(_iconMap.IconMap, {
+    return /*#__PURE__*/React.createElement(_AlignmentButton.default, {
+      content: /*#__PURE__*/React.createElement(_iconMap.IconMap, {
         alignment: value
       }),
       key: value,

package/dist/cjs/ui/FloatingToolbarComponent.js

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.FloatingToolbarComponent = FloatingToolbarComponent;
 var _react = _interopRequireWildcard(require("react"));
 var _hooks = require("@atlaskit/editor-common/hooks");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _editorCommands = require("../editor-commands");
 var _types = require("../pm-plugins/types");
 var _ToolbarAlignment = _interopRequireDefault(require("./ToolbarAlignment"));
@@ -27,7 +28,7 @@ function FloatingToolbarComponent(_ref) {
   }, [editorView]);
   return /*#__PURE__*/_react.default.createElement(_ToolbarAlignment.default, {
     pluginState: alignmentState,
-    isReducedSpacing: FloatingToolbarSettings.isToolbarReducedSpacing,
+    isReducedSpacing: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? false : FloatingToolbarSettings.isToolbarReducedSpacing,
     changeAlignment: changeAlignmentCallback
     // Ignored via go/ees005
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion

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

@@ -1,3 +1,4 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -5,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.AlignmentToolbar = void 0;
+var _runtime = require("@compiled/react/runtime");
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
@@ -12,23 +14,16 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
 var _reactIntlNext = require("react-intl-next");
 var _messages = require("@atlaskit/editor-common/messages");
-var _styles = require("@atlaskit/editor-common/styles");
+var _ui = require("@atlaskit/editor-common/ui");
 var _uiMenu = require("@atlaskit/editor-common/ui-menu");
-var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-down"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _types = require("../../pm-plugins/types");
 var _Alignment = _interopRequireDefault(require("../Alignment"));
 var _iconMap = require("./icon-map");
-var _styles2 = require("./styles");
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
- * @jsxRuntime classic
- * @jsx jsx
- */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 // eslint-disable-next-line @repo/internal/react/no-class-components
 var AlignmentToolbar = exports.AlignmentToolbar = /*#__PURE__*/function (_React$Component) {
   function AlignmentToolbar() {
@@ -102,77 +97,50 @@ var AlignmentToolbar = exports.AlignmentToolbar = /*#__PURE__*/function (_React$
       }) || (0, _experiments.editorExperiment)('platform_editor_contextual_formatting_toolbar_v2', 'variant2', {
         exposure: true
       }) ? 'compact' : 'none';
-      return (
-        // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-        (0, _react2.jsx)("span", {
-          css: _styles2.wrapper
-        }, (0, _react2.jsx)(_uiMenu.DropdownContainer, {
-          mountTo: popupsMountPoint,
-          boundariesElement: popupsBoundariesElement,
-          scrollableElement: popupsScrollableElement,
-          isOpen: isOpen,
-          handleClickOutside: function handleClickOutside(event) {
-            if (event instanceof MouseEvent) {
-              _this2.hide({
-                isOpen: false,
-                event: event
-              });
-            }
-          },
-          handleEscapeKeydown: this.hideOnEscape,
-          arrowKeyNavigationProviderOptions: {
-            type: _uiMenu.ArrowKeyNavigationType.MENU
-          },
-          fitWidth: 112,
-          fitHeight: 80,
-          closeOnTab: true,
-          trigger: (0, _react2.jsx)(_uiMenu.ToolbarButton, {
-            spacing: isReducedSpacing ? reducedSpacing : 'default',
-            disabled: disabled,
-            selected: isOpen,
-            title: title
-            // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-            ,
-            className: "align-btn",
-            "aria-label": title,
-            "aria-expanded": isOpen,
-            "aria-haspopup": true,
-            onClick: this.toggleOpen,
-            onKeyDown: this.toggleOpenByKeyboard,
-            iconBefore: (0, _react2.jsx)("div", {
-              css:
-              // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
-              (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ?
-              // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-              _styles.triggerWrapperStylesWithPadding :
-              // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-              _styles2.triggerWrapper
-            }, (0, _react2.jsx)(_iconMap.IconMap, {
-              alignment: alignment
-            }), (0, _react2.jsx)("span", {
-              css: [
-              // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
-              (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') &&
-              //eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-              _styles.expandIconContainerStyle]
-            }, (0, _react2.jsx)(_chevronDown.default, {
-              label: "",
-              color: "currentColor",
-              LEGACY_margin: "0 0 0 -8px"
-            }))),
-            ref: this.toolbarItemRef
-          })
-        }, (0, _react2.jsx)(_Alignment.default, {
-          onClick: function onClick(align) {
-            return _this2.changeAlignment(align, false);
-          },
-          selectedAlignment: alignment
-        })), !(api !== null && api !== void 0 && api.primaryToolbar) && /* eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage */
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-        (0, _react2.jsx)("span", {
-          css: _styles.separatorStyles
-        }))
-      );
+      return /*#__PURE__*/_react.default.createElement(_ui.ToolbarDropdownWrapper, null, /*#__PURE__*/_react.default.createElement(_uiMenu.DropdownContainer, {
+        mountTo: popupsMountPoint,
+        boundariesElement: popupsBoundariesElement,
+        scrollableElement: popupsScrollableElement,
+        isOpen: isOpen,
+        handleClickOutside: function handleClickOutside(event) {
+          if (event instanceof MouseEvent) {
+            _this2.hide({
+              isOpen: false,
+              event: event
+            });
+          }
+        },
+        handleEscapeKeydown: this.hideOnEscape,
+        arrowKeyNavigationProviderOptions: {
+          type: _uiMenu.ArrowKeyNavigationType.MENU
+        },
+        fitWidth: 112,
+        fitHeight: 80,
+        closeOnTab: true,
+        trigger: /*#__PURE__*/_react.default.createElement(_uiMenu.ToolbarButton, {
+          spacing: isReducedSpacing ? reducedSpacing : 'default',
+          disabled: disabled,
+          selected: isOpen,
+          title: title
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
+          ,
+          className: "align-btn",
+          "aria-label": title,
+          "aria-expanded": isOpen,
+          "aria-haspopup": true,
+          onClick: this.toggleOpen,
+          onKeyDown: this.toggleOpenByKeyboard,
+          iconBefore: /*#__PURE__*/_react.default.createElement(_ui.ToolbarDropdownTriggerWrapper, null, /*#__PURE__*/_react.default.createElement(_iconMap.IconMap, {
+            alignment: alignment
+          }), /*#__PURE__*/_react.default.createElement(_ui.ToolbarExpandIcon, null)),
+          ref: this.toolbarItemRef
+        })
+      }, /*#__PURE__*/_react.default.createElement(_Alignment.default, {
+        onClick: function onClick(align) {
+          return _this2.changeAlignment(align, false);
+        },
+        selectedAlignment: alignment
+      })), !(api !== null && api !== void 0 && api.primaryToolbar) && /*#__PURE__*/_react.default.createElement(_ui.ToolbarSeparator, null));
     }
   }, {
     key: "componentDidUpdate",

package/dist/es2019/ui/Alignment/index.compiled.css

@@ -0,0 +1,8 @@
+
+._1fvdglyw button:not([disabled]):after{border:none}._19bvu2gc{padding-left:var(--ds-space-100,8px)}
+._1e0c1txw{display:flex}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._gy1pv77o{column-gap:var(--ds-space-025,2px)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._p12f53f4{max-width:75pt}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}

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

@@ -1,15 +1,16 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+import "./index.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import { injectIntl } from 'react-intl-next';
 import { alignCenter, alignLeft, alignRight } from '@atlaskit/editor-common/keymaps';
 import { alignmentMessages } from '@atlaskit/editor-common/messages';
 import { IconMap } from '../ToolbarAlignment/icon-map';
 import AlignmentButton from './AlignmentButton';
-import { alignmentWrapper } from './styles';
+const alignmentWrapper = null;
+
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- This rule thinks this isn't a `css()` call due to the name mapping
+const alignmentWrapperStylesUnbounded = null;
 const alignCenterKeyboardShortcut = alignCenter;
 const alignRightKeyboardShortcut = alignRight;
 const alignmentOptions = [{
@@ -31,14 +32,13 @@ function Alignment({
   className,
   intl
 }) {
-  return jsx("div", {
+  return /*#__PURE__*/React.createElement("div", {
     "data-testid": "alignment-buttons"
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     ,
-    css: alignmentWrapper
+
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: className
+    className: ax(["_1e0c1txw _ca0qze3t _n3tdze3t _19bvu2gc _u5f3u2gc _p12f53f4 _gy1pv77o", "_1fvdglyw", className])
   }, alignmentOptions.map(alignment => {
     const {
       value,
@@ -46,8 +46,8 @@ function Alignment({
       shortcut
     } = alignment;
     const message = intl.formatMessage(title);
-    return jsx(AlignmentButton, {
-      content: jsx(IconMap, {
+    return /*#__PURE__*/React.createElement(AlignmentButton, {
+      content: /*#__PURE__*/React.createElement(IconMap, {
         alignment: value
       }),
       key: value,

package/dist/es2019/ui/FloatingToolbarComponent.js

@@ -1,5 +1,6 @@
 import React, { useCallback } from 'react';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { changeAlignment } from '../editor-commands';
 import { ToolbarType } from '../pm-plugins/types';
 import ToolbarAlignment from './ToolbarAlignment';
@@ -19,7 +20,7 @@ export function FloatingToolbarComponent({
   }, [editorView]);
   return /*#__PURE__*/React.createElement(ToolbarAlignment, {
     pluginState: alignmentState,
-    isReducedSpacing: FloatingToolbarSettings.isToolbarReducedSpacing,
+    isReducedSpacing: editorExperiment('platform_editor_controls', 'variant1') ? false : FloatingToolbarSettings.isToolbarReducedSpacing,
     changeAlignment: changeAlignmentCallback
     // Ignored via go/ees005
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion

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

@@ -1,23 +1,15 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import { alignmentMessages as messages } from '@atlaskit/editor-common/messages';
-import { expandIconContainerStyle, separatorStyles, triggerWrapperStylesWithPadding } from '@atlaskit/editor-common/styles';
+import { ToolbarDropdownTriggerWrapper, ToolbarDropdownWrapper, ToolbarExpandIcon, ToolbarSeparator } from '@atlaskit/editor-common/ui';
 import { ArrowKeyNavigationType, DropdownContainer as Dropdown, ToolbarButton } from '@atlaskit/editor-common/ui-menu';
-import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ToolbarType } from '../../pm-plugins/types';
 import Alignment from '../Alignment';
 import { IconMap } from './icon-map';
-import { triggerWrapper, wrapper } from './styles';
 // eslint-disable-next-line @repo/internal/react/no-class-components
 export class AlignmentToolbar extends React.Component {
   constructor(...args) {
@@ -84,75 +76,48 @@ export class AlignmentToolbar extends React.Component {
     }) || editorExperiment('platform_editor_contextual_formatting_toolbar_v2', 'variant2', {
       exposure: true
     }) ? 'compact' : 'none';
-    return (
-      // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      jsx("span", {
-        css: wrapper
-      }, jsx(Dropdown, {
-        mountTo: popupsMountPoint,
-        boundariesElement: popupsBoundariesElement,
-        scrollableElement: popupsScrollableElement,
-        isOpen: isOpen,
-        handleClickOutside: event => {
-          if (event instanceof MouseEvent) {
-            this.hide({
-              isOpen: false,
-              event
-            });
-          }
-        },
-        handleEscapeKeydown: this.hideOnEscape,
-        arrowKeyNavigationProviderOptions: {
-          type: ArrowKeyNavigationType.MENU
-        },
-        fitWidth: 112,
-        fitHeight: 80,
-        closeOnTab: true,
-        trigger: jsx(ToolbarButton, {
-          spacing: isReducedSpacing ? reducedSpacing : 'default',
-          disabled: disabled,
-          selected: isOpen,
-          title: title
-          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-          ,
-          className: "align-btn",
-          "aria-label": title,
-          "aria-expanded": isOpen,
-          "aria-haspopup": true,
-          onClick: this.toggleOpen,
-          onKeyDown: this.toggleOpenByKeyboard,
-          iconBefore: jsx("div", {
-            css:
-            // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
-            fg('platform-visual-refresh-icons') ?
-            // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-            triggerWrapperStylesWithPadding :
-            // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-            triggerWrapper
-          }, jsx(IconMap, {
-            alignment: alignment
-          }), jsx("span", {
-            css: [
-            // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
-            fg('platform-visual-refresh-icons') &&
-            //eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-            expandIconContainerStyle]
-          }, jsx(ChevronDownIcon, {
-            label: "",
-            color: "currentColor",
-            LEGACY_margin: "0 0 0 -8px"
-          }))),
-          ref: this.toolbarItemRef
-        })
-      }, jsx(Alignment, {
-        onClick: align => this.changeAlignment(align, false),
-        selectedAlignment: alignment
-      })), !(api !== null && api !== void 0 && api.primaryToolbar) && /* eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage */
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-      jsx("span", {
-        css: separatorStyles
-      }))
-    );
+    return /*#__PURE__*/React.createElement(ToolbarDropdownWrapper, null, /*#__PURE__*/React.createElement(Dropdown, {
+      mountTo: popupsMountPoint,
+      boundariesElement: popupsBoundariesElement,
+      scrollableElement: popupsScrollableElement,
+      isOpen: isOpen,
+      handleClickOutside: event => {
+        if (event instanceof MouseEvent) {
+          this.hide({
+            isOpen: false,
+            event
+          });
+        }
+      },
+      handleEscapeKeydown: this.hideOnEscape,
+      arrowKeyNavigationProviderOptions: {
+        type: ArrowKeyNavigationType.MENU
+      },
+      fitWidth: 112,
+      fitHeight: 80,
+      closeOnTab: true,
+      trigger: /*#__PURE__*/React.createElement(ToolbarButton, {
+        spacing: isReducedSpacing ? reducedSpacing : 'default',
+        disabled: disabled,
+        selected: isOpen,
+        title: title
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
+        ,
+        className: "align-btn",
+        "aria-label": title,
+        "aria-expanded": isOpen,
+        "aria-haspopup": true,
+        onClick: this.toggleOpen,
+        onKeyDown: this.toggleOpenByKeyboard,
+        iconBefore: /*#__PURE__*/React.createElement(ToolbarDropdownTriggerWrapper, null, /*#__PURE__*/React.createElement(IconMap, {
+          alignment: alignment
+        }), /*#__PURE__*/React.createElement(ToolbarExpandIcon, null)),
+        ref: this.toolbarItemRef
+      })
+    }, /*#__PURE__*/React.createElement(Alignment, {
+      onClick: align => this.changeAlignment(align, false),
+      selectedAlignment: alignment
+    })), !(api !== null && api !== void 0 && api.primaryToolbar) && /*#__PURE__*/React.createElement(ToolbarSeparator, null));
   }
   componentDidUpdate(prevProps) {
     if (this.props.toolbarType !== ToolbarType.FLOATING && this.state.isOpen) {

package/dist/esm/ui/Alignment/index.compiled.css

@@ -0,0 +1,8 @@
+
+._1fvdglyw button:not([disabled]):after{border:none}._19bvu2gc{padding-left:var(--ds-space-100,8px)}
+._1e0c1txw{display:flex}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._gy1pv77o{column-gap:var(--ds-space-025,2px)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._p12f1q5e{max-width:var(--_4v9t68)}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}

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

@@ -1,15 +1,16 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+import "./index.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import { injectIntl } from 'react-intl-next';
 import { alignCenter, alignLeft, alignRight } from '@atlaskit/editor-common/keymaps';
 import { alignmentMessages } from '@atlaskit/editor-common/messages';
 import { IconMap } from '../ToolbarAlignment/icon-map';
 import AlignmentButton from './AlignmentButton';
-import { alignmentWrapper } from './styles';
+var alignmentWrapper = null;
+
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- This rule thinks this isn't a `css()` call due to the name mapping
+var alignmentWrapperStylesUnbounded = null;
 var alignCenterKeyboardShortcut = alignCenter;
 var alignRightKeyboardShortcut = alignRight;
 var alignmentOptions = [{
@@ -30,21 +31,23 @@ function Alignment(_ref) {
     selectedAlignment = _ref.selectedAlignment,
     className = _ref.className,
     intl = _ref.intl;
-  return jsx("div", {
+  return /*#__PURE__*/React.createElement("div", {
     "data-testid": "alignment-buttons"
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     ,
-    css: alignmentWrapper
+
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: className
+    className: ax(["_1e0c1txw _ca0qze3t _n3tdze3t _19bvu2gc _u5f3u2gc _p12f1q5e _gy1pv77o", "_1fvdglyw", className]),
+    style: {
+      "--_4v9t68": ix("".concat(3 * 32 + 2 * 2, "px"))
+    }
   }, alignmentOptions.map(function (alignment) {
     var value = alignment.value,
       title = alignment.title,
       shortcut = alignment.shortcut;
     var message = intl.formatMessage(title);
-    return jsx(AlignmentButton, {
-      content: jsx(IconMap, {
+    return /*#__PURE__*/React.createElement(AlignmentButton, {
+      content: /*#__PURE__*/React.createElement(IconMap, {
         alignment: value
       }),
       key: value,

package/dist/esm/ui/FloatingToolbarComponent.js

@@ -1,5 +1,6 @@
 import React, { useCallback } from 'react';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { changeAlignment } from '../editor-commands';
 import { ToolbarType } from '../pm-plugins/types';
 import ToolbarAlignment from './ToolbarAlignment';
@@ -17,7 +18,7 @@ export function FloatingToolbarComponent(_ref) {
   }, [editorView]);
   return /*#__PURE__*/React.createElement(ToolbarAlignment, {
     pluginState: alignmentState,
-    isReducedSpacing: FloatingToolbarSettings.isToolbarReducedSpacing,
+    isReducedSpacing: editorExperiment('platform_editor_controls', 'variant1') ? false : FloatingToolbarSettings.isToolbarReducedSpacing,
     changeAlignment: changeAlignmentCallback
     // Ignored via go/ees005
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion

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

@@ -1,30 +1,22 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { ax, ix } from "@compiled/react/runtime";
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import React from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import { alignmentMessages as messages } from '@atlaskit/editor-common/messages';
-import { expandIconContainerStyle, separatorStyles, triggerWrapperStylesWithPadding } from '@atlaskit/editor-common/styles';
+import { ToolbarDropdownTriggerWrapper, ToolbarDropdownWrapper, ToolbarExpandIcon, ToolbarSeparator } from '@atlaskit/editor-common/ui';
 import { ArrowKeyNavigationType, DropdownContainer as Dropdown, ToolbarButton } from '@atlaskit/editor-common/ui-menu';
-import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ToolbarType } from '../../pm-plugins/types';
 import Alignment from '../Alignment';
 import { IconMap } from './icon-map';
-import { triggerWrapper, wrapper } from './styles';
 // eslint-disable-next-line @repo/internal/react/no-class-components
 export var AlignmentToolbar = /*#__PURE__*/function (_React$Component) {
   function AlignmentToolbar() {
@@ -98,77 +90,50 @@ export var AlignmentToolbar = /*#__PURE__*/function (_React$Component) {
       }) || editorExperiment('platform_editor_contextual_formatting_toolbar_v2', 'variant2', {
         exposure: true
       }) ? 'compact' : 'none';
-      return (
-        // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-        jsx("span", {
-          css: wrapper
-        }, jsx(Dropdown, {
-          mountTo: popupsMountPoint,
-          boundariesElement: popupsBoundariesElement,
-          scrollableElement: popupsScrollableElement,
-          isOpen: isOpen,
-          handleClickOutside: function handleClickOutside(event) {
-            if (event instanceof MouseEvent) {
-              _this2.hide({
-                isOpen: false,
-                event: event
-              });
-            }
-          },
-          handleEscapeKeydown: this.hideOnEscape,
-          arrowKeyNavigationProviderOptions: {
-            type: ArrowKeyNavigationType.MENU
-          },
-          fitWidth: 112,
-          fitHeight: 80,
-          closeOnTab: true,
-          trigger: jsx(ToolbarButton, {
-            spacing: isReducedSpacing ? reducedSpacing : 'default',
-            disabled: disabled,
-            selected: isOpen,
-            title: title
-            // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-            ,
-            className: "align-btn",
-            "aria-label": title,
-            "aria-expanded": isOpen,
-            "aria-haspopup": true,
-            onClick: this.toggleOpen,
-            onKeyDown: this.toggleOpenByKeyboard,
-            iconBefore: jsx("div", {
-              css:
-              // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
-              fg('platform-visual-refresh-icons') ?
-              // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-              triggerWrapperStylesWithPadding :
-              // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-              triggerWrapper
-            }, jsx(IconMap, {
-              alignment: alignment
-            }), jsx("span", {
-              css: [
-              // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
-              fg('platform-visual-refresh-icons') &&
-              //eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-              expandIconContainerStyle]
-            }, jsx(ChevronDownIcon, {
-              label: "",
-              color: "currentColor",
-              LEGACY_margin: "0 0 0 -8px"
-            }))),
-            ref: this.toolbarItemRef
-          })
-        }, jsx(Alignment, {
-          onClick: function onClick(align) {
-            return _this2.changeAlignment(align, false);
-          },
-          selectedAlignment: alignment
-        })), !(api !== null && api !== void 0 && api.primaryToolbar) && /* eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage */
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-        jsx("span", {
-          css: separatorStyles
-        }))
-      );
+      return /*#__PURE__*/React.createElement(ToolbarDropdownWrapper, null, /*#__PURE__*/React.createElement(Dropdown, {
+        mountTo: popupsMountPoint,
+        boundariesElement: popupsBoundariesElement,
+        scrollableElement: popupsScrollableElement,
+        isOpen: isOpen,
+        handleClickOutside: function handleClickOutside(event) {
+          if (event instanceof MouseEvent) {
+            _this2.hide({
+              isOpen: false,
+              event: event
+            });
+          }
+        },
+        handleEscapeKeydown: this.hideOnEscape,
+        arrowKeyNavigationProviderOptions: {
+          type: ArrowKeyNavigationType.MENU
+        },
+        fitWidth: 112,
+        fitHeight: 80,
+        closeOnTab: true,
+        trigger: /*#__PURE__*/React.createElement(ToolbarButton, {
+          spacing: isReducedSpacing ? reducedSpacing : 'default',
+          disabled: disabled,
+          selected: isOpen,
+          title: title
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
+          ,
+          className: "align-btn",
+          "aria-label": title,
+          "aria-expanded": isOpen,
+          "aria-haspopup": true,
+          onClick: this.toggleOpen,
+          onKeyDown: this.toggleOpenByKeyboard,
+          iconBefore: /*#__PURE__*/React.createElement(ToolbarDropdownTriggerWrapper, null, /*#__PURE__*/React.createElement(IconMap, {
+            alignment: alignment
+          }), /*#__PURE__*/React.createElement(ToolbarExpandIcon, null)),
+          ref: this.toolbarItemRef
+        })
+      }, /*#__PURE__*/React.createElement(Alignment, {
+        onClick: function onClick(align) {
+          return _this2.changeAlignment(align, false);
+        },
+        selectedAlignment: alignment
+      })), !(api !== null && api !== void 0 && api.primaryToolbar) && /*#__PURE__*/React.createElement(ToolbarSeparator, null));
     }
   }, {
     key: "componentDidUpdate",

package/dist/types/ui/ToolbarAlignment/index.d.ts

@@ -3,7 +3,6 @@
  * @jsx jsx
  */
 import React from 'react';
-import { jsx } from '@emotion/react';
 import type { WrappedComponentProps } from 'react-intl-next';
 import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { AlignmentPlugin } from '../../alignmentPluginType';
@@ -26,7 +25,7 @@ export declare class AlignmentToolbar extends React.Component<Props & WrappedCom
     static displayName: string;
     private toolbarItemRef;
     state: State;
-    render(): jsx.JSX.Element;
+    render(): JSX.Element;
     componentDidUpdate(prevProps: Props): void;
     private changeAlignment;
     private toggleOpen;

package/dist/types-ts4.5/ui/ToolbarAlignment/index.d.ts

@@ -3,7 +3,6 @@
  * @jsx jsx
  */
 import React from 'react';
-import { jsx } from '@emotion/react';
 import type { WrappedComponentProps } from 'react-intl-next';
 import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { AlignmentPlugin } from '../../alignmentPluginType';
@@ -26,7 +25,7 @@ export declare class AlignmentToolbar extends React.Component<Props & WrappedCom
     static displayName: string;
     private toolbarItemRef;
     state: State;
-    render(): jsx.JSX.Element;
+    render(): JSX.Element;
     componentDidUpdate(prevProps: Props): void;
     private changeAlignment;
     private toggleOpen;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-alignment",
-	"version": "2.0.0",
+	"version": "3.0.1",
 	"description": "Alignment plugin for @atlaskit/editor-core",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -12,26 +12,34 @@
 	"module": "dist/esm/index.js",
 	"module:es2019": "dist/es2019/index.js",
 	"types": "dist/types/index.d.ts",
-	"sideEffects": false,
+	"sideEffects": [
+		"**/*.compiled.css"
+	],
 	"atlaskit:src": "src/index.ts",
 	"atlassian": {
 		"team": "Editor: AI",
 		"singleton": true,
 		"runReact18": true
 	},
+	"platform-feature-flags": {
+		"platform-visual-refresh-icons": {
+			"type": "boolean"
+		}
+	},
 	"dependencies": {
 		"@atlaskit/adf-schema": "^47.2.1",
-		"@atlaskit/editor-common": "^100.0.0",
+		"@atlaskit/css": "^0.10.0",
+		"@atlaskit/editor-common": "^100.4.0",
 		"@atlaskit/editor-plugin-primary-toolbar": "^3.0.0",
 		"@atlaskit/editor-plugin-selection-toolbar": "^2.0.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/editor-tables": "^2.9.0",
-		"@atlaskit/icon": "^24.0.0",
+		"@atlaskit/icon": "^24.1.0",
 		"@atlaskit/platform-feature-flags": "1.1.0",
-		"@atlaskit/tmp-editor-statsig": "^3.0.0",
-		"@atlaskit/tokens": "^4.0.0",
+		"@atlaskit/tmp-editor-statsig": "^3.3.0",
+		"@atlaskit/tokens": "^4.2.0",
 		"@babel/runtime": "^7.0.0",
-		"@emotion/react": "^11.7.1"
+		"@compiled/react": "^0.18.2"
 	},
 	"peerDependencies": {
 		"react": "^18.2.0",
@@ -77,8 +85,7 @@
 			],
 			"deprecation": "no-deprecated-imports",
 			"styling": [
-				"emotion",
-				"emotion"
+				"compiled"
 			],
 			"imports": [
 				"import-no-extraneous-disable-for-examples-and-docs"

package/dist/cjs/ui/Alignment/styles.js

@@ -1,24 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.alignmentWrapper = 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
-var alignmentWrapper = exports.alignmentWrapper = (0, _react.css)({
-  padding: "0 ".concat("var(--ds-space-100, 8px)"),
-  maxWidth: "".concat(3 * 32 + 2 * 2, "px"),
-  // 3 buttons * 32px + 2 * 2px gap
-  columnGap: "var(--ds-space-025, 2px)",
-  // add gap between buttons, so they don't crunch each other
-  // 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
-    }
-  }
-});

package/dist/cjs/ui/ToolbarAlignment/styles.js

@@ -1,35 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.wrapper = exports.triggerWrapper = exports.expandIconWrapper = 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
-var triggerWrapper = exports.triggerWrapper = (0, _react.css)({
-  display: 'flex'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var wrapper = exports.wrapper = (0, _react.css)({
-  display: '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
-  '.align-btn': {
-    // eslint-disable-next-line @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 -- Ignored via go/DSP-18766
-var expandIconWrapper = exports.expandIconWrapper = (0, _react.css)({
-  marginLeft: "var(--ds-space-negative-100, -8px)"
-});

package/dist/es2019/ui/Alignment/styles.js

@@ -1,17 +0,0 @@
-// 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
-export const alignmentWrapper = css({
-  padding: `0 ${"var(--ds-space-100, 8px)"}`,
-  maxWidth: `${3 * 32 + 2 * 2}px`,
-  // 3 buttons * 32px + 2 * 2px gap
-  columnGap: "var(--ds-space-025, 2px)",
-  // add gap between buttons, so they don't crunch each other
-  // 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
-    }
-  }
-});

package/dist/es2019/ui/ToolbarAlignment/styles.js

@@ -1,28 +0,0 @@
-// 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
-export const triggerWrapper = css({
-  display: 'flex'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const wrapper = css({
-  display: '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
-  '.align-btn': {
-    // eslint-disable-next-line @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 -- Ignored via go/DSP-18766
-export const expandIconWrapper = css({
-  marginLeft: "var(--ds-space-negative-100, -8px)"
-});

package/dist/esm/ui/Alignment/styles.js

@@ -1,17 +0,0 @@
-// 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
-export var alignmentWrapper = css({
-  padding: "0 ".concat("var(--ds-space-100, 8px)"),
-  maxWidth: "".concat(3 * 32 + 2 * 2, "px"),
-  // 3 buttons * 32px + 2 * 2px gap
-  columnGap: "var(--ds-space-025, 2px)",
-  // add gap between buttons, so they don't crunch each other
-  // 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
-    }
-  }
-});

package/dist/esm/ui/ToolbarAlignment/styles.js

@@ -1,28 +0,0 @@
-// 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
-export var triggerWrapper = css({
-  display: 'flex'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var wrapper = css({
-  display: '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
-  '.align-btn': {
-    // eslint-disable-next-line @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 -- Ignored via go/DSP-18766
-export var expandIconWrapper = css({
-  marginLeft: "var(--ds-space-negative-100, -8px)"
-});

package/dist/types/ui/Alignment/styles.d.ts

@@ -1 +0,0 @@
-export declare const alignmentWrapper: import("@emotion/react").SerializedStyles;

package/dist/types/ui/ToolbarAlignment/styles.d.ts

@@ -1,3 +0,0 @@
-export declare const triggerWrapper: import("@emotion/react").SerializedStyles;
-export declare const wrapper: import("@emotion/react").SerializedStyles;
-export declare const expandIconWrapper: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/ui/Alignment/styles.d.ts

@@ -1 +0,0 @@
-export declare const alignmentWrapper: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/ui/ToolbarAlignment/styles.d.ts

@@ -1,3 +0,0 @@
-export declare const triggerWrapper: import("@emotion/react").SerializedStyles;
-export declare const wrapper: import("@emotion/react").SerializedStyles;
-export declare const expandIconWrapper: import("@emotion/react").SerializedStyles;