Make headerFilterButton customizable by childComponents

#223

headFilterButton was added to childComponents

      childComponents={{
        headFilterButton: {
          content: ({ column: {key}}) => key === 'name' && <></>,
        },
      }}

demo: https://komarovalexander.github.io/ka-table/#/header-filter

InsertRow action

Demo: https://komarovalexander.github.io/ka-table/#/insert-row

Header Filter

Demo: https://komarovalexander.github.io/ka-table/#/header-filter

Thanks to @Alexander-SD for implementing that!

Validate, SaveEditors, OpenAllEditors action types

new action type: ActionType.Validate, action creator validate()
this action can be used to trigger validation on all cells in the grid

new action type: ActionType.SaveEditors, action creator saveEditors()
is used to save all editors value

new action type: ActionType.OpenAllEditors, action creator openAllEditors()
is used to add editableCells for each data cell

Grouped Columns

#170 #153

Demo: https://komarovalexander.github.io/ka-table/#/grouped-columns
Docs: http://ka-table.com/docs_props.html#toc0

colGroup is used to set width #153 to support column resizing in this feature

1. column has 2 new options: width & colGroup (width actually is syntax sugar and it is the same as colGroup.width)
2. Table has new groupedColumns option:

{
  ...
  gropedColumns: [{
    public key!: string;
    public title?: string;
    public columnsKeys!: string[]; // list of children keys (can be Column or another GropedColumn)
  }]
}

recommendations:

1. use column.width instead of column.styles.width - note: column.width should has bigger value because it will include padding as well (this is the difference between colGroup width and td width)

breaking changes:

1. IPagingPagesProps was removed and pages property does not exist anymore in PagesSelector component
2. removed filterRow js-autocalcutation. Its top position calculated according to $ka-header-cell-height scss variable
3. Virtual scrolling does not show empty element in top or bottom if its height === 0 https://github.com/komarovalexander/ka-table/pull/173/files#diff-feb5dffdce3a5adf4ad4d12f2fb22e40fe19728bd485828cb63988e90873a4aaR44 - if you have infinite scrolling add this offset value to condition https://github.com/komarovalexander/ka-table/pull/173/files#diff-984127a1c2b9946bf5daf8a43cb4829c5e85d407421efeaa3c172c15e88c19b1R52
4. New colgroup element was added to mockup
5. resizeColumn(key, newWidth) is used instead of {type: 'HeadCellResizeStateAction', width: 50}

Tree Mode

new ActionType: ActionType.UpdateTreeGroupsExpanded
actionCreator: updateTreeGroupsExpanded(rowKeyValue: any)

new props:

  treeGroupKeyField?: string; 
  treeGroupsExpanded?: any[]; // undefined - all rows are expanded

Demo: https://komarovalexander.github.io/ka-table/#/tree-mode
Docs: http://ka-table.com/docs_props.html

Group Summary Row

Demo: https://komarovalexander.github.io/ka-table/#/grouping-summary
Docs: http://ka-table.com/docs_props.html#group

Summary row

Demo: https://komarovalexander.github.io/ka-table/#/summary
Doc: http://ka-table.com/docs_props.html#childcomponents

Add custom logic for Sorting and Filtering

| filter | (props: {
column: Column
}) => ((value: any, filterRowValue: any) => boolean) | void; | Returns filter function (Demo: Filter Custom Logic) |
| sort | (props: {
column: Column
}) => ((value1: any, value2: any) => 0 | 1 | -1) | void; | Returns sorting function (Demo: Sorting Custom Logic) |

Add paging.position property

specifies the place where paging should be located: 'bottom', 'top', 'topAndBottom'

{
  paging: {
    enabled: true,
    position: 'top'
  }   
}

demo: https://komarovalexander.github.io/ka-table/#/paging