react-rx 2.1.3 → 3.0.0-1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-rx",
-  "version": "2.1.3",
+  "version": "3.0.0-1",
   "description": "React + RxJS = <3",
   "keywords": [
     "action",
@@ -45,6 +45,7 @@
     "Bjørge Næss <bjoerge@gmail.com>",
     "Cody Olsen <stipsan@gmail.com> (https://github.com/stipsan)"
   ],
+  "sideEffects": false,
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/cjs/index.d.ts",
@@ -69,42 +70,42 @@
     "lint": "eslint --cache ."
   },
   "dependencies": {
-    "observable-callback": "^1.0.2",
-    "use-sync-external-store": "^1.2.0"
+    "observable-callback": "^1.0.3"
   },
   "devDependencies": {
-    "@sanity/semantic-release-preset": "^2.0.2",
-    "@testing-library/dom": "^8.18.1",
+    "@sanity/semantic-release-preset": "^2.0.5",
+    "@testing-library/dom": "^8.20.1",
     "@testing-library/react": "^13.4.0",
-    "@types/jest": "^29.1.1",
-    "@types/node": "^18.8.2",
-    "@types/react": "^18.0.21",
-    "@types/react-dom": "^18.0.6",
-    "@types/use-sync-external-store": "^0.0.3",
-    "@typescript-eslint/eslint-plugin": "^5.39.0",
-    "@typescript-eslint/parser": "^5.39.0",
-    "eslint": "^8.24.0",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-react": "^7.31.8",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "jest": "^29.1.2",
-    "jest-environment-jsdom": "^29.1.2",
-    "jsdom": "^20.0.1",
+    "@types/jest": "^29.5.3",
+    "@types/node": "^18.17.5",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "@typescript-eslint/eslint-plugin": "7.12.0",
+    "@typescript-eslint/parser": "7.12.0",
+    "eslint": "8.57.0",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-react": "7.34.2",
+    "eslint-plugin-react-compiler": "^0.0.0-experimental-51a85ea-20240601",
+    "eslint-plugin-react-hooks": "4.6.2",
+    "eslint-plugin-simple-import-sort": "^12.1.0",
+    "jest": "^29.6.2",
+    "jest-environment-jsdom": "^29.6.2",
+    "jsdom": "^20.0.3",
     "npm-run-all": "^4.1.5",
-    "prettier": "^2.7.1",
-    "prettier-plugin-packagejson": "^2.3.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-test-renderer": "^18.2.0",
+    "prettier": "^2.8.8",
+    "prettier-plugin-packagejson": "^2.4.5",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-test-renderer": "^18.3.1",
     "rimraf": "^3.0.2",
-    "rxjs": "^6.6.7",
-    "ts-jest": "^29.0.3",
+    "rxjs": "^7.8.1",
+    "ts-jest": "^29.1.1",
     "typescript": "4.7.4"
   },
   "peerDependencies": {
-    "react": "^16.8 || ^17 || ^18",
-    "rxjs": "^6.5 || ^7"
+    "react": "^18.3 || >=19.0.0-rc",
+    "rxjs": "^7"
   },
   "es2015": "dist/es2015/index.js"
 }

package/src/__tests__/strictmode.test.ts

@@ -1,8 +1,8 @@
-import {BehaviorSubject, Observable, of} from 'rxjs'
-import {useObservable} from '../useObservable'
-import {createElement, Fragment, StrictMode, useEffect} from 'react'
 import {act, render} from '@testing-library/react'
-import {useAsObservable} from '../useAsObservable'
+import {createElement, Fragment, StrictMode, useEffect} from 'react'
+import {BehaviorSubject, Observable} from 'rxjs'
+
+import {useObservable} from '../useObservable'
 
 const wait = (ms: number) => new Promise(resolve => setTimeout(resolve, ms))
 
@@ -23,7 +23,7 @@ test('Strict mode should trigger double mount effects and re-renders', async ()
     return createElement(Fragment, null, observedValue)
   }
 
-  const {rerender} = render(createElement(StrictMode, null, createElement(ObservableComponent)))
+  render(createElement(StrictMode, null, createElement(ObservableComponent)))
   expect(mountCount).toEqual(2)
 
   expect(returnedValues).toEqual([0, 0])
