@slimlib/store 1.4.1 → 1.5.0

package/README.md

@@ -18,7 +18,7 @@ npm install --save-dev @slimlib/store
 
 # Usage
 
-React:
+### React
 
 ```javascript
 import { createStore, useStore } from '@slimlib/store/react';
@@ -39,7 +39,7 @@ function Component() {
 }
 ```
 
-Preact:
+### Preact
 
 ```javascript
 import { createStore, useStore } from '@slimlib/store/preact';
@@ -60,7 +60,7 @@ function Component() {
 }
 ```
 
-Svelte:
+### Svelte
 
 In store
 
@@ -89,6 +89,30 @@ import { storeName } from './stores/storeName';
 $storeName
 ```
 
+### Angular
+
+In store
+
+```javascript
+import { SlimlibStore } from '@slimlib/store/angular';
+
+// create store
+@Injectable()
+export class StoreName extends SlimlibStore {
+    constructor() {
+        super(/*Initial state*/{ field: 123 }});
+    }
+
+    // selectors
+    field = this.select(state => state.field);
+
+    // actions
+    doSomething() {
+        this.state.field = value;
+    }
+}
+```
+
 ## API
 
 ### `main` and `core` exports
@@ -134,6 +158,23 @@ Function to subscribe to store inside component. Returns current state.
 
 Store factory created with `notifyAfterCreation` === `true`.
 
+### `angular` export
+
+#### `createStore<T>(initialState: T): [T, Store<T>, () => void]`
+
+Store factory created with `notifyAfterCreation` === `false`.
+
+#### `toSignal<T>(store: Store<T>): Signal<T>` - converts store to signal
+
+#### `SlimlibStore`
+
+Base class for store services.
+
+##### `constructor(initialState: T)` - creates store with initial state
+
+##### `state: T` - store state (proxy object)
+##### `select<R>(...signals: Signal[], projector: (state: T, ...signalValue: SignalValue<signals[index]>) => R): Signal<R>` - selector function that returns a signal
+
 ## Limitations
 
 `Map`, `Set`, `WeakMap`, `WeakSet` cannot be used as values in current implementation.

package/dist/angular.cjs

@@ -22,6 +22,14 @@ class SlimlibStore {
         [this.state, this.store] = createStore(initialState);
         this.signal = toSignal(this.store);
     }
+    select(...selectors) {
+        // eslint-disable-next-line @typescript-eslint/ban-types
+        const projector = selectors.pop();
+        return core$1.computed(() => {
+            const values = selectors.map(selector => selector());
+            return projector(this.signal(), ...values);
+        });
+    }
 }
 
 exports.SlimlibStore = SlimlibStore;

package/dist/angular.d.ts

@@ -7,9 +7,17 @@ export type InjectorLike = {
 };
 export declare const createStore: <T extends object>(object?: T) => [T, Store<T>, () => void];
 export declare const toSignal: <T>(store: Store<T>, injector?: InjectorLike) => Signal<T>;
+type SignalValue<T extends Signal<unknown>> = T extends Signal<infer Value> ? Value : never;
+type ArrayOfSignalValues<T extends Signal<unknown>[]> = {
+    [S in keyof T]: SignalValue<T[S]>;
+};
+type Prepend<I, T extends unknown[]> = [I, ...T];
+type SignalsProjector<Signals extends Signal<unknown>[], Result, State> = (...values: Prepend<State, ArrayOfSignalValues<Signals>>) => Result;
 export declare class SlimlibStore<T extends object> {
     private readonly store;
     protected readonly state: T;
     readonly signal: Signal<T>;
     constructor(initialState: T);
+    select<P extends Signal<unknown>[], R>(...selectors: [...signals: P, projector: SignalsProjector<P, R, T>]): Signal<R>;
 }
+export {};

package/dist/angular.mjs

@@ -1,4 +1,4 @@
-import { inject, DestroyRef, signal, untracked } from '@angular/core';
+import { inject, DestroyRef, signal, untracked, computed } from '@angular/core';
 import { createStoreFactory } from './core.mjs';
 
 const createStore = createStoreFactory(false);
@@ -20,6 +20,14 @@ class SlimlibStore {
         [this.state, this.store] = createStore(initialState);
         this.signal = toSignal(this.store);
     }
+    select(...selectors) {
+        // eslint-disable-next-line @typescript-eslint/ban-types
+        const projector = selectors.pop();
+        return computed(() => {
+            const values = selectors.map(selector => selector());
+            return projector(this.signal(), ...values);
+        });
+    }
 }
 
 export { SlimlibStore, createStore, toSignal };

package/dist/angular.umd.js

@@ -1,2 +1,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("./core")):"function"==typeof define&&define.amd?define(["exports","@angular/core","./core"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).slimlibStoreAngular={},e.angularCore,e.slimlibStoreCore)}(this,(function(e,t,o){"use strict";const s=o.createStoreFactory(!1),n=(e,o)=>{const s=(o?o.get:t.inject)(t.DestroyRef),n=t.signal(e());return t.untracked((()=>{s?.onDestroy(e((e=>{n.set(e)})))})),n.asReadonly()};e.SlimlibStore=class{store;state;signal;constructor(e){[this.state,this.store]=s(e),this.signal=n(this.store)}},e.createStore=s,e.toSignal=n}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("./core")):"function"==typeof define&&define.amd?define(["exports","@angular/core","./core"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).slimlibStoreAngular={},e.angularCore,e.slimlibStoreCore)}(this,(function(e,t,o){"use strict";const s=o.createStoreFactory(!1),n=(e,o)=>{const s=(o?o.get:t.inject)(t.DestroyRef),n=t.signal(e());return t.untracked((()=>{s?.onDestroy(e((e=>{n.set(e)})))})),n.asReadonly()};e.SlimlibStore=class{store;state;signal;constructor(e){[this.state,this.store]=s(e),this.signal=n(this.store)}select(...e){const o=e.pop();return t.computed((()=>{const t=e.map((e=>e()));return o(this.signal(),...t)}))}},e.createStore=s,e.toSignal=n}));
 //# sourceMappingURL=angular.umd.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "type": "module",
-  "version": "1.4.1",
+  "version": "1.5.0",
   "name": "@slimlib/store",
   "description": "Simple Proxy-based store for SPA",
   "license": "MIT",