@atlaskit/editor-plugin-highlight 1.7.5 → 1.8.1

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 (5) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/dist/cjs/ui/ToolbarHighlightColor.js +6 -2
  3. package/dist/es2019/ui/ToolbarHighlightColor.js +7 -3
  4. package/dist/esm/ui/ToolbarHighlightColor.js +7 -3
  5. package/package.json +111 -105
package/CHANGELOG.md CHANGED
@@ -1,5 +1,24 @@
1
1
  # @atlaskit/editor-plugin-highlight
2
2
 
3
+ ## 1.8.1
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 1.8.0
10
+
11
+ ### Minor Changes
12
+
13
+ - [#110884](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110884)
14
+ [`674f78166705c`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/674f78166705c) -
15
+ [ux] [ED-23516] Change border color for highlight and text-color palettes to use tokens.
16
+ Changedefault palette color when undefined
17
+
18
+ ### Patch Changes
19
+
20
+ - Updated dependencies
21
+
3
22
  ## 1.7.5
4
23
 
5
24
  ### Patch Changes
package/dist/cjs/ui/ToolbarHighlightColor.js CHANGED
@@ -19,6 +19,7 @@ var _uiMenu = require("@atlaskit/editor-common/ui-menu");
19
19
  var _editorPalette = require("@atlaskit/editor-palette");
20
20
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
21
21
  var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-down"));
22
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
22
23
  var _primitives = require("@atlaskit/primitives");
23
24
  var _commands = require("../commands");
24
25
  var _EditorHighlightIcon = require("./EditorHighlightIcon");
@@ -26,6 +27,8 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
26
27
  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 && Object.prototype.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; }
27
28
  /** @jsx jsx */
28
29
 
30
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
31
+
29
32
  var ToolbarHighlightColor = function ToolbarHighlightColor(_ref) {
30
33
  var popupsMountPoint = _ref.popupsMountPoint,
31
34
  popupsBoundariesElement = _ref.popupsBoundariesElement,
@@ -99,7 +102,8 @@ var ToolbarHighlightColor = function ToolbarHighlightColor(_ref) {
99
102
  // pixels, used to determine where to horizontally position the dropdown when space is limited
100
103
  // this should reflect the width of the dropdown when fully populated with colors, including translations due to layering
101
104
  var fitWidth = 242;
102
- var _getSelectedRowAndCol = (0, _uiColor.getSelectedRowAndColumnFromPalette)(_uiColor.highlightColorPalette, highlightState.activeColor),
105
+ var palette = (0, _platformFeatureFlags.getBooleanFF)('platform.editor.dynamic-palette-borders') ? _uiColor.highlightColorPaletteWithTokenBorders : _uiColor.highlightColorPalette;
106
+ var _getSelectedRowAndCol = (0, _uiColor.getSelectedRowAndColumnFromPalette)(palette, highlightState.activeColor),
103
107
  selectedRowIndex = _getSelectedRowAndCol.selectedRowIndex,
104
108
  selectedColumnIndex = _getSelectedRowAndCol.selectedColumnIndex;
105
109
  return (0, _react2.jsx)(_primitives.Flex, {
@@ -151,7 +155,7 @@ var ToolbarHighlightColor = function ToolbarHighlightColor(_ref) {
151
155
  },
152
156
  selectedColor: highlightState.activeColor,
153
157
  paletteOptions: {
154
- palette: _uiColor.highlightColorPalette,
158
+ palette: palette,
155
159
  hexToPaletteColor: _editorPalette.hexToEditorTextBackgroundPaletteColor
156
160
  }
157
161
  }))));
package/dist/es2019/ui/ToolbarHighlightColor.js CHANGED
@@ -1,16 +1,19 @@
1
1
  /** @jsx jsx */
2
2
  import React, { useRef, useState } from 'react';
3
+
4
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
3
5
  import { jsx } from '@emotion/react';
4
6
  import { injectIntl } from 'react-intl-next';
5
7
  import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
6
8
  import { getAriaKeyshortcuts, toggleHighlightPalette, tooltip } from '@atlaskit/editor-common/keymaps';
7
9
  import { highlightMessages as messages } from '@atlaskit/editor-common/messages';
8
10
  import { expandIconWrapperStyle } from '@atlaskit/editor-common/styles';
