@atlaskit/editor-plugin-text-color 26.0.4 → 26.0.7

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/editor-plugin-text-color
 
+## 26.0.7
+
+### Patch Changes
+
+- Updated dependencies
+
+## 26.0.6
+
+### Patch Changes
+
+- Updated dependencies
+
+## 26.0.5
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 26.0.4
 
 ### Patch Changes

package/dist/cjs/editor-commands/change-color.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.changeColor = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _analytics = require("@atlaskit/editor-common/analytics");
+var _enums = require("@atlaskit/editor-common/analytics/types/enums");
 var _mark = require("@atlaskit/editor-common/mark");
 var _selection = require("@atlaskit/editor-common/selection");
 var _color = require("../pm-plugins/utils/color");
@@ -40,10 +40,10 @@ function createColorAnalyticsPayload(newColor, previousColor, palette, inputMeth
   var newColorLabel = newColorFromPalette ? newColorFromPalette.label : newColor;
   var previousColorLabel = previousColorFromPalette ? previousColorFromPalette.label : previousColor || '';
   return {
-    action: _analytics.ACTION.FORMATTED,
-    actionSubject: _analytics.ACTION_SUBJECT.TEXT,
-    actionSubjectId: _analytics.ACTION_SUBJECT_ID.FORMAT_COLOR,
-    eventType: _analytics.EVENT_TYPE.TRACK,
+    action: _enums.ACTION.FORMATTED,
+    actionSubject: _enums.ACTION_SUBJECT.TEXT,
+    actionSubjectId: _enums.ACTION_SUBJECT_ID.FORMAT_COLOR,
+    eventType: _enums.EVENT_TYPE.TRACK,
     attributes: _objectSpread({
       newColor: newColorLabel.toLowerCase(),
       previousColor: previousColorLabel.toLowerCase(),

package/dist/cjs/editor-commands/toggle-color.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.toggleColor = void 0;
 var _mark = require("@atlaskit/editor-common/mark");
+var _commands = require("@atlaskit/editor-common/mark/commands");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _main = require("../pm-plugins/main");
 var _constants = require("../pm-plugins/utils/constants");
@@ -30,7 +31,7 @@ var toggleColor = exports.toggleColor = function toggleColor(color) {
         }
       });
     }
-    (0, _mark.toggleMark)(textColor, {
+    (0, _commands.toggleMark)(textColor, {
       color: color
     })({
       tr: tr

package/dist/cjs/pm-plugins/commands/change-color.js

@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.changeColor = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _analytics = require("@atlaskit/editor-common/analytics");
-var _editorAnalytics = require("@atlaskit/editor-common/editor-analytics");
+var _enums = require("@atlaskit/editor-common/analytics/types/enums");
 var _mark = require("@atlaskit/editor-common/mark");
+var _withAnalytics = require("@atlaskit/editor-common/withAnalytics");
 var _main = require("../main");
 var _color = require("../utils/color");
 var _removeColor = require("./remove-color");
@@ -34,11 +34,11 @@ function createWithColorAnalytics(newColor, previousColor, palette, editorAnalyt
   });
   var newColorLabel = newColorFromPalette ? newColorFromPalette.label : newColor;
   var previousColorLabel = previousColorFromPalette ? previousColorFromPalette.label : previousColor || '';
-  return (0, _editorAnalytics.withAnalytics)(editorAnalyticsApi, {
-    action: _analytics.ACTION.FORMATTED,
-    actionSubject: _analytics.ACTION_SUBJECT.TEXT,
-    actionSubjectId: _analytics.ACTION_SUBJECT_ID.FORMAT_COLOR,
-    eventType: _analytics.EVENT_TYPE.TRACK,
+  return (0, _withAnalytics.withAnalytics)(editorAnalyticsApi, {
+    action: _enums.ACTION.FORMATTED,
+    actionSubject: _enums.ACTION_SUBJECT.TEXT,
+    actionSubjectId: _enums.ACTION_SUBJECT_ID.FORMAT_COLOR,
+    eventType: _enums.EVENT_TYPE.TRACK,
     attributes: _objectSpread({
       newColor: newColorLabel.toLowerCase(),
       previousColor: previousColorLabel.toLowerCase(),

package/dist/cjs/pm-plugins/commands/toggle-color.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.toggleColor = void 0;
 var _mark = require("@atlaskit/editor-common/mark");
+var _commands = require("@atlaskit/editor-common/mark/commands");
 var _selection = require("@atlaskit/editor-common/selection");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _main = require("../main");
@@ -34,7 +35,7 @@ var toggleColor = exports.toggleColor = function toggleColor(color) {
           }
         });
       }
-      (0, _mark.toggleMark)(textColor, {
+      (0, _commands.toggleMark)(textColor, {
         color: color
       })({
         tr: tr

package/dist/cjs/pm-plugins/keymap.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.keymapPlugin = keymapPlugin;
+var _keymap = require("@atlaskit/editor-common/keymap");
 var _keymaps = require("@atlaskit/editor-common/keymaps");
 var _palette = require("../editor-commands/palette");
 function keymapPlugin(_ref) {
@@ -12,5 +13,5 @@ function keymapPlugin(_ref) {
   if (_keymaps.toggleHighlightPalette.common) {
     (0, _keymaps.bindKeymapWithEditorCommand)(_keymaps.toggleHighlightPalette.common, (0, _palette.togglePalette)(api), list);
   }
-  return (0, _keymaps.keymap)(list);
+  return (0, _keymap.keymap)(list);
 }

package/dist/cjs/pm-plugins/main.js

@@ -11,6 +11,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _uiColor = require("@atlaskit/editor-common/ui-color");
+var _textColorPalette = require("@atlaskit/editor-common/ui-color/ColorPalette/textColorPalette");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
 var _color = require("./utils/color");
@@ -20,7 +21,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function createInitialPluginState(editorState, pluginConfig) {
   var defaultColor = (pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.defaultColor) || _constants.DEFAULT_COLOR;
-  var paletteColors = (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? _uiColor.textColorPaletteNew : _uiColor.textColorPalette;
+  var paletteColors = (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? _uiColor.textColorPaletteNew : _textColorPalette.textColorPalette;
   var palette = [{
     value: defaultColor.color,
     label: defaultColor.label,

package/dist/cjs/pm-plugins/utils/inputType.js

@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getInputMethod = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _analytics = require("@atlaskit/editor-common/analytics");
+var _enums = require("@atlaskit/editor-common/analytics/types/enums");
 var _types = require("../../types");
-var toolbarTypeToInputMethod = (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _types.ToolbarType.PRIMARY, _analytics.INPUT_METHOD.TOOLBAR), _types.ToolbarType.FLOATING, _analytics.INPUT_METHOD.FLOATING_TB);
+var toolbarTypeToInputMethod = (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _types.ToolbarType.PRIMARY, _enums.INPUT_METHOD.TOOLBAR), _types.ToolbarType.FLOATING, _enums.INPUT_METHOD.FLOATING_TB);
 var getInputMethod = exports.getInputMethod = function getInputMethod(toolbarType) {
   return toolbarTypeToInputMethod[toolbarType];
 };

package/dist/cjs/ui/ColorAccessibilityMenuItem.js

@@ -13,12 +13,15 @@ var _reactIntl = require("react-intl");
 var _panel = require("@atlaskit/adf-schema/panel");
 var _button = _interopRequireDefault(require("@atlaskit/button/icon/button"));
 var _css = require("@atlaskit/css");
-var _hooks = require("@atlaskit/editor-common/hooks");
-var _messages = require("@atlaskit/editor-common/messages");
-var _panel2 = require("@atlaskit/editor-common/panel");
-var _toolbar = require("@atlaskit/editor-common/toolbar");
+var _colorAccessibility = require("@atlaskit/editor-common/messages/color-accessibility");
+var _panel2 = require("@atlaskit/editor-common/styles/panel");
+var _context = require("@atlaskit/editor-common/toolbar/context");
 var _uiColor = require("@atlaskit/editor-common/ui-color");
-var _editorPalette = require("@atlaskit/editor-palette");
+var _utils = require("@atlaskit/editor-common/ui-color/ColorPalette/utils");
+var _useSharedPluginStateWithSelector = require("@atlaskit/editor-common/useSharedPluginStateWithSelector");
+var _background = require("@atlaskit/editor-palette/background");
+var _text = require("@atlaskit/editor-palette/text");
+var _textBackgroundColor = require("@atlaskit/editor-palette/text-background-color");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _accessibility = _interopRequireDefault(require("@atlaskit/icon/core/accessibility"));
 var _questionCircle = _interopRequireDefault(require("@atlaskit/icon/core/question-circle"));
@@ -30,13 +33,13 @@ function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 var resolveColorValue = function resolveColorValue(color, fallback) {
-  return (0, _uiColor.getTokenCSSVariableValue)(color) || (color.startsWith('var(') ? fallback : color);
+  return (0, _utils.getTokenCSSVariableValue)(color) || (color.startsWith('var(') ? fallback : color);
 };
 var getForegroundColor = function getForegroundColor(textColor, defaultColor) {
   if (!textColor || defaultColor && textColor === defaultColor) {
     return (0, _getTokenValue.getTokenValue)('color.text', defaultColor || _constants.DEFAULT_COLOR.color);
   }
-  var colorValue = (0, _editorPalette.hexToEditorTextPaletteColor)(textColor) || textColor;
+  var colorValue = (0, _text.hexToEditorTextPaletteColor)(textColor) || textColor;
   return resolveColorValue(colorValue, textColor);
 };
 var getBackgroundColor = function getBackgroundColor(backgroundColor) {
@@ -44,16 +47,16 @@ var getBackgroundColor = function getBackgroundColor(backgroundColor) {
   if (!backgroundColor || backgroundColor === 'none') {
     return (0, _getTokenValue.getTokenValue)('elevation.surface', _constants.DEFAULT_BACKGROUND_COLOR);
   }
-  var colorValue = palette === 'element' ? (0, _editorPalette.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : (0, _editorPalette.hexToEditorTextBackgroundPaletteColor)(backgroundColor) || backgroundColor;
+  var colorValue = palette === 'element' ? (0, _background.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : (0, _textBackgroundColor.hexToEditorTextBackgroundPaletteColor)(backgroundColor) || backgroundColor;
   return resolveColorValue(colorValue, backgroundColor);
 };
 var getBackgroundColorInNonActiveTheme = function getBackgroundColorInNonActiveTheme(backgroundColor) {
   var palette = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'text';
   if (!backgroundColor || backgroundColor === 'none') {
-    return (0, _uiColor.getTokenCSSVariableValueForNonActiveTheme)("var(--ds-surface, #FFFFFF)", _constants.DEFAULT_BACKGROUND_COLOR);
+    return (0, _utils.getTokenCSSVariableValueForNonActiveTheme)("var(--ds-surface, #FFFFFF)", _constants.DEFAULT_BACKGROUND_COLOR);
   }
-  var colorValue = palette === 'element' ? (0, _editorPalette.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : (0, _editorPalette.hexToEditorTextBackgroundPaletteColor)(backgroundColor) || backgroundColor;
-  return (0, _uiColor.getTokenCSSVariableValueForNonActiveTheme)(colorValue, backgroundColor);
+  var colorValue = palette === 'element' ? (0, _background.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : (0, _textBackgroundColor.hexToEditorTextBackgroundPaletteColor)(backgroundColor) || backgroundColor;
+  return (0, _utils.getTokenCSSVariableValueForNonActiveTheme)(colorValue, backgroundColor);
 };
 var STANDARD_PANEL_BACKGROUND_COLORS = new Map([[_panel.PanelType.INFO, (0, _panel2.getPanelTypeBackgroundNoTokens)(_panel.PanelType.INFO)], [_panel.PanelType.NOTE, (0, _panel2.getPanelTypeBackgroundNoTokens)(_panel.PanelType.NOTE)], [_panel.PanelType.SUCCESS, (0, _panel2.getPanelTypeBackgroundNoTokens)(_panel.PanelType.SUCCESS)], [_panel.PanelType.WARNING, (0, _panel2.getPanelTypeBackgroundNoTokens)(_panel.PanelType.WARNING)], [_panel.PanelType.ERROR, (0, _panel2.getPanelTypeBackgroundNoTokens)(_panel.PanelType.ERROR)]]);
 var getResolvedBackgroundFromHighlight = function getResolvedBackgroundFromHighlight(highlightColor) {
@@ -149,7 +152,7 @@ var getResolvedBackgroundColorValueInNonActiveTheme = function getResolvedBackgr
   return getBackgroundColorInNonActiveTheme(backgroundColor.color);
 };
 var useColorAccessibilityState = function useColorAccessibilityState(api) {
-  return (0, _hooks.useSharedPluginStateWithSelector)(api, ['textColor', 'highlight'], function (states) {
+  return (0, _useSharedPluginStateWithSelector.useSharedPluginStateWithSelector)(api, ['textColor', 'highlight'], function (states) {
     var _states$textColorStat, _states$highlightStat, _states$textColorStat2;
     return {
       defaultColor: (_states$textColorStat = states.textColorState) === null || _states$textColorStat === void 0 ? void 0 : _states$textColorStat.defaultColor,
@@ -290,19 +293,19 @@ var AccessibilityStatus = function AccessibilityStatus(_ref) {
       as: "span",
       size: "small",
       color: "color.text.success"
-    }, formatMessage(_messages.colorAccessibilityMessages.accessibleLabel));
+    }, formatMessage(_colorAccessibility.colorAccessibilityMessages.accessibleLabel));
   } else if (accessibilityStatus === 'difficultToRead') {
     return /*#__PURE__*/_react.default.createElement(_compiled.Text, {
       as: "span",
       size: "small",
       color: "color.text.warning"
-    }, formatMessage(_messages.colorAccessibilityMessages.difficultToReadLabel));
+    }, formatMessage(_colorAccessibility.colorAccessibilityMessages.difficultToReadLabel));
   } else {
     return /*#__PURE__*/_react.default.createElement(_compiled.Text, {
       as: "span",
       size: "small",
       color: "color.text.danger"
-    }, formatMessage(_messages.colorAccessibilityMessages.inaccessibleLabel));
+    }, formatMessage(_colorAccessibility.colorAccessibilityMessages.inaccessibleLabel));
   }
 };
 var styles = {
@@ -316,7 +319,7 @@ var ColorAccessibilityMenuItem = exports.ColorAccessibilityMenuItem = function C
     defaultColor = _useColorAccessibilit.defaultColor,
     highlightColor = _useColorAccessibilit.highlightColor,
     textColor = _useColorAccessibilit.textColor;
-  var _useEditorToolbar = (0, _toolbar.useEditorToolbar)(),
+  var _useEditorToolbar = (0, _context.useEditorToolbar)(),
     editorView = _useEditorToolbar.editorView;
   var editorState = editorView === null || editorView === void 0 ? void 0 : editorView.state;
   var accessibilityStatus = _react.default.useMemo(function () {
@@ -327,11 +330,11 @@ var ColorAccessibilityMenuItem = exports.ColorAccessibilityMenuItem = function C
   }
   var tooltipContent = function tooltipContent(accessibilityStatus) {
     if (accessibilityStatus === 'accessible') {
-      return formatMessage(_messages.colorAccessibilityMessages.accessibleTooltip);
+      return formatMessage(_colorAccessibility.colorAccessibilityMessages.accessibleTooltip);
     } else if (accessibilityStatus === 'difficultToRead') {
-      return formatMessage(_messages.colorAccessibilityMessages.difficultToReadTooltip);
+      return formatMessage(_colorAccessibility.colorAccessibilityMessages.difficultToReadTooltip);
     } else {
-      return formatMessage(_messages.colorAccessibilityMessages.inaccessibleTooltip);
+      return formatMessage(_colorAccessibility.colorAccessibilityMessages.inaccessibleTooltip);
     }
   };
   return /*#__PURE__*/_react.default.createElement(_compiled.Box, {
@@ -347,7 +350,7 @@ var ColorAccessibilityMenuItem = exports.ColorAccessibilityMenuItem = function C
     as: "span",
     size: "small",
     color: "color.text.subtle"
-  }, formatMessage(_messages.colorAccessibilityMessages.accessibility)), /*#__PURE__*/_react.default.createElement(_compiled.Text, {
+  }, formatMessage(_colorAccessibility.colorAccessibilityMessages.accessibility)), /*#__PURE__*/_react.default.createElement(_compiled.Text, {
     as: "span",
     size: "small",
     color: "color.text.subtle",

package/dist/cjs/ui/FloatingToolbarComponent.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.FloatingToolbarComponent = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _hooks = require("@atlaskit/editor-common/hooks");
+var _useSharedPluginStateWithSelector = require("@atlaskit/editor-common/useSharedPluginStateWithSelector");
 var _types = require("../types");
 var _ToolbarTextColor = _interopRequireDefault(require("./ToolbarTextColor"));
 // Ignored via go/ees005
@@ -29,7 +29,7 @@ var FloatingToolbarComponent = exports.FloatingToolbarComponent = function Float
   var api = _ref.api,
     editorView = _ref.editorView,
     dispatchAnalyticsEvent = _ref.dispatchAnalyticsEvent;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['textColor'], selector),
+  var _useSharedPluginState = (0, _useSharedPluginStateWithSelector.useSharedPluginStateWithSelector)(api, ['textColor'], selector),
     color = _useSharedPluginState.color,
     defaultColor = _useSharedPluginState.defaultColor,
     palette = _useSharedPluginState.palette,

package/dist/cjs/ui/PrimaryToolbarComponent.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.PrimaryToolbarComponent = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _hooks = require("@atlaskit/editor-common/hooks");
+var _useSharedPluginStateWithSelector = require("@atlaskit/editor-common/useSharedPluginStateWithSelector");
 var _types = require("../types");
 var _ToolbarTextColor = _interopRequireDefault(require("./ToolbarTextColor"));
 // Ignored via go/ees005
@@ -30,7 +30,7 @@ var PrimaryToolbarComponent = exports.PrimaryToolbarComponent = function Primary
     popupsBoundariesElement = _ref.popupsBoundariesElement,
     dispatchAnalyticsEvent = _ref.dispatchAnalyticsEvent,
     disabled = _ref.disabled;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['textColor'], selector),
+  var _useSharedPluginState = (0, _useSharedPluginStateWithSelector.useSharedPluginStateWithSelector)(api, ['textColor'], selector),
     color = _useSharedPluginState.color,
     defaultColor = _useSharedPluginState.defaultColor,
     palette = _useSharedPluginState.palette,

package/dist/cjs/ui/RemoveColorMenuItem.js

@@ -12,10 +12,10 @@ var React = _interopRequireWildcard(require("react"));
 var _runtime = require("@compiled/react/runtime");
 var _reactIntl = require("react-intl");
 var _button = _interopRequireDefault(require("@atlaskit/button/default/button"));
-var _messages = require("@atlaskit/editor-common/messages");
+var _highlight = require("@atlaskit/editor-common/messages/highlight");
 var _toolbar = require("@atlaskit/editor-common/toolbar");
-var _uiColor = require("@atlaskit/editor-common/ui-color");
-var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _highlightColorPalette = require("@atlaskit/editor-common/ui-color/ColorPalette/highlightColorPalette");
+var _toolbarDropdownMenuContext = require("@atlaskit/editor-toolbar/toolbar-dropdown-menu-context");
 var _colourNone = _interopRequireDefault(require("@atlaskit/icon-lab/core/colour-none"));
 var _compiled = require("@atlaskit/primitives/compiled");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
@@ -30,7 +30,7 @@ var RemoveColorMenuItem = exports.RemoveColorMenuItem = function RemoveColorMenu
     parents = _ref.parents;
   var _useIntl = (0, _reactIntl.useIntl)(),
     formatMessage = _useIntl.formatMessage;
-  var context = (0, _editorToolbar.useToolbarDropdownMenu)();
+  var context = (0, _toolbarDropdownMenuContext.useToolbarDropdownMenu)();
   var closeMenu = context === null || context === void 0 ? void 0 : context.closeMenu;
   var onClick = function onClick(event) {
     var _api$textColor$shared;
@@ -50,7 +50,7 @@ var RemoveColorMenuItem = exports.RemoveColorMenuItem = function RemoveColorMenu
         });
       }
       (_api$highlight = api.highlight) === null || _api$highlight === void 0 || _api$highlight.commands.changeColor({
-        color: _uiColor.REMOVE_HIGHLIGHT_COLOR,
+        color: _highlightColorPalette.REMOVE_HIGHLIGHT_COLOR,
         inputMethod: (0, _toolbar.getInputMethodFromParentKeys)(parents)
       })({
         tr: tr
@@ -75,7 +75,7 @@ var RemoveColorMenuItem = exports.RemoveColorMenuItem = function RemoveColorMenu
       label: ""
     }), /*#__PURE__*/React.createElement(_compiled.Text, {
       color: "color.text.subtle"
-    }, formatMessage(_messages.highlightMessages.removeHighlight)))));
+    }, formatMessage(_highlight.highlightMessages.removeHighlight)))));
   }
   return /*#__PURE__*/React.createElement("div", {
     className: (0, _runtime.ax)([styles.removeColorButton])
@@ -85,5 +85,5 @@ var RemoveColorMenuItem = exports.RemoveColorMenuItem = function RemoveColorMenu
     onClick: onClick
   }, /*#__PURE__*/React.createElement(_compiled.Text, {
     weight: "medium"
-  }, formatMessage(_messages.highlightMessages.removeColor))));
+  }, formatMessage(_highlight.highlightMessages.removeColor))));
 };

package/dist/cjs/ui/TextColorHighlightMenu.js

@@ -8,11 +8,17 @@ exports.TextColorHighlightMenu = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactIntl = require("react-intl");
 var _keymaps = require("@atlaskit/editor-common/keymaps");
-var _messages = require("@atlaskit/editor-common/messages");
+var _textColor = require("@atlaskit/editor-common/messages/text-color");
 var _uiColor = require("@atlaskit/editor-common/ui-color");
-var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
-var _editorPalette = require("@atlaskit/editor-palette");
-var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _useSharedPluginStateSelector = require("@atlaskit/editor-common/useSharedPluginStateSelector");
+var _text = require("@atlaskit/editor-palette/text");
+var _textBackgroundColor = require("@atlaskit/editor-palette/text-background-color");
+var _textColorIcon = require("@atlaskit/editor-toolbar/text-color-icon");
+var _toolbarColorSwatch = require("@atlaskit/editor-toolbar/toolbar-color-swatch");
+var _toolbarDropdownMenu = require("@atlaskit/editor-toolbar/toolbar-dropdown-menu");
+var _toolbarDropdownMenuContext = require("@atlaskit/editor-toolbar/toolbar-dropdown-menu-context");
+var _toolbarTooltip = require("@atlaskit/editor-toolbar/toolbar-tooltip");
+var _uiContext = require("@atlaskit/editor-toolbar/ui-context");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var getIconColor = function getIconColor(textColor, defaultColor, highlightColor) {
@@ -20,16 +26,16 @@ var getIconColor = function getIconColor(textColor, defaultColor, highlightColor
     if (!textColor || textColor === defaultColor && defaultColor) {
       return "var(--ds-text, #292A2E)";
     }
-    return (0, _editorPalette.hexToEditorTextPaletteColor)(textColor) || "var(--ds-text, #292A2E)";
+    return (0, _text.hexToEditorTextPaletteColor)(textColor) || "var(--ds-text, #292A2E)";
   }
   if (highlightColor || !textColor || textColor === defaultColor && defaultColor) {
     return "var(--ds-text, #292A2E)";
   }
-  return (0, _editorPalette.hexToEditorTextPaletteColor)(textColor) || "var(--ds-text, #292A2E)";
+  return (0, _text.hexToEditorTextPaletteColor)(textColor) || "var(--ds-text, #292A2E)";
 };
 var getHighlightColorIcon = function getHighlightColorIcon(highlightColor) {
   if (highlightColor) {
-    return (0, _editorPalette.hexToEditorTextBackgroundPaletteColor)(highlightColor);
+    return (0, _textBackgroundColor.hexToEditorTextBackgroundPaletteColor)(highlightColor);
   }
   return undefined;
 };
@@ -52,7 +58,7 @@ var TextColorHighlightMenu = exports.TextColorHighlightMenu = function TextColor
   var children = _ref.children,
     api = _ref.api;
   var isHighlightPluginExisted = !!(api !== null && api !== void 0 && api.highlight);
-  var _useToolbarUI = (0, _editorToolbar.useToolbarUI)(),
+  var _useToolbarUI = (0, _uiContext.useToolbarUI)(),
     isToolbarDisabled = _useToolbarUI.isDisabled;
   var _useTextColorHighligh = useTextColorHighlightMenuState(api),
     isTextColorDisabled = _useTextColorHighligh.isTextColorDisabled,
@@ -101,14 +107,14 @@ var TextColorHighlightMenu = exports.TextColorHighlightMenu = function TextColor
   }, [setIsPaletteOpen, isPaletteOpen]);
   var iconColor = getIconColor(textColor, defaultColor, highlightColor);
   if ((0, _expValEquals.expValEquals)('platform_editor_lovability_text_bg_color', 'isEnabled', true)) {
-    return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownMenuProvider, {
+    return /*#__PURE__*/_react.default.createElement(_toolbarDropdownMenuContext.ToolbarDropdownMenuProvider, {
       isOpen: isPaletteOpen,
       setIsOpen: setIsPaletteOpen
-    }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownMenu, {
-      iconBefore: /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarColorSwatch, {
+    }, /*#__PURE__*/_react.default.createElement(_toolbarDropdownMenu.ToolbarDropdownMenu, {
+      iconBefore: /*#__PURE__*/_react.default.createElement(_toolbarColorSwatch.ToolbarColorSwatch, {
         highlightColor: getHighlightColorIcon(highlightColor)
-      }, /*#__PURE__*/_react.default.createElement(_editorToolbar.TextColorIcon, {
-        label: formatMessage(_messages.textColorMessages.textColorTooltip),
+      }, /*#__PURE__*/_react.default.createElement(_textColorIcon.TextColorIcon, {
+        label: formatMessage(_textColor.textColorMessages.textColorTooltip),
         iconColor: iconColor,
         shouldRecommendSmallIcon: true,
         size: 'small',
@@ -118,9 +124,9 @@ var TextColorHighlightMenu = exports.TextColorHighlightMenu = function TextColor
       isDisabled: isDisabled,
       testId: "text-color-highlight-menu",
       hasSectionMargin: false,
-      tooltipComponent: /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarTooltip, {
+      tooltipComponent: /*#__PURE__*/_react.default.createElement(_toolbarTooltip.ToolbarTooltip, {
         content: /*#__PURE__*/_react.default.createElement(_keymaps.ToolTipContent, {
-          description: formatMessage(isHighlightPluginExisted ? _messages.textColorMessages.textColorHighlightTooltip : _messages.textColorMessages.textColorTooltip),
+          description: formatMessage(isHighlightPluginExisted ? _textColor.textColorMessages.textColorHighlightTooltip : _textColor.textColorMessages.textColorTooltip),
           keymap: _keymaps.toggleHighlightPalette
         })
       })
@@ -129,14 +135,14 @@ var TextColorHighlightMenu = exports.TextColorHighlightMenu = function TextColor
       defaultColor: defaultColor
     }, children)));
   }
-  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownMenuProvider, {
+  return /*#__PURE__*/_react.default.createElement(_toolbarDropdownMenuContext.ToolbarDropdownMenuProvider, {
     isOpen: isPaletteOpen,
     setIsOpen: setIsPaletteOpen
-  }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownMenu, {
-    iconBefore: /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarColorSwatch, {
+  }, /*#__PURE__*/_react.default.createElement(_toolbarDropdownMenu.ToolbarDropdownMenu, {
+    iconBefore: /*#__PURE__*/_react.default.createElement(_toolbarColorSwatch.ToolbarColorSwatch, {
       highlightColor: getHighlightColorIcon(highlightColor)
-    }, /*#__PURE__*/_react.default.createElement(_editorToolbar.TextColorIcon, {
-      label: formatMessage(_messages.textColorMessages.textColorTooltip),
+    }, /*#__PURE__*/_react.default.createElement(_textColorIcon.TextColorIcon, {
+      label: formatMessage(_textColor.textColorMessages.textColorTooltip),
       iconColor: iconColor,
       shouldRecommendSmallIcon: true,
       size: 'small',
@@ -146,9 +152,9 @@ var TextColorHighlightMenu = exports.TextColorHighlightMenu = function TextColor
     isDisabled: isDisabled,
     testId: "text-color-highlight-menu",
     hasSectionMargin: false,
-    tooltipComponent: /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarTooltip, {
+    tooltipComponent: /*#__PURE__*/_react.default.createElement(_toolbarTooltip.ToolbarTooltip, {
       content: /*#__PURE__*/_react.default.createElement(_keymaps.ToolTipContent, {
-        description: formatMessage(isHighlightPluginExisted ? _messages.textColorMessages.textColorHighlightTooltip : _messages.textColorMessages.textColorTooltip),
+        description: formatMessage(isHighlightPluginExisted ? _textColor.textColorMessages.textColorHighlightTooltip : _textColor.textColorMessages.textColorTooltip),
         keymap: _keymaps.toggleHighlightPalette
       })
     })

package/dist/cjs/ui/TextColorMenuItem.js

@@ -11,12 +11,14 @@ require("./TextColorMenuItem.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _react = _interopRequireWildcard(require("react"));
 var _reactIntl = require("react-intl");
-var _hooks = require("@atlaskit/editor-common/hooks");
-var _messages = require("@atlaskit/editor-common/messages");
+var _textColor = require("@atlaskit/editor-common/messages/text-color");
 var _toolbar = require("@atlaskit/editor-common/toolbar");
-var _uiColor = require("@atlaskit/editor-common/ui-color");
-var _editorPalette = require("@atlaskit/editor-palette");
-var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _context = require("@atlaskit/editor-common/toolbar/context");
+var _paletteMessagesTokenModeNames = require("@atlaskit/editor-common/ui-color/ColorPalette/paletteMessagesTokenModeNames");
+var _useSharedPluginStateWithSelector = require("@atlaskit/editor-common/useSharedPluginStateWithSelector");
+var _text = require("@atlaskit/editor-palette/text");
+var _colorPalette = require("@atlaskit/editor-toolbar/color-palette");
+var _toolbarDropdownMenuContext = require("@atlaskit/editor-toolbar/toolbar-dropdown-menu-context");
 var _heading = _interopRequireDefault(require("@atlaskit/heading/heading"));
 var _fg = require("@atlaskit/platform-feature-flags/fg");
 var _compiled = require("@atlaskit/primitives/compiled");
@@ -29,7 +31,7 @@ var styles = {
 function TextColorMenuItem(_ref) {
   var api = _ref.api,
     parents = _ref.parents;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['textColor'], function (states) {
+  var _useSharedPluginState = (0, _useSharedPluginStateWithSelector.useSharedPluginStateWithSelector)(api, ['textColor'], function (states) {
       var _states$textColorStat, _states$textColorStat2, _states$textColorStat3;
       return {
         color: (_states$textColorStat = states.textColorState) === null || _states$textColorStat === void 0 ? void 0 : _states$textColorStat.color,
@@ -40,9 +42,9 @@ function TextColorMenuItem(_ref) {
     color = _useSharedPluginState.color,
     defaultColor = _useSharedPluginState.defaultColor,
     palette = _useSharedPluginState.palette;
-  var _useEditorToolbar = (0, _toolbar.useEditorToolbar)(),
+  var _useEditorToolbar = (0, _context.useEditorToolbar)(),
     editorView = _useEditorToolbar.editorView;
-  var context = (0, _editorToolbar.useToolbarDropdownMenu)();
+  var context = (0, _toolbarDropdownMenuContext.useToolbarDropdownMenu)();
   var closeMenu = context === null || context === void 0 ? void 0 : context.closeMenu;
   var _useIntl = (0, _reactIntl.useIntl)(),
     formatMessage = _useIntl.formatMessage;
@@ -60,7 +62,7 @@ function TextColorMenuItem(_ref) {
       }
     }
   }, [editorView === null || editorView === void 0 ? void 0 : editorView.state, editorView === null || editorView === void 0 ? void 0 : editorView.dispatch, api === null || api === void 0 ? void 0 : api.textColor.actions, parents, closeMenu, isNewColorPaletteEnabled]);
-  var colorPalette = /*#__PURE__*/_react.default.createElement(_editorToolbar.ColorPalette, {
+  var colorPalette = /*#__PURE__*/_react.default.createElement(_colorPalette.ColorPalette, {
     ariaLabelledBy: labelId,
     cols: isNewColorPaletteEnabled ? TEXT_COLOR_PICKER_COLUMNS : undefined,
     gap: isNewColorPaletteEnabled ? 'space.0' : undefined
@@ -74,8 +76,8 @@ function TextColorMenuItem(_ref) {
     ,
     paletteOptions: {
       palette: palette,
-      hexToPaletteColor: _editorPalette.hexToEditorTextPaletteColor,
-      paletteColorTooltipMessages: _uiColor.textPaletteTooltipMessages
+      hexToPaletteColor: _text.hexToEditorTextPaletteColor,
+      paletteColorTooltipMessages: _paletteMessagesTokenModeNames.textPaletteTooltipMessages
     }
   });
   return /*#__PURE__*/_react.default.createElement(_compiled.Stack, {
@@ -87,7 +89,7 @@ function TextColorMenuItem(_ref) {
     // The label names the palette's radio group; a heading inside a menu is skipped and has no stable level here
     ,
     as: (0, _fg.fg)('platform_editor_a11y_color_palette_radiogroup') ? 'div' : undefined
-  }, formatMessage(_messages.textColorMessages.textColorTooltip)), isNewColorPaletteEnabled ? /*#__PURE__*/_react.default.createElement(_compiled.Bleed, {
+  }, formatMessage(_textColor.textColorMessages.textColorTooltip)), isNewColorPaletteEnabled ? /*#__PURE__*/_react.default.createElement(_compiled.Bleed, {
     inline: "space.025"
   }, colorPalette) : colorPalette);
 }

package/dist/cjs/ui/TextMenuSection.js

@@ -9,8 +9,8 @@ exports.TextMenuSection = void 0;
 require("./TextMenuSection.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _react = _interopRequireDefault(require("react"));
-var _toolbar = require("@atlaskit/editor-common/toolbar");
-var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _keys = require("@atlaskit/editor-common/toolbar/keys");
+var _toolbarDropdownItemSection = require("@atlaskit/editor-toolbar/toolbar-dropdown-item-section");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var styles = {
@@ -21,14 +21,14 @@ var TextMenuSection = exports.TextMenuSection = function TextMenuSection(_ref) {
   var children = _ref.children,
     parents = _ref.parents;
   var hasSeparator = parents.some(function (parent) {
-    return parent.key === _toolbar.TEXT_COLLAPSED_MENU.key;
+    return parent.key === _keys.TEXT_COLLAPSED_MENU.key;
   });
   var onMouseDown = function onMouseDown(event) {
     if ((0, _expValEquals.expValEquals)('platform_editor_lovability_text_bg_color', 'isEnabled', true)) {
       event.stopPropagation();
     }
   };
-  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
+  return /*#__PURE__*/_react.default.createElement(_toolbarDropdownItemSection.ToolbarDropdownItemSection, {
     hasSeparator: hasSeparator
   }, /*#__PURE__*/_react.default.createElement(_compiled.Box, {
     xcss: (0, _expValEquals.expValEquals)('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? styles.menu : styles.menuOld,