Export styles from ansi-styles (#567)

Author: LitoMore

readme.md

@@ -210,19 +210,19 @@ Explicit 256/Truecolor mode can be enabled using the `--color=256` and `--color=
 
 `chalkStderr` contains a separate instance configured with color support detected for `stderr` stream instead of `stdout`. Override rules from `supportsColor` apply to this too. `supportsColorStderr` is exposed for convenience.
 
-### modifiers, foregroundColors, backgroundColors, and colors
+### modifierNames, foregroundColorNames, backgroundColorNames, and colorNames
 
-All supported style strings are exposed as an array of strings for convenience. `colors` is the combination of `foregroundColors` and `backgroundColors`.
+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 wrap Chalk and need to validate input:
 
 ```js
-import {modifiers, foregroundColors} from 'chalk';
+import {modifierNames, foregroundColorNames} from 'chalk';
 
-console.log(modifiers.includes('bold'));
+console.log(modifierNames.includes('bold'));
 //=> true
 
-console.log(foregroundColors.includes('pink'));
+console.log(foregroundColorNames.includes('pink'));
 //=> false
 ```
 

source/index.d.ts

@@ -1,45 +1,9 @@
 // TODO: Make it this when TS suports that.
+// import {ModifierName, ForegroundColor, BackgroundColor, ColorName} from '#ansi-styles';
 // import {ColorInfo, ColorSupportLevel} from '#supports-color';
+import {ModifierName, ForegroundColorName, BackgroundColorName, ColorName} from './vendor/ansi-styles/index.js';
 import {ColorInfo, ColorSupportLevel} from './vendor/supports-color/index.js';
 
-type BasicColor = 'black' | 'red' | 'green' | 'yellow' | 'blue' | 'magenta' | 'cyan' | 'white';
-type BrightColor = `${BasicColor}Bright`;
-type Grey = 'gray' | 'grey';
-
-/**
-Basic foreground colors.
-
-[More colors here.](https://github.com/chalk/chalk/blob/main/readme.md#256-and-truecolor-color-support)
-*/
-
-export type ForegroundColor = BasicColor | BrightColor | Grey;
-
-/**
-Basic background colors.
-
-[More colors here.](https://github.com/chalk/chalk/blob/main/readme.md#256-and-truecolor-color-support)
-*/
-export type BackgroundColor = `bg${Capitalize<ForegroundColor>}`;
-
-/**
-Basic colors.
-
-[More colors here.](https://github.com/chalk/chalk/blob/main/readme.md#256-and-truecolor-color-support)
-*/
-export type Color = ForegroundColor | BackgroundColor;
-
-export type Modifiers =
-	| 'reset'
-	| 'bold'
-	| 'dim'
-	| 'italic'
-	| 'underline'
-	| 'overline'
-	| 'inverse'
-	| 'hidden'
-	| 'strikethrough'
-	| 'visible';
-
 export interface Options {
 	/**
 	Specify the color support for Chalk.
@@ -277,16 +241,80 @@ export const supportsColor: ColorInfo;
 export const chalkStderr: typeof chalk;
 export const supportsColorStderr: typeof supportsColor;
 
+export {
+	ModifierName, ForegroundColorName, BackgroundColorName, ColorName,
+	modifierNames, foregroundColorNames, backgroundColorNames, colorNames,
+// } from '#ansi-styles';
+} from './vendor/ansi-styles/index.js';
+
 export {
 	ColorInfo,
 	ColorSupport,
 	ColorSupportLevel,
 // } from '#supports-color';
 } from './vendor/supports-color/index.js';
 
+// TODO: Remove these aliases in the next major version
+/**
+@deprecated Use `ModifierName` instead.
+
+Basic modifier names.
+*/
+export type Modifiers = ModifierName;
+
+/**
+@deprecated Use `ForegroundColorName` instead.
+
+Basic foreground color names.
+
+[More colors here.](https://github.com/chalk/chalk/blob/main/readme.md#256-and-truecolor-color-support)
+*/
+export type ForegroundColor = ForegroundColorName;
+
+/**
+@deprecated Use `BackgroundColorName` instead.
+
+Basic background color names.
+
+[More colors here.](https://github.com/chalk/chalk/blob/main/readme.md#256-and-truecolor-color-support)
+*/
+export type BackgroundColor = BackgroundColorName;
+
+/**
+@deprecated Use `ColorName` instead.
+
+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 Color = ColorName;
+
+/**
+@deprecated Use `modifierNames` instead.
+
+Basic modifier names.
+*/
 export const modifiers: readonly Modifiers[];
+
+/**
+@deprecated Use `foregroundColorNames` instead.
+
+Basic foreground color names.
+*/
 export const foregroundColors: readonly ForegroundColor[];
+
+/**
+@deprecated Use `backgroundColorNames` instead.
+
+Basic background color names.
+*/
 export const backgroundColors: readonly BackgroundColor[];
+
+/**
+@deprecated Use `colorNames` instead.
+
+Basic color names. The combination of foreground and background color names.
+*/
 export const colors: readonly Color[];
 
 export default chalk;

source/index.js

@@ -204,14 +204,22 @@ Object.defineProperties(createChalk.prototype, styles);
 const chalk = createChalk();
 export const chalkStderr = createChalk({level: stderrColor ? stderrColor.level : 0});
 
+export {
+	modifierNames,
+	foregroundColorNames,
+	backgroundColorNames,
+	colorNames,
+
+	// TODO: Remove these aliases in the next major version
+	modifierNames as modifiers,
+	foregroundColorNames as foregroundColors,
+	backgroundColorNames as backgroundColors,
+	colorNames as colors,
+} from './vendor/ansi-styles/index.js';
+
 export {
 	stdoutColor as supportsColor,
 	stderrColor as supportsColorStderr,
 };
 
-export const modifiers = Object.keys(ansiStyles.modifier);
-export const foregroundColors = Object.keys(ansiStyles.color);
-export const backgroundColors = Object.keys(ansiStyles.bgColor);
-export const colors = [...foregroundColors, ...backgroundColors];
-
 export default chalk;

source/index.test-d.ts

@@ -1,5 +1,9 @@
-import {expectType, expectAssignable, expectError} from 'tsd';
-import chalk, {Chalk, ChalkInstance, Color, ColorInfo, ColorSupport, ColorSupportLevel, chalkStderr, supportsColor, supportsColorStderr} from './index.js';
+import {expectType, expectAssignable, expectError, expectDeprecated} from 'tsd';
+import chalk, {
+	Chalk, ChalkInstance, ColorInfo, ColorSupport, ColorSupportLevel, chalkStderr, supportsColor, supportsColorStderr,
+	ModifierName, ForegroundColorName, BackgroundColorName, ColorName,
+	Modifiers,
+} from './index.js';
 
 // - supportsColor -
 expectType<ColorInfo>(supportsColor);
@@ -141,6 +145,20 @@ expectType<string>(chalk.underline``);
 expectType<string>(chalk.red.bgGreen.bold`Hello {italic.blue ${name}}`);
 expectType<string>(chalk.strikethrough.cyanBright.bgBlack`Works with {reset {bold numbers}} {bold.red ${1}}`);
 
-// -- Color types ==
-expectAssignable<Color>('red');
-expectError<Color>('hotpink');
+// -- Modifiers types
+expectAssignable<ModifierName>('strikethrough');
+expectError<ModifierName>('delete');
+
+// -- Foreground types
+expectAssignable<ForegroundColorName>('red');
+expectError<ForegroundColorName>('pink');
+
+// -- Background types
+expectAssignable<BackgroundColorName>('bgRed');
+expectError<BackgroundColorName>('bgPink');
+
+// -- Color types --
+expectAssignable<ColorName>('red');
+expectAssignable<ColorName>('bgRed');
+expectError<ColorName>('hotpink');
+expectError<ColorName>('bgHotpink');

source/vendor/ansi-styles/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;

source/vendor/ansi-styles/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)) {
@@ -129,12 +128,12 @@ function assembleStyles() {
 		},
 		hexToRgb: {
 			value(hex) {
-				const matches = /(?<colorString>[a-f\d]{6}|[a-f\d]{3})/i.exec(hex.toString(16));
+				const matches = /[a-f\d]{6}|[a-f\d]{3}/i.exec(hex.toString(16));
 				if (!matches) {
 					return [0, 0, 0];
 				}
 
-				let {colorString} = matches.groups;
+				let [colorString] = matches;
 
 				if (colorString.length === 3) {
 					colorString = [...colorString].map(character => character + character).join('');
@@ -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];