Getting StartedInstallation and setup guides 5
LayoutWorkflow and structural layout components 7
OverlayModal and floating layer surfaces 3
FeedbackStatus, empty, progress, and loading placeholder patterns 5
FormInput and selection components 17
UtilityGeneral-purpose interface utilities 7
NavigationMenu surfaces and hierarchical actions 7

Table API

Import TngTableComponent from @tailng-ui/components and pass column definitions plus row items.

Inputs

NameTypeDescription
columnsreadonly TngTableColumn<TRow>[] Column ids, labels, accessors, alignment, sorting, sticky position, truncation, and width.
itemsreadonly TRow[]Rows rendered into the table body.
density'comfortable' | 'compact'Controls vertical cell padding.
layout'auto' | 'fixed'Sets the native table layout mode.
loading, errorbooleanRender full-width state rows.
stickyHeaderbooleanMakes the header row sticky inside the scroll container.
sortActive, sortDirectionstring | nullControlled sorting state forwarded to sortable headers.

Outputs and templates

  • sortChange emits TngTableSortChange when a sortable header changes.
  • ng-template[tngTableCellTemplate] customizes body cells by column id.
  • ng-template[tngTableHeaderTemplate] customizes header cells by column id.