feat(signals): allow access to methods in withComputed (#4864)

Closes #4846

Author: rainerhahnekamp

modules/signals/spec/types/with-computed.types.spec.ts

@@ -1,15 +1,17 @@
 import { expecter } from 'ts-snippet';
 import { compilerOptions } from './helpers';
-import { signalStore, withComputed } from 'modules/signals/src';
-import { TestBed } from '@angular/core/testing';
 
 describe('withComputed', () => {
   const expectSnippet = expecter(
     (code) => `
         import {
           deepComputed,
+          patchState,
           signalStore,
           withComputed,
+          withMethods,
+          withProps,
+          withState,
         } from '@ngrx/signals';
         import { TestBed } from '@angular/core/testing';
         import { signal } from '@angular/core';
@@ -19,6 +21,49 @@ describe('withComputed', () => {
     compilerOptions()
   );
 
+  it('has access to props, state signals and methods', () => {
+    const snippet = `
+      signalStore(
+        withState({
+          a: 1,
+        }),
+        withProps(() => {
+          return {
+            b: 2,
+          };
+        }),
+        withMethods(({ a, b }) => ({
+          sum: () => a() + b,
+        })),
+        withComputed(({ a, b, sum }) => ({
+          prettySum: () => \`Sum: \${a()} + \${b} = \${sum()}\`,
+        }))
+      );
+    `;
+
+    expectSnippet(snippet).toSucceed();
+  });
+
+  it('has no access to the state source', () => {
+    const snippet = `
+      signalStore(
+        withState({
+          a: 1,
+        }),
+        withComputed((store) => ({
+          prettySum: () => {
+            patchState(store, { a: 2 });
+            return store.a();
+          },
+        }))
+      );
+    `;
+
+    expectSnippet(snippet).toFail(
+      /not assignable to parameter of type 'WritableStateSource<object>'/
+    );
+  });
+
   it('creates a Signal automatically', () => {
     const snippet = `
       const Store = signalStore(

modules/signals/spec/with-computed.spec.ts

@@ -1,4 +1,5 @@
 import { computed, signal } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
 import {
   deepComputed,
   signalStoreFeature,
@@ -7,7 +8,6 @@ import {
   withState,
 } from '../src';
 import { getInitialInnerStore, signalStore } from '../src/signal-store';
-import { TestBed } from '@angular/core/testing';
 
 describe('withComputed', () => {
   it('adds computed signals to the store immutably', () => {

modules/signals/src/with-computed.ts

@@ -28,7 +28,9 @@ export function withComputed<
   >
 >(
   computedFactory: (
-    store: Prettify<StateSignals<Input['state']> & Input['props']>
+    store: Prettify<
+      StateSignals<Input['state']> & Input['props'] & Input['methods']
+    >
   ) => ComputedDictionary
 ): SignalStoreFeature<
   Input,

projects/ngrx.io/content/guide/signals/signal-store/index.md

@@ -167,7 +167,7 @@ export class BookSearch {
 
 Computed signals can be added to the store using the `withComputed` feature.
 This feature accepts a factory function as an input argument, which is executed within the injection context.
-The factory should return a dictionary containing either computed signals or functions that return values (which are automatically wrapped in computed signals), utilizing previously defined state signals and properties that are accessible through its input argument.
+The factory should return a dictionary containing either computed signals or functions that return values (which are automatically wrapped in computed signals), utilizing previously defined state signals, properties, and methods that are accessible through its input argument.
 
 <code-example header="book-search-store.ts">