@atlaskit/editor-plugin-extension 1.17.3 → 1.18.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/editor-plugin-extension
 
+## 1.18.0
+
+### Minor Changes
+
+- [#161325](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/161325)
+  [`69312480d1ccc`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/69312480d1ccc) -
+  [ux] [ED-25381] add drag and drop disabling and skipValidation options to editor to enable nested
+  legacy content editor
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 1.17.3
 
 ### Patch Changes

package/dist/cjs/plugin.js

@@ -70,7 +70,7 @@ var extensionPlugin = exports.extensionPlugin = function extensionPlugin(_ref) {
           var extensionHandlers = options.extensionHandlers || {};
           return (0, _main.createPlugin)(dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, _api, options.useLongPressSelection, {
             appearance: options.appearance
-          }, featureFlags, options === null || options === void 0 ? void 0 : options.__livePage);
+          }, featureFlags, options.allowDragAndDrop, options === null || options === void 0 ? void 0 : options.__livePage);
         }
       }, {
         name: 'extensionKeymap',

package/dist/cjs/pm-plugins/main.js

@@ -31,6 +31,7 @@ var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _selection2 = require("@atlaskit/editor-common/selection");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _commands = require("../commands");
 var _lazyExtension = require("../nodeviews/lazyExtension");
 var _pluginFactory = require("../plugin-factory");
@@ -190,7 +191,8 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, provid
   var useLongPressSelection = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
   var options = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : {};
   var featureFlags = arguments.length > 8 ? arguments[8] : undefined;
-  var __livePage = arguments.length > 9 ? arguments[9] : undefined;
+  var allowDragAndDrop = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : true;
+  var __livePage = arguments.length > 10 ? arguments[10] : undefined;
   var state = (0, _pluginFactory.createPluginState)(dispatch, {
     showEditButton: false,
     showContextPanel: false
@@ -329,10 +331,21 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, provid
         return null;
       },
       handleClickOn: (0, _selection2.createSelectionClickHandler)(['extension', 'bodiedExtension', 'multiBodiedExtension'], function (target) {
-        return !target.closest('.extension-content');
-      }, {
+        return (0, _platformFeatureFlags.fg)('platform_editor_legacy_content_macro') ? !!target.closest('.extension-container') : !target.closest('.extension-content');
+      },
+      // It's to enable nested extensions selection
+      {
         useLongPressSelection: useLongPressSelection
-      })
+      }),
+      handleDrop: function handleDrop(view, event, slice, moved) {
+        if (!allowDragAndDrop) {
+          var _slice$content$firstC;
+          // Completely disable DND for extension nodes when allowDragAndDrop is false
+          var isExtension = slice.content.childCount === 1 && ((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) === view.state.schema.nodes.extension;
+          return isExtension;
+        }
+        return true;
+      }
     }
   });
 };

package/dist/es2019/plugin.js

@@ -64,7 +64,7 @@ export const extensionPlugin = ({
           const extensionHandlers = options.extensionHandlers || {};
           return createPlugin(dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, api, options.useLongPressSelection, {
             appearance: options.appearance
-          }, featureFlags, options === null || options === void 0 ? void 0 : options.__livePage);
+          }, featureFlags, options.allowDragAndDrop, options === null || options === void 0 ? void 0 : options.__livePage);
         }
       }, {
         name: 'extensionKeymap',

package/dist/es2019/pm-plugins/main.js

@@ -2,6 +2,7 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { createSelectionClickHandler, GapCursorSelection, isSelectionAtEndOfNode, isSelectionAtStartOfNode } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfTypeClosestToPos, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { clearEditingContext, updateState } from '../commands';
 import { lazyExtensionNodeView } from '../nodeviews/lazyExtension';
 import { createCommand, createPluginState, getPluginState } from '../plugin-factory';
@@ -114,7 +115,7 @@ export const handleUpdate = ({
   }
   return true;
 };
-const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, pluginInjectionApi, useLongPressSelection = false, options = {}, featureFlags, __livePage) => {
+const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, pluginInjectionApi, useLongPressSelection = false, options = {}, featureFlags, allowDragAndDrop = true, __livePage) => {
   var _featureFlags$macroIn, _featureFlags$macroIn2;
   const state = createPluginState(dispatch, {
     showEditButton: false,
@@ -265,9 +266,20 @@ const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProvid
         }
         return null;
       },
-      handleClickOn: createSelectionClickHandler(['extension', 'bodiedExtension', 'multiBodiedExtension'], target => !target.closest('.extension-content'), {
+      handleClickOn: createSelectionClickHandler(['extension', 'bodiedExtension', 'multiBodiedExtension'], target => fg('platform_editor_legacy_content_macro') ? !!target.closest('.extension-container') : !target.closest('.extension-content'),
+      // It's to enable nested extensions selection
+      {
         useLongPressSelection
-      })
+      }),
+      handleDrop(view, event, slice, moved) {
+        if (!allowDragAndDrop) {
+          var _slice$content$firstC;
+          // Completely disable DND for extension nodes when allowDragAndDrop is false
+          const isExtension = slice.content.childCount === 1 && ((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) === view.state.schema.nodes.extension;
+          return isExtension;
+        }
+        return true;
+      }
     }
   });
 };

