@atlaskit/editor-plugin-extension 1.18.1 → 1.18.2

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-extension
2
2
 
3
+ ## 1.18.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#168661](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/168661)
8
+ [`2061425d2a648`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/2061425d2a648) -
9
+ ED-25724 - Legacy Content Macro: Add logic that deselects the extension node when the user clicks
10
+ into the LCM editable area.
11
+
3
12
  ## 1.18.1
4
13
 
5
14
  ### Patch Changes
@@ -230,6 +230,20 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, provid
230
230
  key: _pluginKey.pluginKey,
231
231
  props: {
232
232
  handleDOMEvents: {
233
+ blur: function blur(view, event) {
234
+ if ((0, _platformFeatureFlags.fg)('platform_editor_legacy_content_macro')) {
235
+ var currentTarget = event.relatedTarget;
236
+ var source = event.target;
237
+ var selection = view.state.selection;
238
+
239
+ // If the focus is going from outside to inside an area designated as an editable area of an extension, and an extension is the current selection, then the extension selection is reset.
240
+ if (selection instanceof _state.NodeSelection && selection.node.type === view.state.schema.nodes.extension && currentTarget.closest('.extension-editable-area') && !source.closest('.extension-editable-area')) {
241
+ var emptySelection = new _state.TextSelection(view.state.doc.resolve(0));
242
+ var tr = view.state.tr.setSelection(emptySelection);
243
+ view.dispatch(tr);
244
+ }
245
+ }
246
+ },
233
247
  /**
234
248
  * ED-18072 - Cannot shift + arrow past bodied extension if it is not empty.
235
249
  * This code is to handle the case where the selection starts inside or on the node and the user is trying to shift + arrow.
@@ -431,25 +431,29 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
431
431
  handleSubmit: handleSubmit
432
432
  }, function (onFieldChange) {
433
433
  _this2.onFieldChange = onFieldChange;
434
- return /*#__PURE__*/_react.default.createElement("form", (0, _extends2.default)({}, formProps, {
435
- noValidate: true,
436
- onKeyDown: handleKeyDown,
437
- "data-testid": "extension-config-panel"
438
- }), _this2.renderHeader(extensionManifest), /*#__PURE__*/_react.default.createElement(ConfigFormIntlWithBoundary, {
439
- api: api,
440
- canSave: false,
441
- errorMessage: errorMessage,
442
- extensionManifest: extensionManifest,
443
- fields: fields !== null && fields !== void 0 ? fields : [],
444
- firstVisibleFieldName: firstVisibleFieldName,
445
- hasParsedParameters: hasParsedParameters,
446
- isLoading: isLoading || false,
447
- onCancel: onCancel,
448
- onFieldChange: onFieldChange,
449
- parameters: currentParameters,
450
- submitting: submitting,
451
- featureFlags: featureFlags
452
- }));
434
+ return (
435
+ /*#__PURE__*/
436
+ // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
437
+ _react.default.createElement("form", (0, _extends2.default)({}, formProps, {
438
+ noValidate: true,
439
+ onKeyDown: handleKeyDown,
440
+ "data-testid": "extension-config-panel"
441
+ }), _this2.renderHeader(extensionManifest), /*#__PURE__*/_react.default.createElement(ConfigFormIntlWithBoundary, {
442
+ api: api,
443
+ canSave: false,
444
+ errorMessage: errorMessage,
445
+ extensionManifest: extensionManifest,
446
+ fields: fields !== null && fields !== void 0 ? fields : [],
447
+ firstVisibleFieldName: firstVisibleFieldName,
448
+ hasParsedParameters: hasParsedParameters,
449
+ isLoading: isLoading || false,
450
+ onCancel: onCancel,
451
+ onFieldChange: onFieldChange,
452
+ parameters: currentParameters,
453
+ submitting: submitting,
454
+ featureFlags: featureFlags
455
+ }))
456
+ );
453
457
  });
454
458
  });
455
459
  }
