@atlaskit/editor-plugin-block-controls 8.7.2 → 8.8.0

package/dist/esm/ui/visibility-container.js

@@ -1,17 +1,20 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /**
  * @jsxRuntime classic
  * @jsx jsx
  */
-import React from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
 // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, xcss } from '@atlaskit/primitives';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
+var RIGHT_CONTROL_HIDE_DELAY_MS = 150;
 var baseStyles = xcss({
   transition: 'opacity 0.1s ease-in-out, visibility 0.1s ease-in-out'
 });
@@ -39,14 +42,70 @@ var hiddenStylesCSS = css({
 });
 export var VisibilityContainer = function VisibilityContainer(_ref) {
   var api = _ref.api,
-    children = _ref.children;
-  var isTypeAheadOpen = useSharedPluginStateSelector(api, 'typeAhead.isOpen');
-  var isEditing = useSharedPluginStateSelector(api, 'blockControls.isEditing');
-  var isMouseOut = useSharedPluginStateSelector(api, 'blockControls.isMouseOut');
+    children = _ref.children,
+    controlSide = _ref.controlSide;
+  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['typeAhead', 'blockControls', 'editorViewMode', 'userIntent'], function (states) {
+      var _states$typeAheadStat, _states$blockControls, _states$blockControls2, _states$blockControls3, _states$editorViewMod, _states$userIntentSta, _states$blockControls4;
+      return {
+        isTypeAheadOpen: (_states$typeAheadStat = states.typeAheadState) === null || _states$typeAheadStat === void 0 ? void 0 : _states$typeAheadStat.isOpen,
+        isEditing: (_states$blockControls = states.blockControlsState) === null || _states$blockControls === void 0 ? void 0 : _states$blockControls.isEditing,
+        isMouseOut: (_states$blockControls2 = states.blockControlsState) === null || _states$blockControls2 === void 0 ? void 0 : _states$blockControls2.isMouseOut,
+        hoverSide: (_states$blockControls3 = states.blockControlsState) === null || _states$blockControls3 === void 0 ? void 0 : _states$blockControls3.hoverSide,
+        editorViewMode: (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode,
+        userIntent: (_states$userIntentSta = states.userIntentState) === null || _states$userIntentSta === void 0 ? void 0 : _states$userIntentSta.currentUserIntent,
+        rightSideControlsEnabled: (_states$blockControls4 = states.blockControlsState) === null || _states$blockControls4 === void 0 ? void 0 : _states$blockControls4.rightSideControlsEnabled
+      };
+    }),
+    isTypeAheadOpen = _useSharedPluginState.isTypeAheadOpen,
+    isEditing = _useSharedPluginState.isEditing,
+    isMouseOut = _useSharedPluginState.isMouseOut,
+    hoverSide = _useSharedPluginState.hoverSide,
+    editorViewMode = _useSharedPluginState.editorViewMode,
+    userIntent = _useSharedPluginState.userIntent,
+    rightSideControlsEnabled = _useSharedPluginState.rightSideControlsEnabled;
+  var isViewMode = editorViewMode === 'view';
+  var shouldRestrictBySide = rightSideControlsEnabled && expValEquals('confluence_remix_icon_right_side', 'isEnabled', true) && controlSide !== undefined && !isViewMode;
+  // Only restrict by side when hoverSide is known (after mousemove). When undefined, show both
+  // controls so drag handle is visible on load and for keyboard-only users.
+  var sideHidden = shouldRestrictBySide && hoverSide !== undefined ? hoverSide !== controlSide : false;
+  // In view mode with right-side controls, we delay hiding on isMouseOut (see below) so the right-edge
+  // button stays visible when the user moves from the block toward the button (e.g. in edit/live
+  // pages), avoiding flicker as the mouse crosses boundaries.
+  var hideOnMouseOut = isMouseOut;
+  var shouldHideImmediate = isTypeAheadOpen || isEditing || hideOnMouseOut || userIntent === 'aiStreaming' || sideHidden;
 
-  // when ai streaming, hide the block controls
-  var userIntent = useSharedPluginStateSelector(api, 'userIntent.currentUserIntent');
-  var shouldHide = isTypeAheadOpen || isEditing || isMouseOut || userIntent === 'aiStreaming';
+  // Delay hiding the right control in view mode to reduce flickering when moving from block
+  // toward the right-edge button (avoids rapid show/hide as mouse crosses boundaries).
+  var isRightControlViewMode = isViewMode && rightSideControlsEnabled && expValEquals('confluence_remix_icon_right_side', 'isEnabled', true) && controlSide === 'right';
+  // When in right-control view mode, we delay hiding so start visible; useEffect will update after delay
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    delayedShouldHide = _useState2[0],
+    setDelayedShouldHide = _useState2[1];
+  var hideTimeoutRef = useRef(null);
+  useEffect(function () {
+    if (!isRightControlViewMode) {
+      return;
+    }
+    if (!shouldHideImmediate) {
+      if (hideTimeoutRef.current) {
+        clearTimeout(hideTimeoutRef.current);
+        hideTimeoutRef.current = null;
+      }
+      setDelayedShouldHide(false);
+      return;
+    }
+    hideTimeoutRef.current = setTimeout(function () {
+      hideTimeoutRef.current = null;
+      setDelayedShouldHide(true);
+    }, RIGHT_CONTROL_HIDE_DELAY_MS);
+    return function () {
+      if (hideTimeoutRef.current) {
+        clearTimeout(hideTimeoutRef.current);
+      }
+    };
+  }, [shouldHideImmediate, isRightControlViewMode]);
+  var shouldHide = isRightControlViewMode ? delayedShouldHide : shouldHideImmediate;
   if (editorExperiment('platform_editor_preview_panel_responsiveness', true, {
     exposure: true
   })) {

package/dist/types/blockControlsPluginType.d.ts

@@ -1,10 +1,11 @@
 import type { IntlShape } from 'react-intl-next';
 import type { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { PortalProviderAPI } from '@atlaskit/editor-common/portal';
-import type { DIRECTION, EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
+import type { DIRECTION, EditorCommand, NextEditorPlugin, OptionalPlugin, PublicPluginAPI } from '@atlaskit/editor-common/types';
 import type { AccessibilityUtilsPlugin } from '@atlaskit/editor-plugin-accessibility-utils';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
+import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { InteractionPlugin } from '@atlaskit/editor-plugin-interaction';
 import type { LimitedModePlugin } from '@atlaskit/editor-plugin-limited-mode';
@@ -77,6 +78,10 @@ export interface PluginState {
     preservedSelection?: Selection;
 }
 export type ReleaseHiddenDecoration = () => boolean | undefined;
+export type BlockControlsPluginConfig = {
+    /** Enable left/right hover split: show left controls when hovering left, right controls when hovering right */
+    rightSideControlsEnabled?: boolean;
+};
 export type BlockControlsSharedState = {
     activeDropTargetNode?: ActiveDropTargetNode;
     activeNode?: ActiveNode;
@@ -85,6 +90,7 @@ export type BlockControlsSharedState = {
         canMoveUp?: boolean;
         openedViaKeyboard?: boolean;
     };
+    hoverSide?: 'left' | 'right';
     isDragging: boolean;
     isEditing?: boolean;
     isMenuOpen: boolean;
@@ -97,10 +103,20 @@ export type BlockControlsSharedState = {
     menuTriggerByNode?: TriggerByNode;
     multiSelectDnD?: MultiSelectDnD;
     preservedSelection?: Selection;
+    /** Whether left/right hover split is enabled (from plugin config) */
+    rightSideControlsEnabled?: boolean;
 } | undefined;
 export type HandleOptions = {
     isFocused: boolean;
 } | undefined;
+/**
+ * Props passed to custom right-edge button components (e.g. config.rightEdgeButton).
+ * Used by malleable-ui for BlockRemixButton when rendered via node decoration.
+ */
+export type RightEdgeButtonProps = {
+    api: PublicPluginAPI<[BlockControlsPlugin]>;
+    getPos: () => number | undefined;
+};
 export type NodeDecorationFactoryParams = {
     anchorName: string;
     editorState: EditorState;
@@ -110,14 +126,21 @@ export type NodeDecorationFactoryParams = {
     rootNodeType?: string;
     rootPos: number;
 };
+/**
+ * When true, this factory's decorations are shown in view mode on block hover
+ * (without drag handle or quick insert). Used for right-edge controls.
+ */
 export type NodeDecorationFactory = {
     create: (params: NodeDecorationFactoryParams) => Decoration;
+    /** Show this decoration in view mode when hovering over a block */
+    showInViewMode?: boolean;
     type: string;
 };
 export type MoveNode = (start: number, to: number, inputMethod?: MoveNodeMethod, formatMessage?: IntlShape['formatMessage']) => EditorCommand;
 export type BlockControlsPluginDependencies = [
     OptionalPlugin<LimitedModePlugin>,
     OptionalPlugin<EditorDisabledPlugin>,
+    OptionalPlugin<EditorViewModePlugin>,
     OptionalPlugin<WidthPlugin>,
     OptionalPlugin<FeatureFlagsPlugin>,
     OptionalPlugin<AnalyticsPlugin>,
@@ -175,6 +198,7 @@ export type BlockControlsPlugin = NextEditorPlugin<'blockControls', {
         }) => EditorCommand;
     };
     dependencies: BlockControlsPluginDependencies;
+    pluginConfiguration?: BlockControlsPluginConfig;
     sharedState: BlockControlsSharedState;
 }>;
 export type BlockControlsMeta = {

package/dist/types/index.d.ts

@@ -1,2 +1,2 @@
 export { blockControlsPlugin } from './blockControlsPlugin';
-export type { BlockControlsPlugin, BlockControlsSharedState, HandleOptions, MoveNodeMethod, BlockControlsPluginDependencies, NodeDecorationFactory, NodeDecorationFactoryParams, PluginState, MoveNode, } from './blockControlsPluginType';
+export type { BlockControlsPlugin, BlockControlsPluginConfig, BlockControlsSharedState, HandleOptions, MoveNodeMethod, BlockControlsPluginDependencies, NodeDecorationFactory, NodeDecorationFactoryParams, PluginState, RightEdgeButtonProps, MoveNode, } from './blockControlsPluginType';

package/dist/types/pm-plugins/interaction-tracking/commands.d.ts

@@ -3,3 +3,5 @@ export declare const stopEditing: (view: EditorView) => void;
 export declare const startEditing: (view: EditorView) => void;
 export declare const mouseLeave: (view: EditorView) => void;
 export declare const mouseEnter: (view: EditorView) => void;
+export declare const setHoverSide: (view: EditorView, side: "left" | "right") => void;
+export declare const clearHoverSide: (view: EditorView) => void;

package/dist/types/pm-plugins/interaction-tracking/handle-mouse-move.d.ts

@@ -1,4 +1,4 @@
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
-export declare const handleMouseMove: (view: EditorView) => boolean;
-export declare const handleMouseLeave: (view: EditorView) => boolean;
+export declare const handleMouseMove: (view: EditorView, event: Event, rightSideControlsEnabled?: boolean) => boolean;
+export declare const handleMouseLeave: (view: EditorView, rightSideControlsEnabled?: boolean) => boolean;
 export declare const handleMouseEnter: (view: EditorView) => boolean;

package/dist/types/pm-plugins/interaction-tracking/pm-plugin.d.ts

@@ -2,6 +2,10 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import type { EditorState } from '@atlaskit/editor-prosemirror/state';
 export type InteractionTrackingPluginState = {
+    /**
+     * Tracks which side of the editor the mouse is currently on.
+     */
+    hoverSide?: 'left' | 'right';
     /**
      * Tracks if a users intention is to edit the document (e.g. typing, deleting, etc.)
      */
@@ -12,5 +16,5 @@ export type InteractionTrackingPluginState = {
     isMouseOut?: boolean;
 };
 export declare const interactionTrackingPluginKey: PluginKey<InteractionTrackingPluginState>;
-export declare const createInteractionTrackingPlugin: () => SafePlugin<InteractionTrackingPluginState>;
+export declare const createInteractionTrackingPlugin: (rightSideControlsEnabled?: boolean) => SafePlugin<InteractionTrackingPluginState>;
 export declare const getInteractionTrackingState: (state: EditorState) => InteractionTrackingPluginState | undefined;

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

@@ -13,7 +13,7 @@ export interface FlagType {
     toolbarFlagsEnabled: boolean;
 }
 export declare const getDecorations: (state: EditorState) => DecorationSet | undefined;
-export declare const apply: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined, formatMessage: IntlShape["formatMessage"], tr: ReadonlyTransaction, currentState: PluginState, newState: EditorState, flags: FlagType, nodeViewPortalProviderAPI: PortalProviderAPI, nodeDecorationRegistry: NodeDecorationFactory[], anchorRectCache?: AnchorRectCache, resizeObserverWidth?: ResizeObserver, pragmaticCleanup?: (() => void) | null) => PluginState | {
+export declare const apply: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined, formatMessage: IntlShape["formatMessage"], tr: ReadonlyTransaction, currentState: PluginState, newState: EditorState, flags: FlagType, nodeViewPortalProviderAPI: PortalProviderAPI, nodeDecorationRegistry: NodeDecorationFactory[], rightSideControlsEnabled?: boolean, anchorRectCache?: AnchorRectCache, resizeObserverWidth?: ResizeObserver, pragmaticCleanup?: (() => void) | null) => PluginState | {
     activeDropTargetNode: ActiveDropTargetNode | undefined;
     activeNode: any;
     blockMenuOptions: {
@@ -37,7 +37,7 @@ export declare const apply: (api: ExtractInjectionAPI<BlockControlsPlugin> | und
     menuTriggerByNode: any;
     multiSelectDnD: MultiSelectDnD | undefined;
 };
-export declare const createPlugin: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined, getIntl: () => IntlShape, nodeViewPortalProviderAPI: PortalProviderAPI, nodeDecorationRegistry: NodeDecorationFactory[]) => SafePlugin<PluginState | {
+export declare const createPlugin: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined, getIntl: () => IntlShape, nodeViewPortalProviderAPI: PortalProviderAPI, nodeDecorationRegistry: NodeDecorationFactory[], rightSideControlsEnabled?: boolean) => SafePlugin<PluginState | {
     activeDropTargetNode: ActiveDropTargetNode | undefined;
     activeNode: any;
     blockMenuOptions: {

package/dist/types/ui/visibility-container.d.ts

@@ -9,6 +9,7 @@ import type { BlockControlsPlugin } from '../blockControlsPluginType';
 interface VisibilityContainerProps {
     api?: ExtractInjectionAPI<BlockControlsPlugin>;
     children: React.ReactNode;
+    controlSide?: 'left' | 'right';
 }
-export declare const VisibilityContainer: ({ api, children }: VisibilityContainerProps) => jsx.JSX.Element;
+export declare const VisibilityContainer: ({ api, children, controlSide }: VisibilityContainerProps) => jsx.JSX.Element;
 export {};

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

@@ -1,10 +1,11 @@
 import type { IntlShape } from 'react-intl-next';
 import type { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { PortalProviderAPI } from '@atlaskit/editor-common/portal';
-import type { DIRECTION, EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
+import type { DIRECTION, EditorCommand, NextEditorPlugin, OptionalPlugin, PublicPluginAPI } from '@atlaskit/editor-common/types';
 import type { AccessibilityUtilsPlugin } from '@atlaskit/editor-plugin-accessibility-utils';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
+import type { EditorViewModePlugin } from '@atlaskit/editor-plugin-editor-viewmode';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { InteractionPlugin } from '@atlaskit/editor-plugin-interaction';
 import type { LimitedModePlugin } from '@atlaskit/editor-plugin-limited-mode';
@@ -77,6 +78,10 @@ export interface PluginState {
     preservedSelection?: Selection;
 }
 export type ReleaseHiddenDecoration = () => boolean | undefined;
+export type BlockControlsPluginConfig = {
+    /** Enable left/right hover split: show left controls when hovering left, right controls when hovering right */
+    rightSideControlsEnabled?: boolean;
+};
 export type BlockControlsSharedState = {
     activeDropTargetNode?: ActiveDropTargetNode;
     activeNode?: ActiveNode;
@@ -85,6 +90,7 @@ export type BlockControlsSharedState = {
         canMoveUp?: boolean;
         openedViaKeyboard?: boolean;
     };
+    hoverSide?: 'left' | 'right';
     isDragging: boolean;
     isEditing?: boolean;
     isMenuOpen: boolean;
@@ -97,10 +103,22 @@ export type BlockControlsSharedState = {
     menuTriggerByNode?: TriggerByNode;
     multiSelectDnD?: MultiSelectDnD;
     preservedSelection?: Selection;
+    /** Whether left/right hover split is enabled (from plugin config) */
+    rightSideControlsEnabled?: boolean;
 } | undefined;
 export type HandleOptions = {
     isFocused: boolean;
 } | undefined;
+/**
+ * Props passed to custom right-edge button components (e.g. config.rightEdgeButton).
+ * Used by malleable-ui for BlockRemixButton when rendered via node decoration.
+ */
+export type RightEdgeButtonProps = {
+    api: PublicPluginAPI<[
+        BlockControlsPlugin
+    ]>;
+    getPos: () => number | undefined;
+};
 export type NodeDecorationFactoryParams = {
     anchorName: string;
     editorState: EditorState;
@@ -110,14 +128,21 @@ export type NodeDecorationFactoryParams = {
     rootNodeType?: string;
     rootPos: number;
 };
+/**
+ * When true, this factory's decorations are shown in view mode on block hover
+ * (without drag handle or quick insert). Used for right-edge controls.
+ */
 export type NodeDecorationFactory = {
     create: (params: NodeDecorationFactoryParams) => Decoration;
+    /** Show this decoration in view mode when hovering over a block */
+    showInViewMode?: boolean;
     type: string;
 };
 export type MoveNode = (start: number, to: number, inputMethod?: MoveNodeMethod, formatMessage?: IntlShape['formatMessage']) => EditorCommand;
 export type BlockControlsPluginDependencies = [
     OptionalPlugin<LimitedModePlugin>,
     OptionalPlugin<EditorDisabledPlugin>,
+    OptionalPlugin<EditorViewModePlugin>,
     OptionalPlugin<WidthPlugin>,
     OptionalPlugin<FeatureFlagsPlugin>,
     OptionalPlugin<AnalyticsPlugin>,
@@ -175,6 +200,7 @@ export type BlockControlsPlugin = NextEditorPlugin<'blockControls', {
         }) => EditorCommand;
     };
     dependencies: BlockControlsPluginDependencies;
+    pluginConfiguration?: BlockControlsPluginConfig;
     sharedState: BlockControlsSharedState;
 }>;
 export type BlockControlsMeta = {

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

@@ -1,2 +1,2 @@
 export { blockControlsPlugin } from './blockControlsPlugin';
-export type { BlockControlsPlugin, BlockControlsSharedState, HandleOptions, MoveNodeMethod, BlockControlsPluginDependencies, NodeDecorationFactory, NodeDecorationFactoryParams, PluginState, MoveNode, } from './blockControlsPluginType';
+export type { BlockControlsPlugin, BlockControlsPluginConfig, BlockControlsSharedState, HandleOptions, MoveNodeMethod, BlockControlsPluginDependencies, NodeDecorationFactory, NodeDecorationFactoryParams, PluginState, RightEdgeButtonProps, MoveNode, } from './blockControlsPluginType';

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

@@ -3,3 +3,5 @@ export declare const stopEditing: (view: EditorView) => void;
 export declare const startEditing: (view: EditorView) => void;
 export declare const mouseLeave: (view: EditorView) => void;
 export declare const mouseEnter: (view: EditorView) => void;
+export declare const setHoverSide: (view: EditorView, side: "left" | "right") => void;
+export declare const clearHoverSide: (view: EditorView) => void;

package/dist/types-ts4.5/pm-plugins/interaction-tracking/handle-mouse-move.d.ts

@@ -1,4 +1,4 @@
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
-export declare const handleMouseMove: (view: EditorView) => boolean;
-export declare const handleMouseLeave: (view: EditorView) => boolean;
+export declare const handleMouseMove: (view: EditorView, event: Event, rightSideControlsEnabled?: boolean) => boolean;
+export declare const handleMouseLeave: (view: EditorView, rightSideControlsEnabled?: boolean) => boolean;
 export declare const handleMouseEnter: (view: EditorView) => boolean;

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

@@ -2,6 +2,10 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import type { EditorState } from '@atlaskit/editor-prosemirror/state';
 export type InteractionTrackingPluginState = {
+    /**
+     * Tracks which side of the editor the mouse is currently on.
+     */
+    hoverSide?: 'left' | 'right';
     /**
      * Tracks if a users intention is to edit the document (e.g. typing, deleting, etc.)
      */
@@ -12,5 +16,5 @@ export type InteractionTrackingPluginState = {
     isMouseOut?: boolean;
 };
 export declare const interactionTrackingPluginKey: PluginKey<InteractionTrackingPluginState>;
-export declare const createInteractionTrackingPlugin: () => SafePlugin<InteractionTrackingPluginState>;
+export declare const createInteractionTrackingPlugin: (rightSideControlsEnabled?: boolean) => SafePlugin<InteractionTrackingPluginState>;
 export declare const getInteractionTrackingState: (state: EditorState) => InteractionTrackingPluginState | undefined;

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

@@ -13,7 +13,7 @@ export interface FlagType {
     toolbarFlagsEnabled: boolean;
 }
 export declare const getDecorations: (state: EditorState) => DecorationSet | undefined;
-export declare const apply: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined, formatMessage: IntlShape["formatMessage"], tr: ReadonlyTransaction, currentState: PluginState, newState: EditorState, flags: FlagType, nodeViewPortalProviderAPI: PortalProviderAPI, nodeDecorationRegistry: NodeDecorationFactory[], anchorRectCache?: AnchorRectCache, resizeObserverWidth?: ResizeObserver, pragmaticCleanup?: (() => void) | null) => PluginState | {
+export declare const apply: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined, formatMessage: IntlShape["formatMessage"], tr: ReadonlyTransaction, currentState: PluginState, newState: EditorState, flags: FlagType, nodeViewPortalProviderAPI: PortalProviderAPI, nodeDecorationRegistry: NodeDecorationFactory[], rightSideControlsEnabled?: boolean, anchorRectCache?: AnchorRectCache, resizeObserverWidth?: ResizeObserver, pragmaticCleanup?: (() => void) | null) => PluginState | {
     activeDropTargetNode: ActiveDropTargetNode | undefined;
     activeNode: any;
     blockMenuOptions: {
@@ -37,7 +37,7 @@ export declare const apply: (api: ExtractInjectionAPI<BlockControlsPlugin> | und
     menuTriggerByNode: any;
     multiSelectDnD: MultiSelectDnD | undefined;
 };
-export declare const createPlugin: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined, getIntl: () => IntlShape, nodeViewPortalProviderAPI: PortalProviderAPI, nodeDecorationRegistry: NodeDecorationFactory[]) => SafePlugin<PluginState | {
+export declare const createPlugin: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined, getIntl: () => IntlShape, nodeViewPortalProviderAPI: PortalProviderAPI, nodeDecorationRegistry: NodeDecorationFactory[], rightSideControlsEnabled?: boolean) => SafePlugin<PluginState | {
     activeDropTargetNode: ActiveDropTargetNode | undefined;
     activeNode: any;
     blockMenuOptions: {

package/dist/types-ts4.5/ui/visibility-container.d.ts

@@ -9,6 +9,7 @@ import type { BlockControlsPlugin } from '../blockControlsPluginType';
 interface VisibilityContainerProps {
     api?: ExtractInjectionAPI<BlockControlsPlugin>;
     children: React.ReactNode;
+    controlSide?: 'left' | 'right';
 }
-export declare const VisibilityContainer: ({ api, children }: VisibilityContainerProps) => jsx.JSX.Element;
+export declare const VisibilityContainer: ({ api, children, controlSide }: VisibilityContainerProps) => jsx.JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "8.7.2",
+	"version": "8.8.0",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -28,12 +28,13 @@
 	],
 	"atlaskit:src": "src/index.ts",
 	"dependencies": {
-		"@atlaskit/adf-schema": "^52.0.0",
+		"@atlaskit/adf-schema": "^52.1.0",
 		"@atlaskit/browser-apis": "^0.0.1",
 		"@atlaskit/button": "^23.9.0",
 		"@atlaskit/editor-plugin-accessibility-utils": "^7.0.0",
 		"@atlaskit/editor-plugin-analytics": "^7.0.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^7.0.0",
+		"@atlaskit/editor-plugin-editor-viewmode": "^9.0.0",
 		"@atlaskit/editor-plugin-feature-flags": "^6.0.0",
 		"@atlaskit/editor-plugin-interaction": "^14.0.0",
 		"@atlaskit/editor-plugin-limited-mode": "^4.0.0",
@@ -56,7 +57,7 @@
 		"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
 		"@atlaskit/primitives": "^18.0.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^32.2.0",
+		"@atlaskit/tmp-editor-statsig": "^32.5.0",
 		"@atlaskit/tokens": "^11.0.0",
 		"@atlaskit/tooltip": "^20.14.0",
 		"@babel/runtime": "^7.0.0",
@@ -67,7 +68,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^111.20.0",
+		"@atlaskit/editor-common": "^111.23.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
@@ -129,9 +130,6 @@
 		"platform_editor_fix_widget_destroy": {
 			"type": "boolean"
 		},
-		"dst-a11y__replace-anchor-with-link__editor-jenga": {
-			"type": "boolean"
-		},
 		"editor_native_anchor_remove_decoration_in_apply": {
 			"type": "boolean"
 		},