fc-card-list

An element by Forter

Usage

<script>
   import '@forter/card-list';
</script>

<fc-card-list>
</fc-card-list>

Property	Attribute	Type	Description
`ROW_INTENTS`		`{}`
`columns`	`columns`	`any[]`	Columns titles
`getRowClass`		`(rowClass: any, intent: any) => any`
`getSortedRows`		`() => any`
`renderColumnsHeaders`		`() => TemplateResult`
`renderData`		`(intent: any, data: any) => TemplateResult`
`renderDataCell`		`({ label, customRenderer }: { label: any; customRenderer: any; }) => any`
`renderRows`		`() => TemplateResult`
`rows`	`rows`	`any`	Example: { intent: 'disabled', data: [{label: '1'}, {label: '2'}] }
`sortBy`	`sortBy`	`any[]`	This is an option to sort rows by a specific key of the rows data. After providing this object the card-list will sort rows depending on it. columnIndex is the index of column you wish to compare. I.e. if we have following columns list (['order', 'name', 'level']) and we want to order by 'order' columns, columnIndex should be 0 (as its the first column on the list). sortKey should be the key in the row's data we want to sort by. I.e. if a row's data is: data: [{label: '1', value: 1}, {label: '2', value: 2}] we can either sort by 'label' or by 'value'. The sortFunction should be accordingly to the key's type (number, string..) as in next example: { columnIndex: 0, sortKey: 'value', sortFunction: (a,b) => {return a-b} }

Property	Description
`--fc-card-list-disabled-color`	disabled color. example: `gray`