All posts
releaseannouncement

FlowDrop 1.12.0: Kanban Pipeline View and Keyboard Accessibility

FlowDrop 1.12.0 adds a server-driven kanban view to the pipeline panel, new paused and interrupted execution statuses, accordion row details, and comprehensive keyboard accessibility across the playground.

FlowDrop 1.12.0 is the largest playground release yet. The pipeline panel gains a kanban view driven entirely by server configuration, two new execution statuses, and an accordion detail row. Across the playground, nearly every interactive element now works with a keyboard.

Kanban pipeline view

PipelinePanel gains a kanban view alongside the existing table and graph views. Columns are defined by kanban_config in the pipeline API response — no client-side code change required to restructure the board. Each column maps one or more execution statuses via KanbanColumnDef.statuses, and supports optional color and label overrides.

Two new exported types model the configuration: KanbanColumnDef (a single column definition with key, label, statuses[], and optional color) and KanbanConfig (the top-level kanban_config object returned by the pipeline API).

New execution statuses

NodeExecutionStatus and ExecutionStatus now include 'paused' (orange) and 'interrupted' (cyan). Both statuses have dedicated icons, color tokens, and labels across the table, graph, and kanban views. JobStatusSummary gains skipped, paused, and interrupted count fields.

Pipeline table accordion

Clicking a row in the pipeline table expands an inline accordion panel showing per-node execution details: start and end times, status, and output. A second click collapses it.

Extensible pipeline views

mountPlaygroundStudio() now accepts a pipelineViews option; PlaygroundStudio accepts an extraPipelineViews prop. Each entry defines a key, icon, label, and a Svelte component receiving PipelineViewProps. The active view key is persisted in localStorage and validated against built-ins and injected views on restore. PipelineViewDef and PipelineViewProps are exported from @flowdrop/flowdrop/playground.

Keyboard accessibility

Six distinct improvements land in this release:

  • Interrupt prompts — HITL dialogs can be dismissed and confirmed with the keyboard
  • Session chip dropdown — fully navigable via Arrow keys, Enter, and Escape
  • Pipeline chip dropdown — same keyboard navigation as session chip
  • Port handles removed from tab order — port handles are no longer reachable via Tab, reducing noise for keyboard-only users navigating the editor
  • Playground resizer — the PlaygroundStudio split-pane resizer responds to ArrowLeft / ArrowRight keys (10 px increments) in addition to mouse drag
  • Read-only graph interaction guard — clicking or dragging nodes is prevented when the workflow is in a locked or read-only state

i18n coverage

Every hardcoded string in the playground — button labels, status text, empty-state messages — has been extracted into the FlowDrop message map. Hosts supplying a custom messages object can now translate or override playground copy alongside editor copy.

New exported playground components

MessageStream, ChatInput, ExecutionConsole, and ControlPanel are now exported from @flowdrop/flowdrop/playground for hosts that need to compose custom playground layouts.

Locked workflow graph

When no pipeline execution is running, the playground renders the workflow graph in read-only mode instead of a blank panel. Users have a visual reference of the workflow structure at all times.

Fixes

  • Polling survives interrupts and terminal statuses — the polling loop was silently cancelled when a pipeline reached a terminal status or transitioned through awaiting_input. Polling now resumes correctly after an interrupt resolves.
  • Unreported nodes — nodes not mentioned in a pipeline response were being shown as pending. They now remain in their previous state until the server explicitly reports them.
  • Panel resize clamping — draggable panel widths are now re-clamped via ResizeObserver when the viewport resizes, preventing the pipeline panel from overflowing or jumping.
  • Node type label — the pipeline table was displaying the internal universalNode discriminator instead of metadata.id.

Upgrading

npm install @flowdrop/flowdrop@1.12.0

No breaking changes. The kanban view requires kanban_config in the pipeline API response; without it, the kanban tab is not shown.