@atlaskit/editor-plugin-highlight 12.1.27 → 12.1.29

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 (8) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/cjs/ui/HighlightColorMenuItem.compiled.css +1 -0
  3. package/dist/cjs/ui/HighlightColorMenuItem.js +15 -8
  4. package/dist/es2019/ui/HighlightColorMenuItem.compiled.css +1 -0
  5. package/dist/es2019/ui/HighlightColorMenuItem.js +16 -9
  6. package/dist/esm/ui/HighlightColorMenuItem.compiled.css +1 -0
  7. package/dist/esm/ui/HighlightColorMenuItem.js +16 -9
  8. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/editor-plugin-highlight
2
2
 
3
+ ## 12.1.29
4
+
5
+ ### Patch Changes
6
+
7
+ - [`d778b282fb391`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d778b282fb391) -
8
+ Tighten color picker spacing and footer dimensions.
9
+
10
+ The `@atlaskit/editor-toolbar/color-palette` entry point now supports a `gap` prop to customise
11
+ spacing between color tile wrappers, for example: `<ColorPalette gap="space.0" {...props} />`.
12
+
13
+ - Updated dependencies
14
+
15
+ ## 12.1.28
16
+
17
+ ### Patch Changes
18
+
19
+ - Updated dependencies
20
+
3
21
  ## 12.1.27
4
22
 
5
23
  ### Patch Changes
package/dist/cjs/ui/HighlightColorMenuItem.compiled.css CHANGED
@@ -1,4 +1,5 @@
1
1
 
2
2
  ._zulp12x7{gap:var(--ds-space-075,6px)}._18u01n1a{margin-left:-1px}
3
3
  ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
4
+ ._19pkze3t{margin-top:var(--ds-space-0,0)}
4
5
  ._1e0c1o8l{display:inline-block}
package/dist/cjs/ui/HighlightColorMenuItem.js CHANGED
@@ -13,6 +13,7 @@ var React = _react;
13
13
  var _runtime = require("@compiled/react/runtime");
14
14
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
15
15
  var _reactIntl = require("react-intl");
16
+ var _css = require("@atlaskit/css");
16
17
  var _messages = require("@atlaskit/editor-common/messages");
17
18
  var _toolbar = require("@atlaskit/editor-common/toolbar");
18
19
  var _uiColor = require("@atlaskit/editor-common/ui-color");
@@ -22,6 +23,7 @@ var _editorToolbar = require("@atlaskit/editor-toolbar");
22
23
  var _heading = _interopRequireDefault(require("@atlaskit/heading"));
23
24
  var _checkMark = _interopRequireDefault(require("@atlaskit/icon/core/check-mark"));
24
25
  var _textStyle = _interopRequireDefault(require("@atlaskit/icon/core/text-style"));
26
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
25
27
  var _compiled = require("@atlaskit/primitives/compiled");
26
28
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
27
29
  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); }
@@ -30,6 +32,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
30
32
  var HIGHLIGHT_COLOR_PICKER_COLUMNS = 10;
31
33
  var styles = {
32
34
  container: "_zulp12x7 _19pkpxbi",
35
+ containerPatch: "_19pkze3t",
33
36
  icon: "_1e0c1o8l _18u01n1a"
34
37
  };
35
38
  var getTextColorIconColor = function getTextColorIconColor(defaultColor, textColor, isNewColorPaletteEnabled) {
@@ -133,13 +136,9 @@ function HighlightColorMenuItem(_ref3) {
133
136
  });
134
137
  });
135
138
  }, [defaultColor, textColor, isNewColorPaletteEnabled, selectedColor]);
