Kanban Board
lowcodera Kanban Board Component
Visually depict work at various stages of a process using cards to represent work items and columns to represent each stage of the process.
Configuration of Datasets
There are 3 Dataset which need to be configured to operate the lowcodera Kanban component.
Boards dataset – defines the number of boards and their respective properties. Boards are reflected as columns in Kanban.
Work Items dataset – defines the individual work items which are laid out as cards on the Kanban Board
Labels dataset – defines the various tags which can be added to the Work Item cards.
Boards Dataset
The boards dataset expects a JSON collection with various attributes which are defined below
Attribute | Type | Description |
id | String | The unique identifier for the board |
title | String | The name of the board which is presented at the top |
color | String | The color of the text for the title |
backgroundColor | String | The background color of the board |
icon | String | The icon which is presented next to the title at the top. |
enableAdd | Boolean | Determines whether the board supports the option to add new work items to its |
Work Items Dataset
The Work Items dataset expects a JSON collection with various attributes which are defined below.
Attribute | Type | Description |
id | String | The unique identifier for the Work Item |
title | String | The Title of the Work Item that appears on the card |
description | String | The description of the Work Item that appears on the card |
assignedTo | String | The text which will represent who the Work Item is assigned to |
labels | String | The tags which are associated with this Work Item |
dueDate | Date | The due date of the work item |
icon | String | Defines the icon to represent the work item |
iconColor | String | Defines the color of the Work Item icon |
color | String | Sets the color of the outside border of the card |
order | Number | Defines the position of the Work Item on the board |
Labels dataset
The Labels dataset expects a JSON collection with various attributes which are defined below.
Attribute | Type | Description |
id | String | The unique identifier for label |
title | String | The name of the label |
color | String | The color of the text for the title |
backgroundColor | String | The background color of the label |
icon | String | The icon for the label |
Component Properties
The lowcodera Kanban component has various configuration properties which are documented below.
Property | Description |
Items Dataset | The Work Items dataset |
Boards Data set | The Boards dataset |
Labels Data Set | The Labels dataset |
Draggable | Sets whether items are draggable between boards |
Min Width | Specifies the minimum width for a board |
Board Title Font Size | Font size of Board title |
Work Item ID Font Size | Font size of Work Item ID |
Work Item Title Font Size | Font size of Work Item Title |
Work Item Description Font Size | Font size of Work Item Title |
Show Work Item Icon | Sets visibility of Work Item icon |
Show Work Item ID | Sets visibility of Work Item ID |
Show Tags | Sets visibility of Work Item labels |
Work Item Title Clickable | Specifies whether titles of Work Items are Clickable |
Show Work Item Description | Sets visibility of Work Item Description |
Show Work Item Assigned To | Sets visibility of Work Item Assignee |
Show Work Item Due Date | Sets visibility of Work Item Due Date |
Work Item Due Date Format | Date format of due date. Default is “DD/MM/YYYY” |
Output Properties & Events
For handling changes and user interactivity on the Kanban, you can make use of the EventType output property. For example, when a user drags a card between boards you may wish to patch these changes to a data source. There are also other output properties which you can use in your PowerFX for handling changes in the OnChange property of the component.
Property | Description |
EventType | WorkItemDragged Set when a Work Item card is dragged by a user
AddWorkItem Set when a user selects a Boards Add new item icon
WorkItemSelected Set when the user clicks on a Work Item Title |
CurrentBoardID | Returns the board ID of the current item |
CurrentWorkItemOrder | Returns the position of the current item on the board |
CurrentWorkItemID | Returns the Work Item ID of the current board |
Last updated