Getting Started

Install these libraries:

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

StackBlitz

---

For advanced configuration, see provideStore and IS_STORE_LOCAL.

Agents

Every StateAdapt package ships an agent skill containing its full API reference:

npx skills add ./node_modules/@state-adapt/core --skill state-adapt-core
npx skills add ./node_modules/@state-adapt/rxjs --skill state-adapt-rxjs
# etc

Or skip the skills

This article explains how every skill's name and description sit in the agent's context on every request, and the more skills you install, the more confused agents can get.

The references ship inside the packages either way, so an alternative is to create a dev.md file and point agents to it for development tasks. In this file you can describe code conventions and useful references:

<!-- dev.md -->
Always prefer declarative code and avoid imperative code.

API references for @state-adapt packages are in
node_modules/@state-adapt/*/skills/*/references

ESLint Plugin: No Spaghetti

Experimental: The rule and its configuration may change as we learn from real-world use.

@state-adapt/eslint-plugin-spaghetti helps minimize spaghetti code. It analyzes imperative commands and reports an error when they reach too far across functions, scopes, files, or folders.

Install the plugin and its peer dependencies:

npm install --save-dev @state-adapt/eslint-plugin-spaghetti @state-adapt/spaghetti-core @typescript-eslint/parser eslint

Then extend its recommended configuration for TypeScript files in .eslintrc.json:

{
  "overrides": [
    {
      "files": ["*.ts", "*.tsx"],
      "excludedFiles": ["*.spec.ts", "*.spec.tsx", "*.test.ts", "*.test.tsx"],
      "extends": ["plugin:@state-adapt/spaghetti/recommended"]
    }
  ]
}

This rule requires type-aware linting to resolve calls and resources across the project. With @typescript-eslint/parser v8 or newer, enable the TypeScript project service in the configuration that applies to TypeScript files:

{
  "languageOptions": {
    "parserOptions": {
      "projectService": true
    }
  }
}

Legacy .eslintrc configurations and parser v7 use parserOptions.project:

{
  "parserOptions": {
    "project": ["./tsconfig.json"]
  }
}

These examples show the underlying typescript-eslint settings. Tooling that manages ESLint configuration may require them elsewhere. See the typescript-eslint typed-linting guide for general setup, or Configuring ESLint with TypeScript for Nx workspaces, including flat and legacy configurations.

For advanced configuration, see the no-spaghetti rule reference.