feat: Add one eighth wide and tall border sets (#831)

This PR adds the
[`McGugan`](https://www.willmcgugan.com/blog/tech/post/ceo-just-wants-to-draw-boxes/)
border set, which allows for tighter borders.

For example, with the `flex` example you can get this effect (top is
mcgugan wide, bottom is mcgugan tall):

<img width="759" alt="image"
src="https://github.com/ratatui-org/ratatui/assets/1813121/756bb50e-f8c3-4eec-abe8-ce358058a526">

<img width="759" alt="image"
src="https://github.com/ratatui-org/ratatui/assets/1813121/583485ef-9eb2-4b45-ab88-90bd7cb14c54">

As of this PR, `MCGUGAN_WIDE` has to be styled manually, like so:

```rust
            let main_color = color_for_constraint(*constraint);
            let cell = buf.get_mut(block.x, block.y + 1);
            cell.set_style(Style::reset().fg(main_color).reversed());
            let cell = buf.get_mut(block.x, block.y + 2);
            cell.set_style(Style::reset().fg(main_color).reversed());
            let cell = buf.get_mut(block.x + block.width.saturating_sub(1), block.y + 1);
            cell.set_style(Style::reset().fg(main_color).reversed());
            let cell = buf.get_mut(block.x + block.width.saturating_sub(1), block.y + 2);
            cell.set_style(Style::reset().fg(main_color).reversed());

```

`MCGUGAN_TALL` has to be styled manually, like so:

```rust
            let main_color = color_for_constraint(*constraint);
            for x in block.x + 1..(block.x + block.width).saturating_sub(1) {
                let cell = buf.get_mut(x, block.y);
                cell.set_style(Style::reset().fg(main_color).reversed());
                let cell = buf.get_mut(x, block.y + block.height - 1);
                cell.set_style(Style::reset().fg(main_color).reversed());
            }

```
This commit is contained in:
Dheepak Krishnamurthy 2024-01-16 21:03:06 -05:00 committed by GitHub
parent 4d262d21cb
commit f299463847
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -381,6 +381,49 @@ pub mod border {
horizontal_top: QUADRANT_BOTTOM_HALF,
horizontal_bottom: QUADRANT_TOP_HALF,
};
pub const ONE_EIGHTH_TOP_EIGHT: &str = "";
pub const ONE_EIGHTH_BOTTOM_EIGHT: &str = "";
pub const ONE_EIGHTH_LEFT_EIGHT: &str = "";
pub const ONE_EIGHTH_RIGHT_EIGHT: &str = "";
/// Wide border set based on McGugan box technique
///
/// ```text
/// ▁▁▁▁▁▁▁
/// ▏xxxxx▕
/// ▏xxxxx▕
/// ▔▔▔▔▔▔▔
/// ```
pub const ONE_EIGHTH_WIDE: Set = Set {
top_right: ONE_EIGHTH_BOTTOM_EIGHT,
top_left: ONE_EIGHTH_BOTTOM_EIGHT,
bottom_right: ONE_EIGHTH_TOP_EIGHT,
bottom_left: ONE_EIGHTH_TOP_EIGHT,
vertical_left: ONE_EIGHTH_LEFT_EIGHT,
vertical_right: ONE_EIGHTH_RIGHT_EIGHT,
horizontal_top: ONE_EIGHTH_BOTTOM_EIGHT,
horizontal_bottom: ONE_EIGHTH_TOP_EIGHT,
};
/// Tall border set based on McGugan box technique
///
/// ```text
/// ▕▔▔▏
/// ▕xx▏
/// ▕xx▏
/// ▕▁▁▏
/// ```
pub const ONE_EIGHTH_TALL: Set = Set {
top_right: ONE_EIGHTH_LEFT_EIGHT,
top_left: ONE_EIGHTH_RIGHT_EIGHT,
bottom_right: ONE_EIGHTH_LEFT_EIGHT,
bottom_left: ONE_EIGHTH_RIGHT_EIGHT,
vertical_left: ONE_EIGHTH_RIGHT_EIGHT,
vertical_right: ONE_EIGHTH_LEFT_EIGHT,
horizontal_top: ONE_EIGHTH_TOP_EIGHT,
horizontal_bottom: ONE_EIGHTH_BOTTOM_EIGHT,
};
}
pub const DOT: &str = "";