Skip to content

feat(tui): pick 256-color colors from a grid in Edit Colors - #778

Merged
sirmalloc merged 1 commit into
sirmalloc:mainfrom
eric-engberg:feat/edit-colors-256-grid
Nov 5, 2026
Merged

sirmalloc merged 1 commit into
sirmalloc:mainfrom
eric-engberg:feat/edit-colors-256-grid

Conversation

@eric-engberg

Copy link
Copy Markdown
Contributor

Demo

Opening the grid on Model's background (Blue), moving through the color cube with the preview following, and keeping a color with Enter. Powerline mode uses the Custom theme, since a named theme locks Edit Colors.

Powerline

256-color grid in Powerline mode

Plain

256-color grid in plain mode

Summary

In Edit Colors, (a) asked for a palette number from 0 to 255, so picking a 256-color color meant knowing its number already. (a) now opens the whole palette as a grid:

Select ANSI 256 Color - Model (foreground)

←→↑↓ move, type a number to jump, Enter apply, ESC cancel

<the 16 basic colors>

<the 6×6×6 color cube, as six 6×6 blocks side by side>

<the 24 grays>

ANSI 208  #FF8700
  • The arrow keys move the cursor, and the status line preview follows it. Enter keeps the color; ESC restores the previous one.
  • Typing a number still works: it jumps straight to that color (2 0 8 → ANSI 208). A digit that would go past 255 starts a new number.
  • The cube has one 6×6 block per red level, with green down and blue across, so each block is a smooth gradient. ↑ from the top of the cube goes to the basic colors and ↓ from the bottom goes to the grays. Moving between rows of different lengths keeps the first and last cells lined up.
  • The label shows the color's number, plus its name for the 16 basic colors or its hex value for the rest. Basic colors get no hex value because terminals theme them.
  • The highlighted color is marked [] in black or white, whichever reads better on it. Terminals narrower than 76 columns get one-character cells.

Behavior details

  • Works for foreground and background; (f) switches between them, as before.
  • Offered at truecolor as well as at 256 colors; (a) used to appear only at 256 colors. At truecolor the help line now reads (h)ex, (a)nsi256.
  • Every color is saved as ansi256:N, as the typed prompt did, so the settings format doesn't change and a pick renders as its swatch. That includes the basic colors: a named color like red is drawn with other colors (160 at 256 colors, #CC0000 at truecolor), so saving the name would change the color from the one picked. Like any ansi256:N color, a basic pick resets to the widget's default when the color level changes, as on main.
  • The cursor starts on the widget's current color. A named color starts on the color it's drawn with at the current level (red on 160 at 256 colors), and a hex color on the nearest cube or gray color. The widget keeps its color until the cursor moves, so opening the grid and pressing Enter never changes it, and the preview always shows what Enter keeps.
  • The typed "ANSI 256 color code" prompt is gone; typing in the grid replaces it.
  • In Powerline mode, Edit Colors still requires the Custom theme, as before.
  • docs/USAGE.md (Widget Styling) now lists (a) and (h).

Testing

  • On main as of fix: use env override and settings for usable context ratio calculation #407 (71e8b42): merges cleanly, bun run lint is clean, and bun test gives 3967 pass, 0 fail. The built CLI under Bun 1.4.4 and Node 26.13.0 matches main in plain and Powerline mode with the baseline configs, and the TUI opens and exits cleanly. It adds no JavaScript or Node API newer than Node 14, the build's target.
  • bun run lint and bun test (2,493 pass), including new tests:
    • color-menu/__tests__/palette.test.ts: the layout (every color placed exactly once), movement and wrapping, xterm hex values, labels, marker contrast, saved values and starting positions.
    • __tests__/ColorMenuPalette.test.tsx: opening at 256 colors and truecolor but not at 16, the live preview while moving, typing a number, Enter, ESC, background mode, narrow terminals, and unchanged settings when opened on a palette color.
  • The same tests pass under Node with Vitest.
  • Built package: piped renders are identical to main under Bun 1.4.2 and Node 18, 22 and 26, in plain and Powerline modes, and the TUI opens and exits cleanly on each.
  • Drove the grid in the built TUI under Node 26 (tmux): it opens on the current color, moves, jumps to a typed 208, keeps it on Enter and restores it on ESC. Under Bun (VHS) I checked plain mode and Powerline mode with the Custom theme, where the background follows the cursor live.

(a) in Edit Colors opens the whole 256-color palette as a grid (the 16
basic colors, the 6x6x6 cube and the 24 grays) instead of asking for a
number. The arrow keys move the cursor and the preview follows it, typing a
number jumps to that color, Enter keeps it and ESC restores the previous
one. Picks are still saved as ansi256:N, and (a) is now offered at
truecolor too.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants