Module style

Module style 

Source
Expand description

Visual styling and theming for list components.

This module provides comprehensive styling options for customizing the appearance of list components:

  • ListStyles: Complete styling configuration for all visual elements
  • Color schemes that adapt to light/dark terminal themes
  • Typography and border styling options
  • Default styles following terminal UI conventions

The styling system supports both built-in themes and complete customization for applications with specific branding requirements.

§Examples

use bubbletea_widgets::list::{Model, DefaultDelegate, DefaultItem, ListStyles};

let items = vec![DefaultItem::new("Item", "Description")];
let list = Model::new(items, DefaultDelegate::new(), 80, 24);

// Get the default styling - customization is done by modifying the struct fields
let default_styles = ListStyles::default();
// Styling can be customized by creating a new ListStyles instance

Styling system for list components.

This module provides comprehensive styling options for list components, including styles for different UI elements and visual states. The styling system is built on top of lipgloss and provides sensible defaults for terminal applications.

§Style Categories

  • Title and Header: Styles for list titles and column headers
  • Status and Filter: Styles for status bar and filter prompt
  • Pagination: Styles for pagination indicators and navigation
  • Visual Elements: Styles for spinners, dots, and separators

§Constants

  • BULLET: Unicode bullet character () used in pagination
  • ELLIPSIS: Unicode ellipsis character () for truncated content

§Color Scheme

The default styles use a dark theme with:

  • Bright colors for active/selected elements
  • Subdued colors for secondary information
  • High contrast for readability

§Adaptive Colors

All default styles use AdaptiveColor which automatically adjusts to the terminal’s light or dark theme, ensuring optimal readability and visual consistency across different environments.

§Example

use bubbletea_widgets::list::style::{ListStyles, BULLET, ELLIPSIS};
use lipgloss_extras::prelude::*;

// Use default adaptive styles
let mut styles = ListStyles::default();

// Customize specific elements with adaptive colors
styles.title = Style::new()
    .foreground(AdaptiveColor { Light: "#1a1a1a", Dark: "#ffffff" })
    .bold(true);

// Use the constants for consistent symbols
println!("Pagination: {}", BULLET);
println!("Truncated: item1, item2{}", ELLIPSIS);

Structs§

ListStyles
Comprehensive styling configuration for all list component UI elements.

Constants§

BULLET
Unicode bullet character (•) used in pagination indicators and visual separators.
ELLIPSIS
Unicode ellipsis character (…) used for truncated content display.