@@ -39,11 +39,14 @@ test('Strict mode should trigger double mount effects and re-renders', async ()
 })
 
 test('Strict mode should unsubscribe the source observable on unmount', () => {
-  let subscribed = false
+  const subscribed: number[] = []
+  const unsubscribed: number[] = []
+  let nextId = 0
   const observable = new Observable(() => {
-    subscribed = true
+    const id = nextId++
+    subscribed.push(id)
     return () => {
-      subscribed = false
+      unsubscribed.push(id)
     }
   })
 
@@ -53,27 +56,7 @@ test('Strict mode should unsubscribe the source observable on unmount', () => {
   }
 
   const {rerender} = render(createElement(StrictMode, null, createElement(ObservableComponent)))
-  expect(subscribed).toBe(true)
+  expect(subscribed).toEqual([0, 1])
   rerender(createElement(StrictMode, null, createElement('div')))
-  expect(subscribed).toBe(false)
-})
-
-test('useAsObservable should work in strict mode', async () => {
-  const returnedValues: unknown[] = []
-  function ObservableComponent(props: {count: number}) {
-    const count$ = useAsObservable(props.count)
-    const count = useObservable(count$)
-    returnedValues.push(count)
-    return createElement(Fragment, null, 'ok')
-  }
-
-  const {rerender} = render(
-    createElement(StrictMode, null, createElement(ObservableComponent, {count: 0})),
-  )
-
-  expect(returnedValues).toEqual([0, 0])
-
-  rerender(createElement(StrictMode, null, createElement(ObservableComponent, {count: 1})))
-
-  expect(returnedValues).toEqual([0, 0, 0, 0, 1, 1])
+  expect(unsubscribed).toEqual([0, 1])
 })

package/src/__tests__/useObservable.test.tsx

@@ -1,8 +1,9 @@
 import {act, render, renderHook} from '@testing-library/react'
-import {useObservable} from '../useObservable'
+import {createElement, Fragment} from 'react'
 import {asyncScheduler, Observable, of, scheduled, Subject, timer} from 'rxjs'
 import {mapTo} from 'rxjs/operators'
-import {createElement, Fragment} from 'react'
+
+import {useObservable} from '../useObservable'
 
 test('should subscribe immediately on component mount and unsubscribe on component unmount', () => {
   let subscribed = false

package/src/index.ts

@@ -1,15 +1,2 @@
-// Main package exports
-export {reactiveComponent, reactiveComponent as rxComponent, forwardRef} from './reactiveComponent'
-export {observeState, observeCallback, observeContext, observeElement} from './utils'
-export {
-  observeState as state,
-  observeCallback as handler,
-  observeContext as context,
-  observeElement as elementRef,
-} from './utils'
-export {observableCallback} from 'observable-callback'
-
-// hooks
-export {useObservable, useMemoObservable} from './useObservable'
-export {useAsObservable} from './useAsObservable'
-export {useObservableCallback} from './useObservableCallback'
+export * from './useObservable'
+export * from './useObservableEvent'

package/src/useObservable.ts

@@ -1,6 +1,5 @@
+import {useEffect, useMemo, useRef, useSyncExternalStore} from 'react'
 import {Observable, Subscription} from 'rxjs'
-import {DependencyList, useEffect, useMemo, useRef} from 'react'
-import {useSyncExternalStore} from 'use-sync-external-store/shim'
 import {shareReplay, tap} from 'rxjs/operators'
 
 function getValue<T>(value: T): T extends () => infer U ? U : T {
@@ -34,10 +33,23 @@ export function useObservable<T>(observable: Observable<T>): T | undefined
 export function useObservable<T>(observable: Observable<T>, initialValue: T): T
 export function useObservable<T>(observable: Observable<T>, initialValue: () => T): T
 export function useObservable<T>(observable: Observable<T>, initialValue?: T | (() => T)) {
+  /**
+   * Store the initialValue in a ref, as we don't want a changed `initialValue` to trigger a re-subscription.
+   * But we also don't want the initialValue to be stale if the observable changes.
+   */
+  const initialValueRef = useRef(getValue(initialValue))
+
+  /**
+   * Ensures that the initialValue is always up-to-date in case the observable changes.
+   */
+  useEffect(() => {
+    initialValueRef.current = getValue(initialValue)
+  }, [initialValue])
+
   const [getSnapshot, subscribe] = useMemo<
     [() => T, Parameters<typeof useSyncExternalStore>[0]]
   >(() => {
-    const store = getOrCreateStore(observable, getValue(initialValue))
+    const store = getOrCreateStore(observable, initialValueRef.current)
     if (store.subscription.closed) {
       store.subscription = store.observable.subscribe()
     }
@@ -58,7 +70,7 @@ export function useObservable<T>(observable: Observable<T>, initialValue?: T | (
 
   const shouldRestoreSubscriptionRef = useRef(false)
   useEffect(() => {
-    const store = getOrCreateStore(observable, getValue(initialValue))
+    const store = getOrCreateStore(observable, initialValueRef.current)
     if (shouldRestoreSubscriptionRef.current) {
       if (store.subscription.closed) {
         store.subscription = store.observable.subscribe()
@@ -76,23 +88,3 @@ export function useObservable<T>(observable: Observable<T>, initialValue?: T | (
 
   return useSyncExternalStore(subscribe, getSnapshot)
 }
-
-export function useMemoObservable<T>(
-  observableOrFactory: Observable<T> | (() => Observable<T>),
-  deps: DependencyList,
-): T | undefined
-export function useMemoObservable<T>(
-  observableOrFactory: Observable<T> | (() => Observable<T>),
-  deps: DependencyList,
-  initialValue: T | (() => T),
-): T
-export function useMemoObservable<T>(
-  observableOrFactory: Observable<T> | (() => Observable<T>),
-  deps: DependencyList,
-  initialValue?: T | (() => T),
-) {
-  return useObservable(
-    useMemo(() => getValue(observableOrFactory), deps),
-    initialValue,
-  )
-}

package/src/{useObservableCallback.ts → useObservableEvent.ts}

@@ -1,5 +1,5 @@
-import {DependencyList, useCallback, useEffect, useRef} from 'react'
 import {observableCallback} from 'observable-callback'
+import {DependencyList, useCallback, useEffect, useRef} from 'react'
 import {Observable} from 'rxjs'
 
 const EMPTY_DEPS: DependencyList = []
@@ -16,7 +16,6 @@ export function useObservableCallback<T, U>(
 
   const [calls$, call] = callbackRef.current
 
-  // eslint-disable-next-line react-hooks/exhaustive-deps
   const callback = useCallback(fn, dependencies)
 
   useEffect(() => {

package/dist/cjs/WithObservable.d.ts

@@ -1,12 +0,0 @@
-import { Observable } from 'rxjs';
-import { ComponentType, ReactNode } from 'react';
-interface Props<T> {
-    observable: Observable<T>;
-    children: (value: T) => ReactNode;
-}
-declare type ObservableComponent<T> = ComponentType<Props<T>>;
-/**
- * @deprecated Use the useObservable hook instead
- */
-export declare const WithObservable: ObservableComponent<unknown>;
-export {};

package/dist/cjs/WithObservable.js

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.WithObservable = void 0;
-var operators_1 = require("rxjs/operators");
-var reactiveComponent_1 = require("./reactiveComponent");
-function createWithObservable() {
-    return (0, reactiveComponent_1.reactiveComponent)(function (props$) {
-        return props$.pipe((0, operators_1.distinctUntilChanged)(function (props, prevProps) { return props.observable === prevProps.observable; }), (0, operators_1.switchMap)(function (props) {
-            return props.observable.pipe((0, operators_1.map)(function (observableValue) { return props.children(observableValue); }));
-        }));
-    });
-}
-/**
- * @deprecated Use the useObservable hook instead
- */
-exports.WithObservable = createWithObservable();

package/dist/cjs/__tests__/useAsObservable.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/cjs/__tests__/useAsObservable.test.js

@@ -1,77 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var useAsObservable_1 = require("../useAsObservable");
-var react_1 = __importDefault(require("react"));
-var react_2 = require("@testing-library/react");
-test('the returned observable should receive a new value when component is rendered with a new value', function () {
-    var receivedValues = [];
-    var _a = (0, react_2.renderHook)(function (props) {
-        var observable = (0, useAsObservable_1.useAsObservable)(props.value);
-        react_1.default.useEffect(function () {
-            var subscription = observable.subscribe(function (v) {
-                receivedValues.push(v);
-            });
-            return function () {
-                subscription.unsubscribe();
-            };
-        }, []);
-    }, { initialProps: { value: 'initial' } }), unmount = _a.unmount, rerender = _a.rerender;
-    rerender({ value: 'rerender' });
-    rerender({ value: 'rerender again' });
-    expect(receivedValues).toEqual(['initial', 'rerender', 'rerender again']);
-    unmount();
-});
-test('the returned observable should *not* receive a new value when component is rendered with an unchanged value', function () {
-    var receivedValues = [];
-    var _a = (0, react_2.renderHook)(function (props) {
-        var observable = (0, useAsObservable_1.useAsObservable)(props.value);
-        react_1.default.useEffect(function () {
-            var subscription = observable.subscribe(function (v) {
-                receivedValues.push(v);
-            });
-            return function () {
-                subscription.unsubscribe();
-            };
-        }, []);
-    }, { initialProps: { value: 'some value' } }), unmount = _a.unmount, rerender = _a.rerender;
-    rerender({ value: 'some value' });
-    rerender({ value: 'some value' });
-    expect(receivedValues).toEqual(['some value']);
-    unmount();
-});
-test('the returned observable should have the same identity across multiple re-renders/hook calls', function () {
-    var returnValues = [];
-    var _a = (0, react_2.renderHook)(function () {
-        returnValues.push((0, useAsObservable_1.useAsObservable)('render'));
-    }), unmount = _a.unmount, rerender = _a.rerender;
-    rerender();
-    rerender();
-    var initial = returnValues[0], firstRerender = returnValues[1], secondRerender = returnValues[2];
-    expect(initial).toBe(firstRerender);
-    expect(firstRerender).toBe(secondRerender);
-    unmount();
-});
-test('the returned observable should complete on unmount', function () {
-    var didComplete = false;
-    var _a = (0, react_2.renderHook)(function () {
-        var observable = (0, useAsObservable_1.useAsObservable)('render');
-        react_1.default.useEffect(function () {
-            var subscription = observable.subscribe({
-                complete: function () {
-                    didComplete = true;
-                },
-            });
-            return function () {
-                subscription.unsubscribe();
-            };
-        }, []);
-    }), unmount = _a.unmount, rerender = _a.rerender;
-    expect(didComplete).toBe(false);
-    rerender();
-    expect(didComplete).toBe(false);
-    unmount();
-    expect(didComplete).toBe(true);
-});

package/dist/cjs/displayName.d.ts

@@ -1 +0,0 @@
-export declare const wrapDisplayName: (BaseComponent: Function, wrapperName: string) => string;

package/dist/cjs/displayName.js

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.wrapDisplayName = void 0;
-var getDisplayName = function (Component) {
-    if (typeof Component === 'string') {
-        return Component;
-    }
-    return (Component && (Component.displayName || Component.name)) || 'Unknown';
-};
-// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types, @typescript-eslint/ban-types
-var wrapDisplayName = function (BaseComponent, wrapperName) {
-    return "".concat(wrapperName, "(").concat(getDisplayName(BaseComponent), ")");
-};
-exports.wrapDisplayName = wrapDisplayName;

package/dist/cjs/reactiveComponent.d.ts

@@ -1,8 +0,0 @@
-import { Observable } from 'rxjs';
-import { FunctionComponent, ReactNode, Ref } from 'react';
-declare type Component<Props> = (input$: Observable<Props>) => Observable<ReactNode>;
-export declare function reactiveComponent<Props>(observable: Observable<Props>): FunctionComponent<Props>;
-export declare function reactiveComponent<Props>(component: Component<Props>): FunctionComponent<Props>;
-declare type ForwardRefComponent<RefType, Props> = (input$: Observable<Props>, ref: Ref<RefType>) => Observable<ReactNode>;
-export declare function forwardRef<RefType, Props = {}>(component: ForwardRefComponent<RefType, Props>): import("react").ForwardRefExoticComponent<import("react").PropsWithoutRef<Props> & import("react").RefAttributes<RefType>>;
-export {};

package/dist/cjs/reactiveComponent.js

@@ -1,35 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.forwardRef = exports.reactiveComponent = void 0;
-var displayName_1 = require("./displayName");
-var useAsObservable_1 = require("./useAsObservable");
-var useObservable_1 = require("./useObservable");
-var react_1 = require("react");
-function fromComponent(component) {
-    var wrappedComponent = function (props) {
-        return (0, react_1.createElement)(react_1.Fragment, null, (0, useObservable_1.useObservable)((0, react_1.useRef)(component((0, useAsObservable_1.useAsObservable)(props))).current));
-    };
-    wrappedComponent.displayName = (0, displayName_1.wrapDisplayName)(component, 'reactiveComponent');
-    return wrappedComponent;
-}
-// eslint-disable-next-line @typescript-eslint/ban-types
-function fromObservable(input$) {
-    return function ReactiveComponent() {
-        return (0, react_1.createElement)(react_1.Fragment, null, (0, useObservable_1.useObservable)(input$));
-    };
-}
-function reactiveComponent(observableOrComponent) {
-    return typeof observableOrComponent === 'function'
-        ? fromComponent(observableOrComponent)
-        : fromObservable(observableOrComponent);
-}
-exports.reactiveComponent = reactiveComponent;
-// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types, @typescript-eslint/ban-types
-function forwardRef(component) {
-    var wrappedComponent = (0, react_1.forwardRef)(function (props, ref) {
-        return (0, react_1.createElement)(react_1.Fragment, null, (0, useObservable_1.useObservable)((0, react_1.useRef)(component((0, useAsObservable_1.useAsObservable)(props), ref)).current));
-    });
-    wrappedComponent.displayName = (0, displayName_1.wrapDisplayName)(component, 'reactiveComponent');
-    return wrappedComponent;
-}
-exports.forwardRef = forwardRef;

package/dist/cjs/useAsObservable.d.ts

@@ -1,10 +0,0 @@
-import { Observable } from 'rxjs';
-/**
- * React hook to convert any props or state value into an observable
- * Returns an observable representing updates to any React value (props, state or any other calculated value)
- * Note: the returned observable is the same instance throughout the component lifecycle
- * @param value
- * @deprecated use an `of` operator and `useMemoObservable` instead for a faster, more robust and  siimpler solution
- */
-export declare function useAsObservable<T>(value: T): Observable<T>;
-export declare function useAsObservable<T, K>(value: T, operator: (input: Observable<T>) => Observable<K>): Observable<K>;

package/dist/cjs/useAsObservable.js

@@ -1,47 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useAsObservable = void 0;
-var rxjs_1 = require("rxjs");
-var react_1 = require("react");
-var operators_1 = require("rxjs/operators");
-function useAsObservable(value, operator) {
-    var setup = (0, react_1.useCallback)(function () {
-        var subject = new rxjs_1.BehaviorSubject(value);
-        var observable = subject.asObservable().pipe((0, operators_1.distinctUntilChanged)());
-        return [operator ? observable.pipe(operator) : observable, subject];
-    }, []);
-    var ref = (0, react_1.useRef)();
-    if (!ref.current) {
-        ref.current = setup();
-    }
-    var observable = ref.current[0];
-    (0, react_1.useEffect)(function () {
-        if (!ref.current) {
-            return;
-        }
-        var _a = ref.current, subject = _a[1];
-        subject.next(value);
-    }, [value, ref]);
-    var shouldRestoreSubscriptionRef = (0, react_1.useRef)(false);
-    (0, react_1.useEffect)(function () {
-        if (shouldRestoreSubscriptionRef.current) {
-            if (!ref.current) {
-                ref.current = setup();
-            }
-            shouldRestoreSubscriptionRef.current = false;
-        }
-        return function () {
-            if (!ref.current) {
-                return;
-            }
-            // React StrictMode will call effects as `setup + teardown + setup` thus we can't trust this callback as "react is about to unmount"
-            // Tracking this ref lets us set the subscription back up on the next `setup` call if needed, and if it really did unmounted then all is well
-            shouldRestoreSubscriptionRef.current = true;
-            var _a = ref.current, subject = _a[1];
-            subject.complete();
-            ref.current = undefined;
-        };
-    }, []);
-    return observable;
-}
-exports.useAsObservable = useAsObservable;

package/dist/cjs/useWithObservable.d.ts

@@ -1,9 +0,0 @@
-import { Observable } from 'rxjs';
-/**
- * React hook to convert any props or state value into an observable
- * Returns an observable representing updates to any React value (props, state or any other calculated value)
- * Note: the returned observable is the same instance throughout the component lifecycle
- * @param value
- */
-export declare function useWithObservable<T>(value: T): T | undefined;
-export declare function useWithObservable<T, K>(value: T, operator: (input: Observable<T>) => Observable<K>): K | undefined;

package/dist/cjs/useWithObservable.js

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useWithObservable = void 0;
-var useObservable_1 = require("./useObservable");
-var useAsObservable_1 = require("./useAsObservable");
-function useWithObservable(value, operator) {
-    return operator
-        ? (0, useObservable_1.useObservable)((0, useAsObservable_1.useAsObservable)(value, operator))
-        : (0, useObservable_1.useObservable)((0, useAsObservable_1.useAsObservable)(value));
-}
-exports.useWithObservable = useWithObservable;

package/dist/cjs/utils.d.ts

@@ -1,7 +0,0 @@
-import { Observable, OperatorFunction } from 'rxjs';
-import { Dispatch, SetStateAction, Context } from 'react';
-export declare function observeState<T>(initial: T | (() => T)): [Observable<T>, Dispatch<SetStateAction<T>>];
-export declare function observeCallback<T>(): [Observable<T>, (arg: T) => void];
-export declare function observeCallback<T, K>(operator: OperatorFunction<T, K>): [Observable<K>, (arg: T) => void];
-export declare function observeContext<T>(context: Context<T>): Observable<T>;
-export declare function observeElement<T>(): [Observable<T | null>, (el: T | null) => void];

package/dist/cjs/utils.js

@@ -1,38 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.observeElement = exports.observeContext = exports.observeCallback = exports.observeState = void 0;
-var useAsObservable_1 = require("./useAsObservable");
-var observable_callback_1 = require("observable-callback");
-var operators_1 = require("rxjs/operators");
-var react_1 = require("react");
-var createState = function (initialState) { return (0, observable_callback_1.observableCallback)((0, operators_1.startWith)(initialState)); };
-function observeState(initial) {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    var _a = (0, react_1.useState)(initial), value = _a[0], update = _a[1];
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    return [(0, useAsObservable_1.useAsObservable)(value), update];
-}
-exports.observeState = observeState;
-function observeCallback(operator) {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    var ref = (0, react_1.useRef)();
-    if (!ref.current) {
-        ref.current = operator ? (0, observable_callback_1.observableCallback)(operator) : (0, observable_callback_1.observableCallback)();
-    }
-    return ref.current;
-}
-exports.observeCallback = observeCallback;
-function observeContext(context) {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    return (0, useAsObservable_1.useAsObservable)((0, react_1.useContext)(context));
-}
-exports.observeContext = observeContext;
-function observeElement() {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    var ref = (0, react_1.useRef)();
-    if (!ref.current) {
-        ref.current = createState(null);
-    }
-    return ref.current;
-}
-exports.observeElement = observeElement;

package/dist/cjs/withPropsStream.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import { Observable } from 'rxjs';
-declare type ObservableFactory<SourceProps, TargetProps> = (props$: Observable<SourceProps>) => Observable<TargetProps>;
-/**
- * @deprecated Use reactiveComponent instead
- */
-export declare function withPropsStream<SourceProps, TargetProps>(observableOrFactory: Observable<TargetProps> | ObservableFactory<SourceProps, TargetProps>, TargetComponent: React.ComponentType<TargetProps>): React.FunctionComponent<SourceProps>;
-export {};

package/dist/cjs/withPropsStream.js

@@ -1,55 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.withPropsStream = void 0;
-var React = __importStar(require("react"));
-var operators_1 = require("rxjs/operators");
-var displayName_1 = require("./displayName");
-var reactiveComponent_1 = require("./reactiveComponent");
-/**
- * @deprecated Use reactiveComponent instead
- */
-function withPropsStream(observableOrFactory, TargetComponent) {
-    var ComposedComponent = (0, reactiveComponent_1.reactiveComponent)(function (sourceProps$) {
-        var targetProps$ = typeof observableOrFactory === 'function'
-            ? observableOrFactory(sourceProps$)
-            : observableOrFactory;
-        return targetProps$.pipe((0, operators_1.map)(function (props) { return React.createElement(TargetComponent, __assign({}, props)); }));
-    });
-    ComposedComponent.displayName = (0, displayName_1.wrapDisplayName)(TargetComponent, 'withPropsStream');
-    return ComposedComponent;
-}
-exports.withPropsStream = withPropsStream;