136
- return /*#__PURE__*/React.createElement(_compiled.Stack, {
137
- xcss: styles.container,
138
- testId: "highlight-color-menu-item"
139
- }, /*#__PURE__*/React.createElement(_heading.default, {
140
- size: "xxsmall"
141
- }, formatMessage(_messages.highlightMessages.highlight)), /*#__PURE__*/React.createElement(_editorToolbar.ColorPalette, {
142
- cols: isNewColorPaletteEnabled ? HIGHLIGHT_COLOR_PICKER_COLUMNS : undefined
139
+ var colorPaletteElement = /*#__PURE__*/React.createElement(_editorToolbar.ColorPalette, {
140
+ cols: isNewColorPaletteEnabled ? HIGHLIGHT_COLOR_PICKER_COLUMNS : undefined,
141
+ gap: isNewColorPaletteEnabled && (0, _platformFeatureFlags.fg)('platform_editor_lovability_text_bg_color_patch_1') ? 'space.0' : undefined
143
142
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
144
143
  ,
145
144
  onClick: function onClick(color, _, event) {
@@ -152,5 +151,13 @@ function HighlightColorMenuItem(_ref3) {
152
151
  palette: colorPalette || [],
153
152
  hexToPaletteColor: _editorPalette.hexToEditorTextBackgroundPaletteColor
154
153
  }
155
- }));
154
+ });
155
+ return /*#__PURE__*/React.createElement(_compiled.Stack, {
156
+ xcss: (0, _css.cx)(styles.container, isNewColorPaletteEnabled && (0, _platformFeatureFlags.fg)('platform_editor_lovability_text_bg_color_patch_1') && styles.containerPatch),
157
+ testId: "highlight-color-menu-item"
158
+ }, /*#__PURE__*/React.createElement(_heading.default, {
159
+ size: "xxsmall"
160
+ }, formatMessage(_messages.highlightMessages.highlight)), isNewColorPaletteEnabled && (0, _platformFeatureFlags.fg)('platform_editor_lovability_text_bg_color_patch_1') ? /*#__PURE__*/React.createElement(_compiled.Bleed, {
161
+ inline: "space.025"
162
+ }, colorPaletteElement) : colorPaletteElement);
156
163
  }
package/dist/es2019/ui/HighlightColorMenuItem.compiled.css CHANGED
@@ -1,4 +1,5 @@
1
1
 
2
2
  ._zulp12x7{gap:var(--ds-space-075,6px)}._18u01n1a{margin-left:-1px}
3
3
  ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
4
+ ._19pkze3t{margin-top:var(--ds-space-0,0)}
4
5
  ._1e0c1o8l{display:inline-block}
package/dist/es2019/ui/HighlightColorMenuItem.js CHANGED
@@ -4,6 +4,7 @@ import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
5
  import { useCallback, useMemo } from 'react';
6
6
  import { useIntl } from 'react-intl';
7
+ import { cx } from '@atlaskit/css';
7
8
  import { highlightMessages as messages } from '@atlaskit/editor-common/messages';
8
9
  import { getInputMethodFromParentKeys } from '@atlaskit/editor-common/toolbar';
9
10
  import { REMOVE_HIGHLIGHT_COLOR, highlightColorPalette, highlightColorPaletteNew, useSelectedTextColor } from '@atlaskit/editor-common/ui-color';
@@ -13,11 +14,13 @@ import { ColorPalette, useToolbarDropdownMenu } from '@atlaskit/editor-toolbar';
13
14
  import Heading from '@atlaskit/heading';
14
15
  import EditorDoneIcon from '@atlaskit/icon/core/check-mark';
15
16
  import Icon from '@atlaskit/icon/core/text-style';
16
- import { Stack, Box } from '@atlaskit/primitives/compiled';
17
+ import { fg } from '@atlaskit/platform-feature-flags';
18
+ import { Bleed, Stack, Box } from '@atlaskit/primitives/compiled';
17
19
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
18
20
  const HIGHLIGHT_COLOR_PICKER_COLUMNS = 10;
19
21
  const styles = {
20
22
  container: "_zulp12x7 _19pkpxbi",
23
+ containerPatch: "_19pkze3t",
21
24
  icon: "_1e0c1o8l _18u01n1a"
22
25
  };
