npm - @thi.ng/text-canvas - Versions diffs - 1.1.4 → 2.0.4 - Mend

@thi.ng/text-canvas 1.1.4 → 2.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (34) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -3,7 +3,7 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
-## [1.1.4](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@1.1.3...@thi.ng/text-canvas@1.1.4) (2021-09-03)
+## [2.0.4](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@2.0.3...@thi.ng/text-canvas@2.0.4) (2021-10-25)
 **Note:** Version bump only for package @thi.ng/text-canvas
@@ -11,146 +11,123 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
-# [1.1.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@1.0.3...@thi.ng/text-canvas@1.1.0) (2021-08-13)
+## [2.0.3](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@2.0.2...@thi.ng/text-canvas@2.0.3) (2021-10-15)
-### Features
-* **text-canvas:** add image -> braille functions ([8201ad2](https://github.com/thi-ng/umbrella/commit/8201ad2c83f32522fcb6fbf0d3d46925491aacc8))
-## [0.7.14](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.7.13...@thi.ng/text-canvas@0.7.14) (2021-08-07)
-### Bug Fixes
-* **text-canvas:** fix ImageOpts.chars type ([0ae7855](https://github.com/thi-ng/umbrella/commit/0ae78552be39f543e98f8716dc239c3ce9c50b7b))
-## [0.7.4](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.7.3...@thi.ng/text-canvas@0.7.4) (2021-03-30)
+**Note:** Version bump only for package @thi.ng/text-canvas
-### Bug Fixes
-* **text-canvas:** fix FMT_NONE suffix, export format preset types ([e7a9ff7](https://github.com/thi-ng/umbrella/commit/e7a9ff7391b2d30ead4b40fced9b76a089be632e))
+## [2.0.2](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@2.0.1...@thi.ng/text-canvas@2.0.2) (2021-10-15)
+**Note:** Version bump only for package @thi.ng/text-canvas
-# [0.7.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.6.0...@thi.ng/text-canvas@0.7.0) (2021-03-26)
-### Features
-* **text-canvas:** update table cell wordwrap handling ([f19f925](https://github.com/thi-ng/umbrella/commit/f19f9251443bc609a28fe5776399c162bc75b9b8))
+## [2.0.1](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@2.0.0...@thi.ng/text-canvas@2.0.1) (2021-10-13)
+**Note:** Version bump only for package @thi.ng/text-canvas
-# [0.6.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.5.1...@thi.ng/text-canvas@0.6.0) (2021-03-24)
+# [2.0.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@1.1.4...@thi.ng/text-canvas@2.0.0) (2021-10-12)
-### Bug Fixes
-* **text-canvas:** fix format start/end handling in toString() ([5100222](https://github.com/thi-ng/umbrella/commit/5100222a874ce57ef1cd6892bf4e51faebf62dd1))
+### Build System
+* major update of ALL pkgs (export maps, ESM only) ([0d1d6ea](https://github.com/thi-ng/umbrella/commit/0d1d6ea9fab2a645d6c5f2bf2591459b939c09b6))
-### Features
-* **text-canvas:** add FMT_ANSI565, update StringFormat ([3bf5b47](https://github.com/thi-ng/umbrella/commit/3bf5b475cd75c9046804c81fb80b5f9e6d056fd0))
-* **text-canvas:** add imageCanvas/String565() fns ([6e254eb](https://github.com/thi-ng/umbrella/commit/6e254ebf7acf6520551caf99aef3a0b93d06a519))
+### Code Refactoring
+* **text-canvas:** update to use thi.ng/text-format ([aa67a5a](https://github.com/thi-ng/umbrella/commit/aa67a5a27197b4c751bb5959cdcd2a238af2a825))
+### BREAKING CHANGES
+* **text-canvas:** migrate formatting consts/functions to new pkg
-# [0.5.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.4.12...@thi.ng/text-canvas@0.5.0) (2021-03-24)
+- see 8c28655d1 for details
+- rename `toString()` => `formatCanvas()`
+- update dependencies
+* discontinue CommonJS & UMD versions
+- only ESM modules will be published from now on
+- CJS obsolete due to ESM support in recent versions of node:
+  - i.e. launch NodeJS via:
+  - `node --experimental-specifier-resolution=node --experimental-repl-await`
+  - in the node REPL use `await import(...)` instead of `require()`
+- UMD obsolete due to widespread browser support for ESM
-### Features
+Also:
+- normalize/restructure/reorg all package.json files
+- cleanup all build scripts, remove obsolete
+- switch from mocha to @thi.ng/testament for all tests
-* **text-canvas:** add FMT_NONE dummy formatter ([0b1f3bd](https://github.com/thi-ng/umbrella/commit/0b1f3bd88405aa89fdf344513bb43f7ac8a95e84))
-* **text-canvas:** add hardwrapped text support ([4e171db](https://github.com/thi-ng/umbrella/commit/4e171db1e77269604578495170b05a5e0bfcbc95))
-## [0.4.1](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.4.0...@thi.ng/text-canvas@0.4.1) (2021-01-10)
+#  [1.1.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@1.0.3...@thi.ng/text-canvas@1.1.0) (2021-08-13)
+###  Features
-### Bug Fixes
+- **text-canvas:** add image -> braille functions ([8201ad2](https://github.com/thi-ng/umbrella/commit/8201ad2c83f32522fcb6fbf0d3d46925491aacc8))
-* **text-canvas:** fix FMT_ANSI256 bg bitshift ([b50a0f9](https://github.com/thi-ng/umbrella/commit/b50a0f9c0464774f3b62888d718da89381b3014c))
+##  [0.7.14](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.7.13...@thi.ng/text-canvas@0.7.14) (2021-08-07)
+###  Bug Fixes
+- **text-canvas:** fix ImageOpts.chars type ([0ae7855](https://github.com/thi-ng/umbrella/commit/0ae78552be39f543e98f8716dc239c3ce9c50b7b))
+##  [0.7.4](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.7.3...@thi.ng/text-canvas@0.7.4) (2021-03-30)
+###  Bug Fixes
-# [0.4.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.3.0...@thi.ng/text-canvas@0.4.0) (2021-01-05)
+- **text-canvas:** fix FMT_NONE suffix, export format preset types ([e7a9ff7](https://github.com/thi-ng/umbrella/commit/e7a9ff7391b2d30ead4b40fced9b76a089be632e))
+# [0.7.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.6.0...@thi.ng/text-canvas@0.7.0) (2021-03-26)
 ### Features
-* **text-canvas:** add formatter fns/utils ([fb4470d](https://github.com/thi-ng/umbrella/commit/fb4470d5a708e3d1f700bab5274463f754489940))
+- **text-canvas:** update table cell wordwrap handling ([f19f925](https://github.com/thi-ng/umbrella/commit/f19f9251443bc609a28fe5776399c162bc75b9b8))
+# [0.6.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.5.1...@thi.ng/text-canvas@0.6.0) (2021-03-24)
-# [0.3.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.2.36...@thi.ng/text-canvas@0.3.0) (2021-01-02)
+### Bug Fixes
+- **text-canvas:** fix format start/end handling in toString() ([5100222](https://github.com/thi-ng/umbrella/commit/5100222a874ce57ef1cd6892bf4e51faebf62dd1))
 ### Features
-* **text-canvas:** add ANSI256 & HTML_565 formatters ([1f2d35b](https://github.com/thi-ng/umbrella/commit/1f2d35b306c30bfecd168f25abd0ead18e2fdf2a))
-* **text-canvas:** add imageRaw(), update image() ([34037ad](https://github.com/thi-ng/umbrella/commit/34037ad4ec87027779c72b683c3a4194f1995e79))
+- **text-canvas:** add FMT_ANSI565, update StringFormat ([3bf5b47](https://github.com/thi-ng/umbrella/commit/3bf5b475cd75c9046804c81fb80b5f9e6d056fd0))
+- **text-canvas:** add imageCanvas/String565() fns ([6e254eb](https://github.com/thi-ng/umbrella/commit/6e254ebf7acf6520551caf99aef3a0b93d06a519))
+#  [0.5.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.4.12...@thi.ng/text-canvas@0.5.0) (2021-03-24)
+###  Features
+- **text-canvas:** add FMT_NONE dummy formatter ([0b1f3bd](https://github.com/thi-ng/umbrella/commit/0b1f3bd88405aa89fdf344513bb43f7ac8a95e84))
+- **text-canvas:** add hardwrapped text support ([4e171db](https://github.com/thi-ng/umbrella/commit/4e171db1e77269604578495170b05a5e0bfcbc95))
-# [0.2.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.1.2...@thi.ng/text-canvas@0.2.0) (2020-03-01)
-### Features
-* **text-canvas:** add tableCanvas() ([13ee370](https://github.com/thi-ng/umbrella/commit/13ee370f03cc34305058265bff46e2ef23cecb2d))
+## [0.4.1](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.4.0...@thi.ng/text-canvas@0.4.1) (2021-01-10)
+### Bug Fixes
+- **text-canvas:** fix FMT_ANSI256 bg bitshift ([b50a0f9](https://github.com/thi-ng/umbrella/commit/b50a0f9c0464774f3b62888d718da89381b3014c))
+#  [0.4.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.3.0...@thi.ng/text-canvas@0.4.0) (2021-01-05)
-# 0.1.0 (2020-02-25)
+###  Features
+- **text-canvas:** add formatter fns/utils ([fb4470d](https://github.com/thi-ng/umbrella/commit/fb4470d5a708e3d1f700bab5274463f754489940))
-### Features
+#  [0.3.0](https://github.com/thi-ng/umbrella/compare/@thi.ng/text-canvas@0.2.36...@thi.ng/text-canvas@0.3.0) (2021-01-02)
-* **text-canvas:** add bar chart & image fns ([3130fe4](https://github.com/thi-ng/umbrella/commit/3130fe4ae10d6e579298d1b330c80d2e01d0a3ff))
-* **text-canvas:** add blit(), getAt(), fix table() arg type ([b5c9eb4](https://github.com/thi-ng/umbrella/commit/b5c9eb4e77c956e01d76f247a84ceb46d57498d4))
-* **text-canvas:** add bresenham line & circle fns, force int coords ([0587a66](https://github.com/thi-ng/umbrella/commit/0587a66529a179235e52e0ea4430376a850d8a15))
-* **text-canvas:** add canvas() factory fn ([3baeb31](https://github.com/thi-ng/umbrella/commit/3baeb31c96b033479e09eb77fdd1a5055359a5be))
-* **text-canvas:** add derived style fns (horizontalOnly, verticalOnly) ([dc1cb05](https://github.com/thi-ng/umbrella/commit/dc1cb054545456384a3502e91b7cba2022cce305))
-* **text-canvas:** add ImageOpts, update image(), add resize(), extract() ([73f941a](https://github.com/thi-ng/umbrella/commit/73f941add71eba7dbb535d0ae553e504cccbe553))
-* **text-canvas:** add inverted image draw opt ([08cb56a](https://github.com/thi-ng/umbrella/commit/08cb56a42abee49aaa28effc3a8cea0997231d13))
-* **text-canvas:** add more border consts ([05247a0](https://github.com/thi-ng/umbrella/commit/05247a0806b932936eb044ccc82ef9cae0518423))
-* **text-canvas:** add opt cell height config support ([d162a1c](https://github.com/thi-ng/umbrella/commit/d162a1c0e4da9a66ab5a7beeaaf4f0172b5b9e3a))
-* **text-canvas:** add scrollV() ([135258e](https://github.com/thi-ng/umbrella/commit/135258e9992dad502ea9b0b9efb276e086bd4e08))
-* **text-canvas:** add support for table cell format overrides ([8909ce0](https://github.com/thi-ng/umbrella/commit/8909ce07a14e61416f9deb45f1f1f7f4279c4e81))
-* **text-canvas:** add table support & options ([8983ad6](https://github.com/thi-ng/umbrella/commit/8983ad6083e0802a3ba003cca684869284c69c9e))
-* **text-canvas:** add textBox, update format enums & handling ([c922e14](https://github.com/thi-ng/umbrella/commit/c922e140992963d5fb4318e2a6dade02d4779905))
-* **text-canvas:** add textLines(), wordWrappedLines() ([0f13fe2](https://github.com/thi-ng/umbrella/commit/0f13fe27ffc720fb246e49c8487bb58077be275f))
-* **text-canvas:** add withClip/Format/Style() HOFs ([369909c](https://github.com/thi-ng/umbrella/commit/369909c62755453e3709bf469e9f74fdd1301493))
-* **text-canvas:** add wrappedText(), update draw fns & clip rect handling ([ba66aee](https://github.com/thi-ng/umbrella/commit/ba66aee98024b0ba9e58fed02a255dc7eeb28ae4))
-* **text-canvas:** add/update/rename consts, toString() ([254f3d7](https://github.com/thi-ng/umbrella/commit/254f3d7f06ada232b002d0e708101e9f8289b21f))
-* **text-canvas:** initial import as new pkg ([fd084bf](https://github.com/thi-ng/umbrella/commit/fd084bfd59adc2482a84ec11247db1cc027fad71))
-* **text-canvas:** major update/rewrite, format support ([57a7487](https://github.com/thi-ng/umbrella/commit/57a7487389294197265f58717d3c942191bad2cf))
-* **text-canvas:** update StrokeStyle ([d5bdcc8](https://github.com/thi-ng/umbrella/commit/d5bdcc8cb202d6ece879526f8a5f40e0d913e38b))
+###  Features

package/README.md CHANGED Viewed

@@ -11,6 +11,7 @@ This project is part of the
 - [About](#about)
   - [Status](#status)
+  - [Related packages](#related-packages)
 - [Installation](#installation)
 - [Dependencies](#dependencies)
 - [Usage examples](#usage-examples)
@@ -21,9 +22,6 @@ This project is part of the
     - [Variations](#variations)
     - [Combined formats](#combined-formats)
   - [String conversion format presets](#string-conversion-format-presets)
-  - [256 color ANSI format](#256-color-ansi-format)
-  - [16bit color ANSI & HTML formats](#16bit-color-ansi--html-formats)
-  - [Ad-hoc formatting of strings](#ad-hoc-formatting-of-strings)
   - [Stroke styles](#stroke-styles)
   - [Clipping](#clipping)
   - [Drawing functions](#drawing-functions)
@@ -45,21 +43,34 @@ Text based canvas, drawing, tables with arbitrary formatting (incl. ANSI/HTML).
 [Search or submit any issues for this package](https://github.com/thi-ng/umbrella/issues?q=%5Btext-canvas%5D+in%3Atitle)
+### Related packages
+- [@thi.ng/text-format](https://github.com/thi-ng/umbrella/tree/develop/packages/text-format) - Customizable color text formatting with presets for ANSI & HTML
 ## Installation
 ```bash
 yarn add @thi.ng/text-canvas
 ```
+ES module import:
 ```html
-// ES module
-<script type="module" src="https://unpkg.com/@thi.ng/text-canvas?module" crossorigin></script>
+<script type="module" src="https://cdn.skypack.dev/@thi.ng/text-canvas"></script>
+```
+[Skypack documentation](https://docs.skypack.dev/)
-// UMD
-<script src="https://unpkg.com/@thi.ng/text-canvas/lib/index.umd.js" crossorigin></script>
+For Node.js REPL:
+```text
+# with flag only for < v16
+node --experimental-repl-await
+> const textCanvas = await import("@thi.ng/text-canvas");
 ```
-Package sizes (gzipped, pre-treeshake): ESM: 6.27 KB / CJS: 6.63 KB / UMD: 6.34 KB
+Package sizes (gzipped, pre-treeshake): ESM: 4.97 KB
 ## Dependencies
@@ -68,8 +79,8 @@ Package sizes (gzipped, pre-treeshake): ESM: 6.27 KB / CJS: 6.63 KB / UMD: 6.34
 - [@thi.ng/checks](https://github.com/thi-ng/umbrella/tree/develop/packages/checks)
 - [@thi.ng/geom-clip-line](https://github.com/thi-ng/umbrella/tree/develop/packages/geom-clip-line)
 - [@thi.ng/math](https://github.com/thi-ng/umbrella/tree/develop/packages/math)
-- [@thi.ng/memoize](https://github.com/thi-ng/umbrella/tree/develop/packages/memoize)
 - [@thi.ng/strings](https://github.com/thi-ng/umbrella/tree/develop/packages/strings)
+- [@thi.ng/text-format](https://github.com/thi-ng/umbrella/tree/develop/packages/text-format)
 - [@thi.ng/transducers](https://github.com/thi-ng/umbrella/tree/develop/packages/transducers)
 ## Usage examples
@@ -99,29 +110,30 @@ const c = canvas(width, height, format?, style?);
 The text canvas stores all characters in a `Uint32Array` with the lower 16 bits
 used for the UTF-16 code and the upper 16 bits for **abitrary** formatting data.
-The package [provides its own format
-IDs](https://github.com/thi-ng/umbrella/blob/develop/packages/text-canvas/src/api.ts#L146)
-which are tailored for the bundled ANSI & HTML formatters, but users are free to
+The package utilizes [format identifier constants and formatters from the
+@thi.ng/text-format
+package](https://github.com/thi-ng/umbrella/blob/develop/packages/text-format/),
+which are tailored for the included ANSI & HTML formatters, but users are free to
 choose use any other system (but then will also need to implement a custom
 string formatter impl).
-The default format ID layout is as shown:
+The default format ID layout used by text canvas is as shown:
 ![format bit layout](https://raw.githubusercontent.com/thi-ng/umbrella/develop/assets/text-canvas/format-layout.png)
 Most drawing functions accept an optional `format` arg, but a default
 format can also be set via `setFormat(canvas, formatID)`.
-The following built-in format IDs are only compatible with these formatters:
+The format IDs defined in @thi.ng/text-format are only compatible with these
+formatters (also supplied by that package):
 - `FMT_ANSI16`
 - `FMT_HTML_INLINE_CSS`
 - `FMT_HTML_TACHYONS`
-Custom formatters are discussed further below:
-- [`FMT_ANSI256`](#256-color-ansi-format)
-- [`FMT_HTML_565`](#16bit-color-html-format)
+**All constants and other formatters are also discussed in detail in the
+[@thi.ng/text-format
+readme](https://github.com/thi-ng/umbrella/blob/develop/packages/text-format/README.md).**
 #### Colors
@@ -162,101 +174,31 @@ setFormat(canvas, FG_BLACK | BG_LIGHT_CYAN | BOLD | UNDERLINE);
 ### String conversion format presets
 Canvas-to-string conversion is completely customizable via the [`StringFormat`
-interface](https://github.com/thi-ng/umbrella/blob/develop/packages/text-canvas/src/api.ts#L78)
-and the following presets are supplied:
+interface](https://docs.thi.ng/umbrella/text-format/interfaces/StringFormat.html).
+Currently the following presets are supplied (in the
+[@thi.ng/text-format](https://github.com/thi-ng/umbrella/tree/develop/packages/text-format)
+package):
-- `FMT_ANSI16` - translate built-in format IDs to 4bit ANSI escape sequences
+- `FMT_ANSI16` - translate built-in format IDs to 4-bit ANSI escape sequences
 - `FMT_ANSI256` - uses all 16 format bits for fg & bg colors (ANSI esc sequences)
+- `FMT_ANSI565` - uses all 16 format bits for RGB565 fg colors (ANSI esc sequences)
 - `FMT_ANSI_RAW` - verbatim use of format IDs to ANSI sequences
 - `FMT_HTML_INLINE_CSS` - HTML `<span>` elements with inline CSS
 - `FMT_HTML_TACHYONS` - HTML `<span>` elements with [Tachyons
   CSS](http://tachyons.io/) class names
+- `FMT_HTML565` - HTML `<span>` elements with RGB565 color coding
 - `FMT_NONE` - dummy formatter outputting plain text only (all format
-  information discarded)
+  information discarded, e.g. for [`NO_COLOR`](https://no-color.org/) support)
 ```ts
 // Terminal
-console.log(toString(canvas, FMT_ANSI16));
+console.log(formatCanvas(canvas, FMT_ANSI16));
 // or
-console.log(toString(canvas, FMT_ANSI256));
+console.log(formatCanvas(canvas, FMT_ANSI256));
 // Browser
 const el = document.createElement("pre");
-el.innerHTML = toString(canvas, FMT_HTML_TACHYONS);
-```
-### 256 color ANSI format
-If targeting this output format, all 16 bits available for formatting
-information are used to encode 2x 8bit foreground/background colors. Therefore,
-none of the above mentioned preset color names and/or any additional formatting
-flags (e.g. bold, underline etc.) **cannot be used**. Instead, use the
-`format256()` function to compute a format ID based on given FG, BG colors.
-```ts
-// deep purple on yellow bg
-textLine(canvas, 1, 1, "hello color!", format256(19, 226));
-```
-![ANSI256 color pallette](https://raw.githubusercontent.com/thi-ng/umbrella/develop/assets/text-canvas/ansi256.png)
-Source: [Wikipedia](https://en.wikipedia.org/wiki/ANSI_escape_code#8-bit)
-### 16bit color ANSI & HTML formats
-Similar to the above custom ANSI format, here all available 16 bits are used to
-store color information, in the standard [RGB565
-format](https://en.wikipedia.org/wiki/High_color) (5bits red, 6bits green, 5bits
-blue). This also means, only either the text or background color<sup>(1)</sup> can be
-controlled and no other formatting flag (bold, underline etc.) are available.
-<sup>(1)</sup> In the ANSI version it's always only the text color.
-```ts
-const el = document.createElement("pre");
-// format and assign text colors
-el.innerHTML = toString(canvas, FMT_HTML565());
-// assign bg colors
-el.innerHTML = toString(canvas, FMT_HTML565("background"));
-```
-These formats are primarily intended for image display, see
-[section](#image-functions) below for examples...
-### Ad-hoc formatting of strings
-String formatters can also be used in an ad-hoc manner, without requiring any of
-the other text canvas functionality.
-```ts
-// create & use a HTML formatter
-defFormat(FMT_HTML_INLINE_CSS, FG_LIGHT_RED | BG_GRAY)("hello")
-// "<span style="color:#f55;background:#555;">hello</span>"
-// create & use an ANSI formatter
-defFormat(FMT_ANSI16, FG_LIGHT_RED | BG_GRAY)("hello")
-// "\x1B[91;100mhello\x1B[0m"
-// ANSI syntax sugar (same result as above)
-defAnsi16(FG_LIGHT_RED | BG_GRAY)("hello")
-// "\x1B[91;100mhello\x1B[0m"
-```
-Furthermore, `defFormatPresets()` can be used to create formatting functions for
-all 16 preset [foreground color IDs](#colors) for a given string format
-strategy:
-```ts
-const ansi = defFormatPresets(FMT_ANSI16);
-`${ansi.green("hello")} ${ansi.lightRed("world")}!`;
-// '\x1B[32mhello\x1B[0m \x1B[91mworld\x1B[0m!'
-const html = defFormatPresets(FMT_HTML_TACHYONS);
-`${html.green("hello")} ${html.lightRed("world")}!`;
-// '<span class="dark-green ">hello</span> <span class="red ">world</span>!'
+el.innerHTML = formatCanvas(canvas, FMT_HTML_TACHYONS);
 ```
 ### Stroke styles
@@ -371,6 +313,7 @@ enabling the `hard` option (see example below).
 ```ts
 import { repeatedly } from "@thi.ng/transducers";
 import * as tc from "@thi.ng/text-canvas";
+import * as tf from "@thi.ng/text-format";
 // generate 20 random values
 const data = repeatedly(() => Math.random(), 20)
@@ -389,9 +332,9 @@ tc.table(
         // column defs
         cols: [{ width: 4 }, { width: 20 }, { width: 8 }],
         // default cell format
-        format: tc.FG_BLACK | tc.BG_LIGHT_CYAN,
+        format: tf.FG_BLACK | tf.BG_LIGHT_CYAN,
         // default format for header cells (1st row)
-        formatHead: tc.FG_RED | tc.BG_LIGHT_CYAN | tc.BOLD | tc.UNDERLINE,
+        formatHead: tf.FG_RED | tf.BG_LIGHT_CYAN | tf.BOLD | tf.UNDERLINE,
         // border line style
         style: tc.STYLE_DASHED_ROUNDED,
         // border mode
@@ -407,7 +350,7 @@ tc.table(
         ["ID", "Main", "Comment"],
         [
             "0001",
-            { body: chart, format: tc.FG_BLUE | tc.BG_LIGHT_CYAN },
+            { body: chart, format: tf.FG_BLUE | tf.BG_LIGHT_CYAN },
             "This is a test!"
         ],
         ["0002", "Random data plot", "Word wrapped content"],
@@ -416,14 +359,14 @@ tc.table(
 );
 // output as ANSI formatted string
-console.log(tc.toString(canvas, tc.FMT_ANSI16));
+console.log(tc.formatCanvas(canvas, tf.FMT_ANSI16));
 ```
 For even more detailed control, tables can also be pre-initialized prior
 to creation of the canvas via
-[`initTable()`](https://github.com/thi-ng/umbrella/blob/develop/packages/text-canvas/src/table.ts#L20)
+[`initTable()`](https://github.com/thi-ng/umbrella/blob/develop/packages/text-canvas/src/table.ts#L29)
 and then drawn via
-[`drawTable()`](https://github.com/thi-ng/umbrella/blob/develop/packages/text-canvas/src/table.ts#L80).
+[`drawTable()`](https://github.com/thi-ng/umbrella/blob/develop/packages/text-canvas/src/table.ts#L97).
 The `initTable` function returns an object also containing the computed
 table size (`width`, `height` keys) which can then be used to create a
 canvas with the required size...
@@ -475,12 +418,13 @@ Code for this above example output (CLI version):
 import * as geom from "@thi.ng/geom";
 import * as mat from "@thi.ng/matrices";
 import * as tc from "@thi.ng/text-canvas";
+import * as tf from "@thi.ng/text-format";
 const W = 64;
 const H = 32;
 // create text canvas
-const canvas = new tc.Canvas(W, H, tc.BG_BLACK, tc.STYLE_THIN);
+const canvas = new tc.Canvas(W, H, tf.BG_BLACK, tf.STYLE_THIN);
 // cube corner vertices
 const cube = geom.vertices(geom.center(geom.aabb(1))!);
@@ -517,10 +461,10 @@ setInterval(() => {
     for (let e of edges) {
         const a = pts[e[0]];
         const b = pts[e[1]];
-        tc.line(canvas, a[0], a[1], b[0], b[1], "+", tc.FG_WHITE | tc.BG_RED);
+        tc.line(canvas, a[0], a[1], b[0], b[1], "+", tf.FG_WHITE | tf.BG_RED);
     }
     // draw vertex labels
-    canvas.format = tc.FG_WHITE | tc.BG_BLUE;
+    canvas.format = tf.FG_WHITE | tf.BG_BLUE;
     for (let i = 0; i < 8; i++) {
         const p = pts[i];
         tc.textBox(canvas, p[0] - 1, p[1] - 1, 5, 3, ` ${i} `);
@@ -530,16 +474,16 @@ setInterval(() => {
         2, 1, 24, -1,
         `@thi.ng/text-canvas wireframe cube\n\nx: ${rotx.toFixed(2)}\ny: ${roty.toFixed(2)}`,
         {
-            format: tc.FG_BLACK | tc.BG_LIGHT_CYAN,
+            format: tf.FG_BLACK | tf.BG_LIGHT_CYAN,
             padding: [1, 0]
         }
     );
     // draw canvas
     console.clear();
     // output as ANSI formatted string
-    console.log(tc.toString(canvas, tc.FMT_ANSI16));
+    console.log(tc.formatCanvas(canvas, tf.FMT_ANSI16));
     // output as plain text
-    // console.log(tc.toString(canvas));
+    // console.log(tc.formatCanvas(canvas));
 }, 15);
 ```

package/api.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import type { Fn, FnN, NumOrString } from "@thi.ng/api";
+import type { FnN, NumOrString } from "@thi.ng/api";
 export declare enum Align {
     LEFT = 0,
     RIGHT = 1,
@@ -72,111 +72,6 @@ export interface ClipRect {
     w: number;
     h: number;
 }
-export interface StringFormat {
-    /**
-     * Function translating canvas character format codes to the actual
-     * output format. This function will only be called when needed,
-     * i.e. when a character's format is different than that of the
-     * previous.
-     */
-    start: Fn<number, string>;
-    /**
-     * Format end string (e.g. to ANSI reset or `</span>`).
-     */
-    end: string;
-    /**
-     * Prefix for each canvas row / line result string
-     */
-    prefix: string;
-    /**
-     * Suffix for each canvas row / line result string (e.g. linebreak)
-     */
-    suffix: string;
-    /**
-     * If true, DON'T skip 0-valued format IDs during formatting.
-     *
-     * @remarks
-     * This is needed for various custom color-only formats, e.g. in order to
-     * reproduce black in `FMT_ANSI565`. In the default format, a zero refers to
-     * the default format of the target.
-     *
-     * @defaultValue false
-     */
-    zero?: boolean;
-}
-export interface HtmlFormatOpts {
-    /**
-     * Array of 16 color strings, in this order: black, red, green,
-     * yellow, blue, magenta, cyan, white, then repeated as bright
-     * versions.
-     */
-    colors: string[];
-    /**
-     * HTML attrib name.
-     */
-    attrib: string;
-    /**
-     * Delimiter between individual formatting terms (e.g. `;` for CSS
-     * rules or ` ` for CSS class names).
-     */
-    delim: string;
-    /**
-     * Prefix string for foreground colors
-     */
-    fg: string;
-    /**
-     * Prefix string for background colors
-     */
-    bg: string;
-    /**
-     * Bold format string
-     */
-    bold: string;
-    /**
-     * Dimmed format string
-     */
-    dim: string;
-    /**
-     * Underline format string
-     */
-    underline: string;
-}
-export declare const NONE = 0;
-export declare const FG_BLACK = 1;
-export declare const FG_RED = 2;
-export declare const FG_GREEN = 3;
-export declare const FG_YELLOW = 4;
-export declare const FG_BLUE = 5;
-export declare const FG_MAGENTA = 6;
-export declare const FG_CYAN = 7;
-export declare const FG_LIGHT_GRAY = 8;
-export declare const FG_GRAY = 17;
-export declare const FG_LIGHT_RED = 18;
-export declare const FG_LIGHT_GREEN = 19;
-export declare const FG_LIGHT_YELLOW = 20;
-export declare const FG_LIGHT_BLUE = 21;
-export declare const FG_LIGHT_MAGENTA = 22;
-export declare const FG_LIGHT_CYAN = 23;
-export declare const FG_WHITE = 24;
-export declare const BG_BLACK = 32;
-export declare const BG_RED = 64;
-export declare const BG_GREEN = 96;
-export declare const BG_YELLOW = 128;
-export declare const BG_BLUE = 160;
-export declare const BG_MAGENTA = 192;
-export declare const BG_CYAN = 224;
-export declare const BG_LIGHT_GRAY = 256;
-export declare const BG_GRAY = 544;
-export declare const BG_LIGHT_RED = 576;
-export declare const BG_LIGHT_GREEN = 608;
-export declare const BG_LIGHT_YELLOW = 640;
-export declare const BG_LIGHT_BLUE = 672;
-export declare const BG_LIGHT_MAGENTA = 704;
-export declare const BG_LIGHT_CYAN = 736;
-export declare const BG_WHITE = 768;
-export declare const BOLD = 1024;
-export declare const DIM = 2048;
-export declare const UNDERLINE = 4096;
 export interface StrokeStyle {
     hl: string;
     vl: string;