@atlaskit/editor-plugin-synced-block 11.0.7 → 11.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @atlaskit/editor-plugin-synced-block
2
2
 
3
+ ## 11.0.8
4
+
5
+ ### Patch Changes
6
+
7
+ - [`c32d495837a60`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c32d495837a60) -
8
+ [ux] Clear the red destructive highlight on a synced block when the delete confirmation is
9
+ cancelled
10
+ - Updated dependencies
11
+
3
12
  ## 11.0.7
4
13
 
5
14
  ### Patch Changes
@@ -34,6 +34,7 @@ var _toolbarComponents = require("./ui/toolbar-components");
34
34
  var LazySyncedBlockUI = function LazySyncedBlockUI(_ref) {
35
35
  var syncBlockStoreManager = _ref.syncBlockStore,
36
36
  api = _ref.api,
37
+ editorView = _ref.editorView,
37
38
  onFeedbackPromptShown = _ref.onFeedbackPromptShown,
38
39
  onGiveFeedback = _ref.onGiveFeedback;
39
40
  var hasSyncBlocks = (0, _hooks.useSharedPluginStateWithSelector)(api, ['syncedBlock'], function (states) {
@@ -48,7 +49,8 @@ var LazySyncedBlockUI = function LazySyncedBlockUI(_ref) {
48
49
  api: api
49
50
  }), /*#__PURE__*/_react.default.createElement(_DeleteConfirmationModal.DeleteConfirmationModal, {
50
51
  syncBlockStoreManager: syncBlockStoreManager,
51
- api: api
52
+ api: api,
53
+ editorView: editorView
52
54
  }), /*#__PURE__*/_react.default.createElement(_Flag.Flag, {
53
55
  api: api,
54
56
  onFeedbackPromptShown: onFeedbackPromptShown,
@@ -149,13 +151,15 @@ var syncedBlockPlugin = exports.syncedBlockPlugin = function syncedBlockPlugin(_
149
151
  contentComponent: function contentComponent(_ref4) {
150
152
  var containerElement = _ref4.containerElement,
151
153
  wrapperElement = _ref4.wrapperElement,
152
- popupsMountPoint = _ref4.popupsMountPoint;
154
+ popupsMountPoint = _ref4.popupsMountPoint,
155
+ editorView = _ref4.editorView;
153
156
  refs.containerElement = containerElement || undefined;
154
157
  refs.popupsMountPoint = popupsMountPoint || undefined;
155
158
  refs.wrapperElement = wrapperElement || undefined;
156
159
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (0, _expValEquals.expValEquals)('platform_editor_sync_block_activation', 'isEnabled', true) && /*#__PURE__*/_react.default.createElement(_SourceSyncBlockPlaceholder.SourceSyncBlockPlaceholder, null), /*#__PURE__*/_react.default.createElement(LazySyncedBlockUI, {
157
160
  syncBlockStore: syncBlockStore,
158
161
  api: api,
162
+ editorView: editorView,
159
163
  onFeedbackPromptShown: config === null || config === void 0 ? void 0 : config.onFeedbackPromptShown,
160
164
  onGiveFeedback: config === null || config === void 0 ? void 0 : config.onGiveFeedback
161
165
  }));
@@ -54,9 +54,10 @@ var styles = {
54
54
  spinner: "_1mou1wug _195g1wug"
55
55
  };
56
56
  var DeleteConfirmationModal = exports.DeleteConfirmationModal = function DeleteConfirmationModal(_ref) {
57
- var _api$core2, _api$core5, _api$core8;
57
+ var _api$core2, _api$decorations2, _api$core5, _api$core8;
58
58
  var syncBlockStoreManager = _ref.syncBlockStoreManager,
59
- api = _ref.api;
59
+ api = _ref.api,
60
+ editorView = _ref.editorView;
60
61
  var _useState = (0, _react.useState)(false),
61
62
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
62
63
  isOpen = _useState2[0],
@@ -110,8 +111,17 @@ var DeleteConfirmationModal = exports.DeleteConfirmationModal = function DeleteC
110
111
  activeFlag: false
111
112
  });
112
113
  });
114
+
115
+ // The delete menu adds a `danger` decoration that it only clears on mouse leave, which
116
+ // never fires because clicking Delete closes the menu. It stays for the lifetime of this
117
+ // modal so the block being deleted remains highlighted, and confirming drops it along
118
+ // with the node, but cancelling has to clear it or the red highlight is left behind.
119
+ if (!confirm && editorView && (0, _fg.fg)('platform_editor_blocks_patch_7')) {
120
+ var _api$decorations;
121
+ api === null || api === void 0 || (_api$decorations = api.decorations) === null || _api$decorations === void 0 || _api$decorations.actions.removeDecoration(editorView.state, editorView.dispatch);
122
+ }
113
123
  };
114
- }, [api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions]);
124
+ }, [api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions, api === null || api === void 0 || (_api$decorations2 = api.decorations) === null || _api$decorations2 === void 0 ? void 0 : _api$decorations2.actions, editorView]);
115
125
 
