mirror of
https://github.com/zed-industries/zed.git
synced 2024-12-29 22:42:17 +03:00
Format
This commit is contained in:
parent
0b7e75c25a
commit
b9d5cc5828
@ -21,9 +21,7 @@ function clear_themes(theme_directory: string) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const all_themes: Theme[] = themes.map((theme) =>
|
const all_themes: Theme[] = themes.map((theme) => create_theme(theme))
|
||||||
create_theme(theme)
|
|
||||||
)
|
|
||||||
|
|
||||||
function write_themes(themes: Theme[], output_directory: string) {
|
function write_themes(themes: Theme[], output_directory: string) {
|
||||||
clear_themes(output_directory)
|
clear_themes(output_directory)
|
||||||
@ -34,10 +32,7 @@ function write_themes(themes: Theme[], output_directory: string) {
|
|||||||
const style_tree = app()
|
const style_tree = app()
|
||||||
const style_tree_json = JSON.stringify(style_tree, null, 2)
|
const style_tree_json = JSON.stringify(style_tree, null, 2)
|
||||||
const temp_path = path.join(temp_directory, `${theme.name}.json`)
|
const temp_path = path.join(temp_directory, `${theme.name}.json`)
|
||||||
const out_path = path.join(
|
const out_path = path.join(output_directory, `${theme.name}.json`)
|
||||||
output_directory,
|
|
||||||
`${theme.name}.json`
|
|
||||||
)
|
|
||||||
fs.writeFileSync(temp_path, style_tree_json)
|
fs.writeFileSync(temp_path, style_tree_json)
|
||||||
fs.renameSync(temp_path, out_path)
|
fs.renameSync(temp_path, out_path)
|
||||||
console.log(`- ${out_path} created`)
|
console.log(`- ${out_path} created`)
|
||||||
|
@ -83,8 +83,6 @@ function write_tokens(themes: Theme[], tokens_directory: string) {
|
|||||||
console.log(`- ${METADATA_FILE} created`)
|
console.log(`- ${METADATA_FILE} created`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const all_themes: Theme[] = themes.map((theme) =>
|
const all_themes: Theme[] = themes.map((theme) => create_theme(theme))
|
||||||
create_theme(theme)
|
|
||||||
)
|
|
||||||
|
|
||||||
write_tokens(all_themes, TOKENS_DIRECTORY)
|
write_tokens(all_themes, TOKENS_DIRECTORY)
|
||||||
|
@ -10,10 +10,7 @@ export type Margin = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
interface IconButtonOptions {
|
interface IconButtonOptions {
|
||||||
layer?:
|
layer?: Theme["lowest"] | Theme["middle"] | Theme["highest"]
|
||||||
| Theme["lowest"]
|
|
||||||
| Theme["middle"]
|
|
||||||
| Theme["highest"]
|
|
||||||
color?: keyof Theme["lowest"]
|
color?: keyof Theme["lowest"]
|
||||||
margin?: Partial<Margin>
|
margin?: Partial<Margin>
|
||||||
}
|
}
|
||||||
|
@ -12,11 +12,13 @@ type TabBarButtonProps = TabBarButtonOptions & {
|
|||||||
state?: Partial<Record<InteractiveState, Partial<TabBarButtonOptions>>>
|
state?: Partial<Record<InteractiveState, Partial<TabBarButtonOptions>>>
|
||||||
}
|
}
|
||||||
|
|
||||||
export function tab_bar_button(theme: Theme, { icon, color = "base" }: TabBarButtonProps) {
|
export function tab_bar_button(
|
||||||
|
theme: Theme,
|
||||||
|
{ icon, color = "base" }: TabBarButtonProps
|
||||||
|
) {
|
||||||
const button_spacing = 8
|
const button_spacing = 8
|
||||||
|
|
||||||
return (
|
return interactive({
|
||||||
interactive({
|
|
||||||
base: {
|
base: {
|
||||||
icon: {
|
icon: {
|
||||||
color: foreground(theme.middle, color),
|
color: foreground(theme.middle, color),
|
||||||
@ -29,7 +31,10 @@ export function tab_bar_button(theme: Theme, { icon, color = "base" }: TabBarBut
|
|||||||
container: {
|
container: {
|
||||||
corner_radius: 4,
|
corner_radius: 4,
|
||||||
padding: {
|
padding: {
|
||||||
top: 4, bottom: 4, left: 4, right: 4
|
top: 4,
|
||||||
|
bottom: 4,
|
||||||
|
left: 4,
|
||||||
|
right: 4,
|
||||||
},
|
},
|
||||||
margin: {
|
margin: {
|
||||||
left: button_spacing / 2,
|
left: button_spacing / 2,
|
||||||
@ -41,15 +46,13 @@ export function tab_bar_button(theme: Theme, { icon, color = "base" }: TabBarBut
|
|||||||
hovered: {
|
hovered: {
|
||||||
container: {
|
container: {
|
||||||
background: background(theme.middle, color, "hovered"),
|
background: background(theme.middle, color, "hovered"),
|
||||||
|
},
|
||||||
}
|
|
||||||
},
|
},
|
||||||
clicked: {
|
clicked: {
|
||||||
container: {
|
container: {
|
||||||
background: background(theme.middle, color, "pressed"),
|
background: background(theme.middle, color, "pressed"),
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
@ -9,10 +9,7 @@ import { useTheme, Theme } from "../theme"
|
|||||||
import { Margin } from "./icon_button"
|
import { Margin } from "./icon_button"
|
||||||
|
|
||||||
interface TextButtonOptions {
|
interface TextButtonOptions {
|
||||||
layer?:
|
layer?: Theme["lowest"] | Theme["middle"] | Theme["highest"]
|
||||||
| Theme["lowest"]
|
|
||||||
| Theme["middle"]
|
|
||||||
| Theme["highest"]
|
|
||||||
color?: keyof Theme["lowest"]
|
color?: keyof Theme["lowest"]
|
||||||
margin?: Partial<Margin>
|
margin?: Partial<Margin>
|
||||||
text_properties?: TextProperties
|
text_properties?: TextProperties
|
||||||
|
@ -57,6 +57,6 @@ export default function app(): any {
|
|||||||
tooltip: tooltip(),
|
tooltip: tooltip(),
|
||||||
terminal: terminal(),
|
terminal: terminal(),
|
||||||
assistant: assistant(),
|
assistant: assistant(),
|
||||||
feedback: feedback()
|
feedback: feedback(),
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -8,23 +8,24 @@ type RoleCycleButton = TextStyle & {
|
|||||||
}
|
}
|
||||||
// TODO: Replace these with zed types
|
// TODO: Replace these with zed types
|
||||||
type RemainingTokens = TextStyle & {
|
type RemainingTokens = TextStyle & {
|
||||||
background: string,
|
background: string
|
||||||
margin: { top: number, right: number },
|
margin: { top: number; right: number }
|
||||||
padding: {
|
padding: {
|
||||||
right: number,
|
right: number
|
||||||
left: number,
|
left: number
|
||||||
top: number,
|
top: number
|
||||||
bottom: number,
|
bottom: number
|
||||||
},
|
}
|
||||||
corner_radius: number,
|
corner_radius: number
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function assistant(): any {
|
export default function assistant(): any {
|
||||||
const theme = useTheme()
|
const theme = useTheme()
|
||||||
|
|
||||||
const interactive_role = (color: StyleSets): Interactive<RoleCycleButton> => {
|
const interactive_role = (
|
||||||
return (
|
color: StyleSets
|
||||||
interactive({
|
): Interactive<RoleCycleButton> => {
|
||||||
|
return interactive({
|
||||||
base: {
|
base: {
|
||||||
...text(theme.highest, "sans", color, { size: "sm" }),
|
...text(theme.highest, "sans", color, { size: "sm" }),
|
||||||
},
|
},
|
||||||
@ -36,22 +37,19 @@ export default function assistant(): any {
|
|||||||
clicked: {
|
clicked: {
|
||||||
...text(theme.highest, "sans", color, { size: "sm" }),
|
...text(theme.highest, "sans", color, { size: "sm" }),
|
||||||
background: background(theme.highest, color, "pressed"),
|
background: background(theme.highest, color, "pressed"),
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const tokens_remaining = (color: StyleSets): RemainingTokens => {
|
const tokens_remaining = (color: StyleSets): RemainingTokens => {
|
||||||
return (
|
return {
|
||||||
{
|
|
||||||
...text(theme.highest, "mono", color, { size: "xs" }),
|
...text(theme.highest, "mono", color, { size: "xs" }),
|
||||||
background: background(theme.highest, "on", "default"),
|
background: background(theme.highest, "on", "default"),
|
||||||
margin: { top: 12, right: 20 },
|
margin: { top: 12, right: 20 },
|
||||||
padding: { right: 4, left: 4, top: 1, bottom: 1 },
|
padding: { right: 4, left: 4, top: 1, bottom: 1 },
|
||||||
corner_radius: 6,
|
corner_radius: 6,
|
||||||
}
|
}
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
@ -93,7 +91,10 @@ export default function assistant(): any {
|
|||||||
base: {
|
base: {
|
||||||
background: background(theme.middle),
|
background: background(theme.middle),
|
||||||
padding: { top: 4, bottom: 4 },
|
padding: { top: 4, bottom: 4 },
|
||||||
border: border(theme.middle, "default", { top: true, overlay: true }),
|
border: border(theme.middle, "default", {
|
||||||
|
top: true,
|
||||||
|
overlay: true,
|
||||||
|
}),
|
||||||
},
|
},
|
||||||
state: {
|
state: {
|
||||||
hovered: {
|
hovered: {
|
||||||
@ -101,7 +102,7 @@ export default function assistant(): any {
|
|||||||
},
|
},
|
||||||
clicked: {
|
clicked: {
|
||||||
background: background(theme.middle, "pressed"),
|
background: background(theme.middle, "pressed"),
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
}),
|
}),
|
||||||
saved_at: {
|
saved_at: {
|
||||||
|
@ -318,7 +318,7 @@ export default function editor(): any {
|
|||||||
? with_opacity(theme.ramps.green(0.5).hex(), 0.8)
|
? with_opacity(theme.ramps.green(0.5).hex(), 0.8)
|
||||||
: with_opacity(theme.ramps.green(0.4).hex(), 0.8),
|
: with_opacity(theme.ramps.green(0.4).hex(), 0.8),
|
||||||
},
|
},
|
||||||
selections: foreground(layer, "accent")
|
selections: foreground(layer, "accent"),
|
||||||
},
|
},
|
||||||
composition_mark: {
|
composition_mark: {
|
||||||
underline: {
|
underline: {
|
||||||
|
@ -37,7 +37,7 @@ export default function feedback(): any {
|
|||||||
...text(theme.highest, "mono", "on", "disabled"),
|
...text(theme.highest, "mono", "on", "disabled"),
|
||||||
background: background(theme.highest, "on", "disabled"),
|
background: background(theme.highest, "on", "disabled"),
|
||||||
border: border(theme.highest, "on", "disabled"),
|
border: border(theme.highest, "on", "disabled"),
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
}),
|
}),
|
||||||
button_margin: 8,
|
button_margin: 8,
|
||||||
|
@ -152,7 +152,7 @@ export default function picker(): any {
|
|||||||
0.5
|
0.5
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
}
|
},
|
||||||
}),
|
}),
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -64,17 +64,17 @@ export default function project_panel(): any {
|
|||||||
const unselected_default_style = merge(
|
const unselected_default_style = merge(
|
||||||
base_properties,
|
base_properties,
|
||||||
unselected?.default ?? {},
|
unselected?.default ?? {},
|
||||||
{},
|
{}
|
||||||
)
|
)
|
||||||
const unselected_hovered_style = merge(
|
const unselected_hovered_style = merge(
|
||||||
base_properties,
|
base_properties,
|
||||||
{ background: background(theme.middle, "hovered") },
|
{ background: background(theme.middle, "hovered") },
|
||||||
unselected?.hovered ?? {},
|
unselected?.hovered ?? {}
|
||||||
)
|
)
|
||||||
const unselected_clicked_style = merge(
|
const unselected_clicked_style = merge(
|
||||||
base_properties,
|
base_properties,
|
||||||
{ background: background(theme.middle, "pressed") },
|
{ background: background(theme.middle, "pressed") },
|
||||||
unselected?.clicked ?? {},
|
unselected?.clicked ?? {}
|
||||||
)
|
)
|
||||||
const selected_default_style = merge(
|
const selected_default_style = merge(
|
||||||
base_properties,
|
base_properties,
|
||||||
@ -82,7 +82,7 @@ export default function project_panel(): any {
|
|||||||
background: background(theme.lowest),
|
background: background(theme.lowest),
|
||||||
text: text(theme.lowest, "sans", { size: "sm" }),
|
text: text(theme.lowest, "sans", { size: "sm" }),
|
||||||
},
|
},
|
||||||
selected_style?.default ?? {},
|
selected_style?.default ?? {}
|
||||||
)
|
)
|
||||||
const selected_hovered_style = merge(
|
const selected_hovered_style = merge(
|
||||||
base_properties,
|
base_properties,
|
||||||
@ -90,7 +90,7 @@ export default function project_panel(): any {
|
|||||||
background: background(theme.lowest, "hovered"),
|
background: background(theme.lowest, "hovered"),
|
||||||
text: text(theme.lowest, "sans", { size: "sm" }),
|
text: text(theme.lowest, "sans", { size: "sm" }),
|
||||||
},
|
},
|
||||||
selected_style?.hovered ?? {},
|
selected_style?.hovered ?? {}
|
||||||
)
|
)
|
||||||
const selected_clicked_style = merge(
|
const selected_clicked_style = merge(
|
||||||
base_properties,
|
base_properties,
|
||||||
@ -98,7 +98,7 @@ export default function project_panel(): any {
|
|||||||
background: background(theme.lowest, "pressed"),
|
background: background(theme.lowest, "pressed"),
|
||||||
text: text(theme.lowest, "sans", { size: "sm" }),
|
text: text(theme.lowest, "sans", { size: "sm" }),
|
||||||
},
|
},
|
||||||
selected_style?.clicked ?? {},
|
selected_style?.clicked ?? {}
|
||||||
)
|
)
|
||||||
|
|
||||||
return toggleable({
|
return toggleable({
|
||||||
@ -175,7 +175,7 @@ export default function project_panel(): any {
|
|||||||
default: {
|
default: {
|
||||||
icon_color: foreground(theme.middle, "variant"),
|
icon_color: foreground(theme.middle, "variant"),
|
||||||
},
|
},
|
||||||
},
|
}
|
||||||
),
|
),
|
||||||
cut_entry: entry(
|
cut_entry: entry(
|
||||||
{
|
{
|
||||||
@ -190,7 +190,7 @@ export default function project_panel(): any {
|
|||||||
size: "sm",
|
size: "sm",
|
||||||
}),
|
}),
|
||||||
},
|
},
|
||||||
},
|
}
|
||||||
),
|
),
|
||||||
filename_editor: {
|
filename_editor: {
|
||||||
background: background(theme.middle, "on"),
|
background: background(theme.middle, "on"),
|
||||||
|
@ -34,10 +34,14 @@ export default function status_bar(): any {
|
|||||||
...text(layer, "mono", "variant", { size: "xs" }),
|
...text(layer, "mono", "variant", { size: "xs" }),
|
||||||
},
|
},
|
||||||
active_language: text_button({
|
active_language: text_button({
|
||||||
color: "variant"
|
color: "variant",
|
||||||
|
}),
|
||||||
|
auto_update_progress_message: text(layer, "sans", "variant", {
|
||||||
|
size: "xs",
|
||||||
|
}),
|
||||||
|
auto_update_done_message: text(layer, "sans", "variant", {
|
||||||
|
size: "xs",
|
||||||
}),
|
}),
|
||||||
auto_update_progress_message: text(layer, "sans", "variant", { size: "xs" }),
|
|
||||||
auto_update_done_message: text(layer, "sans", "variant", { size: "xs" }),
|
|
||||||
lsp_status: interactive({
|
lsp_status: interactive({
|
||||||
base: {
|
base: {
|
||||||
...diagnostic_status_container,
|
...diagnostic_status_container,
|
||||||
|
@ -183,10 +183,10 @@ export function titlebar(): any {
|
|||||||
project_name_divider: text(theme.lowest, "sans", "variant"),
|
project_name_divider: text(theme.lowest, "sans", "variant"),
|
||||||
|
|
||||||
project_menu_button: toggleable_text_button(theme, {
|
project_menu_button: toggleable_text_button(theme, {
|
||||||
color: 'base',
|
color: "base",
|
||||||
}),
|
}),
|
||||||
git_menu_button: toggleable_text_button(theme, {
|
git_menu_button: toggleable_text_button(theme, {
|
||||||
color: 'variant',
|
color: "variant",
|
||||||
}),
|
}),
|
||||||
|
|
||||||
// Collaborators
|
// Collaborators
|
||||||
|
@ -2,7 +2,7 @@ import { Scale, Color } from "chroma-js"
|
|||||||
import {
|
import {
|
||||||
ThemeConfig,
|
ThemeConfig,
|
||||||
ThemeAppearance,
|
ThemeAppearance,
|
||||||
ThemeConfigInputColors
|
ThemeConfigInputColors,
|
||||||
} from "./theme_config"
|
} from "./theme_config"
|
||||||
import { get_ramps } from "./ramps"
|
import { get_ramps } from "./ramps"
|
||||||
import { syntaxStyle } from "./syntax"
|
import { syntaxStyle } from "./syntax"
|
||||||
@ -115,11 +115,7 @@ export interface Style {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function create_theme(theme: ThemeConfig): Theme {
|
export function create_theme(theme: ThemeConfig): Theme {
|
||||||
const {
|
const { name, appearance, input_color } = theme
|
||||||
name,
|
|
||||||
appearance,
|
|
||||||
input_color,
|
|
||||||
} = theme
|
|
||||||
|
|
||||||
const is_light = appearance === ThemeAppearance.Light
|
const is_light = appearance === ThemeAppearance.Light
|
||||||
const color_ramps: ThemeConfigInputColors = input_color
|
const color_ramps: ThemeConfigInputColors = input_color
|
||||||
@ -161,7 +157,10 @@ export function create_theme(theme: ThemeConfig): Theme {
|
|||||||
"7": player(ramps.yellow),
|
"7": player(ramps.yellow),
|
||||||
}
|
}
|
||||||
|
|
||||||
const syntax = syntaxStyle(ramps, theme.override.syntax ? theme.override.syntax : {})
|
const syntax = syntaxStyle(
|
||||||
|
ramps,
|
||||||
|
theme.override.syntax ? theme.override.syntax : {}
|
||||||
|
)
|
||||||
|
|
||||||
return {
|
return {
|
||||||
name,
|
name,
|
||||||
|
@ -3,8 +3,13 @@ import { font_weights, ThemeConfigInputSyntax, RampSet } from "../common"
|
|||||||
import { Syntax, SyntaxHighlightStyle, allSyntaxKeys } from "../types/syntax"
|
import { Syntax, SyntaxHighlightStyle, allSyntaxKeys } from "../types/syntax"
|
||||||
|
|
||||||
// Apply defaults to any missing syntax properties that are not defined manually
|
// Apply defaults to any missing syntax properties that are not defined manually
|
||||||
function apply_defaults(ramps: RampSet, syntax_highlights: Partial<Syntax>): Syntax {
|
function apply_defaults(
|
||||||
const restKeys: (keyof Syntax)[] = allSyntaxKeys.filter(key => !syntax_highlights[key])
|
ramps: RampSet,
|
||||||
|
syntax_highlights: Partial<Syntax>
|
||||||
|
): Syntax {
|
||||||
|
const restKeys: (keyof Syntax)[] = allSyntaxKeys.filter(
|
||||||
|
(key) => !syntax_highlights[key]
|
||||||
|
)
|
||||||
|
|
||||||
const completeSyntax: Syntax = {} as Syntax
|
const completeSyntax: Syntax = {} as Syntax
|
||||||
|
|
||||||
@ -28,23 +33,36 @@ function apply_defaults(ramps: RampSet, syntax_highlights: Partial<Syntax>): Syn
|
|||||||
// Merge the base syntax with the theme syntax overrides
|
// Merge the base syntax with the theme syntax overrides
|
||||||
// This is a deep merge, so any nested properties will be merged as well
|
// This is a deep merge, so any nested properties will be merged as well
|
||||||
// This allows for a theme to only override a single property of a syntax highlight style
|
// This allows for a theme to only override a single property of a syntax highlight style
|
||||||
const merge_syntax = (baseSyntax: Syntax, theme_syntax_overrides: ThemeConfigInputSyntax): Syntax => {
|
const merge_syntax = (
|
||||||
return deepmerge<Syntax, ThemeConfigInputSyntax>(baseSyntax, theme_syntax_overrides, {
|
baseSyntax: Syntax,
|
||||||
|
theme_syntax_overrides: ThemeConfigInputSyntax
|
||||||
|
): Syntax => {
|
||||||
|
return deepmerge<Syntax, ThemeConfigInputSyntax>(
|
||||||
|
baseSyntax,
|
||||||
|
theme_syntax_overrides,
|
||||||
|
{
|
||||||
arrayMerge: (destinationArray, sourceArray) => [
|
arrayMerge: (destinationArray, sourceArray) => [
|
||||||
...destinationArray,
|
...destinationArray,
|
||||||
...sourceArray,
|
...sourceArray,
|
||||||
],
|
],
|
||||||
})
|
}
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
/** Returns a complete Syntax object of the combined styles of a theme's syntax overrides and the default syntax styles */
|
/** Returns a complete Syntax object of the combined styles of a theme's syntax overrides and the default syntax styles */
|
||||||
export const syntaxStyle = (ramps: RampSet, theme_syntax_overrides: ThemeConfigInputSyntax): Syntax => {
|
export const syntaxStyle = (
|
||||||
|
ramps: RampSet,
|
||||||
|
theme_syntax_overrides: ThemeConfigInputSyntax
|
||||||
|
): Syntax => {
|
||||||
const syntax_highlights: Partial<Syntax> = {
|
const syntax_highlights: Partial<Syntax> = {
|
||||||
"comment": { color: ramps.neutral(0.71).hex() },
|
comment: { color: ramps.neutral(0.71).hex() },
|
||||||
"comment.doc": { color: ramps.neutral(0.71).hex() },
|
"comment.doc": { color: ramps.neutral(0.71).hex() },
|
||||||
primary: { color: ramps.neutral(1).hex() },
|
primary: { color: ramps.neutral(1).hex() },
|
||||||
emphasis: { color: ramps.blue(0.5).hex() },
|
emphasis: { color: ramps.blue(0.5).hex() },
|
||||||
"emphasis.strong": { color: ramps.blue(0.5).hex(), weight: font_weights.bold },
|
"emphasis.strong": {
|
||||||
|
color: ramps.blue(0.5).hex(),
|
||||||
|
weight: font_weights.bold,
|
||||||
|
},
|
||||||
link_uri: { color: ramps.green(0.5).hex(), underline: true },
|
link_uri: { color: ramps.green(0.5).hex(), underline: true },
|
||||||
link_text: { color: ramps.orange(0.5).hex(), italic: true },
|
link_text: { color: ramps.orange(0.5).hex(), italic: true },
|
||||||
"text.literal": { color: ramps.orange(0.5).hex() },
|
"text.literal": { color: ramps.orange(0.5).hex() },
|
||||||
|
@ -55,7 +55,9 @@ export type ThemeConfigInputColorsKeys = keyof ThemeConfigInputColors
|
|||||||
* }
|
* }
|
||||||
* ```
|
* ```
|
||||||
*/
|
*/
|
||||||
export type ThemeConfigInputSyntax = Partial<Record<SyntaxProperty, Partial<SyntaxHighlightStyle>>>
|
export type ThemeConfigInputSyntax = Partial<
|
||||||
|
Record<SyntaxProperty, Partial<SyntaxHighlightStyle>>
|
||||||
|
>
|
||||||
|
|
||||||
interface ThemeConfigOverrides {
|
interface ThemeConfigOverrides {
|
||||||
syntax: ThemeConfigInputSyntax
|
syntax: ThemeConfigInputSyntax
|
||||||
|
@ -4,9 +4,7 @@ import {
|
|||||||
SingleOtherToken,
|
SingleOtherToken,
|
||||||
TokenTypes,
|
TokenTypes,
|
||||||
} from "@tokens-studio/types"
|
} from "@tokens-studio/types"
|
||||||
import {
|
import { Shadow } from "../create_theme"
|
||||||
Shadow,
|
|
||||||
} from "../create_theme"
|
|
||||||
import { LayerToken, layer_token } from "./layer"
|
import { LayerToken, layer_token } from "./layer"
|
||||||
import { PlayersToken, players_token } from "./players"
|
import { PlayersToken, players_token } from "./players"
|
||||||
import { color_token } from "./token"
|
import { color_token } from "./token"
|
||||||
|
@ -1,4 +1,8 @@
|
|||||||
import { ThemeLicenseType, ThemeFamilyMeta, ThemeConfigInputSyntax } from "../../common"
|
import {
|
||||||
|
ThemeLicenseType,
|
||||||
|
ThemeFamilyMeta,
|
||||||
|
ThemeConfigInputSyntax,
|
||||||
|
} from "../../common"
|
||||||
|
|
||||||
export interface Variant {
|
export interface Variant {
|
||||||
colors: {
|
colors: {
|
||||||
|
@ -1,9 +1,9 @@
|
|||||||
import fs from 'fs'
|
import fs from "fs"
|
||||||
import path from 'path'
|
import path from "path"
|
||||||
import readline from 'readline'
|
import readline from "readline"
|
||||||
|
|
||||||
function escapeTypeName(name: string): string {
|
function escapeTypeName(name: string): string {
|
||||||
return `'${name.replace('@', '').toLowerCase()}'`
|
return `'${name.replace("@", "").toLowerCase()}'`
|
||||||
}
|
}
|
||||||
|
|
||||||
const generatedNote = `// This file is generated by extract_syntax_types.ts
|
const generatedNote = `// This file is generated by extract_syntax_types.ts
|
||||||
@ -17,8 +17,8 @@ const defaultTextProperty = ` /** Default text color */
|
|||||||
| 'primary'`
|
| 'primary'`
|
||||||
|
|
||||||
const main = async () => {
|
const main = async () => {
|
||||||
const pathFromRoot = 'crates/zed/src/languages'
|
const pathFromRoot = "crates/zed/src/languages"
|
||||||
const directoryPath = path.join(__dirname, '../../../', pathFromRoot)
|
const directoryPath = path.join(__dirname, "../../../", pathFromRoot)
|
||||||
const stylesMap: Record<string, Set<string>> = {}
|
const stylesMap: Record<string, Set<string>> = {}
|
||||||
const propertyLanguageMap: Record<string, Set<string>> = {}
|
const propertyLanguageMap: Record<string, Set<string>> = {}
|
||||||
|
|
||||||
@ -47,24 +47,31 @@ const main = async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const directories = fs.readdirSync(directoryPath, { withFileTypes: true })
|
const directories = fs
|
||||||
.filter(dirent => dirent.isDirectory())
|
.readdirSync(directoryPath, { withFileTypes: true })
|
||||||
.map(dirent => dirent.name)
|
.filter((dirent) => dirent.isDirectory())
|
||||||
|
.map((dirent) => dirent.name)
|
||||||
|
|
||||||
for (const dir of directories) {
|
for (const dir of directories) {
|
||||||
const highlightsFilePath = path.join(directoryPath, dir, 'highlights.scm')
|
const highlightsFilePath = path.join(
|
||||||
|
directoryPath,
|
||||||
|
dir,
|
||||||
|
"highlights.scm"
|
||||||
|
)
|
||||||
if (fs.existsSync(highlightsFilePath)) {
|
if (fs.existsSync(highlightsFilePath)) {
|
||||||
await processFile(highlightsFilePath, dir)
|
await processFile(highlightsFilePath, dir)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
for (const [language, properties] of Object.entries(stylesMap)) {
|
for (const [language, properties] of Object.entries(stylesMap)) {
|
||||||
console.log(`${language}: ${Array.from(properties).join(', ')}`)
|
console.log(`${language}: ${Array.from(properties).join(", ")}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const sortedProperties = Object.entries(propertyLanguageMap).sort(([propA], [propB]) => propA.localeCompare(propB))
|
const sortedProperties = Object.entries(propertyLanguageMap).sort(
|
||||||
|
([propA], [propB]) => propA.localeCompare(propB)
|
||||||
|
)
|
||||||
|
|
||||||
const outStream = fs.createWriteStream(path.join(__dirname, 'syntax.ts'))
|
const outStream = fs.createWriteStream(path.join(__dirname, "syntax.ts"))
|
||||||
let allProperties = ""
|
let allProperties = ""
|
||||||
const syntaxKeys = []
|
const syntaxKeys = []
|
||||||
for (const [property, languages] of sortedProperties) {
|
for (const [property, languages] of sortedProperties) {
|
||||||
@ -73,9 +80,9 @@ const main = async () => {
|
|||||||
// Limit to the first 7 languages, append "..." if more than 7
|
// Limit to the first 7 languages, append "..." if more than 7
|
||||||
languagesArray = languagesArray.slice(0, 7)
|
languagesArray = languagesArray.slice(0, 7)
|
||||||
if (moreThanSeven) {
|
if (moreThanSeven) {
|
||||||
languagesArray.push('...')
|
languagesArray.push("...")
|
||||||
}
|
}
|
||||||
const languagesString = languagesArray.join(', ')
|
const languagesString = languagesArray.join(", ")
|
||||||
const comment = `/** ${languagesString} */`
|
const comment = `/** ${languagesString} */`
|
||||||
allProperties += ` ${comment}\n | ${property} \n`
|
allProperties += ` ${comment}\n | ${property} \n`
|
||||||
syntaxKeys.push(property)
|
syntaxKeys.push(property)
|
||||||
@ -95,7 +102,9 @@ export type SyntaxOverride = Partial<Syntax>
|
|||||||
|
|
||||||
export type SyntaxProperty = \n${defaultTextProperty}\n\n${allProperties}
|
export type SyntaxProperty = \n${defaultTextProperty}\n\n${allProperties}
|
||||||
|
|
||||||
export const allSyntaxKeys: SyntaxProperty[] = [\n ${syntaxKeys.join(',\n ')}\n]`)
|
export const allSyntaxKeys: SyntaxProperty[] = [\n ${syntaxKeys.join(
|
||||||
|
",\n "
|
||||||
|
)}\n]`)
|
||||||
outStream.end()
|
outStream.end()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6,11 +6,11 @@
|
|||||||
// 'npm run extract-syntax-types' from ./styles
|
// 'npm run extract-syntax-types' from ./styles
|
||||||
|
|
||||||
export type SyntaxHighlightStyle = {
|
export type SyntaxHighlightStyle = {
|
||||||
color: string,
|
color: string
|
||||||
fade_out?: number,
|
fade_out?: number
|
||||||
italic?: boolean,
|
italic?: boolean
|
||||||
underline?: boolean,
|
underline?: boolean
|
||||||
weight?: string,
|
weight?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export type Syntax = Record<SyntaxProperty, SyntaxHighlightStyle>
|
export type Syntax = Record<SyntaxProperty, SyntaxHighlightStyle>
|
||||||
@ -18,186 +18,185 @@ export type SyntaxOverride = Partial<Syntax>
|
|||||||
|
|
||||||
export type SyntaxProperty =
|
export type SyntaxProperty =
|
||||||
/** Default text color */
|
/** Default text color */
|
||||||
| 'primary'
|
| "primary"
|
||||||
|
|
||||||
/** elixir */
|
/** elixir */
|
||||||
| '__attribute__'
|
| "__attribute__"
|
||||||
/** elixir */
|
/** elixir */
|
||||||
| '__name__'
|
| "__name__"
|
||||||
/** elixir */
|
/** elixir */
|
||||||
| '_sigil_name'
|
| "_sigil_name"
|
||||||
/** css, heex, lua */
|
/** css, heex, lua */
|
||||||
| 'attribute'
|
| "attribute"
|
||||||
/** javascript, lua, tsx, typescript, yaml */
|
/** javascript, lua, tsx, typescript, yaml */
|
||||||
| 'boolean'
|
| "boolean"
|
||||||
/** elixir */
|
/** elixir */
|
||||||
| 'comment.doc'
|
| "comment.doc"
|
||||||
/** elixir */
|
/** elixir */
|
||||||
| 'comment.unused'
|
| "comment.unused"
|
||||||
/** bash, c, cpp, css, elixir, elm, erb, ... */
|
/** bash, c, cpp, css, elixir, elm, erb, ... */
|
||||||
| 'comment'
|
| "comment"
|
||||||
/** elixir, go, javascript, lua, php, python, racket, ... */
|
/** elixir, go, javascript, lua, php, python, racket, ... */
|
||||||
| 'constant.builtin'
|
| "constant.builtin"
|
||||||
/** bash, c, cpp, elixir, elm, glsl, heex, ... */
|
/** bash, c, cpp, elixir, elm, glsl, heex, ... */
|
||||||
| 'constant'
|
| "constant"
|
||||||
/** glsl */
|
/** glsl */
|
||||||
| 'delimiter'
|
| "delimiter"
|
||||||
/** bash, elixir, javascript, python, ruby, tsx, typescript */
|
/** bash, elixir, javascript, python, ruby, tsx, typescript */
|
||||||
| 'embedded'
|
| "embedded"
|
||||||
/** markdown */
|
/** markdown */
|
||||||
| 'emphasis.strong'
|
| "emphasis.strong"
|
||||||
/** markdown */
|
/** markdown */
|
||||||
| 'emphasis'
|
| "emphasis"
|
||||||
/** go, python, racket, ruby, scheme */
|
/** go, python, racket, ruby, scheme */
|
||||||
| 'escape'
|
| "escape"
|
||||||
/** lua */
|
/** lua */
|
||||||
| 'field'
|
| "field"
|
||||||
/** lua, php, python */
|
/** lua, php, python */
|
||||||
| 'function.builtin'
|
| "function.builtin"
|
||||||
/** elm, lua, rust */
|
/** elm, lua, rust */
|
||||||
| 'function.definition'
|
| "function.definition"
|
||||||
/** ruby */
|
/** ruby */
|
||||||
| 'function.method.builtin'
|
| "function.method.builtin"
|
||||||
/** go, javascript, php, python, ruby, rust, tsx, ... */
|
/** go, javascript, php, python, ruby, rust, tsx, ... */
|
||||||
| 'function.method'
|
| "function.method"
|
||||||
/** rust */
|
/** rust */
|
||||||
| 'function.special.definition'
|
| "function.special.definition"
|
||||||
/** c, cpp, glsl, rust */
|
/** c, cpp, glsl, rust */
|
||||||
| 'function.special'
|
| "function.special"
|
||||||
/** bash, c, cpp, css, elixir, elm, glsl, ... */
|
/** bash, c, cpp, css, elixir, elm, glsl, ... */
|
||||||
| 'function'
|
| "function"
|
||||||
/** elm */
|
/** elm */
|
||||||
| 'identifier'
|
| "identifier"
|
||||||
/** glsl */
|
/** glsl */
|
||||||
| 'keyword.function'
|
| "keyword.function"
|
||||||
/** bash, c, cpp, css, elixir, elm, erb, ... */
|
/** bash, c, cpp, css, elixir, elm, erb, ... */
|
||||||
| 'keyword'
|
| "keyword"
|
||||||
/** c, cpp, glsl */
|
/** c, cpp, glsl */
|
||||||
| 'label'
|
| "label"
|
||||||
/** markdown */
|
/** markdown */
|
||||||
| 'link_text'
|
| "link_text"
|
||||||
/** markdown */
|
/** markdown */
|
||||||
| 'link_uri'
|
| "link_uri"
|
||||||
/** lua, php, tsx, typescript */
|
/** lua, php, tsx, typescript */
|
||||||
| 'method.constructor'
|
| "method.constructor"
|
||||||
/** lua */
|
/** lua */
|
||||||
| 'method'
|
| "method"
|
||||||
/** heex */
|
/** heex */
|
||||||
| 'module'
|
| "module"
|
||||||
/** svelte */
|
/** svelte */
|
||||||
| 'none'
|
| "none"
|
||||||
/** bash, c, cpp, css, elixir, glsl, go, ... */
|
/** bash, c, cpp, css, elixir, glsl, go, ... */
|
||||||
| 'number'
|
| "number"
|
||||||
/** bash, c, cpp, css, elixir, elm, glsl, ... */
|
/** bash, c, cpp, css, elixir, elm, glsl, ... */
|
||||||
| 'operator'
|
| "operator"
|
||||||
/** lua */
|
/** lua */
|
||||||
| 'parameter'
|
| "parameter"
|
||||||
/** lua */
|
/** lua */
|
||||||
| 'preproc'
|
| "preproc"
|
||||||
/** bash, c, cpp, css, glsl, go, html, ... */
|
/** bash, c, cpp, css, glsl, go, html, ... */
|
||||||
| 'property'
|
| "property"
|
||||||
/** c, cpp, elixir, elm, heex, html, javascript, ... */
|
/** c, cpp, elixir, elm, heex, html, javascript, ... */
|
||||||
| 'punctuation.bracket'
|
| "punctuation.bracket"
|
||||||
/** c, cpp, css, elixir, elm, heex, javascript, ... */
|
/** c, cpp, css, elixir, elm, heex, javascript, ... */
|
||||||
| 'punctuation.delimiter'
|
| "punctuation.delimiter"
|
||||||
/** markdown */
|
/** markdown */
|
||||||
| 'punctuation.list_marker'
|
| "punctuation.list_marker"
|
||||||
/** elixir, javascript, python, ruby, tsx, typescript, yaml */
|
/** elixir, javascript, python, ruby, tsx, typescript, yaml */
|
||||||
| 'punctuation.special'
|
| "punctuation.special"
|
||||||
/** elixir */
|
/** elixir */
|
||||||
| 'punctuation'
|
| "punctuation"
|
||||||
/** glsl */
|
/** glsl */
|
||||||
| 'storageclass'
|
| "storageclass"
|
||||||
/** elixir, elm, yaml */
|
/** elixir, elm, yaml */
|
||||||
| 'string.escape'
|
| "string.escape"
|
||||||
/** elixir, javascript, racket, ruby, tsx, typescript */
|
/** elixir, javascript, racket, ruby, tsx, typescript */
|
||||||
| 'string.regex'
|
| "string.regex"
|
||||||
/** elixir, ruby */
|
/** elixir, ruby */
|
||||||
| 'string.special.symbol'
|
| "string.special.symbol"
|
||||||
/** css, elixir, toml */
|
/** css, elixir, toml */
|
||||||
| 'string.special'
|
| "string.special"
|
||||||
/** bash, c, cpp, css, elixir, elm, glsl, ... */
|
/** bash, c, cpp, css, elixir, elm, glsl, ... */
|
||||||
| 'string'
|
| "string"
|
||||||
/** svelte */
|
/** svelte */
|
||||||
| 'tag.delimiter'
|
| "tag.delimiter"
|
||||||
/** css, heex, php, svelte */
|
/** css, heex, php, svelte */
|
||||||
| 'tag'
|
| "tag"
|
||||||
/** markdown */
|
/** markdown */
|
||||||
| 'text.literal'
|
| "text.literal"
|
||||||
/** markdown */
|
/** markdown */
|
||||||
| 'title'
|
| "title"
|
||||||
/** javascript, php, rust, tsx, typescript */
|
/** javascript, php, rust, tsx, typescript */
|
||||||
| 'type.builtin'
|
| "type.builtin"
|
||||||
/** glsl */
|
/** glsl */
|
||||||
| 'type.qualifier'
|
| "type.qualifier"
|
||||||
/** c, cpp, css, elixir, elm, glsl, go, ... */
|
/** c, cpp, css, elixir, elm, glsl, go, ... */
|
||||||
| 'type'
|
| "type"
|
||||||
/** glsl, php */
|
/** glsl, php */
|
||||||
| 'variable.builtin'
|
| "variable.builtin"
|
||||||
/** cpp, css, javascript, lua, racket, ruby, rust, ... */
|
/** cpp, css, javascript, lua, racket, ruby, rust, ... */
|
||||||
| 'variable.special'
|
| "variable.special"
|
||||||
/** c, cpp, elm, glsl, go, javascript, lua, ... */
|
/** c, cpp, elm, glsl, go, javascript, lua, ... */
|
||||||
| 'variable'
|
| "variable"
|
||||||
|
|
||||||
|
|
||||||
export const allSyntaxKeys: SyntaxProperty[] = [
|
export const allSyntaxKeys: SyntaxProperty[] = [
|
||||||
'__attribute__',
|
"__attribute__",
|
||||||
'__name__',
|
"__name__",
|
||||||
'_sigil_name',
|
"_sigil_name",
|
||||||
'attribute',
|
"attribute",
|
||||||
'boolean',
|
"boolean",
|
||||||
'comment.doc',
|
"comment.doc",
|
||||||
'comment.unused',
|
"comment.unused",
|
||||||
'comment',
|
"comment",
|
||||||
'constant.builtin',
|
"constant.builtin",
|
||||||
'constant',
|
"constant",
|
||||||
'delimiter',
|
"delimiter",
|
||||||
'embedded',
|
"embedded",
|
||||||
'emphasis.strong',
|
"emphasis.strong",
|
||||||
'emphasis',
|
"emphasis",
|
||||||
'escape',
|
"escape",
|
||||||
'field',
|
"field",
|
||||||
'function.builtin',
|
"function.builtin",
|
||||||
'function.definition',
|
"function.definition",
|
||||||
'function.method.builtin',
|
"function.method.builtin",
|
||||||
'function.method',
|
"function.method",
|
||||||
'function.special.definition',
|
"function.special.definition",
|
||||||
'function.special',
|
"function.special",
|
||||||
'function',
|
"function",
|
||||||
'identifier',
|
"identifier",
|
||||||
'keyword.function',
|
"keyword.function",
|
||||||
'keyword',
|
"keyword",
|
||||||
'label',
|
"label",
|
||||||
'link_text',
|
"link_text",
|
||||||
'link_uri',
|
"link_uri",
|
||||||
'method.constructor',
|
"method.constructor",
|
||||||
'method',
|
"method",
|
||||||
'module',
|
"module",
|
||||||
'none',
|
"none",
|
||||||
'number',
|
"number",
|
||||||
'operator',
|
"operator",
|
||||||
'parameter',
|
"parameter",
|
||||||
'preproc',
|
"preproc",
|
||||||
'property',
|
"property",
|
||||||
'punctuation.bracket',
|
"punctuation.bracket",
|
||||||
'punctuation.delimiter',
|
"punctuation.delimiter",
|
||||||
'punctuation.list_marker',
|
"punctuation.list_marker",
|
||||||
'punctuation.special',
|
"punctuation.special",
|
||||||
'punctuation',
|
"punctuation",
|
||||||
'storageclass',
|
"storageclass",
|
||||||
'string.escape',
|
"string.escape",
|
||||||
'string.regex',
|
"string.regex",
|
||||||
'string.special.symbol',
|
"string.special.symbol",
|
||||||
'string.special',
|
"string.special",
|
||||||
'string',
|
"string",
|
||||||
'tag.delimiter',
|
"tag.delimiter",
|
||||||
'tag',
|
"tag",
|
||||||
'text.literal',
|
"text.literal",
|
||||||
'title',
|
"title",
|
||||||
'type.builtin',
|
"type.builtin",
|
||||||
'type.qualifier',
|
"type.qualifier",
|
||||||
'type',
|
"type",
|
||||||
'variable.builtin',
|
"variable.builtin",
|
||||||
'variable.special',
|
"variable.special",
|
||||||
'variable'
|
"variable",
|
||||||
]
|
]
|
@ -24,7 +24,5 @@
|
|||||||
"useUnknownInCatchVariables": false,
|
"useUnknownInCatchVariables": false,
|
||||||
"baseUrl": "."
|
"baseUrl": "."
|
||||||
},
|
},
|
||||||
"exclude": [
|
"exclude": ["node_modules"]
|
||||||
"node_modules"
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user