@atlaskit/editor-plugin-highlight 2.1.4 → 2.2.0
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.
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,19 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-highlight
|
|
2
2
|
|
|
3
|
+
## 2.2.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#126627](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/126627)
|
|
8
|
+
[`5842a0b7641b7`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5842a0b7641b7) -
|
|
9
|
+
[ux] EDF-2580: Swap Orange to Yellow in editor text background color palette toolbar behind
|
|
10
|
+
experiment editor_text_highlight_orange_to_yellow, minor bump adf-schema in resolutions to pick up
|
|
11
|
+
toDOM mark render update
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- Updated dependencies
|
|
16
|
+
|
|
3
17
|
## 2.1.4
|
|
4
18
|
|
|
5
19
|
### Patch Changes
|
|
@@ -5,11 +5,15 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.PaletteDropdown = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
8
9
|
var _react = _interopRequireDefault(require("react"));
|
|
9
10
|
var _uiColor = require("@atlaskit/editor-common/ui-color");
|
|
10
11
|
var _uiMenu = require("@atlaskit/editor-common/ui-menu");
|
|
11
12
|
var _editorPalette = require("@atlaskit/editor-palette");
|
|
12
13
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
14
|
+
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
15
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
16
|
+
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; }
|
|
13
17
|
var PaletteDropdown = exports.PaletteDropdown = function PaletteDropdown(props) {
|
|
14
18
|
var popupsMountPoint = props.popupsMountPoint,
|
|
15
19
|
popupsBoundariesElement = props.popupsBoundariesElement,
|
|
@@ -25,7 +29,21 @@ var PaletteDropdown = exports.PaletteDropdown = function PaletteDropdown(props)
|
|
|
25
29
|
// pixels, used to determine where to horizontally position the dropdown when space is limited
|
|
26
30
|
// this should reflect the width of the dropdown when fully populated with colors, including translations due to layering
|
|
27
31
|
var fitWidth = 242;
|
|
28
|
-
var
|
|
32
|
+
var colorPalette = _uiColor.highlightColorPalette;
|
|
33
|
+
if ((0, _experiments.editorExperiment)('editor_text_highlight_orange_to_yellow', 'test', {
|
|
34
|
+
exposure: true
|
|
35
|
+
})) {
|
|
36
|
+
colorPalette = _uiColor.highlightColorPalette.map(function (item) {
|
|
37
|
+
if (item.label === 'Orange') {
|
|
38
|
+
return _objectSpread(_objectSpread({}, item), {}, {
|
|
39
|
+
label: 'Yellow',
|
|
40
|
+
message: _uiColor.colorPaletteMessages.yellow
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
return item;
|
|
44
|
+
});
|
|
45
|
+
}
|
|
46
|
+
var _getSelectedRowAndCol = (0, _uiColor.getSelectedRowAndColumnFromPalette)(colorPalette, activeColor),
|
|
29
47
|
selectedRowIndex = _getSelectedRowAndCol.selectedRowIndex,
|
|
30
48
|
selectedColumnIndex = _getSelectedRowAndCol.selectedColumnIndex;
|
|
31
49
|
return /*#__PURE__*/_react.default.createElement(_uiMenu.DropdownContainer, {
|
|
@@ -52,7 +70,7 @@ var PaletteDropdown = exports.PaletteDropdown = function PaletteDropdown(props)
|
|
|
52
70
|
onClick: onColorChange,
|
|
53
71
|
selectedColor: activeColor,
|
|
54
72
|
paletteOptions: {
|
|
55
|
-
palette:
|
|
73
|
+
palette: colorPalette,
|
|
56
74
|
hexToPaletteColor: _editorPalette.hexToEditorTextBackgroundPaletteColor
|
|
57
75
|
}
|
|
58
76
|
})));
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ColorPalette, getSelectedRowAndColumnFromPalette, highlightColorPalette } from '@atlaskit/editor-common/ui-color';
|
|
2
|
+
import { ColorPalette, colorPaletteMessages, getSelectedRowAndColumnFromPalette, highlightColorPalette } from '@atlaskit/editor-common/ui-color';
|
|
3
3
|
import { ArrowKeyNavigationType, DropdownContainer as Dropdown } from '@atlaskit/editor-common/ui-menu';
|
|
4
4
|
import { hexToEditorTextBackgroundPaletteColor } from '@atlaskit/editor-palette';
|
|
5
5
|
import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
|
|
6
|
+
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
6
7
|
export const PaletteDropdown = props => {
|
|
7
8
|
const {
|
|
8
9
|
popupsMountPoint,
|
|
@@ -20,10 +21,25 @@ export const PaletteDropdown = props => {
|
|
|
20
21
|
// pixels, used to determine where to horizontally position the dropdown when space is limited
|
|
21
22
|
// this should reflect the width of the dropdown when fully populated with colors, including translations due to layering
|
|
22
23
|
const fitWidth = 242;
|
|
24
|
+
let colorPalette = highlightColorPalette;
|
|
25
|
+
if (editorExperiment('editor_text_highlight_orange_to_yellow', 'test', {
|
|
26
|
+
exposure: true
|
|
27
|
+
})) {
|
|
28
|
+
colorPalette = highlightColorPalette.map(item => {
|
|
29
|
+
if (item.label === 'Orange') {
|
|
30
|
+
return {
|
|
31
|
+
...item,
|
|
32
|
+
label: 'Yellow',
|
|
33
|
+
message: colorPaletteMessages.yellow
|
|
34
|
+
};
|
|
35
|
+
}
|
|
36
|
+
return item;
|
|
37
|
+
});
|
|
38
|
+
}
|
|
23
39
|
const {
|
|
24
40
|
selectedRowIndex,
|
|
25
41
|
selectedColumnIndex
|
|
26
|
-
} = getSelectedRowAndColumnFromPalette(
|
|
42
|
+
} = getSelectedRowAndColumnFromPalette(colorPalette, activeColor);
|
|
27
43
|
return /*#__PURE__*/React.createElement(Dropdown, {
|
|
28
44
|
mountTo: popupsMountPoint,
|
|
29
45
|
boundariesElement: popupsBoundariesElement,
|
|
@@ -48,7 +64,7 @@ export const PaletteDropdown = props => {
|
|
|
48
64
|
onClick: onColorChange,
|
|
49
65
|
selectedColor: activeColor,
|
|
50
66
|
paletteOptions: {
|
|
51
|
-
palette:
|
|
67
|
+
palette: colorPalette,
|
|
52
68
|
hexToPaletteColor: hexToEditorTextBackgroundPaletteColor
|
|
53
69
|
}
|
|
54
70
|
})));
|
|
@@ -1,8 +1,12 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
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; }
|
|
1
4
|
import React from 'react';
|
|
2
|
-
import { ColorPalette, getSelectedRowAndColumnFromPalette, highlightColorPalette } from '@atlaskit/editor-common/ui-color';
|
|
5
|
+
import { ColorPalette, colorPaletteMessages, getSelectedRowAndColumnFromPalette, highlightColorPalette } from '@atlaskit/editor-common/ui-color';
|
|
3
6
|
import { ArrowKeyNavigationType, DropdownContainer as Dropdown } from '@atlaskit/editor-common/ui-menu';
|
|
4
7
|
import { hexToEditorTextBackgroundPaletteColor } from '@atlaskit/editor-palette';
|
|
5
8
|
import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
|
|
9
|
+
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
6
10
|
export var PaletteDropdown = function PaletteDropdown(props) {
|
|
7
11
|
var popupsMountPoint = props.popupsMountPoint,
|
|
8
12
|
popupsBoundariesElement = props.popupsBoundariesElement,
|
|
@@ -18,7 +22,21 @@ export var PaletteDropdown = function PaletteDropdown(props) {
|
|
|
18
22
|
// pixels, used to determine where to horizontally position the dropdown when space is limited
|
|
19
23
|
// this should reflect the width of the dropdown when fully populated with colors, including translations due to layering
|
|
20
24
|
var fitWidth = 242;
|
|
21
|
-
var
|
|
25
|
+
var colorPalette = highlightColorPalette;
|
|
26
|
+
if (editorExperiment('editor_text_highlight_orange_to_yellow', 'test', {
|
|
27
|
+
exposure: true
|
|
28
|
+
})) {
|
|
29
|
+
colorPalette = highlightColorPalette.map(function (item) {
|
|
30
|
+
if (item.label === 'Orange') {
|
|
31
|
+
return _objectSpread(_objectSpread({}, item), {}, {
|
|
32
|
+
label: 'Yellow',
|
|
33
|
+
message: colorPaletteMessages.yellow
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
return item;
|
|
37
|
+
});
|
|
38
|
+
}
|
|
39
|
+
var _getSelectedRowAndCol = getSelectedRowAndColumnFromPalette(colorPalette, activeColor),
|
|
22
40
|
selectedRowIndex = _getSelectedRowAndCol.selectedRowIndex,
|
|
23
41
|
selectedColumnIndex = _getSelectedRowAndCol.selectedColumnIndex;
|
|
24
42
|
return /*#__PURE__*/React.createElement(Dropdown, {
|
|
@@ -45,7 +63,7 @@ export var PaletteDropdown = function PaletteDropdown(props) {
|
|
|
45
63
|
onClick: onColorChange,
|
|
46
64
|
selectedColor: activeColor,
|
|
47
65
|
paletteOptions: {
|
|
48
|
-
palette:
|
|
66
|
+
palette: colorPalette,
|
|
49
67
|
hexToPaletteColor: hexToEditorTextBackgroundPaletteColor
|
|
50
68
|
}
|
|
51
69
|
})));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-highlight",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.2.0",
|
|
4
4
|
"description": "Highlight plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"@atlaskit/adf-schema": "^47.6.0",
|
|
40
40
|
"@atlaskit/editor-common": "^102.5.0",
|
|
41
|
-
"@atlaskit/editor-palette": "^2.
|
|
41
|
+
"@atlaskit/editor-palette": "^2.1.0",
|
|
42
42
|
"@atlaskit/editor-plugin-analytics": "^2.1.0",
|
|
43
43
|
"@atlaskit/editor-plugin-primary-toolbar": "^3.0.0",
|
|
44
44
|
"@atlaskit/editor-plugin-selection-toolbar": "^2.0.0",
|