@reactables/react 1.3.0-alpha.2 → 1.3.0-beta.0

package/dist/Components/StoreProvider.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Reactable } from '@reactables/core';
-export declare const StoreContext: React.Context<Reactable<unknown, unknown>>;
+export declare const StoreContext: React.Context<Reactable<unknown, unknown, Record<string, string>>>;
 interface StoreProviderProps<T, S> {
     rxStore: Reactable<T, S>;
     children?: React.ReactNode;

package/dist/Hooks/useReactable.d.ts

@@ -1,4 +1,4 @@
 import { Observable } from 'rxjs';
 import { Reactable, Action } from '@reactables/core';
 export type HookedReactable<T, S> = [T, S, Observable<T>, Observable<Action<unknown>>?];
-export declare const useReactable: <T, S, U extends unknown[]>(reactableFactory: (...props: U) => Reactable<T, S>, ...props: U) => HookedReactable<T, S>;
+export declare const useReactable: <T, S, U extends unknown[]>(reactableFactory: (...props: U) => Reactable<T, S, Record<string, string>>, ...props: U) => HookedReactable<T, S>;

package/dist/index.js

@@ -19,23 +19,25 @@ var useReactable = function (reactableFactory) {
     for (var _i = 1; _i < arguments.length; _i++) {
         props[_i - 1] = arguments[_i];
     }
-    var _a = React.useMemo(function () { return reactableFactory.apply(void 0, props); }, []), state$ = _a[0], actions = _a[1], messages$ = _a[2];
+    var rx = React.useRef(null);
+    /**
+     * React Strict Mode has bugs with clean up with refs so it breaks the useReactable hook as of now
+     * See Bug: https://github.com/facebook/react/issues/26315
+     * See Bug: https://github.com/facebook/react/issues/24670
+     * Using this recommended approach for resolving Strict Modeissue: https://react.dev/reference/react/useRef#avoiding-recreating-the-ref-contents
+     */
+    if (rx.current === null) {
+        rx.current = reactableFactory.apply(void 0, props);
+    }
+    var _a = rx.current, state$ = _a[0], actions = _a[1], actions$ = _a[2];
     var _b = React.useState(), state = _b[0], setState = _b[1];
     React.useEffect(function () {
         var subscription = state$.subscribe(function (result) {
             setState(result);
         });
-        return function () {
-            // Adding setTimeout fixes the issue.
-            // React Strict Mode has bugs with clean up with refs so it breaks the useReactable hook as of now
-            // See Bug: https://github.com/facebook/react/issues/26315
-            // See Bug: https://github.com/facebook/react/issues/24670
-            setTimeout(function () {
-                subscription.unsubscribe();
-            }, 0);
-        };
+        return function () { return subscription.unsubscribe(); };
     }, [state$]);
-    return [state, actions, state$, messages$];
+    return [state, actions, state$, actions$];
 };
 
 var useAppStore = function () {

package/package.json

@@ -17,5 +17,5 @@
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
   },
-  "version": "1.3.0-alpha.2"
+  "version": "1.3.0-beta.0"
 }