@atlaskit/editor-common 84.1.0 → 84.3.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 (100) hide show
  1. package/CHANGELOG.md +32 -0
  2. package/afm-cc/tsconfig.json +3 -0
  3. package/afm-jira/tsconfig.json +3 -0
  4. package/dist/cjs/extensibility/ExtensionNodeWrapper.js +2 -2
  5. package/dist/cjs/link/ConfigureLinkOverlay/Dropdown.js +56 -0
  6. package/dist/cjs/link/ConfigureLinkOverlay/StyledButton.js +38 -0
  7. package/dist/cjs/link/ConfigureLinkOverlay/{OverlayButton.js → index.js} +29 -22
  8. package/dist/cjs/link/index.js +2 -2
  9. package/dist/cjs/mark/commands.js +2 -7
  10. package/dist/cjs/messages/annotation.js +1 -1
  11. package/dist/cjs/monitoring/error.js +1 -1
  12. package/dist/cjs/react-node-view/getInlineNodeViewProducer.js +3 -2
  13. package/dist/cjs/resizer/Resizer.js +23 -45
  14. package/dist/cjs/styles/shared/annotation.js +2 -34
  15. package/dist/cjs/styles/shared/smartCard.js +1 -1
  16. package/dist/cjs/ui/DropList/index.js +1 -1
  17. package/dist/cjs/ui-color/ColorPalette/Color/index.js +1 -2
  18. package/dist/cjs/ui-color/ColorPalette/Palettes/highlightColorPalette.js +6 -11
  19. package/dist/cjs/ui-color/ColorPalette/Palettes/textColorPalette.js +2 -11
  20. package/dist/cjs/ui-color/index.js +0 -12
  21. package/dist/cjs/utils/annotation/index.js +10 -18
  22. package/dist/cjs/utils/index.js +5 -1
  23. package/dist/cjs/utils/scroll-gutter.js +3 -0
  24. package/dist/cjs/utils/validator.js +5 -5
  25. package/dist/cjs/whitespace/index.js +18 -0
  26. package/dist/es2019/extensibility/ExtensionNodeWrapper.js +1 -1
  27. package/dist/es2019/link/ConfigureLinkOverlay/Dropdown.js +45 -0
  28. package/dist/es2019/link/ConfigureLinkOverlay/StyledButton.js +30 -0
  29. package/dist/es2019/link/ConfigureLinkOverlay/{OverlayButton.js → index.js} +28 -24
  30. package/dist/es2019/link/index.js +1 -1
  31. package/dist/es2019/mark/commands.js +3 -10
  32. package/dist/es2019/messages/annotation.js +1 -1
  33. package/dist/es2019/monitoring/error.js +1 -1
  34. package/dist/es2019/react-node-view/getInlineNodeViewProducer.js +2 -1
  35. package/dist/es2019/resizer/Resizer.js +26 -54
  36. package/dist/es2019/styles/shared/annotation.js +3 -35
  37. package/dist/es2019/styles/shared/smartCard.js +2 -2
  38. package/dist/es2019/ui/DropList/index.js +1 -1
  39. package/dist/es2019/ui-color/ColorPalette/Color/index.js +1 -2
  40. package/dist/es2019/ui-color/ColorPalette/Palettes/highlightColorPalette.js +2 -7
  41. package/dist/es2019/ui-color/ColorPalette/Palettes/textColorPalette.js +2 -7
  42. package/dist/es2019/ui-color/index.js +2 -2
  43. package/dist/es2019/utils/annotation/index.js +11 -21
  44. package/dist/es2019/utils/index.js +4 -1
  45. package/dist/es2019/utils/scroll-gutter.js +3 -0
  46. package/dist/es2019/utils/validator.js +6 -6
  47. package/dist/es2019/whitespace/index.js +1 -0
  48. package/dist/esm/extensibility/ExtensionNodeWrapper.js +1 -1
  49. package/dist/esm/link/ConfigureLinkOverlay/Dropdown.js +46 -0
  50. package/dist/esm/link/ConfigureLinkOverlay/StyledButton.js +31 -0
  51. package/dist/esm/link/ConfigureLinkOverlay/{OverlayButton.js → index.js} +31 -24
  52. package/dist/esm/link/index.js +1 -1
  53. package/dist/esm/mark/commands.js +3 -8
  54. package/dist/esm/messages/annotation.js +1 -1
  55. package/dist/esm/monitoring/error.js +1 -1
  56. package/dist/esm/react-node-view/getInlineNodeViewProducer.js +2 -1
  57. package/dist/esm/resizer/Resizer.js +23 -45
  58. package/dist/esm/styles/shared/annotation.js +3 -35
  59. package/dist/esm/styles/shared/smartCard.js +2 -2
  60. package/dist/esm/ui/DropList/index.js +1 -1
  61. package/dist/esm/ui-color/ColorPalette/Color/index.js +1 -2
  62. package/dist/esm/ui-color/ColorPalette/Palettes/highlightColorPalette.js +1 -10
  63. package/dist/esm/ui-color/ColorPalette/Palettes/textColorPalette.js +1 -10
  64. package/dist/esm/ui-color/index.js +2 -2
  65. package/dist/esm/utils/annotation/index.js +11 -19
  66. package/dist/esm/utils/index.js +4 -1
  67. package/dist/esm/utils/scroll-gutter.js +3 -0
  68. package/dist/esm/utils/validator.js +6 -6
  69. package/dist/esm/whitespace/index.js +1 -0
  70. package/dist/types/link/ConfigureLinkOverlay/Dropdown.d.ts +7 -0
  71. package/dist/types/link/ConfigureLinkOverlay/StyledButton.d.ts +7 -0
  72. package/dist/types/link/index.d.ts +2 -2
  73. package/dist/types/types/annotation/index.d.ts +2 -2
  74. package/dist/types/ui-color/ColorPalette/Palettes/highlightColorPalette.d.ts +0 -1
  75. package/dist/types/ui-color/ColorPalette/Palettes/textColorPalette.d.ts +1 -2
  76. package/dist/types/ui-color/index.d.ts +2 -2
  77. package/dist/types/utils/annotation/index.d.ts +2 -2
  78. package/dist/types/utils/index.d.ts +4 -1
  79. package/dist/types/utils/scroll-gutter.d.ts +3 -0
  80. package/dist/types/whitespace/index.d.ts +1 -0
  81. package/dist/types-ts4.5/link/ConfigureLinkOverlay/Dropdown.d.ts +7 -0
  82. package/dist/types-ts4.5/link/ConfigureLinkOverlay/StyledButton.d.ts +7 -0
  83. package/dist/types-ts4.5/link/index.d.ts +2 -2
  84. package/dist/types-ts4.5/types/annotation/index.d.ts +2 -2
  85. package/dist/types-ts4.5/ui-color/ColorPalette/Palettes/highlightColorPalette.d.ts +0 -1
  86. package/dist/types-ts4.5/ui-color/ColorPalette/Palettes/textColorPalette.d.ts +1 -2
  87. package/dist/types-ts4.5/ui-color/index.d.ts +2 -2
  88. package/dist/types-ts4.5/utils/annotation/index.d.ts +2 -2
  89. package/dist/types-ts4.5/utils/index.d.ts +4 -1
  90. package/dist/types-ts4.5/utils/scroll-gutter.d.ts +3 -0
  91. package/dist/types-ts4.5/whitespace/index.d.ts +1 -0
  92. package/package.json +6 -13
  93. package/whitespace/package.json +15 -0
  94. /package/dist/cjs/{utils → whitespace}/whitespace.js +0 -0
  95. /package/dist/es2019/{utils → whitespace}/whitespace.js +0 -0
  96. /package/dist/esm/{utils → whitespace}/whitespace.js +0 -0
  97. /package/dist/types/link/ConfigureLinkOverlay/{OverlayButton.d.ts → index.d.ts} +0 -0
  98. /package/dist/types/{utils → whitespace}/whitespace.d.ts +0 -0
  99. /package/dist/types-ts4.5/link/ConfigureLinkOverlay/{OverlayButton.d.ts → index.d.ts} +0 -0
  100. /package/dist/types-ts4.5/{utils → whitespace}/whitespace.d.ts +0 -0
