@atlaskit/editor-plugin-floating-toolbar 2.0.3 → 3.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 +22 -0
- package/dist/cjs/floatingToolbarPlugin.js +26 -49
- package/dist/cjs/ui/Toolbar.js +16 -122
- package/dist/es2019/floatingToolbarPlugin.js +3 -23
- package/dist/es2019/ui/Toolbar.js +8 -110
- package/dist/esm/floatingToolbarPlugin.js +23 -46
- package/dist/esm/ui/Toolbar.js +15 -121
- package/dist/types/floatingToolbarPluginType.d.ts +1 -16
- package/dist/types/ui/Toolbar.d.ts +0 -1
- package/dist/types-ts4.5/floatingToolbarPluginType.d.ts +1 -16
- package/dist/types-ts4.5/ui/Toolbar.d.ts +0 -1
- package/package.json +5 -5
- package/dist/cjs/pm-plugins/contextual-toolbar/plugin-key.js +0 -8
- package/dist/cjs/pm-plugins/contextual-toolbar/plugin.js +0 -39
- package/dist/cjs/pm-plugins/contextual-toolbar/types.js +0 -1
- package/dist/es2019/pm-plugins/contextual-toolbar/plugin-key.js +0 -2
- package/dist/es2019/pm-plugins/contextual-toolbar/plugin.js +0 -33
- package/dist/es2019/pm-plugins/contextual-toolbar/types.js +0 -0
- package/dist/esm/pm-plugins/contextual-toolbar/plugin-key.js +0 -2
- package/dist/esm/pm-plugins/contextual-toolbar/plugin.js +0 -33
- package/dist/esm/pm-plugins/contextual-toolbar/types.js +0 -0
- package/dist/types/pm-plugins/contextual-toolbar/plugin-key.d.ts +0 -3
- package/dist/types/pm-plugins/contextual-toolbar/plugin.d.ts +0 -3
- package/dist/types/pm-plugins/contextual-toolbar/types.d.ts +0 -8
- package/dist/types-ts4.5/pm-plugins/contextual-toolbar/plugin-key.d.ts +0 -3
- package/dist/types-ts4.5/pm-plugins/contextual-toolbar/plugin.d.ts +0 -3
- package/dist/types-ts4.5/pm-plugins/contextual-toolbar/types.d.ts +0 -8
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,27 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-floating-toolbar
|
|
2
2
|
|
|
3
|
+
## 3.0.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- [#119765](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/119765)
|
|
8
|
+
[`328d167524d8d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/328d167524d8d) -
|
|
9
|
+
WHAT Removed `contextualToolbar` from floating toolbar plugin, which removes `contextualToolbar`
|
|
10
|
+
from `sharedState`, removes `updateContextualToolbar` from commands. WHY These properties were
|
|
11
|
+
supporting experimental features for new editor controls which will not be released and is no
|
|
12
|
+
longer needed. HOW These properties where not exposed on the default types and were only used
|
|
13
|
+
internally to the plugin, this should not create any friction or issues
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
|
|
19
|
+
## 2.0.4
|
|
20
|
+
|
|
21
|
+
### Patch Changes
|
|
22
|
+
|
|
23
|
+
- Updated dependencies
|
|
24
|
+
|
|
3
25
|
## 2.0.3
|
|
4
26
|
|
|
5
27
|
### Patch Changes
|
|
@@ -21,12 +21,10 @@ var _ui = require("@atlaskit/editor-common/ui");
|
|
|
21
21
|
var _state = require("@atlaskit/editor-prosemirror/state");
|
|
22
22
|
var _utils = require("@atlaskit/editor-prosemirror/utils");
|
|
23
23
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
24
|
-
var _plugin = require("./pm-plugins/contextual-toolbar/plugin");
|
|
25
|
-
var _pluginKey = require("./pm-plugins/contextual-toolbar/plugin-key");
|
|
26
24
|
var _forceFocus = _interopRequireWildcard(require("./pm-plugins/force-focus"));
|
|
27
25
|
var _commands = require("./pm-plugins/toolbar-data/commands");
|
|
28
|
-
var
|
|
29
|
-
var
|
|
26
|
+
var _plugin = require("./pm-plugins/toolbar-data/plugin");
|
|
27
|
+
var _pluginKey = require("./pm-plugins/toolbar-data/plugin-key");
|
|
30
28
|
var _utils2 = require("./pm-plugins/utils");
|
|
31
29
|
var _ConfirmationModal = require("./ui/ConfirmationModal");
|
|
32
30
|
var _ExpandButton = require("./ui/ExpandButton");
|
|
@@ -153,7 +151,7 @@ var floatingToolbarPlugin = exports.floatingToolbarPlugin = function floatingToo
|
|
|
153
151
|
name: 'floatingToolbarData',
|
|
154
152
|
plugin: function plugin(_ref3) {
|
|
155
153
|
var dispatch = _ref3.dispatch;
|
|
156
|
-
return (0,
|
|
154
|
+
return (0, _plugin.createPlugin)(dispatch);
|
|
157
155
|
}
|
|
158
156
|
}, {
|
|
159
157
|
name: 'forceFocus',
|
|
@@ -161,14 +159,6 @@ var floatingToolbarPlugin = exports.floatingToolbarPlugin = function floatingToo
|
|
|
161
159
|
return (0, _forceFocus.default)();
|
|
162
160
|
}
|
|
163
161
|
}];
|
|
164
|
-
if (!(0, _experiments.editorExperiment)('platform_editor_controls', 'control')) {
|
|
165
|
-
plugins.push({
|
|
166
|
-
name: 'contextualToolbar',
|
|
167
|
-
plugin: function plugin() {
|
|
168
|
-
return (0, _plugin.contextualToolbarPlugin)();
|
|
169
|
-
}
|
|
170
|
-
});
|
|
171
|
-
}
|
|
172
162
|
return plugins;
|
|
173
163
|
},
|
|
174
164
|
actions: {
|
|
@@ -182,27 +172,16 @@ var floatingToolbarPlugin = exports.floatingToolbarPlugin = function floatingToo
|
|
|
182
172
|
var configWithNodeInfo = (_pluginKey$getState$g = (_pluginKey$getState = pluginKey.getState(editorState)) === null || _pluginKey$getState === void 0 || (_pluginKey$getState$g2 = _pluginKey$getState.getConfigWithNodeInfo) === null || _pluginKey$getState$g2 === void 0 ? void 0 : _pluginKey$getState$g2.call(_pluginKey$getState, editorState)) !== null && _pluginKey$getState$g !== void 0 ? _pluginKey$getState$g : undefined;
|
|
183
173
|
return {
|
|
184
174
|
configWithNodeInfo: configWithNodeInfo,
|
|
185
|
-
floatingToolbarData:
|
|
186
|
-
// Experimental - excluding this property from the external API whilst it's in development
|
|
187
|
-
contextualToolbar: _pluginKey.contextualToolbarPluginKey.getState(editorState)
|
|
175
|
+
floatingToolbarData: _pluginKey.pluginKey.getState(editorState)
|
|
188
176
|
};
|
|
189
177
|
},
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
}
|
|
198
|
-
},
|
|
199
|
-
contentComponent: function contentComponent(_ref5) {
|
|
200
|
-
var popupsMountPoint = _ref5.popupsMountPoint,
|
|
201
|
-
popupsBoundariesElement = _ref5.popupsBoundariesElement,
|
|
202
|
-
popupsScrollableElement = _ref5.popupsScrollableElement,
|
|
203
|
-
editorView = _ref5.editorView,
|
|
204
|
-
providerFactory = _ref5.providerFactory,
|
|
205
|
-
dispatchAnalyticsEvent = _ref5.dispatchAnalyticsEvent;
|
|
178
|
+
contentComponent: function contentComponent(_ref4) {
|
|
179
|
+
var popupsMountPoint = _ref4.popupsMountPoint,
|
|
180
|
+
popupsBoundariesElement = _ref4.popupsBoundariesElement,
|
|
181
|
+
popupsScrollableElement = _ref4.popupsScrollableElement,
|
|
182
|
+
editorView = _ref4.editorView,
|
|
183
|
+
providerFactory = _ref4.providerFactory,
|
|
184
|
+
dispatchAnalyticsEvent = _ref4.dispatchAnalyticsEvent;
|
|
206
185
|
return /*#__PURE__*/_react.default.createElement(ContentComponent, {
|
|
207
186
|
editorView: editorView,
|
|
208
187
|
pluginInjectionApi: api,
|
|
@@ -215,23 +194,23 @@ var floatingToolbarPlugin = exports.floatingToolbarPlugin = function floatingToo
|
|
|
215
194
|
}
|
|
216
195
|
};
|
|
217
196
|
};
|
|
218
|
-
function ContentComponent(
|
|
197
|
+
function ContentComponent(_ref5) {
|
|
219
198
|
var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d;
|
|
220
|
-
var pluginInjectionApi =
|
|
221
|
-
editorView =
|
|
222
|
-
popupsMountPoint =
|
|
223
|
-
popupsBoundariesElement =
|
|
224
|
-
popupsScrollableElement =
|
|
225
|
-
providerFactory =
|
|
226
|
-
dispatchAnalyticsEvent =
|
|
199
|
+
var pluginInjectionApi = _ref5.pluginInjectionApi,
|
|
200
|
+
editorView = _ref5.editorView,
|
|
201
|
+
popupsMountPoint = _ref5.popupsMountPoint,
|
|
202
|
+
popupsBoundariesElement = _ref5.popupsBoundariesElement,
|
|
203
|
+
popupsScrollableElement = _ref5.popupsScrollableElement,
|
|
204
|
+
providerFactory = _ref5.providerFactory,
|
|
205
|
+
dispatchAnalyticsEvent = _ref5.dispatchAnalyticsEvent;
|
|
227
206
|
var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['floatingToolbar', 'editorDisabled', 'editorViewMode', 'blockControls']),
|
|
228
207
|
floatingToolbarState = _useSharedPluginState.floatingToolbarState,
|
|
229
208
|
editorDisabledState = _useSharedPluginState.editorDisabledState,
|
|
230
209
|
editorViewModeState = _useSharedPluginState.editorViewModeState,
|
|
231
210
|
blockControlsState = _useSharedPluginState.blockControlsState;
|
|
232
|
-
var
|
|
233
|
-
configWithNodeInfo =
|
|
234
|
-
floatingToolbarData =
|
|
211
|
+
var _ref6 = floatingToolbarState !== null && floatingToolbarState !== void 0 ? floatingToolbarState : {},
|
|
212
|
+
configWithNodeInfo = _ref6.configWithNodeInfo,
|
|
213
|
+
floatingToolbarData = _ref6.floatingToolbarData;
|
|
235
214
|
if (!configWithNodeInfo || !configWithNodeInfo.config || typeof ((_configWithNodeInfo$c = configWithNodeInfo.config) === null || _configWithNodeInfo$c === void 0 ? void 0 : _configWithNodeInfo$c.visible) !== 'undefined' && !((_configWithNodeInfo$c2 = configWithNodeInfo.config) !== null && _configWithNodeInfo$c2 !== void 0 && _configWithNodeInfo$c2.visible)) {
|
|
236
215
|
return null;
|
|
237
216
|
}
|
|
@@ -271,8 +250,7 @@ function ContentComponent(_ref6) {
|
|
|
271
250
|
_config$mediaAssistiv = config.mediaAssistiveMessage,
|
|
272
251
|
mediaAssistiveMessage = _config$mediaAssistiv === void 0 ? '' : _config$mediaAssistiv,
|
|
273
252
|
_config$stick = config.stick,
|
|
274
|
-
stick = _config$stick === void 0 ? true : _config$stick
|
|
275
|
-
forceStaticToolbar = config.forceStaticToolbar;
|
|
253
|
+
stick = _config$stick === void 0 ? true : _config$stick;
|
|
276
254
|
var targetRef = getDomRef(editorView, dispatchAnalyticsEvent);
|
|
277
255
|
var isEditorDisabled = editorDisabledState && editorDisabledState.editorDisabled;
|
|
278
256
|
var isInViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
|
|
@@ -336,8 +314,8 @@ function ContentComponent(_ref6) {
|
|
|
336
314
|
};
|
|
337
315
|
|
|
338
316
|
// Confirm dialog
|
|
339
|
-
var
|
|
340
|
-
confirmDialogForItem =
|
|
317
|
+
var _ref7 = floatingToolbarData || {},
|
|
318
|
+
confirmDialogForItem = _ref7.confirmDialogForItem;
|
|
341
319
|
var confirmButtonItem = confirmDialogForItem ?
|
|
342
320
|
// Ignored via go/ees005
|
|
343
321
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
@@ -400,8 +378,7 @@ function ContentComponent(_ref6) {
|
|
|
400
378
|
extensionsProvider: providers.extensionProvider,
|
|
401
379
|
scrollable: scrollable,
|
|
402
380
|
api: pluginInjectionApi,
|
|
403
|
-
mediaAssistiveMessage: mediaAssistiveMessage
|
|
404
|
-
forceStaticToolbar: forceStaticToolbar
|
|
381
|
+
mediaAssistiveMessage: mediaAssistiveMessage
|
|
405
382
|
});
|
|
406
383
|
}
|
|
407
384
|
})), /*#__PURE__*/_react.default.createElement(_ConfirmationModal.ConfirmationModal, {
|
package/dist/cjs/ui/Toolbar.js
CHANGED
|
@@ -22,12 +22,9 @@ var _floatingToolbar = require("@atlaskit/editor-common/floating-toolbar");
|
|
|
22
22
|
var _ui = require("@atlaskit/editor-common/ui");
|
|
23
23
|
var _uiColor = require("@atlaskit/editor-common/ui-color");
|
|
24
24
|
var _uiMenu = require("@atlaskit/editor-common/ui-menu");
|
|
25
|
-
var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
|
|
26
25
|
var _editorPalette = require("@atlaskit/editor-palette");
|
|
27
26
|
var _commands = require("@atlaskit/editor-plugin-table/commands");
|
|
28
|
-
var _edit = _interopRequireDefault(require("@atlaskit/icon/core/edit"));
|
|
29
27
|
var _showMoreHorizontal = _interopRequireDefault(require("@atlaskit/icon/core/show-more-horizontal"));
|
|
30
|
-
var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/utility/chevron-right"));
|
|
31
28
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
32
29
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
33
30
|
var _forceFocus = require("../pm-plugins/force-focus");
|
|
@@ -41,9 +38,7 @@ var _Select = _interopRequireDefault(require("./Select"));
|
|
|
41
38
|
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); }
|
|
42
39
|
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; }
|
|
43
40
|
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
|
|
44
|
-
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
45
|
-
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; }
|
|
46
|
-
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) { (0, _defineProperty2.default)(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; } /* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation */ /**
|
|
41
|
+
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation */ /**
|
|
47
42
|
* @jsxRuntime classic
|
|
48
43
|
* @jsx jsx
|
|
49
44
|
*/ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
@@ -387,106 +382,6 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
|
|
|
387
382
|
// otherwise it causes an issue where multiple popups stays open
|
|
388
383
|
return !(prevProps.node.type !== nextProps.node.type || prevProps.node.attrs.localId !== nextProps.node.attrs.localId || !(0, _floatingToolbar.areSameItems)(prevProps.items, nextProps.items) || !prevProps.mounted !== !nextProps.mounted);
|
|
389
384
|
});
|
|
390
|
-
var getFormattedItems = function getFormattedItems(items, isCollapsed, api) {
|
|
391
|
-
if (isCollapsed) {
|
|
392
|
-
var updatedItems = items.filter(function (item) {
|
|
393
|
-
return item.type === 'separator' || 'contextualToolbarDefaultVisibility' in item && item.contextualToolbarDefaultVisibility === 'visible' || !('contextualToolbarDefaultVisibility' in item);
|
|
394
|
-
}).filter(function (item, index, items) {
|
|
395
|
-
return item.type !== 'separator' || index > 0 && index < items.length - 1 && items[index - 1].type !== 'separator';
|
|
396
|
-
});
|
|
397
|
-
if (updatedItems[updatedItems.length - 1].type === 'separator') {
|
|
398
|
-
updatedItems.pop();
|
|
399
|
-
}
|
|
400
|
-
updatedItems.unshift({
|
|
401
|
-
type: 'separator'
|
|
402
|
-
});
|
|
403
|
-
updatedItems.unshift({
|
|
404
|
-
type: 'button',
|
|
405
|
-
icon: _edit.default,
|
|
406
|
-
title: 'Show items',
|
|
407
|
-
onClick: function onClick() {
|
|
408
|
-
if (api) {
|
|
409
|
-
api.core.actions.execute(api.floatingToolbar.commands.updateContextualToolbar({
|
|
410
|
-
type: 'expand-toolbar'
|
|
411
|
-
}));
|
|
412
|
-
}
|
|
413
|
-
}
|
|
414
|
-
});
|
|
415
|
-
return updatedItems;
|
|
416
|
-
}
|
|
417
|
-
items.unshift({
|
|
418
|
-
type: 'separator'
|
|
419
|
-
});
|
|
420
|
-
items.unshift({
|
|
421
|
-
type: 'button',
|
|
422
|
-
icon: _chevronRight.default,
|
|
423
|
-
title: 'Hide items',
|
|
424
|
-
onClick: function onClick() {
|
|
425
|
-
if (api) {
|
|
426
|
-
api.core.actions.execute(api.floatingToolbar.commands.updateContextualToolbar({
|
|
427
|
-
type: 'collapse-toolbar'
|
|
428
|
-
}));
|
|
429
|
-
}
|
|
430
|
-
}
|
|
431
|
-
});
|
|
432
|
-
return items;
|
|
433
|
-
};
|
|
434
|
-
var ToolbarItemsCollapsable = /*#__PURE__*/_react.default.memo(function (_ref2) {
|
|
435
|
-
var _contextualToolbarSta;
|
|
436
|
-
var items = _ref2.items,
|
|
437
|
-
groupLabel = _ref2.groupLabel,
|
|
438
|
-
dispatchCommand = _ref2.dispatchCommand,
|
|
439
|
-
popupsMountPoint = _ref2.popupsMountPoint,
|
|
440
|
-
popupsBoundariesElement = _ref2.popupsBoundariesElement,
|
|
441
|
-
editorView = _ref2.editorView,
|
|
442
|
-
dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent,
|
|
443
|
-
popupsScrollableElement = _ref2.popupsScrollableElement,
|
|
444
|
-
scrollable = _ref2.scrollable,
|
|
445
|
-
providerFactory = _ref2.providerFactory,
|
|
446
|
-
extensionsProvider = _ref2.extensionsProvider,
|
|
447
|
-
node = _ref2.node,
|
|
448
|
-
setDisableScroll = _ref2.setDisableScroll,
|
|
449
|
-
mountRef = _ref2.mountRef,
|
|
450
|
-
mounted = _ref2.mounted,
|
|
451
|
-
api = _ref2.api;
|
|
452
|
-
var contextualToolbarState = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'floatingToolbar.contextualToolbar');
|
|
453
|
-
|
|
454
|
-
// NOTE: Unsure if collapse/expand logic will be needed, for now hard code for cards
|
|
455
|
-
var isCard = node.type.name === 'inlineCard' || node.type.name === 'blockCard' || node.type.name === 'embedCard';
|
|
456
|
-
var updatedItems = isCard && items.length > 1 ? getFormattedItems(items.map(function (item) {
|
|
457
|
-
if ('id' in item && (item.id === 'editor.link.openLink' || item.id === 'editor.floatingToolbar.copy' || item.id === 'editor.link.commentLink')) {
|
|
458
|
-
return item;
|
|
459
|
-
}
|
|
460
|
-
return _objectSpread(_objectSpread({}, item), {}, {
|
|
461
|
-
contextualToolbarDefaultVisibility: 'hidden'
|
|
462
|
-
});
|
|
463
|
-
}), (_contextualToolbarSta = contextualToolbarState === null || contextualToolbarState === void 0 ? void 0 : contextualToolbarState.isCollapsed) !== null && _contextualToolbarSta !== void 0 ? _contextualToolbarSta : false, api) : items;
|
|
464
|
-
return (0, _react2.jsx)(ToolbarItems, {
|
|
465
|
-
items: updatedItems,
|
|
466
|
-
groupLabel: groupLabel,
|
|
467
|
-
dispatchCommand: dispatchCommand,
|
|
468
|
-
popupsMountPoint: popupsMountPoint,
|
|
469
|
-
popupsBoundariesElement: popupsBoundariesElement,
|
|
470
|
-
editorView: editorView,
|
|
471
|
-
dispatchAnalyticsEvent: dispatchAnalyticsEvent,
|
|
472
|
-
popupsScrollableElement: popupsScrollableElement,
|
|
473
|
-
scrollable: scrollable,
|
|
474
|
-
providerFactory: providerFactory,
|
|
475
|
-
extensionsProvider: extensionsProvider,
|
|
476
|
-
node: node,
|
|
477
|
-
setDisableScroll: setDisableScroll,
|
|
478
|
-
mountRef: mountRef,
|
|
479
|
-
mounted: mounted,
|
|
480
|
-
api: api
|
|
481
|
-
});
|
|
482
|
-
}, function (prevProps, nextProps) {
|
|
483
|
-
if (!nextProps.node) {
|
|
484
|
-
return false;
|
|
485
|
-
}
|
|
486
|
-
// only rerender toolbar items if the node is different
|
|
487
|
-
// otherwise it causes an issue where multiple popups stays open
|
|
488
|
-
return !(prevProps.node.type !== nextProps.node.type || prevProps.node.attrs.localId !== nextProps.node.attrs.localId || !(0, _floatingToolbar.areSameItems)(prevProps.items, nextProps.items) || !prevProps.mounted !== !nextProps.mounted);
|
|
489
|
-
});
|
|
490
385
|
var buttonGroupStyles = (0, _react2.css)({
|
|
491
386
|
display: 'flex',
|
|
492
387
|
gap: "var(--ds-space-050, 4px)"
|
|
@@ -532,15 +427,21 @@ var toolbarContainer = function toolbarContainer(scrollable, hasSelect, firstEle
|
|
|
532
427
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
533
428
|
(0, _react2.css)({
|
|
534
429
|
paddingLeft: "var(--ds-space-050, 4px)"
|
|
535
|
-
}))
|
|
430
|
+
})),
|
|
431
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
|
|
432
|
+
(0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ?
|
|
433
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
434
|
+
(0, _react2.css)({
|
|
435
|
+
height: "var(--ds-space-500, 40px)"
|
|
436
|
+
}) : undefined);
|
|
536
437
|
};
|
|
537
438
|
|
|
538
439
|
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
539
|
-
var toolbarOverflow = function toolbarOverflow(
|
|
540
|
-
var scrollable =
|
|
541
|
-
scrollDisabled =
|
|
542
|
-
firstElementIsSelect =
|
|
543
|
-
paddingFeatureFlag =
|
|
440
|
+
var toolbarOverflow = function toolbarOverflow(_ref2) {
|
|
441
|
+
var scrollable = _ref2.scrollable,
|
|
442
|
+
scrollDisabled = _ref2.scrollDisabled,
|
|
443
|
+
firstElementIsSelect = _ref2.firstElementIsSelect,
|
|
444
|
+
paddingFeatureFlag = _ref2.paddingFeatureFlag;
|
|
544
445
|
return (0, _react2.css)(
|
|
545
446
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
546
447
|
scrollable ?
|
|
@@ -626,8 +527,8 @@ var Toolbar = /*#__PURE__*/function (_Component) {
|
|
|
626
527
|
(0, _inherits2.default)(Toolbar, _Component);
|
|
627
528
|
return (0, _createClass2.default)(Toolbar, [{
|
|
628
529
|
key: "resetStyling",
|
|
629
|
-
value: function resetStyling(
|
|
630
|
-
var table =
|
|
530
|
+
value: function resetStyling(_ref3) {
|
|
531
|
+
var table = _ref3.table;
|
|
631
532
|
if (this.props.editorView) {
|
|
632
533
|
var _this$props$api;
|
|
633
534
|
var _this$props$editorVie2 = this.props.editorView,
|
|
@@ -743,14 +644,7 @@ var Toolbar = /*#__PURE__*/function (_Component) {
|
|
|
743
644
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
744
645
|
paddingFeatureFlag: (0, _platformFeatureFlags.fg)('platform_editor_floating_toolbar_padding_fix')
|
|
745
646
|
})
|
|
746
|
-
}, (0,
|
|
747
|
-
// Ignored via go/ees005
|
|
748
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
749
|
-
, (0, _extends2.default)({}, this.props, {
|
|
750
|
-
setDisableScroll: this.setDisableScroll.bind(this),
|
|
751
|
-
mountRef: this.mountRef,
|
|
752
|
-
mounted: this.state.mounted
|
|
753
|
-
})) : (0, _react2.jsx)(ToolbarItemsCollapsable
|
|
647
|
+
}, (0, _react2.jsx)(ToolbarItems
|
|
754
648
|
// Ignored via go/ees005
|
|
755
649
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
756
650
|
, (0, _extends2.default)({}, this.props, {
|
|
@@ -9,8 +9,6 @@ import { Popup } from '@atlaskit/editor-common/ui';
|
|
|
9
9
|
import { AllSelection, PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
10
10
|
import { findDomRefAtPos, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
|
|
11
11
|
import { editorExperiment, unstable_editorExperimentParam } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
12
|
-
import { contextualToolbarPlugin } from './pm-plugins/contextual-toolbar/plugin';
|
|
13
|
-
import { contextualToolbarPluginKey } from './pm-plugins/contextual-toolbar/plugin-key';
|
|
14
12
|
import forceFocusPlugin, { forceFocusSelector } from './pm-plugins/force-focus';
|
|
15
13
|
import { hideConfirmDialog } from './pm-plugins/toolbar-data/commands';
|
|
16
14
|
import { createPlugin as floatingToolbarDataPluginFactory } from './pm-plugins/toolbar-data/plugin';
|
|
@@ -144,12 +142,6 @@ export const floatingToolbarPlugin = ({
|
|
|
144
142
|
name: 'forceFocus',
|
|
145
143
|
plugin: () => forceFocusPlugin()
|
|
146
144
|
}];
|
|
147
|
-
if (!editorExperiment('platform_editor_controls', 'control')) {
|
|
148
|
-
plugins.push({
|
|
149
|
-
name: 'contextualToolbar',
|
|
150
|
-
plugin: () => contextualToolbarPlugin()
|
|
151
|
-
});
|
|
152
|
-
}
|
|
153
145
|
return plugins;
|
|
154
146
|
},
|
|
155
147
|
actions: {
|
|
@@ -163,19 +155,9 @@ export const floatingToolbarPlugin = ({
|
|
|
163
155
|
const configWithNodeInfo = (_pluginKey$getState$g = (_pluginKey$getState = pluginKey.getState(editorState)) === null || _pluginKey$getState === void 0 ? void 0 : (_pluginKey$getState$g2 = _pluginKey$getState.getConfigWithNodeInfo) === null || _pluginKey$getState$g2 === void 0 ? void 0 : _pluginKey$getState$g2.call(_pluginKey$getState, editorState)) !== null && _pluginKey$getState$g !== void 0 ? _pluginKey$getState$g : undefined;
|
|
164
156
|
return {
|
|
165
157
|
configWithNodeInfo,
|
|
166
|
-
floatingToolbarData: dataPluginKey.getState(editorState)
|
|
167
|
-
// Experimental - excluding this property from the external API whilst it's in development
|
|
168
|
-
contextualToolbar: contextualToolbarPluginKey.getState(editorState)
|
|
158
|
+
floatingToolbarData: dataPluginKey.getState(editorState)
|
|
169
159
|
};
|
|
170
160
|
},
|
|
171
|
-
commands: {
|
|
172
|
-
// Experimental
|
|
173
|
-
updateContextualToolbar: action => ({
|
|
174
|
-
tr
|
|
175
|
-
}) => {
|
|
176
|
-
return tr.setMeta(contextualToolbarPluginKey, action);
|
|
177
|
-
}
|
|
178
|
-
},
|
|
179
161
|
contentComponent({
|
|
180
162
|
popupsMountPoint,
|
|
181
163
|
popupsBoundariesElement,
|
|
@@ -255,8 +237,7 @@ export function ContentComponent({
|
|
|
255
237
|
},
|
|
256
238
|
focusTrap,
|
|
257
239
|
mediaAssistiveMessage = '',
|
|
258
|
-
stick = true
|
|
259
|
-
forceStaticToolbar
|
|
240
|
+
stick = true
|
|
260
241
|
} = config;
|
|
261
242
|
const targetRef = getDomRef(editorView, dispatchAnalyticsEvent);
|
|
262
243
|
const isEditorDisabled = editorDisabledState && editorDisabledState.editorDisabled;
|
|
@@ -376,8 +357,7 @@ export function ContentComponent({
|
|
|
376
357
|
extensionsProvider: providers.extensionProvider,
|
|
377
358
|
scrollable: scrollable,
|
|
378
359
|
api: pluginInjectionApi,
|
|
379
|
-
mediaAssistiveMessage: mediaAssistiveMessage
|
|
380
|
-
forceStaticToolbar: forceStaticToolbar
|
|
360
|
+
mediaAssistiveMessage: mediaAssistiveMessage
|
|
381
361
|
});
|
|
382
362
|
}
|
|
383
363
|
})), /*#__PURE__*/React.createElement(ConfirmationModal, {
|
|
@@ -15,12 +15,9 @@ import { areSameItems, messages } from '@atlaskit/editor-common/floating-toolbar
|
|
|
15
15
|
import { Announcer, FloatingToolbarButton as Button, FloatingToolbarSeparator as Separator } from '@atlaskit/editor-common/ui';
|
|
16
16
|
import { backgroundPaletteTooltipMessages } from '@atlaskit/editor-common/ui-color';
|
|
17
17
|
import { ColorPickerButton, ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
|
|
18
|
-
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
19
18
|
import { hexToEditorBackgroundPaletteColor } from '@atlaskit/editor-palette';
|
|
20
19
|
import { clearHoverSelection } from '@atlaskit/editor-plugin-table/commands';
|
|
21
|
-
import EditIcon from '@atlaskit/icon/core/edit';
|
|
22
20
|
import ShowMoreHorizontalIcon from '@atlaskit/icon/core/show-more-horizontal';
|
|
23
|
-
import ChevronRightIcon from '@atlaskit/icon/utility/chevron-right';
|
|
24
21
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
25
22
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
26
23
|
import { checkShouldForceFocusAndApply, forceFocusSelector } from '../pm-plugins/force-focus';
|
|
@@ -348,104 +345,6 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
|
|
|
348
345
|
// otherwise it causes an issue where multiple popups stays open
|
|
349
346
|
return !(prevProps.node.type !== nextProps.node.type || prevProps.node.attrs.localId !== nextProps.node.attrs.localId || !areSameItems(prevProps.items, nextProps.items) || !prevProps.mounted !== !nextProps.mounted);
|
|
350
347
|
});
|
|
351
|
-
const getFormattedItems = (items, isCollapsed, api) => {
|
|
352
|
-
if (isCollapsed) {
|
|
353
|
-
const updatedItems = items.filter(item => item.type === 'separator' || 'contextualToolbarDefaultVisibility' in item && item.contextualToolbarDefaultVisibility === 'visible' || !('contextualToolbarDefaultVisibility' in item)).filter((item, index, items) => item.type !== 'separator' || index > 0 && index < items.length - 1 && items[index - 1].type !== 'separator');
|
|
354
|
-
if (updatedItems[updatedItems.length - 1].type === 'separator') {
|
|
355
|
-
updatedItems.pop();
|
|
356
|
-
}
|
|
357
|
-
updatedItems.unshift({
|
|
358
|
-
type: 'separator'
|
|
359
|
-
});
|
|
360
|
-
updatedItems.unshift({
|
|
361
|
-
type: 'button',
|
|
362
|
-
icon: EditIcon,
|
|
363
|
-
title: 'Show items',
|
|
364
|
-
onClick: () => {
|
|
365
|
-
if (api) {
|
|
366
|
-
api.core.actions.execute(api.floatingToolbar.commands.updateContextualToolbar({
|
|
367
|
-
type: 'expand-toolbar'
|
|
368
|
-
}));
|
|
369
|
-
}
|
|
370
|
-
}
|
|
371
|
-
});
|
|
372
|
-
return updatedItems;
|
|
373
|
-
}
|
|
374
|
-
items.unshift({
|
|
375
|
-
type: 'separator'
|
|
376
|
-
});
|
|
377
|
-
items.unshift({
|
|
378
|
-
type: 'button',
|
|
379
|
-
icon: ChevronRightIcon,
|
|
380
|
-
title: 'Hide items',
|
|
381
|
-
onClick: () => {
|
|
382
|
-
if (api) {
|
|
383
|
-
api.core.actions.execute(api.floatingToolbar.commands.updateContextualToolbar({
|
|
384
|
-
type: 'collapse-toolbar'
|
|
385
|
-
}));
|
|
386
|
-
}
|
|
387
|
-
}
|
|
388
|
-
});
|
|
389
|
-
return items;
|
|
390
|
-
};
|
|
391
|
-
const ToolbarItemsCollapsable = /*#__PURE__*/React.memo(({
|
|
392
|
-
items,
|
|
393
|
-
groupLabel,
|
|
394
|
-
dispatchCommand,
|
|
395
|
-
popupsMountPoint,
|
|
396
|
-
popupsBoundariesElement,
|
|
397
|
-
editorView,
|
|
398
|
-
dispatchAnalyticsEvent,
|
|
399
|
-
popupsScrollableElement,
|
|
400
|
-
scrollable,
|
|
401
|
-
providerFactory,
|
|
402
|
-
extensionsProvider,
|
|
403
|
-
node,
|
|
404
|
-
setDisableScroll,
|
|
405
|
-
mountRef,
|
|
406
|
-
mounted,
|
|
407
|
-
api
|
|
408
|
-
}) => {
|
|
409
|
-
var _contextualToolbarSta;
|
|
410
|
-
const contextualToolbarState = useSharedPluginStateSelector(api, 'floatingToolbar.contextualToolbar');
|
|
411
|
-
|
|
412
|
-
// NOTE: Unsure if collapse/expand logic will be needed, for now hard code for cards
|
|
413
|
-
const isCard = node.type.name === 'inlineCard' || node.type.name === 'blockCard' || node.type.name === 'embedCard';
|
|
414
|
-
const updatedItems = isCard && items.length > 1 ? getFormattedItems(items.map(item => {
|
|
415
|
-
if ('id' in item && (item.id === 'editor.link.openLink' || item.id === 'editor.floatingToolbar.copy' || item.id === 'editor.link.commentLink')) {
|
|
416
|
-
return item;
|
|
417
|
-
}
|
|
418
|
-
return {
|
|
419
|
-
...item,
|
|
420
|
-
contextualToolbarDefaultVisibility: 'hidden'
|
|
421
|
-
};
|
|
422
|
-
}), (_contextualToolbarSta = contextualToolbarState === null || contextualToolbarState === void 0 ? void 0 : contextualToolbarState.isCollapsed) !== null && _contextualToolbarSta !== void 0 ? _contextualToolbarSta : false, api) : items;
|
|
423
|
-
return jsx(ToolbarItems, {
|
|
424
|
-
items: updatedItems,
|
|
425
|
-
groupLabel: groupLabel,
|
|
426
|
-
dispatchCommand: dispatchCommand,
|
|
427
|
-
popupsMountPoint: popupsMountPoint,
|
|
428
|
-
popupsBoundariesElement: popupsBoundariesElement,
|
|
429
|
-
editorView: editorView,
|
|
430
|
-
dispatchAnalyticsEvent: dispatchAnalyticsEvent,
|
|
431
|
-
popupsScrollableElement: popupsScrollableElement,
|
|
432
|
-
scrollable: scrollable,
|
|
433
|
-
providerFactory: providerFactory,
|
|
434
|
-
extensionsProvider: extensionsProvider,
|
|
435
|
-
node: node,
|
|
436
|
-
setDisableScroll: setDisableScroll,
|
|
437
|
-
mountRef: mountRef,
|
|
438
|
-
mounted: mounted,
|
|
439
|
-
api: api
|
|
440
|
-
});
|
|
441
|
-
}, (prevProps, nextProps) => {
|
|
442
|
-
if (!nextProps.node) {
|
|
443
|
-
return false;
|
|
444
|
-
}
|
|
445
|
-
// only rerender toolbar items if the node is different
|
|
446
|
-
// otherwise it causes an issue where multiple popups stays open
|
|
447
|
-
return !(prevProps.node.type !== nextProps.node.type || prevProps.node.attrs.localId !== nextProps.node.attrs.localId || !areSameItems(prevProps.items, nextProps.items) || !prevProps.mounted !== !nextProps.mounted);
|
|
448
|
-
});
|
|
449
348
|
const buttonGroupStyles = css({
|
|
450
349
|
display: 'flex',
|
|
451
350
|
gap: "var(--ds-space-050, 4px)"
|
|
@@ -490,7 +389,13 @@ firstElementIsSelect &&
|
|
|
490
389
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
491
390
|
css({
|
|
492
391
|
paddingLeft: "var(--ds-space-050, 4px)"
|
|
493
|
-
}))
|
|
392
|
+
})),
|
|
393
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
|
|
394
|
+
editorExperiment('platform_editor_controls', 'variant1') ?
|
|
395
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
396
|
+
css({
|
|
397
|
+
height: "var(--ds-space-500, 40px)"
|
|
398
|
+
}) : undefined);
|
|
494
399
|
|
|
495
400
|
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
496
401
|
const toolbarOverflow = ({
|
|
@@ -685,14 +590,7 @@ class Toolbar extends Component {
|
|
|
685
590
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
686
591
|
paddingFeatureFlag: fg('platform_editor_floating_toolbar_padding_fix')
|
|
687
592
|
})
|
|
688
|
-
},
|
|
689
|
-
// Ignored via go/ees005
|
|
690
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
691
|
-
, _extends({}, this.props, {
|
|
692
|
-
setDisableScroll: this.setDisableScroll.bind(this),
|
|
693
|
-
mountRef: this.mountRef,
|
|
694
|
-
mounted: this.state.mounted
|
|
695
|
-
})) : jsx(ToolbarItemsCollapsable
|
|
593
|
+
}, jsx(ToolbarItems
|
|
696
594
|
// Ignored via go/ees005
|
|
697
595
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
698
596
|
, _extends({}, this.props, {
|
|
@@ -12,8 +12,6 @@ import { Popup } from '@atlaskit/editor-common/ui';
|
|
|
12
12
|
import { AllSelection, PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
13
13
|
import { findDomRefAtPos, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
|
|
14
14
|
import { editorExperiment, unstable_editorExperimentParam } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
15
|
-
import { contextualToolbarPlugin } from './pm-plugins/contextual-toolbar/plugin';
|
|
16
|
-
import { contextualToolbarPluginKey } from './pm-plugins/contextual-toolbar/plugin-key';
|
|
17
15
|
import forceFocusPlugin, { forceFocusSelector } from './pm-plugins/force-focus';
|
|
18
16
|
import { hideConfirmDialog } from './pm-plugins/toolbar-data/commands';
|
|
19
17
|
import { createPlugin as floatingToolbarDataPluginFactory } from './pm-plugins/toolbar-data/plugin';
|
|
@@ -149,14 +147,6 @@ export var floatingToolbarPlugin = function floatingToolbarPlugin(_ref) {
|
|
|
149
147
|
return forceFocusPlugin();
|
|
150
148
|
}
|
|
151
149
|
}];
|
|
152
|
-
if (!editorExperiment('platform_editor_controls', 'control')) {
|
|
153
|
-
plugins.push({
|
|
154
|
-
name: 'contextualToolbar',
|
|
155
|
-
plugin: function plugin() {
|
|
156
|
-
return contextualToolbarPlugin();
|
|
157
|
-
}
|
|
158
|
-
});
|
|
159
|
-
}
|
|
160
150
|
return plugins;
|
|
161
151
|
},
|
|
162
152
|
actions: {
|
|
@@ -170,27 +160,16 @@ export var floatingToolbarPlugin = function floatingToolbarPlugin(_ref) {
|
|
|
170
160
|
var configWithNodeInfo = (_pluginKey$getState$g = (_pluginKey$getState = pluginKey.getState(editorState)) === null || _pluginKey$getState === void 0 || (_pluginKey$getState$g2 = _pluginKey$getState.getConfigWithNodeInfo) === null || _pluginKey$getState$g2 === void 0 ? void 0 : _pluginKey$getState$g2.call(_pluginKey$getState, editorState)) !== null && _pluginKey$getState$g !== void 0 ? _pluginKey$getState$g : undefined;
|
|
171
161
|
return {
|
|
172
162
|
configWithNodeInfo: configWithNodeInfo,
|
|
173
|
-
floatingToolbarData: dataPluginKey.getState(editorState)
|
|
174
|
-
// Experimental - excluding this property from the external API whilst it's in development
|
|
175
|
-
contextualToolbar: contextualToolbarPluginKey.getState(editorState)
|
|
163
|
+
floatingToolbarData: dataPluginKey.getState(editorState)
|
|
176
164
|
};
|
|
177
165
|
},
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
}
|
|
186
|
-
},
|
|
187
|
-
contentComponent: function contentComponent(_ref5) {
|
|
188
|
-
var popupsMountPoint = _ref5.popupsMountPoint,
|
|
189
|
-
popupsBoundariesElement = _ref5.popupsBoundariesElement,
|
|
190
|
-
popupsScrollableElement = _ref5.popupsScrollableElement,
|
|
191
|
-
editorView = _ref5.editorView,
|
|
192
|
-
providerFactory = _ref5.providerFactory,
|
|
193
|
-
dispatchAnalyticsEvent = _ref5.dispatchAnalyticsEvent;
|
|
166
|
+
contentComponent: function contentComponent(_ref4) {
|
|
167
|
+
var popupsMountPoint = _ref4.popupsMountPoint,
|
|
168
|
+
popupsBoundariesElement = _ref4.popupsBoundariesElement,
|
|
169
|
+
popupsScrollableElement = _ref4.popupsScrollableElement,
|
|
170
|
+
editorView = _ref4.editorView,
|
|
171
|
+
providerFactory = _ref4.providerFactory,
|
|
172
|
+
dispatchAnalyticsEvent = _ref4.dispatchAnalyticsEvent;
|
|
194
173
|
return /*#__PURE__*/React.createElement(ContentComponent, {
|
|
195
174
|
editorView: editorView,
|
|
196
175
|
pluginInjectionApi: api,
|
|
@@ -203,23 +182,23 @@ export var floatingToolbarPlugin = function floatingToolbarPlugin(_ref) {
|
|
|
203
182
|
}
|
|
204
183
|
};
|
|
205
184
|
};
|
|
206
|
-
export function ContentComponent(
|
|
185
|
+
export function ContentComponent(_ref5) {
|
|
207
186
|
var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d;
|
|
208
|
-
var pluginInjectionApi =
|
|
209
|
-
editorView =
|
|
210
|
-
popupsMountPoint =
|
|
211
|
-
popupsBoundariesElement =
|
|
212
|
-
popupsScrollableElement =
|
|
213
|
-
providerFactory =
|
|
214
|
-
dispatchAnalyticsEvent =
|
|
187
|
+
var pluginInjectionApi = _ref5.pluginInjectionApi,
|
|
188
|
+
editorView = _ref5.editorView,
|
|
189
|
+
popupsMountPoint = _ref5.popupsMountPoint,
|
|
190
|
+
popupsBoundariesElement = _ref5.popupsBoundariesElement,
|
|
191
|
+
popupsScrollableElement = _ref5.popupsScrollableElement,
|
|
192
|
+
providerFactory = _ref5.providerFactory,
|
|
193
|
+
dispatchAnalyticsEvent = _ref5.dispatchAnalyticsEvent;
|
|
215
194
|
var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['floatingToolbar', 'editorDisabled', 'editorViewMode', 'blockControls']),
|
|
216
195
|
floatingToolbarState = _useSharedPluginState.floatingToolbarState,
|
|
217
196
|
editorDisabledState = _useSharedPluginState.editorDisabledState,
|
|
218
197
|
editorViewModeState = _useSharedPluginState.editorViewModeState,
|
|
219
198
|
blockControlsState = _useSharedPluginState.blockControlsState;
|
|
220
|
-
var
|
|
221
|
-
configWithNodeInfo =
|
|
222
|
-
floatingToolbarData =
|
|
199
|
+
var _ref6 = floatingToolbarState !== null && floatingToolbarState !== void 0 ? floatingToolbarState : {},
|
|
200
|
+
configWithNodeInfo = _ref6.configWithNodeInfo,
|
|
201
|
+
floatingToolbarData = _ref6.floatingToolbarData;
|
|
223
202
|
if (!configWithNodeInfo || !configWithNodeInfo.config || typeof ((_configWithNodeInfo$c = configWithNodeInfo.config) === null || _configWithNodeInfo$c === void 0 ? void 0 : _configWithNodeInfo$c.visible) !== 'undefined' && !((_configWithNodeInfo$c2 = configWithNodeInfo.config) !== null && _configWithNodeInfo$c2 !== void 0 && _configWithNodeInfo$c2.visible)) {
|
|
224
203
|
return null;
|
|
225
204
|
}
|
|
@@ -259,8 +238,7 @@ export function ContentComponent(_ref6) {
|
|
|
259
238
|
_config$mediaAssistiv = config.mediaAssistiveMessage,
|
|
260
239
|
mediaAssistiveMessage = _config$mediaAssistiv === void 0 ? '' : _config$mediaAssistiv,
|
|
261
240
|
_config$stick = config.stick,
|
|
262
|
-
stick = _config$stick === void 0 ? true : _config$stick
|
|
263
|
-
forceStaticToolbar = config.forceStaticToolbar;
|
|
241
|
+
stick = _config$stick === void 0 ? true : _config$stick;
|
|
264
242
|
var targetRef = getDomRef(editorView, dispatchAnalyticsEvent);
|
|
265
243
|
var isEditorDisabled = editorDisabledState && editorDisabledState.editorDisabled;
|
|
266
244
|
var isInViewMode = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
|
|
@@ -324,8 +302,8 @@ export function ContentComponent(_ref6) {
|
|
|
324
302
|
};
|
|
325
303
|
|
|
326
304
|
// Confirm dialog
|
|
327
|
-
var
|
|
328
|
-
confirmDialogForItem =
|
|
305
|
+
var _ref7 = floatingToolbarData || {},
|
|
306
|
+
confirmDialogForItem = _ref7.confirmDialogForItem;
|
|
329
307
|
var confirmButtonItem = confirmDialogForItem ?
|
|
330
308
|
// Ignored via go/ees005
|
|
331
309
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
@@ -388,8 +366,7 @@ export function ContentComponent(_ref6) {
|
|
|
388
366
|
extensionsProvider: providers.extensionProvider,
|
|
389
367
|
scrollable: scrollable,
|
|
390
368
|
api: pluginInjectionApi,
|
|
391
|
-
mediaAssistiveMessage: mediaAssistiveMessage
|
|
392
|
-
forceStaticToolbar: forceStaticToolbar
|
|
369
|
+
mediaAssistiveMessage: mediaAssistiveMessage
|
|
393
370
|
});
|
|
394
371
|
}
|
|
395
372
|
})), /*#__PURE__*/React.createElement(ConfirmationModal, {
|
package/dist/esm/ui/Toolbar.js
CHANGED
|
@@ -7,8 +7,6 @@ import _inherits from "@babel/runtime/helpers/inherits";
|
|
|
7
7
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
8
8
|
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
|
|
9
9
|
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
10
|
-
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; }
|
|
11
|
-
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; }
|
|
12
10
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation */
|
|
13
11
|
/**
|
|
14
12
|
* @jsxRuntime classic
|
|
@@ -24,12 +22,9 @@ import { areSameItems, messages } from '@atlaskit/editor-common/floating-toolbar
|
|
|
24
22
|
import { Announcer, FloatingToolbarButton as Button, FloatingToolbarSeparator as Separator } from '@atlaskit/editor-common/ui';
|
|
25
23
|
import { backgroundPaletteTooltipMessages } from '@atlaskit/editor-common/ui-color';
|
|
26
24
|
import { ColorPickerButton, ToolbarArrowKeyNavigationProvider } from '@atlaskit/editor-common/ui-menu';
|
|
27
|
-
import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
|
|
28
25
|
import { hexToEditorBackgroundPaletteColor } from '@atlaskit/editor-palette';
|
|
29
26
|
import { clearHoverSelection } from '@atlaskit/editor-plugin-table/commands';
|
|
30
|
-
import EditIcon from '@atlaskit/icon/core/edit';
|
|
31
27
|
import ShowMoreHorizontalIcon from '@atlaskit/icon/core/show-more-horizontal';
|
|
32
|
-
import ChevronRightIcon from '@atlaskit/icon/utility/chevron-right';
|
|
33
28
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
34
29
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
35
30
|
import { checkShouldForceFocusAndApply, forceFocusSelector } from '../pm-plugins/force-focus';
|
|
@@ -380,106 +375,6 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
|
|
|
380
375
|
// otherwise it causes an issue where multiple popups stays open
|
|
381
376
|
return !(prevProps.node.type !== nextProps.node.type || prevProps.node.attrs.localId !== nextProps.node.attrs.localId || !areSameItems(prevProps.items, nextProps.items) || !prevProps.mounted !== !nextProps.mounted);
|
|
382
377
|
});
|
|
383
|
-
var getFormattedItems = function getFormattedItems(items, isCollapsed, api) {
|
|
384
|
-
if (isCollapsed) {
|
|
385
|
-
var updatedItems = items.filter(function (item) {
|
|
386
|
-
return item.type === 'separator' || 'contextualToolbarDefaultVisibility' in item && item.contextualToolbarDefaultVisibility === 'visible' || !('contextualToolbarDefaultVisibility' in item);
|
|
387
|
-
}).filter(function (item, index, items) {
|
|
388
|
-
return item.type !== 'separator' || index > 0 && index < items.length - 1 && items[index - 1].type !== 'separator';
|
|
389
|
-
});
|
|
390
|
-
if (updatedItems[updatedItems.length - 1].type === 'separator') {
|
|
391
|
-
updatedItems.pop();
|
|
392
|
-
}
|
|
393
|
-
updatedItems.unshift({
|
|
394
|
-
type: 'separator'
|
|
395
|
-
});
|
|
396
|
-
updatedItems.unshift({
|
|
397
|
-
type: 'button',
|
|
398
|
-
icon: EditIcon,
|
|
399
|
-
title: 'Show items',
|
|
400
|
-
onClick: function onClick() {
|
|
401
|
-
if (api) {
|
|
402
|
-
api.core.actions.execute(api.floatingToolbar.commands.updateContextualToolbar({
|
|
403
|
-
type: 'expand-toolbar'
|
|
404
|
-
}));
|
|
405
|
-
}
|
|
406
|
-
}
|
|
407
|
-
});
|
|
408
|
-
return updatedItems;
|
|
409
|
-
}
|
|
410
|
-
items.unshift({
|
|
411
|
-
type: 'separator'
|
|
412
|
-
});
|
|
413
|
-
items.unshift({
|
|
414
|
-
type: 'button',
|
|
415
|
-
icon: ChevronRightIcon,
|
|
416
|
-
title: 'Hide items',
|
|
417
|
-
onClick: function onClick() {
|
|
418
|
-
if (api) {
|
|
419
|
-
api.core.actions.execute(api.floatingToolbar.commands.updateContextualToolbar({
|
|
420
|
-
type: 'collapse-toolbar'
|
|
421
|
-
}));
|
|
422
|
-
}
|
|
423
|
-
}
|
|
424
|
-
});
|
|
425
|
-
return items;
|
|
426
|
-
};
|
|
427
|
-
var ToolbarItemsCollapsable = /*#__PURE__*/React.memo(function (_ref2) {
|
|
428
|
-
var _contextualToolbarSta;
|
|
429
|
-
var items = _ref2.items,
|
|
430
|
-
groupLabel = _ref2.groupLabel,
|
|
431
|
-
dispatchCommand = _ref2.dispatchCommand,
|
|
432
|
-
popupsMountPoint = _ref2.popupsMountPoint,
|
|
433
|
-
popupsBoundariesElement = _ref2.popupsBoundariesElement,
|
|
434
|
-
editorView = _ref2.editorView,
|
|
435
|
-
dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent,
|
|
436
|
-
popupsScrollableElement = _ref2.popupsScrollableElement,
|
|
437
|
-
scrollable = _ref2.scrollable,
|
|
438
|
-
providerFactory = _ref2.providerFactory,
|
|
439
|
-
extensionsProvider = _ref2.extensionsProvider,
|
|
440
|
-
node = _ref2.node,
|
|
441
|
-
setDisableScroll = _ref2.setDisableScroll,
|
|
442
|
-
mountRef = _ref2.mountRef,
|
|
443
|
-
mounted = _ref2.mounted,
|
|
444
|
-
api = _ref2.api;
|
|
445
|
-
var contextualToolbarState = useSharedPluginStateSelector(api, 'floatingToolbar.contextualToolbar');
|
|
446
|
-
|
|
447
|
-
// NOTE: Unsure if collapse/expand logic will be needed, for now hard code for cards
|
|
448
|
-
var isCard = node.type.name === 'inlineCard' || node.type.name === 'blockCard' || node.type.name === 'embedCard';
|
|
449
|
-
var updatedItems = isCard && items.length > 1 ? getFormattedItems(items.map(function (item) {
|
|
450
|
-
if ('id' in item && (item.id === 'editor.link.openLink' || item.id === 'editor.floatingToolbar.copy' || item.id === 'editor.link.commentLink')) {
|
|
451
|
-
return item;
|
|
452
|
-
}
|
|
453
|
-
return _objectSpread(_objectSpread({}, item), {}, {
|
|
454
|
-
contextualToolbarDefaultVisibility: 'hidden'
|
|
455
|
-
});
|
|
456
|
-
}), (_contextualToolbarSta = contextualToolbarState === null || contextualToolbarState === void 0 ? void 0 : contextualToolbarState.isCollapsed) !== null && _contextualToolbarSta !== void 0 ? _contextualToolbarSta : false, api) : items;
|
|
457
|
-
return jsx(ToolbarItems, {
|
|
458
|
-
items: updatedItems,
|
|
459
|
-
groupLabel: groupLabel,
|
|
460
|
-
dispatchCommand: dispatchCommand,
|
|
461
|
-
popupsMountPoint: popupsMountPoint,
|
|
462
|
-
popupsBoundariesElement: popupsBoundariesElement,
|
|
463
|
-
editorView: editorView,
|
|
464
|
-
dispatchAnalyticsEvent: dispatchAnalyticsEvent,
|
|
465
|
-
popupsScrollableElement: popupsScrollableElement,
|
|
466
|
-
scrollable: scrollable,
|
|
467
|
-
providerFactory: providerFactory,
|
|
468
|
-
extensionsProvider: extensionsProvider,
|
|
469
|
-
node: node,
|
|
470
|
-
setDisableScroll: setDisableScroll,
|
|
471
|
-
mountRef: mountRef,
|
|
472
|
-
mounted: mounted,
|
|
473
|
-
api: api
|
|
474
|
-
});
|
|
475
|
-
}, function (prevProps, nextProps) {
|
|
476
|
-
if (!nextProps.node) {
|
|
477
|
-
return false;
|
|
478
|
-
}
|
|
479
|
-
// only rerender toolbar items if the node is different
|
|
480
|
-
// otherwise it causes an issue where multiple popups stays open
|
|
481
|
-
return !(prevProps.node.type !== nextProps.node.type || prevProps.node.attrs.localId !== nextProps.node.attrs.localId || !areSameItems(prevProps.items, nextProps.items) || !prevProps.mounted !== !nextProps.mounted);
|
|
482
|
-
});
|
|
483
378
|
var buttonGroupStyles = css({
|
|
484
379
|
display: 'flex',
|
|
485
380
|
gap: "var(--ds-space-050, 4px)"
|
|
@@ -525,15 +420,21 @@ var toolbarContainer = function toolbarContainer(scrollable, hasSelect, firstEle
|
|
|
525
420
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
526
421
|
css({
|
|
527
422
|
paddingLeft: "var(--ds-space-050, 4px)"
|
|
528
|
-
}))
|
|
423
|
+
})),
|
|
424
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
|
|
425
|
+
editorExperiment('platform_editor_controls', 'variant1') ?
|
|
426
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
427
|
+
css({
|
|
428
|
+
height: "var(--ds-space-500, 40px)"
|
|
429
|
+
}) : undefined);
|
|
529
430
|
};
|
|
530
431
|
|
|
531
432
|
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
|
|
532
|
-
var toolbarOverflow = function toolbarOverflow(
|
|
533
|
-
var scrollable =
|
|
534
|
-
scrollDisabled =
|
|
535
|
-
firstElementIsSelect =
|
|
536
|
-
paddingFeatureFlag =
|
|
433
|
+
var toolbarOverflow = function toolbarOverflow(_ref2) {
|
|
434
|
+
var scrollable = _ref2.scrollable,
|
|
435
|
+
scrollDisabled = _ref2.scrollDisabled,
|
|
436
|
+
firstElementIsSelect = _ref2.firstElementIsSelect,
|
|
437
|
+
paddingFeatureFlag = _ref2.paddingFeatureFlag;
|
|
537
438
|
return css(
|
|
538
439
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
539
440
|
scrollable ?
|
|
@@ -619,8 +520,8 @@ var Toolbar = /*#__PURE__*/function (_Component) {
|
|
|
619
520
|
_inherits(Toolbar, _Component);
|
|
620
521
|
return _createClass(Toolbar, [{
|
|
621
522
|
key: "resetStyling",
|
|
622
|
-
value: function resetStyling(
|
|
623
|
-
var table =
|
|
523
|
+
value: function resetStyling(_ref3) {
|
|
524
|
+
var table = _ref3.table;
|
|
624
525
|
if (this.props.editorView) {
|
|
625
526
|
var _this$props$api;
|
|
626
527
|
var _this$props$editorVie2 = this.props.editorView,
|
|
@@ -736,14 +637,7 @@ var Toolbar = /*#__PURE__*/function (_Component) {
|
|
|
736
637
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
|
|
737
638
|
paddingFeatureFlag: fg('platform_editor_floating_toolbar_padding_fix')
|
|
738
639
|
})
|
|
739
|
-
},
|
|
740
|
-
// Ignored via go/ees005
|
|
741
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
742
|
-
, _extends({}, this.props, {
|
|
743
|
-
setDisableScroll: this.setDisableScroll.bind(this),
|
|
744
|
-
mountRef: this.mountRef,
|
|
745
|
-
mounted: this.state.mounted
|
|
746
|
-
})) : jsx(ToolbarItemsCollapsable
|
|
640
|
+
}, jsx(ToolbarItems
|
|
747
641
|
// Ignored via go/ees005
|
|
748
642
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
749
643
|
, _extends({}, this.props, {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { FloatingToolbarConfig, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
|
|
2
2
|
import type { BlockControlsPlugin } from '@atlaskit/editor-plugin-block-controls';
|
|
3
3
|
import type { ContextPanelPlugin } from '@atlaskit/editor-plugin-context-panel';
|
|
4
4
|
import type { CopyButtonPlugin } from '@atlaskit/editor-plugin-copy-button';
|
|
@@ -10,7 +10,6 @@ import type { ExtensionPlugin } from '@atlaskit/editor-plugin-extension';
|
|
|
10
10
|
import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
|
|
11
11
|
import type { Node } from '@atlaskit/editor-prosemirror/model';
|
|
12
12
|
import type { EditorState, Transaction } from '@atlaskit/editor-prosemirror/state';
|
|
13
|
-
import type { ContextualToolbarActions, ContextualToolbarState } from './pm-plugins/contextual-toolbar/types';
|
|
14
13
|
export type ConfigWithNodeInfo = {
|
|
15
14
|
config: FloatingToolbarConfig | undefined;
|
|
16
15
|
pos: number;
|
|
@@ -48,17 +47,3 @@ export type FloatingToolbarPlugin = NextEditorPlugin<'floatingToolbar', {
|
|
|
48
47
|
floatingToolbarData: FloatingToolbarPluginData | undefined;
|
|
49
48
|
} | undefined;
|
|
50
49
|
}>;
|
|
51
|
-
export type FloatingToolbarPluginNext = NextEditorPlugin<'floatingToolbar', {
|
|
52
|
-
dependencies: FloatingToolbarPluginDependencies;
|
|
53
|
-
actions: {
|
|
54
|
-
forceFocusSelector: ForceFocusSelector;
|
|
55
|
-
};
|
|
56
|
-
sharedState: {
|
|
57
|
-
configWithNodeInfo: ConfigWithNodeInfo | undefined;
|
|
58
|
-
floatingToolbarData: FloatingToolbarPluginData | undefined;
|
|
59
|
-
contextualToolbar: ContextualToolbarState | undefined;
|
|
60
|
-
} | undefined;
|
|
61
|
-
commands: {
|
|
62
|
-
updateContextualToolbar: (action: ContextualToolbarActions) => EditorCommand;
|
|
63
|
-
};
|
|
64
|
-
}>;
|
|
@@ -30,7 +30,6 @@ export interface Props {
|
|
|
30
30
|
scrollable?: boolean;
|
|
31
31
|
api: ExtractInjectionAPI<FloatingToolbarPlugin> | undefined;
|
|
32
32
|
mediaAssistiveMessage?: string;
|
|
33
|
-
forceStaticToolbar?: boolean;
|
|
34
33
|
}
|
|
35
34
|
type GroupedItems = (Item | Item[])[];
|
|
36
35
|
export declare function groupItems(items: Item[]): GroupedItems;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { FloatingToolbarConfig, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
|
|
2
2
|
import type { BlockControlsPlugin } from '@atlaskit/editor-plugin-block-controls';
|
|
3
3
|
import type { ContextPanelPlugin } from '@atlaskit/editor-plugin-context-panel';
|
|
4
4
|
import type { CopyButtonPlugin } from '@atlaskit/editor-plugin-copy-button';
|
|
@@ -10,7 +10,6 @@ import type { ExtensionPlugin } from '@atlaskit/editor-plugin-extension';
|
|
|
10
10
|
import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
|
|
11
11
|
import type { Node } from '@atlaskit/editor-prosemirror/model';
|
|
12
12
|
import type { EditorState, Transaction } from '@atlaskit/editor-prosemirror/state';
|
|
13
|
-
import type { ContextualToolbarActions, ContextualToolbarState } from './pm-plugins/contextual-toolbar/types';
|
|
14
13
|
export type ConfigWithNodeInfo = {
|
|
15
14
|
config: FloatingToolbarConfig | undefined;
|
|
16
15
|
pos: number;
|
|
@@ -48,17 +47,3 @@ export type FloatingToolbarPlugin = NextEditorPlugin<'floatingToolbar', {
|
|
|
48
47
|
floatingToolbarData: FloatingToolbarPluginData | undefined;
|
|
49
48
|
} | undefined;
|
|
50
49
|
}>;
|
|
51
|
-
export type FloatingToolbarPluginNext = NextEditorPlugin<'floatingToolbar', {
|
|
52
|
-
dependencies: FloatingToolbarPluginDependencies;
|
|
53
|
-
actions: {
|
|
54
|
-
forceFocusSelector: ForceFocusSelector;
|
|
55
|
-
};
|
|
56
|
-
sharedState: {
|
|
57
|
-
configWithNodeInfo: ConfigWithNodeInfo | undefined;
|
|
58
|
-
floatingToolbarData: FloatingToolbarPluginData | undefined;
|
|
59
|
-
contextualToolbar: ContextualToolbarState | undefined;
|
|
60
|
-
} | undefined;
|
|
61
|
-
commands: {
|
|
62
|
-
updateContextualToolbar: (action: ContextualToolbarActions) => EditorCommand;
|
|
63
|
-
};
|
|
64
|
-
}>;
|
|
@@ -30,7 +30,6 @@ export interface Props {
|
|
|
30
30
|
scrollable?: boolean;
|
|
31
31
|
api: ExtractInjectionAPI<FloatingToolbarPlugin> | undefined;
|
|
32
32
|
mediaAssistiveMessage?: string;
|
|
33
|
-
forceStaticToolbar?: boolean;
|
|
34
33
|
}
|
|
35
34
|
type GroupedItems = (Item | Item[])[];
|
|
36
35
|
export declare function groupItems(items: Item[]): GroupedItems;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-floating-toolbar",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "3.0.0",
|
|
4
4
|
"description": "Floating toolbar plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"@atlaskit/adf-utils": "^19.18.0",
|
|
27
27
|
"@atlaskit/button": "^21.1.0",
|
|
28
28
|
"@atlaskit/checkbox": "^17.0.0",
|
|
29
|
-
"@atlaskit/editor-common": "^100.
|
|
29
|
+
"@atlaskit/editor-common": "^100.3.0",
|
|
30
30
|
"@atlaskit/editor-palette": "2.0.0",
|
|
31
31
|
"@atlaskit/editor-plugin-block-controls": "^3.1.0",
|
|
32
32
|
"@atlaskit/editor-plugin-context-panel": "^3.0.0",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"@atlaskit/editor-plugin-editor-viewmode": "^3.0.0",
|
|
37
37
|
"@atlaskit/editor-plugin-emoji": "^3.0.0",
|
|
38
38
|
"@atlaskit/editor-plugin-extension": "^4.0.0",
|
|
39
|
-
"@atlaskit/editor-plugin-table": "^10.
|
|
39
|
+
"@atlaskit/editor-plugin-table": "^10.2.0",
|
|
40
40
|
"@atlaskit/editor-prosemirror": "7.0.0",
|
|
41
41
|
"@atlaskit/emoji": "^68.0.0",
|
|
42
42
|
"@atlaskit/icon": "^24.1.0",
|
|
@@ -44,9 +44,9 @@
|
|
|
44
44
|
"@atlaskit/modal-dialog": "^13.0.0",
|
|
45
45
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
46
46
|
"@atlaskit/primitives": "^14.1.0",
|
|
47
|
-
"@atlaskit/select": "^
|
|
47
|
+
"@atlaskit/select": "^20.0.0",
|
|
48
48
|
"@atlaskit/theme": "^17.0.0",
|
|
49
|
-
"@atlaskit/tmp-editor-statsig": "^3.
|
|
49
|
+
"@atlaskit/tmp-editor-statsig": "^3.3.0",
|
|
50
50
|
"@atlaskit/tokens": "^4.2.0",
|
|
51
51
|
"@atlaskit/tooltip": "^20.0.0",
|
|
52
52
|
"@babel/runtime": "^7.0.0",
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.contextualToolbarPluginKey = void 0;
|
|
7
|
-
var _state = require("@atlaskit/editor-prosemirror/state");
|
|
8
|
-
var contextualToolbarPluginKey = exports.contextualToolbarPluginKey = new _state.PluginKey('contextualToolbar');
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.contextualToolbarPlugin = void 0;
|
|
7
|
-
var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
|
|
8
|
-
var _pluginKey = require("./plugin-key");
|
|
9
|
-
var defaultEditState = {
|
|
10
|
-
isCollapsed: true
|
|
11
|
-
};
|
|
12
|
-
var contextualToolbarPlugin = exports.contextualToolbarPlugin = function contextualToolbarPlugin() {
|
|
13
|
-
return new _safePlugin.SafePlugin({
|
|
14
|
-
key: _pluginKey.contextualToolbarPluginKey,
|
|
15
|
-
state: {
|
|
16
|
-
init: function init() {
|
|
17
|
-
return defaultEditState;
|
|
18
|
-
},
|
|
19
|
-
apply: function apply(tr, pluginState) {
|
|
20
|
-
var action = tr.getMeta(_pluginKey.contextualToolbarPluginKey);
|
|
21
|
-
if (action) {
|
|
22
|
-
switch (action.type) {
|
|
23
|
-
case 'expand-toolbar':
|
|
24
|
-
return {
|
|
25
|
-
isCollapsed: false
|
|
26
|
-
};
|
|
27
|
-
case 'collapse-toolbar':
|
|
28
|
-
return {
|
|
29
|
-
isCollapsed: true
|
|
30
|
-
};
|
|
31
|
-
default:
|
|
32
|
-
return pluginState;
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
return pluginState;
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
});
|
|
39
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
2
|
-
import { contextualToolbarPluginKey } from './plugin-key';
|
|
3
|
-
const defaultEditState = {
|
|
4
|
-
isCollapsed: true
|
|
5
|
-
};
|
|
6
|
-
export const contextualToolbarPlugin = () => {
|
|
7
|
-
return new SafePlugin({
|
|
8
|
-
key: contextualToolbarPluginKey,
|
|
9
|
-
state: {
|
|
10
|
-
init() {
|
|
11
|
-
return defaultEditState;
|
|
12
|
-
},
|
|
13
|
-
apply(tr, pluginState) {
|
|
14
|
-
const action = tr.getMeta(contextualToolbarPluginKey);
|
|
15
|
-
if (action) {
|
|
16
|
-
switch (action.type) {
|
|
17
|
-
case 'expand-toolbar':
|
|
18
|
-
return {
|
|
19
|
-
isCollapsed: false
|
|
20
|
-
};
|
|
21
|
-
case 'collapse-toolbar':
|
|
22
|
-
return {
|
|
23
|
-
isCollapsed: true
|
|
24
|
-
};
|
|
25
|
-
default:
|
|
26
|
-
return pluginState;
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
return pluginState;
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
});
|
|
33
|
-
};
|
|
File without changes
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
2
|
-
import { contextualToolbarPluginKey } from './plugin-key';
|
|
3
|
-
var defaultEditState = {
|
|
4
|
-
isCollapsed: true
|
|
5
|
-
};
|
|
6
|
-
export var contextualToolbarPlugin = function contextualToolbarPlugin() {
|
|
7
|
-
return new SafePlugin({
|
|
8
|
-
key: contextualToolbarPluginKey,
|
|
9
|
-
state: {
|
|
10
|
-
init: function init() {
|
|
11
|
-
return defaultEditState;
|
|
12
|
-
},
|
|
13
|
-
apply: function apply(tr, pluginState) {
|
|
14
|
-
var action = tr.getMeta(contextualToolbarPluginKey);
|
|
15
|
-
if (action) {
|
|
16
|
-
switch (action.type) {
|
|
17
|
-
case 'expand-toolbar':
|
|
18
|
-
return {
|
|
19
|
-
isCollapsed: false
|
|
20
|
-
};
|
|
21
|
-
case 'collapse-toolbar':
|
|
22
|
-
return {
|
|
23
|
-
isCollapsed: true
|
|
24
|
-
};
|
|
25
|
-
default:
|
|
26
|
-
return pluginState;
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
return pluginState;
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
});
|
|
33
|
-
};
|
|
File without changes
|