@atlaskit/editor-plugin-layout 11.0.3 → 11.1.0

package/dist/esm/ui/LayoutColumnMenu/index.js

@@ -1,7 +1,9 @@
-import React, { useCallback, useEffect, useMemo } from 'react';
+import React, { useCallback, useEffect, useMemo, useRef } from 'react';
+import { bind } from 'bind-event-listener';
 import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { DRAG_HANDLE_SELECTOR } from '@atlaskit/editor-common/styles';
 import { Popup } from '@atlaskit/editor-common/ui';
+import { ArrowKeyNavigationProvider, ArrowKeyNavigationType } from '@atlaskit/editor-common/ui-menu';
 import { withReactEditorViewOuterListeners } from '@atlaskit/editor-common/ui-react';
 import { UserIntentPopupWrapper } from '@atlaskit/editor-common/user-intent';
 import { akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
@@ -13,6 +15,7 @@ import { LAYOUT_COLUMN_MENU } from './keys';
 var PopupWithListeners = withReactEditorViewOuterListeners(Popup);
 var LAYOUT_COLUMN_MENU_POPUP_OFFSET = [0, 4];
 var TOOLBAR_MENU_SELECTOR = '[data-toolbar-component="menu"]';
+var NESTED_DROPDOWN_MENU_SELECTOR = '[data-toolbar-nested-dropdown-menu]';
 
 /**
  * Returns the drag handle button for the selected layout column.
@@ -30,6 +33,9 @@ var getLayoutColumnMenuTarget = function getLayoutColumnMenuTarget(editorView, s
   var dragHandleContainer = (_columnDomRef$parentE = columnDomRef.parentElement) === null || _columnDomRef$parentE === void 0 ? void 0 : _columnDomRef$parentE.querySelector(':scope > [data-blocks-drag-handle-container]');
   return dragHandleContainer === null || dragHandleContainer === void 0 ? void 0 : dragHandleContainer.querySelector(DRAG_HANDLE_SELECTOR);
 };
+var focusTrap = {
+  initialFocus: undefined
+};
 export var LayoutColumnMenu = /*#__PURE__*/React.memo(function LayoutColumnMenu(_ref) {
   var _api$uiControlRegistr, _api$uiControlRegistr2;
   var api = _ref.api,
@@ -38,15 +44,17 @@ export var LayoutColumnMenu = /*#__PURE__*/React.memo(function LayoutColumnMenu(
     boundariesElement = _ref.boundariesElement,
     scrollableElement = _ref.scrollableElement;
   var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['layout', 'selection'], function (states) {
-      var _states$layoutState$i, _states$layoutState, _states$layoutState2, _states$selectionStat;
+      var _states$layoutState$i, _states$layoutState, _states$layoutState2, _states$layoutState$l, _states$layoutState3, _states$selectionStat;
       return {
         isLayoutColumnMenuOpen: (_states$layoutState$i = (_states$layoutState = states.layoutState) === null || _states$layoutState === void 0 ? void 0 : _states$layoutState.isLayoutColumnMenuOpen) !== null && _states$layoutState$i !== void 0 ? _states$layoutState$i : false,
         layoutColumnMenuAnchorPos: (_states$layoutState2 = states.layoutState) === null || _states$layoutState2 === void 0 ? void 0 : _states$layoutState2.layoutColumnMenuAnchorPos,
+        openedViaKeyboard: (_states$layoutState$l = (_states$layoutState3 = states.layoutState) === null || _states$layoutState3 === void 0 ? void 0 : _states$layoutState3.layoutColumnMenuOpenedViaKeyboard) !== null && _states$layoutState$l !== void 0 ? _states$layoutState$l : false,
         selection: (_states$selectionStat = states.selectionState) === null || _states$selectionStat === void 0 ? void 0 : _states$selectionStat.selection
       };
     }),
     isLayoutColumnMenuOpen = _useSharedPluginState.isLayoutColumnMenuOpen,
     layoutColumnMenuAnchorPos = _useSharedPluginState.layoutColumnMenuAnchorPos,
+    openedViaKeyboard = _useSharedPluginState.openedViaKeyboard,
     selection = _useSharedPluginState.selection;
   var closeLayoutColumnMenu = useCallback(function () {
     var _api$core, _api$layout;
@@ -55,7 +63,7 @@ export var LayoutColumnMenu = /*#__PURE__*/React.memo(function LayoutColumnMenu(
     }));
   }, [api]);
   var handleClickOutside = useCallback(function (event) {
-    if (event.target instanceof Element && (event.target.closest(TOOLBAR_MENU_SELECTOR) || event.target.closest('[data-toolbar-nested-dropdown-menu]'))) {
+    if (event.target instanceof Element && (event.target.closest(TOOLBAR_MENU_SELECTOR) || event.target.closest(NESTED_DROPDOWN_MENU_SELECTOR))) {
       return;
     }
 
@@ -72,6 +80,38 @@ export var LayoutColumnMenu = /*#__PURE__*/React.memo(function LayoutColumnMenu(
       closeLayoutColumnMenu();
     }
   }, [closeLayoutColumnMenu]);
+  var handleArrowKeyNavigationClose = useCallback(function (event) {
+    event.preventDefault();
+    closeLayoutColumnMenu();
+  }, [closeLayoutColumnMenu]);
+  var shouldDisableArrowKeyNavigation = useCallback(function (event) {
+    if (event.key !== 'ArrowUp' && event.key !== 'ArrowDown') {
+      return false;
+    }
+    var target = event.target;
+    if (!(target instanceof HTMLElement)) {
+      return false;
+    }
+    return target.closest(NESTED_DROPDOWN_MENU_SELECTOR) !== null;
+  }, []);
+  var menuWrapperRef = useRef(null);
+  var handleMenuKeyDown = useCallback(function (event) {
+    // Keep menu keyboard events scoped to the menu while preserving Escape and
+    // ArrowUp/ArrowDown handling from Popup and ArrowKeyNavigationProvider.
+    if (event.key !== 'Escape' && event.key !== 'ArrowUp' && event.key !== 'ArrowDown') {
+      event.stopPropagation();
+    }
+  }, []);
+  useEffect(function () {
+    var menuWrapper = menuWrapperRef.current;
+    if (!isLayoutColumnMenuOpen || !menuWrapper) {
+      return;
+    }
+    return bind(menuWrapper, {
+      type: 'keydown',
+      listener: handleMenuKeyDown
+    });
+  }, [handleMenuKeyDown, isLayoutColumnMenuOpen]);
   var components = (_api$uiControlRegistr = api === null || api === void 0 || (_api$uiControlRegistr2 = api.uiControlRegistry) === null || _api$uiControlRegistr2 === void 0 ? void 0 : _api$uiControlRegistr2.actions.getComponents(LAYOUT_COLUMN_MENU.key)) !== null && _api$uiControlRegistr !== void 0 ? _api$uiControlRegistr : [];
   var target = useMemo(function () {
     return isLayoutColumnMenuOpen ? getLayoutColumnMenuTarget(editorView, selection, layoutColumnMenuAnchorPos) : null;
@@ -96,16 +136,23 @@ export var LayoutColumnMenu = /*#__PURE__*/React.memo(function LayoutColumnMenu(
     stick: true,
     offset: LAYOUT_COLUMN_MENU_POPUP_OFFSET,
     handleClickOutside: handleClickOutside,
-    handleEscapeKeydown: closeLayoutColumnMenu
+    handleEscapeKeydown: closeLayoutColumnMenu,
+    focusTrap: openedViaKeyboard ? focusTrap : undefined
+  }, /*#__PURE__*/React.createElement("div", {
+    ref: menuWrapperRef
   }, /*#__PURE__*/React.createElement(UserIntentPopupWrapper, {
     api: api,
     userIntent: "layoutColumnMenuPopupOpen"
   }, /*#__PURE__*/React.createElement(ToolbarDropdownMenuProvider, {
     isOpen: isLayoutColumnMenuOpen,
     setIsOpen: handleSetIsOpen
+  }, /*#__PURE__*/React.createElement(ArrowKeyNavigationProvider, {
+    type: ArrowKeyNavigationType.MENU,
+    handleClose: handleArrowKeyNavigationClose,
+    disableArrowKeyNavigation: shouldDisableArrowKeyNavigation
   }, /*#__PURE__*/React.createElement(SurfaceRenderer, {
     components: components,
     fallbacks: LAYOUT_COLUMN_MENU_FALLBACKS,
     surface: LAYOUT_COLUMN_MENU
-  }))));
+  }))))));
 });

