Change ITheme.getColor(...) to returned Color | undefined

mjbvz · mjbvz · commit 05c58615e84e · 2019-02-06T18:44:54.000-08:00
**Problem**
`ITheme.getColor` is one of the major users of the type `null` in our codebase. However this function is used in many places that expected an `undefined` type instead. With the strict null work, this means that we have to write code such as `theme.getColor(...) || undefined` in some cases or have to work with  `Color | null | undefined` types.

**Fix**
`undefined` is generally better supported by TypeScript and more natural in JavaScript. This change makes `ITheme.getColor` return `Color | undefined` instead of `Color | null`.
diff --git a/src/vs/editor/contrib/find/findOptionsWidget.ts b/src/vs/editor/contrib/find/findOptionsWidget.ts
@@ -46,7 +46,7 @@ export class FindOptionsWidget extends Widget implements IOverlayWidget {
 		this._domNode.setAttribute('role', 'presentation');
 		this._domNode.setAttribute('aria-hidden', 'true');
 
-		const inputActiveOptionBorderColor = themeService.getTheme().getColor(inputActiveOptionBorder) || undefined;
+		const inputActiveOptionBorderColor = themeService.getTheme().getColor(inputActiveOptionBorder);
 
 		this.caseSensitive = this._register(new CaseSensitiveCheckbox({
 			appendTitle: this._keybindingLabelFor(FIND_IDS.ToggleCaseSensitiveCommand),
@@ -179,7 +179,7 @@ export class FindOptionsWidget extends Widget implements IOverlayWidget {
 	}
 
 	private _applyTheme(theme: ITheme) {
-		let inputStyles = { inputActiveOptionBorder: theme.getColor(inputActiveOptionBorder) || undefined };
+		let inputStyles = { inputActiveOptionBorder: theme.getColor(inputActiveOptionBorder) };
 		this.caseSensitive.style(inputStyles);
 		this.wholeWords.style(inputStyles);
 		this.regex.style(inputStyles);
diff --git a/src/vs/editor/contrib/find/findWidget.ts b/src/vs/editor/contrib/find/findWidget.ts
@@ -530,19 +530,19 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
 
 	private _applyTheme(theme: ITheme) {
 		let inputStyles: IFindInputStyles = {
-			inputActiveOptionBorder: theme.getColor(inputActiveOptionBorder) || undefined,
-			inputBackground: theme.getColor(inputBackground) || undefined,
-			inputForeground: theme.getColor(inputForeground) || undefined,
-			inputBorder: theme.getColor(inputBorder) || undefined,
-			inputValidationInfoBackground: theme.getColor(inputValidationInfoBackground) || undefined,
-			inputValidationInfoForeground: theme.getColor(inputValidationInfoForeground) || undefined,
-			inputValidationInfoBorder: theme.getColor(inputValidationInfoBorder) || undefined,
-			inputValidationWarningBackground: theme.getColor(inputValidationWarningBackground) || undefined,
-			inputValidationWarningForeground: theme.getColor(inputValidationWarningForeground) || undefined,
-			inputValidationWarningBorder: theme.getColor(inputValidationWarningBorder) || undefined,
-			inputValidationErrorBackground: theme.getColor(inputValidationErrorBackground) || undefined,
-			inputValidationErrorForeground: theme.getColor(inputValidationErrorForeground) || undefined,
-			inputValidationErrorBorder: theme.getColor(inputValidationErrorBorder) || undefined,
+			inputActiveOptionBorder: theme.getColor(inputActiveOptionBorder),
+			inputBackground: theme.getColor(inputBackground),
+			inputForeground: theme.getColor(inputForeground),
+			inputBorder: theme.getColor(inputBorder),
+			inputValidationInfoBackground: theme.getColor(inputValidationInfoBackground),
+			inputValidationInfoForeground: theme.getColor(inputValidationInfoForeground),
+			inputValidationInfoBorder: theme.getColor(inputValidationInfoBorder),
+			inputValidationWarningBackground: theme.getColor(inputValidationWarningBackground),
+			inputValidationWarningForeground: theme.getColor(inputValidationWarningForeground),
+			inputValidationWarningBorder: theme.getColor(inputValidationWarningBorder),
+			inputValidationErrorBackground: theme.getColor(inputValidationErrorBackground),
+			inputValidationErrorForeground: theme.getColor(inputValidationErrorForeground),
+			inputValidationErrorBorder: theme.getColor(inputValidationErrorBorder),
 		};
 		this._findInput.style(inputStyles);
 		this._replaceInputBox.style(inputStyles);
@@ -1130,7 +1130,7 @@ export class SimpleButton extends Widget {
 // theming
 
 registerThemingParticipant((theme, collector) => {
-	const addBackgroundColorRule = (selector: string, color: Color | null): void => {
+	const addBackgroundColorRule = (selector: string, color: Color | undefined): void => {
 		if (color) {
 			collector.addRule(`.monaco-editor ${selector} { background-color: ${color}; }`);
 		}
diff --git a/src/vs/editor/contrib/find/simpleFindWidget.ts b/src/vs/editor/contrib/find/simpleFindWidget.ts
@@ -160,19 +160,19 @@ export abstract class SimpleFindWidget extends Widget {
 
 	public updateTheme(theme: ITheme): void {
 		const inputStyles: IFindInputStyles = {
-			inputActiveOptionBorder: theme.getColor(inputActiveOptionBorder) || undefined,
-			inputBackground: theme.getColor(inputBackground) || undefined,
-			inputForeground: theme.getColor(inputForeground) || undefined,
-			inputBorder: theme.getColor(inputBorder) || undefined,
-			inputValidationInfoBackground: theme.getColor(inputValidationInfoBackground) || undefined,
-			inputValidationInfoForeground: theme.getColor(inputValidationInfoForeground) || undefined,
-			inputValidationInfoBorder: theme.getColor(inputValidationInfoBorder) || undefined,
-			inputValidationWarningBackground: theme.getColor(inputValidationWarningBackground) || undefined,
-			inputValidationWarningForeground: theme.getColor(inputValidationWarningForeground) || undefined,
-			inputValidationWarningBorder: theme.getColor(inputValidationWarningBorder) || undefined,
-			inputValidationErrorBackground: theme.getColor(inputValidationErrorBackground) || undefined,
-			inputValidationErrorForeground: theme.getColor(inputValidationErrorForeground) || undefined,
-			inputValidationErrorBorder: theme.getColor(inputValidationErrorBorder) || undefined
+			inputActiveOptionBorder: theme.getColor(inputActiveOptionBorder),
+			inputBackground: theme.getColor(inputBackground),
+			inputForeground: theme.getColor(inputForeground),
+			inputBorder: theme.getColor(inputBorder),
+			inputValidationInfoBackground: theme.getColor(inputValidationInfoBackground),
+			inputValidationInfoForeground: theme.getColor(inputValidationInfoForeground),
+			inputValidationInfoBorder: theme.getColor(inputValidationInfoBorder),
+			inputValidationWarningBackground: theme.getColor(inputValidationWarningBackground),
+			inputValidationWarningForeground: theme.getColor(inputValidationWarningForeground),
+			inputValidationWarningBorder: theme.getColor(inputValidationWarningBorder),
+			inputValidationErrorBackground: theme.getColor(inputValidationErrorBackground),
+			inputValidationErrorForeground: theme.getColor(inputValidationErrorForeground),
+			inputValidationErrorBorder: theme.getColor(inputValidationErrorBorder)
 		};
 		this._findInput.style(inputStyles);
 	}
diff --git a/src/vs/editor/contrib/gotoError/gotoErrorWidget.ts b/src/vs/editor/contrib/gotoError/gotoErrorWidget.ts
@@ -185,7 +185,7 @@ export class MarkerNavigationWidget extends ZoneWidget {
 	}
 
 	private _applyTheme(theme: ITheme) {
-		this._backgroundColor = theme.getColor(editorMarkerNavigationBackground) || undefined;
+		this._backgroundColor = theme.getColor(editorMarkerNavigationBackground);
 		let colorId = editorMarkerNavigationError;
 		if (this._severity === MarkerSeverity.Warning) {
 			colorId = editorMarkerNavigationWarning;
diff --git a/src/vs/editor/contrib/referenceSearch/referencesWidget.ts b/src/vs/editor/contrib/referenceSearch/referencesWidget.ts
@@ -279,8 +279,8 @@ export class ReferenceWidget extends PeekViewWidget {
 			arrowColor: borderColor,
 			frameColor: borderColor,
 			headerBackgroundColor: theme.getColor(peekViewTitleBackground) || Color.transparent,
-			primaryHeadingColor: theme.getColor(peekViewTitleForeground) || undefined,
-			secondaryHeadingColor: theme.getColor(peekViewTitleInfoForeground) || undefined
+			primaryHeadingColor: theme.getColor(peekViewTitleForeground),
+			secondaryHeadingColor: theme.getColor(peekViewTitleInfoForeground)
 		});
 	}
 
diff --git a/src/vs/editor/standalone/browser/standaloneThemeServiceImpl.ts b/src/vs/editor/standalone/browser/standaloneThemeServiceImpl.ts
@@ -28,7 +28,7 @@ class StandaloneTheme implements IStandaloneTheme {
 
 	private themeData: IStandaloneThemeData;
 	private colors: { [colorId: string]: Color } | null;
-	private defaultColors: { [colorId: string]: Color | null; };
+	private defaultColors: { [colorId: string]: Color | undefined; };
 	private _tokenTheme: TokenTheme | null;
 
 	constructor(name: string, standaloneThemeData: IStandaloneThemeData) {
@@ -77,18 +77,18 @@ class StandaloneTheme implements IStandaloneTheme {
 		return this.colors;
 	}
 
-	public getColor(colorId: ColorIdentifier, useDefault?: boolean): Color | null {
+	public getColor(colorId: ColorIdentifier, useDefault?: boolean): Color | undefined {
 		const color = this.getColors()[colorId];
 		if (color) {
 			return color;
 		}
 		if (useDefault !== false) {
 			return this.getDefault(colorId);
 		}
-		return null;
+		return undefined;
 	}
 
-	private getDefault(colorId: ColorIdentifier): Color | null {
+	private getDefault(colorId: ColorIdentifier): Color | undefined {
 		let color = this.defaultColors[colorId];
 		if (color) {
 			return color;
diff --git a/src/vs/platform/theme/common/colorRegistry.ts b/src/vs/platform/theme/common/colorRegistry.ts
@@ -27,7 +27,7 @@ export interface ColorContribution {
 
 
 export interface ColorFunction {
-	(theme: ITheme): Color | null;
+	(theme: ITheme): Color | undefined;
 }
 
 export interface ColorDefaults {
@@ -71,7 +71,7 @@ export interface IColorRegistry {
 	/**
 	 * Gets the default color of the given id
 	 */
-	resolveDefaultColor(id: ColorIdentifier, theme: ITheme): Color | null;
+	resolveDefaultColor(id: ColorIdentifier, theme: ITheme): Color | undefined;
 
 	/**
 	 * JSON schema for an object to assign color values to one of the color contributions.
@@ -131,13 +131,13 @@ class ColorRegistry implements IColorRegistry {
 		return Object.keys(this.colorsById).map(id => this.colorsById[id]);
 	}
 
-	public resolveDefaultColor(id: ColorIdentifier, theme: ITheme): Color | null {
+	public resolveDefaultColor(id: ColorIdentifier, theme: ITheme): Color | undefined {
 		const colorDesc = this.colorsById[id];
 		if (colorDesc && colorDesc.defaults) {
 			const colorValue = colorDesc.defaults[theme.type];
 			return resolveColorValue(colorValue, theme);
 		}
-		return null;
+		return undefined;
 	}
 
 	public getColorSchema(): IJSONSchema {
@@ -385,7 +385,7 @@ export function darken(colorValue: ColorValue, factor: number): ColorFunction {
 		if (color) {
 			return color.darken(factor);
 		}
-		return null;
+		return undefined;
 	};
 }
 
@@ -395,7 +395,7 @@ export function lighten(colorValue: ColorValue, factor: number): ColorFunction {
 		if (color) {
 			return color.lighten(factor);
 		}
-		return null;
+		return undefined;
 	};
 }
 
@@ -405,7 +405,7 @@ export function transparent(colorValue: ColorValue, factor: number): ColorFuncti
 		if (color) {
 			return color.transparent(factor);
 		}
-		return null;
+		return undefined;
 	};
 }
 
@@ -417,7 +417,7 @@ export function oneOf(...colorValues: ColorValue[]): ColorFunction {
 				return color;
 			}
 		}
-		return null;
+		return undefined;
 	};
 }
 
@@ -434,7 +434,7 @@ function lessProminent(colorValue: ColorValue, backgroundColorValue: ColorValue,
 			}
 			return from.transparent(factor * transparency);
 		}
-		return null;
+		return undefined;
 	};
 }
 
@@ -443,9 +443,9 @@ function lessProminent(colorValue: ColorValue, backgroundColorValue: ColorValue,
 /**
  * @param colorValue Resolve a color value in the context of a theme
  */
-function resolveColorValue(colorValue: ColorValue | null, theme: ITheme): Color | null {
+function resolveColorValue(colorValue: ColorValue | null, theme: ITheme): Color | undefined {
 	if (colorValue === null) {
-		return null;
+		return undefined;
 	} else if (typeof colorValue === 'string') {
 		if (colorValue[0] === '#') {
 			return Color.fromHex(colorValue);
@@ -456,7 +456,7 @@ function resolveColorValue(colorValue: ColorValue | null, theme: ITheme): Color
 	} else if (typeof colorValue === 'function') {
 		return colorValue(theme);
 	}
-	return null;
+	return undefined;
 }
 
 export const workbenchColorsSchemaId = 'vscode://schemas/workbench-colors';
diff --git a/src/vs/platform/theme/common/styler.ts b/src/vs/platform/theme/common/styler.ts
@@ -9,7 +9,7 @@ import { IDisposable } from 'vs/base/common/lifecycle';
 import { Color } from 'vs/base/common/color';
 import { mixin } from 'vs/base/common/objects';
 
-export type styleFn = (colors: { [name: string]: Color | null }) => void;
+export type styleFn = (colors: { [name: string]: Color | undefined }) => void;
 
 export interface IStyleOverrides {
 	[color: string]: ColorIdentifier | undefined;
@@ -24,7 +24,7 @@ export interface IColorMapping {
 }
 
 export interface IComputedStyles {
-	[color: string]: Color | null;
+	[color: string]: Color | undefined;
 }
 
 export function computeStyles(theme: ITheme, styleMap: IColorMapping): IComputedStyles {
diff --git a/src/vs/platform/theme/common/themeService.ts b/src/vs/platform/theme/common/themeService.ts
@@ -52,7 +52,7 @@ export interface ITheme {
 	 * @param color the id of the color
 	 * @param useDefault specifies if the default color should be used. If not set, the default is used.
 	 */
-	getColor(color: ColorIdentifier, useDefault?: boolean): Color | null;
+	getColor(color: ColorIdentifier, useDefault?: boolean): Color | undefined;
 
 	/**
 	 * Returns whether the theme defines a value for the color. If not, that means the
diff --git a/src/vs/platform/theme/test/common/testThemeService.ts b/src/vs/platform/theme/test/common/testThemeService.ts
@@ -12,12 +12,12 @@ export class TestTheme implements ITheme {
 	constructor(private colors: { [id: string]: string; } = {}, public type = DARK) {
 	}
 
-	getColor(color: string, useDefault?: boolean): Color | null {
+	getColor(color: string, useDefault?: boolean): Color | undefined {
 		let value = this.colors[color];
 		if (value) {
 			return Color.fromHex(value);
 		}
-		return null;
+		return undefined;
 	}
 
 	defines(color: string): boolean {
diff --git a/src/vs/workbench/browser/parts/quickinput/quickInputBox.ts b/src/vs/workbench/browser/parts/quickinput/quickInputBox.ts
@@ -100,18 +100,18 @@ export class QuickInputBox {
 
 	style(theme: ITheme) {
 		this.inputBox.style({
-			inputForeground: theme.getColor(inputForeground) || undefined,
-			inputBackground: theme.getColor(inputBackground) || undefined,
-			inputBorder: theme.getColor(inputBorder) || undefined,
-			inputValidationInfoBackground: theme.getColor(inputValidationInfoBackground) || undefined,
-			inputValidationInfoForeground: theme.getColor(inputValidationInfoForeground) || undefined,
-			inputValidationInfoBorder: theme.getColor(inputValidationInfoBorder) || undefined,
-			inputValidationWarningBackground: theme.getColor(inputValidationWarningBackground) || undefined,
-			inputValidationWarningForeground: theme.getColor(inputValidationWarningForeground) || undefined,
-			inputValidationWarningBorder: theme.getColor(inputValidationWarningBorder) || undefined,
-			inputValidationErrorBackground: theme.getColor(inputValidationErrorBackground) || undefined,
-			inputValidationErrorForeground: theme.getColor(inputValidationErrorForeground) || undefined,
-			inputValidationErrorBorder: theme.getColor(inputValidationErrorBorder) || undefined,
+			inputForeground: theme.getColor(inputForeground),
+			inputBackground: theme.getColor(inputBackground),
+			inputBorder: theme.getColor(inputBorder),
+			inputValidationInfoBackground: theme.getColor(inputValidationInfoBackground),
+			inputValidationInfoForeground: theme.getColor(inputValidationInfoForeground),
+			inputValidationInfoBorder: theme.getColor(inputValidationInfoBorder),
+			inputValidationWarningBackground: theme.getColor(inputValidationWarningBackground),
+			inputValidationWarningForeground: theme.getColor(inputValidationWarningForeground),
+			inputValidationWarningBorder: theme.getColor(inputValidationWarningBorder),
+			inputValidationErrorBackground: theme.getColor(inputValidationErrorBackground),
+			inputValidationErrorForeground: theme.getColor(inputValidationErrorForeground),
+			inputValidationErrorBorder: theme.getColor(inputValidationErrorBorder),
 		});
 	}
 
diff --git a/src/vs/workbench/parts/scm/electron-browser/dirtydiffDecorator.ts b/src/vs/workbench/parts/scm/electron-browser/dirtydiffDecorator.ts
@@ -156,7 +156,7 @@ function getChangeType(change: IChange): ChangeType {
 	}
 }
 
-function getChangeTypeColor(theme: ITheme, changeType: ChangeType): Color | null {
+function getChangeTypeColor(theme: ITheme, changeType: ChangeType): Color | undefined {
 	switch (changeType) {
 		case ChangeType.Modify: return theme.getColor(editorGutterModifiedBackground);
 		case ChangeType.Add: return theme.getColor(editorGutterAddedBackground);
@@ -365,8 +365,8 @@ class DirtyDiffWidget extends PeekViewWidget {
 			arrowColor: borderColor,
 			frameColor: borderColor,
 			headerBackgroundColor: theme.getColor(peekViewTitleBackground) || Color.transparent,
-			primaryHeadingColor: theme.getColor(peekViewTitleForeground) || undefined,
-			secondaryHeadingColor: theme.getColor(peekViewTitleInfoForeground) || undefined
+			primaryHeadingColor: theme.getColor(peekViewTitleForeground),
+			secondaryHeadingColor: theme.getColor(peekViewTitleInfoForeground)
 		});
 	}
 
diff --git a/src/vs/workbench/services/themes/electron-browser/colorThemeData.ts b/src/vs/workbench/services/themes/electron-browser/colorThemeData.ts
@@ -57,8 +57,8 @@ export class ColorThemeData implements IColorTheme {
 	private colorMap: IColorMap = {};
 	private customColorMap: IColorMap = {};
 
-	public getColor(colorId: ColorIdentifier, useDefault?: boolean): Color | null {
-		let color: Color | null = this.customColorMap[colorId];
+	public getColor(colorId: ColorIdentifier, useDefault?: boolean): Color | undefined {
+		let color: Color | undefined = this.customColorMap[colorId];
 		if (color) {
 			return color;
 		}
@@ -69,7 +69,7 @@ export class ColorThemeData implements IColorTheme {
 		return color;
 	}
 
-	public getDefault(colorId: ColorIdentifier): Color | null {
+	public getDefault(colorId: ColorIdentifier): Color | undefined {
 		return colorRegistry.resolveDefaultColor(colorId, this);
 	}
 

Original file line number	Diff line number	Diff line change
`@@ -185,7 +185,7 @@ export class MarkerNavigationWidget extends ZoneWidget {`
`185`	`185`	`}`
`186`	`186`
`187`	`187`	`private _applyTheme(theme: ITheme) {`
`188`		`- this._backgroundColor = theme.getColor(editorMarkerNavigationBackground) \|\| undefined;`
	`188`	`+ this._backgroundColor = theme.getColor(editorMarkerNavigationBackground);`
`189`	`189`	`let colorId = editorMarkerNavigationError;`
`190`	`190`	`if (this._severity === MarkerSeverity.Warning) {`
`191`	`191`	`colorId = editorMarkerNavigationWarning;`
Original file line number	Diff line number	Diff line change
`@@ -27,7 +27,7 @@ export interface ColorContribution {`
`27`	`27`
`28`	`28`
`29`	`29`	`export interface ColorFunction {`
`30`		`- (theme: ITheme): Color \| null;`
	`30`	`+ (theme: ITheme): Color \| undefined;`
`31`	`31`	`}`
`32`	`32`
`33`	`33`	`export interface ColorDefaults {`
`@@ -71,7 +71,7 @@ export interface IColorRegistry {`
`71`	`71`	`/**`
`72`	`72`	`* Gets the default color of the given id`
`73`	`73`	`*/`
`74`		`- resolveDefaultColor(id: ColorIdentifier, theme: ITheme): Color \| null;`
	`74`	`+ resolveDefaultColor(id: ColorIdentifier, theme: ITheme): Color \| undefined;`
`75`	`75`
`76`	`76`	`/**`
`77`	`77`	`* JSON schema for an object to assign color values to one of the color contributions.`
`@@ -131,13 +131,13 @@ class ColorRegistry implements IColorRegistry {`
`131`	`131`	`return Object.keys(this.colorsById).map(id => this.colorsById[id]);`
`132`	`132`	`}`
`133`	`133`
`134`		`- public resolveDefaultColor(id: ColorIdentifier, theme: ITheme): Color \| null {`
	`134`	`+ public resolveDefaultColor(id: ColorIdentifier, theme: ITheme): Color \| undefined {`
`135`	`135`	`const colorDesc = this.colorsById[id];`
`136`	`136`	`if (colorDesc && colorDesc.defaults) {`
`137`	`137`	`const colorValue = colorDesc.defaults[theme.type];`
`138`	`138`	`return resolveColorValue(colorValue, theme);`
`139`	`139`	`}`
`140`		`- return null;`
	`140`	`+ return undefined;`
`141`	`141`	`}`
`142`	`142`
`143`	`143`	`public getColorSchema(): IJSONSchema {`
`@@ -385,7 +385,7 @@ export function darken(colorValue: ColorValue, factor: number): ColorFunction {`
`385`	`385`	`if (color) {`
`386`	`386`	`return color.darken(factor);`
`387`	`387`	`}`
`388`		`- return null;`
	`388`	`+ return undefined;`
`389`	`389`	`};`
`390`	`390`	`}`
`391`	`391`
`@@ -395,7 +395,7 @@ export function lighten(colorValue: ColorValue, factor: number): ColorFunction {`
`395`	`395`	`if (color) {`
`396`	`396`	`return color.lighten(factor);`
`397`	`397`	`}`
`398`		`- return null;`
	`398`	`+ return undefined;`
`399`	`399`	`};`
`400`	`400`	`}`
`401`	`401`
`@@ -405,7 +405,7 @@ export function transparent(colorValue: ColorValue, factor: number): ColorFuncti`
`405`	`405`	`if (color) {`
`406`	`406`	`return color.transparent(factor);`
`407`	`407`	`}`
`408`		`- return null;`
	`408`	`+ return undefined;`
`409`	`409`	`};`
`410`	`410`	`}`
`411`	`411`
`@@ -417,7 +417,7 @@ export function oneOf(...colorValues: ColorValue[]): ColorFunction {`
`417`	`417`	`return color;`
`418`	`418`	`}`
`419`	`419`	`}`
`420`		`- return null;`
	`420`	`+ return undefined;`
`421`	`421`	`};`
`422`	`422`	`}`
`423`	`423`
`@@ -434,7 +434,7 @@ function lessProminent(colorValue: ColorValue, backgroundColorValue: ColorValue,`
`434`	`434`	`}`
`435`	`435`	`return from.transparent(factor * transparency);`
`436`	`436`	`}`
`437`		`- return null;`
	`437`	`+ return undefined;`
`438`	`438`	`};`
`439`	`439`	`}`
`440`	`440`
`@@ -443,9 +443,9 @@ function lessProminent(colorValue: ColorValue, backgroundColorValue: ColorValue,`
`443`	`443`	`/**`
`444`	`444`	`* @param colorValue Resolve a color value in the context of a theme`
`445`	`445`	`*/`
`446`		`-function resolveColorValue(colorValue: ColorValue \| null, theme: ITheme): Color \| null {`
	`446`	`+function resolveColorValue(colorValue: ColorValue \| null, theme: ITheme): Color \| undefined {`
`447`	`447`	`if (colorValue === null) {`
`448`		`- return null;`
	`448`	`+ return undefined;`
`449`	`449`	`} else if (typeof colorValue === 'string') {`
`450`	`450`	`if (colorValue[0] === '#') {`
`451`	`451`	`return Color.fromHex(colorValue);`
`@@ -456,7 +456,7 @@ function resolveColorValue(colorValue: ColorValue \| null, theme: ITheme): Color`
`456`	`456`	`} else if (typeof colorValue === 'function') {`
`457`	`457`	`return colorValue(theme);`
`458`	`458`	`}`
`459`		`- return null;`
	`459`	`+ return undefined;`
`460`	`460`	`}`
`461`	`461`
`462`	`462`	`export const workbenchColorsSchemaId = 'vscode://schemas/workbench-colors';`
Original file line number	Diff line number	Diff line change
`@@ -9,7 +9,7 @@ import { IDisposable } from 'vs/base/common/lifecycle';`
`9`	`9`	`import { Color } from 'vs/base/common/color';`
`10`	`10`	`import { mixin } from 'vs/base/common/objects';`
`11`	`11`
`12`		`-export type styleFn = (colors: { [name: string]: Color \| null }) => void;`
	`12`	`+export type styleFn = (colors: { [name: string]: Color \| undefined }) => void;`
`13`	`13`
`14`	`14`	`export interface IStyleOverrides {`
`15`	`15`	`[color: string]: ColorIdentifier \| undefined;`
`@@ -24,7 +24,7 @@ export interface IColorMapping {`
`24`	`24`	`}`
`25`	`25`
`26`	`26`	`export interface IComputedStyles {`
`27`		`- [color: string]: Color \| null;`
	`27`	`+ [color: string]: Color \| undefined;`
`28`	`28`	`}`
`29`	`29`
`30`	`30`	`export function computeStyles(theme: ITheme, styleMap: IColorMapping): IComputedStyles {`
Original file line number	Diff line number	Diff line change
`@@ -12,12 +12,12 @@ export class TestTheme implements ITheme {`
`12`	`12`	`constructor(private colors: { [id: string]: string; } = {}, public type = DARK) {`
`13`	`13`	`}`
`14`	`14`
`15`		`- getColor(color: string, useDefault?: boolean): Color \| null {`
	`15`	`+ getColor(color: string, useDefault?: boolean): Color \| undefined {`
`16`	`16`	`let value = this.colors[color];`
`17`	`17`	`if (value) {`
`18`	`18`	`return Color.fromHex(value);`
`19`	`19`	`}`
`20`		`- return null;`
	`20`	`+ return undefined;`
`21`	`21`	`}`
`22`	`22`
`23`	`23`	`defines(color: string): boolean {`