159 lines
3.7 KiB
TypeScript
159 lines
3.7 KiB
TypeScript
import { ColorToken, FontWeightToken, NumberToken } from "../tokens";
|
|
import { withOpacity } from "../utils/color";
|
|
|
|
export interface SyntaxHighlightStyle {
|
|
color: ColorToken;
|
|
weight?: FontWeightToken;
|
|
underline?: boolean,
|
|
italic?: boolean,
|
|
}
|
|
|
|
export interface Player {
|
|
baseColor: ColorToken;
|
|
cursorColor: ColorToken;
|
|
selectionColor: ColorToken;
|
|
borderColor: ColorToken;
|
|
}
|
|
export function buildPlayer(
|
|
color: ColorToken,
|
|
cursorOpacity?: number,
|
|
selectionOpacity?: number,
|
|
borderOpacity?: number
|
|
) {
|
|
return {
|
|
baseColor: color,
|
|
cursorColor: withOpacity(color, cursorOpacity || 1.0),
|
|
selectionColor: withOpacity(color, selectionOpacity || 0.24),
|
|
borderColor: withOpacity(color, borderOpacity || 0.8),
|
|
}
|
|
}
|
|
|
|
export interface BackgroundColorSet {
|
|
base: ColorToken;
|
|
hovered: ColorToken;
|
|
active: ColorToken;
|
|
focused: ColorToken;
|
|
}
|
|
|
|
export interface Syntax {
|
|
primary: SyntaxHighlightStyle;
|
|
comment: SyntaxHighlightStyle;
|
|
punctuation: SyntaxHighlightStyle;
|
|
constant: SyntaxHighlightStyle;
|
|
keyword: SyntaxHighlightStyle;
|
|
function: SyntaxHighlightStyle;
|
|
type: SyntaxHighlightStyle;
|
|
variant: SyntaxHighlightStyle;
|
|
property: SyntaxHighlightStyle;
|
|
enum: SyntaxHighlightStyle;
|
|
operator: SyntaxHighlightStyle;
|
|
string: SyntaxHighlightStyle;
|
|
number: SyntaxHighlightStyle;
|
|
boolean: SyntaxHighlightStyle;
|
|
predictive: SyntaxHighlightStyle;
|
|
title: SyntaxHighlightStyle;
|
|
emphasis: SyntaxHighlightStyle;
|
|
linkUri: SyntaxHighlightStyle;
|
|
linkText: SyntaxHighlightStyle;
|
|
|
|
[key: string]: SyntaxHighlightStyle;
|
|
};
|
|
|
|
export default interface Theme {
|
|
name: string;
|
|
backgroundColor: {
|
|
// Basically just Title Bar
|
|
// Lowest background level
|
|
100: BackgroundColorSet;
|
|
// Tab bars, panels, popovers
|
|
// Mid-ground
|
|
300: BackgroundColorSet;
|
|
// The editor
|
|
// Foreground
|
|
500: BackgroundColorSet;
|
|
// Hacks for elements on top of the midground
|
|
// Buttons in a panel, tab bar, or panel
|
|
on300: BackgroundColorSet;
|
|
// Hacks for elements on top of the editor
|
|
on500: BackgroundColorSet;
|
|
ok: BackgroundColorSet;
|
|
error: BackgroundColorSet;
|
|
warning: BackgroundColorSet;
|
|
info: BackgroundColorSet;
|
|
};
|
|
borderColor: {
|
|
primary: ColorToken;
|
|
secondary: ColorToken;
|
|
muted: ColorToken;
|
|
focused: ColorToken;
|
|
active: ColorToken;
|
|
ok: ColorToken;
|
|
error: ColorToken;
|
|
warning: ColorToken;
|
|
info: ColorToken;
|
|
};
|
|
textColor: {
|
|
primary: ColorToken;
|
|
secondary: ColorToken;
|
|
muted: ColorToken;
|
|
placeholder: ColorToken;
|
|
active: ColorToken;
|
|
feature: ColorToken;
|
|
ok: ColorToken;
|
|
error: ColorToken;
|
|
warning: ColorToken;
|
|
info: ColorToken;
|
|
};
|
|
iconColor: {
|
|
primary: ColorToken;
|
|
secondary: ColorToken;
|
|
muted: ColorToken;
|
|
placeholder: ColorToken;
|
|
active: ColorToken;
|
|
feature: ColorToken;
|
|
ok: ColorToken;
|
|
error: ColorToken;
|
|
warning: ColorToken;
|
|
info: ColorToken;
|
|
};
|
|
editor: {
|
|
background: ColorToken;
|
|
indent_guide: ColorToken;
|
|
indent_guide_active: ColorToken;
|
|
line: {
|
|
active: ColorToken;
|
|
highlighted: ColorToken;
|
|
inserted: ColorToken;
|
|
deleted: ColorToken;
|
|
modified: ColorToken;
|
|
};
|
|
highlight: {
|
|
selection: ColorToken;
|
|
occurrence: ColorToken;
|
|
activeOccurrence: ColorToken;
|
|
matchingBracket: ColorToken;
|
|
match: ColorToken;
|
|
activeMatch: ColorToken;
|
|
related: ColorToken;
|
|
};
|
|
gutter: {
|
|
primary: ColorToken;
|
|
active: ColorToken;
|
|
};
|
|
};
|
|
|
|
syntax: Syntax,
|
|
|
|
player: {
|
|
1: Player;
|
|
2: Player;
|
|
3: Player;
|
|
4: Player;
|
|
5: Player;
|
|
6: Player;
|
|
7: Player;
|
|
8: Player;
|
|
};
|
|
shadowAlpha: NumberToken;
|
|
}
|