@sussudio/platform
Version:
Internal APIs for VS Code's service injection the base services.
1,237 lines • 74.7 kB
JavaScript
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
import { RunOnceScheduler } from '@sussudio/base/common/async.mjs';
import { Color, RGBA } from '@sussudio/base/common/color.mjs';
import { Emitter } from '@sussudio/base/common/event.mjs';
import { assertNever } from '@sussudio/base/common/assert.mjs';
import * as nls from 'vscode-nls.mjs';
import { Extensions as JSONExtensions } from '../../jsonschemas/common/jsonContributionRegistry.mjs';
import * as platform from '../../registry/common/platform.mjs';
/**
* Returns the css variable name for the given color identifier. Dots (`.`) are replaced with hyphens (`-`) and
* everything is prefixed with `--vscode-`.
*
* @sample `editorSuggestWidget.background` is `--vscode-editorSuggestWidget-background`.
*/
export function asCssVariableName(colorIdent) {
return `--vscode-${colorIdent.replace(/\./g, '-')}`;
}
export function asCssValue(color) {
return `var(${asCssVariableName(color)})`;
}
// color registry
export const Extensions = {
ColorContribution: 'base.contributions.colors',
};
class ColorRegistry {
_onDidChangeSchema = new Emitter();
onDidChangeSchema = this._onDidChangeSchema.event;
colorsById;
colorSchema = { type: 'object', properties: {} };
colorReferenceSchema = { type: 'string', enum: [], enumDescriptions: [] };
constructor() {
this.colorsById = {};
}
registerColor(id, defaults, description, needsTransparency = false, deprecationMessage) {
const colorContribution = { id, description, defaults, needsTransparency, deprecationMessage };
this.colorsById[id] = colorContribution;
const propertySchema = {
type: 'string',
description,
format: 'color-hex',
defaultSnippets: [{ body: '${1:#ff0000}' }],
};
if (deprecationMessage) {
propertySchema.deprecationMessage = deprecationMessage;
}
this.colorSchema.properties[id] = propertySchema;
this.colorReferenceSchema.enum.push(id);
this.colorReferenceSchema.enumDescriptions.push(description);
this._onDidChangeSchema.fire();
return id;
}
deregisterColor(id) {
delete this.colorsById[id];
delete this.colorSchema.properties[id];
const index = this.colorReferenceSchema.enum.indexOf(id);
if (index !== -1) {
this.colorReferenceSchema.enum.splice(index, 1);
this.colorReferenceSchema.enumDescriptions.splice(index, 1);
}
this._onDidChangeSchema.fire();
}
getColors() {
return Object.keys(this.colorsById).map((id) => this.colorsById[id]);
}
resolveDefaultColor(id, theme) {
const colorDesc = this.colorsById[id];
if (colorDesc && colorDesc.defaults) {
const colorValue = colorDesc.defaults[theme.type];
return resolveColorValue(colorValue, theme);
}
return undefined;
}
getColorSchema() {
return this.colorSchema;
}
getColorReferenceSchema() {
return this.colorReferenceSchema;
}
toString() {
const sorter = (a, b) => {
const cat1 = a.indexOf('.') === -1 ? 0 : 1;
const cat2 = b.indexOf('.') === -1 ? 0 : 1;
if (cat1 !== cat2) {
return cat1 - cat2;
}
return a.localeCompare(b);
};
return Object.keys(this.colorsById)
.sort(sorter)
.map((k) => `- \`${k}\`: ${this.colorsById[k].description}`)
.join('\n');
}
}
const colorRegistry = new ColorRegistry();
platform.Registry.add(Extensions.ColorContribution, colorRegistry);
function migrateColorDefaults(o) {
if (o === null) {
return o;
}
if (typeof o.hcLight === 'undefined') {
if (o.hcDark === null || typeof o.hcDark === 'string') {
o.hcLight = o.hcDark;
} else {
o.hcLight = o.light;
}
}
return o;
}
export function registerColor(id, defaults, description, needsTransparency, deprecationMessage) {
return colorRegistry.registerColor(
id,
migrateColorDefaults(defaults),
description,
needsTransparency,
deprecationMessage,
);
}
export function getColorRegistry() {
return colorRegistry;
}
// ----- base colors
export const foreground = registerColor(
'foreground',
{ dark: '#CCCCCC', light: '#616161', hcDark: '#FFFFFF', hcLight: '#292929' },
nls.localize('foreground', 'Overall foreground color. This color is only used if not overridden by a component.'),
);
export const disabledForeground = registerColor(
'disabledForeground',
{ dark: '#CCCCCC80', light: '#61616180', hcDark: '#A5A5A5', hcLight: '#7F7F7F' },
nls.localize(
'disabledForeground',
'Overall foreground for disabled elements. This color is only used if not overridden by a component.',
),
);
export const errorForeground = registerColor(
'errorForeground',
{ dark: '#F48771', light: '#A1260D', hcDark: '#F48771', hcLight: '#B5200D' },
nls.localize(
'errorForeground',
'Overall foreground color for error messages. This color is only used if not overridden by a component.',
),
);
export const descriptionForeground = registerColor(
'descriptionForeground',
{
light: '#717171',
dark: transparent(foreground, 0.7),
hcDark: transparent(foreground, 0.7),
hcLight: transparent(foreground, 0.7),
},
nls.localize(
'descriptionForeground',
'Foreground color for description text providing additional information, for example for a label.',
),
);
export const iconForeground = registerColor(
'icon.foreground',
{ dark: '#C5C5C5', light: '#424242', hcDark: '#FFFFFF', hcLight: '#292929' },
nls.localize('iconForeground', 'The default color for icons in the workbench.'),
);
export const focusBorder = registerColor(
'focusBorder',
{ dark: '#007FD4', light: '#0090F1', hcDark: '#F38518', hcLight: '#006BBD' },
nls.localize(
'focusBorder',
'Overall border color for focused elements. This color is only used if not overridden by a component.',
),
);
export const contrastBorder = registerColor(
'contrastBorder',
{ light: null, dark: null, hcDark: '#6FC3DF', hcLight: '#0F4A85' },
nls.localize('contrastBorder', 'An extra border around elements to separate them from others for greater contrast.'),
);
export const activeContrastBorder = registerColor(
'contrastActiveBorder',
{ light: null, dark: null, hcDark: focusBorder, hcLight: focusBorder },
nls.localize(
'activeContrastBorder',
'An extra border around active elements to separate them from others for greater contrast.',
),
);
export const selectionBackground = registerColor(
'selection.background',
{ light: null, dark: null, hcDark: null, hcLight: null },
nls.localize(
'selectionBackground',
'The background color of text selections in the workbench (e.g. for input fields or text areas). Note that this does not apply to selections within the editor.',
),
);
// ------ text colors
export const textSeparatorForeground = registerColor(
'textSeparator.foreground',
{ light: '#0000002e', dark: '#ffffff2e', hcDark: Color.black, hcLight: '#292929' },
nls.localize('textSeparatorForeground', 'Color for text separators.'),
);
export const textLinkForeground = registerColor(
'textLink.foreground',
{ light: '#006AB1', dark: '#3794FF', hcDark: '#3794FF', hcLight: '#0F4A85' },
nls.localize('textLinkForeground', 'Foreground color for links in text.'),
);
export const textLinkActiveForeground = registerColor(
'textLink.activeForeground',
{ light: '#006AB1', dark: '#3794FF', hcDark: '#3794FF', hcLight: '#0F4A85' },
nls.localize('textLinkActiveForeground', 'Foreground color for links in text when clicked on and on mouse hover.'),
);
export const textPreformatForeground = registerColor(
'textPreformat.foreground',
{ light: '#A31515', dark: '#D7BA7D', hcDark: '#D7BA7D', hcLight: '#292929' },
nls.localize('textPreformatForeground', 'Foreground color for preformatted text segments.'),
);
export const textBlockQuoteBackground = registerColor(
'textBlockQuote.background',
{ light: '#7f7f7f1a', dark: '#7f7f7f1a', hcDark: null, hcLight: '#F2F2F2' },
nls.localize('textBlockQuoteBackground', 'Background color for block quotes in text.'),
);
export const textBlockQuoteBorder = registerColor(
'textBlockQuote.border',
{ light: '#007acc80', dark: '#007acc80', hcDark: Color.white, hcLight: '#292929' },
nls.localize('textBlockQuoteBorder', 'Border color for block quotes in text.'),
);
export const textCodeBlockBackground = registerColor(
'textCodeBlock.background',
{ light: '#dcdcdc66', dark: '#0a0a0a66', hcDark: Color.black, hcLight: '#F2F2F2' },
nls.localize('textCodeBlockBackground', 'Background color for code blocks in text.'),
);
// ----- widgets
export const widgetShadow = registerColor(
'widget.shadow',
{ dark: transparent(Color.black, 0.36), light: transparent(Color.black, 0.16), hcDark: null, hcLight: null },
nls.localize('widgetShadow', 'Shadow color of widgets such as find/replace inside the editor.'),
);
export const widgetBorder = registerColor(
'widget.border',
{ dark: null, light: null, hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize('widgetBorder', 'Border color of widgets such as find/replace inside the editor.'),
);
export const inputBackground = registerColor(
'input.background',
{ dark: '#3C3C3C', light: Color.white, hcDark: Color.black, hcLight: Color.white },
nls.localize('inputBoxBackground', 'Input box background.'),
);
export const inputForeground = registerColor(
'input.foreground',
{ dark: foreground, light: foreground, hcDark: foreground, hcLight: foreground },
nls.localize('inputBoxForeground', 'Input box foreground.'),
);
export const inputBorder = registerColor(
'input.border',
{ dark: null, light: null, hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize('inputBoxBorder', 'Input box border.'),
);
export const inputActiveOptionBorder = registerColor(
'inputOption.activeBorder',
{ dark: '#007ACC', light: '#007ACC', hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize('inputBoxActiveOptionBorder', 'Border color of activated options in input fields.'),
);
export const inputActiveOptionHoverBackground = registerColor(
'inputOption.hoverBackground',
{ dark: '#5a5d5e80', light: '#b8b8b850', hcDark: null, hcLight: null },
nls.localize('inputOption.hoverBackground', 'Background color of activated options in input fields.'),
);
export const inputActiveOptionBackground = registerColor(
'inputOption.activeBackground',
{
dark: transparent(focusBorder, 0.4),
light: transparent(focusBorder, 0.2),
hcDark: Color.transparent,
hcLight: Color.transparent,
},
nls.localize('inputOption.activeBackground', 'Background hover color of options in input fields.'),
);
export const inputActiveOptionForeground = registerColor(
'inputOption.activeForeground',
{ dark: Color.white, light: Color.black, hcDark: foreground, hcLight: foreground },
nls.localize('inputOption.activeForeground', 'Foreground color of activated options in input fields.'),
);
export const inputPlaceholderForeground = registerColor(
'input.placeholderForeground',
{
light: transparent(foreground, 0.5),
dark: transparent(foreground, 0.5),
hcDark: transparent(foreground, 0.7),
hcLight: transparent(foreground, 0.7),
},
nls.localize('inputPlaceholderForeground', 'Input box foreground color for placeholder text.'),
);
export const inputValidationInfoBackground = registerColor(
'inputValidation.infoBackground',
{ dark: '#063B49', light: '#D6ECF2', hcDark: Color.black, hcLight: Color.white },
nls.localize('inputValidationInfoBackground', 'Input validation background color for information severity.'),
);
export const inputValidationInfoForeground = registerColor(
'inputValidation.infoForeground',
{ dark: null, light: null, hcDark: null, hcLight: foreground },
nls.localize('inputValidationInfoForeground', 'Input validation foreground color for information severity.'),
);
export const inputValidationInfoBorder = registerColor(
'inputValidation.infoBorder',
{ dark: '#007acc', light: '#007acc', hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize('inputValidationInfoBorder', 'Input validation border color for information severity.'),
);
export const inputValidationWarningBackground = registerColor(
'inputValidation.warningBackground',
{ dark: '#352A05', light: '#F6F5D2', hcDark: Color.black, hcLight: Color.white },
nls.localize('inputValidationWarningBackground', 'Input validation background color for warning severity.'),
);
export const inputValidationWarningForeground = registerColor(
'inputValidation.warningForeground',
{ dark: null, light: null, hcDark: null, hcLight: foreground },
nls.localize('inputValidationWarningForeground', 'Input validation foreground color for warning severity.'),
);
export const inputValidationWarningBorder = registerColor(
'inputValidation.warningBorder',
{ dark: '#B89500', light: '#B89500', hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize('inputValidationWarningBorder', 'Input validation border color for warning severity.'),
);
export const inputValidationErrorBackground = registerColor(
'inputValidation.errorBackground',
{ dark: '#5A1D1D', light: '#F2DEDE', hcDark: Color.black, hcLight: Color.white },
nls.localize('inputValidationErrorBackground', 'Input validation background color for error severity.'),
);
export const inputValidationErrorForeground = registerColor(
'inputValidation.errorForeground',
{ dark: null, light: null, hcDark: null, hcLight: foreground },
nls.localize('inputValidationErrorForeground', 'Input validation foreground color for error severity.'),
);
export const inputValidationErrorBorder = registerColor(
'inputValidation.errorBorder',
{ dark: '#BE1100', light: '#BE1100', hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize('inputValidationErrorBorder', 'Input validation border color for error severity.'),
);
export const selectBackground = registerColor(
'dropdown.background',
{ dark: '#3C3C3C', light: Color.white, hcDark: Color.black, hcLight: Color.white },
nls.localize('dropdownBackground', 'Dropdown background.'),
);
export const selectListBackground = registerColor(
'dropdown.listBackground',
{ dark: null, light: null, hcDark: Color.black, hcLight: Color.white },
nls.localize('dropdownListBackground', 'Dropdown list background.'),
);
export const selectForeground = registerColor(
'dropdown.foreground',
{ dark: '#F0F0F0', light: foreground, hcDark: Color.white, hcLight: foreground },
nls.localize('dropdownForeground', 'Dropdown foreground.'),
);
export const selectBorder = registerColor(
'dropdown.border',
{ dark: selectBackground, light: '#CECECE', hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize('dropdownBorder', 'Dropdown border.'),
);
export const buttonForeground = registerColor(
'button.foreground',
{ dark: Color.white, light: Color.white, hcDark: Color.white, hcLight: Color.white },
nls.localize('buttonForeground', 'Button foreground color.'),
);
export const buttonSeparator = registerColor(
'button.separator',
{
dark: transparent(buttonForeground, 0.4),
light: transparent(buttonForeground, 0.4),
hcDark: transparent(buttonForeground, 0.4),
hcLight: transparent(buttonForeground, 0.4),
},
nls.localize('buttonSeparator', 'Button separator color.'),
);
export const buttonBackground = registerColor(
'button.background',
{ dark: '#0E639C', light: '#007ACC', hcDark: null, hcLight: '#0F4A85' },
nls.localize('buttonBackground', 'Button background color.'),
);
export const buttonHoverBackground = registerColor(
'button.hoverBackground',
{
dark: lighten(buttonBackground, 0.2),
light: darken(buttonBackground, 0.2),
hcDark: buttonBackground,
hcLight: buttonBackground,
},
nls.localize('buttonHoverBackground', 'Button background color when hovering.'),
);
export const buttonBorder = registerColor(
'button.border',
{ dark: contrastBorder, light: contrastBorder, hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize('buttonBorder', 'Button border color.'),
);
export const buttonSecondaryForeground = registerColor(
'button.secondaryForeground',
{ dark: Color.white, light: Color.white, hcDark: Color.white, hcLight: foreground },
nls.localize('buttonSecondaryForeground', 'Secondary button foreground color.'),
);
export const buttonSecondaryBackground = registerColor(
'button.secondaryBackground',
{ dark: '#3A3D41', light: '#5F6A79', hcDark: null, hcLight: Color.white },
nls.localize('buttonSecondaryBackground', 'Secondary button background color.'),
);
export const buttonSecondaryHoverBackground = registerColor(
'button.secondaryHoverBackground',
{
dark: lighten(buttonSecondaryBackground, 0.2),
light: darken(buttonSecondaryBackground, 0.2),
hcDark: null,
hcLight: null,
},
nls.localize('buttonSecondaryHoverBackground', 'Secondary button background color when hovering.'),
);
export const badgeBackground = registerColor(
'badge.background',
{ dark: '#4D4D4D', light: '#C4C4C4', hcDark: Color.black, hcLight: '#0F4A85' },
nls.localize(
'badgeBackground',
'Badge background color. Badges are small information labels, e.g. for search results count.',
),
);
export const badgeForeground = registerColor(
'badge.foreground',
{ dark: Color.white, light: '#333', hcDark: Color.white, hcLight: Color.white },
nls.localize(
'badgeForeground',
'Badge foreground color. Badges are small information labels, e.g. for search results count.',
),
);
export const scrollbarShadow = registerColor(
'scrollbar.shadow',
{ dark: '#000000', light: '#DDDDDD', hcDark: null, hcLight: null },
nls.localize('scrollbarShadow', 'Scrollbar shadow to indicate that the view is scrolled.'),
);
export const scrollbarSliderBackground = registerColor(
'scrollbarSlider.background',
{
dark: Color.fromHex('#797979').transparent(0.4),
light: Color.fromHex('#646464').transparent(0.4),
hcDark: transparent(contrastBorder, 0.6),
hcLight: transparent(contrastBorder, 0.4),
},
nls.localize('scrollbarSliderBackground', 'Scrollbar slider background color.'),
);
export const scrollbarSliderHoverBackground = registerColor(
'scrollbarSlider.hoverBackground',
{
dark: Color.fromHex('#646464').transparent(0.7),
light: Color.fromHex('#646464').transparent(0.7),
hcDark: transparent(contrastBorder, 0.8),
hcLight: transparent(contrastBorder, 0.8),
},
nls.localize('scrollbarSliderHoverBackground', 'Scrollbar slider background color when hovering.'),
);
export const scrollbarSliderActiveBackground = registerColor(
'scrollbarSlider.activeBackground',
{
dark: Color.fromHex('#BFBFBF').transparent(0.4),
light: Color.fromHex('#000000').transparent(0.6),
hcDark: contrastBorder,
hcLight: contrastBorder,
},
nls.localize('scrollbarSliderActiveBackground', 'Scrollbar slider background color when clicked on.'),
);
export const progressBarBackground = registerColor(
'progressBar.background',
{ dark: Color.fromHex('#0E70C0'), light: Color.fromHex('#0E70C0'), hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize(
'progressBarBackground',
'Background color of the progress bar that can show for long running operations.',
),
);
export const editorErrorBackground = registerColor(
'editorError.background',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'editorError.background',
'Background color of error text in the editor. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const editorErrorForeground = registerColor(
'editorError.foreground',
{ dark: '#F14C4C', light: '#E51400', hcDark: '#F48771', hcLight: '#B5200D' },
nls.localize('editorError.foreground', 'Foreground color of error squigglies in the editor.'),
);
export const editorErrorBorder = registerColor(
'editorError.border',
{ dark: null, light: null, hcDark: Color.fromHex('#E47777').transparent(0.8), hcLight: '#B5200D' },
nls.localize('errorBorder', 'Border color of error boxes in the editor.'),
);
export const editorWarningBackground = registerColor(
'editorWarning.background',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'editorWarning.background',
'Background color of warning text in the editor. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const editorWarningForeground = registerColor(
'editorWarning.foreground',
{ dark: '#CCA700', light: '#BF8803', hcDark: '#FFD37', hcLight: '#895503' },
nls.localize('editorWarning.foreground', 'Foreground color of warning squigglies in the editor.'),
);
export const editorWarningBorder = registerColor(
'editorWarning.border',
{ dark: null, light: null, hcDark: Color.fromHex('#FFCC00').transparent(0.8), hcLight: '#' },
nls.localize('warningBorder', 'Border color of warning boxes in the editor.'),
);
export const editorInfoBackground = registerColor(
'editorInfo.background',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'editorInfo.background',
'Background color of info text in the editor. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const editorInfoForeground = registerColor(
'editorInfo.foreground',
{ dark: '#3794FF', light: '#1a85ff', hcDark: '#3794FF', hcLight: '#1a85ff' },
nls.localize('editorInfo.foreground', 'Foreground color of info squigglies in the editor.'),
);
export const editorInfoBorder = registerColor(
'editorInfo.border',
{ dark: null, light: null, hcDark: Color.fromHex('#3794FF').transparent(0.8), hcLight: '#292929' },
nls.localize('infoBorder', 'Border color of info boxes in the editor.'),
);
export const editorHintForeground = registerColor(
'editorHint.foreground',
{ dark: Color.fromHex('#eeeeee').transparent(0.7), light: '#6c6c6c', hcDark: null, hcLight: null },
nls.localize('editorHint.foreground', 'Foreground color of hint squigglies in the editor.'),
);
export const editorHintBorder = registerColor(
'editorHint.border',
{ dark: null, light: null, hcDark: Color.fromHex('#eeeeee').transparent(0.8), hcLight: '#292929' },
nls.localize('hintBorder', 'Border color of hint boxes in the editor.'),
);
export const sashHoverBorder = registerColor(
'sash.hoverBorder',
{ dark: focusBorder, light: focusBorder, hcDark: focusBorder, hcLight: focusBorder },
nls.localize('sashActiveBorder', 'Border color of active sashes.'),
);
/**
* Editor background color.
*/
export const editorBackground = registerColor(
'editor.background',
{ light: '#ffffff', dark: '#1E1E1E', hcDark: Color.black, hcLight: Color.white },
nls.localize('editorBackground', 'Editor background color.'),
);
/**
* Editor foreground color.
*/
export const editorForeground = registerColor(
'editor.foreground',
{ light: '#333333', dark: '#BBBBBB', hcDark: Color.white, hcLight: foreground },
nls.localize('editorForeground', 'Editor default foreground color.'),
);
/**
* Sticky scroll
*/
export const editorStickyScrollBackground = registerColor(
'editorStickyScroll.background',
{ light: editorBackground, dark: editorBackground, hcDark: editorBackground, hcLight: editorBackground },
nls.localize('editorStickyScrollBackground', 'Sticky scroll background color for the editor'),
);
export const editorStickyScrollHoverBackground = registerColor(
'editorStickyScrollHover.background',
{ dark: '#2A2D2E', light: '#F0F0F0', hcDark: null, hcLight: Color.fromHex('#0F4A85').transparent(0.1) },
nls.localize('editorStickyScrollHoverBackground', 'Sticky scroll on hover background color for the editor'),
);
/**
* Editor widgets
*/
export const editorWidgetBackground = registerColor(
'editorWidget.background',
{ dark: '#252526', light: '#F3F3F3', hcDark: '#0C141F', hcLight: Color.white },
nls.localize('editorWidgetBackground', 'Background color of editor widgets, such as find/replace.'),
);
export const editorWidgetForeground = registerColor(
'editorWidget.foreground',
{ dark: foreground, light: foreground, hcDark: foreground, hcLight: foreground },
nls.localize('editorWidgetForeground', 'Foreground color of editor widgets, such as find/replace.'),
);
export const editorWidgetBorder = registerColor(
'editorWidget.border',
{ dark: '#454545', light: '#C8C8C8', hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize(
'editorWidgetBorder',
'Border color of editor widgets. The color is only used if the widget chooses to have a border and if the color is not overridden by a widget.',
),
);
export const editorWidgetResizeBorder = registerColor(
'editorWidget.resizeBorder',
{ light: null, dark: null, hcDark: null, hcLight: null },
nls.localize(
'editorWidgetResizeBorder',
'Border color of the resize bar of editor widgets. The color is only used if the widget chooses to have a resize border and if the color is not overridden by a widget.',
),
);
/**
* Quick pick widget
*/
export const quickInputBackground = registerColor(
'quickInput.background',
{
dark: editorWidgetBackground,
light: editorWidgetBackground,
hcDark: editorWidgetBackground,
hcLight: editorWidgetBackground,
},
nls.localize(
'pickerBackground',
'Quick picker background color. The quick picker widget is the container for pickers like the command palette.',
),
);
export const quickInputForeground = registerColor(
'quickInput.foreground',
{
dark: editorWidgetForeground,
light: editorWidgetForeground,
hcDark: editorWidgetForeground,
hcLight: editorWidgetForeground,
},
nls.localize(
'pickerForeground',
'Quick picker foreground color. The quick picker widget is the container for pickers like the command palette.',
),
);
export const quickInputTitleBackground = registerColor(
'quickInputTitle.background',
{
dark: new Color(new RGBA(255, 255, 255, 0.105)),
light: new Color(new RGBA(0, 0, 0, 0.06)),
hcDark: '#000000',
hcLight: Color.white,
},
nls.localize(
'pickerTitleBackground',
'Quick picker title background color. The quick picker widget is the container for pickers like the command palette.',
),
);
export const pickerGroupForeground = registerColor(
'pickerGroup.foreground',
{ dark: '#3794FF', light: '#0066BF', hcDark: Color.white, hcLight: '#0F4A85' },
nls.localize('pickerGroupForeground', 'Quick picker color for grouping labels.'),
);
export const pickerGroupBorder = registerColor(
'pickerGroup.border',
{ dark: '#3F3F46', light: '#CCCEDB', hcDark: Color.white, hcLight: '#0F4A85' },
nls.localize('pickerGroupBorder', 'Quick picker color for grouping borders.'),
);
/**
* Keybinding label
*/
export const keybindingLabelBackground = registerColor(
'keybindingLabel.background',
{
dark: new Color(new RGBA(128, 128, 128, 0.17)),
light: new Color(new RGBA(221, 221, 221, 0.4)),
hcDark: Color.transparent,
hcLight: Color.transparent,
},
nls.localize(
'keybindingLabelBackground',
'Keybinding label background color. The keybinding label is used to represent a keyboard shortcut.',
),
);
export const keybindingLabelForeground = registerColor(
'keybindingLabel.foreground',
{ dark: Color.fromHex('#CCCCCC'), light: Color.fromHex('#555555'), hcDark: Color.white, hcLight: foreground },
nls.localize(
'keybindingLabelForeground',
'Keybinding label foreground color. The keybinding label is used to represent a keyboard shortcut.',
),
);
export const keybindingLabelBorder = registerColor(
'keybindingLabel.border',
{
dark: new Color(new RGBA(51, 51, 51, 0.6)),
light: new Color(new RGBA(204, 204, 204, 0.4)),
hcDark: new Color(new RGBA(111, 195, 223)),
hcLight: contrastBorder,
},
nls.localize(
'keybindingLabelBorder',
'Keybinding label border color. The keybinding label is used to represent a keyboard shortcut.',
),
);
export const keybindingLabelBottomBorder = registerColor(
'keybindingLabel.bottomBorder',
{
dark: new Color(new RGBA(68, 68, 68, 0.6)),
light: new Color(new RGBA(187, 187, 187, 0.4)),
hcDark: new Color(new RGBA(111, 195, 223)),
hcLight: foreground,
},
nls.localize(
'keybindingLabelBottomBorder',
'Keybinding label border bottom color. The keybinding label is used to represent a keyboard shortcut.',
),
);
/**
* Editor selection colors.
*/
export const editorSelectionBackground = registerColor(
'editor.selectionBackground',
{ light: '#ADD6FF', dark: '#264F78', hcDark: '#f3f518', hcLight: '#0F4A85' },
nls.localize('editorSelectionBackground', 'Color of the editor selection.'),
);
export const editorSelectionForeground = registerColor(
'editor.selectionForeground',
{ light: null, dark: null, hcDark: '#000000', hcLight: Color.white },
nls.localize('editorSelectionForeground', 'Color of the selected text for high contrast.'),
);
export const editorInactiveSelection = registerColor(
'editor.inactiveSelectionBackground',
{
light: transparent(editorSelectionBackground, 0.5),
dark: transparent(editorSelectionBackground, 0.5),
hcDark: transparent(editorSelectionBackground, 0.7),
hcLight: transparent(editorSelectionBackground, 0.5),
},
nls.localize(
'editorInactiveSelection',
'Color of the selection in an inactive editor. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const editorSelectionHighlight = registerColor(
'editor.selectionHighlightBackground',
{
light: lessProminent(editorSelectionBackground, editorBackground, 0.3, 0.6),
dark: lessProminent(editorSelectionBackground, editorBackground, 0.3, 0.6),
hcDark: null,
hcLight: null,
},
nls.localize(
'editorSelectionHighlight',
'Color for regions with the same content as the selection. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const editorSelectionHighlightBorder = registerColor(
'editor.selectionHighlightBorder',
{ light: null, dark: null, hcDark: activeContrastBorder, hcLight: activeContrastBorder },
nls.localize('editorSelectionHighlightBorder', 'Border color for regions with the same content as the selection.'),
);
/**
* Editor find match colors.
*/
export const editorFindMatch = registerColor(
'editor.findMatchBackground',
{ light: '#A8AC94', dark: '#515C6A', hcDark: null, hcLight: null },
nls.localize('editorFindMatch', 'Color of the current search match.'),
);
export const editorFindMatchHighlight = registerColor(
'editor.findMatchHighlightBackground',
{ light: '#EA5C0055', dark: '#EA5C0055', hcDark: null, hcLight: null },
nls.localize(
'findMatchHighlight',
'Color of the other search matches. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const editorFindRangeHighlight = registerColor(
'editor.findRangeHighlightBackground',
{ dark: '#3a3d4166', light: '#b4b4b44d', hcDark: null, hcLight: null },
nls.localize(
'findRangeHighlight',
'Color of the range limiting the search. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const editorFindMatchBorder = registerColor(
'editor.findMatchBorder',
{ light: null, dark: null, hcDark: activeContrastBorder, hcLight: activeContrastBorder },
nls.localize('editorFindMatchBorder', 'Border color of the current search match.'),
);
export const editorFindMatchHighlightBorder = registerColor(
'editor.findMatchHighlightBorder',
{ light: null, dark: null, hcDark: activeContrastBorder, hcLight: activeContrastBorder },
nls.localize('findMatchHighlightBorder', 'Border color of the other search matches.'),
);
export const editorFindRangeHighlightBorder = registerColor(
'editor.findRangeHighlightBorder',
{
dark: null,
light: null,
hcDark: transparent(activeContrastBorder, 0.4),
hcLight: transparent(activeContrastBorder, 0.4),
},
nls.localize(
'findRangeHighlightBorder',
'Border color of the range limiting the search. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
/**
* Search Editor query match colors.
*
* Distinct from normal editor find match to allow for better differentiation
*/
export const searchEditorFindMatch = registerColor(
'searchEditor.findMatchBackground',
{
light: transparent(editorFindMatchHighlight, 0.66),
dark: transparent(editorFindMatchHighlight, 0.66),
hcDark: editorFindMatchHighlight,
hcLight: editorFindMatchHighlight,
},
nls.localize('searchEditor.queryMatch', 'Color of the Search Editor query matches.'),
);
export const searchEditorFindMatchBorder = registerColor(
'searchEditor.findMatchBorder',
{
light: transparent(editorFindMatchHighlightBorder, 0.66),
dark: transparent(editorFindMatchHighlightBorder, 0.66),
hcDark: editorFindMatchHighlightBorder,
hcLight: editorFindMatchHighlightBorder,
},
nls.localize('searchEditor.editorFindMatchBorder', 'Border color of the Search Editor query matches.'),
);
/**
* Editor hover
*/
export const editorHoverHighlight = registerColor(
'editor.hoverHighlightBackground',
{ light: '#ADD6FF26', dark: '#264f7840', hcDark: '#ADD6FF26', hcLight: null },
nls.localize(
'hoverHighlight',
'Highlight below the word for which a hover is shown. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const editorHoverBackground = registerColor(
'editorHoverWidget.background',
{
light: editorWidgetBackground,
dark: editorWidgetBackground,
hcDark: editorWidgetBackground,
hcLight: editorWidgetBackground,
},
nls.localize('hoverBackground', 'Background color of the editor hover.'),
);
export const editorHoverForeground = registerColor(
'editorHoverWidget.foreground',
{
light: editorWidgetForeground,
dark: editorWidgetForeground,
hcDark: editorWidgetForeground,
hcLight: editorWidgetForeground,
},
nls.localize('hoverForeground', 'Foreground color of the editor hover.'),
);
export const editorHoverBorder = registerColor(
'editorHoverWidget.border',
{ light: editorWidgetBorder, dark: editorWidgetBorder, hcDark: editorWidgetBorder, hcLight: editorWidgetBorder },
nls.localize('hoverBorder', 'Border color of the editor hover.'),
);
export const editorHoverStatusBarBackground = registerColor(
'editorHoverWidget.statusBarBackground',
{
dark: lighten(editorHoverBackground, 0.2),
light: darken(editorHoverBackground, 0.05),
hcDark: editorWidgetBackground,
hcLight: editorWidgetBackground,
},
nls.localize('statusBarBackground', 'Background color of the editor hover status bar.'),
);
/**
* Editor link colors
*/
export const editorActiveLinkForeground = registerColor(
'editorLink.activeForeground',
{ dark: '#4E94CE', light: Color.blue, hcDark: Color.cyan, hcLight: '#292929' },
nls.localize('activeLinkForeground', 'Color of active links.'),
);
/**
* Inline hints
*/
export const editorInlayHintForeground = registerColor(
'editorInlayHint.foreground',
{ dark: badgeForeground, light: badgeForeground, hcDark: Color.black, hcLight: badgeForeground },
nls.localize('editorInlayHintForeground', 'Foreground color of inline hints'),
);
export const editorInlayHintBackground = registerColor(
'editorInlayHint.background',
{
dark: transparent(badgeBackground, 0.8),
light: transparent(badgeBackground, 0.6),
hcDark: '#f38518',
hcLight: badgeBackground,
},
nls.localize('editorInlayHintBackground', 'Background color of inline hints'),
);
export const editorInlayHintTypeForeground = registerColor(
'editorInlayHint.typeForeground',
{
dark: editorInlayHintForeground,
light: editorInlayHintForeground,
hcDark: editorInlayHintForeground,
hcLight: editorInlayHintForeground,
},
nls.localize('editorInlayHintForegroundTypes', 'Foreground color of inline hints for types'),
);
export const editorInlayHintTypeBackground = registerColor(
'editorInlayHint.typeBackground',
{
dark: editorInlayHintBackground,
light: editorInlayHintBackground,
hcDark: editorInlayHintBackground,
hcLight: editorInlayHintBackground,
},
nls.localize('editorInlayHintBackgroundTypes', 'Background color of inline hints for types'),
);
export const editorInlayHintParameterForeground = registerColor(
'editorInlayHint.parameterForeground',
{
dark: editorInlayHintForeground,
light: editorInlayHintForeground,
hcDark: editorInlayHintForeground,
hcLight: editorInlayHintForeground,
},
nls.localize('editorInlayHintForegroundParameter', 'Foreground color of inline hints for parameters'),
);
export const editorInlayHintParameterBackground = registerColor(
'editorInlayHint.parameterBackground',
{
dark: editorInlayHintBackground,
light: editorInlayHintBackground,
hcDark: editorInlayHintBackground,
hcLight: editorInlayHintBackground,
},
nls.localize('editorInlayHintBackgroundParameter', 'Background color of inline hints for parameters'),
);
/**
* Editor lighbulb icon colors
*/
export const editorLightBulbForeground = registerColor(
'editorLightBulb.foreground',
{ dark: '#FFCC00', light: '#DDB100', hcDark: '#FFCC00', hcLight: '#007ACC' },
nls.localize('editorLightBulbForeground', 'The color used for the lightbulb actions icon.'),
);
export const editorLightBulbAutoFixForeground = registerColor(
'editorLightBulbAutoFix.foreground',
{ dark: '#75BEFF', light: '#007ACC', hcDark: '#75BEFF', hcLight: '#007ACC' },
nls.localize('editorLightBulbAutoFixForeground', 'The color used for the lightbulb auto fix actions icon.'),
);
/**
* Diff Editor Colors
*/
export const defaultInsertColor = new Color(new RGBA(155, 185, 85, 0.2));
export const defaultRemoveColor = new Color(new RGBA(255, 0, 0, 0.2));
export const diffInserted = registerColor(
'diffEditor.insertedTextBackground',
{ dark: '#9ccc2c33', light: '#9ccc2c40', hcDark: null, hcLight: null },
nls.localize(
'diffEditorInserted',
'Background color for text that got inserted. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const diffRemoved = registerColor(
'diffEditor.removedTextBackground',
{ dark: '#ff000033', light: '#ff000033', hcDark: null, hcLight: null },
nls.localize(
'diffEditorRemoved',
'Background color for text that got removed. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const diffInsertedLine = registerColor(
'diffEditor.insertedLineBackground',
{ dark: defaultInsertColor, light: defaultInsertColor, hcDark: null, hcLight: null },
nls.localize(
'diffEditorInsertedLines',
'Background color for lines that got inserted. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const diffRemovedLine = registerColor(
'diffEditor.removedLineBackground',
{ dark: defaultRemoveColor, light: defaultRemoveColor, hcDark: null, hcLight: null },
nls.localize(
'diffEditorRemovedLines',
'Background color for lines that got removed. The color must not be opaque so as not to hide underlying decorations.',
),
true,
);
export const diffInsertedLineGutter = registerColor(
'diffEditorGutter.insertedLineBackground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize('diffEditorInsertedLineGutter', 'Background color for the margin where lines got inserted.'),
);
export const diffRemovedLineGutter = registerColor(
'diffEditorGutter.removedLineBackground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize('diffEditorRemovedLineGutter', 'Background color for the margin where lines got removed.'),
);
export const diffOverviewRulerInserted = registerColor(
'diffEditorOverview.insertedForeground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize('diffEditorOverviewInserted', 'Diff overview ruler foreground for inserted content.'),
);
export const diffOverviewRulerRemoved = registerColor(
'diffEditorOverview.removedForeground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize('diffEditorOverviewRemoved', 'Diff overview ruler foreground for removed content.'),
);
export const diffInsertedOutline = registerColor(
'diffEditor.insertedTextBorder',
{ dark: null, light: null, hcDark: '#33ff2eff', hcLight: '#374E06' },
nls.localize('diffEditorInsertedOutline', 'Outline color for the text that got inserted.'),
);
export const diffRemovedOutline = registerColor(
'diffEditor.removedTextBorder',
{ dark: null, light: null, hcDark: '#FF008F', hcLight: '#AD0707' },
nls.localize('diffEditorRemovedOutline', 'Outline color for text that got removed.'),
);
export const diffBorder = registerColor(
'diffEditor.border',
{ dark: null, light: null, hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize('diffEditorBorder', 'Border color between the two text editors.'),
);
export const diffDiagonalFill = registerColor(
'diffEditor.diagonalFill',
{ dark: '#cccccc33', light: '#22222233', hcDark: null, hcLight: null },
nls.localize(
'diffDiagonalFill',
"Color of the diff editor's diagonal fill. The diagonal fill is used in side-by-side diff views.",
),
);
/**
* List and tree colors
*/
export const listFocusBackground = registerColor(
'list.focusBackground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'listFocusBackground',
'List/Tree background color for the focused item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listFocusForeground = registerColor(
'list.focusForeground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'listFocusForeground',
'List/Tree foreground color for the focused item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listFocusOutline = registerColor(
'list.focusOutline',
{ dark: focusBorder, light: focusBorder, hcDark: activeContrastBorder, hcLight: activeContrastBorder },
nls.localize(
'listFocusOutline',
'List/Tree outline color for the focused item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listFocusAndSelectionOutline = registerColor(
'list.focusAndSelectionOutline',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'listFocusAndSelectionOutline',
'List/Tree outline color for the focused item when the list/tree is active and selected. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listActiveSelectionBackground = registerColor(
'list.activeSelectionBackground',
{ dark: '#04395E', light: '#0060C0', hcDark: null, hcLight: Color.fromHex('#0F4A85').transparent(0.1) },
nls.localize(
'listActiveSelectionBackground',
'List/Tree background color for the selected item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listActiveSelectionForeground = registerColor(
'list.activeSelectionForeground',
{ dark: Color.white, light: Color.white, hcDark: null, hcLight: null },
nls.localize(
'listActiveSelectionForeground',
'List/Tree foreground color for the selected item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listActiveSelectionIconForeground = registerColor(
'list.activeSelectionIconForeground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'listActiveSelectionIconForeground',
'List/Tree icon foreground color for the selected item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listInactiveSelectionBackground = registerColor(
'list.inactiveSelectionBackground',
{ dark: '#37373D', light: '#E4E6F1', hcDark: null, hcLight: Color.fromHex('#0F4A85').transparent(0.1) },
nls.localize(
'listInactiveSelectionBackground',
'List/Tree background color for the selected item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listInactiveSelectionForeground = registerColor(
'list.inactiveSelectionForeground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'listInactiveSelectionForeground',
'List/Tree foreground color for the selected item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listInactiveSelectionIconForeground = registerColor(
'list.inactiveSelectionIconForeground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'listInactiveSelectionIconForeground',
'List/Tree icon foreground color for the selected item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listInactiveFocusBackground = registerColor(
'list.inactiveFocusBackground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'listInactiveFocusBackground',
'List/Tree background color for the focused item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listInactiveFocusOutline = registerColor(
'list.inactiveFocusOutline',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize(
'listInactiveFocusOutline',
'List/Tree outline color for the focused item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not.',
),
);
export const listHoverBackground = registerColor(
'list.hoverBackground',
{ dark: '#2A2D2E', light: '#F0F0F0', hcDark: null, hcLight: Color.fromHex('#0F4A85').transparent(0.1) },
nls.localize('listHoverBackground', 'List/Tree background when hovering over items using the mouse.'),
);
export const listHoverForeground = registerColor(
'list.hoverForeground',
{ dark: null, light: null, hcDark: null, hcLight: null },
nls.localize('listHoverForeground', 'List/Tree foreground when hovering over items using the mouse.'),
);
export const listDropBackground = registerColor(
'list.dropBackground',
{ dark: '#062F4A', light: '#D6EBFF', hcDark: null, hcLight: null },
nls.localize('listDropBackground', 'List/Tree drag and drop background when moving items around using the mouse.'),
);
export const listHighlightForeground = registerColor(
'list.highlightForeground',
{ dark: '#2AAAFF', light: '#0066BF', hcDark: focusBorder, hcLight: focusBorder },
nls.localize('highlight', 'List/Tree foreground color of the match highlights when searching inside the list/tree.'),
);
export const listFocusHighlightForeground = registerColor(
'list.focusHighlightForeground',
{
dark: listHighlightForeground,
light: ifDefinedThenElse(listActiveSelectionBackground, listHighlightForeground, '#BBE7FF'),
hcDark: listHighlightForeground,
hcLight: listHighlightForeground,
},
nls.localize(
'listFocusHighlightForeground',
'List/Tree foreground color of the match highlights on actively focused items when searching inside the list/tree.',
),
);
export const listInvalidItemForeground = registerColor(
'list.invalidItemForeground',
{ dark: '#B89500', light: '#B89500', hcDark: '#B89500', hcLight: '#B5200D' },
nls.localize(
'invalidItemForeground',
'List/Tree foreground color for invalid items, for example an unresolved root in explorer.',
),
);
export const listErrorForeground = registerColor(
'list.errorForeground',
{ dark: '#F88070', light: '#B01011', hcDark: null, hcLight: null },
nls.localize('listErrorForeground', 'Foreground color of list items containing errors.'),
);
export const listWarningForeground = registerColor(
'list.warningForeground',
{ dark: '#CCA700', light: '#855F00', hcDark: null, hcLight: null },
nls.localize('listWarningForeground', 'Foreground color of list items containing warnings.'),
);
export const listFilterWidgetBackground = registerColor(
'listFilterWidget.background',
{
light: darken(editorWidgetBackground, 0),
dark: lighten(editorWidgetBackground, 0),
hcDark: editorWidgetBackground,
hcLight: editorWidgetBackground,
},
nls.localize('listFilterWidgetBackground', 'Background color of the type filter widget in lists and trees.'),
);
export const listFilterWidgetOutline = registerColor(
'listFilterWidget.outline',
{ dark: Color.transparent, light: Color.transparent, hcDark: '#f38518', hcLight: '#007ACC' },
nls.localize('listFilterWidgetOutline', 'Outline color of the type filter widget in lists and trees.'),
);
export const listFilterWidgetNoMatchesOutline = registerColor(
'listFilterWidget.noMatchesOutline',
{ dark: '#BE1100', light: '#BE1100', hcDark: contrastBorder, hcLight: contrastBorder },
nls.localize(
'listFilterWidgetNoMatchesOutline',
'Outline color of the type filter widget in lists and trees, when there are no matches.',
),
);
export const listFilterWidgetShadow = registerColor(
'listFilterWidget.shadow',
{ dark: widgetShadow, light: widgetShadow, hcDark: widgetShadow, hcLight: widgetShadow },
nls.localize('listFilterWidgetShadow', 'Shadown color of the type filter widget in lists and trees.'),
);
export const listFilterMatchHighlight = registerColor(
'list.filterMatchBackground',
{ dark: editorFindMatchHighlight, light: editorFindMatchHighlight, hcDark: null, hcLight: null },
nls.localize('listFilterMatchHighlight', 'Background color of the filtered match.'),
);
export const listFilterMatchHighlightBorder = registerColor(
'list.filterMatchBorder',
{
dark: editorFindMatchHighlightBorder,
light: editorFindMatchHighlightBorder,
hcDark: contrastBorder,
hcLight: activeContrastBorder,
},
nls.localize('listFilterMatchHighlightBorder', 'Border color of the filtered match.'),
);
export const treeIndentGuidesStroke = registerColor(
'tree.indentGuidesStroke',
{ dark: '#585858', light: '#a9a9a9', hcDark: '#a9a9a9', hcLight: '#a5a5a5' },
nls.localize('treeIndentGuidesStroke', 'Tree stroke color for the indentation guides.'),
);
export const tableColumnsBorder = registerColor(
'tree.tableColumnsBorder',
{ dark: '#CCCCCC20', light: '#61616120', hcDark: null, hcLight: null },
nls.localize('tableColumnsBorder', 'Table border color between columns.'),
);
export const tableOddRowsBackgroundColor = registerColor(
'tree.tableOddRowsBackground',
{ dark: transparent(foreground, 0.04), light: tr