mirror of
https://github.com/re-rxjs/react-rxjs.git
synced 2025-12-08 18:01:51 +00:00
@react-rxjs/core@0.10.0-rc.1
This commit is contained in:
parent
b5826b4e59
commit
45bb9c71f9
84
package-lock.json
generated
84
package-lock.json
generated
@ -2359,12 +2359,12 @@
|
||||
"resolved": "packages/utils",
|
||||
"link": true
|
||||
},
|
||||
"node_modules/@rxstate/core": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@rxstate/core/-/core-0.0.1.tgz",
|
||||
"integrity": "sha512-be8446G5eapl6X8IAuYvvYY78CnyuXX7pASAYG2Ww95hCbqfNLSYXqknvWeUJ4ovO63l5xdM29ct0uUysKDyog==",
|
||||
"node_modules/@rx-state/core": {
|
||||
"version": "0.1.0-rc.1",
|
||||
"resolved": "https://registry.npmjs.org/@rx-state/core/-/core-0.1.0-rc.1.tgz",
|
||||
"integrity": "sha512-gEEjX5UIN/CeS4GPcsRd4+8ACBzd1jFuY7oiGNg/0Tn6CUpuDwvGoPOdaiam3IdmuCgNyc8G7JxmcGubQURMvQ==",
|
||||
"peerDependencies": {
|
||||
"rxjs": ">=6"
|
||||
"rxjs": ">=7"
|
||||
}
|
||||
},
|
||||
"node_modules/@sinonjs/commons": {
|
||||
@ -8637,10 +8637,10 @@
|
||||
},
|
||||
"packages/core": {
|
||||
"name": "@react-rxjs/core",
|
||||
"version": "0.9.7",
|
||||
"version": "0.10.0-rc.1",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@rxstate/core": "^0.0.1",
|
||||
"@rx-state/core": "0.1.0-rc.1",
|
||||
"use-sync-external-store": "^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
@ -8656,7 +8656,7 @@
|
||||
"version": "0.1.8",
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"@react-rxjs/core": "0.9.6"
|
||||
"@react-rxjs/core": "0.10.0-rc.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0",
|
||||
@ -8664,46 +8664,18 @@
|
||||
"rxjs": ">=6"
|
||||
}
|
||||
},
|
||||
"packages/dom/node_modules/@react-rxjs/core": {
|
||||
"version": "0.9.6",
|
||||
"resolved": "https://registry.npmjs.org/@react-rxjs/core/-/core-0.9.6.tgz",
|
||||
"integrity": "sha512-OEyGPca1LXz06iLZMJyFniE3fFaqNvS/+jdpk7gtNFLGmwCo5H6HPAGFEEhui90A0BpLR1hSzDHy3L9b3I9rZw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@rxstate/core": "^0.0.1",
|
||||
"use-sync-external-store": "^1.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0",
|
||||
"rxjs": ">=7"
|
||||
}
|
||||
},
|
||||
"packages/utils": {
|
||||
"name": "@react-rxjs/utils",
|
||||
"version": "0.9.5",
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"@react-rxjs/core": "0.9.6"
|
||||
"@react-rxjs/core": "0.10.0-rc.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@react-rxjs/core": ">=0.1.0",
|
||||
"react": ">=16.8.0",
|
||||
"rxjs": ">=6"
|
||||
}
|
||||
},
|
||||
"packages/utils/node_modules/@react-rxjs/core": {
|
||||
"version": "0.9.6",
|
||||
"resolved": "https://registry.npmjs.org/@react-rxjs/core/-/core-0.9.6.tgz",
|
||||
"integrity": "sha512-OEyGPca1LXz06iLZMJyFniE3fFaqNvS/+jdpk7gtNFLGmwCo5H6HPAGFEEhui90A0BpLR1hSzDHy3L9b3I9rZw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@rxstate/core": "^0.0.1",
|
||||
"use-sync-external-store": "^1.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0",
|
||||
"rxjs": ">=7"
|
||||
}
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
@ -10362,7 +10334,7 @@
|
||||
"@react-rxjs/core": {
|
||||
"version": "file:packages/core",
|
||||
"requires": {
|
||||
"@rxstate/core": "^0.0.1",
|
||||
"@rx-state/core": "0.1.0-rc.1",
|
||||
"@types/use-sync-external-store": "^0.0.3",
|
||||
"use-sync-external-store": "^1.0.0"
|
||||
}
|
||||
@ -10370,43 +10342,19 @@
|
||||
"@react-rxjs/dom": {
|
||||
"version": "file:packages/dom",
|
||||
"requires": {
|
||||
"@react-rxjs/core": "0.9.6"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-rxjs/core": {
|
||||
"version": "0.9.6",
|
||||
"resolved": "https://registry.npmjs.org/@react-rxjs/core/-/core-0.9.6.tgz",
|
||||
"integrity": "sha512-OEyGPca1LXz06iLZMJyFniE3fFaqNvS/+jdpk7gtNFLGmwCo5H6HPAGFEEhui90A0BpLR1hSzDHy3L9b3I9rZw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@rxstate/core": "^0.0.1",
|
||||
"use-sync-external-store": "^1.0.0"
|
||||
}
|
||||
}
|
||||
"@react-rxjs/core": "0.10.0-rc.1"
|
||||
}
|
||||
},
|
||||
"@react-rxjs/utils": {
|
||||
"version": "file:packages/utils",
|
||||
"requires": {
|
||||
"@react-rxjs/core": "0.9.6"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-rxjs/core": {
|
||||
"version": "0.9.6",
|
||||
"resolved": "https://registry.npmjs.org/@react-rxjs/core/-/core-0.9.6.tgz",
|
||||
"integrity": "sha512-OEyGPca1LXz06iLZMJyFniE3fFaqNvS/+jdpk7gtNFLGmwCo5H6HPAGFEEhui90A0BpLR1hSzDHy3L9b3I9rZw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@rxstate/core": "^0.0.1",
|
||||
"use-sync-external-store": "^1.0.0"
|
||||
}
|
||||
}
|
||||
"@react-rxjs/core": "0.10.0-rc.1"
|
||||
}
|
||||
},
|
||||
"@rxstate/core": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@rxstate/core/-/core-0.0.1.tgz",
|
||||
"integrity": "sha512-be8446G5eapl6X8IAuYvvYY78CnyuXX7pASAYG2Ww95hCbqfNLSYXqknvWeUJ4ovO63l5xdM29ct0uUysKDyog==",
|
||||
"@rx-state/core": {
|
||||
"version": "0.1.0-rc.1",
|
||||
"resolved": "https://registry.npmjs.org/@rx-state/core/-/core-0.1.0-rc.1.tgz",
|
||||
"integrity": "sha512-gEEjX5UIN/CeS4GPcsRd4+8ACBzd1jFuY7oiGNg/0Tn6CUpuDwvGoPOdaiam3IdmuCgNyc8G7JxmcGubQURMvQ==",
|
||||
"requires": {}
|
||||
},
|
||||
"@sinonjs/commons": {
|
||||
|
||||
@ -22,7 +22,7 @@ require("esbuild")
|
||||
: "./dist/core.cjs.development.js",
|
||||
target: "es2015",
|
||||
minify: isProd,
|
||||
external: ["react", "rxjs", "@rxstate/core", "use-sync-external-store"],
|
||||
external: ["react", "rxjs", "@rx-state/core", "use-sync-external-store"],
|
||||
format: "cjs",
|
||||
sourcemap: true,
|
||||
plugins: [fixCjsPlugin],
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
{
|
||||
"version": "0.9.7",
|
||||
"version": "0.10.0-rc.1",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/re-rxjs/react-rxjs.git"
|
||||
@ -25,8 +25,8 @@
|
||||
],
|
||||
"scripts": {
|
||||
"build": "npm run build:ts && npm run build:esm2017 && npm run build:esm2019 && npm run build:cjs:dev && npm run build:cjs:prod",
|
||||
"build:esm2019": "esbuild src/index.tsx --bundle --outfile=./dist/core.es2019.mjs --target=es2019 --external:react --external:rxjs --external:@rxstate/core --external:use-sync-external-store --format=esm --sourcemap",
|
||||
"build:esm2017": "esbuild src/index.tsx --bundle --outfile=./dist/core.es2017.js --target=es2017 --external:react --external:rxjs --external:@rxstate/core --external:use-sync-external-store --format=esm --sourcemap",
|
||||
"build:esm2019": "esbuild src/index.tsx --bundle --outfile=./dist/core.es2019.mjs --target=es2019 --external:react --external:rxjs --external:@rx-state/core --external:use-sync-external-store --format=esm --sourcemap",
|
||||
"build:esm2017": "esbuild src/index.tsx --bundle --outfile=./dist/core.es2017.js --target=es2017 --external:react --external:rxjs --external:@rx-state/core --external:use-sync-external-store --format=esm --sourcemap",
|
||||
"build:cjs:dev": "node cjsBuild.js",
|
||||
"build:cjs:prod": "node cjsBuild.js --prod",
|
||||
"build:ts": "tsc -p ./tsconfig-build.json --outDir ./dist --skipLibCheck --emitDeclarationOnly",
|
||||
@ -50,7 +50,7 @@
|
||||
"Victor Oliva (https://github.com/voliva)"
|
||||
],
|
||||
"dependencies": {
|
||||
"@rxstate/core": "^0.0.1",
|
||||
"@rx-state/core": "0.1.0-rc.1",
|
||||
"use-sync-external-store": "^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@ -1,7 +0,0 @@
|
||||
/**
|
||||
* This is a special symbol that can be emitted from our observables to let the
|
||||
* react hook know that there is a value on its way, and that we want to
|
||||
* leverage React Suspense API while we are waiting for that value.
|
||||
*/
|
||||
export const SUSPENSE = Symbol("SUSPENSE")
|
||||
export type SUSPENSE = typeof SUSPENSE
|
||||
@ -1,4 +1,4 @@
|
||||
import { state } from "@rxstate/core"
|
||||
import { state } from "@rx-state/core"
|
||||
import { render, screen } from "@testing-library/react"
|
||||
import React, { StrictMode, useState, useEffect } from "react"
|
||||
import { defer, EMPTY, NEVER, Observable, of, startWith } from "rxjs"
|
||||
|
||||
@ -1,7 +1,11 @@
|
||||
import { Observable } from "rxjs"
|
||||
import { SUSPENSE } from "../SUSPENSE"
|
||||
import { EMPTY_VALUE } from "../internal/empty-value"
|
||||
import { state, StateObservable } from "@rxstate/core"
|
||||
import {
|
||||
EffectObservable,
|
||||
state,
|
||||
StateObservable,
|
||||
SUSPENSE,
|
||||
} from "@rx-state/core"
|
||||
import { useStateObservable } from "../useStateObservable"
|
||||
|
||||
/**
|
||||
@ -23,12 +27,12 @@ import { useStateObservable } from "../useStateObservable"
|
||||
* subscription, then the hook will leverage React Suspense while it's waiting
|
||||
* for the first value.
|
||||
*/
|
||||
export default function connectFactoryObservable<A extends [], O>(
|
||||
getObservable: (...args: A) => Observable<O>,
|
||||
export default function connectFactoryObservable<A extends [], O, E>(
|
||||
getObservable: (...args: A) => EffectObservable<O, E>,
|
||||
defaultValue: O | ((...args: A) => O),
|
||||
): [
|
||||
(...args: A) => Exclude<O, typeof SUSPENSE>,
|
||||
(...args: A) => StateObservable<O>,
|
||||
(...args: A) => Exclude<O | E, SUSPENSE>,
|
||||
(...args: A) => StateObservable<O, E>,
|
||||
] {
|
||||
const args:
|
||||
| [(...args: A) => Observable<O>]
|
||||
@ -37,6 +41,6 @@ export default function connectFactoryObservable<A extends [], O>(
|
||||
? [getObservable]
|
||||
: [getObservable, defaultValue]
|
||||
|
||||
const obs = state(...(args as [(...args: A) => Observable<O>]))
|
||||
const obs = state(...(args as [(...args: A) => EffectObservable<O, E>]))
|
||||
return [(...input: A) => useStateObservable(obs(...input)), obs]
|
||||
}
|
||||
|
||||
@ -477,7 +477,7 @@ describe("connectObservable", () => {
|
||||
it("allows async errors to be caught in error boundaries with suspense", async () => {
|
||||
const errStream = new Subject()
|
||||
const [useError, errStream$] = bind(errStream)
|
||||
const errStream$WithoutErrors = errStream$.pipe(catchError(() => EMPTY))
|
||||
const errStream$WithoutErrors = errStream$.pipe(catchError(() => NEVER))
|
||||
|
||||
const ErrorComponent = () => {
|
||||
const value = useError()
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import { EMPTY_VALUE } from "../internal/empty-value"
|
||||
import { Observable } from "rxjs"
|
||||
import { useStateObservable } from "../useStateObservable"
|
||||
import { state } from "@rxstate/core"
|
||||
import { state } from "@rx-state/core"
|
||||
|
||||
/**
|
||||
* Accepts: An Observable.
|
||||
|
||||
@ -1,9 +1,12 @@
|
||||
import { Observable } from "rxjs"
|
||||
import { SUSPENSE } from "../SUSPENSE"
|
||||
import connectFactoryObservable from "./connectFactoryObservable"
|
||||
import connectObservable from "./connectObservable"
|
||||
import { EMPTY_VALUE } from "../internal/empty-value"
|
||||
import { StateObservable, DefaultedStateObservable } from "@rxstate/core"
|
||||
import {
|
||||
StateObservable,
|
||||
DefaultedStateObservable,
|
||||
SUSPENSE,
|
||||
} from "@rx-state/core"
|
||||
|
||||
/**
|
||||
* Binds an observable to React
|
||||
@ -21,7 +24,7 @@ import { StateObservable, DefaultedStateObservable } from "@rxstate/core"
|
||||
*/
|
||||
export function bind<T>(
|
||||
observable: Observable<T>,
|
||||
): [() => Exclude<T, typeof SUSPENSE>, StateObservable<T>]
|
||||
): [() => Exclude<T, typeof SUSPENSE>, StateObservable<T, never>]
|
||||
|
||||
/**
|
||||
* Binds an observable to React
|
||||
@ -38,7 +41,7 @@ export function bind<T>(
|
||||
export function bind<T>(
|
||||
observable: Observable<T>,
|
||||
defaultValue: T,
|
||||
): [() => Exclude<T, typeof SUSPENSE>, DefaultedStateObservable<T>]
|
||||
): [() => Exclude<T, typeof SUSPENSE>, DefaultedStateObservable<T, never>]
|
||||
|
||||
/**
|
||||
* Binds a factory observable to React
|
||||
@ -62,7 +65,7 @@ export function bind<A extends unknown[], O>(
|
||||
getObservable: (...args: A) => Observable<O>,
|
||||
): [
|
||||
(...args: A) => Exclude<O, typeof SUSPENSE>,
|
||||
(...args: A) => StateObservable<O>,
|
||||
(...args: A) => StateObservable<O, never>,
|
||||
]
|
||||
|
||||
/**
|
||||
@ -86,7 +89,7 @@ export function bind<A extends unknown[], O>(
|
||||
defaultValue: O | ((...args: A) => O),
|
||||
): [
|
||||
(...args: A) => Exclude<O, typeof SUSPENSE>,
|
||||
(...args: A) => DefaultedStateObservable<O>,
|
||||
(...args: A) => DefaultedStateObservable<O, never>,
|
||||
]
|
||||
|
||||
export function bind(observable: any, defaultValue?: any) {
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
export * from "@rxstate/core"
|
||||
export * from "@rx-state/core"
|
||||
export { shareLatest } from "./shareLatest"
|
||||
export { useStateObservable } from "./useStateObservable"
|
||||
export { bind } from "./bind"
|
||||
export { SUSPENSE } from "./SUSPENSE"
|
||||
export { Subscribe, RemoveSubscribe } from "./Subscribe"
|
||||
|
||||
@ -1,36 +1,37 @@
|
||||
import { useRef, useState } from "react"
|
||||
import { SUSPENSE } from "./SUSPENSE"
|
||||
import { DefaultedStateObservable, StateObservable } from "@rxstate/core"
|
||||
import {
|
||||
SUSPENSE,
|
||||
DefaultedStateObservable,
|
||||
StateObservable,
|
||||
liftEffects,
|
||||
} from "@rx-state/core"
|
||||
import { EMPTY_VALUE } from "./internal/empty-value"
|
||||
import useSyncExternalStore from "./internal/useSyncExternalStore"
|
||||
import { useSubscription } from "./Subscribe"
|
||||
|
||||
type VoidCb = () => void
|
||||
|
||||
interface Ref<T> {
|
||||
source$: StateObservable<T>
|
||||
args: [(cb: VoidCb) => VoidCb, () => Exclude<T, typeof SUSPENSE>]
|
||||
interface Ref<T, E> {
|
||||
source$: StateObservable<T, E>
|
||||
args: [(cb: VoidCb) => VoidCb, () => Exclude<T, SUSPENSE>]
|
||||
}
|
||||
|
||||
const filterOutSuspense = <T>(value: T): value is Exclude<T, SUSPENSE> =>
|
||||
value !== (SUSPENSE as any)
|
||||
|
||||
export const useStateObservable = <O>(
|
||||
source$: StateObservable<O>,
|
||||
export const useStateObservable = <O, E>(
|
||||
source$: StateObservable<O, E>,
|
||||
): Exclude<O, typeof SUSPENSE> => {
|
||||
const subscription = useSubscription()
|
||||
const [, setError] = useState()
|
||||
const callbackRef = useRef<Ref<O>>()
|
||||
const callbackRef = useRef<Ref<O, E>>()
|
||||
|
||||
if (!callbackRef.current) {
|
||||
const getValue = (src: StateObservable<O>) => {
|
||||
const result = src.getValue(filterOutSuspense)
|
||||
const getValue = (src: StateObservable<O, E>) => {
|
||||
const result = src.getValue()
|
||||
if (result instanceof Promise) throw result
|
||||
return result as any
|
||||
}
|
||||
|
||||
const gv: <T>() => Exclude<T, typeof SUSPENSE> = () => {
|
||||
const src = callbackRef.current!.source$ as DefaultedStateObservable<O>
|
||||
const src = callbackRef.current!.source$ as DefaultedStateObservable<O, E>
|
||||
|
||||
if (src.getRefCount() > 0 || src.getDefaultValue) return getValue(src)
|
||||
|
||||
@ -38,7 +39,7 @@ export const useStateObservable = <O>(
|
||||
|
||||
let error = EMPTY_VALUE
|
||||
subscription.add(
|
||||
src.subscribe({
|
||||
liftEffects()(src).subscribe({
|
||||
error: (e) => {
|
||||
error = e
|
||||
},
|
||||
@ -58,7 +59,7 @@ export const useStateObservable = <O>(
|
||||
if (ref.source$ !== source$) {
|
||||
ref.source$ = source$
|
||||
ref.args[0] = (next: () => void) => {
|
||||
const subscription = source$.subscribe({
|
||||
const subscription = liftEffects()(source$).subscribe({
|
||||
next,
|
||||
error: (e) => {
|
||||
setError(() => {
|
||||
|
||||
@ -52,6 +52,6 @@
|
||||
"Victor Oliva (https://github.com/voliva)"
|
||||
],
|
||||
"devDependencies": {
|
||||
"@react-rxjs/core": "0.9.6"
|
||||
"@react-rxjs/core": "0.10.0-rc.1"
|
||||
}
|
||||
}
|
||||
|
||||
@ -51,6 +51,6 @@
|
||||
"Victor Oliva (https://github.com/voliva)"
|
||||
],
|
||||
"devDependencies": {
|
||||
"@react-rxjs/core": "0.9.6"
|
||||
"@react-rxjs/core": "0.10.0-rc.1"
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user