release v2.0.0

.editorconfig

@@ -9,6 +9,6 @@ trim_trailing_whitespace = true
 indent_size = 2
 tab_width = 2
 
-[{*.htm,*.html,*.pug,*.md}]
+[{*.htm,*.html,*.md}]
 indent_size = 2
 tab_width = 2

.github/workflows/test.yml

@@ -14,8 +14,8 @@ jobs:
   integration:
     strategy:
       matrix:
-        os: [ubuntu-latest]
-        node-version: [12, 14, 16, 18, 20]
+        os: [ ubuntu-latest ]
+        node-version: [ 14, 16, 18, 20 ]
 
     runs-on: ${{ matrix.os }}
     steps:

CHANGELOG.md

@@ -1,5 +1,21 @@
 # Change log
 
+## 2.0.0 (2023-11-03)
+
+- feat: add supports the Deno
+- feat: add supports the Next.js `edge` runtime
+- feat(CHANGE): add named import for `ansis`:\
+  NEW named import: `import { red } from 'ansis'`.\
+  If you use `TypeScript` and your IDE show the error: `TS2307: Cannot find module ansis/colors`,\
+  then you should use the new syntax,
+  update you code: `import { red } from 'ansis/colors'` --> `import { red } from 'ansis'`.
+- feat(DEPRECATE): OLD named import `import { red } from 'ansis/colors'` is deprecated, use the NEW named import
+- feat(DEPRECATE): instead of the `ansi` use `ansi256` or alias `fg`
+- feat(DEPRECATE): instead of the `bgAnsi` use `bgAnsi256` or alias `bg`
+- feat: optimize named export
+- feat: reduce the size of dist/ directory
+- chore: update dev dependencies, new jest requires node.js >= 14
+
 ## 1.6.0-beta.0 (2023-11-01)
 
 - feat: add supports the Deno

README.md

