Components Table

Components

LmnTableComponent

import { LmnTableComponent } from '@elemental/ui';

Decorators:	`@Component`
Generic types:	`DATA`
Selectors:	`table[lmn-table]`

Properties

Name	Type	Description
allowReorder r	`InputSignalWithTransform<boolean, unknown>`	Allow reordering of the rows.
loadingChunkSize r	`InputSignal<number>`	Loading chunk size for the table.
nativeElement r	`HTMLElement`	Native element of the component.
negative r	`InputSignalWithTransform<boolean, unknown>`	Negative variant of the table.
rowSize r	`InputSignal<LmnTableRowSize>`	Row size for the table.
sorting r	`Signal<LmnSorting[] \| undefined>`	The sorting state.
sortingEnabled r	`Signal<boolean>`	Whether the sorting is enabled.
source r	`InputSignal<DATA[]>`	Data source for the table.
toggleSelectionOnRowClick r	`InputSignalWithTransform<boolean, unknown>`	Allow selection of the rows on click.
trackBy r	`InputSignal<LmnTableTrackByFn<DATA>>`	TrackBy function used when rendering the row and cells.

Methods

addColumnDef()

Add a column definition for the table.

Presentation

addColumnDef(columnDef: LmnColumnDefDirective): void;

Parameters

Name	Type	Description
columnDef	`LmnColumnDefDirective`

Returns

void

clearColumnDefs()
Remove all column definitions from the table
Presentation `clearColumnDefs(): void;`
Returns `void`

clearFooterRowDef()
Remove the footer row definition from the table
Presentation `clearFooterRowDef(): void;`
Returns `void`

clearHeaderRowDef()
Remove the header row definition from the table
Presentation `clearHeaderRowDef(): void;`
Returns `void`

clearNoDataRowDef()
Remove the no data row definition from the table
Presentation `clearNoDataRowDef(): void;`
Returns `void`

clearRowDefs()
Remove all row definitions from the table
Presentation `clearRowDefs(): void;`
Returns `void`

removeColumnDef()

Remove a column definition from the table

Presentation

removeColumnDef(columnDef: LmnColumnDefDirective): void;

Parameters

Name	Type	Description
columnDef	`LmnColumnDefDirective`

Returns

void

rowSelection()

Select programmatically a row

Presentation

rowSelection(index: number, event?: MouseEvent | undefined): void;

Parameters

Name	Type	Description
index	`number`
event	`MouseEvent \| undefined`

Returns

void

setFooterRowDef()

Set a footer row definition for the table

Presentation

setFooterRowDef(footerRowDef: LmnFooterRowDefDirective): void;

Parameters

Name	Type	Description
footerRowDef	`LmnFooterRowDefDirective`

Returns

void

setHeaderRowDef()

Set a header row definition for the table

Presentation

setHeaderRowDef(headerRowDef: LmnHeaderRowDefDirective): void;

Parameters

Name	Type	Description
headerRowDef	`LmnHeaderRowDefDirective`

Returns

void

setNoDataRowDef()

Set a no data row definition for the table

Presentation

setNoDataRowDef(noDataRowDef: LmnNoDataRowDefDirective): void;

Parameters

Name	Type	Description
noDataRowDef	`LmnNoDataRowDefDirective`

Returns

void

setRowDef()

Set a row definition for the table

Presentation

setRowDef(rowDef: LmnRowDefDirective<DATA>): void;

Parameters

Name	Type	Description
rowDef	`LmnRowDefDirective<DATA>`

Returns

void

sort()

Sort a column

Presentation

sort(column: string, value?: LmnSortingDirection | undefined): void;

Parameters

Name	Type	Description
column	`string`
value	`LmnSortingDirection \| undefined`

Returns

void

LmnCellComponent

import { LmnCellComponent } from '@elemental/ui';

Decorators:	`@Component`
Selectors:	`td[lmn-cell]` `th[lmn-cell]` `th[lmn-header-cell]` `td[lmn-footer-cell]` `th[lmn-footer-cell]`

Properties

