Choose the native wrapper
Install the wrapper beside wts-data-table. Framework runtimes stay peer dependencies, so React, Vue, and Angular are never bundled into the core package.
- Angular 17–22: standalone component, ready/destroyed outputs, two-way state, and template directives.
- React 18/19: forwarded controller ref, controlled state, and native render functions.
- Vue 3: v-model state, scoped slots, a typed factory, and a composable.
Reactive update contract
Replacing data updates rows in place and preserves view state. Replacing the options object intentionally reconstructs configuration. Memoize options in React and keep a stable reference in Angular and Vue unless remounting is intended.
Native content and cleanup
Cells, headers, filters, menus, details, empty/loading states, and footers can use framework-owned views. Wrappers reclaim those views on redraw and destroy the controller on unmount.
@Component({
imports: [WtsDataTableAngularComponent],
template: `<wts-data-table-angular
[data]="people()"
[options]="options"
[(state)]="state"
(ready)="table = $event"
/>`
})
export class PeopleTable {}