From 2fa150676256efe4700ee38000beb0a6ec1390d6 Mon Sep 17 00:00:00 2001 From: Hammy <58985301+sgoudham@users.noreply.github.com> Date: Fri, 1 Nov 2024 23:06:34 +0000 Subject: [PATCH] feat(ansi): add `name` and `order` keys (#106) --- mod.ts | 70 ++++++++++++++++++++++++------------------ palette.json | 64 ++++++++++++++++++++++++++++++++++++++ scripts/gen_palette.ts | 8 ++++- 3 files changed, 111 insertions(+), 31 deletions(-) diff --git a/mod.ts b/mod.ts index 589c2a5..b04110a 100644 --- a/mod.ts +++ b/mod.ts @@ -8,7 +8,7 @@ const entriesFromObject = (obj: T): Entries => Object.entries(obj) as Entries; /** - * All flavor names of Catppuccin + * All flavor names of Catppuccin. */ export type FlavorName = "latte" | "frappe" | "macchiato" | "mocha"; @@ -60,121 +60,121 @@ type AnsiName = | "white"; /** - * All color names of Catppuccin + * All color names of Catppuccin. */ export type ColorName = AccentName | MonochromaticName; /** - * Generic to map type T to all Catppuccin color names + * Generic to map type T to all Catppuccin color names. */ export type Colors = Record; /** - * Generic to map type T to all ANSI color names + * Generic to map type T to all ANSI color names. */ export type AnsiColors = Record; /** - * A flavor of Catppuccin + * A flavor of Catppuccin. */ export type CatppuccinFlavor = Readonly<{ /** - * Name of the flavor + * Name of the flavor. */ name: string; /** - * Emoji associated with the flavor. Requires Unicode 13.0 (2020) or later to render + * Emoji associated with the flavor. Requires Unicode 13.0 (2020) or later to render. */ emoji: string; /** - * Order of the flavor in the palette spec + * Order of the flavor in the palette spec. */ order: number; /** - * Whether the flavor is a dark theme + * Whether the flavor is a dark theme. */ dark: boolean; /** - * An object containing all the colors of the flavor + * An object containing all the colors of the flavor. */ colors: CatppuccinColors; /** - * An object containing all the ANSI color mappings of the flavor + * An object containing all the ANSI color mappings of the flavor. */ ansiColors: CatppuccinAnsiColors; /** - * A typed Object.entries iterable of the colors of the flavor + * A typed Object.entries iterable of the colors of the flavor. */ colorEntries: Entries; /** - * A typed Object.entries iterable of the ANSI colors of the flavor + * A typed Object.entries iterable of the ANSI colors of the flavor. */ ansiColorEntries: Entries; }>; /** - * All colors of Catppuccin + * All colors of Catppuccin. */ export type CatppuccinColors = Readonly>; /** - * All ANSI color mappings of Catppuccin + * All ANSI color mappings of Catppuccin. */ export type CatppuccinAnsiColors = Readonly>; /** - * All flavors of Catppuccin + * All flavors of Catppuccin. */ export type CatppuccinFlavors = Flavors; export type Flavors = { /** - * Light variant + * Light variant. */ latte: T; /** - * Low-saturation, low-contrast dark variant + * Low-saturation, low-contrast dark variant. */ frappe: T; /** - * Mid-saturation, mid-contrast dark variant + * Mid-saturation, mid-contrast dark variant. */ macchiato: T; /** - * High-saturation, High-contrast dark variant + * High-saturation, High-contrast dark variant. */ mocha: T; }; export type ColorFormat = Readonly<{ /** - * Name of the color + * Name of the color. */ name: string; /** - * Order of the color in the palette spec + * Order of the color in the palette spec. */ order: number; /** - * String-formatted hex value + * String-formatted hex value. * @example "#babbf1" */ hex: string; /** - * Formatted rgb value + * Formatted rgb value. * @example { r: 186, g: 187, b: 241} */ rgb: { @@ -193,7 +193,7 @@ export type ColorFormat = Readonly<{ }; /** - * Formatted hsl value + * Formatted hsl value. * @example { h: 238.9, s: 12.1, l: 83.5 } */ hsl: { @@ -218,6 +218,16 @@ export type ColorFormat = Readonly<{ }>; export type AnsiColorGroups = Readonly<{ + /** + * Name of the ANSI color. + */ + name: string; + + /** + * Order of the ANSI color in the palette spec. + */ + order: number; + /** * An object containing all the ANSI "normal" colors, which are the 8 standard colors from 0 to 7. */ @@ -233,13 +243,13 @@ export type AnsiColorGroups = Readonly<{ export type AnsiColorFormat = Readonly<{ /** - * String-formatted hex value + * String-formatted hex value. * @example "#babbf1" */ hex: string; /** - * The ANSI color code + * The ANSI color code. * @example 4 */ code: number; @@ -248,12 +258,12 @@ export type AnsiColorFormat = Readonly<{ const { version: _, ...jsonFlavors } = definitions; /** - * The version of the Catppuccin palette + * The version of the Catppuccin palette. */ export const version = definitions.version; /** - * All flavors of Catppuccin + * All flavors of Catppuccin. */ export const flavors: CatppuccinFlavors = entriesFromObject( jsonFlavors, @@ -267,7 +277,7 @@ export const flavors: CatppuccinFlavors = entriesFromObject( }, {} as CatppuccinFlavors); /** - * A typed `Object.entries()` iterable of all Catppuccin flavors + * A typed `Object.entries()` iterable of all Catppuccin flavors. */ export const flavorEntries: Entries = entriesFromObject( flavors, diff --git a/palette.json b/palette.json index caae2d4..8edd3b2 100644 --- a/palette.json +++ b/palette.json @@ -425,6 +425,8 @@ }, "ansiColors": { "black": { + "name": "Black", + "order": 0, "normal": { "hex": "#5c5f77", "code": 0 @@ -435,6 +437,8 @@ } }, "red": { + "name": "Red", + "order": 1, "normal": { "hex": "#d20f39", "code": 1 @@ -445,6 +449,8 @@ } }, "green": { + "name": "Green", + "order": 2, "normal": { "hex": "#40a02b", "code": 2 @@ -455,6 +461,8 @@ } }, "yellow": { + "name": "Yellow", + "order": 3, "normal": { "hex": "#df8e1d", "code": 3 @@ -465,6 +473,8 @@ } }, "blue": { + "name": "Blue", + "order": 4, "normal": { "hex": "#1e66f5", "code": 4 @@ -475,6 +485,8 @@ } }, "magenta": { + "name": "Magenta", + "order": 5, "normal": { "hex": "#ea76cb", "code": 5 @@ -485,6 +497,8 @@ } }, "cyan": { + "name": "Cyan", + "order": 6, "normal": { "hex": "#179299", "code": 6 @@ -495,6 +509,8 @@ } }, "white": { + "name": "White", + "order": 7, "normal": { "hex": "#acb0be", "code": 7 @@ -931,6 +947,8 @@ }, "ansiColors": { "black": { + "name": "Black", + "order": 0, "normal": { "hex": "#51576d", "code": 0 @@ -941,6 +959,8 @@ } }, "red": { + "name": "Red", + "order": 1, "normal": { "hex": "#e78284", "code": 1 @@ -951,6 +971,8 @@ } }, "green": { + "name": "Green", + "order": 2, "normal": { "hex": "#a6d189", "code": 2 @@ -961,6 +983,8 @@ } }, "yellow": { + "name": "Yellow", + "order": 3, "normal": { "hex": "#e5c890", "code": 3 @@ -971,6 +995,8 @@ } }, "blue": { + "name": "Blue", + "order": 4, "normal": { "hex": "#8caaee", "code": 4 @@ -981,6 +1007,8 @@ } }, "magenta": { + "name": "Magenta", + "order": 5, "normal": { "hex": "#f4b8e4", "code": 5 @@ -991,6 +1019,8 @@ } }, "cyan": { + "name": "Cyan", + "order": 6, "normal": { "hex": "#81c8be", "code": 6 @@ -1001,6 +1031,8 @@ } }, "white": { + "name": "White", + "order": 7, "normal": { "hex": "#a5adce", "code": 7 @@ -1437,6 +1469,8 @@ }, "ansiColors": { "black": { + "name": "Black", + "order": 0, "normal": { "hex": "#494d64", "code": 0 @@ -1447,6 +1481,8 @@ } }, "red": { + "name": "Red", + "order": 1, "normal": { "hex": "#ed8796", "code": 1 @@ -1457,6 +1493,8 @@ } }, "green": { + "name": "Green", + "order": 2, "normal": { "hex": "#a6da95", "code": 2 @@ -1467,6 +1505,8 @@ } }, "yellow": { + "name": "Yellow", + "order": 3, "normal": { "hex": "#eed49f", "code": 3 @@ -1477,6 +1517,8 @@ } }, "blue": { + "name": "Blue", + "order": 4, "normal": { "hex": "#8aadf4", "code": 4 @@ -1487,6 +1529,8 @@ } }, "magenta": { + "name": "Magenta", + "order": 5, "normal": { "hex": "#f5bde6", "code": 5 @@ -1497,6 +1541,8 @@ } }, "cyan": { + "name": "Cyan", + "order": 6, "normal": { "hex": "#8bd5ca", "code": 6 @@ -1507,6 +1553,8 @@ } }, "white": { + "name": "White", + "order": 7, "normal": { "hex": "#a5adcb", "code": 7 @@ -1943,6 +1991,8 @@ }, "ansiColors": { "black": { + "name": "Black", + "order": 0, "normal": { "hex": "#45475a", "code": 0 @@ -1953,6 +2003,8 @@ } }, "red": { + "name": "Red", + "order": 1, "normal": { "hex": "#f38ba8", "code": 1 @@ -1963,6 +2015,8 @@ } }, "green": { + "name": "Green", + "order": 2, "normal": { "hex": "#a6e3a1", "code": 2 @@ -1973,6 +2027,8 @@ } }, "yellow": { + "name": "Yellow", + "order": 3, "normal": { "hex": "#f9e2af", "code": 3 @@ -1983,6 +2039,8 @@ } }, "blue": { + "name": "Blue", + "order": 4, "normal": { "hex": "#89b4fa", "code": 4 @@ -1993,6 +2051,8 @@ } }, "magenta": { + "name": "Magenta", + "order": 5, "normal": { "hex": "#f5c2e7", "code": 5 @@ -2003,6 +2063,8 @@ } }, "cyan": { + "name": "Cyan", + "order": 6, "normal": { "hex": "#94e2d5", "code": 6 @@ -2013,6 +2075,8 @@ } }, "white": { + "name": "White", + "order": 7, "normal": { "hex": "#a6adc8", "code": 7 diff --git a/scripts/gen_palette.ts b/scripts/gen_palette.ts index a26d27f..878caa0 100644 --- a/scripts/gen_palette.ts +++ b/scripts/gen_palette.ts @@ -288,6 +288,7 @@ const formatted = entriesFromObject(definitions).reduce( (acc, [colorName, color], currentIndex) => { const { r, g, b } = tinycolor(color).toRgb(); const { h, s, l } = tinycolor(color).toHsl(); + acc[colorName] = { name: prettyNames[currentIndex], order: currentIndex, @@ -296,11 +297,12 @@ const formatted = entriesFromObject(definitions).reduce( hsl: { h, s, l }, accent: accents.includes(colorName), }; + return acc; }, {} as Writeable, ), - ansiColors: entriesFromObject(ansiMappings).reduce((acc, [name, props]) => { + ansiColors: entriesFromObject(ansiMappings).reduce((acc, [name, props], currentIndex) => { const mapping = props.normal.mapping as ColorName; let normalColorHex = flavor.colors[mapping]; let brightColorHex: string; @@ -318,7 +320,10 @@ const formatted = entriesFromObject(definitions).reduce( brightColor.lch.h += 2; brightColorHex = brightColor.toString({ format: "hex" }); } + acc[name] = { + name: name[0].toUpperCase() + name.substring(1).toLowerCase(), + order: currentIndex, normal: { hex: normalColorHex, code: props.normal.code, @@ -328,6 +333,7 @@ const formatted = entriesFromObject(definitions).reduce( code: props.bright.code, }, }; + return acc; }, {} as Writeable), };