@atlaskit/editor-plugin-block-menu 5.1.3 → 5.1.5

package/dist/esm/ui/block-menu.js

@@ -1,4 +1,5 @@
 /* block-menu.tsx generated by @compiled/babel-plugin v0.38.1 */
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import "./block-menu.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { useContext, useEffect, useRef } from 'react';
@@ -25,6 +26,7 @@ var styles = {
 };
 var DEFAULT_MENU_WIDTH = 230;
 var DRAG_HANDLE_OFFSET_PADDING = 5;
+var FALLBACK_MENU_HEIGHT = 300;
 var PopupWithListeners = withReactEditorViewOuterListeners(Popup);
 var useConditionalBlockMenuEffect = conditionalHooksFactory(function () {
   return fg('platform_editor_toolbar_aifc_user_intent_fix');
@@ -155,6 +157,18 @@ var BlockMenu = function BlockMenu(_ref4) {
   var targetHandleRef = editorView === null || editorView === void 0 || (_editorView$dom = editorView.dom) === null || _editorView$dom === void 0 ? void 0 : _editorView$dom.querySelector(DRAG_HANDLE_SELECTOR);
   var prevIsMenuOpenRef = useRef(false);
   var popupRef = useRef(undefined);
+  var _React$useState = React.useState(0),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    menuHeight = _React$useState2[0],
+    setMenuHeight = _React$useState2[1];
+  var targetHandleHeightOffset = -((targetHandleRef === null || targetHandleRef === void 0 ? void 0 : targetHandleRef.clientHeight) || 0);
+  React.useLayoutEffect(function () {
+    var _popupRef$current;
+    if (!isMenuOpen) {
+      return;
+    }
+    setMenuHeight(((_popupRef$current = popupRef.current) === null || _popupRef$current === void 0 ? void 0 : _popupRef$current.clientHeight) || FALLBACK_MENU_HEIGHT);
+  }, [isMenuOpen]);
   var hasFocus = (_ref5 = (editorView === null || editorView === void 0 ? void 0 : editorView.hasFocus()) || document.activeElement === targetHandleRef || popupRef.current && (popupRef.current.contains(document.activeElement) || popupRef.current === document.activeElement)) !== null && _ref5 !== void 0 ? _ref5 : false;
   var selectedByShortcutOrDragHandle = !!isSelectedViaDragHandle || !!openedViaKeyboard;
 
@@ -218,8 +232,7 @@ var BlockMenu = function BlockMenu(_ref4) {
       fallbackComponent: null
     }, /*#__PURE__*/React.createElement(PopupWithListeners, {
       alignX: 'right',
-      alignY: 'start' // respected when forcePlacement is true
-      ,
+      alignY: 'start',
       handleClickOutside: closeMenu,
       handleEscapeKeydown: closeMenu,
       handleBackspaceDeleteKeydown: handleBackspaceDeleteKeydown,
@@ -229,16 +242,15 @@ var BlockMenu = function BlockMenu(_ref4) {
       target: targetHandleRef,
       zIndex: akEditorFloatingOverlapPanelZIndex,
       fitWidth: DEFAULT_MENU_WIDTH,
-      forcePlacement: true,
-      preventOverflow: true // disables forced horizontal placement when forcePlacement is on, so fitWidth controls flipping
-      ,
+      fitHeight: menuHeight,
+      preventOverflow: true,
       stick: true,
+      offset: [DRAG_HANDLE_WIDTH + DRAG_HANDLE_OFFSET_PADDING, targetHandleHeightOffset],
       focusTrap: openedViaKeyboard ?
       // Only enable focus trap when opened via keyboard to make sure the focus is on the first focusable menu item
       {
         initialFocus: undefined
-      } : undefined,
-      offset: [DRAG_HANDLE_WIDTH + DRAG_HANDLE_OFFSET_PADDING, 0]
+      } : undefined
     }, /*#__PURE__*/React.createElement(BlockMenuContent, {
       api: api,
       setRef: setRef

package/dist/types/editor-commands/transform-node-utils/flattenListStep.d.ts

@@ -0,0 +1,49 @@
+import type { TransformStep } from './types';
+/**
+ * Given an array of nodes, returns an array with the flattened children of any list node
+ * to it's first ancestor list, maintaining document order.
+ *
+ * @example
+ * Input:
+ * - bulletList
+ *   - listItem "A"
+ *   - listItem "B"
+ *     - bulletList
+ *       - listItem "C"
+ *       - listItem "D"
+ *   - listItem "E"
+ *
+ * Output:
+ * - bulletList
+ *   - listItem "A"
+ *   - listItem "B"
+ *   - listItem "C"
+ *   - listItem "D"
+ *   - listItem "E"
+ *
+ * @example
+ * Input (deeply nested):
+ * - bulletList
+ *   - listItem "1"
+ *     - bulletList
+ *       - listItem "1.1"
+ *         - bulletList
+ *           - listItem "1.1.1"
+ *       - listItem "1.2"
+ *   - listItem "2"
+ *
+ * Output:
+ * - bulletList
+ *   - listItem "1"
+ *   - listItem "1.1"
+ *   - listItem "1.1.1"
+ *   - listItem "1.2"
+ *   - listItem "2"
+ *
+ * @param nodes
+ * @param context
+ * @returns
+ *
+ * TODO: Lists with mixed types (e.g. bulletList with a taskItem) doesn't full flatten
+ */
+export declare const flattenListStep: TransformStep;

package/dist/types/editor-commands/transform-node-utils/flattenStep.d.ts

@@ -0,0 +1,2 @@
+import type { TransformStep } from './types';
+export declare const flattenStep: TransformStep;

package/dist/types/editor-commands/transform-node-utils/transform.d.ts

@@ -1,8 +1,9 @@
-import type { Node as PMNode, NodeType, Schema } from '@atlaskit/editor-prosemirror/model';
+import { type Node as PMNode, type NodeType, type Schema } from '@atlaskit/editor-prosemirror/model';
 interface GetOutputNodesArgs {
+    isNested: boolean;
     schema: Schema;
     sourceNode: PMNode;
     targetNodeType: NodeType;
 }
-export declare const getOutputNodes: ({ sourceNode, targetNodeType, schema, }: GetOutputNodesArgs) => PMNode[] | undefined;
+export declare const getOutputNodes: ({ sourceNode, targetNodeType, schema, isNested, }: GetOutputNodesArgs) => PMNode[] | undefined;
 export {};

package/dist/types/editor-commands/transform-node-utils/types.d.ts

@@ -1,5 +1,5 @@
 import type { Node as PMNode, Schema } from '@atlaskit/editor-prosemirror/model';
-export type NodeTypeName = 'blockquote' | 'blockCard' | 'bodiedExtension' | 'bulletList' | 'codeBlock' | 'decisionList' | 'embedCard' | 'expand' | 'extension' | 'heading' | 'layout' | 'media' | 'mediaGroup' | 'mediaSingle' | 'multiBodiedExtension' | 'orderedList' | 'panel' | 'paragraph' | 'nestedExpand' | 'taskList' | 'table';
+export type NodeTypeName = 'blockquote' | 'blockCard' | 'bodiedExtension' | 'bulletList' | 'codeBlock' | 'decisionList' | 'embedCard' | 'expand' | 'extension' | 'heading' | 'layoutSection' | 'media' | 'mediaGroup' | 'mediaSingle' | 'multiBodiedExtension' | 'orderedList' | 'panel' | 'paragraph' | 'nestedExpand' | 'taskList' | 'table';
 export type NodeCategory = 'atomic' | 'container' | 'list' | 'text';
 export declare const NODE_CATEGORY_BY_TYPE: Record<NodeTypeName, NodeCategory>;
 export declare const isNodeTypeName: (value: string) => value is NodeTypeName;

package/dist/types/editor-commands/transform-node-utils/unwrapExpandStep.d.ts

@@ -0,0 +1,8 @@
+import type { TransformStep } from './types';
+/**
+ * Unwraps an expand/nestedExpand node, converting its title attribute to a paragraph
+ * and prepending it to the children.
+ *
+ * Example: expand({ title: 'title' })(p('b')) → [p('title'), p('b')]
+ */
+export declare const unwrapExpandStep: TransformStep;

package/dist/types/editor-commands/transform-node-utils/unwrapListStep.d.ts

@@ -0,0 +1,7 @@
+import type { TransformStep } from './types';
+/**
+ * Given an array of nodes, returns an array with the flattened children of any list nodes.
+ * @param nodes
+ * @returns
+ */
+export declare const unwrapListStep: TransformStep;

package/dist/types/editor-commands/transform-node-utils/unwrapStep.d.ts

@@ -0,0 +1,2 @@
+import type { TransformStep } from './types';
+export declare const unwrapStep: TransformStep;

package/dist/types/editor-commands/transform-node-utils/utils.d.ts

@@ -1,3 +1,5 @@
 import type { Selection } from '@atlaskit/editor-prosemirror/state';
 import { type ContentNodeWithPos } from '@atlaskit/editor-prosemirror/utils';
+import type { NodeTypeName } from './types';
 export declare const getSelectedNode: (selection: Selection) => ContentNodeWithPos | undefined;
+export declare const getTargetNodeTypeNameInContext: (nodeTypeName: NodeTypeName | null, isNested?: boolean) => NodeTypeName | null;

package/dist/types/editor-commands/transform-node-utils/wrapIntoLayoutStep.d.ts

@@ -0,0 +1,2 @@
+import type { TransformStep } from './types';
+export declare const wrapIntoLayoutStep: TransformStep;

package/dist/types/editor-commands/transform-node-utils/wrapStep.d.ts

@@ -0,0 +1,2 @@
+import type { TransformStep } from './types';
+export declare const wrapStep: TransformStep;

package/dist/types/editor-commands/transforms/types.d.ts

@@ -1,7 +1,7 @@
 import type { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { TransformContext } from '@atlaskit/editor-common/transforms';
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
-export type FormatNodeTargetType = 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6' | 'paragraph' | 'blockquote' | 'expand' | 'layoutSection' | 'panel' | 'codeBlock' | 'bulletList' | 'orderedList' | 'taskList';
+export type FormatNodeTargetType = 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6' | 'paragraph' | 'blockquote' | 'expand' | 'layoutSection' | 'panel' | 'codeBlock' | 'bulletList' | 'orderedList' | 'taskList' | 'decisionList';
 export type TransfromNodeTargetType = FormatNodeTargetType;
 export type FormatNodeAnalyticsAttrs = {
     inputMethod: INPUT_METHOD.BLOCK_MENU;

package/dist/types-ts4.5/editor-commands/transform-node-utils/flattenListStep.d.ts

@@ -0,0 +1,49 @@
+import type { TransformStep } from './types';
+/**
+ * Given an array of nodes, returns an array with the flattened children of any list node
+ * to it's first ancestor list, maintaining document order.
+ *
+ * @example
+ * Input:
+ * - bulletList
+ *   - listItem "A"
+ *   - listItem "B"
+ *     - bulletList
+ *       - listItem "C"
+ *       - listItem "D"
+ *   - listItem "E"
+ *
+ * Output:
+ * - bulletList
+ *   - listItem "A"
+ *   - listItem "B"
+ *   - listItem "C"
+ *   - listItem "D"
+ *   - listItem "E"
+ *
+ * @example
+ * Input (deeply nested):
+ * - bulletList
+ *   - listItem "1"
+ *     - bulletList
+ *       - listItem "1.1"
+ *         - bulletList
+ *           - listItem "1.1.1"
+ *       - listItem "1.2"
+ *   - listItem "2"
+ *
+ * Output:
+ * - bulletList
+ *   - listItem "1"
+ *   - listItem "1.1"
+ *   - listItem "1.1.1"
+ *   - listItem "1.2"
+ *   - listItem "2"
+ *
+ * @param nodes
+ * @param context
+ * @returns
+ *
+ * TODO: Lists with mixed types (e.g. bulletList with a taskItem) doesn't full flatten
+ */
+export declare const flattenListStep: TransformStep;

package/dist/types-ts4.5/editor-commands/transform-node-utils/flattenStep.d.ts

@@ -0,0 +1,2 @@
+import type { TransformStep } from './types';
+export declare const flattenStep: TransformStep;

package/dist/types-ts4.5/editor-commands/transform-node-utils/transform.d.ts

@@ -1,8 +1,9 @@
-import type { Node as PMNode, NodeType, Schema } from '@atlaskit/editor-prosemirror/model';
+import { type Node as PMNode, type NodeType, type Schema } from '@atlaskit/editor-prosemirror/model';
 interface GetOutputNodesArgs {
+    isNested: boolean;
     schema: Schema;
     sourceNode: PMNode;
     targetNodeType: NodeType;
 }
-export declare const getOutputNodes: ({ sourceNode, targetNodeType, schema, }: GetOutputNodesArgs) => PMNode[] | undefined;
+export declare const getOutputNodes: ({ sourceNode, targetNodeType, schema, isNested, }: GetOutputNodesArgs) => PMNode[] | undefined;
 export {};

package/dist/types-ts4.5/editor-commands/transform-node-utils/types.d.ts

@@ -1,5 +1,5 @@
 import type { Node as PMNode, Schema } from '@atlaskit/editor-prosemirror/model';
-export type NodeTypeName = 'blockquote' | 'blockCard' | 'bodiedExtension' | 'bulletList' | 'codeBlock' | 'decisionList' | 'embedCard' | 'expand' | 'extension' | 'heading' | 'layout' | 'media' | 'mediaGroup' | 'mediaSingle' | 'multiBodiedExtension' | 'orderedList' | 'panel' | 'paragraph' | 'nestedExpand' | 'taskList' | 'table';
+export type NodeTypeName = 'blockquote' | 'blockCard' | 'bodiedExtension' | 'bulletList' | 'codeBlock' | 'decisionList' | 'embedCard' | 'expand' | 'extension' | 'heading' | 'layoutSection' | 'media' | 'mediaGroup' | 'mediaSingle' | 'multiBodiedExtension' | 'orderedList' | 'panel' | 'paragraph' | 'nestedExpand' | 'taskList' | 'table';
 export type NodeCategory = 'atomic' | 'container' | 'list' | 'text';
 export declare const NODE_CATEGORY_BY_TYPE: Record<NodeTypeName, NodeCategory>;
 export declare const isNodeTypeName: (value: string) => value is NodeTypeName;

package/dist/types-ts4.5/editor-commands/transform-node-utils/unwrapExpandStep.d.ts

@@ -0,0 +1,8 @@
+import type { TransformStep } from './types';
+/**
+ * Unwraps an expand/nestedExpand node, converting its title attribute to a paragraph
+ * and prepending it to the children.
+ *
+ * Example: expand({ title: 'title' })(p('b')) → [p('title'), p('b')]
+ */
+export declare const unwrapExpandStep: TransformStep;

package/dist/types-ts4.5/editor-commands/transform-node-utils/unwrapListStep.d.ts

@@ -0,0 +1,7 @@
+import type { TransformStep } from './types';
+/**
+ * Given an array of nodes, returns an array with the flattened children of any list nodes.
+ * @param nodes
+ * @returns
+ */
+export declare const unwrapListStep: TransformStep;

package/dist/types-ts4.5/editor-commands/transform-node-utils/unwrapStep.d.ts

@@ -0,0 +1,2 @@
+import type { TransformStep } from './types';
+export declare const unwrapStep: TransformStep;

package/dist/types-ts4.5/editor-commands/transform-node-utils/utils.d.ts

@@ -1,3 +1,5 @@
 import type { Selection } from '@atlaskit/editor-prosemirror/state';
 import { type ContentNodeWithPos } from '@atlaskit/editor-prosemirror/utils';
+import type { NodeTypeName } from './types';
 export declare const getSelectedNode: (selection: Selection) => ContentNodeWithPos | undefined;
+export declare const getTargetNodeTypeNameInContext: (nodeTypeName: NodeTypeName | null, isNested?: boolean) => NodeTypeName | null;

package/dist/types-ts4.5/editor-commands/transform-node-utils/wrapIntoLayoutStep.d.ts

@@ -0,0 +1,2 @@
+import type { TransformStep } from './types';
+export declare const wrapIntoLayoutStep: TransformStep;

package/dist/types-ts4.5/editor-commands/transform-node-utils/wrapStep.d.ts

@@ -0,0 +1,2 @@
+import type { TransformStep } from './types';
+export declare const wrapStep: TransformStep;

package/dist/types-ts4.5/editor-commands/transforms/types.d.ts

@@ -1,7 +1,7 @@
 import type { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { TransformContext } from '@atlaskit/editor-common/transforms';
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
-export type FormatNodeTargetType = 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6' | 'paragraph' | 'blockquote' | 'expand' | 'layoutSection' | 'panel' | 'codeBlock' | 'bulletList' | 'orderedList' | 'taskList';
+export type FormatNodeTargetType = 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5' | 'heading6' | 'paragraph' | 'blockquote' | 'expand' | 'layoutSection' | 'panel' | 'codeBlock' | 'bulletList' | 'orderedList' | 'taskList' | 'decisionList';
 export type TransfromNodeTargetType = FormatNodeTargetType;
 export type FormatNodeAnalyticsAttrs = {
     inputMethod: INPUT_METHOD.BLOCK_MENU;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-menu",
-	"version": "5.1.3",
+	"version": "5.1.5",
 	"description": "BlockMenu plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -44,12 +44,12 @@
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/platform-feature-flags-react": "^0.4.0",
 		"@atlaskit/primitives": "^16.4.0",
-		"@atlaskit/tmp-editor-statsig": "^14.4.0",
+		"@atlaskit/tmp-editor-statsig": "^14.6.0",
 		"@atlaskit/tokens": "^8.4.0",
 		"@babel/runtime": "^7.0.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^110.37.0",
+		"@atlaskit/editor-common": "^110.38.0",
 		"react": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
 	},