@atlaskit/editor-common 109.16.2 → 110.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 +16 -0
- package/dist/cjs/monitoring/error.js +1 -1
- package/dist/cjs/ui/DropList/index.js +1 -1
- package/dist/cjs/utils/commands.js +32 -0
- package/dist/es2019/monitoring/error.js +1 -1
- package/dist/es2019/ui/DropList/index.js +1 -1
- package/dist/es2019/utils/commands.js +34 -0
- package/dist/esm/monitoring/error.js +1 -1
- package/dist/esm/ui/DropList/index.js +1 -1
- package/dist/esm/utils/commands.js +32 -0
- package/package.json +6 -3
- package/dist/cjs/with-plugin-state/index.js +0 -350
- package/dist/cjs/with-plugin-state/types.js +0 -5
- package/dist/es2019/with-plugin-state/index.js +0 -295
- package/dist/es2019/with-plugin-state/types.js +0 -1
- package/dist/esm/with-plugin-state/index.js +0 -344
- package/dist/esm/with-plugin-state/types.js +0 -1
- package/dist/types/with-plugin-state/index.d.ts +0 -101
- package/dist/types/with-plugin-state/types.d.ts +0 -10
- package/dist/types-ts4.5/with-plugin-state/index.d.ts +0 -101
- package/dist/types-ts4.5/with-plugin-state/types.d.ts +0 -10
- package/with-plugin-state/package.json +0 -17
|
@@ -1,295 +0,0 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../analytics';
|
|
5
|
-
import { createDispatch } from '../event-dispatcher';
|
|
6
|
-
import { startMeasure, stopMeasure } from '../performance-measures';
|
|
7
|
-
import { EditorContext } from '../ui/EditorContext';
|
|
8
|
-
import { analyticsEventKey } from '../utils';
|
|
9
|
-
const DEFAULT_SAMPLING_RATE = 100;
|
|
10
|
-
const DEFAULT_SLOW_THRESHOLD = 4;
|
|
11
|
-
|
|
12
|
-
// That context was extract from the old WithPluginState from editor-core
|
|
13
|
-
// It was using some private types from
|
|
14
|
-
// - EditorAction: packages/editor/editor-core/src/actions/index.ts
|
|
15
|
-
// - EditorSharedConfig: packages/editor/editor-core/src/labs/next/internal/context/shared-config.tsx
|
|
16
|
-
|
|
17
|
-
/**
|
|
18
|
-
* @private
|
|
19
|
-
* @deprecated
|
|
20
|
-
*
|
|
21
|
-
* Using this component is deprecated. It should be replaced with `useSharedPluginState`.
|
|
22
|
-
* This requires having access to the injection API from the plugin itself.
|
|
23
|
-
*
|
|
24
|
-
* An example of the refactor with the new hook (using hyperlink as an example) is:
|
|
25
|
-
*
|
|
26
|
-
* Before:
|
|
27
|
-
* ```ts
|
|
28
|
-
* <WithPluginState
|
|
29
|
-
* editorView={editorView}
|
|
30
|
-
* plugins={{
|
|
31
|
-
* hyperlinkState: hyperlinkPluginKey
|
|
32
|
-
* }}
|
|
33
|
-
* render={({ hyperlinkState }) =>
|
|
34
|
-
* renderComponent({ hyperlinkState })
|
|
35
|
-
* }
|
|
36
|
-
* />
|
|
37
|
-
* ```
|
|
38
|
-
*
|
|
39
|
-
* After:
|
|
40
|
-
* ```ts
|
|
41
|
-
* import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
42
|
-
* import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
43
|
-
*
|
|
44
|
-
* function ComponentWithState(
|
|
45
|
-
* api: ExtractInjectionAPI<typeof hyperlinkPlugin> | undefined
|
|
46
|
-
* ) {
|
|
47
|
-
* const { hyperlinkState } = useSharedPluginState(api, ['hyperlink']);
|
|
48
|
-
* return renderComponent({ hyperlinkState })
|
|
49
|
-
* }
|
|
50
|
-
* ```
|
|
51
|
-
*
|
|
52
|
-
*/
|
|
53
|
-
// Ignored via go/ees005
|
|
54
|
-
// eslint-disable-next-line @repo/internal/react/no-class-components, react/prefer-stateless-function
|
|
55
|
-
class WithPluginState extends React.Component {
|
|
56
|
-
constructor(props) {
|
|
57
|
-
super(props);
|
|
58
|
-
}
|
|
59
|
-
render() {
|
|
60
|
-
// Ignored via go/ees005
|
|
61
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
62
|
-
return /*#__PURE__*/React.createElement(WithPluginStateEditionActionsWrapper, this.props);
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
function WithPluginStateEditionActionsWrapper(props) {
|
|
66
|
-
const context = React.useContext(EditorContext);
|
|
67
|
-
return /*#__PURE__*/React.createElement(WithPluginStateInner
|
|
68
|
-
// Ignored via go/ees005
|
|
69
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
70
|
-
, _extends({}, props, {
|
|
71
|
-
editorActions: context === null || context === void 0 ? void 0 : context.editorActions
|
|
72
|
-
}));
|
|
73
|
-
}
|
|
74
|
-
// Ignored via go/ees005
|
|
75
|
-
// eslint-disable-next-line @repo/internal/react/no-class-components
|
|
76
|
-
export class WithPluginStateInner extends React.Component {
|
|
77
|
-
constructor(props) {
|
|
78
|
-
super(props);
|
|
79
|
-
_defineProperty(this, "listeners", {});
|
|
80
|
-
_defineProperty(this, "debounce", null);
|
|
81
|
-
_defineProperty(this, "notAppliedState", {});
|
|
82
|
-
_defineProperty(this, "isSubscribed", false);
|
|
83
|
-
_defineProperty(this, "callsCount", 0);
|
|
84
|
-
_defineProperty(this, "handlePluginStateChange", (propName, pluginName, performanceOptions, skipEqualityCheck) =>
|
|
85
|
-
// Ignored via go/ees005
|
|
86
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
87
|
-
pluginState => {
|
|
88
|
-
// skipEqualityCheck is being used for old plugins since they are mutating plugin state instead of creating a new one
|
|
89
|
-
// Ignored via go/ees005
|
|
90
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
91
|
-
if (this.state[propName] !== pluginState || skipEqualityCheck) {
|
|
92
|
-
this.updateState({
|
|
93
|
-
stateSubset: {
|
|
94
|
-
[propName]: pluginState
|
|
95
|
-
},
|
|
96
|
-
pluginName,
|
|
97
|
-
performanceOptions
|
|
98
|
-
});
|
|
99
|
-
}
|
|
100
|
-
});
|
|
101
|
-
/**
|
|
102
|
-
* Debounces setState calls in order to reduce number of re-renders caused by several plugin state changes.
|
|
103
|
-
*/
|
|
104
|
-
_defineProperty(this, "updateState", ({
|
|
105
|
-
stateSubset,
|
|
106
|
-
pluginName,
|
|
107
|
-
performanceOptions
|
|
108
|
-
}) => {
|
|
109
|
-
this.notAppliedState = {
|
|
110
|
-
...this.notAppliedState,
|
|
111
|
-
...stateSubset
|
|
112
|
-
};
|
|
113
|
-
if (this.debounce) {
|
|
114
|
-
window.clearTimeout(this.debounce);
|
|
115
|
-
}
|
|
116
|
-
const debounce = this.props.debounce !== false ? fn => window.setTimeout(fn, 0) : fn => fn();
|
|
117
|
-
this.debounce = debounce(() => {
|
|
118
|
-
const measure = `🦉${pluginName}::WithPluginState`;
|
|
119
|
-
performanceOptions.trackingEnabled && startMeasure(measure);
|
|
120
|
-
this.setState(this.notAppliedState, () => {
|
|
121
|
-
performanceOptions.trackingEnabled && stopMeasure(measure, duration => {
|
|
122
|
-
// Each WithPluginState component will fire analytics event no more than once every `samplingLimit` times
|
|
123
|
-
if (++this.callsCount % performanceOptions.samplingRate === 0 && duration > performanceOptions.slowThreshold) {
|
|
124
|
-
this.dispatchAnalyticsEvent({
|
|
125
|
-
action: ACTION.WITH_PLUGIN_STATE_CALLED,
|
|
126
|
-
actionSubject: ACTION_SUBJECT.EDITOR,
|
|
127
|
-
eventType: EVENT_TYPE.OPERATIONAL,
|
|
128
|
-
attributes: {
|
|
129
|
-
plugin: pluginName,
|
|
130
|
-
duration
|
|
131
|
-
}
|
|
132
|
-
});
|
|
133
|
-
}
|
|
134
|
-
});
|
|
135
|
-
});
|
|
136
|
-
this.debounce = null;
|
|
137
|
-
this.notAppliedState = {};
|
|
138
|
-
});
|
|
139
|
-
});
|
|
140
|
-
_defineProperty(this, "dispatchAnalyticsEvent", payload => {
|
|
141
|
-
const eventDispatcher = this.getEventDispatcher();
|
|
142
|
-
if (eventDispatcher) {
|
|
143
|
-
const dispatch = createDispatch(eventDispatcher);
|
|
144
|
-
dispatch(analyticsEventKey, {
|
|
145
|
-
payload
|
|
146
|
-
});
|
|
147
|
-
}
|
|
148
|
-
});
|
|
149
|
-
this.state = this.getPluginsStates(this.props.plugins, this.getEditorView(props));
|
|
150
|
-
}
|
|
151
|
-
getEditorView(maybeProps) {
|
|
152
|
-
const props = maybeProps || this.props;
|
|
153
|
-
const editorActions = props.editorActions;
|
|
154
|
-
return props.editorView || (editorActions === null || editorActions === void 0 ? void 0 : editorActions._privateGetEditorView());
|
|
155
|
-
}
|
|
156
|
-
getEventDispatcher(maybeProps) {
|
|
157
|
-
var _props$editorActions;
|
|
158
|
-
const props = maybeProps || this.props;
|
|
159
|
-
return props.eventDispatcher || ((_props$editorActions = props.editorActions) === null || _props$editorActions === void 0 ? void 0 : _props$editorActions._privateGetEventDispatcher());
|
|
160
|
-
}
|
|
161
|
-
getPluginsStates(plugins, editorView) {
|
|
162
|
-
if (!editorView || !plugins) {
|
|
163
|
-
return {};
|
|
164
|
-
}
|
|
165
|
-
const keys = Object.keys(plugins);
|
|
166
|
-
return keys.reduce((acc, propName) => {
|
|
167
|
-
const pluginKey = plugins[propName];
|
|
168
|
-
if (!pluginKey) {
|
|
169
|
-
return acc;
|
|
170
|
-
}
|
|
171
|
-
acc[propName] = pluginKey.getState(editorView.state);
|
|
172
|
-
return acc;
|
|
173
|
-
}, {});
|
|
174
|
-
}
|
|
175
|
-
subscribe(props) {
|
|
176
|
-
var _uiTracking$samplingR, _uiTracking$slowThres;
|
|
177
|
-
const plugins = props.plugins;
|
|
178
|
-
const eventDispatcher = this.getEventDispatcher(props);
|
|
179
|
-
const editorView = this.getEditorView(props);
|
|
180
|
-
if (!eventDispatcher || !editorView || this.isSubscribed) {
|
|
181
|
-
return;
|
|
182
|
-
}
|
|
183
|
-
|
|
184
|
-
// Please, do not copy or use this kind of code below
|
|
185
|
-
// @ts-ignore
|
|
186
|
-
const fakePluginKey = {
|
|
187
|
-
key: 'analyticsPlugin$',
|
|
188
|
-
getState: state => {
|
|
189
|
-
// Ignored via go/ees005
|
|
190
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
191
|
-
return state['analyticsPlugin$'];
|
|
192
|
-
}
|
|
193
|
-
};
|
|
194
|
-
const analyticsPlugin = fakePluginKey.getState(editorView.state);
|
|
195
|
-
const uiTracking = analyticsPlugin && analyticsPlugin.performanceTracking ? analyticsPlugin.performanceTracking.uiTracking || {} : {};
|
|
196
|
-
const trackingEnabled = uiTracking.enabled === true;
|
|
197
|
-
const samplingRate = (_uiTracking$samplingR = uiTracking.samplingRate) !== null && _uiTracking$samplingR !== void 0 ? _uiTracking$samplingR : DEFAULT_SAMPLING_RATE;
|
|
198
|
-
const slowThreshold = (_uiTracking$slowThres = uiTracking.slowThreshold) !== null && _uiTracking$slowThres !== void 0 ? _uiTracking$slowThres : DEFAULT_SLOW_THRESHOLD;
|
|
199
|
-
this.isSubscribed = true;
|
|
200
|
-
const pluginsStates = this.getPluginsStates(plugins, editorView);
|
|
201
|
-
this.setState(pluginsStates);
|
|
202
|
-
Object.keys(plugins).forEach(propName => {
|
|
203
|
-
const pluginKey = plugins[propName];
|
|
204
|
-
if (!pluginKey) {
|
|
205
|
-
return;
|
|
206
|
-
}
|
|
207
|
-
|
|
208
|
-
// Ignored via go/ees005
|
|
209
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
210
|
-
const pluginName = pluginKey.key;
|
|
211
|
-
// Ignored via go/ees005
|
|
212
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
213
|
-
const pluginState = pluginsStates[propName];
|
|
214
|
-
const isPluginWithSubscribe = pluginState && pluginState.subscribe;
|
|
215
|
-
const handler = this.handlePluginStateChange(propName, pluginName, {
|
|
216
|
-
samplingRate,
|
|
217
|
-
slowThreshold,
|
|
218
|
-
trackingEnabled
|
|
219
|
-
}, isPluginWithSubscribe);
|
|
220
|
-
if (isPluginWithSubscribe) {
|
|
221
|
-
pluginState.subscribe(handler);
|
|
222
|
-
} else {
|
|
223
|
-
// Ignored via go/ees005
|
|
224
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
225
|
-
eventDispatcher.on(pluginKey.key, handler);
|
|
226
|
-
}
|
|
227
|
-
|
|
228
|
-
// Ignored via go/ees005
|
|
229
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
230
|
-
// Ignored via go/ees005
|
|
231
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
232
|
-
this.listeners[pluginKey.key] = {
|
|
233
|
-
handler,
|
|
234
|
-
pluginKey
|
|
235
|
-
};
|
|
236
|
-
});
|
|
237
|
-
}
|
|
238
|
-
unsubscribe() {
|
|
239
|
-
const eventDispatcher = this.getEventDispatcher();
|
|
240
|
-
const editorView = this.getEditorView();
|
|
241
|
-
if (!eventDispatcher || !editorView || !this.isSubscribed) {
|
|
242
|
-
return;
|
|
243
|
-
}
|
|
244
|
-
Object.keys(this.listeners).forEach(key => {
|
|
245
|
-
// Ignored via go/ees005
|
|
246
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
247
|
-
const pluginState = this.listeners[key].pluginKey.getState(editorView.state);
|
|
248
|
-
if (pluginState && pluginState.unsubscribe) {
|
|
249
|
-
// Ignored via go/ees005
|
|
250
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
251
|
-
pluginState.unsubscribe(this.listeners[key].handler);
|
|
252
|
-
} else {
|
|
253
|
-
// Ignored via go/ees005
|
|
254
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
255
|
-
eventDispatcher.off(key, this.listeners[key].handler);
|
|
256
|
-
}
|
|
257
|
-
});
|
|
258
|
-
this.listeners = [];
|
|
259
|
-
}
|
|
260
|
-
subscribeToContextUpdates() {
|
|
261
|
-
var _this$props$editorAct;
|
|
262
|
-
(_this$props$editorAct = this.props.editorActions) === null || _this$props$editorAct === void 0 ? void 0 : _this$props$editorAct._privateSubscribe(() => this.subscribe(this.props));
|
|
263
|
-
}
|
|
264
|
-
unsubscribeFromContextUpdates() {
|
|
265
|
-
var _this$props$editorAct2;
|
|
266
|
-
(_this$props$editorAct2 = this.props.editorActions) === null || _this$props$editorAct2 === void 0 ? void 0 : _this$props$editorAct2._privateUnsubscribe(() => this.subscribe(this.props));
|
|
267
|
-
}
|
|
268
|
-
componentDidMount() {
|
|
269
|
-
this.subscribe(this.props);
|
|
270
|
-
this.subscribeToContextUpdates();
|
|
271
|
-
}
|
|
272
|
-
|
|
273
|
-
// Ignored via go/ees005
|
|
274
|
-
// eslint-disable-next-line react/no-unsafe
|
|
275
|
-
UNSAFE_componentWillReceiveProps(nextProps) {
|
|
276
|
-
if (!this.isSubscribed) {
|
|
277
|
-
this.subscribe(nextProps);
|
|
278
|
-
}
|
|
279
|
-
}
|
|
280
|
-
componentWillUnmount() {
|
|
281
|
-
if (this.debounce) {
|
|
282
|
-
window.clearTimeout(this.debounce);
|
|
283
|
-
}
|
|
284
|
-
this.unsubscribeFromContextUpdates();
|
|
285
|
-
this.unsubscribe();
|
|
286
|
-
}
|
|
287
|
-
render() {
|
|
288
|
-
const {
|
|
289
|
-
render
|
|
290
|
-
} = this.props;
|
|
291
|
-
return render(this.state);
|
|
292
|
-
}
|
|
293
|
-
}
|
|
294
|
-
_defineProperty(WithPluginStateInner, "displayName", 'WithPluginState');
|
|
295
|
-
export { WithPluginState };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,344 +0,0 @@
|
|
|
1
|
-
import _readOnlyError from "@babel/runtime/helpers/readOnlyError";
|
|
2
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
4
|
-
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
5
|
-
import _createClass from "@babel/runtime/helpers/createClass";
|
|
6
|
-
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
|
7
|
-
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
8
|
-
import _inherits from "@babel/runtime/helpers/inherits";
|
|
9
|
-
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; }
|
|
10
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
11
|
-
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
|
|
12
|
-
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
13
|
-
import React from 'react';
|
|
14
|
-
import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../analytics';
|
|
15
|
-
import { createDispatch } from '../event-dispatcher';
|
|
16
|
-
import { startMeasure, stopMeasure } from '../performance-measures';
|
|
17
|
-
import { EditorContext } from '../ui/EditorContext';
|
|
18
|
-
import { analyticsEventKey } from '../utils';
|
|
19
|
-
var DEFAULT_SAMPLING_RATE = 100;
|
|
20
|
-
var DEFAULT_SLOW_THRESHOLD = 4;
|
|
21
|
-
|
|
22
|
-
// That context was extract from the old WithPluginState from editor-core
|
|
23
|
-
// It was using some private types from
|
|
24
|
-
// - EditorAction: packages/editor/editor-core/src/actions/index.ts
|
|
25
|
-
// - EditorSharedConfig: packages/editor/editor-core/src/labs/next/internal/context/shared-config.tsx
|
|
26
|
-
/**
|
|
27
|
-
* @private
|
|
28
|
-
* @deprecated
|
|
29
|
-
*
|
|
30
|
-
* Using this component is deprecated. It should be replaced with `useSharedPluginState`.
|
|
31
|
-
* This requires having access to the injection API from the plugin itself.
|
|
32
|
-
*
|
|
33
|
-
* An example of the refactor with the new hook (using hyperlink as an example) is:
|
|
34
|
-
*
|
|
35
|
-
* Before:
|
|
36
|
-
* ```ts
|
|
37
|
-
* <WithPluginState
|
|
38
|
-
* editorView={editorView}
|
|
39
|
-
* plugins={{
|
|
40
|
-
* hyperlinkState: hyperlinkPluginKey
|
|
41
|
-
* }}
|
|
42
|
-
* render={({ hyperlinkState }) =>
|
|
43
|
-
* renderComponent({ hyperlinkState })
|
|
44
|
-
* }
|
|
45
|
-
* />
|
|
46
|
-
* ```
|
|
47
|
-
*
|
|
48
|
-
* After:
|
|
49
|
-
* ```ts
|
|
50
|
-
* import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
51
|
-
* import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
52
|
-
*
|
|
53
|
-
* function ComponentWithState(
|
|
54
|
-
* api: ExtractInjectionAPI<typeof hyperlinkPlugin> | undefined
|
|
55
|
-
* ) {
|
|
56
|
-
* const { hyperlinkState } = useSharedPluginState(api, ['hyperlink']);
|
|
57
|
-
* return renderComponent({ hyperlinkState })
|
|
58
|
-
* }
|
|
59
|
-
* ```
|
|
60
|
-
*
|
|
61
|
-
*/
|
|
62
|
-
// Ignored via go/ees005
|
|
63
|
-
// eslint-disable-next-line @repo/internal/react/no-class-components, react/prefer-stateless-function
|
|
64
|
-
var WithPluginState = /*#__PURE__*/function (_React$Component) {
|
|
65
|
-
function WithPluginState(props) {
|
|
66
|
-
_classCallCheck(this, WithPluginState);
|
|
67
|
-
return _callSuper(this, WithPluginState, [props]);
|
|
68
|
-
}
|
|
69
|
-
_inherits(WithPluginState, _React$Component);
|
|
70
|
-
return _createClass(WithPluginState, [{
|
|
71
|
-
key: "render",
|
|
72
|
-
value: function render() {
|
|
73
|
-
// Ignored via go/ees005
|
|
74
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
75
|
-
return /*#__PURE__*/React.createElement(WithPluginStateEditionActionsWrapper, this.props);
|
|
76
|
-
}
|
|
77
|
-
}]);
|
|
78
|
-
}(React.Component);
|
|
79
|
-
function WithPluginStateEditionActionsWrapper(props) {
|
|
80
|
-
var context = React.useContext(EditorContext);
|
|
81
|
-
return /*#__PURE__*/React.createElement(WithPluginStateInner
|
|
82
|
-
// Ignored via go/ees005
|
|
83
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
84
|
-
, _extends({}, props, {
|
|
85
|
-
editorActions: context === null || context === void 0 ? void 0 : context.editorActions
|
|
86
|
-
}));
|
|
87
|
-
}
|
|
88
|
-
// Ignored via go/ees005
|
|
89
|
-
// eslint-disable-next-line @repo/internal/react/no-class-components
|
|
90
|
-
export var WithPluginStateInner = /*#__PURE__*/function (_React$Component2) {
|
|
91
|
-
function WithPluginStateInner(props) {
|
|
92
|
-
var _this;
|
|
93
|
-
_classCallCheck(this, WithPluginStateInner);
|
|
94
|
-
_this = _callSuper(this, WithPluginStateInner, [props]);
|
|
95
|
-
_defineProperty(_this, "listeners", {});
|
|
96
|
-
_defineProperty(_this, "debounce", null);
|
|
97
|
-
_defineProperty(_this, "notAppliedState", {});
|
|
98
|
-
_defineProperty(_this, "isSubscribed", false);
|
|
99
|
-
_defineProperty(_this, "callsCount", 0);
|
|
100
|
-
_defineProperty(_this, "handlePluginStateChange", function (propName, pluginName, performanceOptions, skipEqualityCheck) {
|
|
101
|
-
return (
|
|
102
|
-
// Ignored via go/ees005
|
|
103
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
104
|
-
function (pluginState) {
|
|
105
|
-
// skipEqualityCheck is being used for old plugins since they are mutating plugin state instead of creating a new one
|
|
106
|
-
// Ignored via go/ees005
|
|
107
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
108
|
-
if (_this.state[propName] !== pluginState || skipEqualityCheck) {
|
|
109
|
-
_this.updateState({
|
|
110
|
-
stateSubset: _defineProperty({}, propName, pluginState),
|
|
111
|
-
pluginName: pluginName,
|
|
112
|
-
performanceOptions: performanceOptions
|
|
113
|
-
});
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
);
|
|
117
|
-
});
|
|
118
|
-
/**
|
|
119
|
-
* Debounces setState calls in order to reduce number of re-renders caused by several plugin state changes.
|
|
120
|
-
*/
|
|
121
|
-
_defineProperty(_this, "updateState", function (_ref) {
|
|
122
|
-
var stateSubset = _ref.stateSubset,
|
|
123
|
-
pluginName = _ref.pluginName,
|
|
124
|
-
performanceOptions = _ref.performanceOptions;
|
|
125
|
-
_this.notAppliedState = _objectSpread(_objectSpread({}, _this.notAppliedState), stateSubset);
|
|
126
|
-
if (_this.debounce) {
|
|
127
|
-
window.clearTimeout(_this.debounce);
|
|
128
|
-
}
|
|
129
|
-
var debounce = _this.props.debounce !== false ? function (fn) {
|
|
130
|
-
return window.setTimeout(fn, 0);
|
|
131
|
-
} : function (fn) {
|
|
132
|
-
return fn();
|
|
133
|
-
};
|
|
134
|
-
_this.debounce = debounce(function () {
|
|
135
|
-
var measure = "\uD83E\uDD89".concat(pluginName, "::WithPluginState");
|
|
136
|
-
performanceOptions.trackingEnabled && startMeasure(measure);
|
|
137
|
-
_this.setState(_this.notAppliedState, function () {
|
|
138
|
-
performanceOptions.trackingEnabled && stopMeasure(measure, function (duration) {
|
|
139
|
-
// Each WithPluginState component will fire analytics event no more than once every `samplingLimit` times
|
|
140
|
-
if (++_this.callsCount % performanceOptions.samplingRate === 0 && duration > performanceOptions.slowThreshold) {
|
|
141
|
-
_this.dispatchAnalyticsEvent({
|
|
142
|
-
action: ACTION.WITH_PLUGIN_STATE_CALLED,
|
|
143
|
-
actionSubject: ACTION_SUBJECT.EDITOR,
|
|
144
|
-
eventType: EVENT_TYPE.OPERATIONAL,
|
|
145
|
-
attributes: {
|
|
146
|
-
plugin: pluginName,
|
|
147
|
-
duration: duration
|
|
148
|
-
}
|
|
149
|
-
});
|
|
150
|
-
}
|
|
151
|
-
});
|
|
152
|
-
});
|
|
153
|
-
_this.debounce = null;
|
|
154
|
-
_this.notAppliedState = {};
|
|
155
|
-
});
|
|
156
|
-
});
|
|
157
|
-
_defineProperty(_this, "dispatchAnalyticsEvent", function (payload) {
|
|
158
|
-
var eventDispatcher = _this.getEventDispatcher();
|
|
159
|
-
if (eventDispatcher) {
|
|
160
|
-
var dispatch = createDispatch(eventDispatcher);
|
|
161
|
-
dispatch(analyticsEventKey, {
|
|
162
|
-
payload: payload
|
|
163
|
-
});
|
|
164
|
-
}
|
|
165
|
-
});
|
|
166
|
-
_this.state = _this.getPluginsStates(_this.props.plugins, _this.getEditorView(props));
|
|
167
|
-
return _this;
|
|
168
|
-
}
|
|
169
|
-
_inherits(WithPluginStateInner, _React$Component2);
|
|
170
|
-
return _createClass(WithPluginStateInner, [{
|
|
171
|
-
key: "getEditorView",
|
|
172
|
-
value: function getEditorView(maybeProps) {
|
|
173
|
-
var props = maybeProps || this.props;
|
|
174
|
-
var editorActions = props.editorActions;
|
|
175
|
-
return props.editorView || (editorActions === null || editorActions === void 0 ? void 0 : editorActions._privateGetEditorView());
|
|
176
|
-
}
|
|
177
|
-
}, {
|
|
178
|
-
key: "getEventDispatcher",
|
|
179
|
-
value: function getEventDispatcher(maybeProps) {
|
|
180
|
-
var _props$editorActions;
|
|
181
|
-
var props = maybeProps || this.props;
|
|
182
|
-
return props.eventDispatcher || ((_props$editorActions = props.editorActions) === null || _props$editorActions === void 0 ? void 0 : _props$editorActions._privateGetEventDispatcher());
|
|
183
|
-
}
|
|
184
|
-
}, {
|
|
185
|
-
key: "getPluginsStates",
|
|
186
|
-
value: function getPluginsStates(plugins, editorView) {
|
|
187
|
-
if (!editorView || !plugins) {
|
|
188
|
-
return {};
|
|
189
|
-
}
|
|
190
|
-
var keys = Object.keys(plugins);
|
|
191
|
-
return keys.reduce(function (acc, propName) {
|
|
192
|
-
var pluginKey = plugins[propName];
|
|
193
|
-
if (!pluginKey) {
|
|
194
|
-
return acc;
|
|
195
|
-
}
|
|
196
|
-
acc[propName] = pluginKey.getState(editorView.state);
|
|
197
|
-
return acc;
|
|
198
|
-
}, {});
|
|
199
|
-
}
|
|
200
|
-
}, {
|
|
201
|
-
key: "subscribe",
|
|
202
|
-
value: function subscribe(props) {
|
|
203
|
-
var _uiTracking$samplingR,
|
|
204
|
-
_uiTracking$slowThres,
|
|
205
|
-
_this2 = this;
|
|
206
|
-
var plugins = props.plugins;
|
|
207
|
-
var eventDispatcher = this.getEventDispatcher(props);
|
|
208
|
-
var editorView = this.getEditorView(props);
|
|
209
|
-
if (!eventDispatcher || !editorView || this.isSubscribed) {
|
|
210
|
-
return;
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
// Please, do not copy or use this kind of code below
|
|
214
|
-
// @ts-ignore
|
|
215
|
-
var fakePluginKey = {
|
|
216
|
-
key: 'analyticsPlugin$',
|
|
217
|
-
getState: function getState(state) {
|
|
218
|
-
// Ignored via go/ees005
|
|
219
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
220
|
-
return state['analyticsPlugin$'];
|
|
221
|
-
}
|
|
222
|
-
};
|
|
223
|
-
var analyticsPlugin = fakePluginKey.getState(editorView.state);
|
|
224
|
-
var uiTracking = analyticsPlugin && analyticsPlugin.performanceTracking ? analyticsPlugin.performanceTracking.uiTracking || {} : {};
|
|
225
|
-
var trackingEnabled = uiTracking.enabled === true;
|
|
226
|
-
var samplingRate = (_uiTracking$samplingR = uiTracking.samplingRate) !== null && _uiTracking$samplingR !== void 0 ? _uiTracking$samplingR : DEFAULT_SAMPLING_RATE;
|
|
227
|
-
var slowThreshold = (_uiTracking$slowThres = uiTracking.slowThreshold) !== null && _uiTracking$slowThres !== void 0 ? _uiTracking$slowThres : DEFAULT_SLOW_THRESHOLD;
|
|
228
|
-
this.isSubscribed = true;
|
|
229
|
-
var pluginsStates = this.getPluginsStates(plugins, editorView);
|
|
230
|
-
this.setState(pluginsStates);
|
|
231
|
-
Object.keys(plugins).forEach(function (propName) {
|
|
232
|
-
var pluginKey = plugins[propName];
|
|
233
|
-
if (!pluginKey) {
|
|
234
|
-
return;
|
|
235
|
-
}
|
|
236
|
-
|
|
237
|
-
// Ignored via go/ees005
|
|
238
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
239
|
-
var pluginName = pluginKey.key;
|
|
240
|
-
// Ignored via go/ees005
|
|
241
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
242
|
-
var pluginState = pluginsStates[propName];
|
|
243
|
-
var isPluginWithSubscribe = pluginState && pluginState.subscribe;
|
|
244
|
-
var handler = _this2.handlePluginStateChange(propName, pluginName, {
|
|
245
|
-
samplingRate: samplingRate,
|
|
246
|
-
slowThreshold: slowThreshold,
|
|
247
|
-
trackingEnabled: trackingEnabled
|
|
248
|
-
}, isPluginWithSubscribe);
|
|
249
|
-
if (isPluginWithSubscribe) {
|
|
250
|
-
pluginState.subscribe(handler);
|
|
251
|
-
} else {
|
|
252
|
-
// Ignored via go/ees005
|
|
253
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
254
|
-
eventDispatcher.on(pluginKey.key, handler);
|
|
255
|
-
}
|
|
256
|
-
|
|
257
|
-
// Ignored via go/ees005
|
|
258
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
259
|
-
// Ignored via go/ees005
|
|
260
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
261
|
-
_this2.listeners[pluginKey.key] = {
|
|
262
|
-
handler: handler,
|
|
263
|
-
pluginKey: pluginKey
|
|
264
|
-
};
|
|
265
|
-
});
|
|
266
|
-
}
|
|
267
|
-
}, {
|
|
268
|
-
key: "unsubscribe",
|
|
269
|
-
value: function unsubscribe() {
|
|
270
|
-
var _this3 = this;
|
|
271
|
-
var eventDispatcher = this.getEventDispatcher();
|
|
272
|
-
var editorView = this.getEditorView();
|
|
273
|
-
if (!eventDispatcher || !editorView || !this.isSubscribed) {
|
|
274
|
-
return;
|
|
275
|
-
}
|
|
276
|
-
Object.keys(this.listeners).forEach(function (key) {
|
|
277
|
-
// Ignored via go/ees005
|
|
278
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
279
|
-
var pluginState = _this3.listeners[key].pluginKey.getState(editorView.state);
|
|
280
|
-
if (pluginState && pluginState.unsubscribe) {
|
|
281
|
-
// Ignored via go/ees005
|
|
282
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
283
|
-
pluginState.unsubscribe(_this3.listeners[key].handler);
|
|
284
|
-
} else {
|
|
285
|
-
// Ignored via go/ees005
|
|
286
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
287
|
-
eventDispatcher.off(key, _this3.listeners[key].handler);
|
|
288
|
-
}
|
|
289
|
-
});
|
|
290
|
-
this.listeners = [];
|
|
291
|
-
}
|
|
292
|
-
}, {
|
|
293
|
-
key: "subscribeToContextUpdates",
|
|
294
|
-
value: function subscribeToContextUpdates() {
|
|
295
|
-
var _this$props$editorAct,
|
|
296
|
-
_this4 = this;
|
|
297
|
-
(_this$props$editorAct = this.props.editorActions) === null || _this$props$editorAct === void 0 || _this$props$editorAct._privateSubscribe(function () {
|
|
298
|
-
return _this4.subscribe(_this4.props);
|
|
299
|
-
});
|
|
300
|
-
}
|
|
301
|
-
}, {
|
|
302
|
-
key: "unsubscribeFromContextUpdates",
|
|
303
|
-
value: function unsubscribeFromContextUpdates() {
|
|
304
|
-
var _this$props$editorAct2,
|
|
305
|
-
_this5 = this;
|
|
306
|
-
(_this$props$editorAct2 = this.props.editorActions) === null || _this$props$editorAct2 === void 0 || _this$props$editorAct2._privateUnsubscribe(function () {
|
|
307
|
-
return _this5.subscribe(_this5.props);
|
|
308
|
-
});
|
|
309
|
-
}
|
|
310
|
-
}, {
|
|
311
|
-
key: "componentDidMount",
|
|
312
|
-
value: function componentDidMount() {
|
|
313
|
-
this.subscribe(this.props);
|
|
314
|
-
this.subscribeToContextUpdates();
|
|
315
|
-
}
|
|
316
|
-
|
|
317
|
-
// Ignored via go/ees005
|
|
318
|
-
// eslint-disable-next-line react/no-unsafe
|
|
319
|
-
}, {
|
|
320
|
-
key: "UNSAFE_componentWillReceiveProps",
|
|
321
|
-
value: function UNSAFE_componentWillReceiveProps(nextProps) {
|
|
322
|
-
if (!this.isSubscribed) {
|
|
323
|
-
this.subscribe(nextProps);
|
|
324
|
-
}
|
|
325
|
-
}
|
|
326
|
-
}, {
|
|
327
|
-
key: "componentWillUnmount",
|
|
328
|
-
value: function componentWillUnmount() {
|
|
329
|
-
if (this.debounce) {
|
|
330
|
-
window.clearTimeout(this.debounce);
|
|
331
|
-
}
|
|
332
|
-
this.unsubscribeFromContextUpdates();
|
|
333
|
-
this.unsubscribe();
|
|
334
|
-
}
|
|
335
|
-
}, {
|
|
336
|
-
key: "render",
|
|
337
|
-
value: function render() {
|
|
338
|
-
var render = this.props.render;
|
|
339
|
-
return render(this.state);
|
|
340
|
-
}
|
|
341
|
-
}]);
|
|
342
|
-
}(React.Component);
|
|
343
|
-
_defineProperty(WithPluginStateInner, "displayName", 'WithPluginState');
|
|
344
|
-
export { WithPluginState };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|