23
26
  const getTextColorIconColor = (defaultColor, textColor, isNewColorPaletteEnabled) => {
@@ -119,13 +122,9 @@ export function HighlightColorMenuItem({
119
122
  })
120
123
  }));
121
124
  }, [defaultColor, textColor, isNewColorPaletteEnabled, selectedColor]);
122
- return /*#__PURE__*/React.createElement(Stack, {
123
- xcss: styles.container,
124
- testId: "highlight-color-menu-item"
125
- }, /*#__PURE__*/React.createElement(Heading, {
126
- size: "xxsmall"
127
- }, formatMessage(messages.highlight)), /*#__PURE__*/React.createElement(ColorPalette, {
128
- cols: isNewColorPaletteEnabled ? HIGHLIGHT_COLOR_PICKER_COLUMNS : undefined
125
+ const colorPaletteElement = /*#__PURE__*/React.createElement(ColorPalette, {
126
+ cols: isNewColorPaletteEnabled ? HIGHLIGHT_COLOR_PICKER_COLUMNS : undefined,
127
+ gap: isNewColorPaletteEnabled && fg('platform_editor_lovability_text_bg_color_patch_1') ? 'space.0' : undefined
129
128
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
130
129
  ,
131
130
  onClick: (color, _, event) => {
@@ -138,5 +137,13 @@ export function HighlightColorMenuItem({
138
137
  palette: colorPalette || [],
139
138
  hexToPaletteColor: hexToEditorTextBackgroundPaletteColor
140
139
  }
141
- }));
140
+ });
141
+ return /*#__PURE__*/React.createElement(Stack, {
142
+ xcss: cx(styles.container, isNewColorPaletteEnabled && fg('platform_editor_lovability_text_bg_color_patch_1') && styles.containerPatch),
143
+ testId: "highlight-color-menu-item"
144
+ }, /*#__PURE__*/React.createElement(Heading, {
145
+ size: "xxsmall"
146
+ }, formatMessage(messages.highlight)), isNewColorPaletteEnabled && fg('platform_editor_lovability_text_bg_color_patch_1') ? /*#__PURE__*/React.createElement(Bleed, {
147
+ inline: "space.025"
148
+ }, colorPaletteElement) : colorPaletteElement);
142
149
  }
package/dist/esm/ui/HighlightColorMenuItem.compiled.css CHANGED
@@ -1,4 +1,5 @@
1
1
 
2
2
  ._zulp12x7{gap:var(--ds-space-075,6px)}._18u01n1a{margin-left:-1px}
3
3
  ._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
4
+ ._19pkze3t{margin-top:var(--ds-space-0,0)}
4
5
  ._1e0c1o8l{display:inline-block}
package/dist/esm/ui/HighlightColorMenuItem.js CHANGED
@@ -7,6 +7,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
7
7
  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) { _defineProperty(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; }
8
8
  import { useCallback, useMemo } from 'react';
9
9
  import { useIntl } from 'react-intl';
10
+ import { cx } from '@atlaskit/css';
10
11
  import { highlightMessages as messages } from '@atlaskit/editor-common/messages';
11
12
  import { getInputMethodFromParentKeys } from '@atlaskit/editor-common/toolbar';
12
13
  import { REMOVE_HIGHLIGHT_COLOR, highlightColorPalette, highlightColorPaletteNew, useSelectedTextColor } from '@atlaskit/editor-common/ui-color';
@@ -16,11 +17,13 @@ import { ColorPalette, useToolbarDropdownMenu } from '@atlaskit/editor-toolbar';
16
17
  import Heading from '@atlaskit/heading';
17
18
  import EditorDoneIcon from '@atlaskit/icon/core/check-mark';
18
19
  import Icon from '@atlaskit/icon/core/text-style';
19
- import { Stack, Box } from '@atlaskit/primitives/compiled';
20
+ import { fg } from '@atlaskit/platform-feature-flags';
21
+ import { Bleed, Stack, Box } from '@atlaskit/primitives/compiled';
20
22
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
21
23
  var HIGHLIGHT_COLOR_PICKER_COLUMNS = 10;
22
24
  var styles = {
23
25
  container: "_zulp12x7 _19pkpxbi",
26
+ containerPatch: "_19pkze3t",
24
27
  icon: "_1e0c1o8l _18u01n1a"
25
28
  };
26
29
  var getTextColorIconColor = function getTextColorIconColor(defaultColor, textColor, isNewColorPaletteEnabled) {
@@ -124,13 +127,9 @@ export function HighlightColorMenuItem(_ref3) {
124
127
  });
125
128
  });
