Merge branch 'main' into lsp-log-messages

This commit is contained in:
Max Brunsfeld
2023-06-08 08:49:08 -07:00
67 changed files with 1002 additions and 730 deletions
+6 -4
View File
@@ -30,17 +30,19 @@ function generateLicenseFile(themes: ThemeConfig[]) {
checkLicenses(themes)
for (const theme of themes) {
const licenseText = fs.readFileSync(theme.licenseFile).toString()
writeLicense(theme.name, theme.licenseUrl, licenseText)
writeLicense(theme.name, licenseText, theme.licenseUrl)
}
}
function writeLicense(
themeName: string,
licenseUrl: string,
licenseText: String
licenseText: string,
licenseUrl?: string
) {
process.stdout.write(
`## [${themeName}](${licenseUrl})\n\n${licenseText}\n********************************************************************************\n\n`
licenseUrl
? `## [${themeName}](${licenseUrl})\n\n${licenseText}\n********************************************************************************\n\n`
: `## ${themeName}\n\n${licenseText}\n********************************************************************************\n\n`
)
}
+4 -2
View File
@@ -2,7 +2,7 @@ import * as fs from "fs"
import { tmpdir } from "os"
import * as path from "path"
import app from "./styleTree/app"
import { ColorScheme, createColorScheme } from "./themes/common/colorScheme"
import { ColorScheme, createColorScheme } from "./theme/colorScheme"
import snakeCase from "./utils/snakeCase"
import { themes } from "./themes"
@@ -35,7 +35,9 @@ function writeThemes(colorSchemes: ColorScheme[], outputDirectory: string) {
}
}
const colorSchemes: ColorScheme[] = themes.map((theme) => createColorScheme(theme))
const colorSchemes: ColorScheme[] = themes.map((theme) =>
createColorScheme(theme)
)
// Write new themes to theme directory
writeThemes(colorSchemes, `${assetsDirectory}/themes`)
+39
View File
@@ -0,0 +1,39 @@
import * as fs from "fs"
import * as path from "path"
import { ColorScheme, createColorScheme } from "./common"
import { themes } from "./themes"
import { slugify } from "./utils/slugify"
import { colorSchemeTokens } from "./theme/tokens/colorScheme"
const TOKENS_DIRECTORY = path.join(__dirname, "..", "target", "tokens")
function clearTokens(tokensDirectory: string) {
if (!fs.existsSync(tokensDirectory)) {
fs.mkdirSync(tokensDirectory, { recursive: true })
} else {
for (const file of fs.readdirSync(tokensDirectory)) {
if (file.endsWith(".json")) {
fs.unlinkSync(path.join(tokensDirectory, file))
}
}
}
}
function writeTokens(colorSchemes: ColorScheme[], tokensDirectory: string) {
clearTokens(tokensDirectory)
for (const colorScheme of colorSchemes) {
const fileName = slugify(colorScheme.name)
const tokens = colorSchemeTokens(colorScheme)
const tokensJSON = JSON.stringify(tokens, null, 2)
const outPath = path.join(tokensDirectory, `${fileName}.json`)
fs.writeFileSync(outPath, tokensJSON)
console.log(`- ${outPath} created`)
}
}
const colorSchemes: ColorScheme[] = themes.map((theme) =>
createColorScheme(theme)
)
writeTokens(colorSchemes, TOKENS_DIRECTORY)
+2 -2
View File
@@ -1,5 +1,5 @@
import chroma from "chroma-js"
export * from "./themes/common"
export * from "./theme"
export { chroma }
export const fontFamilies = {
@@ -27,7 +27,7 @@ export type FontWeight =
| "bold"
| "extra_bold"
| "black"
export const fontWeights: { [key: string]: FontWeight } = {
thin: "thin",
extra_light: "extra_light",
+1 -1
View File
@@ -19,7 +19,7 @@ import terminal from "./terminal"
import contactList from "./contactList"
import lspLogMenu from "./lspLogMenu"
import incomingCallNotification from "./incomingCallNotification"
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import feedback from "./feedback"
import welcome from "./welcome"
import copilot from "./copilot"
+78 -78
View File
@@ -1,85 +1,85 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { text, border, background, foreground } from "./components"
import editor from "./editor"
export default function assistant(colorScheme: ColorScheme) {
const layer = colorScheme.highest;
const layer = colorScheme.highest
return {
container: {
background: editor(colorScheme).background,
padding: { left: 12 }
},
header: {
border: border(layer, "default", { bottom: true, top: true }),
margin: { bottom: 6, top: 6 },
background: editor(colorScheme).background
},
userSender: {
...text(layer, "sans", "default", { size: "sm", weight: "bold" }),
},
assistantSender: {
...text(layer, "sans", "accent", { size: "sm", weight: "bold" }),
},
systemSender: {
...text(layer, "sans", "variant", { size: "sm", weight: "bold" }),
},
sentAt: {
margin: { top: 2, left: 8 },
...text(layer, "sans", "default", { size: "2xs" }),
},
modelInfoContainer: {
margin: { right: 16, top: 4 },
},
model: {
background: background(layer, "on"),
border: border(layer, "on", { overlay: true }),
padding: 4,
cornerRadius: 4,
...text(layer, "sans", "default", { size: "xs" }),
hover: {
background: background(layer, "on", "hovered"),
}
},
remainingTokens: {
background: background(layer, "on"),
border: border(layer, "on", { overlay: true }),
padding: 4,
margin: { left: 4 },
cornerRadius: 4,
...text(layer, "sans", "positive", { size: "xs" }),
},
noRemainingTokens: {
background: background(layer, "on"),
border: border(layer, "on", { overlay: true }),
padding: 4,
margin: { left: 4 },
cornerRadius: 4,
...text(layer, "sans", "negative", { size: "xs" }),
},
errorIcon: {
margin: { left: 8 },
color: foreground(layer, "negative"),
width: 12,
},
apiKeyEditor: {
background: background(layer, "on"),
cornerRadius: 6,
text: text(layer, "mono", "on"),
placeholderText: text(layer, "mono", "on", "disabled", {
size: "xs",
}),
selection: colorScheme.players[0],
border: border(layer, "on"),
padding: {
bottom: 4,
left: 8,
right: 8,
top: 4,
},
},
apiKeyPrompt: {
padding: 10,
...text(layer, "sans", "default", { size: "xs" }),
}
container: {
background: editor(colorScheme).background,
padding: { left: 12 },
},
header: {
border: border(layer, "default", { bottom: true, top: true }),
margin: { bottom: 6, top: 6 },
background: editor(colorScheme).background,
},
userSender: {
...text(layer, "sans", "default", { size: "sm", weight: "bold" }),
},
assistantSender: {
...text(layer, "sans", "accent", { size: "sm", weight: "bold" }),
},
systemSender: {
...text(layer, "sans", "variant", { size: "sm", weight: "bold" }),
},
sentAt: {
margin: { top: 2, left: 8 },
...text(layer, "sans", "default", { size: "2xs" }),
},
modelInfoContainer: {
margin: { right: 16, top: 4 },
},
model: {
background: background(layer, "on"),
border: border(layer, "on", { overlay: true }),
padding: 4,
cornerRadius: 4,
...text(layer, "sans", "default", { size: "xs" }),
hover: {
background: background(layer, "on", "hovered"),
},
},
remainingTokens: {
background: background(layer, "on"),
border: border(layer, "on", { overlay: true }),
padding: 4,
margin: { left: 4 },
cornerRadius: 4,
...text(layer, "sans", "positive", { size: "xs" }),
},
noRemainingTokens: {
background: background(layer, "on"),
border: border(layer, "on", { overlay: true }),
padding: 4,
margin: { left: 4 },
cornerRadius: 4,
...text(layer, "sans", "negative", { size: "xs" }),
},
errorIcon: {
margin: { left: 8 },
color: foreground(layer, "negative"),
width: 12,
},
apiKeyEditor: {
background: background(layer, "on"),
cornerRadius: 6,
text: text(layer, "mono", "on"),
placeholderText: text(layer, "mono", "on", "disabled", {
size: "xs",
}),
selection: colorScheme.players[0],
border: border(layer, "on"),
padding: {
bottom: 4,
left: 8,
right: 8,
top: 4,
},
},
apiKeyPrompt: {
padding: 10,
...text(layer, "sans", "default", { size: "xs" }),
},
}
}
+2 -2
View File
@@ -1,5 +1,5 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { withOpacity } from "../utils/color"
import { ColorScheme } from "../theme/colorScheme"
import { withOpacity } from "../theme/color"
import { text, background } from "./components"
export default function commandPalette(colorScheme: ColorScheme) {
+1 -1
View File
@@ -1,5 +1,5 @@
import { fontFamilies, fontSizes, FontWeight } from "../common"
import { Layer, Styles, StyleSets, Style } from "../themes/common/colorScheme"
import { Layer, Styles, StyleSets, Style } from "../theme/colorScheme"
function isStyleSet(key: any): key is StyleSets {
return [
+1 -1
View File
@@ -1,5 +1,5 @@
import picker from "./picker"
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, foreground, text } from "./components"
export default function contactFinder(colorScheme: ColorScheme): any {
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, borderColor, foreground, text } from "./components"
export default function contactsPanel(colorScheme: ColorScheme) {
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, foreground, text } from "./components"
const avatarSize = 12
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, text } from "./components"
export default function contactsPopover(colorScheme: ColorScheme) {
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, borderColor, text } from "./components"
export default function contextMenu(colorScheme: ColorScheme) {
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, foreground, svg, text } from "./components"
export default function copilot(colorScheme: ColorScheme) {
+9 -6
View File
@@ -1,9 +1,9 @@
import { withOpacity } from "../utils/color"
import { ColorScheme, Layer, StyleSets } from "../themes/common/colorScheme"
import { withOpacity } from "../theme/color"
import { ColorScheme, Layer, StyleSets } from "../theme/colorScheme"
import { background, border, borderColor, foreground, text } from "./components"
import hoverPopover from "./hoverPopover"
import { buildSyntax } from "../themes/common/syntax"
import { buildSyntax } from "../theme/syntax"
export default function editor(colorScheme: ColorScheme) {
const { isLight } = colorScheme
@@ -186,7 +186,10 @@ export default function editor(colorScheme: ColorScheme) {
},
},
source: {
text: text(colorScheme.middle, "sans", { size: "sm", weight: "bold", }),
text: text(colorScheme.middle, "sans", {
size: "sm",
weight: "bold",
}),
},
message: {
highlightText: text(colorScheme.middle, "sans", {
@@ -250,7 +253,7 @@ export default function editor(colorScheme: ColorScheme) {
right: true,
left: true,
bottom: false,
}
},
},
git: {
deleted: isLight
@@ -262,7 +265,7 @@ export default function editor(colorScheme: ColorScheme) {
inserted: isLight
? withOpacity(colorScheme.ramps.green(0.5).hex(), 0.8)
: withOpacity(colorScheme.ramps.green(0.4).hex(), 0.8),
}
},
},
compositionMark: {
underline: {
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, text } from "./components"
export default function feedback(colorScheme: ColorScheme) {
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, foreground, text } from "./components"
export default function HoverPopover(colorScheme: ColorScheme) {
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, text } from "./components"
export default function incomingCallNotification(
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, text } from "./components"
export default function contactsPanel(colorScheme: ColorScheme) {
+2 -2
View File
@@ -1,5 +1,5 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { withOpacity } from "../utils/color"
import { ColorScheme } from "../theme/colorScheme"
import { withOpacity } from "../theme/color"
import { background, border, text } from "./components"
export default function picker(colorScheme: ColorScheme): any {
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, text } from "./components"
export default function projectDiagnostics(colorScheme: ColorScheme) {
+7 -7
View File
@@ -1,5 +1,5 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { withOpacity } from "../utils/color"
import { ColorScheme } from "../theme/colorScheme"
import { withOpacity } from "../theme/color"
import { background, border, foreground, text } from "./components"
export default function projectPanel(colorScheme: ColorScheme) {
@@ -24,8 +24,8 @@ export default function projectPanel(colorScheme: ColorScheme) {
: colorScheme.ramps.green(0.5).hex(),
conflict: isLight
? colorScheme.ramps.red(0.6).hex()
: colorScheme.ramps.red(0.5).hex()
}
: colorScheme.ramps.red(0.5).hex(),
},
}
let entry = {
@@ -44,7 +44,7 @@ export default function projectPanel(colorScheme: ColorScheme) {
background: background(layer, "active"),
text: text(layer, "mono", "active", { size: "sm" }),
},
status
status,
}
return {
@@ -79,7 +79,7 @@ export default function projectPanel(colorScheme: ColorScheme) {
text: text(layer, "mono", "on", { size: "sm" }),
background: withOpacity(background(layer, "on"), 0.9),
border: border(layer),
status
status,
},
ignoredEntry: {
...entry,
@@ -88,7 +88,7 @@ export default function projectPanel(colorScheme: ColorScheme) {
active: {
...entry.active,
iconColor: foreground(layer, "variant"),
}
},
},
cutEntry: {
...entry,
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, text } from "./components"
export default function projectSharedNotification(
+3 -3
View File
@@ -1,5 +1,5 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { withOpacity } from "../utils/color"
import { ColorScheme } from "../theme/colorScheme"
import { withOpacity } from "../theme/color"
import { background, border, foreground, text } from "./components"
export default function search(colorScheme: ColorScheme) {
@@ -30,7 +30,7 @@ export default function search(colorScheme: ColorScheme) {
...editor,
minWidth: 100,
maxWidth: 250,
};
}
return {
// TODO: Add an activeMatchBackground on the rust side to differentiate between active and inactive
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background } from "./components"
export default function sharedScreen(colorScheme: ColorScheme) {
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, foreground, text } from "./components"
const headerPadding = 8
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, foreground, text } from "./components"
export default function statusBar(colorScheme: ColorScheme) {
+3 -3
View File
@@ -1,5 +1,5 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { withOpacity } from "../utils/color"
import { ColorScheme } from "../theme/colorScheme"
import { withOpacity } from "../theme/color"
import { text, border, background, foreground } from "./components"
export default function tabBar(colorScheme: ColorScheme) {
@@ -96,7 +96,7 @@ export default function tabBar(colorScheme: ColorScheme) {
},
active: {
color: foreground(layer, "accent"),
}
},
},
paneButtonContainer: {
background: tab.background,
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
export default function terminal(colorScheme: ColorScheme) {
/**
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { background, border, text } from "./components"
export default function tooltip(colorScheme: ColorScheme) {
+1 -1
View File
@@ -1,4 +1,4 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { ColorScheme } from "../theme/colorScheme"
import { foreground, text } from "./components"
const headerPadding = 8
+2 -2
View File
@@ -1,5 +1,5 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { withOpacity } from "../utils/color"
import { ColorScheme } from "../theme/colorScheme"
import { withOpacity } from "../theme/color"
import {
border,
background,
+4 -4
View File
@@ -1,5 +1,5 @@
import { ColorScheme } from "../themes/common/colorScheme"
import { withOpacity } from "../utils/color"
import { ColorScheme } from "../theme/colorScheme"
import { withOpacity } from "../theme/color"
import {
background,
border,
@@ -123,7 +123,7 @@ export default function workspace(colorScheme: ColorScheme) {
cursor: "Arrow",
background: isLight
? withOpacity(background(colorScheme.lowest), 0.8)
: withOpacity(background(colorScheme.highest), 0.6)
: withOpacity(background(colorScheme.highest), 0.6),
},
zoomedPaneForeground: {
margin: 16,
@@ -143,7 +143,7 @@ export default function workspace(colorScheme: ColorScheme) {
},
right: {
border: border(layer, { left: true }),
}
},
},
paneDivider: {
color: borderColor(layer),
@@ -5,7 +5,7 @@ import {
ThemeConfig,
ThemeAppearance,
ThemeConfigInputColors,
} from "../../themeConfig"
} from "./themeConfig"
import { getRamps } from "./ramps"
export interface ColorScheme {
@@ -1,4 +1,4 @@
export * from "./colorScheme"
export * from "./ramps"
export * from "./syntax"
export * from "../../themeConfig"
export * from "./themeConfig"
@@ -3,7 +3,7 @@ import { RampSet } from "./colorScheme"
import {
ThemeConfigInputColors,
ThemeConfigInputColorsKeys,
} from "../../themeConfig"
} from "./themeConfig"
export function colorRamp(color: Color): Scale {
let endColor = color.desaturate(1).brighten(5)
@@ -1,5 +1,5 @@
import deepmerge from "deepmerge"
import { FontWeight, fontWeights } from "../../common"
import { FontWeight, fontWeights } from "../common"
import { ColorScheme } from "./colorScheme"
import chroma from "chroma-js"
@@ -1,5 +1,5 @@
import { Scale, Color } from "chroma-js"
import { Syntax } from "./themes/common/syntax"
import { Syntax } from "./syntax"
interface ThemeMeta {
/** The name of the theme */
@@ -23,6 +23,11 @@ interface ThemeMeta {
themeUrl?: string
}
export type ThemeFamilyMeta = Pick<
ThemeMeta,
"name" | "author" | "licenseType" | "licenseUrl"
>
export interface ThemeConfigInputColors {
neutral: Scale<Color>
red: Scale<Color>
+12
View File
@@ -0,0 +1,12 @@
import { ColorScheme } from "../colorScheme"
import { PlayerTokens, players } from "./players"
interface ColorSchemeTokens {
players: PlayerTokens
}
export function colorSchemeTokens(colorScheme: ColorScheme): ColorSchemeTokens {
return {
players: players(colorScheme),
}
}
+28
View File
@@ -0,0 +1,28 @@
import { SingleColorToken } from "@tokens-studio/types"
import { ColorScheme, Players } from "../../common"
import { colorToken } from "./token"
export type PlayerToken = Record<"selection" | "cursor", SingleColorToken>
export type PlayerTokens = Record<keyof Players, PlayerToken>
function buildPlayerToken(colorScheme: ColorScheme, index: number): PlayerToken {
const playerNumber = index.toString() as keyof Players
return {
selection: colorToken(`player${index}Selection`, colorScheme.players[playerNumber].selection),
cursor: colorToken(`player${index}Cursor`, colorScheme.players[playerNumber].cursor),
}
}
export const players = (colorScheme: ColorScheme): PlayerTokens => ({
"0": buildPlayerToken(colorScheme, 0),
"1": buildPlayerToken(colorScheme, 1),
"2": buildPlayerToken(colorScheme, 2),
"3": buildPlayerToken(colorScheme, 3),
"4": buildPlayerToken(colorScheme, 4),
"5": buildPlayerToken(colorScheme, 5),
"6": buildPlayerToken(colorScheme, 6),
"7": buildPlayerToken(colorScheme, 7)
})
+14
View File
@@ -0,0 +1,14 @@
import { SingleColorToken, TokenTypes } from "@tokens-studio/types"
export function colorToken(name: string, value: string, description?: string): SingleColorToken {
const token: SingleColorToken = {
name,
type: TokenTypes.COLOR,
value,
description,
}
if (!token.value || token.value === '') throw new Error("Color token must have a value")
return token
}
+2 -2
View File
@@ -1,4 +1,4 @@
import { ThemeLicenseType, ThemeConfig, ThemeSyntax } from "../../common"
import { ThemeLicenseType, ThemeSyntax, ThemeFamilyMeta } from "../../common"
export interface Variant {
colors: {
@@ -21,7 +21,7 @@ export interface Variant {
}
}
export const meta: Partial<ThemeConfig> = {
export const meta: ThemeFamilyMeta = {
name: "Atelier",
author: "Bram de Haan (http://atelierbramdehaan.nl)",
licenseType: ThemeLicenseType.MIT,
+2 -2
View File
@@ -3,8 +3,8 @@ import {
chroma,
colorRamp,
ThemeLicenseType,
ThemeConfig,
ThemeSyntax,
ThemeFamilyMeta,
} from "../../common"
export const ayu = {
@@ -77,7 +77,7 @@ export const buildSyntax = (t: typeof dark): ThemeSyntax => {
}
}
export const meta: Partial<ThemeConfig> = {
export const meta: ThemeFamilyMeta = {
name: "Ayu",
author: "dempfi",
licenseType: ThemeLicenseType.MIT,
+2 -1
View File
@@ -5,9 +5,10 @@ import {
ThemeLicenseType,
ThemeConfig,
ThemeSyntax,
ThemeFamilyMeta,
} from "../../common"
const meta: Partial<ThemeConfig> = {
const meta: ThemeFamilyMeta = {
name: "Gruvbox",
author: "morhetz <morhetz@gmail.com>",
licenseType: ThemeLicenseType.MIT,
+1 -1
View File
@@ -1,4 +1,4 @@
import { ThemeConfig } from "./common"
import { ThemeConfig } from "../theme"
import { darkDefault as gruvboxDark } from "./gruvbox/gruvbox-dark"
import { darkHard as gruvboxDarkHard } from "./gruvbox/gruvbox-dark-hard"
import { darkSoft as gruvboxDarkSoft } from "./gruvbox/gruvbox-dark-soft"
+1
View File
@@ -0,0 +1 @@
export function slugify(t: string): string { return t.toString().toLowerCase().replace(/\s+/g, '-').replace(/[^\w\-]+/g, '').replace(/\-\-+/g, '-').replace(/^-+/, '').replace(/-+$/, '') }