@atlaskit/editor-core 211.2.1 → 211.2.3
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 +14 -0
- package/dist/cjs/create-editor/ReactEditorView.js +3 -0
- package/dist/cjs/ui/Toolbar/ToolbarWithSizeDetector.js +6 -4
- package/dist/cjs/utils/getNodesVisibleInViewport.js +42 -0
- package/dist/cjs/version-wrapper.js +1 -1
- package/dist/es2019/create-editor/ReactEditorView.js +3 -0
- package/dist/es2019/ui/Toolbar/ToolbarWithSizeDetector.js +6 -4
- package/dist/es2019/utils/getNodesVisibleInViewport.js +36 -0
- package/dist/es2019/version-wrapper.js +1 -1
- package/dist/esm/create-editor/ReactEditorView.js +3 -0
- package/dist/esm/ui/Toolbar/ToolbarWithSizeDetector.js +6 -4
- package/dist/esm/utils/getNodesVisibleInViewport.js +36 -0
- package/dist/esm/version-wrapper.js +1 -1
- package/dist/types/create-editor/ReactEditorView.d.ts +1 -2
- package/dist/types/utils/getNodesVisibleInViewport.d.ts +10 -0
- package/dist/types-ts4.5/create-editor/ReactEditorView.d.ts +1 -2
- package/dist/types-ts4.5/utils/getNodesVisibleInViewport.d.ts +10 -0
- package/package.json +18 -9
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,19 @@
|
|
|
1
1
|
# @atlaskit/editor-core
|
|
2
2
|
|
|
3
|
+
## 211.2.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 211.2.2
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`5c1589424fcc4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5c1589424fcc4) -
|
|
14
|
+
ED-29088 - Add nodesInViewport metric to proseMirrorRendered events.
|
|
15
|
+
- Updated dependencies
|
|
16
|
+
|
|
3
17
|
## 211.2.1
|
|
4
18
|
|
|
5
19
|
### Patch Changes
|
|
@@ -35,6 +35,7 @@ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
|
35
35
|
var _useProviders = require("../composable-editor/hooks/useProviders");
|
|
36
36
|
var _featureFlagsFromProps = require("../utils/feature-flags-from-props");
|
|
37
37
|
var _getNodesCount = require("../utils/getNodesCount");
|
|
38
|
+
var _getNodesVisibleInViewport = require("../utils/getNodesVisibleInViewport");
|
|
38
39
|
var _isFullPage = require("../utils/is-full-page");
|
|
39
40
|
var _RenderTracking = require("../utils/performance/components/RenderTracking");
|
|
40
41
|
var _measureEnum = _interopRequireDefault(require("../utils/performance/measure-enum"));
|
|
@@ -475,6 +476,7 @@ function ReactEditorView(props) {
|
|
|
475
476
|
var nodes = (0, _getNodesCount.getNodesCount)(viewRef.current.state.doc);
|
|
476
477
|
var ttfb = (0, _navigation.getResponseEndTime)();
|
|
477
478
|
var contextIdentifier = (_pluginInjectionAPI$c2 = pluginInjectionAPI.current.api().base) === null || _pluginInjectionAPI$c2 === void 0 ? void 0 : _pluginInjectionAPI$c2.sharedState.currentState();
|
|
479
|
+
var nodesInViewport = (0, _expValEquals.expValEquals)('platform_editor_ttvc_nodes_in_viewport', 'isEnabled', true) ? (0, _getNodesVisibleInViewport.getNodesVisibleInViewport)(viewRef.current.dom) : {};
|
|
478
480
|
dispatchAnalyticsEvent({
|
|
479
481
|
action: _analytics.ACTION.PROSEMIRROR_RENDERED,
|
|
480
482
|
actionSubject: _analytics.ACTION_SUBJECT.EDITOR,
|
|
@@ -482,6 +484,7 @@ function ReactEditorView(props) {
|
|
|
482
484
|
duration: duration,
|
|
483
485
|
startTime: startTime,
|
|
484
486
|
nodes: nodes,
|
|
487
|
+
nodesInViewport: nodesInViewport,
|
|
485
488
|
ttfb: ttfb,
|
|
486
489
|
severity: proseMirrorRenderedSeverity,
|
|
487
490
|
objectId: contextIdentifier === null || contextIdentifier === void 0 ? void 0 : contextIdentifier.objectId,
|
|
@@ -69,7 +69,8 @@ var DynamicStyleToolbarWithSizeDetector = function DynamicStyleToolbarWithSizeDe
|
|
|
69
69
|
var toolbarStyle = (0, _react.useMemo)(function () {
|
|
70
70
|
var toolbarWidth = (0, _isFullPage.isFullPage)(props.appearance) && props.twoLineEditorToolbar ? _types.ToolbarSize.S : _types.ToolbarSize.M;
|
|
71
71
|
var toolbarMinWidth = (0, _toolbarSize.toolbarSizeToWidth)(toolbarWidth, props.appearance);
|
|
72
|
-
var
|
|
72
|
+
var isPreviewPanelResponsivenessEnabled = (0, _expValEquals.expValEquals)('platform_editor_preview_panel_responsiveness', 'isEnabled', true);
|
|
73
|
+
var minWidth = "min-width: ".concat(props.hasMinWidth ? "".concat(toolbarMinWidth, "px") : isPreviewPanelResponsivenessEnabled ? 'fit-content' : '254px');
|
|
73
74
|
return [toolbar, minWidth];
|
|
74
75
|
}, [props.appearance, props.hasMinWidth, props.twoLineEditorToolbar]);
|
|
75
76
|
return (
|
|
@@ -105,15 +106,16 @@ var StaticStyleToolbarWithSizeDetector = function StaticStyleToolbarWithSizeDete
|
|
|
105
106
|
var minWidthValue = (0, _react.useMemo)(function () {
|
|
106
107
|
if (props.hasMinWidth) {
|
|
107
108
|
var toolbarWidth = (0, _isFullPage.isFullPage)(props.appearance) && props.twoLineEditorToolbar ? _types.ToolbarSize.S : _types.ToolbarSize.M;
|
|
108
|
-
return (0, _toolbarSize.toolbarSizeToWidth)(toolbarWidth, props.appearance);
|
|
109
|
+
return "".concat((0, _toolbarSize.toolbarSizeToWidth)(toolbarWidth, props.appearance), "px");
|
|
109
110
|
} else {
|
|
110
|
-
|
|
111
|
+
var isPreviewPanelResponsivenessEnabled = (0, _expValEquals.expValEquals)('platform_editor_preview_panel_responsiveness', 'isEnabled', true);
|
|
112
|
+
return isPreviewPanelResponsivenessEnabled ? 'fit-content' : '254px';
|
|
111
113
|
}
|
|
112
114
|
}, [props.appearance, props.hasMinWidth, props.twoLineEditorToolbar]);
|
|
113
115
|
return (0, _react2.jsx)("div", {
|
|
114
116
|
css: staticToolbar,
|
|
115
117
|
style: {
|
|
116
|
-
minWidth:
|
|
118
|
+
minWidth: minWidthValue
|
|
117
119
|
}
|
|
118
120
|
}, (0, _react2.jsx)(_widthDetector.WidthObserver, {
|
|
119
121
|
setWidth: setWidth
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.isNodeVisible = exports.getNodesVisibleInViewport = void 0;
|
|
7
|
+
/**
|
|
8
|
+
* Check if a DOM element is visible within the viewport. We deem a node visible if the top left corner coordinate is within the viewport.
|
|
9
|
+
* This may not look visible, and may include a node that looks below the fold – but it's more than 0 pixels within the viewport.
|
|
10
|
+
*/
|
|
11
|
+
var isNodeVisible = exports.isNodeVisible = function isNodeVisible(node) {
|
|
12
|
+
var rect = node.getBoundingClientRect();
|
|
13
|
+
var isVisible = rect.x >= 0 && rect.x < window.innerWidth && rect.y >= 0 && rect.y < window.innerHeight;
|
|
14
|
+
return isVisible;
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* Get visible nodes in viewport by looping through the first N nodes (MAX_NODES_TO_COUNT)
|
|
19
|
+
* in the editor DOM and counting the node types that are visible.
|
|
20
|
+
*/
|
|
21
|
+
var getNodesVisibleInViewport = exports.getNodesVisibleInViewport = function getNodesVisibleInViewport(editorDom) {
|
|
22
|
+
var MAX_NODES_TO_COUNT = 200;
|
|
23
|
+
var pmNodesList = editorDom.querySelectorAll('[data-prosemirror-node-name]');
|
|
24
|
+
var nodesTypeCounter = {};
|
|
25
|
+
for (var i = 0; i < Math.min(MAX_NODES_TO_COUNT, pmNodesList.length); i++) {
|
|
26
|
+
var node = pmNodesList[i];
|
|
27
|
+
var type = node.getAttribute('data-prosemirror-node-name');
|
|
28
|
+
|
|
29
|
+
// No valid prosemirrornode type, skip.
|
|
30
|
+
if (!type) {
|
|
31
|
+
continue;
|
|
32
|
+
}
|
|
33
|
+
var isVisible = isNodeVisible(node);
|
|
34
|
+
|
|
35
|
+
// Not a visible node, end counting.
|
|
36
|
+
if (!isVisible) {
|
|
37
|
+
break;
|
|
38
|
+
}
|
|
39
|
+
nodesTypeCounter[type] = (nodesTypeCounter[type] || 0) + 1;
|
|
40
|
+
}
|
|
41
|
+
return nodesTypeCounter;
|
|
42
|
+
};
|
|
@@ -23,6 +23,7 @@ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
|
23
23
|
import { useProviders } from '../composable-editor/hooks/useProviders';
|
|
24
24
|
import { createFeatureFlagsFromProps } from '../utils/feature-flags-from-props';
|
|
25
25
|
import { getNodesCount } from '../utils/getNodesCount';
|
|
26
|
+
import { getNodesVisibleInViewport } from '../utils/getNodesVisibleInViewport';
|
|
26
27
|
import { isFullPage } from '../utils/is-full-page';
|
|
27
28
|
import { RenderTracking } from '../utils/performance/components/RenderTracking';
|
|
28
29
|
import measurements from '../utils/performance/measure-enum';
|
|
@@ -441,6 +442,7 @@ export function ReactEditorView(props) {
|
|
|
441
442
|
const nodes = getNodesCount(viewRef.current.state.doc);
|
|
442
443
|
const ttfb = getResponseEndTime();
|
|
443
444
|
const contextIdentifier = (_pluginInjectionAPI$c4 = pluginInjectionAPI.current.api().base) === null || _pluginInjectionAPI$c4 === void 0 ? void 0 : _pluginInjectionAPI$c4.sharedState.currentState();
|
|
445
|
+
const nodesInViewport = expValEquals('platform_editor_ttvc_nodes_in_viewport', 'isEnabled', true) ? getNodesVisibleInViewport(viewRef.current.dom) : {};
|
|
444
446
|
dispatchAnalyticsEvent({
|
|
445
447
|
action: ACTION.PROSEMIRROR_RENDERED,
|
|
446
448
|
actionSubject: ACTION_SUBJECT.EDITOR,
|
|
@@ -448,6 +450,7 @@ export function ReactEditorView(props) {
|
|
|
448
450
|
duration,
|
|
449
451
|
startTime,
|
|
450
452
|
nodes,
|
|
453
|
+
nodesInViewport,
|
|
451
454
|
ttfb,
|
|
452
455
|
severity: proseMirrorRenderedSeverity,
|
|
453
456
|
objectId: contextIdentifier === null || contextIdentifier === void 0 ? void 0 : contextIdentifier.objectId,
|
|
@@ -56,7 +56,8 @@ const DynamicStyleToolbarWithSizeDetector = props => {
|
|
|
56
56
|
const toolbarStyle = useMemo(() => {
|
|
57
57
|
const toolbarWidth = isFullPage(props.appearance) && props.twoLineEditorToolbar ? ToolbarSize.S : ToolbarSize.M;
|
|
58
58
|
const toolbarMinWidth = toolbarSizeToWidth(toolbarWidth, props.appearance);
|
|
59
|
-
const
|
|
59
|
+
const isPreviewPanelResponsivenessEnabled = expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true);
|
|
60
|
+
const minWidth = `min-width: ${props.hasMinWidth ? `${toolbarMinWidth}px` : isPreviewPanelResponsivenessEnabled ? 'fit-content' : '254px'}`;
|
|
60
61
|
return [toolbar, minWidth];
|
|
61
62
|
}, [props.appearance, props.hasMinWidth, props.twoLineEditorToolbar]);
|
|
62
63
|
return (
|
|
@@ -89,15 +90,16 @@ const StaticStyleToolbarWithSizeDetector = props => {
|
|
|
89
90
|
const minWidthValue = useMemo(() => {
|
|
90
91
|
if (props.hasMinWidth) {
|
|
91
92
|
const toolbarWidth = isFullPage(props.appearance) && props.twoLineEditorToolbar ? ToolbarSize.S : ToolbarSize.M;
|
|
92
|
-
return toolbarSizeToWidth(toolbarWidth, props.appearance)
|
|
93
|
+
return `${toolbarSizeToWidth(toolbarWidth, props.appearance)}px`;
|
|
93
94
|
} else {
|
|
94
|
-
|
|
95
|
+
const isPreviewPanelResponsivenessEnabled = expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true);
|
|
96
|
+
return isPreviewPanelResponsivenessEnabled ? 'fit-content' : '254px';
|
|
95
97
|
}
|
|
96
98
|
}, [props.appearance, props.hasMinWidth, props.twoLineEditorToolbar]);
|
|
97
99
|
return jsx("div", {
|
|
98
100
|
css: staticToolbar,
|
|
99
101
|
style: {
|
|
100
|
-
minWidth:
|
|
102
|
+
minWidth: minWidthValue
|
|
101
103
|
}
|
|
102
104
|
}, jsx(WidthObserver, {
|
|
103
105
|
setWidth: setWidth
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Check if a DOM element is visible within the viewport. We deem a node visible if the top left corner coordinate is within the viewport.
|
|
3
|
+
* This may not look visible, and may include a node that looks below the fold – but it's more than 0 pixels within the viewport.
|
|
4
|
+
*/
|
|
5
|
+
export const isNodeVisible = node => {
|
|
6
|
+
const rect = node.getBoundingClientRect();
|
|
7
|
+
const isVisible = rect.x >= 0 && rect.x < window.innerWidth && rect.y >= 0 && rect.y < window.innerHeight;
|
|
8
|
+
return isVisible;
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
/**
|
|
12
|
+
* Get visible nodes in viewport by looping through the first N nodes (MAX_NODES_TO_COUNT)
|
|
13
|
+
* in the editor DOM and counting the node types that are visible.
|
|
14
|
+
*/
|
|
15
|
+
export const getNodesVisibleInViewport = editorDom => {
|
|
16
|
+
const MAX_NODES_TO_COUNT = 200;
|
|
17
|
+
const pmNodesList = editorDom.querySelectorAll('[data-prosemirror-node-name]');
|
|
18
|
+
const nodesTypeCounter = {};
|
|
19
|
+
for (let i = 0; i < Math.min(MAX_NODES_TO_COUNT, pmNodesList.length); i++) {
|
|
20
|
+
const node = pmNodesList[i];
|
|
21
|
+
const type = node.getAttribute('data-prosemirror-node-name');
|
|
22
|
+
|
|
23
|
+
// No valid prosemirrornode type, skip.
|
|
24
|
+
if (!type) {
|
|
25
|
+
continue;
|
|
26
|
+
}
|
|
27
|
+
const isVisible = isNodeVisible(node);
|
|
28
|
+
|
|
29
|
+
// Not a visible node, end counting.
|
|
30
|
+
if (!isVisible) {
|
|
31
|
+
break;
|
|
32
|
+
}
|
|
33
|
+
nodesTypeCounter[type] = (nodesTypeCounter[type] || 0) + 1;
|
|
34
|
+
}
|
|
35
|
+
return nodesTypeCounter;
|
|
36
|
+
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export const name = "@atlaskit/editor-core";
|
|
2
|
-
export const version = "211.2.
|
|
2
|
+
export const version = "211.2.2";
|
|
@@ -31,6 +31,7 @@ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
|
31
31
|
import { useProviders } from '../composable-editor/hooks/useProviders';
|
|
32
32
|
import { createFeatureFlagsFromProps } from '../utils/feature-flags-from-props';
|
|
33
33
|
import { getNodesCount } from '../utils/getNodesCount';
|
|
34
|
+
import { getNodesVisibleInViewport } from '../utils/getNodesVisibleInViewport';
|
|
34
35
|
import { isFullPage } from '../utils/is-full-page';
|
|
35
36
|
import { RenderTracking } from '../utils/performance/components/RenderTracking';
|
|
36
37
|
import measurements from '../utils/performance/measure-enum';
|
|
@@ -465,6 +466,7 @@ export function ReactEditorView(props) {
|
|
|
465
466
|
var nodes = getNodesCount(viewRef.current.state.doc);
|
|
466
467
|
var ttfb = getResponseEndTime();
|
|
467
468
|
var contextIdentifier = (_pluginInjectionAPI$c2 = pluginInjectionAPI.current.api().base) === null || _pluginInjectionAPI$c2 === void 0 ? void 0 : _pluginInjectionAPI$c2.sharedState.currentState();
|
|
469
|
+
var nodesInViewport = expValEquals('platform_editor_ttvc_nodes_in_viewport', 'isEnabled', true) ? getNodesVisibleInViewport(viewRef.current.dom) : {};
|
|
468
470
|
dispatchAnalyticsEvent({
|
|
469
471
|
action: ACTION.PROSEMIRROR_RENDERED,
|
|
470
472
|
actionSubject: ACTION_SUBJECT.EDITOR,
|
|
@@ -472,6 +474,7 @@ export function ReactEditorView(props) {
|
|
|
472
474
|
duration: duration,
|
|
473
475
|
startTime: startTime,
|
|
474
476
|
nodes: nodes,
|
|
477
|
+
nodesInViewport: nodesInViewport,
|
|
475
478
|
ttfb: ttfb,
|
|
476
479
|
severity: proseMirrorRenderedSeverity,
|
|
477
480
|
objectId: contextIdentifier === null || contextIdentifier === void 0 ? void 0 : contextIdentifier.objectId,
|
|
@@ -59,7 +59,8 @@ var DynamicStyleToolbarWithSizeDetector = function DynamicStyleToolbarWithSizeDe
|
|
|
59
59
|
var toolbarStyle = useMemo(function () {
|
|
60
60
|
var toolbarWidth = isFullPage(props.appearance) && props.twoLineEditorToolbar ? ToolbarSize.S : ToolbarSize.M;
|
|
61
61
|
var toolbarMinWidth = toolbarSizeToWidth(toolbarWidth, props.appearance);
|
|
62
|
-
var
|
|
62
|
+
var isPreviewPanelResponsivenessEnabled = expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true);
|
|
63
|
+
var minWidth = "min-width: ".concat(props.hasMinWidth ? "".concat(toolbarMinWidth, "px") : isPreviewPanelResponsivenessEnabled ? 'fit-content' : '254px');
|
|
63
64
|
return [toolbar, minWidth];
|
|
64
65
|
}, [props.appearance, props.hasMinWidth, props.twoLineEditorToolbar]);
|
|
65
66
|
return (
|
|
@@ -95,15 +96,16 @@ var StaticStyleToolbarWithSizeDetector = function StaticStyleToolbarWithSizeDete
|
|
|
95
96
|
var minWidthValue = useMemo(function () {
|
|
96
97
|
if (props.hasMinWidth) {
|
|
97
98
|
var toolbarWidth = isFullPage(props.appearance) && props.twoLineEditorToolbar ? ToolbarSize.S : ToolbarSize.M;
|
|
98
|
-
return toolbarSizeToWidth(toolbarWidth, props.appearance);
|
|
99
|
+
return "".concat(toolbarSizeToWidth(toolbarWidth, props.appearance), "px");
|
|
99
100
|
} else {
|
|
100
|
-
|
|
101
|
+
var isPreviewPanelResponsivenessEnabled = expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true);
|
|
102
|
+
return isPreviewPanelResponsivenessEnabled ? 'fit-content' : '254px';
|
|
101
103
|
}
|
|
102
104
|
}, [props.appearance, props.hasMinWidth, props.twoLineEditorToolbar]);
|
|
103
105
|
return jsx("div", {
|
|
104
106
|
css: staticToolbar,
|
|
105
107
|
style: {
|
|
106
|
-
minWidth:
|
|
108
|
+
minWidth: minWidthValue
|
|
107
109
|
}
|
|
108
110
|
}, jsx(WidthObserver, {
|
|
109
111
|
setWidth: setWidth
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Check if a DOM element is visible within the viewport. We deem a node visible if the top left corner coordinate is within the viewport.
|
|
3
|
+
* This may not look visible, and may include a node that looks below the fold – but it's more than 0 pixels within the viewport.
|
|
4
|
+
*/
|
|
5
|
+
export var isNodeVisible = function isNodeVisible(node) {
|
|
6
|
+
var rect = node.getBoundingClientRect();
|
|
7
|
+
var isVisible = rect.x >= 0 && rect.x < window.innerWidth && rect.y >= 0 && rect.y < window.innerHeight;
|
|
8
|
+
return isVisible;
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
/**
|
|
12
|
+
* Get visible nodes in viewport by looping through the first N nodes (MAX_NODES_TO_COUNT)
|
|
13
|
+
* in the editor DOM and counting the node types that are visible.
|
|
14
|
+
*/
|
|
15
|
+
export var getNodesVisibleInViewport = function getNodesVisibleInViewport(editorDom) {
|
|
16
|
+
var MAX_NODES_TO_COUNT = 200;
|
|
17
|
+
var pmNodesList = editorDom.querySelectorAll('[data-prosemirror-node-name]');
|
|
18
|
+
var nodesTypeCounter = {};
|
|
19
|
+
for (var i = 0; i < Math.min(MAX_NODES_TO_COUNT, pmNodesList.length); i++) {
|
|
20
|
+
var node = pmNodesList[i];
|
|
21
|
+
var type = node.getAttribute('data-prosemirror-node-name');
|
|
22
|
+
|
|
23
|
+
// No valid prosemirrornode type, skip.
|
|
24
|
+
if (!type) {
|
|
25
|
+
continue;
|
|
26
|
+
}
|
|
27
|
+
var isVisible = isNodeVisible(node);
|
|
28
|
+
|
|
29
|
+
// Not a visible node, end counting.
|
|
30
|
+
if (!isVisible) {
|
|
31
|
+
break;
|
|
32
|
+
}
|
|
33
|
+
nodesTypeCounter[type] = (nodesTypeCounter[type] || 0) + 1;
|
|
34
|
+
}
|
|
35
|
+
return nodesTypeCounter;
|
|
36
|
+
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export var name = "@atlaskit/editor-core";
|
|
2
|
-
export var version = "211.2.
|
|
2
|
+
export var version = "211.2.2";
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type { WrappedComponentProps } from 'react-intl-next';
|
|
3
|
-
import { type WithIntlProps } from 'react-intl-next';
|
|
2
|
+
import type { WrappedComponentProps, WithIntlProps } from 'react-intl-next';
|
|
4
3
|
import type { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next/types';
|
|
5
4
|
import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
|
|
6
5
|
import { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Check if a DOM element is visible within the viewport. We deem a node visible if the top left corner coordinate is within the viewport.
|
|
3
|
+
* This may not look visible, and may include a node that looks below the fold – but it's more than 0 pixels within the viewport.
|
|
4
|
+
*/
|
|
5
|
+
export declare const isNodeVisible: (node: Element) => boolean;
|
|
6
|
+
/**
|
|
7
|
+
* Get visible nodes in viewport by looping through the first N nodes (MAX_NODES_TO_COUNT)
|
|
8
|
+
* in the editor DOM and counting the node types that are visible.
|
|
9
|
+
*/
|
|
10
|
+
export declare const getNodesVisibleInViewport: (editorDom: Element) => Record<string, number>;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type { WrappedComponentProps } from 'react-intl-next';
|
|
3
|
-
import { type WithIntlProps } from 'react-intl-next';
|
|
2
|
+
import type { WrappedComponentProps, WithIntlProps } from 'react-intl-next';
|
|
4
3
|
import type { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next/types';
|
|
5
4
|
import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
|
|
6
5
|
import { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Check if a DOM element is visible within the viewport. We deem a node visible if the top left corner coordinate is within the viewport.
|
|
3
|
+
* This may not look visible, and may include a node that looks below the fold – but it's more than 0 pixels within the viewport.
|
|
4
|
+
*/
|
|
5
|
+
export declare const isNodeVisible: (node: Element) => boolean;
|
|
6
|
+
/**
|
|
7
|
+
* Get visible nodes in viewport by looping through the first N nodes (MAX_NODES_TO_COUNT)
|
|
8
|
+
* in the editor DOM and counting the node types that are visible.
|
|
9
|
+
*/
|
|
10
|
+
export declare const getNodesVisibleInViewport: (editorDom: Element) => Record<string, number>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-core",
|
|
3
|
-
"version": "211.2.
|
|
3
|
+
"version": "211.2.3",
|
|
4
4
|
"description": "A package contains Atlassian editor core functionality",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
"@atlaskit/analytics-next": "^11.1.0",
|
|
45
45
|
"@atlaskit/analytics-next-stable-react-context": "1.0.1",
|
|
46
46
|
"@atlaskit/button": "^23.4.0",
|
|
47
|
-
"@atlaskit/css": "^0.
|
|
47
|
+
"@atlaskit/css": "^0.13.0",
|
|
48
48
|
"@atlaskit/editor-json-transformer": "^8.27.0",
|
|
49
49
|
"@atlaskit/editor-performance-metrics": "^2.1.0",
|
|
50
50
|
"@atlaskit/editor-plugin-quick-insert": "^4.0.0",
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
"@atlaskit/editor-plugins": "^10.3.0",
|
|
53
53
|
"@atlaskit/editor-prosemirror": "7.0.0",
|
|
54
54
|
"@atlaskit/editor-shared-styles": "^3.6.0",
|
|
55
|
-
"@atlaskit/editor-toolbar": "^0.
|
|
55
|
+
"@atlaskit/editor-toolbar": "^0.8.0",
|
|
56
56
|
"@atlaskit/editor-toolbar-model": "^0.2.0",
|
|
57
57
|
"@atlaskit/emoji": "^69.5.0",
|
|
58
58
|
"@atlaskit/icon": "^28.1.0",
|
|
@@ -63,8 +63,8 @@
|
|
|
63
63
|
"@atlaskit/platform-feature-flags-react": "^0.3.0",
|
|
64
64
|
"@atlaskit/react-ufo": "^4.5.0",
|
|
65
65
|
"@atlaskit/task-decision": "^19.2.0",
|
|
66
|
-
"@atlaskit/tmp-editor-statsig": "^12.
|
|
67
|
-
"@atlaskit/tokens": "^6.
|
|
66
|
+
"@atlaskit/tmp-editor-statsig": "^12.4.0",
|
|
67
|
+
"@atlaskit/tokens": "^6.2.0",
|
|
68
68
|
"@atlaskit/tooltip": "^20.4.0",
|
|
69
69
|
"@atlaskit/width-detector": "^5.0.0",
|
|
70
70
|
"@babel/runtime": "^7.0.0",
|
|
@@ -80,7 +80,7 @@
|
|
|
80
80
|
"uuid": "^3.1.0"
|
|
81
81
|
},
|
|
82
82
|
"peerDependencies": {
|
|
83
|
-
"@atlaskit/editor-common": "^108.
|
|
83
|
+
"@atlaskit/editor-common": "^108.2.0",
|
|
84
84
|
"@atlaskit/link-provider": "^3.7.0",
|
|
85
85
|
"@atlaskit/media-core": "^37.0.0",
|
|
86
86
|
"react": "^18.2.0",
|
|
@@ -103,10 +103,10 @@
|
|
|
103
103
|
"@atlaskit/media-integration-test-helpers": "workspace:^",
|
|
104
104
|
"@atlaskit/media-test-helpers": "^39.0.0",
|
|
105
105
|
"@atlaskit/modal-dialog": "^14.3.0",
|
|
106
|
-
"@atlaskit/primitives": "^14.
|
|
107
|
-
"@atlaskit/renderer": "^121.
|
|
106
|
+
"@atlaskit/primitives": "^14.13.0",
|
|
107
|
+
"@atlaskit/renderer": "^121.1.0",
|
|
108
108
|
"@atlaskit/section-message": "^8.7.0",
|
|
109
|
-
"@atlaskit/smart-card": "^40.
|
|
109
|
+
"@atlaskit/smart-card": "^40.19.0",
|
|
110
110
|
"@atlaskit/synchrony-test-helpers": "workspace:^",
|
|
111
111
|
"@atlaskit/toggle": "^15.1.0",
|
|
112
112
|
"@atlaskit/util-data-test": "^18.1.0",
|
|
@@ -520,6 +520,15 @@
|
|
|
520
520
|
"platform_editor_adf_with_localid": {
|
|
521
521
|
"type": "boolean",
|
|
522
522
|
"referenceOnly": true
|
|
523
|
+
},
|
|
524
|
+
"platform_editor_resolve_hyperlinks_CONFLUENCE": {
|
|
525
|
+
"type": "boolean"
|
|
526
|
+
},
|
|
527
|
+
"platform_editor_resolve_hyperlinks_JIRA": {
|
|
528
|
+
"type": "boolean"
|
|
529
|
+
},
|
|
530
|
+
"platform_editor_resolve_hyperlinks_killswitch": {
|
|
531
|
+
"type": "boolean"
|
|
523
532
|
}
|
|
524
533
|
},
|
|
525
534
|
"stricter": {
|