9
- import { ColorPalette, getSelectedRowAndColumnFromPalette, highlightColorPalette } from '@atlaskit/editor-common/ui-color';
11
+ import { ColorPalette, getSelectedRowAndColumnFromPalette, highlightColorPalette, highlightColorPaletteWithTokenBorders } from '@atlaskit/editor-common/ui-color';
10
12
  import { ArrowKeyNavigationType, DropdownContainer as Dropdown, TOOLBAR_BUTTON, ToolbarButton } from '@atlaskit/editor-common/ui-menu';
11
13
  import { hexToEditorTextBackgroundPaletteColor } from '@atlaskit/editor-palette';
12
14
  import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
13
15
  import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
16
+ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
14
17
  import { Flex } from '@atlaskit/primitives';
15
18
  import { changeColor, setPalette } from '../commands';
16
19
  import { EditorHighlightIcon } from './EditorHighlightIcon';
@@ -88,10 +91,11 @@ const ToolbarHighlightColor = ({
88
91
  // pixels, used to determine where to horizontally position the dropdown when space is limited
89
92
  // this should reflect the width of the dropdown when fully populated with colors, including translations due to layering
90
93
  const fitWidth = 242;
94
+ const palette = getBooleanFF('platform.editor.dynamic-palette-borders') ? highlightColorPaletteWithTokenBorders : highlightColorPalette;
91
95
  const {
92
96
  selectedRowIndex,
93
97
  selectedColumnIndex
94
- } = getSelectedRowAndColumnFromPalette(highlightColorPalette, highlightState.activeColor);
98
+ } = getSelectedRowAndColumnFromPalette(palette, highlightState.activeColor);
95
99
  return jsx(Flex, {
96
100
  alignItems: "center"
97
101
  }, jsx(Dropdown, {
@@ -139,7 +143,7 @@ const ToolbarHighlightColor = ({
139
143
  onClick: color => handleColorChange(color),
140
144
  selectedColor: highlightState.activeColor,
141
145
  paletteOptions: {
142
- palette: highlightColorPalette,
146
+ palette,
143
147
  hexToPaletteColor: hexToEditorTextBackgroundPaletteColor
144
148
  }
145
149
  }))));
package/dist/esm/ui/ToolbarHighlightColor.js CHANGED
@@ -1,17 +1,20 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
2
  /** @jsx jsx */
3
3
  import React, { useRef, useState } from 'react';
4
+
5
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
4
6
  import { jsx } from '@emotion/react';
5
7
  import { injectIntl } from 'react-intl-next';
6
8
  import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
7
9
  import { getAriaKeyshortcuts, toggleHighlightPalette, tooltip } from '@atlaskit/editor-common/keymaps';
8
10
  import { highlightMessages as messages } from '@atlaskit/editor-common/messages';
9
11
  import { expandIconWrapperStyle } from '@atlaskit/editor-common/styles';
10
- import { ColorPalette, getSelectedRowAndColumnFromPalette, highlightColorPalette } from '@atlaskit/editor-common/ui-color';
12
+ import { ColorPalette, getSelectedRowAndColumnFromPalette, highlightColorPalette, highlightColorPaletteWithTokenBorders } from '@atlaskit/editor-common/ui-color';
11
13
  import { ArrowKeyNavigationType, DropdownContainer as Dropdown, TOOLBAR_BUTTON, ToolbarButton } from '@atlaskit/editor-common/ui-menu';
12
14
  import { hexToEditorTextBackgroundPaletteColor } from '@atlaskit/editor-palette';
13
15
  import { akEditorMenuZIndex } from '@atlaskit/editor-shared-styles';
14
16
  import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
17
+ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
15
18
  import { Flex } from '@atlaskit/primitives';
16
19
  import { changeColor, setPalette } from '../commands';
17
20
  import { EditorHighlightIcon } from './EditorHighlightIcon';
@@ -88,7 +91,8 @@ var ToolbarHighlightColor = function ToolbarHighlightColor(_ref) {
88
91
  // pixels, used to determine where to horizontally position the dropdown when space is limited
89
92
  // this should reflect the width of the dropdown when fully populated with colors, including translations due to layering
90
93
  var fitWidth = 242;
91
- var _getSelectedRowAndCol = getSelectedRowAndColumnFromPalette(highlightColorPalette, highlightState.activeColor),
94
+ var palette = getBooleanFF('platform.editor.dynamic-palette-borders') ? highlightColorPaletteWithTokenBorders : highlightColorPalette;
95
+ var _getSelectedRowAndCol = getSelectedRowAndColumnFromPalette(palette, highlightState.activeColor),
92
96
  selectedRowIndex = _getSelectedRowAndCol.selectedRowIndex,
93
97
  selectedColumnIndex = _getSelectedRowAndCol.selectedColumnIndex;
94
98
  return jsx(Flex, {
@@ -140,7 +144,7 @@ var ToolbarHighlightColor = function ToolbarHighlightColor(_ref) {
140
144
  },
141
145
  selectedColor: highlightState.activeColor,
142
146
  paletteOptions: {
143
- palette: highlightColorPalette,
147
+ palette: palette,
144
148
  hexToPaletteColor: hexToEditorTextBackgroundPaletteColor
145
149
  }
146
150
  }))));
