API reference

Here's the full contract for board: everything you can bind, listen to, project and theme, gathered in one place. Wire up what you need and style what you want — it's standalone and signal-friendly.

Inputs

Dial board in with 5 inputs. Bind them like any Angular @Input.

Name	Type	Default	Description
`board`	`Board`	`undefined`	The full board definition to render: an object whose columns array holds the column and card data displayed by the component.
`boardLabel`	`string`	`'Board'`	Accessible name of the board list container.
`variant`	`'primary' \| 'success' \| 'danger' \| 'warning' \| 'info' \| string`	`undefined`	Semantic accent of the drag-and-drop placeholder. Accepts the built-in design-system accents, any registered custom accent name, or a literal colour (#hex, rgb(), oklch(), CSS named colour); defaults to the primary accent when unset.
`columnSortingDisabled`	`boolean`	`false`	When true, column reordering via drag-and-drop is disabled for the whole board.
`dragBehavior`	`'ghost' \| 'hide' \| 'collapse'`	`'collapse'`	Controls how the dragged element looks during a drag: 'ghost' keeps it visible at half opacity, 'hide' makes it invisible but keeps its space, and 'collapse' removes it and its space entirely.

Outputs

React to what board does — 4 events to hook your logic onto.

Name	Type	Description
`onCardClick`	`EventEmitter<BoardCard>`	Emits the clicked card each time a card is clicked within the board.
`onCardMoved`	`EventEmitter<CardDragDropEvent>`	Emits when a card is repositioned — within its column or into another column — via pointer drag or keyboard move, with previous/current indexes and source/target columns.
`onColumnMoved`	`EventEmitter<ColumnDragDropEvent>`	Emits when columns are reordered through drag-and-drop, with the previous and current column indexes.
`reachedEnd`	`EventEmitter<ReachedEndEvent>`	Emits when a column body is scrolled to its bottom, with the column index and data — enables infinite-scroll loading.

Templates

No templates documented yet.