package/dist/esm/plugin.js

@@ -63,7 +63,7 @@ export var extensionPlugin = function extensionPlugin(_ref) {
           var extensionHandlers = options.extensionHandlers || {};
           return createPlugin(dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, _api, options.useLongPressSelection, {
             appearance: options.appearance
-          }, featureFlags, options === null || options === void 0 ? void 0 : options.__livePage);
+          }, featureFlags, options.allowDragAndDrop, options === null || options === void 0 ? void 0 : options.__livePage);
         }
       }, {
         name: 'extensionKeymap',

package/dist/esm/pm-plugins/main.js

@@ -5,6 +5,7 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { createSelectionClickHandler, GapCursorSelection, isSelectionAtEndOfNode, isSelectionAtStartOfNode } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfTypeClosestToPos, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { clearEditingContext, updateState } from '../commands';
 import { lazyExtensionNodeView } from '../nodeviews/lazyExtension';
 import { createCommand, createPluginState, getPluginState } from '../plugin-factory';
@@ -164,7 +165,8 @@ var createPlugin = function createPlugin(dispatch, providerFactory, extensionHan
   var useLongPressSelection = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
   var options = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : {};
   var featureFlags = arguments.length > 8 ? arguments[8] : undefined;
-  var __livePage = arguments.length > 9 ? arguments[9] : undefined;
+  var allowDragAndDrop = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : true;
+  var __livePage = arguments.length > 10 ? arguments[10] : undefined;
   var state = createPluginState(dispatch, {
     showEditButton: false,
     showContextPanel: false
@@ -303,10 +305,21 @@ var createPlugin = function createPlugin(dispatch, providerFactory, extensionHan
         return null;
       },
       handleClickOn: createSelectionClickHandler(['extension', 'bodiedExtension', 'multiBodiedExtension'], function (target) {
-        return !target.closest('.extension-content');
-      }, {
+        return fg('platform_editor_legacy_content_macro') ? !!target.closest('.extension-container') : !target.closest('.extension-content');
+      },
+      // It's to enable nested extensions selection
+      {
         useLongPressSelection: useLongPressSelection
-      })
+      }),
+      handleDrop: function handleDrop(view, event, slice, moved) {
+        if (!allowDragAndDrop) {
+          var _slice$content$firstC;
+          // Completely disable DND for extension nodes when allowDragAndDrop is false
+          var isExtension = slice.content.childCount === 1 && ((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) === view.state.schema.nodes.extension;
+          return isExtension;
+        }
+        return true;
+      }
     }
   });
 };

package/dist/types/pm-plugins/main.d.ts

@@ -20,5 +20,5 @@ export declare const handleUpdate: ({ view, prevState, domAtPos, extensionHandle
 }) => true | undefined;
 declare const createPlugin: (dispatch: Dispatch, providerFactory: ProviderFactory, extensionHandlers: ExtensionHandlers, portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, pluginInjectionApi: ExtractInjectionAPI<ExtensionPlugin> | undefined, useLongPressSelection?: boolean, options?: {
     appearance?: EditorAppearance;
-}, featureFlags?: FeatureFlags, __livePage?: boolean) => SafePlugin<import("../types").ExtensionState>;
+}, featureFlags?: FeatureFlags, allowDragAndDrop?: boolean, __livePage?: boolean) => SafePlugin<import("../types").ExtensionState>;
 export { pluginKey, createPlugin, createCommand, getPluginState };

