@atlaskit/editor-plugin-highlight 12.1.2 → 12.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/cjs/editor-commands/change-color.js +2 -2
  3. package/dist/cjs/pm-plugins/keymap.js +2 -2
  4. package/dist/cjs/ui/HighlightColorMenuItem.compiled.css +1 -6
  5. package/dist/cjs/ui/HighlightColorMenuItem.js +35 -5
  6. package/dist/es2019/editor-commands/change-color.js +2 -2
  7. package/dist/es2019/pm-plugins/keymap.js +2 -2
  8. package/dist/es2019/ui/HighlightColorMenuItem.compiled.css +1 -6
  9. package/dist/es2019/ui/HighlightColorMenuItem.js +31 -2
  10. package/dist/esm/editor-commands/change-color.js +2 -2
  11. package/dist/esm/pm-plugins/keymap.js +2 -2
  12. package/dist/esm/ui/HighlightColorMenuItem.compiled.css +1 -6
  13. package/dist/esm/ui/HighlightColorMenuItem.js +35 -5
  14. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/editor-plugin-highlight
2
2
 
3
+ ## 12.1.4
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 12.1.3
10
+
11
+ ### Patch Changes
12
+
13
+ - [`6f7b6c498b07c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6f7b6c498b07c) -
14
+ [EDITOR-7591] Align the no-color highlight palette tile icon with the updated transparent
15
+ highlight styling for the experiment `platform_editor_lovability_text_bg_color`.
16
+ - Updated dependencies
17
+
3
18
  ## 12.1.2
4
19
 
5
20
  ### Patch Changes
package/dist/cjs/editor-commands/change-color.js CHANGED
@@ -7,7 +7,7 @@ exports.changeColor = void 0;
7
7
  var _analytics = require("@atlaskit/editor-common/analytics");
8
8
  var _mark = require("@atlaskit/editor-common/mark");
9
9
  var _uiColor = require("@atlaskit/editor-common/ui-color");
10
- var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
10
+ var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
11
11
  var _main = require("../pm-plugins/main");
12
12
  var _color = require("./color");
13
13
  var changeColor = exports.changeColor = function changeColor(editorAnalyticsAPI) {
@@ -44,7 +44,7 @@ var changeColor = exports.changeColor = function changeColor(editorAnalyticsAPI)
44
44
  var createAnalyticsEvent = function createAnalyticsEvent(color, inputMethod, tr) {
45
45
  var _getActiveColor;
46
46
  var previousColor = (_getActiveColor = (0, _color.getActiveColor)(tr)) !== null && _getActiveColor !== void 0 ? _getActiveColor : _uiColor.REMOVE_HIGHLIGHT_COLOR;
47
- var highlightPalette = (0, _expValEquals.expValEquals)('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? _uiColor.highlightColorPaletteNew : _uiColor.highlightColorPalette;
47
+ var highlightPalette = (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? _uiColor.highlightColorPaletteNew : _uiColor.highlightColorPalette;
48
48
 
49
49
  // get color names from palette
50
50
  var newColorFromPalette = highlightPalette.find(function (_ref3) {
package/dist/cjs/pm-plugins/keymap.js CHANGED
@@ -8,7 +8,7 @@ var _analytics = require("@atlaskit/editor-common/analytics");
8
8
  var _keymaps = require("@atlaskit/editor-common/keymaps");
9
9
  var _preset = require("@atlaskit/editor-common/preset");
10
10
  var _uiColor = require("@atlaskit/editor-common/ui-color");
11
- var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
11
+ var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
12
12
  var _changeColor = require("../editor-commands/change-color");
13
13
  var _palette = require("../editor-commands/palette");
14
14
  function keymapPlugin(_ref) {
@@ -28,7 +28,7 @@ function keymapPlugin(_ref) {
28
28
  }), list);
29
29
  }
30
30
  var analyticsApi = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
31
- var highlightPalette = (0, _expValEquals.expValEquals)('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? _uiColor.highlightColorPaletteNew : _uiColor.highlightColorPalette;
31
+ var highlightPalette = (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? _uiColor.highlightColorPaletteNew : _uiColor.highlightColorPalette;
32
32
  var color = highlightPalette.find(function (_ref2) {
33
33
  var label = _ref2.label;
34
34
  return label === 'Yellow';
package/dist/cjs/ui/HighlightColorMenuItem.compiled.css CHANGED
@@ -1,9 +1,4 @@
1
1
 
2
- ._2rko12b0{border-radius:var(--ds-radius-small,4px)}
3
- ._zulp12x7{gap:var(--ds-space-075,6px)}._189ee4h9{border-width:var(--ds-border-width,1px)}
4
- ._195gv77o{margin-inline:var(--ds-space-025,2px)}
5
- ._1dqonqa1{border-style:solid}
6
- ._1h6d1l7x{border-color:var(--ds-border,#0b120e24)}
7
- ._18u01n1a{margin-left:-1px}
2
+ ._zulp12x7{gap:var(--ds-space-075,6px)}._18u01n1a{margin-left:-1px}
8
3
  ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
9
4
  ._1e0c1o8l{display:inline-block}
package/dist/cjs/ui/HighlightColorMenuItem.js CHANGED
@@ -30,7 +30,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
30
30
  var HIGHLIGHT_COLOR_PICKER_COLUMNS = 10;
31
31
  var styles = {
32
32
  container: "_zulp12x7 _19pkpxbi",
33
- removeHighlightButton: "_2rko12b0 _195gv77o _189ee4h9 _1dqonqa1 _1h6d1l7x",
34
33
  icon: "_1e0c1o8l _18u01n1a"
35
34
  };
36
35
  var getTextColorIconColor = function getTextColorIconColor(defaultColor, textColor, isNewColorPaletteEnabled) {
@@ -60,9 +59,37 @@ var TextColorIconDecorator = function TextColorIconDecorator(_ref) {
60
59
  size: "small"
61
60
  }));
62
61
  };
63
- function HighlightColorMenuItem(_ref2) {
64
- var api = _ref2.api,
65
- parents = _ref2.parents;
62
+ var NoColorIconDecorator = function NoColorIconDecorator(_ref2) {
63
+ var isSelected = _ref2.isSelected,
64
+ iconColor = _ref2.iconColor;
65
+ return /*#__PURE__*/React.createElement("svg", {
66
+ width: "24",
67
+ height: "24",
68
+ viewBox: "0 0 24 24",
69
+ fill: "none",
70
+ xmlns: "http://www.w3.org/2000/svg",
71
+ "aria-hidden": "true"
72
+ }, /*#__PURE__*/React.createElement("g", {
73
+ transform: "translate(-1 -1)"
74
+ }, /*#__PURE__*/React.createElement("rect", {
75
+ x: "1.70703",
76
+ y: "1.35383",
77
+ width: "29.8003",
78
+ height: "0.5",
79
+ transform: "rotate(45 1.70703 1.35383)",
80
+ stroke: "var(--ds-border, #0B120E24)",
81
+ strokeWidth: "0.5"
82
+ }), isSelected ? /*#__PURE__*/React.createElement("path", {
83
+ d: "M17.959 7.9707L10.709 16.9707C10.5675 17.1462 10.3544 17.2488 10.1289 17.25C9.90343 17.2512 9.68924 17.1506 9.5459 16.9766L6.0459 12.7266L7.2041 11.7734L10.1182 15.3115L16.791 7.0293L17.959 7.9707Z",
84
+ fill: "var(--ds-icon, #292A2E)"
85
+ }) : /*#__PURE__*/React.createElement("path", {
86
+ d: "M7.80469 16L10.9746 7.26953H12.2637L15.4746 16H14.3027L12.4512 10.8203C12.3379 10.5 12.2051 10.1016 12.0527 9.625C11.9043 9.14453 11.7227 8.5332 11.5078 7.79102H11.7188C11.5078 8.54102 11.3242 9.16016 11.168 9.64844C11.0156 10.1328 10.8887 10.5234 10.7871 10.8203L8.98828 16H7.80469ZM9.39844 13.5625V12.5898H13.8809V13.5625H9.39844Z",
87
+ fill: iconColor
88
+ })));
89
+ };
90
+ function HighlightColorMenuItem(_ref3) {
91
+ var api = _ref3.api,
92
+ parents = _ref3.parents;
66
93
  var _useIntl = (0, _reactIntl.useIntl)(),
67
94
  formatMessage = _useIntl.formatMessage;
68
95
  var activeColor = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'highlight.activeColor');
@@ -95,7 +122,10 @@ function HighlightColorMenuItem(_ref2) {
95
122
  return isNewColorPaletteEnabled || color.value !== _uiColor.REMOVE_HIGHLIGHT_COLOR;
96
123
  }).map(function (color) {
97
124
  return _objectSpread(_objectSpread({}, color), {}, {
98
- decorator: /*#__PURE__*/React.createElement(TextColorIconDecorator, {
125
+ decorator: isNewColorPaletteEnabled && color.value === _uiColor.REMOVE_HIGHLIGHT_COLOR ? /*#__PURE__*/React.createElement(NoColorIconDecorator, {
126
+ isSelected: isSelected(color),
127
+ iconColor: iconColor
128
+ }) : /*#__PURE__*/React.createElement(TextColorIconDecorator, {
99
129
  label: color.label,
100
130
  isSelected: isSelected(color),
101
131
  iconColor: iconColor
package/dist/es2019/editor-commands/change-color.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
2
2
  import { removeMark, toggleMark } from '@atlaskit/editor-common/mark';
3
3
  import { REMOVE_HIGHLIGHT_COLOR, highlightColorPalette, highlightColorPaletteNew } from '@atlaskit/editor-common/ui-color';
4
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
4
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
5
5
  import { HighlightPluginAction, highlightPluginKey } from '../pm-plugins/main';
6
6
  import { getActiveColor } from './color';
7
7
  export const changeColor = editorAnalyticsAPI => ({
@@ -38,7 +38,7 @@ export const changeColor = editorAnalyticsAPI => ({
38
38
  const createAnalyticsEvent = (color, inputMethod, tr) => {
39
39
  var _getActiveColor;
40
40
  const previousColor = (_getActiveColor = getActiveColor(tr)) !== null && _getActiveColor !== void 0 ? _getActiveColor : REMOVE_HIGHLIGHT_COLOR;
41
- const highlightPalette = expValEquals('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? highlightColorPaletteNew : highlightColorPalette;
41
+ const highlightPalette = expValEqualsNoExposure('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? highlightColorPaletteNew : highlightColorPalette;
42
42
 
43
43
  // get color names from palette
44
44
  const newColorFromPalette = highlightPalette.find(({
package/dist/es2019/pm-plugins/keymap.js CHANGED
@@ -2,7 +2,7 @@ import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
2
2
  import { applyYellowHighlight, bindKeymapWithCommand, keymap, toggleHighlightPalette } from '@atlaskit/editor-common/keymaps';
3
3
  import { editorCommandToPMCommand } from '@atlaskit/editor-common/preset';
4
4
  import { highlightColorPalette, highlightColorPaletteNew } from '@atlaskit/editor-common/ui-color';
5
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
5
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
6
6
  import { changeColor } from '../editor-commands/change-color';
7
7
  import { togglePalette } from '../editor-commands/palette';
8
8
  export function keymapPlugin({
@@ -23,7 +23,7 @@ export function keymapPlugin({
23
23
  }), list);
24
24
  }
25
25
  const analyticsApi = api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
26
- const highlightPalette = expValEquals('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? highlightColorPaletteNew : highlightColorPalette;
26
+ const highlightPalette = expValEqualsNoExposure('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? highlightColorPaletteNew : highlightColorPalette;
27
27
  const color = highlightPalette.find(({
28
28
  label
29
29
  }) => label === 'Yellow');
package/dist/es2019/ui/HighlightColorMenuItem.compiled.css CHANGED
@@ -1,9 +1,4 @@
1
1
 
2
- ._2rko12b0{border-radius:var(--ds-radius-small,4px)}
3
- ._zulp12x7{gap:var(--ds-space-075,6px)}._189ee4h9{border-width:var(--ds-border-width,1px)}
4
- ._195gv77o{margin-inline:var(--ds-space-025,2px)}
5
- ._1dqonqa1{border-style:solid}
6
- ._1h6d1l7x{border-color:var(--ds-border,#0b120e24)}
7
- ._18u01n1a{margin-left:-1px}
2
+ ._zulp12x7{gap:var(--ds-space-075,6px)}._18u01n1a{margin-left:-1px}
8
3
  ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
9
4
  ._1e0c1o8l{display:inline-block}
package/dist/es2019/ui/HighlightColorMenuItem.js CHANGED
@@ -18,7 +18,6 @@ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
18
18
  const HIGHLIGHT_COLOR_PICKER_COLUMNS = 10;
19
19
  const styles = {
20
20
  container: "_zulp12x7 _19pkpxbi",
21
- removeHighlightButton: "_2rko12b0 _195gv77o _189ee4h9 _1dqonqa1 _1h6d1l7x",
22
21
  icon: "_1e0c1o8l _18u01n1a"
23
22
  };
24
23
  const getTextColorIconColor = (defaultColor, textColor, isNewColorPaletteEnabled) => {
@@ -49,6 +48,33 @@ const TextColorIconDecorator = ({
49
48
  size: "small"
50
49
  }));
51
50
  };
51
+ const NoColorIconDecorator = ({
52
+ isSelected,
53
+ iconColor
54
+ }) => /*#__PURE__*/React.createElement("svg", {
55
+ width: "24",
56
+ height: "24",
57
+ viewBox: "0 0 24 24",
58
+ fill: "none",
59
+ xmlns: "http://www.w3.org/2000/svg",
60
+ "aria-hidden": "true"
61
+ }, /*#__PURE__*/React.createElement("g", {
62
+ transform: "translate(-1 -1)"
63
+ }, /*#__PURE__*/React.createElement("rect", {
64
+ x: "1.70703",
65
+ y: "1.35383",
66
+ width: "29.8003",
67
+ height: "0.5",
68
+ transform: "rotate(45 1.70703 1.35383)",
69
+ stroke: "var(--ds-border, #0B120E24)",
70
+ strokeWidth: "0.5"
71
+ }), isSelected ? /*#__PURE__*/React.createElement("path", {
72
+ d: "M17.959 7.9707L10.709 16.9707C10.5675 17.1462 10.3544 17.2488 10.1289 17.25C9.90343 17.2512 9.68924 17.1506 9.5459 16.9766L6.0459 12.7266L7.2041 11.7734L10.1182 15.3115L16.791 7.0293L17.959 7.9707Z",
73
+ fill: "var(--ds-icon, #292A2E)"
74
+ }) : /*#__PURE__*/React.createElement("path", {
75
+ d: "M7.80469 16L10.9746 7.26953H12.2637L15.4746 16H14.3027L12.4512 10.8203C12.3379 10.5 12.2051 10.1016 12.0527 9.625C11.9043 9.14453 11.7227 8.5332 11.5078 7.79102H11.7188C11.5078 8.54102 11.3242 9.16016 11.168 9.64844C11.0156 10.1328 10.8887 10.5234 10.7871 10.8203L8.98828 16H7.80469ZM9.39844 13.5625V12.5898H13.8809V13.5625H9.39844Z",
76
+ fill: iconColor
77
+ })));
52
78
  export function HighlightColorMenuItem({
53
79
  api,
54
80
  parents
@@ -83,7 +109,10 @@ export function HighlightColorMenuItem({
83
109
  const highlightPalette = isNewColorPaletteEnabled ? highlightColorPaletteNew : highlightColorPalette;
84
110
  return highlightPalette.filter(color => isNewColorPaletteEnabled || color.value !== REMOVE_HIGHLIGHT_COLOR).map(color => ({
85
111
  ...color,
86
- decorator: /*#__PURE__*/React.createElement(TextColorIconDecorator, {
112
+ decorator: isNewColorPaletteEnabled && color.value === REMOVE_HIGHLIGHT_COLOR ? /*#__PURE__*/React.createElement(NoColorIconDecorator, {
113
+ isSelected: isSelected(color),
114
+ iconColor: iconColor
115
+ }) : /*#__PURE__*/React.createElement(TextColorIconDecorator, {
87
116
  label: color.label,
88
117
  isSelected: isSelected(color),
89
118
  iconColor: iconColor
package/dist/esm/editor-commands/change-color.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
2
2
  import { removeMark, toggleMark } from '@atlaskit/editor-common/mark';
3
3
  import { REMOVE_HIGHLIGHT_COLOR, highlightColorPalette, highlightColorPaletteNew } from '@atlaskit/editor-common/ui-color';
4
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
4
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
5
5
  import { HighlightPluginAction, highlightPluginKey } from '../pm-plugins/main';
6
6
  import { getActiveColor } from './color';
7
7
  export var changeColor = function changeColor(editorAnalyticsAPI) {
@@ -38,7 +38,7 @@ export var changeColor = function changeColor(editorAnalyticsAPI) {
38
38
  var createAnalyticsEvent = function createAnalyticsEvent(color, inputMethod, tr) {
39
39
  var _getActiveColor;
40
40
  var previousColor = (_getActiveColor = getActiveColor(tr)) !== null && _getActiveColor !== void 0 ? _getActiveColor : REMOVE_HIGHLIGHT_COLOR;
41
- var highlightPalette = expValEquals('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? highlightColorPaletteNew : highlightColorPalette;
41
+ var highlightPalette = expValEqualsNoExposure('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? highlightColorPaletteNew : highlightColorPalette;
42
42
 
43
43
  // get color names from palette
44
44
  var newColorFromPalette = highlightPalette.find(function (_ref3) {
package/dist/esm/pm-plugins/keymap.js CHANGED
@@ -2,7 +2,7 @@ import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
2
2
  import { applyYellowHighlight, bindKeymapWithCommand, keymap, toggleHighlightPalette } from '@atlaskit/editor-common/keymaps';
3
3
  import { editorCommandToPMCommand } from '@atlaskit/editor-common/preset';
4
4
  import { highlightColorPalette, highlightColorPaletteNew } from '@atlaskit/editor-common/ui-color';
5
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
5
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
6
6
  import { changeColor } from '../editor-commands/change-color';
7
7
  import { togglePalette } from '../editor-commands/palette';
8
8
  export function keymapPlugin(_ref) {
@@ -22,7 +22,7 @@ export function keymapPlugin(_ref) {
22
22
  }), list);
23
23
  }
24
24
  var analyticsApi = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
25
- var highlightPalette = expValEquals('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? highlightColorPaletteNew : highlightColorPalette;
25
+ var highlightPalette = expValEqualsNoExposure('platform_editor_lovability_text_bg_color', 'isEnabled', true) ? highlightColorPaletteNew : highlightColorPalette;
26
26
  var color = highlightPalette.find(function (_ref2) {
27
27
  var label = _ref2.label;
28
28
  return label === 'Yellow';
package/dist/esm/ui/HighlightColorMenuItem.compiled.css CHANGED
@@ -1,9 +1,4 @@
1
1
 
2
- ._2rko12b0{border-radius:var(--ds-radius-small,4px)}
3
- ._zulp12x7{gap:var(--ds-space-075,6px)}._189ee4h9{border-width:var(--ds-border-width,1px)}
4
- ._195gv77o{margin-inline:var(--ds-space-025,2px)}
5
- ._1dqonqa1{border-style:solid}
6
- ._1h6d1l7x{border-color:var(--ds-border,#0b120e24)}
7
- ._18u01n1a{margin-left:-1px}
2
+ ._zulp12x7{gap:var(--ds-space-075,6px)}._18u01n1a{margin-left:-1px}
8
3
  ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
9
4
  ._1e0c1o8l{display:inline-block}
package/dist/esm/ui/HighlightColorMenuItem.js CHANGED
@@ -21,7 +21,6 @@ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
21
21
  var HIGHLIGHT_COLOR_PICKER_COLUMNS = 10;
22
22
  var styles = {
23
23
  container: "_zulp12x7 _19pkpxbi",
24
- removeHighlightButton: "_2rko12b0 _195gv77o _189ee4h9 _1dqonqa1 _1h6d1l7x",
25
24
  icon: "_1e0c1o8l _18u01n1a"
26
25
  };
27
26
  var getTextColorIconColor = function getTextColorIconColor(defaultColor, textColor, isNewColorPaletteEnabled) {
@@ -51,9 +50,37 @@ var TextColorIconDecorator = function TextColorIconDecorator(_ref) {
51
50
  size: "small"
52
51
  }));
53
52
  };
54
- export function HighlightColorMenuItem(_ref2) {
55
- var api = _ref2.api,
56
- parents = _ref2.parents;
53
+ var NoColorIconDecorator = function NoColorIconDecorator(_ref2) {
54
+ var isSelected = _ref2.isSelected,
55
+ iconColor = _ref2.iconColor;
56
+ return /*#__PURE__*/React.createElement("svg", {
57
+ width: "24",
58
+ height: "24",
59
+ viewBox: "0 0 24 24",
60
+ fill: "none",
61
+ xmlns: "http://www.w3.org/2000/svg",
62
+ "aria-hidden": "true"
63
+ }, /*#__PURE__*/React.createElement("g", {
64
+ transform: "translate(-1 -1)"
65
+ }, /*#__PURE__*/React.createElement("rect", {
66
+ x: "1.70703",
67
+ y: "1.35383",
68
+ width: "29.8003",
69
+ height: "0.5",
70
+ transform: "rotate(45 1.70703 1.35383)",
71
+ stroke: "var(--ds-border, #0B120E24)",
72
+ strokeWidth: "0.5"
73
+ }), isSelected ? /*#__PURE__*/React.createElement("path", {
74
+ d: "M17.959 7.9707L10.709 16.9707C10.5675 17.1462 10.3544 17.2488 10.1289 17.25C9.90343 17.2512 9.68924 17.1506 9.5459 16.9766L6.0459 12.7266L7.2041 11.7734L10.1182 15.3115L16.791 7.0293L17.959 7.9707Z",
75
+ fill: "var(--ds-icon, #292A2E)"
76
+ }) : /*#__PURE__*/React.createElement("path", {
77
+ d: "M7.80469 16L10.9746 7.26953H12.2637L15.4746 16H14.3027L12.4512 10.8203C12.3379 10.5 12.2051 10.1016 12.0527 9.625C11.9043 9.14453 11.7227 8.5332 11.5078 7.79102H11.7188C11.5078 8.54102 11.3242 9.16016 11.168 9.64844C11.0156 10.1328 10.8887 10.5234 10.7871 10.8203L8.98828 16H7.80469ZM9.39844 13.5625V12.5898H13.8809V13.5625H9.39844Z",
78
+ fill: iconColor
79
+ })));
80
+ };
81
+ export function HighlightColorMenuItem(_ref3) {
82
+ var api = _ref3.api,
83
+ parents = _ref3.parents;
57
84
  var _useIntl = useIntl(),
58
85
  formatMessage = _useIntl.formatMessage;
59
86
  var activeColor = useSharedPluginStateSelector(api, 'highlight.activeColor');
@@ -86,7 +113,10 @@ export function HighlightColorMenuItem(_ref2) {
86
113
  return isNewColorPaletteEnabled || color.value !== REMOVE_HIGHLIGHT_COLOR;
87
114
  }).map(function (color) {
88
115
  return _objectSpread(_objectSpread({}, color), {}, {
89
- decorator: /*#__PURE__*/React.createElement(TextColorIconDecorator, {
116
+ decorator: isNewColorPaletteEnabled && color.value === REMOVE_HIGHLIGHT_COLOR ? /*#__PURE__*/React.createElement(NoColorIconDecorator, {
117
+ isSelected: isSelected(color),
118
+ iconColor: iconColor
119
+ }) : /*#__PURE__*/React.createElement(TextColorIconDecorator, {
90
120
  label: color.label,
91
121
  isSelected: isSelected(color),
92
122
  iconColor: iconColor
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-highlight",
3
- "version": "12.1.2",
3
+ "version": "12.1.4",
4
4
  "description": "Highlight plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -41,13 +41,13 @@
41
41
  "@atlaskit/icon": "^36.0.0",
42
42
  "@atlaskit/platform-feature-flags": "^2.0.0",
43
43
  "@atlaskit/primitives": "^20.0.0",
44
- "@atlaskit/tmp-editor-statsig": "^108.3.0",
44
+ "@atlaskit/tmp-editor-statsig": "^109.0.0",
45
45
  "@atlaskit/tokens": "^14.0.0",
46
46
  "@babel/runtime": "^7.0.0",
47
47
  "@emotion/react": "^11.7.1"
48
48
  },
49
49
  "peerDependencies": {
50
- "@atlaskit/editor-common": "^116.4.0",
50
+ "@atlaskit/editor-common": "^116.6.0",
51
51
  "react": "^18.2.0",
52
52
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
53
53
  },