improve dropdown menu placement for sidebar parts

src/vs/base/browser/contextmenu.ts

@@ -7,6 +7,7 @@ import { IAction, IActionRunner } from 'vs/base/common/actions';
 import { IActionItem } from 'vs/base/browser/ui/actionbar/actionbar';
 import { ResolvedKeybinding } from 'vs/base/common/keyCodes';
 import { SubmenuAction } from 'vs/base/browser/ui/menu/menu';
+import { AnchorAlignment } from 'vs/base/browser/ui/contextview/contextview';
 
 export interface IContextMenuEvent {
 	shiftKey?: boolean;
@@ -31,4 +32,5 @@ export interface IContextMenuDelegate {
 	onHide?(didCancel: boolean): void;
 	actionRunner?: IActionRunner;
 	autoSelectFirstItem?: boolean;
+	anchorAlignment?: AnchorAlignment;
 }

src/vs/base/browser/ui/dropdown/dropdown.ts

@@ -8,7 +8,7 @@ import { Gesture, EventType as GestureEventType } from 'vs/base/browser/touch';
 import { ActionRunner, IAction, IActionRunner } from 'vs/base/common/actions';
 import { BaseActionItem, IActionItemProvider } from 'vs/base/browser/ui/actionbar/actionbar';
 import { IDisposable } from 'vs/base/common/lifecycle';
-import { IContextViewProvider, IAnchor } from 'vs/base/browser/ui/contextview/contextview';
+import { IContextViewProvider, IAnchor, AnchorAlignment } from 'vs/base/browser/ui/contextview/contextview';
 import { IMenuOptions } from 'vs/base/browser/ui/menu/menu';
 import { ResolvedKeybinding, KeyCode } from 'vs/base/common/keyCodes';
 import { EventHelper, EventType, removeClass, addClass, append, $, addDisposableListener, addClasses } from 'vs/base/browser/dom';
@@ -249,7 +249,8 @@ export class DropdownMenu extends BaseDropdown {
 			getKeyBinding: action => this.menuOptions && this.menuOptions.getKeyBinding ? this.menuOptions.getKeyBinding(action) : null,
 			getMenuClassName: () => this.menuClassName,
 			onHide: () => this.onHide(),
-			actionRunner: this.menuOptions ? this.menuOptions.actionRunner : null
+			actionRunner: this.menuOptions ? this.menuOptions.actionRunner : null,
+			anchorAlignment: this.menuOptions.anchorAlignment
 		});
 	}
 
