ColumnToolbars
Feature

Adds toolbars to the top and/or bottom of each column. By default it adds a bottom toolbar containing a single button for adding events to that column/swimlane:

To add, remove or modify toolbar items for all columns, see topItems and bottomItems:

To have per column/swimlane control over the items, see processItems:

In handlers for buttons etc, you can access which column/swimlane the action was taken in on the supplied source param, using its columnRecord and swimlaneRecord properties:

new TaskBoard({
   features : {
       columnToolbars : {
           topItems : {
               clearButton : {
                   icon    : 'fa fa-trash',
                   onClick({ source }) {
                       if (source.columnRecord) {
                           ...
                       }
                   }
               }
           }
       }
   }
});

This feature is enabled by default.

No results

Configs

Configs are options you supply in a configuration object when creating an instance of this class

bottomItems : Object<String, WidgetConfig | Boolean | null>

Items to add to the bottom toolbar, in object format.

To remove existing items, set corresponding keys to null.

new TaskBoard({
   features : {
       columnToolbars : {
           bottomItems : {
               clearButton : {
                   icon    : 'fa fa-trash',
                   onClick : ...
               }
           }
       }
   }
});

processItems : Function
A function called before displaying the toolbar that allows manipulations of its items. Returning false from this function prevents the menu being shown.
```
features         : {
   columnToolbars : {
        processItems({ items, location, columnRecord, swimlaneRecord }) {
            // Add or hide existing items here as needed
            items.myAction = {
                text   : 'Cool action',
                icon   : 'fa fa-ban',
                onClick : () => console.log(`Clicked button for ${columnRecord.text}`)
            };

           if (columnRecord.id === 'done') {
               items.addTask = false
           }
        }
    }
},
```
Parameters
- context : Object
  
  An object with information about the toolbar being shown
- feature : ColumnToolbars
  
  A reference to this feature.
- items : Object<String, WidgetConfig>
  
  An object containing the toolbar item configs keyed by ref
- location : 'top'/'bottom'
  
  Toolbar location, "top" or "bottom"
- columnRecord : ColumnModel
  
  Record representing toolbars column
- swimlaneRecord : SwimlaneModel
  
  Record representing toolbars swimlane
Returns

Boolean/null
:

Returning false from this function prevents the menu being shown

topItems : Object<String, WidgetConfig | Boolean | null>

Items to add to the top toolbar, in object format.

new TaskBoard({
   features : {
       columnToolbars : {
           topItems : {
               clearButton : {
                   icon    : 'fa fa-trash',
                   onClick : ...
               }
           }
       }
   }
});

Properties

Properties are getters/setters or publicly accessible variables on this class

isColumnToolbars : Booleantrue

READONLY

static

ADVANCED

Identifies an object as an instance of ColumnToolbars class, or subclass thereof.

isColumnToolbars : Booleantrue

READONLY

ADVANCED

Identifies an object as an instance of ColumnToolbars class, or subclass thereof.

CSS variables

CSS variables that can be set to adjust appearance

Name	Description
--b-task-board-column-toolbars-color	Primary color for buttons in column toolbars
--b-task-board-column-toolbars-font-size	Font size for buttons in column toolbars

ColumnToolbars
Feature

Configs

Parameters

Returns

Properties

CSS variables

Source path

Inheritance tree4

Mixins2

Contents

ColumnToolbars Feature

Configs

Parameters

Returns

Properties

CSS variables

Source path

Inheritance tree4

Mixins2

Contents

ColumnToolbars
Feature