@atlaskit/editor-common 84.1.0 → 84.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.
Files changed (50) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/afm-cc/tsconfig.json +3 -0
  3. package/dist/cjs/link/ConfigureLinkOverlay/Dropdown.js +56 -0
  4. package/dist/cjs/link/ConfigureLinkOverlay/StyledButton.js +38 -0
  5. package/dist/cjs/link/ConfigureLinkOverlay/{OverlayButton.js → index.js} +29 -22
  6. package/dist/cjs/link/index.js +2 -2
  7. package/dist/cjs/monitoring/error.js +1 -1
  8. package/dist/cjs/resizer/Resizer.js +23 -45
  9. package/dist/cjs/ui/DropList/index.js +1 -1
  10. package/dist/cjs/ui-color/ColorPalette/Color/index.js +1 -2
  11. package/dist/cjs/ui-color/ColorPalette/Palettes/highlightColorPalette.js +6 -11
  12. package/dist/cjs/ui-color/ColorPalette/Palettes/textColorPalette.js +2 -11
  13. package/dist/cjs/ui-color/index.js +0 -12
  14. package/dist/es2019/link/ConfigureLinkOverlay/Dropdown.js +45 -0
  15. package/dist/es2019/link/ConfigureLinkOverlay/StyledButton.js +30 -0
  16. package/dist/es2019/link/ConfigureLinkOverlay/{OverlayButton.js → index.js} +28 -24
  17. package/dist/es2019/link/index.js +1 -1
  18. package/dist/es2019/monitoring/error.js +1 -1
  19. package/dist/es2019/resizer/Resizer.js +26 -54
  20. package/dist/es2019/ui/DropList/index.js +1 -1
  21. package/dist/es2019/ui-color/ColorPalette/Color/index.js +1 -2
  22. package/dist/es2019/ui-color/ColorPalette/Palettes/highlightColorPalette.js +2 -7
  23. package/dist/es2019/ui-color/ColorPalette/Palettes/textColorPalette.js +2 -7
  24. package/dist/es2019/ui-color/index.js +2 -2
  25. package/dist/esm/link/ConfigureLinkOverlay/Dropdown.js +46 -0
  26. package/dist/esm/link/ConfigureLinkOverlay/StyledButton.js +31 -0
  27. package/dist/esm/link/ConfigureLinkOverlay/{OverlayButton.js → index.js} +31 -24
  28. package/dist/esm/link/index.js +1 -1
  29. package/dist/esm/monitoring/error.js +1 -1
  30. package/dist/esm/resizer/Resizer.js +23 -45
  31. package/dist/esm/ui/DropList/index.js +1 -1
  32. package/dist/esm/ui-color/ColorPalette/Color/index.js +1 -2
  33. package/dist/esm/ui-color/ColorPalette/Palettes/highlightColorPalette.js +1 -10
  34. package/dist/esm/ui-color/ColorPalette/Palettes/textColorPalette.js +1 -10
  35. package/dist/esm/ui-color/index.js +2 -2
  36. package/dist/types/link/ConfigureLinkOverlay/Dropdown.d.ts +7 -0
  37. package/dist/types/link/ConfigureLinkOverlay/StyledButton.d.ts +7 -0
  38. package/dist/types/link/index.d.ts +2 -2
  39. package/dist/types/ui-color/ColorPalette/Palettes/highlightColorPalette.d.ts +0 -1
  40. package/dist/types/ui-color/ColorPalette/Palettes/textColorPalette.d.ts +1 -2
  41. package/dist/types/ui-color/index.d.ts +2 -2
  42. package/dist/types-ts4.5/link/ConfigureLinkOverlay/Dropdown.d.ts +7 -0
  43. package/dist/types-ts4.5/link/ConfigureLinkOverlay/StyledButton.d.ts +7 -0
  44. package/dist/types-ts4.5/link/index.d.ts +2 -2
  45. package/dist/types-ts4.5/ui-color/ColorPalette/Palettes/highlightColorPalette.d.ts +0 -1
  46. package/dist/types-ts4.5/ui-color/ColorPalette/Palettes/textColorPalette.d.ts +1 -2
  47. package/dist/types-ts4.5/ui-color/index.d.ts +2 -2
  48. package/package.json +4 -9
  49. /package/dist/types/link/ConfigureLinkOverlay/{OverlayButton.d.ts → index.d.ts} +0 -0
  50. /package/dist/types-ts4.5/link/ConfigureLinkOverlay/{OverlayButton.d.ts → index.d.ts} +0 -0
