Show HN: Fancy-ANSI – Small JavaScript library for converting ANSI to HTML (opens in new tab)

(github.com)

16 pointsandres1y ago11 comments

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!

11 comments

giraffe_lady1y ago

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.

andresOP1y ago

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

epage1y ago

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/

blueflow1y ago

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?

andresOP1y ago

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.

epage1y ago

> 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_thibedeau1y ago

A travesty it's missing blink support.

1 more reply

chrismorgan1y ago

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

andresOP1y ago

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

andresOP1y ago

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

j / k navigate · click thread line to collapse

11 comments

giraffe_lady1y ago

andresOP1y ago

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

epage1y ago

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

blueflow1y ago

Which "ANSI" did you use as reference?

andresOP1y ago

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.

epage1y ago

> 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_thibedeau1y ago

A travesty it's missing blink support.

1 more reply

chrismorgan1y ago

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

andresOP1y ago

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

andresOP1y ago

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

j / k navigate · click thread line to collapse