Name	Type	Description
columnName r	`Signal<string>`	The column name of the cell
focusableChildren r	`Signal<HTMLElement[]>`	The focusable children of the cell
nativeElement r	`HTMLElement`	Native element reference
requireActivation r	`InputSignalWithTransform<boolean, unknown>`	Whether the cell requires activation to be navigated
type r	`"header" \| "footer" \| "data"`	The type of the cell
width r	`Signal<LmnCellWidth \| null>`	The width of the cell

LmnRowComponent

import { LmnRowComponent } from '@elemental/ui';

Decorators:	`@Component`
Selectors:	`tr[lmn-row]` `tr[lmn-header-row]` `tr[lmn-footer-row]`

Properties

Name	Type	Description
cells r	`WritableSignal<LmnCellComponent[]>`	The cells in the row.
focusableChildren r	`Signal<LmnTableFocusableChild[]>`	The focusable children in the row.
nativeElement r	`HTMLElement`	Native element of the row.
type r	`"header" \| "footer" \| "data"`	Type of the row.
width r	`Signal<number \| undefined>`	The width of the row.

Methods

recalculateStickyCells()
Recalculate the sticky cells in the row.
Presentation `recalculateStickyCells(): void;`
Returns `void`

reorderFocusableCells()
Reorder the focusable cells in the row.
Presentation `reorderFocusableCells(): void;`
Returns `void`

Directives

LmnCellDefDirective

import { LmnCellDefDirective } from '@elemental/ui';

Decorators:	`@Directive`
Generic types:	`T`
Selectors:	`[lmnCellDef]`
Extends:	`LmnBaseCellDefDirective`

Properties

Name	Type	Description
template inherited from `LmnBaseCellDefDirective`	`TemplateRef<any>`	Template for the cell definition.

LmnHeaderCellDefDirective

import { LmnHeaderCellDefDirective } from '@elemental/ui';

Decorators:	`@Directive`
Selectors:	`[lmnHeaderCellDef]`
Extends:	`LmnBaseCellDefDirective`

Properties

Name	Type	Description
template inherited from `LmnBaseCellDefDirective`	`TemplateRef<any>`	Template for the cell definition.

LmnFooterCellDefDirective

import { LmnFooterCellDefDirective } from '@elemental/ui';

Decorators:	`@Directive`
Selectors:	`[lmnFooterCellDef]`
Extends:	`LmnBaseCellDefDirective`

Properties

Name	Type	Description
template inherited from `LmnBaseCellDefDirective`	`TemplateRef<any>`	Template for the cell definition.

LmnColumnDefDirective

import { LmnColumnDefDirective } from '@elemental/ui';

Decorators:	`@Directive`
Selectors:	`[lmnColumnDef]`

Properties

Name	Type	Description
allowResize r	`InputSignalWithTransform<boolean, unknown>`	Allows resizing of the column.
allowSorting r	`InputSignalWithTransform<boolean, unknown>`	Allows sorting of the column.
columnWidth r	`InputSignal<string \| number \| null>`	Fixed width of the column. Can be a string, number, or null for default width.
dataCellDef r	`Signal<LmnCellDefDirective<any> \| undefined>`	Template for the data cell of the column.
defaultSorting r	`InputSignal<LmnColumnSorting>`	Default sorting order of the column. Can be 'asc' for ascending, 'desc' for descending, or null for no sorting.
fixed r	`InputSignal<LmnColumnFixedPosition \| undefined>`	Fixed position of the column. Can be 'start', 'end', or undefined for no fixed position.
footerCellDef r	`Signal<LmnFooterCellDefDirective \| undefined>`	Template for the footer cell of the column.
headerCellDef r	`Signal<LmnHeaderCellDefDirective \| undefined>`	Template for the header cell of the column.
name r	`InputSignal<string>`	Name of the column.
resizing r	`WritableSignal<boolean>`	Indicates if the column is currently being resized.

LmnRowDefDirective

import { LmnRowDefDirective } from '@elemental/ui';

