Raxol. View. Components
(Raxol v2.7.0)
View Source
Basic view components for Raxol UI rendering.
This module provides fundamental components for building terminal UIs, including text, boxes, rows, columns, and other layout elements.
Summary
Functions
Creates a block-character bar chart component.
Creates a box component.
Creates a button component.
Creates a checkbox component.
Creates a column layout component.
Creates a container component with optional scrolling.
Creates a divider component.
Creates a heatmap component.
Creates an image component for inline terminal image display.
Creates an input field component.
Creates a label component.
Creates a braille line chart component.
Creates a list component.
Creates a modal component.
Creates a progress bar component.
Creates a radio button group component.
Creates a row layout component.
Creates a braille scatter plot component.
Creates a scrubber: a transport control over an ordered position.
Creates a select/dropdown component.
Creates a spacer component.
Helper to wrap content in a styled span.
Creates a minimal sparkline (line chart with no axes or legend).
Creates a split pane layout component.
Creates a table component.
Creates a tabs component.
Creates a text component with the given content.
Creates a textarea component.
Functions
Creates a block-character bar chart component.
Options
:series- List of%{name: string, data: list, color: atom}(required):width- Chart width in terminal columns (default: 40):height- Chart height in terminal rows (default: 10):orientation-:verticalor:horizontal(default: :vertical):show_axes- Show axis labels (default: false):show_legend- Show series legend (default: false):show_values- Show value labels on bars (default: false):bar_gap- Gap between bars within a group (default: 0):group_gap- Gap between groups (default: 1):min/:max- Value range (default: :auto):style- Box style for the wrapper:id- Optional component identifier
Creates a box component.
Creates a button component.
Creates a checkbox component.
Creates a column layout component.
Creates a container component with optional scrolling.
Creates a divider component.
Creates a heatmap component.
Options
:data- 2D grid as[[number]]row-major (required):width- Chart width in terminal columns (default: 40):height- Chart height in terminal rows (default: 10):color_scale-:warm,:cool,:diverging, orfn/3(default: :warm):show_values- Show value labels in cells (default: false):min/:max- Value range (default: :auto):style- Box style for the wrapper:id- Optional component identifier
Creates an image component for inline terminal image display.
Options
:src- File path or raw binary image data (required):width- Width in terminal cells (default: 20):height- Height in terminal cells (default: 10):protocol- Override protocol (:kitty, :iterm2, :sixel):preserve_aspect- Preserve aspect ratio (default: true):style- Optional style attributes:id- Optional component identifier
Creates an input field component.
Creates a label component.
Creates a braille line chart component.
Options
:series- List of%{name: string, data: list, color: atom}(required):width- Chart width in terminal columns (default: 40):height- Chart height in terminal rows (default: 10):show_axes- Show Y-axis labels (default: false):show_legend- Show series legend (default: false):min/:max- Y-axis range (default: :auto):style- Box style for the wrapper:id- Optional component identifier
Creates a list component.
Creates a modal component.
Creates a progress bar component.
Creates a radio button group component.
Creates a row layout component.
Creates a braille scatter plot component.
Options
:series- List of%{name: string, data: [{x, y}], color: atom}(required):width- Chart width in terminal columns (default: 40):height- Chart height in terminal rows (default: 10):show_axes- Show axis labels (default: false):show_legend- Show series legend (default: false):x_range/:y_range- Axis ranges as{min, max}or:auto(default: :auto):style- Box style for the wrapper:id- Optional component identifier
Creates a scrubber: a transport control over an ordered position.
Composed by Raxol.UI.Components.Input.Scrubber.render/2, then stamped
type: :scrubber so MCP's TreeWalker and the accessibility projection
dispatch on the widget rather than on the :row it lays out as (the same
discovery-alias trick Raxol.UI.Layout.Engine uses to lay the chart types
out as :box). The transport fields are carried on the node because
mcp_tools/1 and a11y_node/1 read the declaration, not the component
state.
Builds a declaration rather than instantiating: init/1 mints an id when
none is given, and a view/1 helper runs every frame, so instantiating here
churned the id -- and with it every MCP tool handle -- once per repaint. Pass
:id to address this scrubber from an agent or to focus it.
Options
:min/:max- Addressable position range (default0/0):position- Playhead position, clamped into the range:playing?- Transport state (defaultfalse):speed- Playback multiplier, rendered when not1.0:marks- Positions to tick on the track:width- Track width in columns (default24):elapsed_ms/:duration_ms- Clock readout; omit forposition/max:label,:aria_label,:tooltip,:disabled,:style,:id
Example
scrubber(id: "replay", min: 0, max: 47, position: 12, marks: [0, 18])
Creates a select/dropdown component.
Creates a spacer component.
Helper to wrap content in a styled span.
Creates a minimal sparkline (line chart with no axes or legend).
Options
:data- List of numbers (required):width- Width in terminal columns (default: 20):height- Height in terminal rows (default: 3):color- Line color (default: :cyan):min/:max- Y-axis range (default: :auto):style- Box style for the wrapper:id- Optional component identifier
Creates a split pane layout component.
Options
:direction-:horizontalor:vertical(default:horizontal):ratio- Tuple for space distribution (default{1, 1}):min_size- Minimum pane dimension (default5):id- Optional identifier:children- Child elements (one per pane)
Creates a table component.
Creates a tabs component.
Creates a text component with the given content.
Options
:content- The text content to display:style- Optional style attributes:id- Optional component identifier
Creates a textarea component.