@@ -10,4 +10,4 @@ export { default as HyperlinkLinkAddToolbar, HyperlinkLinkAddToolbarWithIntl, RE
10
10
  export { sha1 } from './LinkPicker/HyperlinkAddToolbar/utils';
11
11
  export { isLinkAtPos, isTextAtPos, getLinkPreferencesURLFromENV } from './utils';
12
12
  export { stagingLinkPreferencesUrl, productionLinkPreferencesUrl } from './constants';
13
- export { OverlayButton } from './ConfigureLinkOverlay/OverlayButton';
13
+ export { OverlayButton } from './ConfigureLinkOverlay';
@@ -1,7 +1,7 @@
1
1
  import { isFedRamp } from './environment';
2
2
  const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
3
3
  const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
4
- const packageVersion = "84.1.0";
4
+ const packageVersion = "84.2.0";
5
5
  const sanitiseSentryEvents = (data, _hint) => {
6
6
  // Remove URL as it has UGC
7
7
  // TODO: Sanitise the URL instead of just removing it
@@ -2,7 +2,6 @@ import _extends from "@babel/runtime/helpers/extends";
2
2
  import React, { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState } from 'react';
3
3
  import classnames from 'classnames';
4
4
  import { Resizable } from 're-resizable';
5
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
6
5
  import Tooltip from '@atlaskit/tooltip';
7
6
  import { handleWrapperClass, resizerDangerClassName, resizerExtendedZone, resizerHandleClassName, resizerHandleThumbClassName, resizerHandleTrackClassName, resizerHandleZIndex, resizerHoverZoneClassName, resizerItemClassName } from '../styles/shared/resizer';
8
7
  const SUPPORTED_HANDLES = ['left', 'right'];
@@ -125,33 +124,15 @@ const ResizerNext = (props, ref) => {
125
124
  [position]: thumb
126
125
  };
127
126
  }
128
- if (getBooleanFF('platform.editor.resizer.prevent-contenteditable')) {
129
- const thumbWithTrack =
130
- /*#__PURE__*/
131
- //It's important to have {thumb} element before the div, the thumb element is the one that gets focus and only the 1st element recives aria-descibedby attribute which is important for screen reader users
132
- React.createElement(React.Fragment, null, thumb, /*#__PURE__*/React.createElement("div", {
133
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
134
- className: classnames(resizerHandleTrackClassName, handleHighlight),
135
- "data-testid": `resizer-handle-${position}-track`
136
- }));
137
- if (!!handleTooltipContent) {
138
- return {
139
- ...result,
140
- [position]:
141
- /*#__PURE__*/
142
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
143
- React.createElement("div", {
144
- contentEditable: false,
145
- style: inheritedCSS
146
- }, /*#__PURE__*/React.createElement(Tooltip, {
147
- content: handleTooltipContent,
148
- hideTooltipOnClick: true,
149
- position: "mouse",
150
- mousePosition: "auto-start",
151
- testId: `resizer-handle-${position}-tooltip`
152
- }, thumbWithTrack))
153
- };
154
- }
127
+ const thumbWithTrack =
128
+ /*#__PURE__*/
129
+ //It's important to have {thumb} element before the div, the thumb element is the one that gets focus and only the 1st element recives aria-descibedby attribute which is important for screen reader users
130
+ React.createElement(React.Fragment, null, thumb, /*#__PURE__*/React.createElement("div", {
131
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
132
+ className: classnames(resizerHandleTrackClassName, handleHighlight),
133
+ "data-testid": `resizer-handle-${position}-track`
134
+ }));
135
+ if (!!handleTooltipContent) {
155
136
  return {
156
137
  ...result,
157
138
  [position]:
@@ -160,34 +141,25 @@ const ResizerNext = (props, ref) => {
160
141
  React.createElement("div", {
161
142
  contentEditable: false,
162
143
  style: inheritedCSS
163
- }, thumbWithTrack)
164
- };
165
- } else {
166
- const thumbWithTrack =
167
- /*#__PURE__*/
168
- //It's important to have {thumb} element before the div, the thumb element is the one that gets focus and only the 1st element recives aria-descibedby attribute which is important for screen reader users
169
- React.createElement(React.Fragment, null, thumb, /*#__PURE__*/React.createElement("div", {
170
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
171
- className: classnames(resizerHandleTrackClassName, handleHighlight),
172
- "data-testid": `resizer-handle-${position}-track`
173
- }));
174
- if (!!handleTooltipContent) {
175
- return {
176
- ...result,
177
- [position]: /*#__PURE__*/React.createElement(Tooltip, {
178
- content: handleTooltipContent,
179
- hideTooltipOnClick: true,
180
- position: "mouse",
181
- mousePosition: "auto-start",
182
- testId: `resizer-handle-${position}-tooltip`
183
- }, thumbWithTrack)
184
- };
185
- }
186
- return {
187
- ...result,
188
- [position]: thumbWithTrack
144
+ }, /*#__PURE__*/React.createElement(Tooltip, {
145
+ content: handleTooltipContent,
146
+ hideTooltipOnClick: true,
147
+ position: "mouse",
148
+ mousePosition: "auto-start",
149
+ testId: `resizer-handle-${position}-tooltip`
150
+ }, thumbWithTrack))
189
151
  };
190
152
  }
153
+ return {
154
+ ...result,
155
+ [position]:
156
+ /*#__PURE__*/
157
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
158
+ React.createElement("div", {
159
+ contentEditable: false,
160
+ style: inheritedCSS
161
+ }, thumbWithTrack)
162
+ };
191
163
  }, {});
