@reactables/react 1.3.0-beta.3 → 2.0.0-beta.1

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.
@@ -1,2 +1 @@
1
- export { useReactable, HookedReactable } from './useReactable';
2
- export { useAppStore } from './useAppStore';
1
+ export { useReactable, HookedReactable } from './useReactable';
@@ -1,4 +1,9 @@
1
- import { Observable } from 'rxjs';
2
- import { Reactable, Action } from '@reactables/core';
3
- export type HookedReactable<T, S> = [T, S, Observable<T>, Observable<Action<unknown>>?];
4
- export declare const useReactable: <T, S, U extends unknown[]>(reactableFactory: (...props: U) => Reactable<T, S, Record<string, string>>, ...props: U) => HookedReactable<T, S>;
1
+ import { Observable } from 'rxjs';
2
+ import { Reactable, ActionObservableWithTypes, DestroyAction } from '@reactables/core';
3
+ export type HookedReactable<T, S, V extends Record<string, string>> = [
4
+ T,
5
+ S,
6
+ Observable<T>,
7
+ ActionObservableWithTypes<V>?
8
+ ];
9
+ export declare const useReactable: <T, S extends DestroyAction, U extends unknown[], V extends Record<string, string>>(reactableFactory: (...props: U) => Reactable<T, S, V>, ...props: U) => HookedReactable<T, S, V>;
package/dist/index.cjs ADDED
@@ -0,0 +1,34 @@
1
+ 'use strict';
2
+
3
+ var react = require('react');
4
+
5
+ var useReactable = function (reactableFactory) {
6
+ var props = [];
7
+ for (var _i = 1; _i < arguments.length; _i++) {
8
+ props[_i - 1] = arguments[_i];
9
+ }
10
+ var rx = react.useRef(null);
11
+ /**
12
+ * React Strict Mode has bugs with clean up with refs so it breaks the useReactable hook as of now
13
+ * See Bug: https://github.com/facebook/react/issues/26315
14
+ * See Bug: https://github.com/facebook/react/issues/24670
15
+ * Using this recommended approach for resolving Strict Modeissue: https://react.dev/reference/react/useRef#avoiding-recreating-the-ref-contents
16
+ */
17
+ if (rx.current === null) {
18
+ rx.current = reactableFactory.apply(void 0, props);
19
+ }
20
+ var _a = rx.current, state$ = _a[0], actions = _a[1], actions$ = _a[2];
21
+ var _b = react.useState(), state = _b[0], setState = _b[1];
22
+ react.useEffect(function () {
23
+ var subscription = state$.subscribe(function (result) {
24
+ setState(result);
25
+ });
26
+ return function () {
27
+ subscription.unsubscribe();
28
+ };
29
+ }, [actions, state$]);
30
+ return [state, actions, state$, actions$];
31
+ };
32
+
33
+ exports.useReactable = useReactable;
34
+ //# sourceMappingURL=index.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.cjs","sources":["../src/Hooks/useReactable.ts"],"sourcesContent":["import { Observable } from 'rxjs';\nimport { useEffect, useState, useRef } from 'react';\nimport { Reactable, ActionObservableWithTypes, DestroyAction } from '@reactables/core';\n\nexport type HookedReactable<T, S, V extends Record<string, string>> = [\n T,\n S,\n Observable<T>,\n ActionObservableWithTypes<V>?,\n];\n\nexport const useReactable = <\n T,\n S extends DestroyAction,\n U extends unknown[],\n V extends Record<string, string>,\n>(\n reactableFactory: (...props: U) => Reactable<T, S, V>,\n ...props: U\n): HookedReactable<T, S, V> => {\n const rx = useRef<Reactable<T, S, V>>(null);\n\n /**\n * React Strict Mode has bugs with clean up with refs so it breaks the useReactable hook as of now\n * See Bug: https://github.com/facebook/react/issues/26315\n * See Bug: https://github.com/facebook/react/issues/24670\n * Using this recommended approach for resolving Strict Modeissue: https://react.dev/reference/react/useRef#avoiding-recreating-the-ref-contents\n */\n if (rx.current === null) {\n rx.current = reactableFactory(...props);\n }\n\n const [state$, actions, actions$] = rx.current;\n const [state, setState] = useState<T>();\n\n useEffect(() => {\n const subscription = state$.subscribe((result) => {\n setState(result);\n });\n\n return () => {\n subscription.unsubscribe();\n };\n }, [actions, state$]);\n\n return [state, actions, state$, actions$];\n};\n"],"names":["useRef","useState","useEffect"],"mappings":";;;;AAWO,IAAM,YAAY,GAAG,UAM1B,gBAAqD,EAAA;IACrD,IAAW,KAAA,GAAA,EAAA;SAAX,IAAW,EAAA,GAAA,CAAA,EAAX,EAAW,GAAA,SAAA,CAAA,MAAA,EAAX,EAAW,EAAA,EAAA;QAAX,KAAW,CAAA,EAAA,GAAA,CAAA,CAAA,GAAA,SAAA,CAAA,EAAA,CAAA;;AAEX,IAAA,IAAM,EAAE,GAAGA,YAAM,CAAqB,IAAI,CAAC;AAE3C;;;;;AAKG;AACH,IAAA,IAAI,EAAE,CAAC,OAAO,KAAK,IAAI,EAAE;AACvB,QAAA,EAAE,CAAC,OAAO,GAAG,gBAAgB,CAAI,KAAA,CAAA,MAAA,EAAA,KAAK,CAAC;AACxC;AAEK,IAAA,IAAA,EAA8B,GAAA,EAAE,CAAC,OAAO,EAAvC,MAAM,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,OAAO,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,QAAQ,QAAc;IACxC,IAAA,EAAA,GAAoBC,cAAQ,EAAK,EAAhC,KAAK,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,QAAQ,GAAA,EAAA,CAAA,CAAA,CAAiB;AAEvC,IAAAC,eAAS,CAAC,YAAA;AACR,QAAA,IAAM,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,UAAC,MAAM,EAAA;YAC3C,QAAQ,CAAC,MAAM,CAAC;AAClB,SAAC,CAAC;QAEF,OAAO,YAAA;YACL,YAAY,CAAC,WAAW,EAAE;AAC5B,SAAC;AACH,KAAC,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;IAErB,OAAO,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,CAAC;AAC3C;;;;"}
package/dist/index.d.ts CHANGED
@@ -1,2 +1 @@
1
- export * from './Components';
2
- export * from './Hooks';
1
+ export * from './Hooks';
package/dist/index.js CHANGED
@@ -1,51 +1,32 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
-
7
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
-
9
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
10
-
11
- var StoreContext = React__default["default"].createContext(null);
12
- var StoreProvider = function (_a) {
13
- var rxStore = _a.rxStore, children = _a.children;
14
- return React__default["default"].createElement(StoreContext.Provider, { value: rxStore }, rxStore && children);
15
- };
16
-
17
- var useReactable = function (reactableFactory) {
18
- var props = [];
19
- for (var _i = 1; _i < arguments.length; _i++) {
20
- props[_i - 1] = arguments[_i];
21
- }
22
- var rx = React.useRef(null);
23
- /**
24
- * React Strict Mode has bugs with clean up with refs so it breaks the useReactable hook as of now
25
- * See Bug: https://github.com/facebook/react/issues/26315
26
- * See Bug: https://github.com/facebook/react/issues/24670
27
- * Using this recommended approach for resolving Strict Modeissue: https://react.dev/reference/react/useRef#avoiding-recreating-the-ref-contents
28
- */
29
- if (rx.current === null) {
30
- rx.current = reactableFactory.apply(void 0, props);
31
- }
32
- var _a = rx.current, state$ = _a[0], actions = _a[1], actions$ = _a[2];
33
- var _b = React.useState(), state = _b[0], setState = _b[1];
34
- React.useEffect(function () {
35
- var subscription = state$.subscribe(function (result) {
36
- setState(result);
37
- });
38
- return function () { return subscription.unsubscribe(); };
39
- }, [state$]);
40
- return [state, actions, state$, actions$];
41
- };
42
-
43
- var useAppStore = function () {
44
- var rxStore$ = React.useContext(StoreContext);
45
- var rxStore = useReactable(function () { return rxStore$; });
46
- return rxStore;
1
+ import { useRef, useState, useEffect } from 'react';
2
+
3
+ var useReactable = function (reactableFactory) {
4
+ var props = [];
5
+ for (var _i = 1; _i < arguments.length; _i++) {
6
+ props[_i - 1] = arguments[_i];
7
+ }
8
+ var rx = useRef(null);
9
+ /**
10
+ * React Strict Mode has bugs with clean up with refs so it breaks the useReactable hook as of now
11
+ * See Bug: https://github.com/facebook/react/issues/26315
12
+ * See Bug: https://github.com/facebook/react/issues/24670
13
+ * Using this recommended approach for resolving Strict Modeissue: https://react.dev/reference/react/useRef#avoiding-recreating-the-ref-contents
14
+ */
15
+ if (rx.current === null) {
16
+ rx.current = reactableFactory.apply(void 0, props);
17
+ }
18
+ var _a = rx.current, state$ = _a[0], actions = _a[1], actions$ = _a[2];
19
+ var _b = useState(), state = _b[0], setState = _b[1];
20
+ useEffect(function () {
21
+ var subscription = state$.subscribe(function (result) {
22
+ setState(result);
23
+ });
24
+ return function () {
25
+ subscription.unsubscribe();
26
+ };
27
+ }, [actions, state$]);
28
+ return [state, actions, state$, actions$];
47
29
  };
48
30
 
49
- exports.StoreProvider = StoreProvider;
50
- exports.useAppStore = useAppStore;
51
- exports.useReactable = useReactable;
31
+ export { useReactable };
32
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../src/Hooks/useReactable.ts"],"sourcesContent":["import { Observable } from 'rxjs';\nimport { useEffect, useState, useRef } from 'react';\nimport { Reactable, ActionObservableWithTypes, DestroyAction } from '@reactables/core';\n\nexport type HookedReactable<T, S, V extends Record<string, string>> = [\n T,\n S,\n Observable<T>,\n ActionObservableWithTypes<V>?,\n];\n\nexport const useReactable = <\n T,\n S extends DestroyAction,\n U extends unknown[],\n V extends Record<string, string>,\n>(\n reactableFactory: (...props: U) => Reactable<T, S, V>,\n ...props: U\n): HookedReactable<T, S, V> => {\n const rx = useRef<Reactable<T, S, V>>(null);\n\n /**\n * React Strict Mode has bugs with clean up with refs so it breaks the useReactable hook as of now\n * See Bug: https://github.com/facebook/react/issues/26315\n * See Bug: https://github.com/facebook/react/issues/24670\n * Using this recommended approach for resolving Strict Modeissue: https://react.dev/reference/react/useRef#avoiding-recreating-the-ref-contents\n */\n if (rx.current === null) {\n rx.current = reactableFactory(...props);\n }\n\n const [state$, actions, actions$] = rx.current;\n const [state, setState] = useState<T>();\n\n useEffect(() => {\n const subscription = state$.subscribe((result) => {\n setState(result);\n });\n\n return () => {\n subscription.unsubscribe();\n };\n }, [actions, state$]);\n\n return [state, actions, state$, actions$];\n};\n"],"names":[],"mappings":";;AAWO,IAAM,YAAY,GAAG,UAM1B,gBAAqD,EAAA;IACrD,IAAW,KAAA,GAAA,EAAA;SAAX,IAAW,EAAA,GAAA,CAAA,EAAX,EAAW,GAAA,SAAA,CAAA,MAAA,EAAX,EAAW,EAAA,EAAA;QAAX,KAAW,CAAA,EAAA,GAAA,CAAA,CAAA,GAAA,SAAA,CAAA,EAAA,CAAA;;AAEX,IAAA,IAAM,EAAE,GAAG,MAAM,CAAqB,IAAI,CAAC;AAE3C;;;;;AAKG;AACH,IAAA,IAAI,EAAE,CAAC,OAAO,KAAK,IAAI,EAAE;AACvB,QAAA,EAAE,CAAC,OAAO,GAAG,gBAAgB,CAAI,KAAA,CAAA,MAAA,EAAA,KAAK,CAAC;AACxC;AAEK,IAAA,IAAA,EAA8B,GAAA,EAAE,CAAC,OAAO,EAAvC,MAAM,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,OAAO,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,QAAQ,QAAc;IACxC,IAAA,EAAA,GAAoB,QAAQ,EAAK,EAAhC,KAAK,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,QAAQ,GAAA,EAAA,CAAA,CAAA,CAAiB;AAEvC,IAAA,SAAS,CAAC,YAAA;AACR,QAAA,IAAM,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,UAAC,MAAM,EAAA;YAC3C,QAAQ,CAAC,MAAM,CAAC;AAClB,SAAC,CAAC;QAEF,OAAO,YAAA;YACL,YAAY,CAAC,WAAW,EAAE;AAC5B,SAAC;AACH,KAAC,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;IAErB,OAAO,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,CAAC;AAC3C;;;;"}
package/package.json CHANGED
@@ -1,10 +1,17 @@
1
1
  {
2
2
  "name": "@reactables/react",
3
3
  "description": "React Helpers for reactables",
4
- "main": "dist/index.js",
4
+ "main": "./dist/index.cjs",
5
+ "module": "./dist/index.js",
6
+ "type": "module",
5
7
  "files": [
6
8
  "dist"
7
9
  ],
10
+ "exports": {
11
+ "require": "./dist/index.cjs",
12
+ "import": "./dist/index.js"
13
+ },
14
+ "types": "./dist/index.d.ts",
8
15
  "scripts": {
9
16
  "build": "rimraf dist && rollup --config",
10
17
  "lint": "eslint --max-warnings 0 \"src/**/*.ts*\" && prettier --check src/",
@@ -17,5 +24,5 @@
17
24
  "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
18
25
  "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
19
26
  },
20
- "version": "1.3.0-beta.3"
27
+ "version": "2.0.0-beta.1"
21
28
  }
@@ -1,9 +0,0 @@
1
- import React from 'react';
2
- import { Reactable } from '@reactables/core';
3
- export declare const StoreContext: React.Context<Reactable<unknown, unknown, Record<string, string>>>;
4
- interface StoreProviderProps<T, S> {
5
- rxStore: Reactable<T, S>;
6
- children?: React.ReactNode;
7
- }
8
- export declare const StoreProvider: <T, S>({ rxStore, children }: StoreProviderProps<T, S>) => React.JSX.Element;
9
- export {};
@@ -1 +0,0 @@
1
- export { StoreProvider } from './StoreProvider';
@@ -1,3 +0,0 @@
1
- import { ActionMap } from '@reactables/core';
2
- import { Observable } from 'rxjs';
3
- export declare const useAppStore: <T, S = ActionMap>() => [T, S, Observable<T>];