@@ -53,7 +53,9 @@ var RemovableField = function RemovableField(_ref) {
53
53
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
54
54
  ,
55
55
  className: className
56
- }, children, canRemoveField && (0, _react2.jsx)("div", {
56
+ }, children, canRemoveField &&
57
+ // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
58
+ (0, _react2.jsx)("div", {
57
59
  css: removeButtonWrapperStyles,
58
60
  "data-testid": "remove-field-".concat(name),
59
61
  onClick: onClickCallback
@@ -154,6 +154,20 @@ const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProvid
154
154
  key: pluginKey,
155
155
  props: {
156
156
  handleDOMEvents: {
157
+ blur: (view, event) => {
158
+ if (fg('platform_editor_legacy_content_macro')) {
159
+ const currentTarget = event.relatedTarget;
160
+ const source = event.target;
161
+ const selection = view.state.selection;
162
+
163
+ // If the focus is going from outside to inside an area designated as an editable area of an extension, and an extension is the current selection, then the extension selection is reset.
164
+ if (selection instanceof NodeSelection && selection.node.type === view.state.schema.nodes.extension && currentTarget.closest('.extension-editable-area') && !source.closest('.extension-editable-area')) {
165
+ const emptySelection = new TextSelection(view.state.doc.resolve(0));
166
+ const tr = view.state.tr.setSelection(emptySelection);
167
+ view.dispatch(tr);
168
+ }
169
+ }
170
+ },
157
171
  /**
158
172
  * ED-18072 - Cannot shift + arrow past bodied extension if it is not empty.
159
173
  * This code is to handle the case where the selection starts inside or on the node and the user is trying to shift + arrow.
@@ -374,25 +374,29 @@ class ConfigPanel extends React.Component {
374
374
  handleSubmit: handleSubmit
375
375
  }, onFieldChange => {
376
376
  this.onFieldChange = onFieldChange;
377
- return /*#__PURE__*/React.createElement("form", _extends({}, formProps, {
378
- noValidate: true,
379
- onKeyDown: handleKeyDown,
380
- "data-testid": "extension-config-panel"
381
- }), this.renderHeader(extensionManifest), /*#__PURE__*/React.createElement(ConfigFormIntlWithBoundary, {
382
- api: api,
383
- canSave: false,
384
- errorMessage: errorMessage,
385
- extensionManifest: extensionManifest,
386
- fields: fields !== null && fields !== void 0 ? fields : [],
387
- firstVisibleFieldName: firstVisibleFieldName,
388
- hasParsedParameters: hasParsedParameters,
389
- isLoading: isLoading || false,
390
- onCancel: onCancel,
391
- onFieldChange: onFieldChange,
392
- parameters: currentParameters,
393
- submitting: submitting,
394
- featureFlags: featureFlags
395
- }));
377
+ return (
378
+ /*#__PURE__*/
379
+ // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
380
+ React.createElement("form", _extends({}, formProps, {
381
+ noValidate: true,
382
+ onKeyDown: handleKeyDown,
383
+ "data-testid": "extension-config-panel"
384
+ }), this.renderHeader(extensionManifest), /*#__PURE__*/React.createElement(ConfigFormIntlWithBoundary, {
385
+ api: api,
386
+ canSave: false,
387
+ errorMessage: errorMessage,
388
+ extensionManifest: extensionManifest,
389
+ fields: fields !== null && fields !== void 0 ? fields : [],
390
+ firstVisibleFieldName: firstVisibleFieldName,
391
+ hasParsedParameters: hasParsedParameters,
392
+ isLoading: isLoading || false,
393
+ onCancel: onCancel,
394
+ onFieldChange: onFieldChange,
395
+ parameters: currentParameters,
396
+ submitting: submitting,
397
+ featureFlags: featureFlags
398
+ }))
399
+ );
396
400
  });
397
401
  });
398
402
  }
