reuse meta-property for text below label & desc

src/vs/base/parts/quickopen/browser/quickOpenModel.ts

@@ -18,6 +18,7 @@ import {compareAnything} from 'vs/base/common/comparers';
 import ActionBar = require('vs/base/browser/ui/actionbar/actionbar');
 import TreeDefaults = require('vs/base/parts/tree/browser/treeDefaults');
 import HighlightedLabel = require('vs/base/browser/ui/highlightedlabel/highlightedLabel');
+import {OcticonLabel} from 'vs/base/browser/ui/octiconLabel/octiconLabel';
 import DOM = require('vs/base/browser/dom');
 
 export interface IContext {
@@ -67,7 +68,7 @@ export class QuickOpenEntry {
 	}
 
 	/**
-	 * Meta information about the entry that is optional and can be shown to the right of the label
+	 * Meta information about the entry that is optional and can be shown below the label
 	 */
 	public getMeta(): string {
 		return null;
@@ -395,7 +396,7 @@ export interface IQuickOpenEntryTemplateData {
 	icon: HTMLSpanElement;
 	prefix: HTMLSpanElement;
 	label: HighlightedLabel.HighlightedLabel;
-	meta: HTMLSpanElement;
+	meta: OcticonLabel;
 	description: HighlightedLabel.HighlightedLabel;
 	actionBar: ActionBar.ActionBar;
 }
@@ -420,7 +421,9 @@ class Renderer implements IRenderer<QuickOpenEntry> {
 		if (entry instanceof QuickOpenEntryItem) {
 			return (<QuickOpenEntryItem>entry).getHeight();
 		}
-
+		if (entry.getMeta()) {
+			return 44;
+		}
 		return 22;
 	}
 
@@ -482,26 +485,27 @@ class Renderer implements IRenderer<QuickOpenEntry> {
 		// Label
 		let label = new HighlightedLabel.HighlightedLabel(entry);
 
-		// Meta
-		let meta = document.createElement('span');
-		entry.appendChild(meta);
-		DOM.addClass(meta, 'quick-open-entry-meta');
-
 		// Description
 		let descriptionContainer = document.createElement('span');
 		entry.appendChild(descriptionContainer);
 		DOM.addClass(descriptionContainer, 'quick-open-entry-description');
 		let description = new HighlightedLabel.HighlightedLabel(descriptionContainer);
 
+		// Meta
+		let metaContainer = document.createElement('div');
+		entry.appendChild(metaContainer);
+		DOM.addClass(metaContainer, 'quick-open-entry-meta');
+		let meta = new OcticonLabel(metaContainer);
+
 		return {
-			container: container,
-			icon: icon,
-			prefix: prefix,
-			label: label,
-			meta: meta,
-			description: description,
-			group: group,
-			actionBar: actionBar
+			container,
+			icon,
+			prefix,
+			label,
+			meta,
+			description,
+			group,
+			actionBar
 		};
 	}
 
@@ -566,8 +570,7 @@ class Renderer implements IRenderer<QuickOpenEntry> {
 			data.label.set(entry.getLabel() || '', labelHighlights || []);
 
 			// Meta
-			let metaLabel = entry.getMeta() || '';
-			data.meta.textContent = metaLabel;
+			data.meta.text = entry.getMeta();
 
 			// Description
 			let descriptionHighlights = highlights[1];

src/vs/base/parts/quickopen/browser/quickopen.css

@@ -75,7 +75,6 @@
 
 .quick-open-widget .quick-open-tree .quick-open-entry-meta {
 	opacity: 0.7;
-	margin-left: 0.5em;
 }
 
 .quick-open-widget .quick-open-tree .quick-open-entry-description {

src/vs/workbench/api/node/extHostQuickOpen.ts

@@ -51,17 +51,20 @@ export class ExtHostQuickOpen {
 				let item = items[handle];
 				let label: string;
 				let description: string;
+				let meta: string;
 
 				if (typeof item === 'string') {
 					label = item;
 				} else {
 					label = item.label;
 					description = item.description;
+					meta = item.detail;
 				}
 				pickItems.push({
 					label,
 					description,
-					handle
+					handle,
+					meta
 				});
 			}
 

src/vs/workbench/browser/parts/quickopen/quickOpenController.ts

@@ -269,7 +269,7 @@ export class QuickOpenController extends WorkbenchComponent implements IQuickOpe
 				let model = new QuickOpenModel();
 				let entries = picks.map((e) => {
 					if (typeof e === 'string') {
-						return new PickOpenEntry(e, null, () => progress(e));
+						return new PickOpenEntry(e, null, null, () => progress(e));
 					}
 
 					let entry = (<IPickOpenEntryItem>e);
@@ -278,7 +278,7 @@ export class QuickOpenController extends WorkbenchComponent implements IQuickOpe
 						return new PickOpenItem(entry.label, entry.description, entry.height, entry.render.bind(entry), () => progress(e));
 					}
 
-					return new PickOpenEntry(entry.label, entry.description, () => progress(e));
+					return new PickOpenEntry(entry.label, entry.description, entry.meta, () => progress(e));
 				});
 
 				if (picks.length === 0) {
@@ -853,11 +853,13 @@ class PlaceholderQuickOpenEntry extends QuickOpenEntry {
 class PickOpenEntry extends PlaceholderQuickOpenEntry {
 	private _selected: boolean;
 	private description: string;
+	private meta: string;
 
-	constructor(label: string, description?: string, private onPreview?: () => void) {
+	constructor(label: string, description?: string, meta?: string, private onPreview?: () => void) {
 		super(label);
 
 		this.description = description;
+		this.meta = meta;
 	}
 
 	public get selected(): boolean {
@@ -868,6 +870,10 @@ class PickOpenEntry extends PlaceholderQuickOpenEntry {
 		return this.description;
 	}
 
+	public getMeta(): string {
+		return this.meta;
+	}
+
 	public run(mode: Mode, context: IContext): boolean {
 		if (mode === Mode.OPEN) {
 			this._selected = true;

src/vs/workbench/services/quickopen/common/quickOpenService.ts

@@ -14,6 +14,7 @@ export interface IPickOpenEntry {
 	id?: string;
 	label: string;
 	description?: string;
+	meta?: string;
 }
 
 export interface IPickOptions {