Releases: komarovalexander/ka-table
Make headerFilterButton customizable by childComponents
headFilterButton was added to childComponents
childComponents={{
headFilterButton: {
content: ({ column: {key}}) => key === 'name' && <></>,
},
}}
demo: https://komarovalexander.github.io/ka-table/#/header-filter
InsertRow action
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
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
- column has 2 new options:
width
&colGroup
(width
actually is syntax sugar and it is the same ascolGroup.width
) - 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:
- use
column.width
instead ofcolumn.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:
- IPagingPagesProps was removed and
pages
property does not exist anymore in PagesSelector component - removed filterRow js-autocalcutation. Its top position calculated according to
$ka-header-cell-height
scss variable - 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
- New
colgroup
element was added to mockup 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
Summary row
Add custom logic for Sorting and Filtering
| filter | (props: {
| Returns filter function (Demo: Filter Custom Logic) |
column: Column
}) => ((value: any, filterRowValue: any) => boolean) | void;
| sort | (props: {
| Returns sorting function (Demo: Sorting Custom Logic) |
column: Column
}) => ((value1: any, value2: any) => 0 | 1 | -1) | void;
Add paging.position property
specifies the place where paging should be located: 'bottom', 'top', 'topAndBottom'
{
paging: {
enabled: true,
position: 'top'
}
}