Blazor Kanban Board - Default Functionalities
This demo passes automated axe checks with 0 violations — semantic markup, ARIA, full keyboard operation, visible focus. Section 508 conformant
Accessibility report
VPAT
Green Bean - 6 items | Roasting - 6 items | Cooling - 6 items | Packaging - 6 items |
|---|
[6]Green Bean BAT-501
High Ethiopia Yirgacheffe
Light roast, single-origin. 30 kilograms of green beans awaiting roast schedule.
BAT-502
Normal Brazil Cerrado
Medium roast base for the house espresso blend. 60 kilograms inbound.
BAT-509
High Kenya AA
Premium Kenyan AA grade awaiting the next single-origin roast cycle.
BAT-510
Normal Honduras Marcala
New Honduran beans sourced from Marcala region for the medium roast line.
BAT-511
Normal Ethiopia Sidamo
Ethiopian Sidamo green beans inbound for the floral light-roast reserve.
BAT-512
Normal Costa Rica Tarrazu
High-altitude Tarrazu beans for limited release single-origin batch.
| [6]Roasting BAT-503
Normal Colombia Supremo
City-plus roast for the seasonal single-origin lineup.
BAT-504
High House Espresso Blend
Brazil and Colombia blend, medium-dark roast, daily production.
BAT-513
High Panama Geisha
Rare Panama Geisha micro-lot being carefully roasted to highlight floral notes.
BAT-514
Normal Decaf Swiss Water
Chemical-free Swiss water decaf process for the late-night blend.
BAT-515
Normal Cold Brew Concentrate
Steeping coarse-ground beans for 18-hour cold brew extraction run.
BAT-516
High Italian Roast Espresso
Traditional Italian dark roast being prepped for espresso pulls.
| [6]Cooling BAT-505
Normal Sumatra Mandheling
Dark roast for the winter reserve line. Cupping notes due Friday.
BAT-506
Normal Guatemala Antigua
Medium roast for the new subscription tier. Awaiting quality sign-off.
BAT-517
High Espresso Blend Tasting
Cupping session evaluating three espresso blend variations for Q4 menu.
BAT-518
Normal Decaf Quality Control
Final cupping for the new decaf blend before retail distribution launch.
BAT-519
Normal Origin Trip Honduras
Reviewing samples from the recent Honduras origin trip for product selection.
BAT-520
Normal Holiday Roast Selection
Selecting the perfect medium-dark roast for the holiday gift collection.
| [6]Packaging BAT-507
Normal Rwanda Bourbon
Light roast limited release. Already packed and shipped to retail partners.
BAT-508
Low Decaf Mexico Chiapas
Water-process decaf, medium roast, fulfilled for the cafe subscription.
BAT-521
Low Nicaragua Jinotega
Nicaraguan Jinotega shipment arrived and passed all receiving inspections.
BAT-522
High Holiday Blend Shipped
Holiday blend packaged and shipped to all wholesale cafe accounts.
BAT-523
Low Retail Bag Restock
Restaged retail shelves with the new roastery branded coffee bags.
BAT-524
Low Espresso Training Class
Completed espresso barista training for 8 new cafe hires this quarter.
|
This sample demonstrates the default functionalities of the Blazor Kanban component by visualizing a Coffee Roastery Batches. By default, cards can be dragged and dropped across all columns, and the board renders with the minimal configuration required for the component.
The sample uses the minimal configuration required to render the Kanban board and cards. Essential settings include DataSource, KanbanColumns, and KanbanCardSettings.
Additional essential interactions that enhance analysis and control are also featured:
- Drag and Drop: Move cards between columns to update their workflow status with a single action.
- Columns: Group cards by workflow stage such as Open, In Progress, Testing, and Close.
- Card Settings: Map the title, summary, tags, and footer image to display rich card content.
Key interactive features demonstrated in this sample include:
- Drag and Drop: Click and hold any card to drag it across columns. The board updates status as soon as the card is dropped.
- Card Footer: Each card displays type, priority, and assignee avatars using built-in CSS field mappings.
- Tag Visualization: Tags appear as colored chips on each card for quick scanning of categories.
- Auto Layout: Columns are automatically sized to fit the available board width without any manual configuration.
The Board Configuration highlights the minimum property surface needed to render a fully functional Kanban:
- DataSource: Binds the task collection that supplies the cards rendered on the board.
- KeyField: Maps the data field that determines which column a card belongs to.
- KanbanColumns: Declares the column collection using header text and a matching key field.
- KanbanCardSettings: Configures the header, content, footer image, and tag fields on each card.
Looking for the full Blazor Kanban component overview, features, pricing, and documentation? Visit the Blazor Kanban page.