@@ -44,7 +44,9 @@ const RemovableField = ({
44
44
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
45
45
  ,
46
46
  className: className
47
- }, children, canRemoveField && jsx("div", {
47
+ }, children, canRemoveField &&
48
+ // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
49
+ jsx("div", {
48
50
  css: removeButtonWrapperStyles,
49
51
  "data-testid": `remove-field-${name}`,
50
52
  onClick: onClickCallback
@@ -204,6 +204,20 @@ var createPlugin = function createPlugin(dispatch, providerFactory, extensionHan
204
204
  key: pluginKey,
205
205
  props: {
206
206
  handleDOMEvents: {
207
+ blur: function blur(view, event) {
208
+ if (fg('platform_editor_legacy_content_macro')) {
209
+ var currentTarget = event.relatedTarget;
210
+ var source = event.target;
211
+ var selection = view.state.selection;
212
+
213
+ // If the focus is going from outside to inside an area designated as an editable area of an extension, and an extension is the current selection, then the extension selection is reset.
214
+ if (selection instanceof NodeSelection && selection.node.type === view.state.schema.nodes.extension && currentTarget.closest('.extension-editable-area') && !source.closest('.extension-editable-area')) {
215
+ var emptySelection = new TextSelection(view.state.doc.resolve(0));
216
+ var tr = view.state.tr.setSelection(emptySelection);
217
+ view.dispatch(tr);
218
+ }
219
+ }
220
+ },
207
221
  /**
208
222
  * ED-18072 - Cannot shift + arrow past bodied extension if it is not empty.
209
223
  * This code is to handle the case where the selection starts inside or on the node and the user is trying to shift + arrow.
@@ -421,25 +421,29 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
421
421
  handleSubmit: handleSubmit
422
422
  }, function (onFieldChange) {
423
423
  _this2.onFieldChange = onFieldChange;
424
- return /*#__PURE__*/React.createElement("form", _extends({}, formProps, {
425
- noValidate: true,
426
- onKeyDown: handleKeyDown,
427
- "data-testid": "extension-config-panel"
428
- }), _this2.renderHeader(extensionManifest), /*#__PURE__*/React.createElement(ConfigFormIntlWithBoundary, {
429
- api: api,
430
- canSave: false,
431
- errorMessage: errorMessage,
432
- extensionManifest: extensionManifest,
433
- fields: fields !== null && fields !== void 0 ? fields : [],
434
- firstVisibleFieldName: firstVisibleFieldName,
435
- hasParsedParameters: hasParsedParameters,
436
- isLoading: isLoading || false,
437
- onCancel: onCancel,
438
- onFieldChange: onFieldChange,
439
- parameters: currentParameters,
440
- submitting: submitting,
441
- featureFlags: featureFlags
442
- }));
424
+ return (
425
+ /*#__PURE__*/
426
+ // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
427
+ React.createElement("form", _extends({}, formProps, {
428
+ noValidate: true,
429
+ onKeyDown: handleKeyDown,
430
+ "data-testid": "extension-config-panel"
431
+ }), _this2.renderHeader(extensionManifest), /*#__PURE__*/React.createElement(ConfigFormIntlWithBoundary, {
432
+ api: api,
433
+ canSave: false,
434
+ errorMessage: errorMessage,
435
+ extensionManifest: extensionManifest,
436
+ fields: fields !== null && fields !== void 0 ? fields : [],
437
+ firstVisibleFieldName: firstVisibleFieldName,
438
+ hasParsedParameters: hasParsedParameters,
439
+ isLoading: isLoading || false,
440
+ onCancel: onCancel,
441
+ onFieldChange: onFieldChange,
442
+ parameters: currentParameters,
443
+ submitting: submitting,
444
+ featureFlags: featureFlags
445
+ }))
446
+ );
443
447
  });
444
448
  });
445
449
  }
@@ -45,7 +45,9 @@ var RemovableField = function RemovableField(_ref) {
45
45
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
46
46
  ,
47
47
  className: className
48
- }, children, canRemoveField && jsx("div", {
48
+ }, children, canRemoveField &&
49
+ // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
50
+ jsx("div", {
49
51
  css: removeButtonWrapperStyles,
50
52
  "data-testid": "remove-field-".concat(name),
51
53
  onClick: onClickCallback
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-extension",
3
- "version": "1.18.1",
3
+ "version": "1.18.2",
4
4
  "description": "editor-plugin-extension plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",