192
164
  }, [handleHighlight, handleTooltipContent]);
193
165
 
@@ -9,7 +9,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
9
9
  import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
10
10
  import Layer from '../Layer';
11
11
  const packageName = "@atlaskit/editor-common";
12
- const packageVersion = "84.1.0";
12
+ const packageVersion = "84.2.0";
13
13
  const halfFocusRing = 1;
14
14
  const dropOffset = '0, 8';
15
15
  class DropList extends Component {
@@ -4,7 +4,6 @@ import React from 'react';
4
4
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
5
5
  import { jsx } from '@emotion/react';
6
6
  import EditorDoneIcon from '@atlaskit/icon/glyph/editor/done';
7
- import { fg } from '@atlaskit/platform-feature-flags';
8
7
  import { N0 } from '@atlaskit/theme/colors';
9
8
  import Tooltip from '@atlaskit/tooltip';
10
9
  import { buttonStyle, buttonWrapperStyle } from './styles';
@@ -59,7 +58,7 @@ const Color = props => {
59
58
  ,
60
59
  className: `${isSelected ? 'selected' : ''}`,
61
60
  style: {
62
- backgroundColor: colorStyle || (fg('platform.editor.dynamic-palette-borders') ? "var(--ds-background-input, #FFFFFF)" : 'transparent'),
61
+ backgroundColor: colorStyle || "var(--ds-background-input, #FFFFFF)",
63
62
  border: `1px solid ${borderColor}`
64
63
  },
65
64
  autoFocus: autoFocus
@@ -5,7 +5,6 @@ import { jsx } from '@emotion/react';
5
5
  import { backgroundColorPalette } from '@atlaskit/adf-schema';
6
6
  import Icon from '@atlaskit/icon';
7
7
  import { useThemeObserver } from '@atlaskit/tokens';
8
- import { DEFAULT_BORDER_COLOR } from './common';
9
8
  import getColorMessage from './getColorMessage';
10
9
  import paletteMessages from './paletteMessages';
11
10
  import { mapPaletteColor } from './textColorPalette';
@@ -43,14 +42,10 @@ export const highlightColorPalette = [{
43
42
  value: REMOVE_HIGHLIGHT_COLOR,
44
43
  label: 'No color',
45
44
  // Mostly informative, only used for analytics
46
- border: DEFAULT_BORDER_COLOR,
45
+ border: "var(--ds-border, #091E4224)",
47
46
  message: getColorMessage(paletteMessages, 'no-color'),
48
47
  decorator: jsx(EditorDiagonalLineIcon, null)
49
48
  }];
50
49
  backgroundColorPalette.forEach((label, color) => {
51
50
  highlightColorPalette.push(mapPaletteColor(label, color));
52
- });
53
- export const highlightColorPaletteWithTokenBorders = highlightColorPalette.map(paletteColor => ({
54
- ...paletteColor,
55
- border: "var(--ds-border, #091E4224)"
56
- }));
51
+ });
@@ -1,5 +1,4 @@
1
1
  import { colorPalette } from '@atlaskit/adf-schema';
2
- import { DEFAULT_BORDER_COLOR } from './common';
3
2
  import getColorMessage from './getColorMessage';
4
3
  import paletteMessages from './paletteMessages';
5
4
  export const mapPaletteColor = (label, color) => {
@@ -8,7 +7,7 @@ export const mapPaletteColor = (label, color) => {
8
7
  return {
9
8
  value: color,
10
9
  label,
11
- border: DEFAULT_BORDER_COLOR,
10
+ border: "var(--ds-border, #091E4224)",
12
11
  message
13
12
  };
14
13
  };
@@ -18,8 +17,4 @@ export const textColorPalette = [];
18
17
  export const textColorPaletteTokenBorders = [];
19
18
  colorPalette.forEach((label, color) => {
20
19
  textColorPalette.push(mapPaletteColor(label, color));
21
- });
22
- export const textColorPaletteWithTokenBorders = textColorPalette.map(paletteColor => ({
23
- ...paletteColor,
24
- border: "var(--ds-border, #091E4224)"
25
- }));
20
+ });
@@ -5,8 +5,8 @@ export { default as cellBackgroundColorPalette } from './ColorPalette/Palettes/c
5
5
  export { default as colorPaletteMessages } from './ColorPalette/Palettes/paletteMessages';