Decorators:	`@Directive`
Generic types:	`T`
Selectors:	`[lmnRowDef]`
Extends:	`LmnBaseRowDefDirective`

Properties

Name	Type	Description
columns r overrides `LmnBaseRowDefDirective`	`InputSignal<string[]>`	Columns to render in the row.
id r inherited from `LmnBaseRowDefDirective`	`string`	Unique identifier for the row definition.
selectionDisabled r	`InputSignalWithTransform<LmnRowEnablingFn<T>, LmnRowEnablingFn<T> \| undefined>`	Function that determines whether the row should be selectable.
show r	`InputSignal<LmnRowEnablingFn<T>>`	Function that determines whether the row should be shown.
skipSelection r inherited from `LmnBaseRowDefDirective`	`InputSignalWithTransform<boolean, unknown>`	Whether the row should have selection.
template r inherited from `LmnBaseRowDefDirective`	`TemplateRef<any>`	Template for the row definition.

LmnHeaderRowDefDirective

import { LmnHeaderRowDefDirective } from '@elemental/ui';

Decorators:	`@Directive`
Selectors:	`[lmnHeaderRowDef]`
Extends:	`LmnBaseRowDefDirective`

Properties

Name	Type	Description
columns r overrides `LmnBaseRowDefDirective`	`InputSignal<string[]>`	Columns to render in the row.
fixed r	`InputSignalWithTransform<boolean, unknown>`	Whether the row should be fixed.
id r inherited from `LmnBaseRowDefDirective`	`string`	Unique identifier for the row definition.
skipSelection r inherited from `LmnBaseRowDefDirective`	`InputSignalWithTransform<boolean, unknown>`	Whether the row should have selection.
template r inherited from `LmnBaseRowDefDirective`	`TemplateRef<any>`	Template for the row definition.

LmnFooterRowDefDirective

import { LmnFooterRowDefDirective } from '@elemental/ui';

Decorators:	`@Directive`
Selectors:	`[lmnFooterRowDef]`
Extends:	`LmnBaseRowDefDirective`

Properties

Name	Type	Description
columns r overrides `LmnBaseRowDefDirective`	`InputSignal<string[]>`	Columns to render in the row.
id r inherited from `LmnBaseRowDefDirective`	`string`	Unique identifier for the row definition.
skipSelection r overrides `LmnBaseRowDefDirective`	`InputSignalWithTransform<boolean, unknown>`	Whether the row should have selection.
template r inherited from `LmnBaseRowDefDirective`	`TemplateRef<any>`	Template for the row definition.

LmnNoDataRowDefDirective

import { LmnNoDataRowDefDirective } from '@elemental/ui';

Decorators:	`@Directive`
Selectors:	`[lmnNoDataRowDef]`

Properties

Name	Type	Description
template r	`TemplateRef<any>`	Template for the row definition.

Components

LmnTableComponent

Properties

Methods

addColumnDef()

Presentation

Parameters

Returns

clearColumnDefs()

Presentation

Returns

clearFooterRowDef()

Presentation

Returns

clearHeaderRowDef()

Presentation

Returns

clearNoDataRowDef()

Presentation

Returns

clearRowDefs()

Presentation

Returns

removeColumnDef()

Presentation

Parameters

Returns

rowSelection()

Presentation

Parameters

Returns

setFooterRowDef()

Presentation

Parameters

Returns

setHeaderRowDef()

Presentation

Parameters

Returns

setNoDataRowDef()

Presentation

Parameters

Returns

setRowDef()

Presentation

Parameters

Returns

sort()

Presentation

Parameters

Returns

LmnCellComponent

Properties

LmnRowComponent

Properties

Methods

recalculateStickyCells()

Presentation

Returns

reorderFocusableCells()

Presentation

Returns

Directives

LmnCellDefDirective

Properties

LmnHeaderCellDefDirective

Properties

LmnFooterCellDefDirective

Properties

LmnColumnDefDirective

Properties

LmnRowDefDirective

Properties

LmnHeaderRowDefDirective

Properties

LmnFooterRowDefDirective

Properties

LmnNoDataRowDefDirective

Properties