A standalone list driven entirely by consumer-owned controls: sort buttons and field visibility chips write the surface state signal, and the search field is the showcase's own component — it registers itself on the surface service and filters the list globally.
Minimal example
<!-- The list has no header UI — sort, search, and visibility are consumer-owned. -->
<nat-table-surface [(state)]="state">
<app-table-search placeholder="Search orders" />
<nat-list [columns]="columns" [data]="rows" accessibleName="Orders" />
</nat-table-surface>// component.ts — sorting and visibility write the surface state signal.
protected sortBy(columnId: string, desc: boolean): void {
this.state.update((current) => ({ ...current, sorting: [{ id: columnId, desc }] }));
}
protected toggleField(columnId: string, visible: boolean): void {
this.state.update((current) => ({
...current,
columnVisibility: { ...current.columnVisibility, [columnId]: visible }
}));
}
// The search component is consumer code too: it injects NatTableService,
// calls registerSearch() (which enables global filtering), and pushes the
// query via controller.patchState({ globalFilter }).Fields — click a name to show or hide it
Showing 12 items across 9 visible fields.
- Order
ORD-10000 Customer Summit CrestCompany Summit Crest LogisticsChannel OnlineRegion WestStatusReady Items 5Updated Jun 1Total $1,500 - Order
ORD-10001 Customer Beacon TechCompany Beacon Tech LabsChannel RetailRegion MidwestStatusReview Items 12Updated Jun 2Total $5,400 - Order
ORD-10002 Customer Horizon VenturesCompany Horizon Ventures GroupChannel WholesaleRegion NortheastStatusQueued Items 19Updated Jun 3Total $11,400 - Order
ORD-10003 Customer Vanguard SystemsCompany Vanguard Systems CorpChannel OnlineRegion SouthStatusReady Items 26Updated Jun 4Total $19,500 - Order
ORD-10004 Customer Zenith LogisticsCompany Zenith Logistics ServicesChannel RetailRegion WestStatusReview Items 33Updated Jun 5Total $29,700 - Order
ORD-10005 Customer Quantum EnergyCompany Quantum Energy GroupChannel WholesaleRegion MidwestStatusQueued Items 40Updated Jun 6Total $42,000 - Order
ORD-10006 Customer Pacific TradeCompany Pacific Trade & SupplyChannel OnlineRegion NortheastStatusReady Items 47Updated Jun 7Total $56,400 - Order
ORD-10007 Customer Caliber ManufacturingCompany Caliber Manufacturing CoChannel RetailRegion SouthStatusReview Items 9Updated Jun 8Total $12,150 - Order
ORD-10008 Customer Summit CrestCompany Summit Crest LogisticsChannel WholesaleRegion WestStatusQueued Items 16Updated Jun 9Total $24,000 - Order
ORD-10009 Customer Beacon TechCompany Beacon Tech LabsChannel OnlineRegion MidwestStatusReady Items 23Updated Jun 10Total $37,950 - Order
ORD-10010 Customer Horizon VenturesCompany Horizon Ventures GroupChannel RetailRegion NortheastStatusReview Items 30Updated Jun 11Total $9,000 - Order
ORD-10011 Customer Vanguard SystemsCompany Vanguard Systems CorpChannel WholesaleRegion SouthStatusQueued Items 37Updated Jun 12Total $16,650