package/package.json CHANGED
@@ -1,106 +1,112 @@
1
1
  {
2
- "name": "@atlaskit/editor-plugin-highlight",
3
- "version": "1.7.5",
4
- "description": "Highlight plugin for @atlaskit/editor-core",
5
- "author": "Atlassian Pty Ltd",
6
- "license": "Apache-2.0",
7
- "publishConfig": {
8
- "registry": "https://registry.npmjs.org/"
9
- },
10
- "atlassian": {
11
- "team": "Editor: Core Experiences",
12
- "inPublicMirror": false,
13
- "releaseModel": "continuous",
14
- "website": {
15
- "name": "EditorPluginHighlight",
16
- "category": "Components"
17
- },
18
- "runReact18": false
19
- },
20
- "repository": "https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo",
21
- "main": "dist/cjs/index.js",
22
- "module": "dist/esm/index.js",
23
- "module:es2019": "dist/es2019/index.js",
24
- "types": "dist/types/index.d.ts",
25
- "typesVersions": {
26
- ">=4.5 <5.4": {
27
- "*": [
28
- "dist/types-ts4.5/*",
29
- "dist/types-ts4.5/index.d.ts"
30
- ]
31
- }
32
- },
33
- "sideEffects": [
34
- "*.compiled.css"
35
- ],
36
- "atlaskit:src": "src/index.ts",
37
- "af:exports": {
38
- ".": "./src/index.ts"
39
- },
40
- "dependencies": {
41
- "@atlaskit/editor-common": "^82.4.0",
42
- "@atlaskit/editor-palette": "1.6.0",
43
- "@atlaskit/editor-plugin-analytics": "^1.2.0",
44
- "@atlaskit/editor-plugin-background-color": "^1.1.0",
45
- "@atlaskit/editor-plugin-primary-toolbar": "^1.1.0",
46
- "@atlaskit/editor-plugin-text-formatting": "^1.7.0",
47
- "@atlaskit/editor-prosemirror": "4.0.1",
48
- "@atlaskit/editor-shared-styles": "^2.12.0",
49
- "@atlaskit/editor-tables": "^2.7.4",
50
- "@atlaskit/icon": "^22.3.0",
51
- "@atlaskit/primitives": "^7.0.0",
52
- "@babel/runtime": "^7.0.0",
53
- "@emotion/react": "^11.7.1"
54
- },
55
- "peerDependencies": {
56
- "react": "^16.8.0",
57
- "react-intl-next": "npm:react-intl@^5.18.1"
58
- },
59
- "devDependencies": {
60
- "@atlaskit/tokens": "^1.50.0",
61
- "typescript": "~5.4.2"
62
- },
63
- "techstack": {
64
- "@atlassian/frontend": {
65
- "import-structure": [
66
- "atlassian-conventions"
67
- ],
68
- "circular-dependencies": [
69
- "file-and-folder-level"
70
- ]
71
- },
72
- "@repo/internal": {
73
- "dom-events": "use-bind-event-listener",
74
- "analytics": [
75
- "analytics-next"
76
- ],
77
- "design-tokens": [
78
- "color"
79
- ],
80
- "theming": [
81
- "react-context"
82
- ],
83
- "ui-components": [
84
- "lite-mode"
85
- ],
86
- "deprecation": [
87
- "no-deprecated-imports"
88
- ],
89
- "styling": [
90
- "static",
91
- "compiled"
92
- ],
93
- "imports": [
94
- "import-no-extraneous-disable-for-examples-and-docs"
95
- ]
96
- }
97
- },
98
- "stricter": {
99
- "no-unused-dependencies": {
100
- "checkDevDependencies": true,
101
- "exclude": [
102
- "@atlaskit/tokens"
103
- ]
104
- }
105
- }
106
- }
2
+ "name": "@atlaskit/editor-plugin-highlight",
3
+ "version": "1.8.1",
4
+ "description": "Highlight plugin for @atlaskit/editor-core",
5
+ "author": "Atlassian Pty Ltd",
6
+ "license": "Apache-2.0",
7
+ "publishConfig": {
8
+ "registry": "https://registry.npmjs.org/"
9
+ },
10
+ "atlassian": {
11
+ "team": "Editor: Core Experiences",
12
+ "inPublicMirror": false,
13
+ "releaseModel": "continuous",
14
+ "website": {
15
+ "name": "EditorPluginHighlight",
16
+ "category": "Components"
17
+ },
18
+ "runReact18": false
19
+ },
20
+ "repository": "https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo",
21
+ "main": "dist/cjs/index.js",
22
+ "module": "dist/esm/index.js",
23
+ "module:es2019": "dist/es2019/index.js",
24
+ "types": "dist/types/index.d.ts",
25
+ "typesVersions": {
26
+ ">=4.5 <5.4": {
27
+ "*": [
28
+ "dist/types-ts4.5/*",
29
+ "dist/types-ts4.5/index.d.ts"
30
+ ]
31
+ }
32
+ },
33
+ "sideEffects": [
34
+ "*.compiled.css"
35
+ ],
36
+ "atlaskit:src": "src/index.ts",
37
+ "af:exports": {
38
+ ".": "./src/index.ts"
39
+ },
40
+ "dependencies": {
41
+ "@atlaskit/editor-common": "^82.9.0",
42
+ "@atlaskit/editor-palette": "1.6.0",
43
+ "@atlaskit/editor-plugin-analytics": "^1.2.0",
44
+ "@atlaskit/editor-plugin-background-color": "^1.1.0",
45
+ "@atlaskit/editor-plugin-primary-toolbar": "^1.1.0",
46
+ "@atlaskit/editor-plugin-text-formatting": "^1.7.0",
47
+ "@atlaskit/editor-prosemirror": "4.0.1",
48
+ "@atlaskit/editor-shared-styles": "^2.12.0",
49
+ "@atlaskit/editor-tables": "^2.7.4",
50
+ "@atlaskit/icon": "^22.4.0",
51
+ "@atlaskit/platform-feature-flags": "^0.2.0",
52
+ "@atlaskit/primitives": "^8.0.0",
53
+ "@babel/runtime": "^7.0.0",
54
+ "@emotion/react": "^11.7.1"
55
+ },
56
+ "peerDependencies": {
57
+ "react": "^16.8.0",
58
+ "react-intl-next": "npm:react-intl@^5.18.1"
59
+ },
60
+ "devDependencies": {
61
+ "@atlaskit/tokens": "^1.51.0",
62
+ "typescript": "~5.4.2"
63
+ },
64
+ "techstack": {
65
+ "@atlassian/frontend": {
66
+ "import-structure": [
67
+ "atlassian-conventions"
68
+ ],
69
+ "circular-dependencies": [
70
+ "file-and-folder-level"
71
+ ]
72
+ },
73
+ "@repo/internal": {
74
+ "dom-events": "use-bind-event-listener",
75
+ "analytics": [
76
+ "analytics-next"
77
+ ],
78
+ "design-tokens": [
79
+ "color"
80
+ ],
81
+ "theming": [
82
+ "react-context"
83
+ ],
84
+ "ui-components": [
85
+ "lite-mode"
86
+ ],
87
+ "deprecation": [
88
+ "no-deprecated-imports"
89
+ ],
90
+ "styling": [
91
+ "static",
92
+ "compiled"
93
+ ],
94
+ "imports": [
95
+ "import-no-extraneous-disable-for-examples-and-docs"
96
+ ]
97
+ }
98
+ },
99
+ "stricter": {
100
+ "no-unused-dependencies": {
101
+ "checkDevDependencies": true,
102
+ "exclude": [
103
+ "@atlaskit/tokens"
104
+ ]
105
+ }
106
+ },
107
+ "platform-feature-flags": {
108
+ "platform.editor.dynamic-palette-borders": {
109
+ "type": "boolean"
110
+ }
111
+ }
112
+ }