src/vs/base/browser/ui/tree/abstractTree.ts/TypeFilterController/onDragStart
class TypeFilterController:	private onDragStart(): void {
		const container = this.view.getHTMLElement();
		const { left } = getDomNodePagePosition(container);
		const containerWidth = container.clientWidth;
		const midContainerWidth = containerWidth / 2;
		const width = this.domNode.clientWidth;
		const disposables = new DisposableStore();
		let positionClassName = this.positionClassName;

		const updatePosition = () => {
			switch (positionClassName) {
				case 'nw':
					this.domNode.style.top = `4px`;
					this.domNode.style.left = `4px`;
					break;
				case 'ne':
					this.domNode.style.top = `4px`;
					this.domNode.style.left = `${containerWidth - width - 6}px`;
					break;
			}
		};

		const onDragOver = (event: DragEvent) => {
			event.preventDefault(); // needed so that the drop event fires (https://stackoverflow.com/questions/21339924/drop-event-not-firing-in-chrome)

			const x = event.clientX - left;
			if (event.dataTransfer) {
				event.dataTransfer.dropEffect = 'none';
			}

			if (x < midContainerWidth) {
				positionClassName = 'nw';
			} else {
				positionClassName = 'ne';
			}

			updatePosition();
		};

		const onDragEnd = () => {
			this.positionClassName = positionClassName;
			this.domNode.className = `monaco-list-type-filter ${this.positionClassName}`;
			this.domNode.style.top = '';
			this.domNode.style.left = '';

			dispose(disposables);
		};

		updatePosition();
		this.domNode.classList.remove(positionClassName);

		this.domNode.classList.add('dragging');
		disposables.add(toDisposable(() => this.domNode.classList.remove('dragging')));

		disposables.add(addDisposableListener(document, 'dragover', e => onDragOver(e)));
		disposables.add(addDisposableListener(this.domNode, 'dragend', () => onDragEnd()));

		StaticDND.CurrentDragAndDropData = new DragAndDropData('vscode-ui');
		disposables.add(toDisposable(() => StaticDND.CurrentDragAndDropData = undefined));
	}