step_renderer

Composable render functions for the alignment card stack column

Toolbar & Stats

Alignment-specific toolbar with card count selector. Rendered into the shared chrome area when the alignment column is active.


source

render_align_toolbar


def render_align_toolbar(
    oob:bool=False, # Whether to render as OOB swap
)->Any: # Toolbar component

Render the alignment toolbar with auto-play toggle.


source

render_align_source_position


def render_align_source_position(
    chunks:List, # Current VAD chunks
    focused_index:int=0, # Currently focused chunk index
    oob:bool=False, # Whether to render as OOB swap
)->Any: # Audio file position indicator (empty if single file)

Render audio file position indicator for the focused chunk.


source

render_align_stats


def render_align_stats(
    chunks:List, # Current VAD chunks
    oob:bool=False, # Whether to render as OOB swap
)->Any: # Statistics component

Render alignment statistics.

Column Body

Renders the alignment column content area: card stack viewport, hidden audio element, keyboard infrastructure, and JavaScript callbacks.


source

render_align_column_body


def render_align_column_body(
    chunks:List, # VAD chunks to display
    focused_index:int, # Currently focused chunk index
    visible_count:int, # Number of visible cards in viewport
    card_width:int, # Card stack width in rem
    urls:AlignmentUrls, # URL bundle for alignment routes
    kb_system:Any=None, # Rendered keyboard system (None when KB managed externally)
    audio_urls:Optional=None, # Audio file URLs for Web Audio API
    should_play_fn:str='', # Consumer-defined play guard function name (overrides default zone guard)
)->Any: # Div with id=COLUMN_CONTENT

Render the alignment column content area with card stack viewport.