package/dist/esm/ui/LayoutSSRReactContextsProvider.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { RawIntlProvider } from 'react-intl';
+import { isSSR, isSSRStreaming } from '@atlaskit/editor-common/core-utils';
+/**
+ * Wraps the layout section nodeview children with the editor's actual
+ * IntlProvider during SSR streaming (renderToStaticMarkup). This ensures any
+ * descendants that call `useIntl()` (e.g. `BreakoutResizer`'s ARIA labels)
+ * have a valid intl context and do not throw during the static render pass.
+ *
+ * Outside of SSR streaming this is a no-op passthrough.
+ *
+ * Follows the same pattern as `MediaSSRReactContextsProvider` and
+ * `SyncBlockSSRReactContextsProvider`.
+ */
+export function LayoutSSRReactContextsProvider(_ref) {
+  var children = _ref.children,
+    intl = _ref.intl;
+  if (!isSSRStreaming() || !isSSR()) {
+    return children;
+  }
+  if (!intl) {
+    return children;
+  }
+  return /*#__PURE__*/React.createElement(RawIntlProvider, {
+    value: intl
+  }, children);
+}

package/dist/esm/ui/global-styles.js

@@ -11,6 +11,13 @@ import { useIntl } from 'react-intl';
 import { layoutMessages as messages } from '@atlaskit/editor-common/messages';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 var PLACEHOLDER_SELECTOR = '.ProseMirror-focused .layoutSectionView-content-wrap.selected [data-layout-column] > [data-layout-content] > p:only-child:has(.ProseMirror-trailingBreak:only-child)';