@@ -270,10 +271,11 @@ export class DropdownMenuActionItem extends BaseActionItem {
 	private actionItemProvider: IActionItemProvider;
 	private keybindings: (action: IAction) => ResolvedKeybinding;
 	private clazz: string;
+	private anchorAlignmentProvider: () => AnchorAlignment;
 
-	constructor(action: IAction, menuActions: IAction[], contextMenuProvider: IContextMenuProvider, actionItemProvider: IActionItemProvider, actionRunner: IActionRunner, keybindings: (action: IAction) => ResolvedKeybinding, clazz: string);
-	constructor(action: IAction, actionProvider: IActionProvider, contextMenuProvider: IContextMenuProvider, actionItemProvider: IActionItemProvider, actionRunner: IActionRunner, keybindings: (action: IAction) => ResolvedKeybinding, clazz: string);
-	constructor(action: IAction, menuActionsOrProvider: any, contextMenuProvider: IContextMenuProvider, actionItemProvider: IActionItemProvider, actionRunner: IActionRunner, keybindings: (action: IAction) => ResolvedKeybinding, clazz: string) {
+	constructor(action: IAction, menuActions: IAction[], contextMenuProvider: IContextMenuProvider, actionItemProvider: IActionItemProvider, actionRunner: IActionRunner, keybindings: (action: IAction) => ResolvedKeybinding, clazz: string, anchorAlignmentProvider?: () => AnchorAlignment);
+	constructor(action: IAction, actionProvider: IActionProvider, contextMenuProvider: IContextMenuProvider, actionItemProvider: IActionItemProvider, actionRunner: IActionRunner, keybindings: (action: IAction) => ResolvedKeybinding, clazz: string, anchorAlignmentProvider?: () => AnchorAlignment);
+	constructor(action: IAction, menuActionsOrProvider: any, contextMenuProvider: IContextMenuProvider, actionItemProvider: IActionItemProvider, actionRunner: IActionRunner, keybindings: (action: IAction) => ResolvedKeybinding, clazz: string, anchorAlignmentProvider?: () => AnchorAlignment) {
 		super(null, action);
 
 		this.menuActionsOrProvider = menuActionsOrProvider;
@@ -282,6 +284,7 @@ export class DropdownMenuActionItem extends BaseActionItem {
 		this.actionRunner = actionRunner;
 		this.keybindings = keybindings;
 		this.clazz = clazz;
+		this.anchorAlignmentProvider = anchorAlignmentProvider;
 	}
 
 	render(container: HTMLElement): void {
@@ -311,11 +314,15 @@ export class DropdownMenuActionItem extends BaseActionItem {
 
 		this.dropdownMenu = this._register(new DropdownMenu(container, options));
 
+		const that = this;
 		this.dropdownMenu.menuOptions = {
 			actionItemProvider: this.actionItemProvider,
 			actionRunner: this.actionRunner,
 			getKeyBinding: this.keybindings,
-			context: this._context
+			context: this._context,
+			get anchorAlignment(): AnchorAlignment {
+				return that.anchorAlignmentProvider();
+			}
 		};
 	}
 

src/vs/base/browser/ui/menu/menu.ts

@@ -14,6 +14,7 @@ import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
 import { RunOnceScheduler } from 'vs/base/common/async';
 import { IDisposable, dispose } from 'vs/base/common/lifecycle';
 import { Color } from 'vs/base/common/color';
+import { AnchorAlignment } from 'vs/base/browser/ui/contextview/contextview';
 
 export const MENU_MNEMONIC_REGEX: RegExp = /\(&{1,2}(.)\)|&{1,2}(.)/;
 export const MENU_ESCAPED_MNEMONIC_REGEX: RegExp = /(?:&){1,2}(.)/;
@@ -25,6 +26,7 @@ export interface IMenuOptions {
 	getKeyBinding?: (action: IAction) => ResolvedKeybinding;
 	ariaLabel?: string;
 	enableMnemonics?: boolean;
+	anchorAlignment?: AnchorAlignment;
 }
 
 export interface IMenuStyles {

src/vs/base/browser/ui/toolbar/toolbar.ts

@@ -10,6 +10,7 @@ import { ActionBar, ActionsOrientation, IActionItemProvider } from 'vs/base/brow
 import { IContextMenuProvider, DropdownMenuActionItem } from 'vs/base/browser/ui/dropdown/dropdown';
 import { ResolvedKeybinding } from 'vs/base/common/keyCodes';
 import { Disposable } from 'vs/base/common/lifecycle';
+import { AnchorAlignment } from 'vs/base/browser/ui/contextview/contextview';
 
 export const CONTEXT = 'context.toolbar';
 
@@ -20,6 +21,7 @@ export interface IToolBarOptions {
 	getKeyBinding?: (action: IAction) => ResolvedKeybinding;
 	actionRunner?: IActionRunner;
 	toggleMenuTitle?: string;
+	anchorAlignmentProvider?: () => AnchorAlignment;
 }
 
 /**
@@ -67,7 +69,8 @@ export class ToolBar extends Disposable {
 						this.options.actionItemProvider,
 						this.actionRunner,
 						this.options.getKeyBinding,
-						'toolbar-toggle-more'
+						'toolbar-toggle-more',
+						this.options.anchorAlignmentProvider
 					);
 					this.toggleMenuActionItem.setActionContext(this.actionBar.context);
 

src/vs/platform/contextview/browser/contextMenuHandler.ts

@@ -60,6 +60,7 @@ export class ContextMenuHandler {
 		this.contextViewService.showContextView({
 			getAnchor: () => delegate.getAnchor(),
 			canRelayout: false,
+			anchorAlignment: delegate.anchorAlignment,
 
 			render: (container) => {
 				this.menuContainerElement = container;

src/vs/platform/contextview/browser/contextView.ts

@@ -7,6 +7,7 @@ import { IDisposable } from 'vs/base/common/lifecycle';
 import { Event } from 'vs/base/common/event';
 import { createDecorator } from 'vs/platform/instantiation/common/instantiation';
 import { IContextMenuDelegate } from 'vs/base/browser/contextmenu';
+import { AnchorAlignment } from 'vs/base/browser/ui/contextview/contextview';
 
 export const IContextViewService = createDecorator<IContextViewService>('contextViewService');
 
@@ -17,6 +18,7 @@ export interface IContextViewService {
 	showContextView(delegate: IContextViewDelegate): void;
 	hideContextView(data?: any): void;
 	layout(): void;
+	anchorAlignment?: AnchorAlignment;
 }
 
 export interface IContextViewDelegate {
@@ -27,6 +29,7 @@ export interface IContextViewDelegate {
 	render(container: HTMLElement): IDisposable;
 	onDOMEvent?(e: any, activeElement: HTMLElement): void;
 	onHide?(data?: any): void;
+	anchorAlignment?: AnchorAlignment;
 }
 
 export const IContextMenuService = createDecorator<IContextMenuService>('contextMenuService');

src/vs/workbench/browser/parts/compositePart.ts

@@ -31,6 +31,7 @@ import { IThemeService } from 'vs/platform/theme/common/themeService';
 import { attachProgressBarStyler } from 'vs/platform/theme/common/styler';
 import { INotificationService } from 'vs/platform/notification/common/notification';
 import { Dimension, append, $, addClass, hide, show, addClasses } from 'vs/base/browser/dom';
+import { AnchorAlignment } from 'vs/base/browser/ui/contextview/contextview';
 
 export interface ICompositeTitleLabel {
 
@@ -391,7 +392,8 @@ export abstract class CompositePart<T extends Composite> extends Part {
 		this.toolBar = this._register(new ToolBar(titleActionsContainer, this.contextMenuService, {
 			actionItemProvider: action => this.actionItemProvider(action as Action),
 			orientation: ActionsOrientation.HORIZONTAL,
-			getKeyBinding: action => this.keybindingService.lookupKeybinding(action.id)
+			getKeyBinding: action => this.keybindingService.lookupKeybinding(action.id),
+			anchorAlignmentProvider: () => this.getTitleAreaDropDownAnchorAlignment()
 		}));
 
 		return titleArea;
@@ -453,6 +455,10 @@ export abstract class CompositePart<T extends Composite> extends Part {
 		return [];
 	}
 
+	protected getTitleAreaDropDownAnchorAlignment(): AnchorAlignment {
+		return AnchorAlignment.RIGHT;
+	}
+
 	layout(dimension: Dimension): Dimension[] {
 
 		// Pass to super

src/vs/workbench/browser/parts/editor/titleControl.ts

@@ -37,6 +37,7 @@ import { EditorCommandsContextActionRunner, IEditorCommandsContext, IEditorInput
 import { ResourceContextKey } from 'vs/workbench/common/resources';
 import { Themable } from 'vs/workbench/common/theme';
 import { IExtensionService } from 'vs/workbench/services/extensions/common/extensions';
+import { AnchorAlignment } from 'vs/base/browser/ui/contextview/contextview';
 
 export interface IToolbarActions {
 	primary: IAction[];
@@ -119,7 +120,8 @@ export abstract class TitleControl extends Themable {
 			orientation: ActionsOrientation.HORIZONTAL,
 			ariaLabel: localize('araLabelEditorActions', "Editor actions"),
 			getKeyBinding: action => this.getKeybinding(action),
-			actionRunner: this._register(new EditorCommandsContextActionRunner(context))
+			actionRunner: this._register(new EditorCommandsContextActionRunner(context)),
+			anchorAlignmentProvider: () => AnchorAlignment.RIGHT
 		}));
 
 		// Context

src/vs/workbench/browser/parts/sidebar/sidebarPart.ts

@@ -29,6 +29,7 @@ import { INotificationService } from 'vs/platform/notification/common/notificati
 import { Dimension, EventType, addDisposableListener, trackFocus } from 'vs/base/browser/dom';
 import { StandardMouseEvent } from 'vs/base/browser/mouseEvent';
 import { RawContextKey, IContextKey, IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
+import { AnchorAlignment } from 'vs/base/browser/ui/contextview/contextview';
 
 const SideBarFocusContextId = 'sideBarFocus';
 export const SidebarFocusContext = new RawContextKey<boolean>(SideBarFocusContextId, false);
@@ -162,6 +163,10 @@ export class SidebarPart extends CompositePart<Viewlet> {
 		return super.layout(dimension);
 	}
 
+	protected getTitleAreaDropDownAnchorAlignment(): AnchorAlignment {
+		return this.partService.getSideBarPosition() === SideBarPosition.LEFT ? AnchorAlignment.LEFT : AnchorAlignment.RIGHT;
+	}
+
 	private onTitleAreaContextMenu(event: StandardMouseEvent): void {
 		const activeViewlet = this.getActiveViewlet() as Viewlet;
 		if (activeViewlet) {