Merge from master

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

@@ -3,8 +3,6 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-'use strict';
-
 import 'vs/css!./checkbox';
 import * as DOM from 'vs/base/browser/dom';
 import { IKeyboardEvent } from 'vs/base/browser/keyboardEvent';
@@ -13,9 +11,11 @@ import { Color } from 'vs/base/common/color';
 import { Emitter, Event } from 'vs/base/common/event';
 import { KeyCode } from 'vs/base/common/keyCodes';
 import * as objects from 'vs/base/common/objects';
+import { BaseActionItem } from 'vs/base/browser/ui/actionbar/actionbar';
+import { IDisposable, dispose } from 'vs/base/common/lifecycle';
 
 export interface ICheckboxOpts extends ICheckboxStyles {
-	readonly actionClassName: string;
+	readonly actionClassName?: string;
 	readonly title: string;
 	readonly isChecked: boolean;
 }
@@ -28,6 +28,48 @@ const defaultOpts = {
 	inputActiveOptionBorder: Color.fromHex('#007ACC')
 };
 
+export class CheckboxActionItem extends BaseActionItem {
+
+	private checkbox: Checkbox;
+	private disposables: IDisposable[] = [];
+
+	render(container: HTMLElement): void {
+		this.element = container;
+
+		this.disposables = dispose(this.disposables);
+		this.checkbox = new Checkbox({
+			actionClassName: this._action.class,
+			isChecked: this._action.checked,
+			title: this._action.label
+		});
+		this.disposables.push(this.checkbox);
+		this.checkbox.onChange(() => this._action.checked = this.checkbox.checked, this, this.disposables);
+		this.element.appendChild(this.checkbox.domNode);
+	}
+
+	updateEnabled(): void {
+		if (this.checkbox) {
+			if (this.isEnabled()) {
+				this.checkbox.enable();
+			} else {
+				this.checkbox.disable();
+			}
+		}
+	}
+
+	updateChecked(): void {
+		if (this.checkbox) {
+			this.checkbox.checked = this._action.checked;
+		}
+	}
+
+	dipsose(): void {
+		this.disposables = dispose(this.disposables);
+		super.dispose();
+	}
+
+}
+
 export class Checkbox extends Widget {
 
 	private readonly _onChange = this._register(new Emitter<boolean>());
@@ -50,7 +92,7 @@ export class Checkbox extends Widget {
 
 		this.domNode = document.createElement('div');
 		this.domNode.title = this._opts.title;
-		this.domNode.className = 'monaco-custom-checkbox ' + this._opts.actionClassName + ' ' + (this._checked ? 'checked' : 'unchecked');
+		this.domNode.className = 'monaco-custom-checkbox ' + (this._opts.actionClassName || '') + ' ' + (this._checked ? 'checked' : 'unchecked');
 		this.domNode.tabIndex = 0;
 		this.domNode.setAttribute('role', 'checkbox');
 		this.domNode.setAttribute('aria-checked', String(this._checked));