116
126
  // Store activeFlag in a ref so confirmationCallback always reads the latest value
117
127
  // even if it changes during the await fetchReferenceCountRef call.
@@ -28,6 +28,7 @@ import { getToolbarComponents } from './ui/toolbar-components';
28
28
  const LazySyncedBlockUI = ({
29
29
  syncBlockStore: syncBlockStoreManager,
30
30
  api,
31
+ editorView,
31
32
  onFeedbackPromptShown,
32
33
  onGiveFeedback
33
34
  }) => {
@@ -43,7 +44,8 @@ const LazySyncedBlockUI = ({
43
44
  api: api
44
45
  }), /*#__PURE__*/React.createElement(DeleteConfirmationModal, {
45
46
  syncBlockStoreManager: syncBlockStoreManager,
46
- api: api
47
+ api: api,
48
+ editorView: editorView
47
49
  }), /*#__PURE__*/React.createElement(Flag, {
48
50
  api: api,
49
51
  onFeedbackPromptShown: onFeedbackPromptShown,
@@ -138,7 +140,8 @@ export const syncedBlockPlugin = ({
138
140
  contentComponent: ({
139
141
  containerElement,
140
142
  wrapperElement,
141
- popupsMountPoint
143
+ popupsMountPoint,
144
+ editorView
142
145
  }) => {
143
146
  refs.containerElement = containerElement || undefined;
144
147
  refs.popupsMountPoint = popupsMountPoint || undefined;
@@ -146,6 +149,7 @@ export const syncedBlockPlugin = ({
146
149
  return /*#__PURE__*/React.createElement(React.Fragment, null, expValEquals('platform_editor_sync_block_activation', 'isEnabled', true) && /*#__PURE__*/React.createElement(SourceSyncBlockPlaceholder, null), /*#__PURE__*/React.createElement(LazySyncedBlockUI, {
147
150
  syncBlockStore: syncBlockStore,
148
151
  api: api,
152
+ editorView: editorView,
149
153
  onFeedbackPromptShown: config === null || config === void 0 ? void 0 : config.onFeedbackPromptShown,
150
154
  onGiveFeedback: config === null || config === void 0 ? void 0 : config.onGiveFeedback
151
155
  }));
@@ -40,9 +40,10 @@ const styles = {
40
40
  };
41
41
  export const DeleteConfirmationModal = ({
42
42
  syncBlockStoreManager,
43
- api
43
+ api,
44
+ editorView
44
45
  }) => {
45
- var _api$core2, _api$core5, _api$core8;
46
+ var _api$core2, _api$decorations2, _api$core5, _api$core8;
46
47
  const [isOpen, setIsOpen] = useState(false);
47
48
  const [syncBlockIds, setSyncBlockIds] = useState(undefined);
48
49
  const [referenceCount, setReferenceCount] = useState(undefined);
@@ -86,7 +87,16 @@ export const DeleteConfirmationModal = ({
86
87
  activeFlag: false
87
88
  });
88
89
  });
89
- }, [api === null || api === void 0 ? void 0 : (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions]);
90
+
91
+ // The delete menu adds a `danger` decoration that it only clears on mouse leave, which
92
+ // never fires because clicking Delete closes the menu. It stays for the lifetime of this
93
+ // modal so the block being deleted remains highlighted, and confirming drops it along
94
+ // with the node, but cancelling has to clear it or the red highlight is left behind.
95
+ if (!confirm && editorView && fg('platform_editor_blocks_patch_7')) {
96
+ var _api$decorations;
97
+ api === null || api === void 0 ? void 0 : (_api$decorations = api.decorations) === null || _api$decorations === void 0 ? void 0 : _api$decorations.actions.removeDecoration(editorView.state, editorView.dispatch);
98
+ }
99
+ }, [api === null || api === void 0 ? void 0 : (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions, api === null || api === void 0 ? void 0 : (_api$decorations2 = api.decorations) === null || _api$decorations2 === void 0 ? void 0 : _api$decorations2.actions, editorView]);
90
100
 
91
101
  // Store activeFlag in a ref so confirmationCallback always reads the latest value
92
102
  // even if it changes during the await fetchReferenceCountRef call.
@@ -28,6 +28,7 @@ import { getToolbarComponents } from './ui/toolbar-components';
28
28
  var LazySyncedBlockUI = function LazySyncedBlockUI(_ref) {
29
29
  var syncBlockStoreManager = _ref.syncBlockStore,
30
30
  api = _ref.api,
31
+ editorView = _ref.editorView,
31
32
  onFeedbackPromptShown = _ref.onFeedbackPromptShown,
32
33
  onGiveFeedback = _ref.onGiveFeedback;
33
34
  var hasSyncBlocks = useSharedPluginStateWithSelector(api, ['syncedBlock'], function (states) {
@@ -42,7 +43,8 @@ var LazySyncedBlockUI = function LazySyncedBlockUI(_ref) {
42
43
  api: api
43
44
  }), /*#__PURE__*/React.createElement(DeleteConfirmationModal, {
44
45
  syncBlockStoreManager: syncBlockStoreManager,
45
- api: api
46
+ api: api,
47
+ editorView: editorView
46
48
  }), /*#__PURE__*/React.createElement(Flag, {
47
49
  api: api,
48
50
  onFeedbackPromptShown: onFeedbackPromptShown,
@@ -143,13 +145,15 @@ export var syncedBlockPlugin = function syncedBlockPlugin(_ref2) {
143
145
  contentComponent: function contentComponent(_ref4) {
144
146
  var containerElement = _ref4.containerElement,
145
147
  wrapperElement = _ref4.wrapperElement,
146
- popupsMountPoint = _ref4.popupsMountPoint;
148
+ popupsMountPoint = _ref4.popupsMountPoint,
149
+ editorView = _ref4.editorView;
147
150
  refs.containerElement = containerElement || undefined;
148
151
  refs.popupsMountPoint = popupsMountPoint || undefined;
149
152
  refs.wrapperElement = wrapperElement || undefined;
150
153
  return /*#__PURE__*/React.createElement(React.Fragment, null, expValEquals('platform_editor_sync_block_activation', 'isEnabled', true) && /*#__PURE__*/React.createElement(SourceSyncBlockPlaceholder, null), /*#__PURE__*/React.createElement(LazySyncedBlockUI, {
151
154
  syncBlockStore: syncBlockStore,
152
155
  api: api,
156
+ editorView: editorView,
153
157
  onFeedbackPromptShown: config === null || config === void 0 ? void 0 : config.onFeedbackPromptShown,
154
158
  onGiveFeedback: config === null || config === void 0 ? void 0 : config.onGiveFeedback
155
159
  }));
@@ -45,9 +45,10 @@ var styles = {
45
45
  spinner: "_1mou1wug _195g1wug"
46
46
  };
47
47
  export var DeleteConfirmationModal = function DeleteConfirmationModal(_ref) {
48
- var _api$core2, _api$core5, _api$core8;
48
+ var _api$core2, _api$decorations2, _api$core5, _api$core8;
49
49
  var syncBlockStoreManager = _ref.syncBlockStoreManager,
50
- api = _ref.api;
50
+ api = _ref.api,
51
+ editorView = _ref.editorView;
51
52
  var _useState = useState(false),
52
53
  _useState2 = _slicedToArray(_useState, 2),
53
54
  isOpen = _useState2[0],
@@ -101,8 +102,17 @@ export var DeleteConfirmationModal = function DeleteConfirmationModal(_ref) {
101
102
  activeFlag: false
102
103
  });
103
104
  });
105
+
106
+ // The delete menu adds a `danger` decoration that it only clears on mouse leave, which
107
+ // never fires because clicking Delete closes the menu. It stays for the lifetime of this
108
+ // modal so the block being deleted remains highlighted, and confirming drops it along
109
+ // with the node, but cancelling has to clear it or the red highlight is left behind.
110
+ if (!confirm && editorView && fg('platform_editor_blocks_patch_7')) {
111
+ var _api$decorations;
112
+ api === null || api === void 0 || (_api$decorations = api.decorations) === null || _api$decorations === void 0 || _api$decorations.actions.removeDecoration(editorView.state, editorView.dispatch);
113
+ }
104
114
  };
105
- }, [api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions]);
115
+ }, [api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions, api === null || api === void 0 || (_api$decorations2 = api.decorations) === null || _api$decorations2 === void 0 ? void 0 : _api$decorations2.actions, editorView]);
106
116
 
107
117
  // Store activeFlag in a ref so confirmationCallback always reads the latest value
108
118
  // even if it changes during the await fetchReferenceCountRef call.
@@ -1,8 +1,10 @@
1
1
  import React from 'react';
2
2
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
3
+ import type { EditorView } from '@atlaskit/editor-prosemirror/view';
3
4
  import type { SyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
4
5
  import type { SyncedBlockPlugin } from '../syncedBlockPluginType';
5
- export declare const DeleteConfirmationModal: ({ syncBlockStoreManager, api, }: {
6
+ export declare const DeleteConfirmationModal: ({ syncBlockStoreManager, api, editorView, }: {
6
7
  api?: ExtractInjectionAPI<SyncedBlockPlugin>;
8
+ editorView?: EditorView;
7
9
  syncBlockStoreManager: SyncBlockStoreManager;
8
10
  }) => React.JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-synced-block",
3
- "version": "11.0.7",
3
+ "version": "11.0.8",
4
4
  "description": "SyncedBlock plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -20,12 +20,12 @@
20
20
  "sideEffects": false,
21
21
  "atlaskit:src": "src/index.ts",
22
22
  "dependencies": {
23
- "@atlaskit/adf-schema": "^56.5.0",
24
- "@atlaskit/button": "25.0.1",
25
- "@atlaskit/dropdown-menu": "17.2.3",
23
+ "@atlaskit/adf-schema": "^56.6.0",
24
+ "@atlaskit/button": "25.0.2",
25
+ "@atlaskit/dropdown-menu": "17.2.4",
26
26
  "@atlaskit/editor-json-transformer": "^9.2.0",
27
27
  "@atlaskit/editor-plugin-analytics": "^13.0.0",
28
- "@atlaskit/editor-plugin-block-menu": "^12.0.0",
28
+ "@atlaskit/editor-plugin-block-menu": "^12.1.0",
29
29
  "@atlaskit/editor-plugin-connectivity": "13.0.0",
30
30
  "@atlaskit/editor-plugin-content-format": "^7.0.0",
31
31
  "@atlaskit/editor-plugin-decorations": "^13.0.0",
@@ -35,18 +35,18 @@
35
35
  "@atlaskit/editor-plugin-user-intent": "^11.0.0",
36
36
  "@atlaskit/editor-prosemirror": "^8.0.0",
37
37
  "@atlaskit/editor-shared-styles": "^4.0.0",
38
- "@atlaskit/editor-synced-block-provider": "^9.0.0",
38
+ "@atlaskit/editor-synced-block-provider": "^9.1.0",
39
39
  "@atlaskit/editor-toolbar": "^2.4.0",
40
40
  "@atlaskit/flag": "^18.2.0",
41
41
  "@atlaskit/icon": "37.3.0",
42
42
  "@atlaskit/icon-lab": "^7.5.0",
43
43
  "@atlaskit/logo": "^21.4.0",
44
44
  "@atlaskit/lozenge": "^15.0.0",
45
- "@atlaskit/modal-dialog": "^16.2.0",
45
+ "@atlaskit/modal-dialog": "^16.3.0",
46
46
  "@atlaskit/platform-feature-flags": "^2.1.0",
47
47
  "@atlaskit/primitives": "^22.2.0",
48
48
  "@atlaskit/spinner": "20.1.2",
49
- "@atlaskit/tmp-editor-statsig": "^141.0.0",
49
+ "@atlaskit/tmp-editor-statsig": "^141.1.0",
50
50
  "@atlaskit/tokens": "16.3.0",
51
51
  "@atlaskit/tooltip": "^24.0.0",
52
52
  "@atlaskit/visually-hidden": "^4.2.0",
@@ -58,7 +58,7 @@
58
58
  "memoize-one": "^6.0.0"
59
59
  },
60
60
  "peerDependencies": {
61
- "@atlaskit/editor-common": "^117.2.0",
61
+ "@atlaskit/editor-common": "^117.3.0",
62
62
  "react": "^18.2.0 || ^19.2.0",
63
63
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
64
64
  },
package/tsconfig.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
- "extends": "../../../tsconfig.json",
3
- "include": [
4
- "src/**/*.ts",
5
- "src/**/*.tsx"
6
- ]
2
+ "extends": "./tsconfig.dev.json",
3
+ "compilerOptions": {
4
+ "disableReferencedProjectLoad": true,
5
+ "disableSolutionSearching": true
6
+ }
7
7
  }