+var layoutColumnDangerPreviewStyle = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+  '.ProseMirror [data-layout-column].layout-column-danger-preview': {
+    backgroundColor: "var(--ds-background-danger, #FFECEB)",
+    boxShadow: "inset 0 0 0 2px ".concat("var(--ds-border-danger, #E2483D)")
+  }
+});
 var getPlaceholderStyle = function getPlaceholderStyle(message) {
   if (editorExperiment('platform_editor_controls', 'variant1')) {
     return css(_defineProperty({}, "".concat(PLACEHOLDER_SELECTOR), {
@@ -48,7 +55,10 @@ export var GlobalStylesWrapper = function GlobalStylesWrapper() {
     var placeholderText = editorExperiment('platform_editor_controls', 'variant1') ? messages.controlslayoutPlaceholder : messages.layoutPlaceholder;
     return getPlaceholderStyle(formatMessage(placeholderText));
   }, [formatMessage]);
+  var globalStyles = useMemo(function () {
+    return [placeholderStyle, layoutColumnDangerPreviewStyle];
+  }, [placeholderStyle]);
   return jsx(Global, {
-    styles: placeholderStyle
+    styles: globalStyles
   });
 };

package/dist/types/layoutPluginType.d.ts

@@ -12,7 +12,7 @@ import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { UiControlRegistryPlugin } from '@atlaskit/editor-plugin-ui-control-registry';
 import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
-import type { DistributeLayoutColumnsOptions, InsertLayoutColumnsInputMethod, InsertLayoutColumnSide } from './pm-plugins/actions';
+import type { DistributeLayoutColumnsOptions, InsertLayoutColumnSide, InsertLayoutColumnsInputMethod, LayoutColumnActionInputMethod, ToggleLayoutColumnMenuOptions } from './pm-plugins/actions';
 import type { LayoutState } from './pm-plugins/types';
 import type { LayoutPluginOptions } from './types';
 export type LayoutPluginDependencies = [
@@ -34,14 +34,12 @@ export type LayoutPlugin = NextEditorPlugin<'layout', {
         insertLayoutColumns: (inputMethod: InsertLayoutColumnsInputMethod) => Command;
     };
     commands: {
-        deleteLayoutColumn: EditorCommand;
+        deleteLayoutColumn: (inputMethod?: LayoutColumnActionInputMethod) => EditorCommand;
         distributeLayoutColumns: (options?: DistributeLayoutColumnsOptions) => EditorCommand;
-        insertLayoutColumn: (side: InsertLayoutColumnSide) => EditorCommand;
+        insertLayoutColumn: (side: InsertLayoutColumnSide, inputMethod?: LayoutColumnActionInputMethod) => EditorCommand;
+        setLayoutColumnDangerPreview: (show: boolean) => EditorCommand;
         setLayoutColumnValign: (valign: Valign) => EditorCommand;
-        toggleLayoutColumnMenu: (options: {
-            anchorPos?: number;
-            isOpen?: boolean;
-        }) => EditorCommand;
+        toggleLayoutColumnMenu: (options: ToggleLayoutColumnMenuOptions) => EditorCommand;
     };
     dependencies: LayoutPluginDependencies;
     pluginConfiguration: LayoutPluginOptions | undefined;

package/dist/types/nodeviews/index.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import type { IntlShape } from 'react-intl';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
@@ -10,6 +11,7 @@ import type { LayoutPluginOptions } from '../types';
 type LayoutSectionViewProps = {
     eventDispatcher: EventDispatcher;
     getPos: getPosHandlerNode;
+    intl?: IntlShape;
     node: PMNode;
     options: LayoutPluginOptions;
     pluginInjectionApi?: ExtractInjectionAPI<LayoutPlugin>;
@@ -24,6 +26,7 @@ export declare class LayoutSectionView extends ReactNodeView<LayoutSectionViewPr
     options: LayoutPluginOptions;
     layoutDOM?: HTMLElement;
     isEmpty?: boolean;
+    private intl?;
     /**
      * constructor
      * @param props
@@ -34,11 +37,13 @@ export declare class LayoutSectionView extends ReactNodeView<LayoutSectionViewPr
      * @param props.eventDispatcher
      * @param props.pluginInjectionApi
      * @param props.options
+     * @param props.intl
      * @example
      */
     constructor(props: {
         eventDispatcher: EventDispatcher;
         getPos: getPosHandlerNode;
+        intl?: IntlShape;
         node: PMNode;
         options: LayoutPluginOptions;
         pluginInjectionApi: ExtractInjectionAPI<LayoutPlugin>;

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

@@ -37,20 +37,24 @@ export type LayoutColumnInsertMeta = {
     side: InsertLayoutColumnSide;
 };
 type LayoutPluginAPI = ExtractInjectionAPI<LayoutPlugin> | undefined;
+export type LayoutColumnActionInputMethod = INPUT_METHOD.LAYOUT_COLUMN_MENU | INPUT_METHOD.KEYBOARD;
 /**
  * Returns the active maximum layout column count for the current advanced layouts experiment state.
  */
 export declare function getEffectiveMaxLayoutColumns(): number;
-export declare const insertLayoutColumn: (side: InsertLayoutColumnSide, editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI) => EditorCommand;
+export declare const insertLayoutColumn: (side: InsertLayoutColumnSide, editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI, inputMethod?: LayoutColumnActionInputMethod) => EditorCommand;
 export declare const setLayoutColumnValign: (valign: Valign, editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI) => EditorCommand;
 export type DistributeLayoutColumnsOptions = {
     inputMethod?: INPUT_METHOD.LAYOUT_COLUMN_MENU | INPUT_METHOD.FLOATING_TB;
     target?: 'selectedColumns' | 'allColumns';
 };
 export declare const distributeLayoutColumns: (editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI) => ({ inputMethod, target, }?: DistributeLayoutColumnsOptions) => EditorCommand;
-export declare const toggleLayoutColumnMenu: ({ anchorPos, isOpen }: {
+export type ToggleLayoutColumnMenuOptions = {
     anchorPos?: number;
     isOpen?: boolean;
-}) => EditorCommand;
-export declare const deleteLayoutColumn: (editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI) => EditorCommand;
+    openedViaKeyboard?: boolean;
+};
+export declare const toggleLayoutColumnMenu: ({ anchorPos, isOpen, openedViaKeyboard }: ToggleLayoutColumnMenuOptions) => EditorCommand;
+export declare const setLayoutColumnDangerPreview: (show: boolean) => EditorCommand;
+export declare const deleteLayoutColumn: (editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI, inputMethod?: LayoutColumnActionInputMethod) => EditorCommand;
 export {};

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

@@ -0,0 +1,10 @@
+import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { LayoutPlugin } from '../layoutPluginType';
+/**
+ * Creates shortcut handlers for layout column actions.
+ */
+declare function keymapPlugin({ api }: {
+    api: ExtractInjectionAPI<LayoutPlugin> | undefined;
+}): SafePlugin;
+export default keymapPlugin;

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

@@ -1,3 +1,4 @@
+import type { IntlShape } from 'react-intl';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
@@ -6,5 +7,5 @@ import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import type { LayoutPlugin } from '../layoutPluginType';
 import type { LayoutPluginOptions } from '../types';
 export declare const pluginKey: PluginKey;
-declare const _default: (options: LayoutPluginOptions, pluginInjectionApi: ExtractInjectionAPI<LayoutPlugin>, portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher) => SafePlugin<undefined>;
+declare const _default: (options: LayoutPluginOptions, pluginInjectionApi: ExtractInjectionAPI<LayoutPlugin>, portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, intl?: IntlShape) => SafePlugin<undefined>;
 export default _default;

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

@@ -4,9 +4,11 @@ export type LayoutState = {
     addSidebarLayouts: boolean;
     allowBreakout: boolean;
     allowSingleColumnLayout: boolean;
+    dangerPreviewLayoutColumnPositions: number[] | undefined;
     isLayoutColumnMenuOpen: boolean;
     isResizing: boolean;
     layoutColumnMenuAnchorPos: number | undefined;
+    layoutColumnMenuOpenedViaKeyboard: boolean;
     pos: number | null;
     selectedLayout: PresetLayout | undefined;
 };

package/dist/types/pm-plugins/utils/layout-column-selection.d.ts

@@ -13,6 +13,7 @@ export type SelectedLayoutColumns = {
     startIndex: number;
 };
 export declare const getSelectedLayoutColumnsFromSelection: (selection: Selection) => SelectedLayoutColumns | undefined;
+export declare const getLayoutColumnsFromContentSelection: (selection: Selection) => SelectedLayoutColumns | undefined;
 export declare const getAllLayoutColumnsFromSelection: (selection: Selection) => SelectedLayoutColumns | undefined;
 export declare const getLayoutColumnValign: (layoutColumn: PMNode | undefined) => Valign | undefined;
 export declare const getLayoutColumnMenuAnchorPos: (selection: Selection, anchorPosFromHandle?: number) => number | undefined;

package/dist/types/ui/LayoutSSRReactContextsProvider.d.ts

@@ -0,0 +1,19 @@
+import { type ReactNode } from 'react';
+import { type IntlShape } from 'react-intl';
+interface Props {
+    children: ReactNode;
+    intl: IntlShape | undefined;
+}
+/**
+ * Wraps the layout section nodeview children with the editor's actual
+ * IntlProvider during SSR streaming (renderToStaticMarkup). This ensures any
+ * descendants that call `useIntl()` (e.g. `BreakoutResizer`'s ARIA labels)
+ * have a valid intl context and do not throw during the static render pass.
+ *
+ * Outside of SSR streaming this is a no-op passthrough.
+ *
+ * Follows the same pattern as `MediaSSRReactContextsProvider` and
+ * `SyncBlockSSRReactContextsProvider`.
+ */
+export declare function LayoutSSRReactContextsProvider({ children, intl }: Props): ReactNode;
+export {};

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

@@ -12,7 +12,7 @@ import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { UiControlRegistryPlugin } from '@atlaskit/editor-plugin-ui-control-registry';
 import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
-import type { DistributeLayoutColumnsOptions, InsertLayoutColumnsInputMethod, InsertLayoutColumnSide } from './pm-plugins/actions';
+import type { DistributeLayoutColumnsOptions, InsertLayoutColumnSide, InsertLayoutColumnsInputMethod, LayoutColumnActionInputMethod, ToggleLayoutColumnMenuOptions } from './pm-plugins/actions';
 import type { LayoutState } from './pm-plugins/types';
 import type { LayoutPluginOptions } from './types';
 export type LayoutPluginDependencies = [
@@ -34,14 +34,12 @@ export type LayoutPlugin = NextEditorPlugin<'layout', {
         insertLayoutColumns: (inputMethod: InsertLayoutColumnsInputMethod) => Command;
     };
     commands: {
-        deleteLayoutColumn: EditorCommand;
+        deleteLayoutColumn: (inputMethod?: LayoutColumnActionInputMethod) => EditorCommand;
         distributeLayoutColumns: (options?: DistributeLayoutColumnsOptions) => EditorCommand;
-        insertLayoutColumn: (side: InsertLayoutColumnSide) => EditorCommand;
+        insertLayoutColumn: (side: InsertLayoutColumnSide, inputMethod?: LayoutColumnActionInputMethod) => EditorCommand;
+        setLayoutColumnDangerPreview: (show: boolean) => EditorCommand;
         setLayoutColumnValign: (valign: Valign) => EditorCommand;
-        toggleLayoutColumnMenu: (options: {
-            anchorPos?: number;
-            isOpen?: boolean;
-        }) => EditorCommand;
+        toggleLayoutColumnMenu: (options: ToggleLayoutColumnMenuOptions) => EditorCommand;
     };
     dependencies: LayoutPluginDependencies;
     pluginConfiguration: LayoutPluginOptions | undefined;

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import type { IntlShape } from 'react-intl';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
@@ -10,6 +11,7 @@ import type { LayoutPluginOptions } from '../types';
 type LayoutSectionViewProps = {
     eventDispatcher: EventDispatcher;
     getPos: getPosHandlerNode;
+    intl?: IntlShape;
     node: PMNode;
     options: LayoutPluginOptions;
     pluginInjectionApi?: ExtractInjectionAPI<LayoutPlugin>;
@@ -24,6 +26,7 @@ export declare class LayoutSectionView extends ReactNodeView<LayoutSectionViewPr
     options: LayoutPluginOptions;
     layoutDOM?: HTMLElement;
     isEmpty?: boolean;
+    private intl?;
     /**
      * constructor
      * @param props
@@ -34,11 +37,13 @@ export declare class LayoutSectionView extends ReactNodeView<LayoutSectionViewPr
      * @param props.eventDispatcher
      * @param props.pluginInjectionApi
      * @param props.options
+     * @param props.intl
      * @example
      */
     constructor(props: {
         eventDispatcher: EventDispatcher;
         getPos: getPosHandlerNode;
+        intl?: IntlShape;
         node: PMNode;
         options: LayoutPluginOptions;
         pluginInjectionApi: ExtractInjectionAPI<LayoutPlugin>;

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

@@ -37,20 +37,24 @@ export type LayoutColumnInsertMeta = {
     side: InsertLayoutColumnSide;
 };
 type LayoutPluginAPI = ExtractInjectionAPI<LayoutPlugin> | undefined;
+export type LayoutColumnActionInputMethod = INPUT_METHOD.LAYOUT_COLUMN_MENU | INPUT_METHOD.KEYBOARD;
 /**
  * Returns the active maximum layout column count for the current advanced layouts experiment state.
  */
 export declare function getEffectiveMaxLayoutColumns(): number;
-export declare const insertLayoutColumn: (side: InsertLayoutColumnSide, editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI) => EditorCommand;
+export declare const insertLayoutColumn: (side: InsertLayoutColumnSide, editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI, inputMethod?: LayoutColumnActionInputMethod) => EditorCommand;
 export declare const setLayoutColumnValign: (valign: Valign, editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI) => EditorCommand;
 export type DistributeLayoutColumnsOptions = {
     inputMethod?: INPUT_METHOD.LAYOUT_COLUMN_MENU | INPUT_METHOD.FLOATING_TB;
     target?: 'selectedColumns' | 'allColumns';
 };
 export declare const distributeLayoutColumns: (editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI) => ({ inputMethod, target, }?: DistributeLayoutColumnsOptions) => EditorCommand;
-export declare const toggleLayoutColumnMenu: ({ anchorPos, isOpen }: {
+export type ToggleLayoutColumnMenuOptions = {
     anchorPos?: number;
     isOpen?: boolean;
-}) => EditorCommand;
-export declare const deleteLayoutColumn: (editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI) => EditorCommand;
+    openedViaKeyboard?: boolean;
+};
+export declare const toggleLayoutColumnMenu: ({ anchorPos, isOpen, openedViaKeyboard }: ToggleLayoutColumnMenuOptions) => EditorCommand;
+export declare const setLayoutColumnDangerPreview: (show: boolean) => EditorCommand;
+export declare const deleteLayoutColumn: (editorAnalyticsAPI?: EditorAnalyticsAPI, api?: LayoutPluginAPI, inputMethod?: LayoutColumnActionInputMethod) => EditorCommand;
 export {};

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

@@ -0,0 +1,10 @@
+import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { LayoutPlugin } from '../layoutPluginType';
+/**
+ * Creates shortcut handlers for layout column actions.
+ */
+declare function keymapPlugin({ api }: {
+    api: ExtractInjectionAPI<LayoutPlugin> | undefined;
+}): SafePlugin;
+export default keymapPlugin;

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

@@ -1,3 +1,4 @@
+import type { IntlShape } from 'react-intl';
 import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import type { PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
@@ -6,5 +7,5 @@ import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import type { LayoutPlugin } from '../layoutPluginType';
 import type { LayoutPluginOptions } from '../types';
 export declare const pluginKey: PluginKey;
-declare const _default: (options: LayoutPluginOptions, pluginInjectionApi: ExtractInjectionAPI<LayoutPlugin>, portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher) => SafePlugin<undefined>;
+declare const _default: (options: LayoutPluginOptions, pluginInjectionApi: ExtractInjectionAPI<LayoutPlugin>, portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, intl?: IntlShape) => SafePlugin<undefined>;
 export default _default;

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

@@ -4,9 +4,11 @@ export type LayoutState = {
     addSidebarLayouts: boolean;
     allowBreakout: boolean;
     allowSingleColumnLayout: boolean;
+    dangerPreviewLayoutColumnPositions: number[] | undefined;
     isLayoutColumnMenuOpen: boolean;
     isResizing: boolean;
     layoutColumnMenuAnchorPos: number | undefined;
+    layoutColumnMenuOpenedViaKeyboard: boolean;
     pos: number | null;
     selectedLayout: PresetLayout | undefined;
 };

package/dist/types-ts4.5/pm-plugins/utils/layout-column-selection.d.ts

@@ -13,6 +13,7 @@ export type SelectedLayoutColumns = {
     startIndex: number;
 };
 export declare const getSelectedLayoutColumnsFromSelection: (selection: Selection) => SelectedLayoutColumns | undefined;
+export declare const getLayoutColumnsFromContentSelection: (selection: Selection) => SelectedLayoutColumns | undefined;
 export declare const getAllLayoutColumnsFromSelection: (selection: Selection) => SelectedLayoutColumns | undefined;
 export declare const getLayoutColumnValign: (layoutColumn: PMNode | undefined) => Valign | undefined;
 export declare const getLayoutColumnMenuAnchorPos: (selection: Selection, anchorPosFromHandle?: number) => number | undefined;

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

@@ -0,0 +1,19 @@
+import { type ReactNode } from 'react';
+import { type IntlShape } from 'react-intl';
+interface Props {
+    children: ReactNode;
+    intl: IntlShape | undefined;
+}
+/**
+ * Wraps the layout section nodeview children with the editor's actual
+ * IntlProvider during SSR streaming (renderToStaticMarkup). This ensures any
+ * descendants that call `useIntl()` (e.g. `BreakoutResizer`'s ARIA labels)
+ * have a valid intl context and do not throw during the static render pass.
+ *
+ * Outside of SSR streaming this is a no-op passthrough.
+ *
+ * Follows the same pattern as `MediaSSRReactContextsProvider` and
+ * `SyncBlockSSRReactContextsProvider`.
+ */
+export declare function LayoutSSRReactContextsProvider({ children, intl }: Props): ReactNode;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-layout",
-	"version": "11.0.3",
+	"version": "11.1.0",
 	"description": "Layout plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -32,7 +32,7 @@
 		"@atlaskit/adf-schema": "^52.16.0",
 		"@atlaskit/css": "^0.19.0",
 		"@atlaskit/editor-plugin-analytics": "^11.0.0",
-		"@atlaskit/editor-plugin-block-controls": "^12.0.0",
+		"@atlaskit/editor-plugin-block-controls": "^12.1.0",
 		"@atlaskit/editor-plugin-block-menu": "^10.1.0",
 		"@atlaskit/editor-plugin-decorations": "^11.0.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^11.0.0",
@@ -50,14 +50,14 @@
 		"@atlaskit/icon": "^35.4.0",
 		"@atlaskit/icon-lab": "^6.13.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/tmp-editor-statsig": "^89.0.0",
-		"@atlaskit/tokens": "^13.1.0",
+		"@atlaskit/tmp-editor-statsig": "^89.4.0",
+		"@atlaskit/tokens": "^13.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
 		"bind-event-listener": "^3.0.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^115.3.0",
+		"@atlaskit/editor-common": "^115.7.0",
 		"react": "^18.2.0",
 		"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
 	},