@reactables/core 0.5.2-alpha.0 → 0.5.4-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +13 -38
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -26,12 +26,13 @@ Reactive state management with RxJS.
26
26
  1. [ScopedEffects](#api-scoped-effects)
27
27
  1. [Action](#api-action)
28
28
  1. [Reducer](#api-reducer)
29
- 1. [Testing](#testing)
30
- 1. [Reactables](#testing-reactables)
29
+ 1. [Testing Reactables](#testing)
31
30
 
32
31
  ## Installation <a name="installation"></a>
33
32
 
34
- `npm i @reactables/core`
33
+ Installation will require [RxJS](https://rxjs.dev/) if not already installed.
34
+
35
+ `npm i rxjs @reactables/core`
35
36
 
36
37
  ## Core concepts <a name="core-concepts"></a>
37
38
 
@@ -131,17 +132,17 @@ export interface Reactable<T, S = ActionMap> {
131
132
  }
132
133
 
133
134
  export interface ActionMap {
134
- [key: string | number]: (payload?: unknown) => void;
135
+ [key: string | number]: (payload?: unknown) => void | ActionMap;
135
136
  }
136
137
  ```
137
138
  | Property | Description |
138
139
  | -------- | ----------- |
139
140
  | state$ | Observable that emit state changes |
140
- | actions (optional) | Dictionary of methods that dispatches actions to update state |
141
+ | actions | Dictionary of methods that dispatches actions to update state |
141
142
 
142
143
  ### RxBuilder <a name="rx-builder"></a>
143
144
 
144
- RxBuilder factory help build [Reactables](#reactable). Accepts a [RxConfig](#rx-confg) configuration object
145
+ Factory function for building [Reactables](#reactable). Accepts a [RxConfig](#rx-confg) configuration object
145
146
 
146
147
  ```typescript
147
148
  type RxBuilder = <T, S extends Cases<T>>(config: RxConfig<T, S>) => Reactable<T, unknown>
@@ -197,7 +198,7 @@ type Effect<T, S> = OperatorFunction<Action<T>, Action<S>>;
197
198
 
198
199
  #### ScopedEffects <a name="api-scoped-effects"></a>
199
200
 
200
- Scoped Effects are declared in [Actions](#api-action). They are dynamically created stream(s) scoped to an Action `type` & `key` combination.
201
+ Scoped Effects are declared when defining reducers in [RxConfig](#rx-config). They are dynamically created stream(s) scoped to an Action `type` & `key` combination.
201
202
 
202
203
  ```typescript
203
204
  interface ScopedEffects<T> {
@@ -210,30 +211,6 @@ interface ScopedEffects<T> {
210
211
  | key (optional) | key to be combined with the Action `type` to generate a unique signature for the effect stream(s). Example: An id for the entity the action is being performed on. |
211
212
  | effects | Array of [Effects](#api-effects) scoped to the Action `type` & `key` |
212
213
 
213
- Example:
214
-
215
- ```typescript
216
-
217
- const UPDATE_TODO = 'UPDATE_TODO';
218
- const UPDATE_TODO_SUCCESS = 'UPDATE_TODO_SUCCESS';
219
- const updateTodo = ({ id, message }, todoService: TodoService) => ({
220
- type: UPDATE_TODO,
221
- payload: { id, message },
222
- scopedEffects: {
223
- key: id,
224
- effects: [
225
- (updateTodoActions$: Observable<Action<string>>) =>
226
- updateTodoActions$.pipe(
227
- mergeMap(({ payload: { id, message } }) => todoService.updateTodo(id, message))
228
- map(({ data }) => ({
229
- type: UPDATE_TODO_SUCCESS,
230
- payload: data
231
- }))
232
- )
233
- ]
234
- }
235
- })
236
- ```
237
214
 
238
215
  #### Action <a name="api-action"></a>
239
216
  ```typescript
@@ -258,19 +235,18 @@ From [Redux Docs](https://redux.js.org/tutorials/fundamentals/part-3-state-actio
258
235
  type Reducer<T> = (state?: T, action?: Action<unknown>) => T;
259
236
  ```
260
237
 
261
- ## Testing <a name="testing"></a>
238
+ ## Testing Reactables<a name="testing"></a>
262
239
 
263
240
  We can use RxJS's built in [Marble Testing](https://rxjs.dev/guide/testing/marble-testing) for testing [Reactables](#reactable).
264
241
 
265
- ### Reactables <a name="testing-reactables"></a>
242
+ [Test for RxCounter](https://github.com/reactables/reactables/blob/main/packages/examples/src/RxCounter/RxCounter.test.ts)
266
243
 
267
244
  ```typescript
268
- // https://github.com/reactables/reactables/blob/main/packages/examples/src/Counter/Counter.test.ts
269
- import { Counter } from './Counter';
245
+ import { RxCounter } from './RxCounter';
270
246
  import { Subscription } from 'rxjs';
271
247
  import { TestScheduler } from 'rxjs/testing';
272
248
 
273
- describe('Counter', () => {
249
+ describe('RxCounter', () => {
274
250
  let testScheduler: TestScheduler;
275
251
  let subscription: Subscription;
276
252
 
@@ -289,7 +265,7 @@ describe('Counter', () => {
289
265
  const {
290
266
  state$,
291
267
  actions: { increment, reset },
292
- } = Counter();
268
+ } = RxCounter();
293
269
 
294
270
  // Call actions
295
271
  subscription = cold('--b-c', {
@@ -306,5 +282,4 @@ describe('Counter', () => {
306
282
  });
307
283
  });
308
284
  });
309
-
310
285
  ```
package/package.json CHANGED
@@ -16,5 +16,5 @@
16
16
  "peerDependencies": {
17
17
  "rxjs": "^6.0.0 || ^7.0.0"
18
18
  },
19
- "version": "0.5.2-alpha.0"
19
+ "version": "0.5.4-alpha.0"
20
20
  }