6
6
  export { panelBackgroundPalette, panelDarkModeBackgroundPalette } from './ColorPalette/Palettes/panelBackgroundPalette';
7
7
  export { lightModeStatusColorPalette, darkModeStatusColorPalette } from './ColorPalette/Palettes/statusColorPalette';
8
- export { textColorPalette, textColorPaletteWithTokenBorders } from './ColorPalette/Palettes/textColorPalette';
9
- export { highlightColorPalette, highlightColorPaletteWithTokenBorders, REMOVE_HIGHLIGHT_COLOR } from './ColorPalette/Palettes/highlightColorPalette';
8
+ export { textColorPalette } from './ColorPalette/Palettes/textColorPalette';
9
+ export { highlightColorPalette, REMOVE_HIGHLIGHT_COLOR } from './ColorPalette/Palettes/highlightColorPalette';
10
10
  export { backgroundPaletteTooltipMessages, borderPaletteTooltipMessages, chartsColorPaletteTooltipMessages, textPaletteTooltipMessages } from './ColorPalette/Palettes';
11
11
  export { DEFAULT_BORDER_COLOR } from './ColorPalette/Palettes/common';
12
12
  export { default as borderColorPalette } from './ColorPalette/Palettes/borderColorPalette';
@@ -0,0 +1,46 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
+ var _excluded = ["triggerRef"];
4
+ /** @jsx jsx */
5
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
6
+ import { jsx } from '@emotion/react';
7
+ import { useIntl } from 'react-intl-next';
8
+ import DropdownMenu, { DropdownItem, DropdownItemGroup } from '@atlaskit/dropdown-menu';
9
+ import ChevronDownIcon from '@atlaskit/icon/glyph/chevron-down';
10
+ import PreferencesIcon from '@atlaskit/icon/glyph/preferences';
11
+ import ShortcutIcon from '@atlaskit/icon/glyph/shortcut';
12
+ import { cardMessages as messages } from '../../messages';
13
+ import { StyledButton } from './StyledButton';
14
+ var Dropdown = function Dropdown(_ref) {
15
+ var testId = _ref.testId;
16
+ var _useIntl = useIntl(),
17
+ formatMessage = _useIntl.formatMessage;
18
+ var configureLinkLabel = formatMessage(messages.inlineConfigureLink);
19
+ var goToLinkLabel = formatMessage(messages.inlineGoToLink);
20
+ return jsx(DropdownMenu, {
21
+ trigger: function trigger(_ref2) {
22
+ var triggerRef = _ref2.triggerRef,
23
+ props = _objectWithoutProperties(_ref2, _excluded);
24
+ return jsx(StyledButton, _extends({
25
+ innerRef: triggerRef
26
+ }, props, {
27
+ iconBefore: jsx(ChevronDownIcon, {
28
+ label: configureLinkLabel,
29
+ size: 'small'
30
+ })
31
+ }));
32
+ },
33
+ testId: "".concat(testId, "-dropdown")
34
+ }, jsx(DropdownItemGroup, null, jsx(DropdownItem, {
35
+ elemBefore: jsx(ShortcutIcon, {
36
+ label: goToLinkLabel,
37
+ size: 'medium'
38
+ })
39
+ }, goToLinkLabel), jsx(DropdownItem, {
40
+ elemBefore: jsx(PreferencesIcon, {
41
+ label: configureLinkLabel,
42
+ size: 'medium'
43
+ })
44
+ }, configureLinkLabel)));
45
+ };
46
+ export default Dropdown;
@@ -0,0 +1,31 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
+ var _excluded = ["innerRef"];
4
+ /** @jsx jsx */
5
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
6
+ import { css, jsx } from '@emotion/react';
7
+ import Button from '@atlaskit/button';
8
+ import { N30A, N40A, N60A, N700 } from '@atlaskit/theme/colors';
9
+ var buttonStyles = css({
10
+ display: 'flex',
11
+ background: "var(--ds-background-neutral, ".concat(N30A, ")"),
12
+ color: "var(--ds-icon, ".concat(N700, ")"),
13
+ '&:hover': {
14
+ background: "var(--ds-background-neutral-hovered, ".concat(N40A, ")")
15
+ },
16
+ '&:active': {
17
+ background: "var(--ds-background-neutral-pressed, ".concat(N60A, ")")
18
+ },
19
+ width: '1.375rem',
20
+ height: '1.25rem'
21
+ });
22
+ export var StyledButton = function StyledButton(_ref) {
23
+ var innerRef = _ref.innerRef,
24
+ props = _objectWithoutProperties(_ref, _excluded);
25
+ return jsx(Button, _extends({}, props, {
26
+ ref: innerRef
27
+ // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides
28
+ ,
29
+ css: buttonStyles
30
+ }));
31
+ };
@@ -1,29 +1,18 @@
1
+ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
1
2
  /** @jsx jsx */
