Getting Started

Angular

Install these libraries:

npm i -s @state-adapt/core
npm i -s @state-adapt/rxjs
npm i -s @state-adapt/angular

Once installed, StateAdapt is ready to use. Examples

For configuration options, see @state-adapt/angular.

StackBlitz Starter

With NgRx/Store

You probably don't need this.

This enables

1. Redux Devtools to sync and show both stores' states together
2. Selecting from both global states. StateAdapt's state is nested in a hidden top-level adapt reducer.

DEPRECATED

The @state-adapt/ngrx library is deprecated and will be removed in StateAdapt v4.

If you still need it, copy the files from https://github.com/state-adapt/state-adapt/tree/main/libs/ngrx/src/lib into your project and use them directly.

First, install:

npm i -s @state-adapt/{core,rxjs,angular,ngrx}

Add to the root NgRx/Store config:

import { isDevMode } from '@angular/core';
import { bootstrapApplication } from '@angular/platform-browser';
import { provideStore } from '@ngrx/store';
import { provideStoreDevtools } from '@ngrx/store-devtools';
import { adaptReducer, actionSanitizer, stateSanitizer } from '@state-adapt/core'; 

import { AppComponent } from './app.component';

bootstrapApplication(AppComponent, {
  providers: [
    provideStore({
      count: counterReducer,
      adapt: adaptReducer, 
    }),
    provideStoreDevtools({
      logOnly: !isDevMode(),
      actionSanitizer, 
      stateSanitizer, 
    }),
  ],
});

Now in a component or service:

import { adaptNgrx } from '@state-adapt/ngrx';
// ...
nameStore = adaptNgrx('Bob');

StackBlitz Starter