@@ -32,17 +32,18 @@ and [benchmarks](https://github.com/webdiscus/ansis#benchmark) of most popular N
 
 [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/stackblitz-starters-gs2gve?file=index.js)
 
-## Highlights
+## 💡 Highlights
 
 - supports both **ESM** and **CommonJS**
 - supports **Deno**, **Next.JS** runtime
-- up to **x3.5 faster** than **chalk**, [see benchmarks](#benchmark)
-- dist code is only **5 KB** incl. named import for ESM and CommonJS
+- up to **x3 faster** than **chalk**, [see benchmarks](#benchmark)
+- dist code is only **5 KB** incl. named import of all styles
 - [standard API](#base-colors) like **chalk**
-- default and [named import](#named-import) `import { red, bold, rgb } from 'ansis/colors'`
-- [chained syntax](#chained-syntax) `red.bold('text')`
+- default import `import ansis from 'ansis'`, usage `ansis.red('error')`
+- [named import](#named-import) `import { red } from 'ansis'`, usage ``` red('error') ```
+- [chained syntax](#chained-syntax) `red.bold.underline('text')`
 - [nested **template strings**](#nested-syntax) ``` red`R ${green`G`} R` ```
-- [ANSI 256 colors](#256-colors) and [Truecolor](#truecolor) (**RGB**, **HEX**)
+- [ANSI 256 colors](#256-colors) and [Truecolor](#truecolor) (**RGB**, **HEX**) ``` rgb(224, 17, 95)`Ruby` ```, ``` hex('#96C')`Amethyst` ```
 - [extending of base colors](#extend-colors) with named **truecolors**
 - [ANSI codes](#escape-codes) as `open` and `close` property for each
   style ``` `Hello ${red.open}World${red.close}!` ```
@@ -53,6 +54,11 @@ and [benchmarks](https://github.com/webdiscus/ansis#benchmark) of most popular N
 - **TypeScript** friendly
 - zero dependencies
 
+## ❓Question / Feature Request / Bug
+
+If you have discovered a bug or have a feature suggestion, feel free to create
+an [issue](https://github.com/webdiscus/ansis/issues) on GitHub.
+
 <a id="install" name="install" href="#install"></a>
 
 ## Install
@@ -63,21 +69,20 @@ npm install ansis
 
 ## Usage
 
-You can import module and named colors with ESM or CommonJS syntax.
+You can import default module or named colors with ESM or CommonJS syntax.
 
 ```js
-// ESM
+// ESM default import
 import ansis from 'ansis';
-import { red, green, blue } from 'ansis/colors';
+// ESM named import
+import { red, green, blue } from 'ansis';
 
-// CommonJS
+// CommonJS default import
 const ansis = require('ansis');
-const { red, green, blue } = require('ansis/colors');
+// CommonJS named import
+const { red, green, blue } = require('ansis');
 
-// default import
-console.log(ansis.green(`Success!`));
-
-// named import
+console.log(ansis.green('Success!'));
 console.log(green('Success!'));
 
 // template string
@@ -94,7 +99,7 @@ console.log(red`The ${blue.underline`file.js`} not found!`);
 Basic example `Hello World!`:
 
 ```js
-import { red, black, inverse, reset } from 'ansis/colors';
+import { red, black, inverse, reset } from 'ansis';
 
 console.log(green`Hello ${inverse`ANSI`} World!
 ${black.bgYellow`Warning:`} ${cyan`/path/to/file.js`} ${red`not found!`}`);
@@ -122,7 +127,7 @@ You can import named colors, styles and functions. All imported colors and style
 
 ```js
 // named import
-import { red, hex, italic } from 'ansis/colors';
+import { red, hex, italic } from 'ansis';
 
 red.bold('text');
 ```
@@ -137,7 +142,7 @@ The `template literals` allow you to make a complex template more readable and s
 The `function syntax` can be used to colorize a variable.
 
 ```js
-import { red } from 'ansis/colors';
+import { red } from 'ansis';
 
 let message = 'error';
 
@@ -153,7 +158,7 @@ red`text ${message} text`;
 All colors, styles and functions are chainable. Each color or style can be combined in any order.
 
 ```js
-import { red, bold, italic, hex } from 'ansis/colors';
+import { red, bold, italic, hex } from 'ansis';
 
 red.bold`text`;
 hex('#FF75D1').bgCyan.bold`text`;
@@ -171,15 +176,15 @@ None of the other libraries (chalk, kleur, colorette, colors.js etc.) support ne
 Nested template strings:
 
 ```js
-import { red, green } from 'ansis/colors';
+import { red, green } from 'ansis';
 
 red`red ${green`green`} red`;
 ```
 
 Deep nested chained styles:
 
 ```js
-import { red, green, cyan, magenta, yellow, italic, underline } from 'ansis/colors';
+import { red, green, cyan, magenta, yellow, italic, underline } from 'ansis';
 
 red(`red ${italic(`red italic ${underline(`red italic underline`)}`)} red`);
 
@@ -201,7 +206,7 @@ Output:\
 Multiline nested template strings:
 
 ```js
-import { red, green, hex, visible, inverse } from 'ansis/colors';
+import { red, green, hex, visible, inverse } from 'ansis';
 
 // defined a truecolor as the constant
 const orange = hex('#FFAB40');
@@ -324,7 +329,7 @@ Background function: `bgAnsi256(code)` has short alias `bg(code)`
 See [ANSI color codes](https://en.wikipedia.org/wiki/ANSI_escape_code#8-bit).
 
 ```js
-import { bold, ansi256, fg, bgAnsi256, bg } from 'ansis/colors';
+import { bold, ansi256, fg, bgAnsi256, bg } from 'ansis';
 
 // foreground color
 ansi256(96)`Bright Cyan`;
@@ -355,7 +360,7 @@ Foreground function: `hex()` `rgb()`\
 Background function: `bgHex()` `bgRgb()`
 
 ```js
-import { bold, hex, rgb, bgHex, bgRgb } from 'ansis/colors';
+import { bold, hex, rgb, bgHex, bgRgb } from 'ansis';
 
 // foreground color
 hex('#E0115F').bold`bold Ruby`;
@@ -379,7 +384,7 @@ You can use the [ANSI escape codes](https://en.wikipedia.org/wiki/ANSI_escape_co
 and `close` properties for each style.
 
 ```js
-import { red, bold } from 'ansis/colors';
+import { red, bold } from 'ansis';
 
 // each style has `open` and `close` properties
 console.log(`Hello ${red.open}ANSI${red.close} World!`);
@@ -412,7 +417,7 @@ The variable `string` will contain the pure string without ANSI codes.
 Supports correct style break at the `end of line`.
 
 ```js
-import { bgGreen } from 'ansis/colors';
+import { bgGreen } from 'ansis';
 
 console.log(bgGreen`\nAnsis\nNew Line\nNext New Line\n`);
 ```

bench/index.js

@@ -1,7 +1,7 @@
 //
 // ATTENTION !!! ACHTUNG !!! MEGA ULTRA IMPORTANT !!! WICHTIG !!!
 //
-// For a correct measures, DO NOT use the same function instance inside the added benchmark:
+// For the correct measures, DO NOT use the same function instance inside the added benchmark:
 // bench('Benchmark')
 //   .add('bench1', () => anyFixture(arg1)) // <== only first measure of `anyFixture()` will be correct
 //   .add('bench2', () => anyFixture(arg2)) // <== second and next measures of same function will be WRONG!
@@ -38,12 +38,11 @@ import colorCli from 'colors-cli/lib/color-safe.js';
 import kleur from 'kleur';
 import * as kleurColors from 'kleur/colors';
 import picocolors from 'picocolors';
-import { Ansis } from '../src/index.js';
-import { green, red, yellow, hex } from '../src/colors.mjs';
+import { Ansis, green, red, yellow, hex } from 'ansis';
 
 const log = console.log;
 
-// create new instance of Ansis for correct measure in benchmark
+// create a new instance of Ansis for correct measure in benchmark
 const ansis = new Ansis();
 
 // All vendor libraries to be tested
@@ -76,6 +75,8 @@ const baseColors = ['black', 'red', 'green', 'yellow', 'blue', 'magenta', 'cyan'
 
 let fixture = [];
 
+log(hex('#F88').inverse.bold` -= Benchmark =- `);
+
 //showSupportOfDeepNestedStyling();
 //showSupportOfDeepNestedChainedStyling();
 //showSupportOfBreakStyleAtNewLine();
@@ -229,11 +230,11 @@ bench('Template literals').
   add('ansis', () => red`red ${yellow`yellow ${green`green`} yellow`} red`).
   run();
 
-function coloretteBench (c) {
+function coloretteBench(c) {
   return c.red(`${c.bold(`${c.cyan(`${c.yellow('yellow')}cyan`)}`)}red`);
 }
 
-function nestedFixture (c) {
+function nestedFixture(c) {
   return c.red(
     `a red ${c.white('white')} red ${c.red('red')} red ${c.cyan('cyan')} red ${c.black('black')} red ${c.red(
       'red',
@@ -257,7 +258,7 @@ function nestedFixture (c) {
   );
 }
 
-function deepNestedFixture (c) {
+function deepNestedFixture(c) {
   return c.green(
     `green ${c.cyan(
       `cyan ${c.red(
@@ -271,15 +272,15 @@ function deepNestedFixture (c) {
   );
 }
 
-function complexNestedFixture (c) {
+function complexNestedFixture(c) {
   return c.red(
     `red ${c.yellow('yellow')} red ${c.italic.cyan('italic cyan')} red ${c.underline.green(
       `underline green ${c.yellow('underline yellow')} underline green`,
     )} red ${c.cyan('cyan')} red ${c.bold.yellow('bold yellow')} red ${c.green('green')} red`,
   );
 }
 
-function showSupportOfDeepNestedStyling () {
+function showSupportOfDeepNestedStyling() {
   log('colors.js: ', deepNestedFixture(colorsJs));
   log('colorette: ', deepNestedFixture(colorette));
   log('picocolors: ', deepNestedFixture(picocolors));
@@ -292,12 +293,12 @@ function showSupportOfDeepNestedStyling () {
   log('ansis: ', deepNestedFixture(ansis));
 }
 
-function showSupportOfDeepNestedChainedStyling () {
+function showSupportOfDeepNestedChainedStyling() {
   log('chalk: ', complexNestedFixture(chalk));
   log('ansis: ', complexNestedFixture(ansis));
 }
 
-function showSupportOfBreakStyleAtNewLine () {
+function showSupportOfBreakStyleAtNewLine() {
   log('colors.js: ', colorsJs.bgGreen(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`)); // OK
   log('colorette: ', colorette.bgGreen(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`)); // (not supported)
   log('picocolors: ', picocolors.bgGreen(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`)); // (not supported)

bench/package.json

@@ -8,6 +8,7 @@
   },
   "dependencies": {
     "ansi-colors": "4.1.1",
+    "ansis": "file:../dist",
     "benchmark": "2.1.4",
     "chalk": "5.0.0",
     "cli-color": "2.0.1",

examples/ansi256.js

@@ -1,4 +1,4 @@
-import { fg, bg } from '../src/colors.mjs';
+import { fg, bg } from '../src/index.js';
 
 let out;
 let n;
@@ -66,4 +66,4 @@ for (let i = 232; i <= 255; i++) {
 }
 
 //console.log(out);
-export { out as ansi256Table }
+export { out as ansi256Table };

examples/ansis-logo.js

@@ -17,7 +17,7 @@ const colorizeASCII = ({ ascii, data }, paddingLeft = 5) => {
       for (let charWidthIdx = 0; charWidthIdx < width; charWidthIdx++) {
         char = ascii[i++];
         code = Array.isArray(codes) ? codes[row] : codes + row;
-        out += ansis.ansi(code)(char);
+        out += ansis.ansi256(code)(char);
       }
     }
     row++;
@@ -45,7 +45,6 @@ const logo = {
   ],
 };
 
-
-let out = colorizeASCII(logo, 5)
+let out = colorizeASCII(logo, 5);
 
 export { out as ansisLogo };

examples/ansis-styles-demo.js

@@ -15,13 +15,18 @@ import {
   underline,
   white, whiteBright,
   yellow, yellowBright,
-} from '../src/colors.mjs';
+} from '../src/index.js';
 
-const out = `${bold`bold`} ${dim`dim`} ${italic`italic`} ${underline`underline`} ${strikethrough`strikethrough`} ${inverse`inverse`} ${bold.italic.underline.strike`bold italic  underline strike`}` + '\n' +
-  `${red`red`} ${green`green`} ${yellow`yellow`} ${blue`blue`} ${magenta`magenta`} ${cyan`cyan`} ${white`white`} ${gray`gray`} ${bold.yellow`bold yellow`} ${dim.cyan`dim cyan`} ${red.italic`italic red`} ` + '\n' +
-  `${black.bgRed`bgRed`} ${black.bgGreen`bgGreen`} ${black.bgYellow`bgYellow`} ${bgBlue`bgBlue`} ${black.bgMagenta`bgMagenta`} ${black.bgCyan`bgCyan`} ${black.bgWhite`bgWhite`} ${black.bgRedBright`bgRedBright`} ${white.bgRed.bold.italic` CocaCola `}` + '\n' +
-  `${greenBright`greenBright`} ${yellowBright`yellowBright`} ${blueBright`blueBright`} ${magentaBright`magentaBright`} ${cyanBright`cyanBright`} ${whiteBright`whiteBright`} ${greenBright`A`}${magentaBright`N`}${yellowBright`S`}${redBright`I`}` + '\n' +
-  `${black.bgGreenBright`bgGreenBright`} ${black.bgYellowBright`bgYellowBright`} ${bgBlueBright`bgBlueBright`} ${black.bgMagentaBright`bgMagentaBright`} ${black.bgCyanBright`bgCyanBright`} ${magentaBright.bgGreenBright`C`}${greenBright.bgMagentaBright`O`}${redBright.bgYellowBright`L`}${yellowBright.bgRedBright`O`}${redBright.bgCyanBright`R`}${yellowBright.bgBlueBright`S`}` + '\n' +
+const out = `${bold`bold`} ${dim`dim`} ${italic`italic`} ${underline`underline`} ${strikethrough`strikethrough`} ${inverse`inverse`} ${bold.italic.underline.strike`bold italic  underline strike`}` +
+  '\n' +
+  `${red`red`} ${green`green`} ${yellow`yellow`} ${blue`blue`} ${magenta`magenta`} ${cyan`cyan`} ${white`white`} ${gray`gray`} ${bold.yellow`bold yellow`} ${dim.cyan`dim cyan`} ${red.italic`italic red`} ` +
+  '\n' +
+  `${black.bgRed`bgRed`} ${black.bgGreen`bgGreen`} ${black.bgYellow`bgYellow`} ${bgBlue`bgBlue`} ${black.bgMagenta`bgMagenta`} ${black.bgCyan`bgCyan`} ${black.bgWhite`bgWhite`} ${black.bgRedBright`bgRedBright`} ${white.bgRed.bold.italic` CocaCola `}` +
+  '\n' +
+  `${greenBright`greenBright`} ${yellowBright`yellowBright`} ${blueBright`blueBright`} ${magentaBright`magentaBright`} ${cyanBright`cyanBright`} ${whiteBright`whiteBright`} ${greenBright`A`}${magentaBright`N`}${yellowBright`S`}${redBright`I`}` +
+  '\n' +
+  `${black.bgGreenBright`bgGreenBright`} ${black.bgYellowBright`bgYellowBright`} ${bgBlueBright`bgBlueBright`} ${black.bgMagentaBright`bgMagentaBright`} ${black.bgCyanBright`bgCyanBright`} ${magentaBright.bgGreenBright`C`}${greenBright.bgMagentaBright`O`}${redBright.bgYellowBright`L`}${yellowBright.bgRedBright`O`}${redBright.bgCyanBright`R`}${yellowBright.bgBlueBright`S`}` +
+  '\n' +
   [
     '#d93611',
     '#d97511',
@@ -52,7 +57,7 @@ const out = `${bold`bold`} ${dim`dim`} ${italic`italic`} ${underline`underline`}
     ' 141 ',
     '  98 ',
     '  92 ',
-  ].reduce((out, code) => out + black.bgAnsi(parseInt(code, 10))(code), '') +
+  ].reduce((out, code) => out + black.bgAnsi256(parseInt(code, 10))(code), '') +
   '\n ';
 
 export { out as ansisStylesDemo };

examples/index.js

@@ -2,9 +2,8 @@
 
 import chalk from 'chalk';
 
-import ansis, { Ansis } from '../src/index.js';
-import {
-  red,
+import ansis, {
+  Ansis, red,
   green,
   blue,
   cyan,
@@ -17,7 +16,7 @@ import {
   inverse,
   visible,
   hex,
-} from '../src/colors.mjs';
+} from '../src/index.js';
 
 import { ansi256Table } from './ansi256.js';
 import { ansisLogo } from './ansis-logo.js';