[tuify] Add styling support so that selected and unselected styles can be passed in

[nazmulidris]

Context:

• Crate: https://crates.io/crates/r3bl_tuify
• Repo: https://github.com/r3bl-org/r3bl_rs_utils/tree/main/tuify

Good entry points to make this change:

• https://github.com/r3bl-org/r3bl_rs_utils/blob/main/tuify/src/components/single_select_component.rs#L45
• https://github.com/r3bl-org/r3bl_rs_utils/blob/main/tuify/src/public_api.rs#L29

[nazmulidris]

@johnmcl001 I am assigning this to you 🙏🏽

[johnmcl001]

Thanks, I've also accepted the invitation to be a contributer so you should be able to assign issues to me without waiting for me to comment.

Just have 3 questions about the implementation:

1. There's an existing Style class found in /core/src/tui_core/styles/style.rs, should I use that? .
2. Should there be a specific selection_color?
3. Is this expected to be used as user input similar to selection mode, e.g: --fg_color <some_color> --bg_color <some_color>

[nazmulidris]

@johnmcl001 Thanks for accepting the invitation! 🎉

Re: Use Style from r3bl_rs_utils_core

While that is a good idea since the Style struct has support for other ANSI attributes like bold, italic, etc., unfortunately the Style struct hasn't yet been updated to use the r3bl_ansi_color crate which needs to be done. Basically the r3bl_ansi_color crate handles ANSI 256 colors properly across macos, linux, and windows, and also has accurate detection of terminal capabilities.

I propose that we make a struct that is similar to Style knowing that we will use the one from r3bl_rs_utils_core. But we do not re-use the one from r3bl_rs_utils_core just yet. This means that we can follow this shape.

pub struct Style {
    pub bold: bool,
    pub italic: bool,
    pub dim: bool,
    pub underline: bool,
    pub reverse: bool,
    pub hidden: bool,
    pub strikethrough: bool,
    pub color_fg: Color,
    pub color_bg: Color,
}

The Color struct to use comes from:
https://github.com/r3bl-org/r3bl_rs_utils/blob/main/ansi_color/src/color.rs#L38

Re: specific selection color

Yes, I think we should allow the user to pass in the following style sheet.

pub struct StyleSheet {
    pub normal_style: Style,
    pub selected_style: Style,
}

This way, a user can choose what color palette they would like to use in the app, along w/ ANSI attributes like bold, italic, etc.

Also, we can do a lot more to decorate the selection with nice glyphs, instead of just ">" prefix. So it looks more like a real app. Here's an example of glyphs we can use. https://github.com/r3bl-org/r3bl-ts-utils/blob/8751aadef6a110ae409e5c5a0ecfc263a95b2741/src/tui-figures/symbols.ts#L217
Here is a new issue for this:

• [tuify] Use nice ANSI symbols instead of ">" to decorate what row is currently selected #133

Re: command line args for colors

I think we should avoid passing colors as args, it is cumbersome. Best to use the Rust API in this case, and we can provide some nice looking defaults for the binary target rt. Currently we just use some colors that were developed for testing ANSI 256 colors easily on macos, linux, and windows. They don't look the best 😄 .

PLMK if you have more questions. We can also chat on discord if you need immediate feedback.