@atlaskit/editor-plugin-floating-toolbar 31.0.2 → 31.0.4
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/floatingToolbarPlugin.js +8 -4
- package/dist/cjs/hooks/useToolbarExternalStore.js +19 -0
- package/dist/es2019/floatingToolbarPlugin.js +6 -2
- package/dist/es2019/hooks/useToolbarExternalStore.js +9 -0
- package/dist/esm/floatingToolbarPlugin.js +8 -4
- package/dist/esm/hooks/useToolbarExternalStore.js +13 -0
- package/dist/types/hooks/useToolbarExternalStore.d.ts +3 -0
- package/package.json +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-floating-toolbar
|
|
2
2
|
|
|
3
|
+
## 31.0.4
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 31.0.3
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`f268dee2526f7`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f268dee2526f7) -
|
|
14
|
+
Migrate Smart Card registration and removal from transactions to editor actions behind
|
|
15
|
+
`platform_editor_reduce_forced_layout_2`. Remove unused card overlay registration behind
|
|
16
|
+
`platform_editor_reduce_forced_layout_2`.
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
|
|
3
19
|
## 31.0.2
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
|
@@ -24,6 +24,7 @@ var _useSharedPluginState2 = require("@atlaskit/editor-common/useSharedPluginSta
|
|
|
24
24
|
var _state = require("@atlaskit/editor-prosemirror/state");
|
|
25
25
|
var _utils = require("@atlaskit/editor-prosemirror/utils");
|
|
26
26
|
var _fg = require("@atlaskit/platform-feature-flags/fg");
|
|
27
|
+
var _useToolbarExternalStore = require("./hooks/useToolbarExternalStore");
|
|
27
28
|
var _commands = require("./pm-plugins/commands");
|
|
28
29
|
var _forceFocus = _interopRequireWildcard(require("./pm-plugins/force-focus"));
|
|
29
30
|
var _commands2 = require("./pm-plugins/toolbar-data/commands");
|
|
@@ -235,7 +236,7 @@ var floatingToolbarPlugin = exports.floatingToolbarPlugin = function floatingToo
|
|
|
235
236
|
* @returns JSX element representing the floating toolbar or null if not visible
|
|
236
237
|
*/
|
|
237
238
|
function ContentComponent(_ref5) {
|
|
238
|
-
var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d, _confirmButtonItem, _confirmButtonItem2, _confirmButtonItem3;
|
|
239
|
+
var _configWithNodeInfo, _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d, _confirmButtonItem, _confirmButtonItem2, _confirmButtonItem3;
|
|
239
240
|
var pluginInjectionApi = _ref5.pluginInjectionApi,
|
|
240
241
|
editorView = _ref5.editorView,
|
|
241
242
|
popupsMountPoint = _ref5.popupsMountPoint,
|
|
@@ -259,6 +260,9 @@ function ContentComponent(_ref5) {
|
|
|
259
260
|
// for example, trigger remix on panel will not hide the floating toolbar
|
|
260
261
|
configWithNodeInfo = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 || (_pluginInjectionApi$f = _pluginInjectionApi$f.sharedState.currentState()) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.configWithNodeInfo;
|
|
261
262
|
}
|
|
263
|
+
|
|
264
|
+
// Subscribe to an external store for rerenders. Used by editor-plugin-card for card registration via editor actions
|
|
265
|
+
(0, _useToolbarExternalStore.useToolbarExternalStore)((_configWithNodeInfo = configWithNodeInfo) === null || _configWithNodeInfo === void 0 || (_configWithNodeInfo = _configWithNodeInfo.config) === null || _configWithNodeInfo === void 0 ? void 0 : _configWithNodeInfo.externalStore);
|
|
262
266
|
if ((0, _isSsr.isSSR)()) {
|
|
263
267
|
return null;
|
|
264
268
|
}
|
|
@@ -268,9 +272,9 @@ function ContentComponent(_ref5) {
|
|
|
268
272
|
if (userIntentState !== null && userIntentState !== void 0 && userIntentState.currentUserIntent && SUPPRESS_TOOLBAR_USER_INTENTS.includes(userIntentState === null || userIntentState === void 0 ? void 0 : userIntentState.currentUserIntent)) {
|
|
269
273
|
return null;
|
|
270
274
|
}
|
|
271
|
-
var
|
|
272
|
-
config =
|
|
273
|
-
node =
|
|
275
|
+
var _configWithNodeInfo2 = configWithNodeInfo,
|
|
276
|
+
config = _configWithNodeInfo2.config,
|
|
277
|
+
node = _configWithNodeInfo2.node;
|
|
274
278
|
|
|
275
279
|
// When the new inline editor-toolbar is enabled, suppress floating toolbar for text selections.
|
|
276
280
|
if (Boolean(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.toolbar)) {
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useToolbarExternalStore = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var emptySnapshot = function emptySnapshot() {
|
|
9
|
+
return 0;
|
|
10
|
+
};
|
|
11
|
+
var emptySubscription = function emptySubscription() {
|
|
12
|
+
return function () {};
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
/** Refresh toolbar content when its optional external store changes. */
|
|
16
|
+
var useToolbarExternalStore = exports.useToolbarExternalStore = function useToolbarExternalStore(store) {
|
|
17
|
+
var _store$subscribe, _store$getSnapshot;
|
|
18
|
+
(0, _react.useSyncExternalStore)((_store$subscribe = store === null || store === void 0 ? void 0 : store.subscribe) !== null && _store$subscribe !== void 0 ? _store$subscribe : emptySubscription, (_store$getSnapshot = store === null || store === void 0 ? void 0 : store.getSnapshot) !== null && _store$getSnapshot !== void 0 ? _store$getSnapshot : emptySnapshot, emptySnapshot);
|
|
19
|
+
};
|
|
@@ -11,6 +11,7 @@ import { useSharedPluginState } from '@atlaskit/editor-common/useSharedPluginSta
|
|
|
11
11
|
import { AllSelection, PluginKey, TextSelection } from '@atlaskit/editor-prosemirror/state';
|
|
12
12
|
import { findDomRefAtPos, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
|
|
13
13
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
14
|
+
import { useToolbarExternalStore } from './hooks/useToolbarExternalStore';
|
|
14
15
|
import { copyNode } from './pm-plugins/commands';
|
|
15
16
|
import forceFocusPlugin, { forceFocusSelector } from './pm-plugins/force-focus';
|
|
16
17
|
import { hideConfirmDialog } from './pm-plugins/toolbar-data/commands';
|
|
@@ -226,7 +227,7 @@ export function ContentComponent({
|
|
|
226
227
|
providerFactory,
|
|
227
228
|
dispatchAnalyticsEvent
|
|
228
229
|
}) {
|
|
229
|
-
var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d, _confirmButtonItem, _confirmButtonItem2, _confirmButtonItem3;
|
|
230
|
+
var _configWithNodeInfo, _configWithNodeInfo$c, _configWithNodeInfo$c2, _configWithNodeInfo$c3, _items, _pluginInjectionApi$c, _pluginInjectionApi$d, _confirmButtonItem, _confirmButtonItem2, _confirmButtonItem3;
|
|
230
231
|
const {
|
|
231
232
|
floatingToolbarState,
|
|
232
233
|
editorDisabledState,
|
|
@@ -245,10 +246,13 @@ export function ContentComponent({
|
|
|
245
246
|
// for example, trigger remix on panel will not hide the floating toolbar
|
|
246
247
|
configWithNodeInfo = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 ? void 0 : (_pluginInjectionApi$f2 = _pluginInjectionApi$f.sharedState.currentState()) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.configWithNodeInfo;
|
|
247
248
|
}
|
|
249
|
+
|
|
250
|
+
// Subscribe to an external store for rerenders. Used by editor-plugin-card for card registration via editor actions
|
|
251
|
+
useToolbarExternalStore((_configWithNodeInfo = configWithNodeInfo) === null || _configWithNodeInfo === void 0 ? void 0 : (_configWithNodeInfo$c = _configWithNodeInfo.config) === null || _configWithNodeInfo$c === void 0 ? void 0 : _configWithNodeInfo$c.externalStore);
|
|
248
252
|
if (isSSR()) {
|
|
249
253
|
return null;
|
|
250
254
|
}
|
|
251
|
-
if (!configWithNodeInfo || !configWithNodeInfo.config || typeof ((_configWithNodeInfo$
|
|
255
|
+
if (!configWithNodeInfo || !configWithNodeInfo.config || typeof ((_configWithNodeInfo$c2 = configWithNodeInfo.config) === null || _configWithNodeInfo$c2 === void 0 ? void 0 : _configWithNodeInfo$c2.visible) !== 'undefined' && !((_configWithNodeInfo$c3 = configWithNodeInfo.config) !== null && _configWithNodeInfo$c3 !== void 0 && _configWithNodeInfo$c3.visible)) {
|
|
252
256
|
return null;
|
|
253
257
|
}
|
|
254
258
|
if (userIntentState !== null && userIntentState !== void 0 && userIntentState.currentUserIntent && SUPPRESS_TOOLBAR_USER_INTENTS.includes(userIntentState === null || userIntentState === void 0 ? void 0 : userIntentState.currentUserIntent)) {
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { useSyncExternalStore } from 'react';
|
|
2
|
+
const emptySnapshot = () => 0;
|
|
3
|
+
const emptySubscription = () => () => {};
|
|
4
|
+
|
|
5
|
+
/** Refresh toolbar content when its optional external store changes. */
|
|
6
|
+
export const useToolbarExternalStore = store => {
|
|
7
|
+
var _store$subscribe, _store$getSnapshot;
|
|
8
|
+
useSyncExternalStore((_store$subscribe = store === null || store === void 0 ? void 0 : store.subscribe) !== null && _store$subscribe !== void 0 ? _store$subscribe : emptySubscription, (_store$getSnapshot = store === null || store === void 0 ? void 0 : store.getSnapshot) !== null && _store$getSnapshot !== void 0 ? _store$getSnapshot : emptySnapshot, emptySnapshot);
|
|
9
|
+
};
|
|
@@ -15,6 +15,7 @@ import { useSharedPluginState } from '@atlaskit/editor-common/useSharedPluginSta
|
|
|
15
15
|
import { AllSelection, PluginKey, TextSelection } from '@atlaskit/editor-prosemirror/state';
|
|
16
16
|
import { findDomRefAtPos, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
|
|
17
17
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
18
|
+
import { useToolbarExternalStore } from './hooks/useToolbarExternalStore';
|
|
18
19
|
import { copyNode as _copyNode } from './pm-plugins/commands';
|
|
19
20
|
import forceFocusPlugin, { forceFocusSelector } from './pm-plugins/force-focus';
|
|
20
21
|
import { hideConfirmDialog } from './pm-plugins/toolbar-data/commands';
|
|
@@ -223,7 +224,7 @@ export var floatingToolbarPlugin = function floatingToolbarPlugin(_ref) {
|
|
|
223
224
|
* @returns JSX element representing the floating toolbar or null if not visible
|
|
224
225
|
*/
|
|
225
226
|
export function ContentComponent(_ref5) {
|
|
226
|
-
var _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d, _confirmButtonItem, _confirmButtonItem2, _confirmButtonItem3;
|
|
227
|
+
var _configWithNodeInfo, _configWithNodeInfo$c, _configWithNodeInfo$c2, _items, _pluginInjectionApi$c, _pluginInjectionApi$d, _confirmButtonItem, _confirmButtonItem2, _confirmButtonItem3;
|
|
227
228
|
var pluginInjectionApi = _ref5.pluginInjectionApi,
|
|
228
229
|
editorView = _ref5.editorView,
|
|
229
230
|
popupsMountPoint = _ref5.popupsMountPoint,
|
|
@@ -247,6 +248,9 @@ export function ContentComponent(_ref5) {
|
|
|
247
248
|
// for example, trigger remix on panel will not hide the floating toolbar
|
|
248
249
|
configWithNodeInfo = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 || (_pluginInjectionApi$f = _pluginInjectionApi$f.sharedState.currentState()) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.configWithNodeInfo;
|
|
249
250
|
}
|
|
251
|
+
|
|
252
|
+
// Subscribe to an external store for rerenders. Used by editor-plugin-card for card registration via editor actions
|
|
253
|
+
useToolbarExternalStore((_configWithNodeInfo = configWithNodeInfo) === null || _configWithNodeInfo === void 0 || (_configWithNodeInfo = _configWithNodeInfo.config) === null || _configWithNodeInfo === void 0 ? void 0 : _configWithNodeInfo.externalStore);
|
|
250
254
|
if (isSSR()) {
|
|
251
255
|
return null;
|
|
252
256
|
}
|
|
@@ -256,9 +260,9 @@ export function ContentComponent(_ref5) {
|
|
|
256
260
|
if (userIntentState !== null && userIntentState !== void 0 && userIntentState.currentUserIntent && SUPPRESS_TOOLBAR_USER_INTENTS.includes(userIntentState === null || userIntentState === void 0 ? void 0 : userIntentState.currentUserIntent)) {
|
|
257
261
|
return null;
|
|
258
262
|
}
|
|
259
|
-
var
|
|
260
|
-
config =
|
|
261
|
-
node =
|
|
263
|
+
var _configWithNodeInfo2 = configWithNodeInfo,
|
|
264
|
+
config = _configWithNodeInfo2.config,
|
|
265
|
+
node = _configWithNodeInfo2.node;
|
|
262
266
|
|
|
263
267
|
// When the new inline editor-toolbar is enabled, suppress floating toolbar for text selections.
|
|
264
268
|
if (Boolean(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.toolbar)) {
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { useSyncExternalStore } from 'react';
|
|
2
|
+
var emptySnapshot = function emptySnapshot() {
|
|
3
|
+
return 0;
|
|
4
|
+
};
|
|
5
|
+
var emptySubscription = function emptySubscription() {
|
|
6
|
+
return function () {};
|
|
7
|
+
};
|
|
8
|
+
|
|
9
|
+
/** Refresh toolbar content when its optional external store changes. */
|
|
10
|
+
export var useToolbarExternalStore = function useToolbarExternalStore(store) {
|
|
11
|
+
var _store$subscribe, _store$getSnapshot;
|
|
12
|
+
useSyncExternalStore((_store$subscribe = store === null || store === void 0 ? void 0 : store.subscribe) !== null && _store$subscribe !== void 0 ? _store$subscribe : emptySubscription, (_store$getSnapshot = store === null || store === void 0 ? void 0 : store.getSnapshot) !== null && _store$getSnapshot !== void 0 ? _store$getSnapshot : emptySnapshot, emptySnapshot);
|
|
13
|
+
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-floating-toolbar",
|
|
3
|
-
"version": "31.0.
|
|
3
|
+
"version": "31.0.4",
|
|
4
4
|
"description": "Floating toolbar plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
"atlaskit:src": "src/index.ts",
|
|
23
23
|
"dependencies": {
|
|
24
24
|
"@atlaskit/adf-utils": "^20.9.0",
|
|
25
|
-
"@atlaskit/button": "^25.
|
|
25
|
+
"@atlaskit/button": "^25.6.0",
|
|
26
26
|
"@atlaskit/checkbox": "^19.3.0",
|
|
27
27
|
"@atlaskit/editor-palette": "^3.5.0",
|
|
28
28
|
"@atlaskit/editor-plugin-analytics": "^29.0.0",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"@atlaskit/editor-plugin-interaction": "^43.0.0",
|
|
37
37
|
"@atlaskit/editor-plugin-user-intent": "^27.0.0",
|
|
38
38
|
"@atlaskit/editor-prosemirror": "^9.0.0",
|
|
39
|
-
"@atlaskit/emoji": "^73.
|
|
39
|
+
"@atlaskit/emoji": "^73.1.0",
|
|
40
40
|
"@atlaskit/icon": "^38.0.0",
|
|
41
41
|
"@atlaskit/menu": "^11.0.0",
|
|
42
42
|
"@atlaskit/modal-dialog": "^17.1.0",
|
|
@@ -44,8 +44,8 @@
|
|
|
44
44
|
"@atlaskit/platform-feature-flags": "^2.2.0",
|
|
45
45
|
"@atlaskit/primitives": "^22.6.0",
|
|
46
46
|
"@atlaskit/select": "^23.1.0",
|
|
47
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
48
|
-
"@atlaskit/tokens": "^20.
|
|
47
|
+
"@atlaskit/tmp-editor-statsig": "^245.0.0",
|
|
48
|
+
"@atlaskit/tokens": "^20.7.0",
|
|
49
49
|
"@atlaskit/tooltip": "^24.4.0",
|
|
50
50
|
"@babel/runtime": "^7.0.0",
|
|
51
51
|
"@emotion/react": "^11.7.1",
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
"react-loosely-lazy": "^1.0.0"
|
|
57
57
|
},
|
|
58
58
|
"peerDependencies": {
|
|
59
|
-
"@atlaskit/editor-common": "^133.
|
|
59
|
+
"@atlaskit/editor-common": "^133.5.0",
|
|
60
60
|
"react": "^18.2.0 || ^19.2.0",
|
|
61
61
|
"react-dom": "^18.2.0 || ^19.2.0",
|
|
62
62
|
"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
|