|
1 | 1 | # React hooks for RxJS |
2 | 2 | [](https://circleci.com/gh/LeetCode-OpenSource/rxjs-hooks) |
3 | 3 | [](https://codecov.io/gh/LeetCode-OpenSource/rxjs-hooks) |
| 4 | +[](https://badge.fury.io/js/rxjs-hooks) |
4 | 5 |
|
5 | 6 | - [Installation](#installation) |
6 | 7 | - [Demo](#quick-look) |
7 | 8 | - [Apis](#apis) |
8 | 9 | 1. [useObservable](#useobservable) |
9 | 10 | 2. [useEventCallback](#useeventcallback) |
10 | | - |
| 11 | + |
11 | 12 | ## Installation |
12 | 13 |
|
13 | 14 | Using npm: |
@@ -77,15 +78,16 @@ function App() { |
77 | 78 | ### `useObservable` |
78 | 79 |
|
79 | 80 | ```tsx |
80 | | -type RestrictArray<T> = T extends any[] ? T : [] |
81 | | -type InputFactory<State, Inputs = undefined> = Inputs extends undefined |
82 | | - ? (state$: Observable<State>) => Observable<State> |
83 | | - : (state$: Observable<State>, inputs$: Observable<RestrictArray<Inputs>>) => Observable<State> |
84 | | - |
85 | | -declare function useObservable<State>(inputFactory: InputFactory<State>): State | null |
86 | | -declare function useObservable<State>(inputFactory: InputFactory<State>, initialState: State): State |
87 | | -declare function useObservable<State, Inputs>( |
88 | | - inputFactory: InputFactory<State, Inputs>, |
| 81 | +export type InputFactory<State> = (state$: Observable<State>) => Observable<State> |
| 82 | +export type InputFactoryWithInputs<State, Inputs> = ( |
| 83 | + state$: Observable<State>, |
| 84 | + inputs$: Observable<RestrictArray<Inputs>>, |
| 85 | +) => Observable<State> |
| 86 | + |
| 87 | +export function useObservable<State>(inputFactory: InputFactory<State>): State | null |
| 88 | +export function useObservable<State>(inputFactory: InputFactory<State>, initialState: State): State |
| 89 | +export function useObservable<State, Inputs>( |
| 90 | + inputFactory: InputFactoryWithInputs<State, Inputs>, |
89 | 91 | initialState: State, |
90 | 92 | inputs: RestrictArray<Inputs>, |
91 | 93 | ): State |
@@ -185,41 +187,6 @@ ReactDOM.render(<App />, document.querySelector('#root')) |
185 | 187 |
|
186 | 188 | ### `useEventCallback` |
187 | 189 |
|
188 | | -```tsx |
189 | | -type RestrictArray<T> = T extends any[] ? T : [] |
190 | | -type VoidAsNull<T> = T extends void ? null : T |
191 | | -
|
192 | | -type EventCallbackState<EventValue, State, Inputs = void> = [ |
193 | | - (val: EventValue) => void, |
194 | | - [State extends void ? null : State, BehaviorSubject<State | null>, BehaviorSubject<RestrictArray<Inputs> | null>] |
195 | | -] |
196 | | -type ReturnedState<EventValue, State, Inputs> = [ |
197 | | - EventCallbackState<EventValue, State, Inputs>[0], |
198 | | - EventCallbackState<EventValue, State, Inputs>[1][0] |
199 | | -] |
200 | | -
|
201 | | -type EventCallback<EventValue, State, Inputs> = Inputs extends void |
202 | | - ? (eventSource$: Observable<EventValue>, state$: Observable<State>) => Observable<State> |
203 | | - : ( |
204 | | - eventSource$: Observable<EventValue>, |
205 | | - state$: Observable<State>, |
206 | | - inputs$: Observable<RestrictArray<Inputs>>, |
207 | | - ) => Observable<State> |
208 | | -
|
209 | | -declare function useEventCallback<EventValue, State = void>( |
210 | | - callback: EventCallback<EventValue, State, void>, |
211 | | -): ReturnedState<EventValue, State | null, void> |
212 | | -declare function useEventCallback<EventValue, State = void>( |
213 | | - callback: EventCallback<EventValue, State, void>, |
214 | | - initialState: State, |
215 | | -): ReturnedState<EventValue, State, void> |
216 | | -declare function useEventCallback<EventValue, State = void, Inputs = void>( |
217 | | - callback: EventCallback<EventValue, State, Inputs>, |
218 | | - initialState: State, |
219 | | - inputs: RestrictArray<Inputs>, |
220 | | -): ReturnedState<EventValue, State, Inputs> |
221 | | -``` |
222 | | - |
223 | 190 | #### Examples: |
224 | 191 |
|
225 | 192 | ```tsx |
|
0 commit comments