126
129
  }, [defaultColor, textColor, isNewColorPaletteEnabled, selectedColor]);
127
- return /*#__PURE__*/React.createElement(Stack, {
128
- xcss: styles.container,
129
- testId: "highlight-color-menu-item"
130
- }, /*#__PURE__*/React.createElement(Heading, {
131
- size: "xxsmall"
132
- }, formatMessage(messages.highlight)), /*#__PURE__*/React.createElement(ColorPalette, {
133
- cols: isNewColorPaletteEnabled ? HIGHLIGHT_COLOR_PICKER_COLUMNS : undefined
130
+ var colorPaletteElement = /*#__PURE__*/React.createElement(ColorPalette, {
131
+ cols: isNewColorPaletteEnabled ? HIGHLIGHT_COLOR_PICKER_COLUMNS : undefined,
132
+ gap: isNewColorPaletteEnabled && fg('platform_editor_lovability_text_bg_color_patch_1') ? 'space.0' : undefined
134
133
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
135
134
  ,
136
135
  onClick: function onClick(color, _, event) {
@@ -143,5 +142,13 @@ export function HighlightColorMenuItem(_ref3) {
143
142
  palette: colorPalette || [],
144
143
  hexToPaletteColor: hexToEditorTextBackgroundPaletteColor
145
144
  }
146
- }));
145
+ });
146
+ return /*#__PURE__*/React.createElement(Stack, {
147
+ xcss: cx(styles.container, isNewColorPaletteEnabled && fg('platform_editor_lovability_text_bg_color_patch_1') && styles.containerPatch),
148
+ testId: "highlight-color-menu-item"
149
+ }, /*#__PURE__*/React.createElement(Heading, {
150
+ size: "xxsmall"
151
+ }, formatMessage(messages.highlight)), isNewColorPaletteEnabled && fg('platform_editor_lovability_text_bg_color_patch_1') ? /*#__PURE__*/React.createElement(Bleed, {
152
+ inline: "space.025"
153
+ }, colorPaletteElement) : colorPaletteElement);
147
154
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-highlight",
3
- "version": "12.1.27",
3
+ "version": "12.1.29",
4
4
  "description": "Highlight plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -35,19 +35,19 @@
35
35
  "@atlaskit/editor-prosemirror": "^8.0.0",
36
36
  "@atlaskit/editor-shared-styles": "^4.0.0",
37
37
  "@atlaskit/editor-tables": "^3.0.0",
38
- "@atlaskit/editor-toolbar": "^2.2.0",
38
+ "@atlaskit/editor-toolbar": "^2.3.0",
39
39
  "@atlaskit/editor-toolbar-model": "^1.1.0",
40
40
  "@atlaskit/heading": "^6.2.0",
41
41
  "@atlaskit/icon": "^37.0.0",
42
42
  "@atlaskit/platform-feature-flags": "^2.0.0",
43
43
  "@atlaskit/primitives": "^21.0.0",
44
- "@atlaskit/tmp-editor-statsig": "^125.2.0",
44
+ "@atlaskit/tmp-editor-statsig": "^126.1.0",
45
45
  "@atlaskit/tokens": "^15.8.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.30.0",
50
+ "@atlaskit/editor-common": "^116.32.0",
51
51
  "react": "^18.2.0",
52
52
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
53
53
  },