package/dist/types/types.d.ts

@@ -41,6 +41,7 @@ export interface ExtensionPluginOptions extends LongPressSelectionPluginOptions
     breakoutEnabled?: boolean;
     extensionHandlers?: ExtensionHandlers;
     appearance?: EditorAppearance;
+    allowDragAndDrop?: boolean;
     __livePage?: boolean;
 }
 type InsertMacroFromMacroBrowser = (macroProvider: MacroProvider, macroNode?: PmNode, isEditing?: boolean) => (view: EditorView) => Promise<boolean>;

package/dist/types-ts4.5/pm-plugins/main.d.ts

@@ -20,5 +20,5 @@ export declare const handleUpdate: ({ view, prevState, domAtPos, extensionHandle
 }) => true | undefined;
 declare const createPlugin: (dispatch: Dispatch, providerFactory: ProviderFactory, extensionHandlers: ExtensionHandlers, portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, pluginInjectionApi: ExtractInjectionAPI<ExtensionPlugin> | undefined, useLongPressSelection?: boolean, options?: {
     appearance?: EditorAppearance;
-}, featureFlags?: FeatureFlags, __livePage?: boolean) => SafePlugin<import("../types").ExtensionState>;
+}, featureFlags?: FeatureFlags, allowDragAndDrop?: boolean, __livePage?: boolean) => SafePlugin<import("../types").ExtensionState>;
 export { pluginKey, createPlugin, createCommand, getPluginState };

package/dist/types-ts4.5/types.d.ts

@@ -41,6 +41,7 @@ export interface ExtensionPluginOptions extends LongPressSelectionPluginOptions
     breakoutEnabled?: boolean;
     extensionHandlers?: ExtensionHandlers;
     appearance?: EditorAppearance;
+    allowDragAndDrop?: boolean;
     __livePage?: boolean;
 }
 type InsertMacroFromMacroBrowser = (macroProvider: MacroProvider, macroNode?: PmNode, isEditing?: boolean) => (view: EditorView) => Promise<boolean>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-extension",
-	"version": "1.17.3",
+	"version": "1.18.0",
 	"description": "editor-plugin-extension plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -30,7 +30,7 @@
 		"@atlaskit/button": "^20.3.0",
 		"@atlaskit/checkbox": "^15.1.0",
 		"@atlaskit/datetime-picker": "^15.9.0",
-		"@atlaskit/editor-common": "^95.0.0",
+		"@atlaskit/editor-common": "^95.2.0",
 		"@atlaskit/editor-json-transformer": "^8.21.0",
 		"@atlaskit/editor-plugin-analytics": "^1.10.0",
 		"@atlaskit/editor-plugin-context-identifier": "^1.3.0",
@@ -44,11 +44,11 @@
 		"@atlaskit/empty-state": "^7.12.0",
 		"@atlaskit/form": "^10.5.0",
 		"@atlaskit/heading": "3.1.0",
-		"@atlaskit/icon": "^22.24.0",
+		"@atlaskit/icon": "^22.25.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
 		"@atlaskit/primitives": "^13.2.0",
 		"@atlaskit/radio": "^6.5.0",
-		"@atlaskit/section-message": "^6.6.0",
+		"@atlaskit/section-message": "^6.7.0",
 		"@atlaskit/select": "^18.5.0",
 		"@atlaskit/smart-user-picker": "^6.11.0",
 		"@atlaskit/spinner": "^16.3.0",
@@ -110,6 +110,9 @@
 		"platform_editor_remove_copy_button_from_view_mode": {
 			"type": "boolean"
 		},
+		"platform_editor_legacy_content_macro": {
+			"type": "boolean"
+		},
 		"platform_editor_react18_phase2_loadable": {
 			"type": "boolean"
 		}