@@ -1,7 +1,7 @@
1
1
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
2
2
  import { css } from '@emotion/react';
3
3
  import { akEditorDeleteBackground, akEditorDeleteBorder, akEditorSelectedNodeClassName, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
4
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
4
+ import { fg } from '@atlaskit/platform-feature-flags';
5
5
  import { N0, N40 } from '@atlaskit/theme/colors';
6
6
  import { N60A, Y300, Y75 } from '@atlaskit/theme/colors';
7
7
  import { SmartCardSharedCssClassName } from './smart-card';
@@ -14,7 +14,7 @@ export const smartCardStyles = css`
14
14
  max-width: calc(100% - 20px);
15
15
  vertical-align: top;
16
16
  word-break: break-all;
17
- ${getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes') ? `.card-with-comment {
17
+ ${fg('editor_inline_comments_on_inline_nodes') ? `.card-with-comment {
18
18
  background: ${`var(--ds-background-accent-yellow-subtler, ${Y75})`};
19
19
  border-bottom: 2px solid ${`var(--ds-border-accent-yellow, ${Y300})`};
20
20
  box-shadow: ${`var(--ds-shadow-overlay, ${`1px 2px 3px ${N60A}, -1px 2px 3px ${N60A}`})`};
@@ -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.3.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';
@@ -1,5 +1,5 @@
1
1
  import { AnnotationTypes } from '@atlaskit/adf-schema';
2
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
2
+ import { fg } from '@atlaskit/platform-feature-flags';
3
3
  export const canApplyAnnotationOnRange = (rangeSelection, doc, schema) => {
4
4
  const {
5
5
  from,
@@ -8,31 +8,21 @@ export const canApplyAnnotationOnRange = (rangeSelection, doc, schema) => {
8
8
  if (isNaN(from + to) || to - from <= 0 || to < 0 || from < 0) {
9
9
  return false;
10
10
  }
11
- const {
12
- inlineCard
13
- } = schema.nodes;
14
11
  let foundInvalid = false;
15
12
  doc.nodesBetween(rangeSelection.from, rangeSelection.to, (node, _pos, parent) => {
16
13
  // Special exception for hardBreak nodes
17
14
  if (schema.nodes.hardBreak === node.type) {
18
15
  return false;
19
16
  }
17
+
20
18
  // For block elements or text nodes, we want to check
21
19
  // if annotations are allowed inside this tree
22
20
  // or if we're leaf and not text
23
-
24
- if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes')) {
25
- if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
26
- const isAllowedInlineNode = ['emoji', 'status', 'date', 'mention', 'inlineCard'].includes(node.type.name);
27
- if (node.isInline && !node.isText && !isAllowedInlineNode || node.isLeaf && !node.isText && !isAllowedInlineNode || node.isText && !(parent !== null && parent !== void 0 && parent.type.allowsMarkType(schema.marks.annotation))) {
28
- foundInvalid = true;
29
- return false;
30
- }
31
- } else {
32
- if (node.isInline && !node.isText && node.type !== inlineCard || node.isLeaf && !node.isText && node.type !== inlineCard || node.isText && !(parent !== null && parent !== void 0 && parent.type.allowsMarkType(schema.marks.annotation))) {
33
- foundInvalid = true;
34
- return false;
35
- }
21
+ if (fg('editor_inline_comments_on_inline_nodes')) {
22
+ const isAllowedInlineNode = ['emoji', 'status', 'date', 'mention', 'inlineCard'].includes(node.type.name);
23
+ if (node.isInline && !node.isText && !isAllowedInlineNode || node.isLeaf && !node.isText && !isAllowedInlineNode || node.isText && !(parent !== null && parent !== void 0 && parent.type.allowsMarkType(schema.marks.annotation))) {
24
+ foundInvalid = true;
25
+ return false;
36
26
  }
37
27
  } else {
38
28
  if (node.isInline && !node.isText || node.isLeaf && !node.isText || node.isText && !(parent !== null && parent !== void 0 && parent.type.allowsMarkType(schema.marks.annotation))) {
@@ -111,7 +101,7 @@ export function getRangeInlineNodeNames({
111
101
  doc,
112
102
  pos
113
103
  }) {
114
- if (!getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
104
+ if (!fg('editor_inline_comments_on_inline_nodes')) {
115
105
  return undefined;
116
106
  }
117
107
  let nodeNames = new Set();
@@ -129,13 +119,13 @@ export function getRangeInlineNodeNames({
129
119
  /**
130
120
  * This function returns a list of node types that are wrapped by an annotation mark.
131
121
  *
132
- * The `undefined` will be returned if `platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz` is off.
122
+ * The `undefined` will be returned if `editor_inline_comments_on_inline_nodes` is off.
133
123
  *
134
124
  * @todo: Do not forget to remove `undefined` when the
135
- * `platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz` is removed.
125
+ * `editor_inline_comments_on_inline_nodes` is removed.
136
126
  */
137
127
  export function getAnnotationInlineNodeTypes(state, annotationId) {
138
- if (!getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
128
+ if (!fg('editor_inline_comments_on_inline_nodes')) {
139
129
  return undefined;
140
130
  }
141
131
  const mark = state.schema.marks.annotation.create({
@@ -27,7 +27,10 @@ export { hasMergedCell, calcTableColumnWidths, convertProsemirrorTableNodeToArra
27
27
  export { createCompareNodes } from './compareNodes';
28
28
  export { compose } from './compose';
29
29
  export { isTextInput } from './is-text-input';
30
- export { ZERO_WIDTH_SPACE, ZERO_WIDTH_JOINER } from './whitespace';
30
+ /**
31
+ * @deprecated - [ED-23844] moving to own entry point @atlaskit/editor-common/whitespace
32
+ */
33
+ export { ZERO_WIDTH_SPACE, ZERO_WIDTH_JOINER } from '../whitespace';
31
34
  export { shouldForceTracking } from './should-force-tracking';
32
35
  export { getModeFromTheme } from './getModeFromTheme';
33
36
  export { getPerformanceOptions, startMeasureReactNodeViewRendered, stopMeasureReactNodeViewRendered } from './get-performance-options';
@@ -1,3 +1,6 @@
1
1
  export const GUTTER_SIZE_IN_PX = 120; // Default gutter size
2
+ /**
3
+ * @deprecated - [ED-23844] only used in Editor Core
4
+ */
2
5
  export const GUTTER_SIZE_MOBILE_IN_PX = 36; // Gutter size for Mobile
3
6
  export const GUTTER_SELECTOR = '#editor-scroll-gutter';
@@ -1,6 +1,6 @@
1
1
  import { inlineNodes, isSafeUrl, PanelType, generateUuid as uuid } from '@atlaskit/adf-schema';
2
2
  import { defaultSchema } from '@atlaskit/adf-schema/schema-default';
3
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
3
+ import { fg } from '@atlaskit/platform-feature-flags';
4
4
  export const ADFStages = {
5
5
  FINAL: 'final',
6
6
  STAGE_0: 'stage0'
@@ -236,7 +236,7 @@ export const getValidNode = (originalNode, schema = defaultSchema, adfStage = 'f
236
236
  return {
237
237
  type,
238
238
  attrs,
239
- ...(getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz') ? {
239
+ ...(fg('editor_inline_comments_on_inline_nodes') ? {
240
240
  marks
241
241
  } : {})
242
242
  };
@@ -249,7 +249,7 @@ export const getValidNode = (originalNode, schema = defaultSchema, adfStage = 'f
249
249
  return {
250
250
  type,
251
251
  attrs,
252
- ...(getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz') ? {
252
+ ...(fg('editor_inline_comments_on_inline_nodes') ? {
253
253
  marks
254
254
  } : {})
255
255
  };
@@ -262,7 +262,7 @@ export const getValidNode = (originalNode, schema = defaultSchema, adfStage = 'f
262
262
  return {
263
263
  type,
264
264
  attrs,
265
- ...(getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz') ? {
265
+ ...(fg('editor_inline_comments_on_inline_nodes') ? {
266
266
  marks
267
267
  } : {})
268
268
  };
@@ -286,7 +286,7 @@ export const getValidNode = (originalNode, schema = defaultSchema, adfStage = 'f
286
286
  return {
287
287
  type,
288
288
  attrs,
289
- ...(getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes') ? {
289
+ ...(fg('editor_inline_comments_on_inline_nodes') ? {
290
290
  marks
291
291
  } : {})
292
292
  };
@@ -498,7 +498,7 @@ export const getValidNode = (originalNode, schema = defaultSchema, adfStage = 'f
498
498
  text: mentionText,
499
499
  accessLevel: ''
500
500
  },
501
- ...(getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz') ? {
501
+ ...(fg('editor_inline_comments_on_inline_nodes') ? {
502
502
  marks
503
503
  } : {})
504
504
  };
@@ -0,0 +1 @@
1
+ export { ZERO_WIDTH_SPACE, ZERO_WIDTH_JOINER } from './whitespace';
@@ -4,7 +4,7 @@ import React from 'react';
4
4
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
5
5
  import { css, jsx } from '@emotion/react';
6
6
  import classnames from 'classnames';
7
- import { ZERO_WIDTH_SPACE } from '../utils';
7
+ import { ZERO_WIDTH_SPACE } from '../whitespace';
8
8
  var styles = css({
9
9
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
10
10
  '&.inline-extension': {
@@ -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';
@@ -2,7 +2,7 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
2
2
  // eslint-disable-next-line no-duplicate-imports
3
3
 
4
4
  import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
5
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
5
+ import { fg } from '@atlaskit/platform-feature-flags';
6
6
  var SMART_TO_ASCII = {
7
7
  '…': '...',
8
8
  '→': '->',
@@ -130,22 +130,17 @@ export var transformSmartCharsMentionsAndEmojis = function transformSmartCharsMe
130
130
  export var applyMarkOnRange = function applyMarkOnRange(from, to, removeMark, mark, tr) {
131
131
  var schema = tr.doc.type.schema;
132
132
  var code = schema.marks.code;
133
- var inlineCard = schema.nodes.inlineCard;
134
133
  if (mark.type === code) {
135
- getBooleanFF('platform.editor.simplify-inline-cards-in-code-blocks_jw6t1') ? transformNonTextNodesToText(from, to, tr) : transformSmartCharsMentionsAndEmojis(from, to, tr);
134
+ fg('platform.editor.simplify-inline-cards-in-code-blocks_jw6t1') ? transformNonTextNodesToText(from, to, tr) : transformSmartCharsMentionsAndEmojis(from, to, tr);
136
135
  }
137
136
  tr.doc.nodesBetween(tr.mapping.map(from), tr.mapping.map(to), function (node, pos) {
138
- if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
137
+ if (fg('editor_inline_comments_on_inline_nodes')) {
139
138
  if (!node.isText) {
140
139
  var isAllowedInlineNode = ['emoji', 'status', 'date', 'mention', 'inlineCard'].includes(node.type.name);
141
140
  if (!isAllowedInlineNode) {
142
141
  return true;
143
142
  }
144
143
  }
145
- } else if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes')) {
146
- if (!node.isText && node.type !== inlineCard) {
147
- return true;
148
- }
149
144
  } else {
150
145
  if (!node.isText) {
151
146
  return true;
@@ -5,7 +5,7 @@ export var annotationMessages = defineMessages({
5
5
  defaultMessage: 'Comment',
6
6
  description: 'Create/add an inline comment based on the users selection'
7
7
  },
8
- // TODO: Remove this message when the platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz FF is removed
8
+ // TODO: Remove this message when the editor_inline_comments_on_inline_nodes FF is removed
9
9
  createCommentInvalid: {
10
10
  id: 'fabric.editor.createCommentInvalid',
11
11
  defaultMessage: 'You can only comment on text and headings',
@@ -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.3.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
@@ -9,7 +9,8 @@ import React from 'react';
9
9
  import { jsx } from '@emotion/react';
10
10
  import { ACTION_SUBJECT, ACTION_SUBJECT_ID } from '../analytics';
11
11
  import { ErrorBoundary } from '../ui/ErrorBoundary';
12
- import { analyticsEventKey, browser, getPerformanceOptions, startMeasureReactNodeViewRendered, stopMeasureReactNodeViewRendered, ZERO_WIDTH_SPACE } from '../utils';
12
+ import { analyticsEventKey, browser, getPerformanceOptions, startMeasureReactNodeViewRendered, stopMeasureReactNodeViewRendered } from '../utils';
13
+ import { ZERO_WIDTH_SPACE } from '../whitespace';
13
14
  import { generateUniqueNodeKey } from './generateUniqueNodeKey';
14
15
  export var inlineNodeViewClassname = 'inlineNodeView';
15
16
  function createNodeView(_ref) {
@@ -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