@atlaskit/editor-plugin-base 1.12.1 → 2.0.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 CHANGED
@@ -1,5 +1,33 @@
1
1
  # @atlaskit/editor-plugin-base
2
2
 
3
+ ## 2.0.0
4
+
5
+ ### Major Changes
6
+
7
+ - [#154731](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/154731)
8
+ [`c07d9c6cecf8e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c07d9c6cecf8e) -
9
+ EDF-1411 Removed UFO experience events from Editor.
10
+
11
+ ### Patch Changes
12
+
13
+ - [#154843](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/154843)
14
+ [`33209df89f059`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/33209df89f059) -
15
+ [ux] Improve how the scroll gutter at the bottom of the screen works to prevent flickering while
16
+ typing.
17
+ - [#154186](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/154186)
18
+ [`5c316170d29dd`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5c316170d29dd) -
19
+ Bump @atlaskit/adf-schema to 42.3.1
20
+ - Updated dependencies
21
+
22
+ ## 1.12.2
23
+
24
+ ### Patch Changes
25
+
26
+ - [#154162](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/154162)
27
+ [`5982815965267`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5982815965267) -
28
+ Updated performanceTracking and inputSampling props to hardcoded values as we're removing this
29
+ feature flag
30
+
3
31
  ## 1.12.1
4
32
 
5
33
  ### Patch Changes
@@ -11,6 +11,7 @@ var _adfSchema = require("@atlaskit/adf-schema");
11
11
  var _keymaps = require("@atlaskit/editor-common/keymaps");
12
12
  var _commands = require("@atlaskit/editor-prosemirror/commands");
13
13
  var _history = require("@atlaskit/editor-prosemirror/history");
14
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
14
15
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
15
16
  var _commands2 = require("./commands");
16
17
  var _disableSpellChecking = _interopRequireDefault(require("./pm-plugins/disable-spell-checking"));
@@ -20,6 +21,8 @@ var _inlineCursorTarget = _interopRequireDefault(require("./pm-plugins/inline-cu
20
21
  var _lazyNodeViewDecoration = require("./pm-plugins/lazy-node-view-decoration");
21
22
  var _newlinePreserveMarks = _interopRequireDefault(require("./pm-plugins/newline-preserve-marks"));
22
23
  var _scrollGutter = _interopRequireWildcard(require("./pm-plugins/scroll-gutter"));
24
+ var _next = _interopRequireDefault(require("./pm-plugins/scroll-gutter/next"));
25
+ var _inputTrackingConfig = require("./utils/inputTrackingConfig");
23
26
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
24
27
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
25
28
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -81,9 +84,8 @@ var basePlugin = function basePlugin(_ref) {
81
84
  }, {
82
85
  name: 'frozenEditor',
83
86
  plugin: function plugin(_ref3) {
84
- var _options$inputTrackin;
85
87
  var dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent;
86
- return options !== null && options !== void 0 && (_options$inputTrackin = options.inputTracking) !== null && _options$inputTrackin !== void 0 && _options$inputTrackin.enabled || options !== null && options !== void 0 && options.ufo ? (0, _frozenEditor.default)(api === null || api === void 0 ? void 0 : api.contextIdentifier)(dispatchAnalyticsEvent, options.inputTracking, options.browserFreezeTracking, options.ufo) : undefined;
88
+ return (0, _frozenEditor.default)(api === null || api === void 0 ? void 0 : api.contextIdentifier)(dispatchAnalyticsEvent, _inputTrackingConfig.inputTracking, undefined);
87
89
  }
88
90
  }, {
89
91
  name: 'history',
@@ -106,12 +108,21 @@ var basePlugin = function basePlugin(_ref) {
106
108
  }
107
109
  });
108
110
  if (options && options.allowScrollGutter) {
109
- plugins.push({
110
- name: 'scrollGutterPlugin',
111
- plugin: function plugin() {
112
- return (0, _scrollGutter.default)(options.allowScrollGutter);
113
- }
114
- });
111
+ if ((0, _platformFeatureFlags.fg)('platform_editor_improved_scroll_gutter')) {
112
+ plugins.push({
113
+ name: 'scrollGutterPlugin',
114
+ plugin: function plugin() {
115
+ return (0, _next.default)(options.allowScrollGutter);
116
+ }
117
+ });
118
+ } else {
119
+ plugins.push({
120
+ name: 'scrollGutterPlugin',
121
+ plugin: function plugin() {
122
+ return (0, _scrollGutter.default)(options.allowScrollGutter);
123
+ }
124
+ });
125
+ }
115
126
  }
116
127
  plugins.push({
117
128
  name: 'disableSpellcheckingPlugin',
@@ -10,7 +10,6 @@ var _analytics = require("@atlaskit/editor-common/analytics");
10
10
  var _countNodes = require("@atlaskit/editor-common/count-nodes");
11
11
  var _isPerformanceApiAvailable = require("@atlaskit/editor-common/is-performance-api-available");
12
12
  var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
13
- var _ufo = require("@atlaskit/editor-common/ufo");
14
13
  var _analytics2 = require("@atlaskit/editor-common/utils/analytics");
15
14
  var _state = require("@atlaskit/editor-prosemirror/state");
16
15
  var _frozenEditor = require("../utils/frozen-editor");
@@ -47,17 +46,18 @@ var dispatchLongTaskEvent = function dispatchLongTaskEvent(contextIdentifierPlug
47
46
  };
48
47
  };
49
48
  var _default = exports.default = function _default(contextIdentifierPlugin) {
50
- return function (dispatchAnalyticsEvent, inputTracking, browserFreezeTracking, ufo) {
49
+ return function (dispatchAnalyticsEvent, inputTracking, browserFreezeTracking) {
51
50
  var interactionType;
52
51
  var inputLatencyTracker = null;
53
- var inputLatencySingleKeyTracker = null;
54
- var inputLatencyRenderedTracker = null;
55
52
  if (browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType) {
56
53
  interactionType = (0, _frozenEditor.setInteractionType)(_analytics.BROWSER_FREEZE_INTERACTION_TYPE.LOADING);
57
54
  }
58
55
  var samplingRate = inputTracking && typeof inputTracking.samplingRate === 'number' ? inputTracking.samplingRate : DEFAULT_KEYSTROKE_SAMPLING_LIMIT;
59
- var slowThreshold = inputTracking && typeof inputTracking.slowThreshold === 'number' ? inputTracking.slowThreshold : DEFAULT_SLOW_THRESHOLD;
60
- var freezeThreshold = inputTracking && typeof inputTracking.freezeThreshold === 'number' ? inputTracking.freezeThreshold : DEFAULT_FREEZE_THRESHOLD;
56
+
57
+ //TODO: get right values here based on appearance
58
+ var slowThreshold = DEFAULT_SLOW_THRESHOLD;
59
+ //TODO: get right values here based on appearance
60
+ var freezeThreshold = DEFAULT_FREEZE_THRESHOLD;
61
61
  var allowCountNodes = inputTracking && inputTracking.countNodes;
62
62
  var prevNodeCountState = null;
63
63
  var prevNodeCount = {};
@@ -134,19 +134,6 @@ var _default = exports.default = function _default(contextIdentifierPlugin) {
134
134
  // Also this is called before browser rendering so it doesn't count it.
135
135
  requestAnimationFrame(end);
136
136
  }
137
- if (inputLatencySingleKeyTracker) {
138
- var _end = inputLatencySingleKeyTracker.start();
139
-
140
- // This is executed before next handleTextInput when multiple keypress events are in one animation frame
141
- // so it tracks individual keypress processing time
142
- Promise.resolve().then(_end);
143
- }
144
- if (inputLatencyRenderedTracker) {
145
- var _end2 = inputLatencyRenderedTracker.start();
146
-
147
- // This is called at the next event loop so it counts browser rendering time.
148
- setTimeout(_end2);
149
- }
150
137
  return false;
151
138
  },
152
139
  handleDOMEvents: browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? {
@@ -164,75 +151,30 @@ var _default = exports.default = function _default(contextIdentifierPlugin) {
164
151
  if (!(0, _isPerformanceApiAvailable.isPerformanceObserverAvailable)()) {
165
152
  return {};
166
153
  }
167
- var experienceStore = ufo ? _ufo.ExperienceStore.getInstance(_view) : undefined;
168
- if (inputTracking !== null && inputTracking !== void 0 && inputTracking.enabled) {
169
- inputLatencyTracker = new _inputLatencyTracking.default({
170
- samplingRate: samplingRate,
171
- slowThreshold: slowThreshold,
172
- normalThreshold: severityThresholdNormal,
173
- degradedThreshold: severityThresholdDegraded,
174
- onSampleStart: function onSampleStart() {
175
- experienceStore === null || experienceStore === void 0 || experienceStore.start(_ufo.EditorExperience.typing);
176
- },
177
- onSampleEnd: function onSampleEnd(time, _ref2) {
178
- var _contextIdentifierPlu4;
179
- var isSlow = _ref2.isSlow,
180
- severity = _ref2.severity;
181
- var state = _view.state;
182
- var nodesCount = getNodeCount(state);
183
- if (isSlow) {
184
- experienceStore === null || experienceStore === void 0 || experienceStore.addMetadata(_ufo.EditorExperience.typing, {
185
- slowInput: true
186
- });
187
- }
188
- experienceStore === null || experienceStore === void 0 || experienceStore.success(_ufo.EditorExperience.typing, _objectSpread(_objectSpread({
154
+ inputLatencyTracker = new _inputLatencyTracking.default({
155
+ samplingRate: samplingRate,
156
+ slowThreshold: slowThreshold,
157
+ normalThreshold: severityThresholdNormal,
158
+ degradedThreshold: severityThresholdDegraded,
159
+ dispatchSample: createDispatchSample(_analytics.ACTION.INPUT_PERF_SAMPLING, _view),
160
+ dispatchAverage: createDispatchAverage(_analytics.ACTION.INPUT_PERF_SAMPLING_AVG, _view),
161
+ onSlowInput: function onSlowInput(time) {
162
+ var _contextIdentifierPlu4;
163
+ var state = _view.state;
164
+ var nodesCount = getNodeCount(state);
165
+ dispatchAnalyticsEvent({
166
+ action: _analytics.ACTION.SLOW_INPUT,
167
+ actionSubject: _analytics.ACTION_SUBJECT.EDITOR,
168
+ attributes: _objectSpread(_objectSpread({
169
+ time: time,
189
170
  nodeSize: state.doc.nodeSize
190
171
  }, nodesCount), {}, {
191
- objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu4 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu4 === void 0 || (_contextIdentifierPlu4 = _contextIdentifierPlu4.contextIdentifierProvider) === null || _contextIdentifierPlu4 === void 0 ? void 0 : _contextIdentifierPlu4.objectId,
192
- time: time,
193
- severity: shouldTrackSeverity ? severity : undefined
194
- }));
195
- },
196
- dispatchSample: createDispatchSample(_analytics.ACTION.INPUT_PERF_SAMPLING, _view),
197
- dispatchAverage: createDispatchAverage(_analytics.ACTION.INPUT_PERF_SAMPLING_AVG, _view),
198
- onSlowInput: function onSlowInput(time) {
199
- var _contextIdentifierPlu5;
200
- var state = _view.state;
201
- var nodesCount = getNodeCount(state);
202
- dispatchAnalyticsEvent({
203
- action: _analytics.ACTION.SLOW_INPUT,
204
- actionSubject: _analytics.ACTION_SUBJECT.EDITOR,
205
- attributes: _objectSpread(_objectSpread({
206
- time: time,
207
- nodeSize: state.doc.nodeSize
208
- }, nodesCount), {}, {
209
- objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu5 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu5 === void 0 || (_contextIdentifierPlu5 = _contextIdentifierPlu5.contextIdentifierProvider) === null || _contextIdentifierPlu5 === void 0 ? void 0 : _contextIdentifierPlu5.objectId
210
- }),
211
- eventType: _analytics.EVENT_TYPE.OPERATIONAL
212
- });
213
- }
214
- });
215
- }
216
- if (inputTracking !== null && inputTracking !== void 0 && inputTracking.trackSingleKeypress) {
217
- inputLatencySingleKeyTracker = new _inputLatencyTracking.default({
218
- samplingRate: samplingRate,
219
- slowThreshold: slowThreshold,
220
- normalThreshold: severityThresholdNormal,
221
- degradedThreshold: severityThresholdDegraded,
222
- dispatchSample: createDispatchSample(_analytics.ACTION.INPUT_PERF_SAMPLING_SINGLE_KEYPRESS, _view),
223
- dispatchAverage: createDispatchAverage(_analytics.ACTION.INPUT_PERF_SAMPLING_SINGLE_KEYPRESS_AVG, _view)
224
- });
225
- }
226
- if (inputTracking !== null && inputTracking !== void 0 && inputTracking.trackRenderingTime) {
227
- inputLatencyRenderedTracker = new _inputLatencyTracking.default({
228
- samplingRate: samplingRate,
229
- slowThreshold: slowThreshold,
230
- normalThreshold: severityThresholdNormal,
231
- degradedThreshold: severityThresholdDegraded,
232
- dispatchSample: createDispatchSample(_analytics.ACTION.INPUT_PERF_SAMPLING_RENDERED, _view),
233
- dispatchAverage: createDispatchAverage(_analytics.ACTION.INPUT_PERF_SAMPLING_RENDERED_AVG, _view)
234
- });
235
- }
172
+ objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu4 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu4 === void 0 || (_contextIdentifierPlu4 = _contextIdentifierPlu4.contextIdentifierProvider) === null || _contextIdentifierPlu4 === void 0 ? void 0 : _contextIdentifierPlu4.objectId
173
+ }),
174
+ eventType: _analytics.EVENT_TYPE.OPERATIONAL
175
+ });
176
+ }
177
+ });
236
178
  var observer;
237
179
  try {
238
180
  observer = new PerformanceObserver(function (list) {
@@ -240,7 +182,9 @@ var _default = exports.default = function _default(contextIdentifierPlugin) {
240
182
  for (var i = 0; i < perfEntries.length; i++) {
241
183
  var duration = perfEntries[i].duration;
242
184
  if (duration > freezeThreshold) {
243
- dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, _view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackSeverity ? (0, _analytics2.getAnalyticsEventSeverity)(duration, browserFreezeTracking.severityNormalThreshold || NORMAL_SEVERITY_THRESHOLD, browserFreezeTracking.severityDegradedThreshold || DEGRADED_SEVERITY_THRESHOLD) : undefined);
185
+ dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, _view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined, (0, _analytics2.getAnalyticsEventSeverity)(duration,
186
+ //TODO: get right values here
187
+ severityThresholdNormal, severityThresholdDegraded));
244
188
  }
245
189
  }
246
190
  });
@@ -0,0 +1,80 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.getKeyboardHeight = exports.default = void 0;
7
+ var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
8
+ var _pluginKey = require("./plugin-key");
9
+ var GUTTER_SIZE_IN_PX = 120;
10
+ var GUTTER_SELECTOR_NAME = 'editor-scroll-gutter';
11
+ var getKeyboardHeight = exports.getKeyboardHeight = function getKeyboardHeight(state) {
12
+ if (state) {
13
+ var scrollGutterPluginState = (0, _pluginKey.getScrollGutterPluginState)(state);
14
+ return scrollGutterPluginState ? scrollGutterPluginState.keyboardHeight : undefined;
15
+ }
16
+ };
17
+
18
+ /**
19
+ * Create a gutter element that can be added or removed from the DOM.
20
+ */
21
+ function createGutter(gutterSize, parent) {
22
+ var gutter = document.createElement('div');
23
+ gutter.style.paddingBottom = "".concat(gutterSize, "px");
24
+ gutter.id = GUTTER_SELECTOR_NAME;
25
+ if (parent) {
26
+ parent.appendChild(gutter);
27
+ }
28
+ return function () {
29
+ return parent === null || parent === void 0 ? void 0 : parent.removeChild(gutter);
30
+ };
31
+ }
32
+ var _default = exports.default = function _default() {
33
+ var pluginOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
34
+ var getScrollElement = pluginOptions.getScrollElement,
35
+ _pluginOptions$gutter = pluginOptions.gutterSize,
36
+ gutterSize = _pluginOptions$gutter === void 0 ? GUTTER_SIZE_IN_PX : _pluginOptions$gutter;
37
+ if (!getScrollElement) {
38
+ return undefined;
39
+ }
40
+ return new _safePlugin.SafePlugin({
41
+ key: _pluginKey.scrollGutterPluginKey,
42
+ state: {
43
+ init: function init() {
44
+ return {};
45
+ },
46
+ apply: function apply(tr, pluginState) {
47
+ if (tr.getMeta(_pluginKey.scrollGutterPluginKey)) {
48
+ return tr.getMeta(_pluginKey.scrollGutterPluginKey);
49
+ }
50
+ return pluginState;
51
+ }
52
+ },
53
+ props: {
54
+ // Determines the distance (in pixels) between the cursor and the end of the visible viewport at which point,
55
+ // when scrolling the cursor into view, scrolling takes place.
56
+ // Defaults to 0: https://prosemirror.net/docs/ref/#view.EditorProps.scrollThreshold
57
+ scrollThreshold: gutterSize,
58
+ // Determines the extra space (in pixels) that is left above or below the cursor when it is scrolled into view.
59
+ // Defaults to 5: https://prosemirror.net/docs/ref/#view.EditorProps.scrollMargin
60
+ scrollMargin: gutterSize
61
+ },
62
+ view: function view(_view) {
63
+ var _editorElement;
64
+ // Store references to avoid lookups on successive checks.
65
+ var scrollElement = getScrollElement(_view);
66
+ var editorElement = _view.dom instanceof HTMLElement ? _view.dom : null;
67
+ var editorParentElement = (_editorElement = editorElement) === null || _editorElement === void 0 ? void 0 : _editorElement.parentElement;
68
+ var cleanup = function cleanup() {};
69
+ if (editorParentElement && scrollElement) {
70
+ cleanup = createGutter(gutterSize, editorParentElement);
71
+ }
72
+ return {
73
+ destroy: function destroy() {
74
+ cleanup();
75
+ editorParentElement = editorElement = null;
76
+ }
77
+ };
78
+ }
79
+ });
80
+ };
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.inputTracking = void 0;
7
+ var inputTracking = exports.inputTracking = {
8
+ enabled: true,
9
+ samplingRate: 100,
10
+ countNodes: true,
11
+ trackSeverity: true,
12
+ trackRenderingTime: false,
13
+ trackSingleKeypress: false,
14
+ // TODO: change this based on appearance due to SLOs - need to make ticket for both
15
+ severityDegradedThreshold: 273,
16
+ severityNormalThreshold: 143
17
+ };
@@ -2,6 +2,7 @@ import { doc, paragraph, text } from '@atlaskit/adf-schema';
2
2
  import { keymap } from '@atlaskit/editor-common/keymaps';
3
3
  import { baseKeymap } from '@atlaskit/editor-prosemirror/commands';
4
4
  import { history } from '@atlaskit/editor-prosemirror/history';
5
+ import { fg } from '@atlaskit/platform-feature-flags';
5
6
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
6
7
  import { setKeyboardHeight } from './commands';
7
8
  import disableSpellcheckingPlugin from './pm-plugins/disable-spell-checking';
@@ -11,6 +12,8 @@ import inlineCursorTargetPlugin from './pm-plugins/inline-cursor-target';
11
12
  import { createLazyNodeViewDecorationPlugin } from './pm-plugins/lazy-node-view-decoration';
12
13
  import newlinePreserveMarksPlugin from './pm-plugins/newline-preserve-marks';
13
14
  import scrollGutter, { getKeyboardHeight } from './pm-plugins/scroll-gutter';
15
+ import scrollGutterNext from './pm-plugins/scroll-gutter/next';
16
+ import { inputTracking } from './utils/inputTrackingConfig';
14
17
  const basePlugin = ({
15
18
  config: options,
16
19
  api
@@ -66,8 +69,7 @@ const basePlugin = ({
66
69
  plugin: ({
67
70
  dispatchAnalyticsEvent
68
71
  }) => {
69
- var _options$inputTrackin;
70
- return options !== null && options !== void 0 && (_options$inputTrackin = options.inputTracking) !== null && _options$inputTrackin !== void 0 && _options$inputTrackin.enabled || options !== null && options !== void 0 && options.ufo ? frozenEditor(api === null || api === void 0 ? void 0 : api.contextIdentifier)(dispatchAnalyticsEvent, options.inputTracking, options.browserFreezeTracking, options.ufo) : undefined;
72
+ return frozenEditor(api === null || api === void 0 ? void 0 : api.contextIdentifier)(dispatchAnalyticsEvent, inputTracking, undefined);
71
73
  }
72
74
  }, {
73
75
  name: 'history',
@@ -83,10 +85,17 @@ const basePlugin = ({
83
85
  })
84
86
  });
85
87
  if (options && options.allowScrollGutter) {
86
- plugins.push({
87
- name: 'scrollGutterPlugin',
88
- plugin: () => scrollGutter(options.allowScrollGutter)
89
- });
88
+ if (fg('platform_editor_improved_scroll_gutter')) {
89
+ plugins.push({
90
+ name: 'scrollGutterPlugin',
91
+ plugin: () => scrollGutterNext(options.allowScrollGutter)
92
+ });
93
+ } else {
94
+ plugins.push({
95
+ name: 'scrollGutterPlugin',
96
+ plugin: () => scrollGutter(options.allowScrollGutter)
97
+ });
98
+ }
90
99
  }
91
100
  plugins.push({
92
101
  name: 'disableSpellcheckingPlugin',
@@ -2,7 +2,6 @@ import { ACTION, ACTION_SUBJECT, BROWSER_FREEZE_INTERACTION_TYPE, EVENT_TYPE } f
2
2
  import { countNodes } from '@atlaskit/editor-common/count-nodes';
3
3
  import { isPerformanceAPIAvailable, isPerformanceObserverAvailable } from '@atlaskit/editor-common/is-performance-api-available';
4
4
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
5
- import { EditorExperience, ExperienceStore } from '@atlaskit/editor-common/ufo';
6
5
  import { getAnalyticsEventSeverity } from '@atlaskit/editor-common/utils/analytics';
7
6
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
8
7
  import { setInteractionType } from '../utils/frozen-editor';
@@ -36,17 +35,18 @@ const dispatchLongTaskEvent = contextIdentifierPlugin => (dispatchAnalyticsEvent
36
35
  eventType: EVENT_TYPE.OPERATIONAL
37
36
  });
38
37
  };
39
- export default (contextIdentifierPlugin => (dispatchAnalyticsEvent, inputTracking, browserFreezeTracking, ufo) => {
38
+ export default (contextIdentifierPlugin => (dispatchAnalyticsEvent, inputTracking, browserFreezeTracking) => {
40
39
  let interactionType;
41
40
  let inputLatencyTracker = null;
42
- let inputLatencySingleKeyTracker = null;
43
- let inputLatencyRenderedTracker = null;
44
41
  if (browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType) {
45
42
  interactionType = setInteractionType(BROWSER_FREEZE_INTERACTION_TYPE.LOADING);
46
43
  }
47
44
  const samplingRate = inputTracking && typeof inputTracking.samplingRate === 'number' ? inputTracking.samplingRate : DEFAULT_KEYSTROKE_SAMPLING_LIMIT;
48
- const slowThreshold = inputTracking && typeof inputTracking.slowThreshold === 'number' ? inputTracking.slowThreshold : DEFAULT_SLOW_THRESHOLD;
49
- const freezeThreshold = inputTracking && typeof inputTracking.freezeThreshold === 'number' ? inputTracking.freezeThreshold : DEFAULT_FREEZE_THRESHOLD;
45
+
46
+ //TODO: get right values here based on appearance
47
+ const slowThreshold = DEFAULT_SLOW_THRESHOLD;
48
+ //TODO: get right values here based on appearance
49
+ const freezeThreshold = DEFAULT_FREEZE_THRESHOLD;
50
50
  const allowCountNodes = inputTracking && inputTracking.countNodes;
51
51
  let prevNodeCountState = null;
52
52
  let prevNodeCount = {};
@@ -124,19 +124,6 @@ export default (contextIdentifierPlugin => (dispatchAnalyticsEvent, inputTrackin
124
124
  // Also this is called before browser rendering so it doesn't count it.
125
125
  requestAnimationFrame(end);
126
126
  }
127
- if (inputLatencySingleKeyTracker) {
128
- const end = inputLatencySingleKeyTracker.start();
129
-
130
- // This is executed before next handleTextInput when multiple keypress events are in one animation frame
131
- // so it tracks individual keypress processing time
132
- Promise.resolve().then(end);
133
- }
134
- if (inputLatencyRenderedTracker) {
135
- const end = inputLatencyRenderedTracker.start();
136
-
137
- // This is called at the next event loop so it counts browser rendering time.
138
- setTimeout(end);
139
- }
140
127
  return false;
141
128
  },
142
129
  handleDOMEvents: browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? {
@@ -154,80 +141,32 @@ export default (contextIdentifierPlugin => (dispatchAnalyticsEvent, inputTrackin
154
141
  if (!isPerformanceObserverAvailable()) {
155
142
  return {};
156
143
  }
157
- const experienceStore = ufo ? ExperienceStore.getInstance(view) : undefined;
158
- if (inputTracking !== null && inputTracking !== void 0 && inputTracking.enabled) {
159
- inputLatencyTracker = new InputLatencyTracker({
160
- samplingRate,
161
- slowThreshold,
162
- normalThreshold: severityThresholdNormal,
163
- degradedThreshold: severityThresholdDegraded,
164
- onSampleStart: () => {
165
- experienceStore === null || experienceStore === void 0 ? void 0 : experienceStore.start(EditorExperience.typing);
166
- },
167
- onSampleEnd: (time, {
168
- isSlow,
169
- severity
170
- }) => {
171
- var _contextIdentifierPlu7, _contextIdentifierPlu8;
172
- const {
173
- state
174
- } = view;
175
- const nodesCount = getNodeCount(state);
176
- if (isSlow) {
177
- experienceStore === null || experienceStore === void 0 ? void 0 : experienceStore.addMetadata(EditorExperience.typing, {
178
- slowInput: true
179
- });
180
- }
181
- experienceStore === null || experienceStore === void 0 ? void 0 : experienceStore.success(EditorExperience.typing, {
144
+ inputLatencyTracker = new InputLatencyTracker({
145
+ samplingRate,
146
+ slowThreshold,
147
+ normalThreshold: severityThresholdNormal,
148
+ degradedThreshold: severityThresholdDegraded,
149
+ dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING, view),
150
+ dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_AVG, view),
151
+ onSlowInput: time => {
152
+ var _contextIdentifierPlu7, _contextIdentifierPlu8;
153
+ const {
154
+ state
155
+ } = view;
156
+ const nodesCount = getNodeCount(state);
157
+ dispatchAnalyticsEvent({
158
+ action: ACTION.SLOW_INPUT,
159
+ actionSubject: ACTION_SUBJECT.EDITOR,
160
+ attributes: {
161
+ time,
182
162
  nodeSize: state.doc.nodeSize,
183
163
  ...nodesCount,
184
- objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 ? void 0 : (_contextIdentifierPlu7 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu7 === void 0 ? void 0 : (_contextIdentifierPlu8 = _contextIdentifierPlu7.contextIdentifierProvider) === null || _contextIdentifierPlu8 === void 0 ? void 0 : _contextIdentifierPlu8.objectId,
185
- time,
186
- severity: shouldTrackSeverity ? severity : undefined
187
- });
188
- },
189
- dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING, view),
190
- dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_AVG, view),
191
- onSlowInput: time => {
192
- var _contextIdentifierPlu9, _contextIdentifierPlu10;
193
- const {
194
- state
195
- } = view;
196
- const nodesCount = getNodeCount(state);
197
- dispatchAnalyticsEvent({
198
- action: ACTION.SLOW_INPUT,
199
- actionSubject: ACTION_SUBJECT.EDITOR,
200
- attributes: {
201
- time,
202
- nodeSize: state.doc.nodeSize,
203
- ...nodesCount,
204
- objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 ? void 0 : (_contextIdentifierPlu9 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu9 === void 0 ? void 0 : (_contextIdentifierPlu10 = _contextIdentifierPlu9.contextIdentifierProvider) === null || _contextIdentifierPlu10 === void 0 ? void 0 : _contextIdentifierPlu10.objectId
205
- },
206
- eventType: EVENT_TYPE.OPERATIONAL
207
- });
208
- }
209
- });
210
- }
211
- if (inputTracking !== null && inputTracking !== void 0 && inputTracking.trackSingleKeypress) {
212
- inputLatencySingleKeyTracker = new InputLatencyTracker({
213
- samplingRate,
214
- slowThreshold,
215
- normalThreshold: severityThresholdNormal,
216
- degradedThreshold: severityThresholdDegraded,
217
- dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING_SINGLE_KEYPRESS, view),
218
- dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_SINGLE_KEYPRESS_AVG, view)
219
- });
220
- }
221
- if (inputTracking !== null && inputTracking !== void 0 && inputTracking.trackRenderingTime) {
222
- inputLatencyRenderedTracker = new InputLatencyTracker({
223
- samplingRate,
224
- slowThreshold,
225
- normalThreshold: severityThresholdNormal,
226
- degradedThreshold: severityThresholdDegraded,
227
- dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING_RENDERED, view),
228
- dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_RENDERED_AVG, view)
229
- });
230
- }
164
+ objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 ? void 0 : (_contextIdentifierPlu7 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu7 === void 0 ? void 0 : (_contextIdentifierPlu8 = _contextIdentifierPlu7.contextIdentifierProvider) === null || _contextIdentifierPlu8 === void 0 ? void 0 : _contextIdentifierPlu8.objectId
165
+ },
166
+ eventType: EVENT_TYPE.OPERATIONAL
167
+ });
168
+ }
169
+ });
231
170
  let observer;
232
171
  try {
233
172
  observer = new PerformanceObserver(list => {
@@ -237,7 +176,9 @@ export default (contextIdentifierPlugin => (dispatchAnalyticsEvent, inputTrackin
237
176
  duration
238
177
  } = perfEntries[i];
239
178
  if (duration > freezeThreshold) {
240
- dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackSeverity ? getAnalyticsEventSeverity(duration, browserFreezeTracking.severityNormalThreshold || NORMAL_SEVERITY_THRESHOLD, browserFreezeTracking.severityDegradedThreshold || DEGRADED_SEVERITY_THRESHOLD) : undefined);
179
+ dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined, getAnalyticsEventSeverity(duration,
180
+ //TODO: get right values here
181
+ severityThresholdNormal, severityThresholdDegraded));
241
182
  }
242
183
  }
243
184
  });
@@ -0,0 +1,70 @@
1
+ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
+ import { getScrollGutterPluginState, scrollGutterPluginKey } from './plugin-key';
3
+ const GUTTER_SIZE_IN_PX = 120;
4
+ const GUTTER_SELECTOR_NAME = 'editor-scroll-gutter';
5
+ export const getKeyboardHeight = state => {
6
+ if (state) {
7
+ const scrollGutterPluginState = getScrollGutterPluginState(state);
8
+ return scrollGutterPluginState ? scrollGutterPluginState.keyboardHeight : undefined;
9
+ }
10
+ };
11
+
12
+ /**
13
+ * Create a gutter element that can be added or removed from the DOM.
14
+ */
15
+ function createGutter(gutterSize, parent) {
16
+ const gutter = document.createElement('div');
17
+ gutter.style.paddingBottom = `${gutterSize}px`;
18
+ gutter.id = GUTTER_SELECTOR_NAME;
19
+ if (parent) {
20
+ parent.appendChild(gutter);
21
+ }
22
+ return () => parent === null || parent === void 0 ? void 0 : parent.removeChild(gutter);
23
+ }
24
+ export default ((pluginOptions = {}) => {
25
+ const {
26
+ getScrollElement,
27
+ gutterSize = GUTTER_SIZE_IN_PX
28
+ } = pluginOptions;
29
+ if (!getScrollElement) {
30
+ return undefined;
31
+ }
32
+ return new SafePlugin({
33
+ key: scrollGutterPluginKey,
34
+ state: {
35
+ init: () => ({}),
36
+ apply: (tr, pluginState) => {
37
+ if (tr.getMeta(scrollGutterPluginKey)) {
38
+ return tr.getMeta(scrollGutterPluginKey);
39
+ }
40
+ return pluginState;
41
+ }
42
+ },
43
+ props: {
44
+ // Determines the distance (in pixels) between the cursor and the end of the visible viewport at which point,
45
+ // when scrolling the cursor into view, scrolling takes place.
46
+ // Defaults to 0: https://prosemirror.net/docs/ref/#view.EditorProps.scrollThreshold
47
+ scrollThreshold: gutterSize,
48
+ // Determines the extra space (in pixels) that is left above or below the cursor when it is scrolled into view.
49
+ // Defaults to 5: https://prosemirror.net/docs/ref/#view.EditorProps.scrollMargin
50
+ scrollMargin: gutterSize
51
+ },
52
+ view(view) {
53
+ var _editorElement;
54
+ // Store references to avoid lookups on successive checks.
55
+ const scrollElement = getScrollElement(view);
56
+ let editorElement = view.dom instanceof HTMLElement ? view.dom : null;
57
+ let editorParentElement = (_editorElement = editorElement) === null || _editorElement === void 0 ? void 0 : _editorElement.parentElement;
58
+ let cleanup = () => {};
59
+ if (editorParentElement && scrollElement) {
60
+ cleanup = createGutter(gutterSize, editorParentElement);
61
+ }
62
+ return {
63
+ destroy() {
64
+ cleanup();
65
+ editorParentElement = editorElement = null;
66
+ }
67
+ };
68
+ }
69
+ });
70
+ });
@@ -0,0 +1,11 @@
1
+ export const inputTracking = {
2
+ enabled: true,
3
+ samplingRate: 100,
4
+ countNodes: true,
5
+ trackSeverity: true,
6
+ trackRenderingTime: false,
7
+ trackSingleKeypress: false,
8
+ // TODO: change this based on appearance due to SLOs - need to make ticket for both
9
+ severityDegradedThreshold: 273,
10
+ severityNormalThreshold: 143
11
+ };
@@ -5,6 +5,7 @@ import { doc, paragraph, text } from '@atlaskit/adf-schema';
5
5
  import { keymap } from '@atlaskit/editor-common/keymaps';
6
6
  import { baseKeymap } from '@atlaskit/editor-prosemirror/commands';
7
7
  import { history } from '@atlaskit/editor-prosemirror/history';
8
+ import { fg } from '@atlaskit/platform-feature-flags';
8
9
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
9
10
  import { setKeyboardHeight } from './commands';
10
11
  import disableSpellcheckingPlugin from './pm-plugins/disable-spell-checking';
@@ -14,6 +15,8 @@ import inlineCursorTargetPlugin from './pm-plugins/inline-cursor-target';
14
15
  import { createLazyNodeViewDecorationPlugin } from './pm-plugins/lazy-node-view-decoration';
15
16
  import newlinePreserveMarksPlugin from './pm-plugins/newline-preserve-marks';
16
17
  import scrollGutter, { getKeyboardHeight } from './pm-plugins/scroll-gutter';
18
+ import scrollGutterNext from './pm-plugins/scroll-gutter/next';
19
+ import { inputTracking } from './utils/inputTrackingConfig';
17
20
  var basePlugin = function basePlugin(_ref) {
18
21
  var _api$featureFlags;
19
22
  var options = _ref.config,
@@ -71,9 +74,8 @@ var basePlugin = function basePlugin(_ref) {
71
74
  }, {
72
75
  name: 'frozenEditor',
73
76
  plugin: function plugin(_ref3) {
74
- var _options$inputTrackin;
75
77
  var dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent;
76
- return options !== null && options !== void 0 && (_options$inputTrackin = options.inputTracking) !== null && _options$inputTrackin !== void 0 && _options$inputTrackin.enabled || options !== null && options !== void 0 && options.ufo ? frozenEditor(api === null || api === void 0 ? void 0 : api.contextIdentifier)(dispatchAnalyticsEvent, options.inputTracking, options.browserFreezeTracking, options.ufo) : undefined;
78
+ return frozenEditor(api === null || api === void 0 ? void 0 : api.contextIdentifier)(dispatchAnalyticsEvent, inputTracking, undefined);
77
79
  }
78
80
  }, {
79
81
  name: 'history',
@@ -96,12 +98,21 @@ var basePlugin = function basePlugin(_ref) {
96
98
  }
97
99
  });
98
100
  if (options && options.allowScrollGutter) {
99
- plugins.push({
100
- name: 'scrollGutterPlugin',
101
- plugin: function plugin() {
102
- return scrollGutter(options.allowScrollGutter);
103
- }
104
- });
101
+ if (fg('platform_editor_improved_scroll_gutter')) {
102
+ plugins.push({
103
+ name: 'scrollGutterPlugin',
104
+ plugin: function plugin() {
105
+ return scrollGutterNext(options.allowScrollGutter);
106
+ }
107
+ });
108
+ } else {
109
+ plugins.push({
110
+ name: 'scrollGutterPlugin',
111
+ plugin: function plugin() {
112
+ return scrollGutter(options.allowScrollGutter);
113
+ }
114
+ });
115
+ }
105
116
  }
106
117
  plugins.push({
107
118
  name: 'disableSpellcheckingPlugin',
@@ -5,7 +5,6 @@ import { ACTION, ACTION_SUBJECT, BROWSER_FREEZE_INTERACTION_TYPE, EVENT_TYPE } f
5
5
  import { countNodes } from '@atlaskit/editor-common/count-nodes';
6
6
  import { isPerformanceAPIAvailable, isPerformanceObserverAvailable } from '@atlaskit/editor-common/is-performance-api-available';
7
7
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
8
- import { EditorExperience, ExperienceStore } from '@atlaskit/editor-common/ufo';
9
8
  import { getAnalyticsEventSeverity } from '@atlaskit/editor-common/utils/analytics';
10
9
  import { PluginKey } from '@atlaskit/editor-prosemirror/state';
11
10
  import { setInteractionType } from '../utils/frozen-editor';
@@ -40,17 +39,18 @@ var dispatchLongTaskEvent = function dispatchLongTaskEvent(contextIdentifierPlug
40
39
  };
41
40
  };
42
41
  export default (function (contextIdentifierPlugin) {
43
- return function (dispatchAnalyticsEvent, inputTracking, browserFreezeTracking, ufo) {
42
+ return function (dispatchAnalyticsEvent, inputTracking, browserFreezeTracking) {
44
43
  var interactionType;
45
44
  var inputLatencyTracker = null;
46
- var inputLatencySingleKeyTracker = null;
47
- var inputLatencyRenderedTracker = null;
48
45
  if (browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType) {
49
46
  interactionType = setInteractionType(BROWSER_FREEZE_INTERACTION_TYPE.LOADING);
50
47
  }
51
48
  var samplingRate = inputTracking && typeof inputTracking.samplingRate === 'number' ? inputTracking.samplingRate : DEFAULT_KEYSTROKE_SAMPLING_LIMIT;
52
- var slowThreshold = inputTracking && typeof inputTracking.slowThreshold === 'number' ? inputTracking.slowThreshold : DEFAULT_SLOW_THRESHOLD;
53
- var freezeThreshold = inputTracking && typeof inputTracking.freezeThreshold === 'number' ? inputTracking.freezeThreshold : DEFAULT_FREEZE_THRESHOLD;
49
+
50
+ //TODO: get right values here based on appearance
51
+ var slowThreshold = DEFAULT_SLOW_THRESHOLD;
52
+ //TODO: get right values here based on appearance
53
+ var freezeThreshold = DEFAULT_FREEZE_THRESHOLD;
54
54
  var allowCountNodes = inputTracking && inputTracking.countNodes;
55
55
  var prevNodeCountState = null;
56
56
  var prevNodeCount = {};
@@ -127,19 +127,6 @@ export default (function (contextIdentifierPlugin) {
127
127
  // Also this is called before browser rendering so it doesn't count it.
128
128
  requestAnimationFrame(end);
129
129
  }
130
- if (inputLatencySingleKeyTracker) {
131
- var _end = inputLatencySingleKeyTracker.start();
132
-
133
- // This is executed before next handleTextInput when multiple keypress events are in one animation frame
134
- // so it tracks individual keypress processing time
135
- Promise.resolve().then(_end);
136
- }
137
- if (inputLatencyRenderedTracker) {
138
- var _end2 = inputLatencyRenderedTracker.start();
139
-
140
- // This is called at the next event loop so it counts browser rendering time.
141
- setTimeout(_end2);
142
- }
143
130
  return false;
144
131
  },
145
132
  handleDOMEvents: browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? {
@@ -157,75 +144,30 @@ export default (function (contextIdentifierPlugin) {
157
144
  if (!isPerformanceObserverAvailable()) {
158
145
  return {};
159
146
  }
160
- var experienceStore = ufo ? ExperienceStore.getInstance(_view) : undefined;
161
- if (inputTracking !== null && inputTracking !== void 0 && inputTracking.enabled) {
162
- inputLatencyTracker = new InputLatencyTracker({
163
- samplingRate: samplingRate,
164
- slowThreshold: slowThreshold,
165
- normalThreshold: severityThresholdNormal,
166
- degradedThreshold: severityThresholdDegraded,
167
- onSampleStart: function onSampleStart() {
168
- experienceStore === null || experienceStore === void 0 || experienceStore.start(EditorExperience.typing);
169
- },
170
- onSampleEnd: function onSampleEnd(time, _ref2) {
171
- var _contextIdentifierPlu4;
172
- var isSlow = _ref2.isSlow,
173
- severity = _ref2.severity;
174
- var state = _view.state;
175
- var nodesCount = getNodeCount(state);
176
- if (isSlow) {
177
- experienceStore === null || experienceStore === void 0 || experienceStore.addMetadata(EditorExperience.typing, {
178
- slowInput: true
179
- });
180
- }
181
- experienceStore === null || experienceStore === void 0 || experienceStore.success(EditorExperience.typing, _objectSpread(_objectSpread({
147
+ inputLatencyTracker = new InputLatencyTracker({
148
+ samplingRate: samplingRate,
149
+ slowThreshold: slowThreshold,
150
+ normalThreshold: severityThresholdNormal,
151
+ degradedThreshold: severityThresholdDegraded,
152
+ dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING, _view),
153
+ dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_AVG, _view),
154
+ onSlowInput: function onSlowInput(time) {
155
+ var _contextIdentifierPlu4;
156
+ var state = _view.state;
157
+ var nodesCount = getNodeCount(state);
158
+ dispatchAnalyticsEvent({
159
+ action: ACTION.SLOW_INPUT,
160
+ actionSubject: ACTION_SUBJECT.EDITOR,
161
+ attributes: _objectSpread(_objectSpread({
162
+ time: time,
182
163
  nodeSize: state.doc.nodeSize
183
164
  }, nodesCount), {}, {
184
- objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu4 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu4 === void 0 || (_contextIdentifierPlu4 = _contextIdentifierPlu4.contextIdentifierProvider) === null || _contextIdentifierPlu4 === void 0 ? void 0 : _contextIdentifierPlu4.objectId,
185
- time: time,
186
- severity: shouldTrackSeverity ? severity : undefined
187
- }));
188
- },
189
- dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING, _view),
190
- dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_AVG, _view),
191
- onSlowInput: function onSlowInput(time) {
192
- var _contextIdentifierPlu5;
193
- var state = _view.state;
194
- var nodesCount = getNodeCount(state);
195
- dispatchAnalyticsEvent({
196
- action: ACTION.SLOW_INPUT,
197
- actionSubject: ACTION_SUBJECT.EDITOR,
198
- attributes: _objectSpread(_objectSpread({
199
- time: time,
200
- nodeSize: state.doc.nodeSize
201
- }, nodesCount), {}, {
202
- objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu5 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu5 === void 0 || (_contextIdentifierPlu5 = _contextIdentifierPlu5.contextIdentifierProvider) === null || _contextIdentifierPlu5 === void 0 ? void 0 : _contextIdentifierPlu5.objectId
203
- }),
204
- eventType: EVENT_TYPE.OPERATIONAL
205
- });
206
- }
207
- });
208
- }
209
- if (inputTracking !== null && inputTracking !== void 0 && inputTracking.trackSingleKeypress) {
210
- inputLatencySingleKeyTracker = new InputLatencyTracker({
211
- samplingRate: samplingRate,
212
- slowThreshold: slowThreshold,
213
- normalThreshold: severityThresholdNormal,
214
- degradedThreshold: severityThresholdDegraded,
215
- dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING_SINGLE_KEYPRESS, _view),
216
- dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_SINGLE_KEYPRESS_AVG, _view)
217
- });
218
- }
219
- if (inputTracking !== null && inputTracking !== void 0 && inputTracking.trackRenderingTime) {
220
- inputLatencyRenderedTracker = new InputLatencyTracker({
221
- samplingRate: samplingRate,
222
- slowThreshold: slowThreshold,
223
- normalThreshold: severityThresholdNormal,
224
- degradedThreshold: severityThresholdDegraded,
225
- dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING_RENDERED, _view),
226
- dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_RENDERED_AVG, _view)
227
- });
228
- }
165
+ objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu4 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu4 === void 0 || (_contextIdentifierPlu4 = _contextIdentifierPlu4.contextIdentifierProvider) === null || _contextIdentifierPlu4 === void 0 ? void 0 : _contextIdentifierPlu4.objectId
166
+ }),
167
+ eventType: EVENT_TYPE.OPERATIONAL
168
+ });
169
+ }
170
+ });
229
171
  var observer;
230
172
  try {
231
173
  observer = new PerformanceObserver(function (list) {
@@ -233,7 +175,9 @@ export default (function (contextIdentifierPlugin) {
233
175
  for (var i = 0; i < perfEntries.length; i++) {
234
176
  var duration = perfEntries[i].duration;
235
177
  if (duration > freezeThreshold) {
236
- dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, _view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackSeverity ? getAnalyticsEventSeverity(duration, browserFreezeTracking.severityNormalThreshold || NORMAL_SEVERITY_THRESHOLD, browserFreezeTracking.severityDegradedThreshold || DEGRADED_SEVERITY_THRESHOLD) : undefined);
178
+ dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, _view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined, getAnalyticsEventSeverity(duration,
179
+ //TODO: get right values here
180
+ severityThresholdNormal, severityThresholdDegraded));
237
181
  }
238
182
  }
239
183
  });
@@ -0,0 +1,74 @@
1
+ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
+ import { getScrollGutterPluginState, scrollGutterPluginKey } from './plugin-key';
3
+ var GUTTER_SIZE_IN_PX = 120;
4
+ var GUTTER_SELECTOR_NAME = 'editor-scroll-gutter';
5
+ export var getKeyboardHeight = function getKeyboardHeight(state) {
6
+ if (state) {
7
+ var scrollGutterPluginState = getScrollGutterPluginState(state);
8
+ return scrollGutterPluginState ? scrollGutterPluginState.keyboardHeight : undefined;
9
+ }
10
+ };
11
+
12
+ /**
13
+ * Create a gutter element that can be added or removed from the DOM.
14
+ */
15
+ function createGutter(gutterSize, parent) {
16
+ var gutter = document.createElement('div');
17
+ gutter.style.paddingBottom = "".concat(gutterSize, "px");
18
+ gutter.id = GUTTER_SELECTOR_NAME;
19
+ if (parent) {
20
+ parent.appendChild(gutter);
21
+ }
22
+ return function () {
23
+ return parent === null || parent === void 0 ? void 0 : parent.removeChild(gutter);
24
+ };
25
+ }
26
+ export default (function () {
27
+ var pluginOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
28
+ var getScrollElement = pluginOptions.getScrollElement,
29
+ _pluginOptions$gutter = pluginOptions.gutterSize,
30
+ gutterSize = _pluginOptions$gutter === void 0 ? GUTTER_SIZE_IN_PX : _pluginOptions$gutter;
31
+ if (!getScrollElement) {
32
+ return undefined;
33
+ }
34
+ return new SafePlugin({
35
+ key: scrollGutterPluginKey,
36
+ state: {
37
+ init: function init() {
38
+ return {};
39
+ },
40
+ apply: function apply(tr, pluginState) {
41
+ if (tr.getMeta(scrollGutterPluginKey)) {
42
+ return tr.getMeta(scrollGutterPluginKey);
43
+ }
44
+ return pluginState;
45
+ }
46
+ },
47
+ props: {
48
+ // Determines the distance (in pixels) between the cursor and the end of the visible viewport at which point,
49
+ // when scrolling the cursor into view, scrolling takes place.
50
+ // Defaults to 0: https://prosemirror.net/docs/ref/#view.EditorProps.scrollThreshold
51
+ scrollThreshold: gutterSize,
52
+ // Determines the extra space (in pixels) that is left above or below the cursor when it is scrolled into view.
53
+ // Defaults to 5: https://prosemirror.net/docs/ref/#view.EditorProps.scrollMargin
54
+ scrollMargin: gutterSize
55
+ },
56
+ view: function view(_view) {
57
+ var _editorElement;
58
+ // Store references to avoid lookups on successive checks.
59
+ var scrollElement = getScrollElement(_view);
60
+ var editorElement = _view.dom instanceof HTMLElement ? _view.dom : null;
61
+ var editorParentElement = (_editorElement = editorElement) === null || _editorElement === void 0 ? void 0 : _editorElement.parentElement;
62
+ var cleanup = function cleanup() {};
63
+ if (editorParentElement && scrollElement) {
64
+ cleanup = createGutter(gutterSize, editorParentElement);
65
+ }
66
+ return {
67
+ destroy: function destroy() {
68
+ cleanup();
69
+ editorParentElement = editorElement = null;
70
+ }
71
+ };
72
+ }
73
+ });
74
+ });
@@ -0,0 +1,11 @@
1
+ export var inputTracking = {
2
+ enabled: true,
3
+ samplingRate: 100,
4
+ countNodes: true,
5
+ trackSeverity: true,
6
+ trackRenderingTime: false,
7
+ trackSingleKeypress: false,
8
+ // TODO: change this based on appearance due to SLOs - need to make ticket for both
9
+ severityDegradedThreshold: 273,
10
+ severityNormalThreshold: 143
11
+ };
@@ -6,9 +6,14 @@ import type { ScrollGutterPluginOptions } from './pm-plugins/scroll-gutter';
6
6
  export interface BasePluginOptions {
7
7
  allowScrollGutter?: ScrollGutterPluginOptions;
8
8
  allowInlineCursorTarget?: boolean;
9
+ /**
10
+ * @deprecated do not use
11
+ */
9
12
  inputTracking?: InputTracking;
13
+ /**
14
+ * @deprecated do not use
15
+ */
10
16
  browserFreezeTracking?: BrowserFreezetracking;
11
- ufo?: boolean;
12
17
  }
13
18
  export type BasePluginState = {
14
19
  /** Current height of keyboard (+ custom toolbar) in iOS app */
@@ -9,5 +9,5 @@ export declare const NORMAL_SEVERITY_THRESHOLD = 2000;
9
9
  export declare const DEGRADED_SEVERITY_THRESHOLD = 3000;
10
10
  export declare const DEFAULT_TRACK_SEVERITY_THRESHOLD_NORMAL = 100;
11
11
  export declare const DEFAULT_TRACK_SEVERITY_THRESHOLD_DEGRADED = 500;
12
- declare const _default: (contextIdentifierPlugin: ExtractInjectionAPI<BasePlugin>['contextIdentifier'] | undefined) => (dispatchAnalyticsEvent: DispatchAnalyticsEvent, inputTracking?: InputTracking, browserFreezeTracking?: BrowserFreezetracking, ufo?: boolean) => SafePlugin<any>;
12
+ declare const _default: (contextIdentifierPlugin: ExtractInjectionAPI<BasePlugin>['contextIdentifier'] | undefined) => (dispatchAnalyticsEvent: DispatchAnalyticsEvent, inputTracking?: InputTracking, browserFreezeTracking?: BrowserFreezetracking) => SafePlugin<any>;
13
13
  export default _default;
@@ -0,0 +1,26 @@
1
+ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
+ import type { EditorState } from '@atlaskit/editor-prosemirror/state';
3
+ import type { EditorView } from '@atlaskit/editor-prosemirror/view';
4
+ export declare const getKeyboardHeight: (state?: EditorState) => number | undefined;
5
+ export type ScrollGutterPluginOptions = {
6
+ /** Element the page uses for scrolling */
7
+ getScrollElement?: (view: EditorView) => HTMLElement | null;
8
+ /**
9
+ * @deprecated
10
+ *
11
+ * Whether to allow custom functionality to scroll to gutter element in
12
+ * plugin's handleScrollToSelection function
13
+ * Default is true
14
+ */
15
+ allowCustomScrollHandler?: boolean;
16
+ /**
17
+ * @deprecated
18
+ *
19
+ * Persist scroll gutter when the mobile appearance is COMPACT
20
+ * Default is false
21
+ */
22
+ persistScrollGutter?: boolean;
23
+ gutterSize?: number;
24
+ };
25
+ declare const _default: (pluginOptions?: ScrollGutterPluginOptions) => SafePlugin<{}> | undefined;
26
+ export default _default;
@@ -0,0 +1,2 @@
1
+ import { type InputTracking } from '@atlaskit/editor-common/types';
2
+ export declare const inputTracking: InputTracking;
@@ -6,9 +6,14 @@ import type { ScrollGutterPluginOptions } from './pm-plugins/scroll-gutter';
6
6
  export interface BasePluginOptions {
7
7
  allowScrollGutter?: ScrollGutterPluginOptions;
8
8
  allowInlineCursorTarget?: boolean;
9
+ /**
10
+ * @deprecated do not use
11
+ */
9
12
  inputTracking?: InputTracking;
13
+ /**
14
+ * @deprecated do not use
15
+ */
10
16
  browserFreezeTracking?: BrowserFreezetracking;
11
- ufo?: boolean;
12
17
  }
13
18
  export type BasePluginState = {
14
19
  /** Current height of keyboard (+ custom toolbar) in iOS app */
@@ -9,5 +9,5 @@ export declare const NORMAL_SEVERITY_THRESHOLD = 2000;
9
9
  export declare const DEGRADED_SEVERITY_THRESHOLD = 3000;
10
10
  export declare const DEFAULT_TRACK_SEVERITY_THRESHOLD_NORMAL = 100;
11
11
  export declare const DEFAULT_TRACK_SEVERITY_THRESHOLD_DEGRADED = 500;
12
- declare const _default: (contextIdentifierPlugin: ExtractInjectionAPI<BasePlugin>['contextIdentifier'] | undefined) => (dispatchAnalyticsEvent: DispatchAnalyticsEvent, inputTracking?: InputTracking, browserFreezeTracking?: BrowserFreezetracking, ufo?: boolean) => SafePlugin<any>;
12
+ declare const _default: (contextIdentifierPlugin: ExtractInjectionAPI<BasePlugin>['contextIdentifier'] | undefined) => (dispatchAnalyticsEvent: DispatchAnalyticsEvent, inputTracking?: InputTracking, browserFreezeTracking?: BrowserFreezetracking) => SafePlugin<any>;
13
13
  export default _default;
@@ -0,0 +1,26 @@
1
+ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
+ import type { EditorState } from '@atlaskit/editor-prosemirror/state';
3
+ import type { EditorView } from '@atlaskit/editor-prosemirror/view';
4
+ export declare const getKeyboardHeight: (state?: EditorState) => number | undefined;
5
+ export type ScrollGutterPluginOptions = {
6
+ /** Element the page uses for scrolling */
7
+ getScrollElement?: (view: EditorView) => HTMLElement | null;
8
+ /**
9
+ * @deprecated
10
+ *
11
+ * Whether to allow custom functionality to scroll to gutter element in
12
+ * plugin's handleScrollToSelection function
13
+ * Default is true
14
+ */
15
+ allowCustomScrollHandler?: boolean;
16
+ /**
17
+ * @deprecated
18
+ *
19
+ * Persist scroll gutter when the mobile appearance is COMPACT
20
+ * Default is false
21
+ */
22
+ persistScrollGutter?: boolean;
23
+ gutterSize?: number;
24
+ };
25
+ declare const _default: (pluginOptions?: ScrollGutterPluginOptions) => SafePlugin<{}> | undefined;
26
+ export default _default;
@@ -0,0 +1,2 @@
1
+ import { type InputTracking } from '@atlaskit/editor-common/types';
2
+ export declare const inputTracking: InputTracking;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-base",
3
- "version": "1.12.1",
3
+ "version": "2.0.0",
4
4
  "description": "Base plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -31,12 +31,13 @@
31
31
  ".": "./src/index.ts"
32
32
  },
33
33
  "dependencies": {
34
- "@atlaskit/adf-schema": "^42.0.2",
35
- "@atlaskit/editor-common": "^93.5.0",
34
+ "@atlaskit/adf-schema": "^42.3.1",
35
+ "@atlaskit/editor-common": "^94.0.0",
36
36
  "@atlaskit/editor-plugin-context-identifier": "^1.3.0",
37
37
  "@atlaskit/editor-plugin-feature-flags": "^1.2.0",
38
38
  "@atlaskit/editor-prosemirror": "6.0.0",
39
- "@atlaskit/tmp-editor-statsig": "^2.5.0",
39
+ "@atlaskit/platform-feature-flags": "^0.3.0",
40
+ "@atlaskit/tmp-editor-statsig": "^2.7.0",
40
41
  "@babel/runtime": "^7.0.0"
41
42
  },
42
43
  "techstack": {
@@ -73,5 +74,10 @@
73
74
  "no-unused-dependencies": {
74
75
  "checkDevDependencies": true
75
76
  }
77
+ },
78
+ "platform-feature-flags": {
79
+ "platform_editor_improved_scroll_gutter": {
80
+ "type": "boolean"
81
+ }
76
82
  }
77
83
  }