1.0.0-alpha.2 • Published 3 years ago

@talixo/data-table v1.0.0-alpha.2

Weekly downloads
8
License
MIT
Repository
github
Last release
3 years ago

Talixo DataTable

UI Component which represents DataTable

How to install

Package is available as @talixo/data-table in NPM registry, so you can use it in your project using npm install @talixo/data-table --save or yarn add @talixo/data-table.

Requirements

Your package should additionally have some extra dependencies:

  • @talixo/icon: ^0.1.1
  • @talixo/shared: ^0.1.0
  • @talixo/table: ^0.1.0
  • lodash: ^4.17.10
  • prop-types: ^15.6.1
  • react: ^16.2.0
  • react-dom: ^16.2.0

These packages are required by @talixo/data-table, but you have to install them manually, to avoid having different versions of these in your application.

Supported props

It allows any props which are allowed for Table omponent from @talixo/table. Additionally, it handles some differently:

Property nameTypeRequiredDefaultDescription
actionsActions[]non/aActions which can be applied to rows.
buildIdfunctionno(row, idx) => row.idFunction which will be used to add ID to object items if these are not already inside them.
classNamestringnon/aAdditional class name passed to wrapper.
columnsColumn[]yesn/aInformation about columns which will be displayed in table.
dataobject[]yesn/aData to be populated inside table. Require the same keys as inc olumns objects.
expandRenderfunctionnon/aRender function of items which will be displayed in table collapsible rows.
expandedRowsarraynon/aArray should contain IDs of expanded rows. Its elements should be id properties of data items (if provided) or indexes of elements in data array.
onClickfunctionnon/aRow onClick callback function.
onSortfunctionnon/aonSort function callback.
sortablebooleannofalseIndicates if table is sortable.
sortColumnstringnoself-constrolledID of the column according to which data is sorted.
reversedOrderbooleannoself-constrolledIndicates if table is sortable.
verticalActionCellstringnon/aIndicates if actions should be displayed vertically or horizontally.

Property shapes

Actions

Property nameTypeRequiredDefaultDescription
conditionfunctionnon/aFunction which indicates if button should be displayed. Assigns item from data as function argument.
iconstringyesn/aButton icon name from @talixo/icon package.
labelstringyesn/aButton label.
onClickfunctionnon/aonClick callback function.

Column

Property nameTypeRequiredDefaultDescription
idstring or numberyesn/aId of given column.
namestringyesn/aName of the column. This will be displayed inside table header.
renderfunctionnon/aRender function of items to be displayed in table cells of give column.
renderHeaderfunctionnon/aRender function of given header.

Changelog

  • 0.1.0 - initial version
1.0.0-alpha.36

3 years ago

1.0.0-alpha.35

3 years ago

1.0.0-alpha.31

3 years ago

1.0.0-alpha.30

3 years ago

1.0.0-alpha.27

3 years ago

1.0.0-alpha.26

3 years ago

1.0.0-alpha.25

3 years ago

1.0.0-alpha.24

3 years ago

1.0.0-alpha.20

4 years ago

1.0.0-alpha.19

4 years ago

1.0.0-alpha.18

4 years ago

1.0.0-alpha.16

4 years ago

1.0.0-alpha.12

4 years ago

1.0.0-alpha.7

4 years ago

1.0.0-alpha.6

4 years ago

1.0.0-alpha.5

4 years ago

1.0.0-alpha.4

4 years ago

1.0.0-alpha.3

4 years ago

1.0.0-alpha.2

4 years ago