From c42702811f7c205b696c7042ce4d4caa93bbc655 Mon Sep 17 00:00:00 2001 From: LitoMore Date: Tue, 11 Oct 2022 16:39:17 +0800 Subject: [PATCH] Expose style names (#82) Co-authored-by: Sindre Sorhus --- index.d.ts | 46 ++++++++++++++++++ index.js | 124 +++++++++++++++++++++++++----------------------- index.test-d.ts | 22 ++++++++- readme.md | 18 +++++++ 4 files changed, 148 insertions(+), 62 deletions(-) diff --git a/index.d.ts b/index.d.ts index 7518d2a..58f133a 100644 --- a/index.d.ts +++ b/index.d.ts @@ -180,6 +180,52 @@ export interface ConvertColor { hexToAnsi(hex: string): number; } +/** +Basic modifier names. +*/ +export type ModifierName = keyof Modifier; + +/** +Basic foreground color names. + +[More colors here.](https://github.com/chalk/chalk/blob/main/readme.md#256-and-truecolor-color-support) +*/ +export type ForegroundColorName = keyof ForegroundColor; + +/** +Basic background color names. + +[More colors here.](https://github.com/chalk/chalk/blob/main/readme.md#256-and-truecolor-color-support) +*/ +export type BackgroundColorName = keyof BackgroundColor; + +/** +Basic color names. The combination of foreground and background color names. + +[More colors here.](https://github.com/chalk/chalk/blob/main/readme.md#256-and-truecolor-color-support) +*/ +export type ColorName = ForegroundColorName | BackgroundColorName; + +/** +Basic modifier names. +*/ +export const modifierNames: readonly ModifierName[]; + +/** +Basic foreground color names. +*/ +export const foregroundColorNames: readonly ForegroundColorName[]; + +/** +Basic background color names. +*/ +export const backgroundColorNames: readonly BackgroundColorName[]; + +/* +Basic color names. The combination of foreground and background color names. +*/ +export const colorNames: readonly ColorName[]; + declare const ansiStyles: { readonly modifier: Modifier; readonly color: ColorBase & ForegroundColor; diff --git a/index.js b/index.js index 30e3ba8..1d38d09 100644 --- a/index.js +++ b/index.js @@ -6,68 +6,67 @@ const wrapAnsi256 = (offset = 0) => code => `\u001B[${38 + offset};5;${code}m`; const wrapAnsi16m = (offset = 0) => (red, green, blue) => `\u001B[${38 + offset};2;${red};${green};${blue}m`; +const styles = { + modifier: { + reset: [0, 0], + // 21 isn't widely supported and 22 does the same thing + bold: [1, 22], + dim: [2, 22], + italic: [3, 23], + underline: [4, 24], + overline: [53, 55], + inverse: [7, 27], + hidden: [8, 28], + strikethrough: [9, 29], + }, + color: { + black: [30, 39], + red: [31, 39], + green: [32, 39], + yellow: [33, 39], + blue: [34, 39], + magenta: [35, 39], + cyan: [36, 39], + white: [37, 39], + + // Bright color + blackBright: [90, 39], + gray: [90, 39], // Alias of `blackBright` + grey: [90, 39], // Alias of `blackBright` + redBright: [91, 39], + greenBright: [92, 39], + yellowBright: [93, 39], + blueBright: [94, 39], + magentaBright: [95, 39], + cyanBright: [96, 39], + whiteBright: [97, 39], + }, + bgColor: { + bgBlack: [40, 49], + bgRed: [41, 49], + bgGreen: [42, 49], + bgYellow: [43, 49], + bgBlue: [44, 49], + bgMagenta: [45, 49], + bgCyan: [46, 49], + bgWhite: [47, 49], + + // Bright color + bgBlackBright: [100, 49], + bgGray: [100, 49], // Alias of `bgBlackBright` + bgGrey: [100, 49], // Alias of `bgBlackBright` + bgRedBright: [101, 49], + bgGreenBright: [102, 49], + bgYellowBright: [103, 49], + bgBlueBright: [104, 49], + bgMagentaBright: [105, 49], + bgCyanBright: [106, 49], + bgWhiteBright: [107, 49], + }, +}; + function assembleStyles() { const codes = new Map(); - const styles = { - modifier: { - reset: [0, 0], - // 21 isn't widely supported and 22 does the same thing - bold: [1, 22], - dim: [2, 22], - italic: [3, 23], - underline: [4, 24], - overline: [53, 55], - inverse: [7, 27], - hidden: [8, 28], - strikethrough: [9, 29], - }, - color: { - black: [30, 39], - red: [31, 39], - green: [32, 39], - yellow: [33, 39], - blue: [34, 39], - magenta: [35, 39], - cyan: [36, 39], - white: [37, 39], - - // Bright color - blackBright: [90, 39], - redBright: [91, 39], - greenBright: [92, 39], - yellowBright: [93, 39], - blueBright: [94, 39], - magentaBright: [95, 39], - cyanBright: [96, 39], - whiteBright: [97, 39], - }, - bgColor: { - bgBlack: [40, 49], - bgRed: [41, 49], - bgGreen: [42, 49], - bgYellow: [43, 49], - bgBlue: [44, 49], - bgMagenta: [45, 49], - bgCyan: [46, 49], - bgWhite: [47, 49], - - // Bright color - bgBlackBright: [100, 49], - bgRedBright: [101, 49], - bgGreenBright: [102, 49], - bgYellowBright: [103, 49], - bgBlueBright: [104, 49], - bgMagentaBright: [105, 49], - bgCyanBright: [106, 49], - bgWhiteBright: [107, 49], - }, - }; - - // Alias bright black as gray (and grey) - styles.color.gray = styles.color.blackBright; - styles.bgColor.bgGray = styles.bgColor.bgBlackBright; - styles.color.grey = styles.color.blackBright; - styles.bgColor.bgGrey = styles.bgColor.bgBlackBright; for (const [groupName, group] of Object.entries(styles)) { for (const [styleName, style] of Object.entries(group)) { @@ -217,3 +216,8 @@ function assembleStyles() { const ansiStyles = assembleStyles(); export default ansiStyles; + +export const modifierNames = Object.keys(styles.modifier); +export const foregroundColorNames = Object.keys(styles.color); +export const backgroundColorNames = Object.keys(styles.bgColor); +export const colorNames = [...foregroundColorNames, ...backgroundColorNames]; diff --git a/index.test-d.ts b/index.test-d.ts index 5b87ff4..8dc8e32 100644 --- a/index.test-d.ts +++ b/index.test-d.ts @@ -1,5 +1,5 @@ -import {expectType} from 'tsd'; -import ansiStyles, {CSPair} from './index.js'; +import {expectAssignable, expectError, expectType} from 'tsd'; +import ansiStyles, {CSPair, ModifierName, ForegroundColorName, BackgroundColorName, ColorName} from './index.js'; expectType>(ansiStyles.codes); @@ -118,3 +118,21 @@ expectType(ansiStyles.italic); expectType(ansiStyles.reset); expectType(ansiStyles.strikethrough); expectType(ansiStyles.underline); + +// --- ModifierName --- +expectAssignable('strikethrough'); +expectError('delete'); + +// --- ForegroundColorName --- +expectAssignable('blue'); +expectError('pink'); + +// --- ForegroundColorName --- +expectAssignable('bgBlue'); +expectError('bgPink'); + +// --- ColorName --- +expectAssignable('blue'); +expectAssignable('bgBlue'); +expectError('pink'); +expectError('bgPink'); diff --git a/readme.md b/readme.md index 37d9943..6d04183 100644 --- a/readme.md +++ b/readme.md @@ -32,8 +32,26 @@ console.log(`${styles.color.ansi16m(...styles.hexToRgb('#abcdef'))}Hello World${ ## API +### `open` and `close` + Each style has an `open` and `close` property. +### `modifierNames`, `foregroundColorNames`, `backgroundColorNames`, and `colorNames` + +All supported style strings are exposed as an array of strings for convenience. `colorNames` is the combination of `foregroundColorNames` and `backgroundColorNames`. + +This can be useful if you need to validate input: + +```js +import {modifierNames, foregroundColorNames} from 'ansi-styles'; + +console.log(modifierNames.includes('bold')); +//=> true + +console.log(foregroundColorNames.includes('pink')); +//=> false +``` + ## Styles ### Modifiers