2
- import { useCallback } from 'react';
3
+ import { useCallback, useLayoutEffect, useState } from 'react';
3
4
 
4
5
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
5
6
  import { css, jsx } from '@emotion/react';
6
7
  import { useIntl } from 'react-intl-next';
7
- import Button from '@atlaskit/button';
8
8
  import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
9
9
  import PreferencesIcon from '@atlaskit/icon/glyph/preferences';
10
- import { N0, N30A, N40A, N60A, N700 } from '@atlaskit/theme/colors';
10
+ import { N0 } from '@atlaskit/theme/colors';
11
11
  import { layers } from '@atlaskit/theme/constants';
12
12
  import Tooltip from '@atlaskit/tooltip';
13
13
  import { cardMessages } from '../../messages';
14
- var buttonStyles = css({
15
- display: 'flex',
16
- background: "var(--ds-background-neutral, ".concat(N30A, ")"),
17
- color: "var(--ds-icon, ".concat(N700, ")"),
18
- '&:hover': {
19
- background: "var(--ds-background-neutral-hovered, ".concat(N40A, ")")
20
- },
21
- '&:active': {
22
- background: "var(--ds-background-neutral-pressed, ".concat(N60A, ")")
23
- },
24
- width: '1.375rem',
25
- height: '1.25rem'
26
- });
14
+ import Dropdown from './Dropdown';
15
+ import { StyledButton } from './StyledButton';
27
16
  var buttonWrapperStyles = css({
28
17
  position: 'absolute',
29
18
  zIndex: layers.card(),
@@ -33,6 +22,7 @@ var buttonWrapperStyles = css({
33
22
  background: "var(--ds-surface-raised, ".concat(N0, ")"),
34
23
  borderRadius: "var(--ds-border-radius, 3px)"
35
24
  });
25
+ var showDropdownThresholdPx = 50;
36
26
  export var OverlayButton = function OverlayButton(_ref) {
37
27
  var _docNode$nodeSize;
38
28
  var editorView = _ref.editorView,
@@ -42,6 +32,25 @@ export var OverlayButton = function OverlayButton(_ref) {
42
32
  targetElementPos = _ref$targetElementPos === void 0 ? 0 : _ref$targetElementPos;
43
33
  var _useIntl = useIntl(),
44
34
  formatMessage = _useIntl.formatMessage;
35
+ var configureLinkLabel = formatMessage(cardMessages.inlineConfigureLink);
36
+ var _useState = useState(false),
37
+ _useState2 = _slicedToArray(_useState, 2),
38
+ showDropdown = _useState2[0],
39
+ setShowDropdown = _useState2[1];
40
+ useLayoutEffect(function () {
41
+ var _domNode;
42
+ var domNode = editorView.nodeDOM(targetElementPos);
43
+ if (((_domNode = domNode) === null || _domNode === void 0 ? void 0 : _domNode.nodeType) === Node.TEXT_NODE) {
44
+ domNode = domNode.parentElement;
45
+ }
46
+ if (domNode instanceof HTMLElement) {
47
+ var _domNode$getBoundingC = domNode.getBoundingClientRect(),
48
+ width = _domNode$getBoundingC.width;
49
+ if (width < showDropdownThresholdPx) {
50
+ setShowDropdown(true);
51
+ }
52
+ }
53
+ }, [editorView, targetElementPos]);
45
54
  var docNode = editorView.state.doc.nodeAt(targetElementPos);
46
55
  var nodeEnd = targetElementPos + ((_docNode$nodeSize = docNode === null || docNode === void 0 ? void 0 : docNode.nodeSize) !== null && _docNode$nodeSize !== void 0 ? _docNode$nodeSize : 0);
47
56
  var isText = docNode === null || docNode === void 0 ? void 0 : docNode.isText;
@@ -61,18 +70,16 @@ export var OverlayButton = function OverlayButton(_ref) {
61
70
  if (!targetElementPos || isSelected) {
62
71
  return null;
63
72
  }
64
- var configureLinkLabel = formatMessage(cardMessages.inlineConfigureLink);
65
73
  return jsx("span", {
66
- css: buttonWrapperStyles
67
- }, jsx(Tooltip, {
74
+ css: buttonWrapperStyles,
75
+ "data-testid": testId
76
+ }, showDropdown ? jsx(Dropdown, {
77
+ testId: testId
78
+ }) : jsx(Tooltip, {
68
79
  content: configureLinkLabel,
69
80
  hideTooltipOnClick: true,
70
81
  testId: "".concat(testId, "-tooltip")
71
- }, jsx(Button, {
72
- testId: testId
73
- // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides
74
- ,
75
- css: buttonStyles,
82
+ }, jsx(StyledButton, {
76
83
  onClick: handleClick,
77
84
  iconBefore: jsx(PreferencesIcon, {
78
85
  label: configureLinkLabel,
@@ -10,4 +10,4 @@ export { default as HyperlinkLinkAddToolbar, HyperlinkLinkAddToolbarWithIntl, RE
10
10
  export { sha1 } from './LinkPicker/HyperlinkAddToolbar/utils';
11
11
  export { isLinkAtPos, isTextAtPos, getLinkPreferencesURLFromENV } from './utils';
12
12
  export { stagingLinkPreferencesUrl, productionLinkPreferencesUrl } from './constants';
13
- export { OverlayButton } from './ConfigureLinkOverlay/OverlayButton';
13
+ export { OverlayButton } from './ConfigureLinkOverlay';
@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
7
7
  import { isFedRamp } from './environment';
8
8
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
9
9
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
10
- var packageVersion = "84.1.0";
10
+ var packageVersion = "84.2.0";
11
11
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
12
12
  // Remove URL as it has UGC
13
13
  // TODO: Sanitise the URL instead of just removing it
@@ -8,7 +8,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
8
8
  import React, { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState } from 'react';
9
9
  import classnames from 'classnames';
10
10
  import { Resizable } from 're-resizable';
11
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
12
11
  import Tooltip from '@atlaskit/tooltip';
13
12
  import { handleWrapperClass, resizerDangerClassName, resizerExtendedZone, resizerHandleClassName, resizerHandleThumbClassName, resizerHandleTrackClassName, resizerHandleZIndex, resizerHoverZoneClassName, resizerItemClassName } from '../styles/shared/resizer';
14
13
  var SUPPORTED_HANDLES = ['left', 'right'];
@@ -128,57 +127,36 @@ var ResizerNext = function ResizerNext(props, ref) {
128
127
  if ((!handleHighlight || handleHighlight === 'none') && !handleTooltipContent) {
129
128
  return _objectSpread(_objectSpread({}, result), {}, _defineProperty({}, position, thumb));
130
129
  }
131
- if (getBooleanFF('platform.editor.resizer.prevent-contenteditable')) {
132
- var thumbWithTrack =
133
- /*#__PURE__*/
134
- //It's important to have {thumb} element before the div, the thumb element is the one that gets focus and only the 1st element recives aria-descibedby attribute which is important for screen reader users
135
- React.createElement(React.Fragment, null, thumb, /*#__PURE__*/React.createElement("div", {
136
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
137
- className: classnames(resizerHandleTrackClassName, handleHighlight),
138
- "data-testid": "resizer-handle-".concat(position, "-track")
139
- }));
140
- if (!!handleTooltipContent) {
141
- return _objectSpread(_objectSpread({}, result), {}, _defineProperty({}, position,
142
- /*#__PURE__*/
143
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
144
- React.createElement("div", {
145
- contentEditable: false,
146
- style: inheritedCSS
147
- }, /*#__PURE__*/React.createElement(Tooltip, {
148
- content: handleTooltipContent,
149
- hideTooltipOnClick: true,
150
- position: "mouse",
151
- mousePosition: "auto-start",
152
- testId: "resizer-handle-".concat(position, "-tooltip")
153
- }, thumbWithTrack))));
154
- }
130
+ var thumbWithTrack =
131
+ /*#__PURE__*/
132
+ //It's important to have {thumb} element before the div, the thumb element is the one that gets focus and only the 1st element recives aria-descibedby attribute which is important for screen reader users
133
+ React.createElement(React.Fragment, null, thumb, /*#__PURE__*/React.createElement("div", {
134
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
135
+ className: classnames(resizerHandleTrackClassName, handleHighlight),
136
+ "data-testid": "resizer-handle-".concat(position, "-track")
137
+ }));
138
+ if (!!handleTooltipContent) {
155
139
  return _objectSpread(_objectSpread({}, result), {}, _defineProperty({}, position,
156
140
  /*#__PURE__*/
157
141
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
158
142
  React.createElement("div", {
159
143
  contentEditable: false,
160
144
  style: inheritedCSS
161
- }, thumbWithTrack)));
162
- } else {
163
- var _thumbWithTrack =
164
- /*#__PURE__*/
165
- //It's important to have {thumb} element before the div, the thumb element is the one that gets focus and only the 1st element recives aria-descibedby attribute which is important for screen reader users
166
- React.createElement(React.Fragment, null, thumb, /*#__PURE__*/React.createElement("div", {
167
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
168
- className: classnames(resizerHandleTrackClassName, handleHighlight),
169
- "data-testid": "resizer-handle-".concat(position, "-track")
170
- }));
171
- if (!!handleTooltipContent) {
172
- return _objectSpread(_objectSpread({}, result), {}, _defineProperty({}, position, /*#__PURE__*/React.createElement(Tooltip, {
173
- content: handleTooltipContent,
174
- hideTooltipOnClick: true,
175
- position: "mouse",
176
- mousePosition: "auto-start",
177
- testId: "resizer-handle-".concat(position, "-tooltip")
178
- }, _thumbWithTrack)));
179
- }
180
- return _objectSpread(_objectSpread({}, result), {}, _defineProperty({}, position, _thumbWithTrack));
145
+ }, /*#__PURE__*/React.createElement(Tooltip, {
146
+ content: handleTooltipContent,
147
+ hideTooltipOnClick: true,
148
+ position: "mouse",
149
+ mousePosition: "auto-start",
150
+ testId: "resizer-handle-".concat(position, "-tooltip")
151
+ }, thumbWithTrack))));
181
152
  }
153
+ return _objectSpread(_objectSpread({}, result), {}, _defineProperty({}, position,
154
+ /*#__PURE__*/
155
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
156
+ React.createElement("div", {
157
+ contentEditable: false,
158
+ style: inheritedCSS
159
+ }, thumbWithTrack)));
182
160
  }, {});
183
161
  }, [handleHighlight, handleTooltipContent]);
184
162
 
@@ -17,7 +17,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
17
17
  import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
18
18
  import Layer from '../Layer';
19
19
  var packageName = "@atlaskit/editor-common";
20
- var packageVersion = "84.1.0";
20
+ var packageVersion = "84.2.0";
21
21
  var halfFocusRing = 1;
22
22
  var dropOffset = '0, 8';
23
23
  var DropList = /*#__PURE__*/function (_Component) {
@@ -4,7 +4,6 @@ import React from 'react';
4
4
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
5
5
  import { jsx } from '@emotion/react';
6
6
  import EditorDoneIcon from '@atlaskit/icon/glyph/editor/done';
7
- import { fg } from '@atlaskit/platform-feature-flags';
8
7
  import { N0 } from '@atlaskit/theme/colors';
9
8
  import Tooltip from '@atlaskit/tooltip';
10
9
  import { buttonStyle, buttonWrapperStyle } from './styles';
@@ -49,7 +48,7 @@ var Color = function Color(props) {
49
48
  ,
50
49
  className: "".concat(isSelected ? 'selected' : ''),
51
50
  style: {
52
- backgroundColor: colorStyle || (fg('platform.editor.dynamic-palette-borders') ? "var(--ds-background-input, #FFFFFF)" : 'transparent'),
51
+ backgroundColor: colorStyle || "var(--ds-background-input, #FFFFFF)",
53
52
  border: "1px solid ".concat(borderColor)
54
53
  },
55
54
  autoFocus: autoFocus
@@ -1,6 +1,3 @@
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; }
4
1
  /** @jsx jsx */
5
2
 
6
3
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -8,7 +5,6 @@ import { jsx } from '@emotion/react';
8
5
  import { backgroundColorPalette } from '@atlaskit/adf-schema';
9
6
  import Icon from '@atlaskit/icon';
10
7
  import { useThemeObserver } from '@atlaskit/tokens';
11
- import { DEFAULT_BORDER_COLOR } from './common';
12
8
  import getColorMessage from './getColorMessage';
13
9
  import paletteMessages from './paletteMessages';
14
10
  import { mapPaletteColor } from './textColorPalette';
@@ -47,15 +43,10 @@ export var highlightColorPalette = [{
47
43
  value: REMOVE_HIGHLIGHT_COLOR,
48
44
  label: 'No color',
49
45
  // Mostly informative, only used for analytics
50
- border: DEFAULT_BORDER_COLOR,
46
+ border: "var(--ds-border, #091E4224)",
51
47
  message: getColorMessage(paletteMessages, 'no-color'),
52
48
  decorator: jsx(EditorDiagonalLineIcon, null)
53
49
  }];
54
50
  backgroundColorPalette.forEach(function (label, color) {
55
51
  highlightColorPalette.push(mapPaletteColor(label, color));
56
- });
57
- export var highlightColorPaletteWithTokenBorders = highlightColorPalette.map(function (paletteColor) {
58
- return _objectSpread(_objectSpread({}, paletteColor), {}, {
59
- border: "var(--ds-border, #091E4224)"
60
- });
61
52
  });
@@ -1,8 +1,4 @@
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; }
4
1
  import { colorPalette } from '@atlaskit/adf-schema';
5
- import { DEFAULT_BORDER_COLOR } from './common';
6
2
  import getColorMessage from './getColorMessage';
7
3
  import paletteMessages from './paletteMessages';
8
4
  export var mapPaletteColor = function mapPaletteColor(label, color) {
@@ -11,7 +7,7 @@ export var mapPaletteColor = function mapPaletteColor(label, color) {
11
7
  return {
12
8
  value: color,
13
9
  label: label,
14
- border: DEFAULT_BORDER_COLOR,
10
+ border: "var(--ds-border, #091E4224)",
15
11
  message: message
16
12
  };
17
13
  };
@@ -21,9 +17,4 @@ export var textColorPalette = [];
21
17
  export var textColorPaletteTokenBorders = [];
22
18
  colorPalette.forEach(function (label, color) {
23
19
  textColorPalette.push(mapPaletteColor(label, color));
24
- });
25
- export var textColorPaletteWithTokenBorders = textColorPalette.map(function (paletteColor) {
26
- return _objectSpread(_objectSpread({}, paletteColor), {}, {
27
- border: "var(--ds-border, #091E4224)"
28
- });
29
20
  });
@@ -5,8 +5,8 @@ export { default as cellBackgroundColorPalette } from './ColorPalette/Palettes/c
5
5
  export { default as colorPaletteMessages } from './ColorPalette/Palettes/paletteMessages';
6
6
  export { panelBackgroundPalette, panelDarkModeBackgroundPalette } from './ColorPalette/Palettes/panelBackgroundPalette';
7
7
  export { lightModeStatusColorPalette, darkModeStatusColorPalette } from './ColorPalette/Palettes/statusColorPalette';
8
- export { textColorPalette, textColorPaletteWithTokenBorders } from './ColorPalette/Palettes/textColorPalette';
9
- export { highlightColorPalette, highlightColorPaletteWithTokenBorders, REMOVE_HIGHLIGHT_COLOR } from './ColorPalette/Palettes/highlightColorPalette';
8
+ export { textColorPalette } from './ColorPalette/Palettes/textColorPalette';
9
+ export { highlightColorPalette, REMOVE_HIGHLIGHT_COLOR } from './ColorPalette/Palettes/highlightColorPalette';
10
10
  export { backgroundPaletteTooltipMessages, borderPaletteTooltipMessages, chartsColorPaletteTooltipMessages, textPaletteTooltipMessages } from './ColorPalette/Palettes';
11
11
  export { DEFAULT_BORDER_COLOR } from './ColorPalette/Palettes/common';
12
12
  export { default as borderColorPalette } from './ColorPalette/Palettes/borderColorPalette';
@@ -0,0 +1,7 @@
1
+ /** @jsx jsx */
2
+ import { jsx } from '@emotion/react';
3
+ export type DropdownProps = {
4
+ testId: string;
5
+ };
6
+ declare const Dropdown: ({ testId }: DropdownProps) => jsx.JSX.Element;
7
+ export default Dropdown;
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ /** @jsx jsx */
3
+ import { jsx } from '@emotion/react';
4
+ import { type ButtonProps } from '@atlaskit/button';
5
+ export declare const StyledButton: ({ innerRef, ...props }: ButtonProps & {
6
+ innerRef?: import("react").Ref<HTMLElement> | undefined;
7
+ }) => jsx.JSX.Element;
@@ -15,5 +15,5 @@ export type { HyperlinkAddToolbarProps } from './LinkPicker/HyperlinkAddToolbar'
15
15
  export { sha1 } from './LinkPicker/HyperlinkAddToolbar/utils';
16
16
  export { isLinkAtPos, isTextAtPos, getLinkPreferencesURLFromENV } from './utils';
17
17
  export { stagingLinkPreferencesUrl, productionLinkPreferencesUrl } from './constants';
18
- export { OverlayButton } from './ConfigureLinkOverlay/OverlayButton';
19
- export type { OverlayButtonProps } from './ConfigureLinkOverlay/OverlayButton';
18
+ export { OverlayButton } from './ConfigureLinkOverlay';
19
+ export type { OverlayButtonProps } from './ConfigureLinkOverlay';
@@ -4,4 +4,3 @@ import type { PaletteColor } from './type';
4
4
  export declare const REMOVE_HIGHLIGHT_COLOR = "#00000000";
5
5
  export declare const EditorDiagonalLineIcon: () => jsx.JSX.Element;
6
6
  export declare const highlightColorPalette: Array<PaletteColor>;
7
- export declare const highlightColorPaletteWithTokenBorders: Array<PaletteColor>;