@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.
- package/CHANGELOG.md +32 -0
- package/afm-cc/tsconfig.json +3 -0
- package/afm-jira/tsconfig.json +3 -0
- package/dist/cjs/extensibility/ExtensionNodeWrapper.js +2 -2
- package/dist/cjs/link/ConfigureLinkOverlay/Dropdown.js +56 -0
- package/dist/cjs/link/ConfigureLinkOverlay/StyledButton.js +38 -0
- package/dist/cjs/link/ConfigureLinkOverlay/{OverlayButton.js → index.js} +29 -22
- package/dist/cjs/link/index.js +2 -2
- package/dist/cjs/mark/commands.js +2 -7
- package/dist/cjs/messages/annotation.js +1 -1
- package/dist/cjs/monitoring/error.js +1 -1
- package/dist/cjs/react-node-view/getInlineNodeViewProducer.js +3 -2
- package/dist/cjs/resizer/Resizer.js +23 -45
- package/dist/cjs/styles/shared/annotation.js +2 -34
- package/dist/cjs/styles/shared/smartCard.js +1 -1
- package/dist/cjs/ui/DropList/index.js +1 -1
- package/dist/cjs/ui-color/ColorPalette/Color/index.js +1 -2
- package/dist/cjs/ui-color/ColorPalette/Palettes/highlightColorPalette.js +6 -11
- package/dist/cjs/ui-color/ColorPalette/Palettes/textColorPalette.js +2 -11
- package/dist/cjs/ui-color/index.js +0 -12
- package/dist/cjs/utils/annotation/index.js +10 -18
- package/dist/cjs/utils/index.js +5 -1
- package/dist/cjs/utils/scroll-gutter.js +3 -0
- package/dist/cjs/utils/validator.js +5 -5
- package/dist/cjs/whitespace/index.js +18 -0
- package/dist/es2019/extensibility/ExtensionNodeWrapper.js +1 -1
- package/dist/es2019/link/ConfigureLinkOverlay/Dropdown.js +45 -0
- package/dist/es2019/link/ConfigureLinkOverlay/StyledButton.js +30 -0
- package/dist/es2019/link/ConfigureLinkOverlay/{OverlayButton.js → index.js} +28 -24
- package/dist/es2019/link/index.js +1 -1
- package/dist/es2019/mark/commands.js +3 -10
- package/dist/es2019/messages/annotation.js +1 -1
- package/dist/es2019/monitoring/error.js +1 -1
- package/dist/es2019/react-node-view/getInlineNodeViewProducer.js +2 -1
- package/dist/es2019/resizer/Resizer.js +26 -54
- package/dist/es2019/styles/shared/annotation.js +3 -35
- package/dist/es2019/styles/shared/smartCard.js +2 -2
- package/dist/es2019/ui/DropList/index.js +1 -1
- package/dist/es2019/ui-color/ColorPalette/Color/index.js +1 -2
- package/dist/es2019/ui-color/ColorPalette/Palettes/highlightColorPalette.js +2 -7
- package/dist/es2019/ui-color/ColorPalette/Palettes/textColorPalette.js +2 -7
- package/dist/es2019/ui-color/index.js +2 -2
- package/dist/es2019/utils/annotation/index.js +11 -21
- package/dist/es2019/utils/index.js +4 -1
- package/dist/es2019/utils/scroll-gutter.js +3 -0
- package/dist/es2019/utils/validator.js +6 -6
- package/dist/es2019/whitespace/index.js +1 -0
- package/dist/esm/extensibility/ExtensionNodeWrapper.js +1 -1
- package/dist/esm/link/ConfigureLinkOverlay/Dropdown.js +46 -0
- package/dist/esm/link/ConfigureLinkOverlay/StyledButton.js +31 -0
- package/dist/esm/link/ConfigureLinkOverlay/{OverlayButton.js → index.js} +31 -24
- package/dist/esm/link/index.js +1 -1
- package/dist/esm/mark/commands.js +3 -8
- package/dist/esm/messages/annotation.js +1 -1
- package/dist/esm/monitoring/error.js +1 -1
- package/dist/esm/react-node-view/getInlineNodeViewProducer.js +2 -1
- package/dist/esm/resizer/Resizer.js +23 -45
- package/dist/esm/styles/shared/annotation.js +3 -35
- package/dist/esm/styles/shared/smartCard.js +2 -2
- package/dist/esm/ui/DropList/index.js +1 -1
- package/dist/esm/ui-color/ColorPalette/Color/index.js +1 -2
- package/dist/esm/ui-color/ColorPalette/Palettes/highlightColorPalette.js +1 -10
- package/dist/esm/ui-color/ColorPalette/Palettes/textColorPalette.js +1 -10
- package/dist/esm/ui-color/index.js +2 -2
- package/dist/esm/utils/annotation/index.js +11 -19
- package/dist/esm/utils/index.js +4 -1
- package/dist/esm/utils/scroll-gutter.js +3 -0
- package/dist/esm/utils/validator.js +6 -6
- package/dist/esm/whitespace/index.js +1 -0
- package/dist/types/link/ConfigureLinkOverlay/Dropdown.d.ts +7 -0
- package/dist/types/link/ConfigureLinkOverlay/StyledButton.d.ts +7 -0
- package/dist/types/link/index.d.ts +2 -2
- package/dist/types/types/annotation/index.d.ts +2 -2
- package/dist/types/ui-color/ColorPalette/Palettes/highlightColorPalette.d.ts +0 -1
- package/dist/types/ui-color/ColorPalette/Palettes/textColorPalette.d.ts +1 -2
- package/dist/types/ui-color/index.d.ts +2 -2
- package/dist/types/utils/annotation/index.d.ts +2 -2
- package/dist/types/utils/index.d.ts +4 -1
- package/dist/types/utils/scroll-gutter.d.ts +3 -0
- package/dist/types/whitespace/index.d.ts +1 -0
- package/dist/types-ts4.5/link/ConfigureLinkOverlay/Dropdown.d.ts +7 -0
- package/dist/types-ts4.5/link/ConfigureLinkOverlay/StyledButton.d.ts +7 -0
- package/dist/types-ts4.5/link/index.d.ts +2 -2
- package/dist/types-ts4.5/types/annotation/index.d.ts +2 -2
- package/dist/types-ts4.5/ui-color/ColorPalette/Palettes/highlightColorPalette.d.ts +0 -1
- package/dist/types-ts4.5/ui-color/ColorPalette/Palettes/textColorPalette.d.ts +1 -2
- package/dist/types-ts4.5/ui-color/index.d.ts +2 -2
- package/dist/types-ts4.5/utils/annotation/index.d.ts +2 -2
- package/dist/types-ts4.5/utils/index.d.ts +4 -1
- package/dist/types-ts4.5/utils/scroll-gutter.d.ts +3 -0
- package/dist/types-ts4.5/whitespace/index.d.ts +1 -0
- package/package.json +6 -13
- package/whitespace/package.json +15 -0
- /package/dist/cjs/{utils → whitespace}/whitespace.js +0 -0
- /package/dist/es2019/{utils → whitespace}/whitespace.js +0 -0
- /package/dist/esm/{utils → whitespace}/whitespace.js +0 -0
- /package/dist/types/link/ConfigureLinkOverlay/{OverlayButton.d.ts → index.d.ts} +0 -0
- /package/dist/types/{utils → whitespace}/whitespace.d.ts +0 -0
- /package/dist/types-ts4.5/link/ConfigureLinkOverlay/{OverlayButton.d.ts → index.d.ts} +0 -0
- /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 {
|
|
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
|
-
${
|
|
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.
|
|
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 ||
|
|
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:
|
|
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:
|
|
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
|
|
9
|
-
export { 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 {
|
|
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
|
-
|
|
25
|
-
if (
|
|
26
|
-
|
|
27
|
-
|
|
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 (!
|
|
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 `
|
|
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
|
-
* `
|
|
125
|
+
* `editor_inline_comments_on_inline_nodes` is removed.
|
|
136
126
|
*/
|
|
137
127
|
export function getAnnotationInlineNodeTypes(state, annotationId) {
|
|
138
|
-
if (!
|
|
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
|
-
|
|
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,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 {
|
|
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
|
-
...(
|
|
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
|
-
...(
|
|
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
|
-
...(
|
|
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
|
-
...(
|
|
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
|
-
...(
|
|
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 '../
|
|
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
|
|
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
|
-
|
|
15
|
-
|
|
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
|
-
|
|
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(
|
|
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,
|
package/dist/esm/link/index.js
CHANGED
|
@@ -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
|
|
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 {
|
|
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
|
-
|
|
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 (
|
|
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
|
|
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.
|
|
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
|
|
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
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
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
|
-
},
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
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
|
|