Show HN: Fancy-ANSI – Small JavaScript library for converting ANSI to HTML

[andres]

I made this tool to add support for custom ANSI palettes to kubetail (https://github.com/kubetail-org/kubetail). Maybe you'll find it useful too.

Let me know if you have any suggestions!

[giraffe_lady]

Ah this is awesome. I've been working on a browser based mud client and none of the existing options handled everything I needed. I'll be switching to this immediately, it seems to solve all of my current problems with displaying ansi text in the browser.

[andres]

Awesome! Great to hear it's useful for your project. Let me know if you have any questions or run into any issues.

[epage]

Recently did something similar in Rust but for generating SVGs. We've adopted it for snapshot testing of cargo and rustc's output. Don't have a good PR handy for showing Github's rendering of changes in the SVG (text, side-by-side, swiping) but https://github.com/rust-lang/rust/pull/121877/files has newly added SVGs.

To see what is supported, see the screenshot in the docs: https://docs.rs/anstyle-svg/latest/anstyle_svg/

[blueflow]

It is unclear to what extent the ANSI control codes are implemented. The README mentions SGR and the 24-bit color extensions in the nonstandard semicolon syntax. What about cursor movements? Backspace? Overstriking?

Which "ANSI" did you use as reference?

[andres]

The library is focused on text styling so it only implements ANSI SGR parameters. I used this as a reference: https://en.wikipedia.org/wiki/ANSI_escape_code

The full list of supported SGR parameters is in the README: https://github.com/kubetail-org/fancy-ansi?tab=readme-ov-fil...

Let me know if you have any suggestions on how to make it clearer which subset of ANSI is supported.

[epage]

> It is unclear to what extent the ANSI control codes are implemented.

The demo helps a bit: https://kubetail-org.github.io/fancy-ansi/

[kevin_thibedeau]

A travesty it's missing blink support.

[andres]

Created issue: https://github.com/kubetail-org/fancy-ansi/issues/2

Blink support would use CSS animations which requires a deeper level of integration than the other SGR parameters so I wanted to hold off until I could iterate over a solution with a user. If you'd like to use Fancy-ANSI with blink support, please let me know on GitHub and I can implement it fairly quickly.

[chrismorgan]

Simple bug report: an empty SGR (CSI m, ) doesn’t do anything, but should be equivalent to 0, reset all.

[andres]

Noted, thanks https://github.com/kubetail-org/fancy-ansi/issues/1

[andres]

Update: fixed in v0.1.1 https://www.npmjs.com/package/fancy-ansi