Skip to content

Releases: komarovalexander/ka-table

Make headerFilterButton customizable by childComponents

15 Aug 20:09
a32fcd9
Compare
Choose a tag to compare

#223

headFilterButton was added to childComponents

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

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

InsertRow action

24 Oct 19:16
89de053
Compare
Choose a tag to compare

Header Filter

05 Oct 17:06
51d8bc1
Compare
Choose a tag to compare

Validate, SaveEditors, OpenAllEditors action types

18 Aug 17:09
d413e78
Compare
Choose a tag to compare

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

08 Aug 20:43
339a589
Compare
Choose a tag to compare

#170 #153

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

image

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

06 Jul 17:04
a9ac860
Compare
Choose a tag to compare

image

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

29 Jun 21:38
3344af0
Compare
Choose a tag to compare

Summary row

04 Jun 18:43
4ca4176
Compare
Choose a tag to compare

Add custom logic for Sorting and Filtering

20 Mar 21:29
ad6ef25
Compare
Choose a tag to compare

| 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

13 Feb 10:48
0374efb
Compare
Choose a tag to compare

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

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

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