diff --git a/.changeset/deferred-identity-coherent.md b/.changeset/deferred-identity-coherent.md index eb70feb4..cc38ce13 100644 --- a/.changeset/deferred-identity-coherent.md +++ b/.changeset/deferred-identity-coherent.md @@ -1,5 +1,5 @@ --- -'react-rx': patch +"react-rx": patch --- fix: make `useObservable` deferral identity-coherent. The observable identity and its value are now deferred as one snapshot, and when the observable identity changes (e.g. it is memoized on a document id that just changed) the hook falls back to the live value — so the previous identity's value never renders under the new one. diff --git a/website/src/app/llms.txt/route.ts b/website/src/app/llms.txt/route.ts index 46fd5a24..5e22d51d 100644 --- a/website/src/app/llms.txt/route.ts +++ b/website/src/app/llms.txt/route.ts @@ -7,9 +7,7 @@ const SITE_URL = 'https://react-rx.dev' /** llms.txt index (https://llmstxt.org): a short, linkable table of contents for LLMs. */ export async function GET(): Promise { const pages = await collectDocPages() - const links = pages - .map((page) => `- [${page.title}](${SITE_URL}${page.route || '/'})`) - .join('\n') + const links = pages.map((page) => `- [${page.title}](${SITE_URL}${page.route || '/'})`).join('\n') const body = `# ReactRx > Hooks for combining React with RxJS Observables. The \`react-rx\` package provides \`useObservable\`, \`useSyncObservable\` and friends for subscribing to RxJS observables from React components without the re-render-on-mount tax. diff --git a/website/src/examples/data-fetching/index.tsx b/website/src/examples/data-fetching/index.tsx index 695827e8..e851c10b 100644 --- a/website/src/examples/data-fetching/index.tsx +++ b/website/src/examples/data-fetching/index.tsx @@ -1,5 +1,7 @@ import ExampleSandpack from '@/components/ExampleSandpack' export default function Example() { - return + return ( + + ) } diff --git a/website/src/examples/event-handlers/index.tsx b/website/src/examples/event-handlers/index.tsx index d8fccee0..00a1483a 100644 --- a/website/src/examples/event-handlers/index.tsx +++ b/website/src/examples/event-handlers/index.tsx @@ -1,5 +1,7 @@ import ExampleSandpack from '@/components/ExampleSandpack' export default function Example() { - return + return ( + + ) } diff --git a/website/src/examples/manifests.ts b/website/src/examples/manifests.ts index 33339b0f..5003b472 100644 --- a/website/src/examples/manifests.ts +++ b/website/src/examples/manifests.ts @@ -12,7 +12,12 @@ export interface ExampleManifest { /** Sandpack file path (e.g. `/App.tsx`) → source file inside `src/examples/`. */ files: Record /** Extra npm dependencies for the sandbox. Versions are resolved from the website's own deps. */ - dependencies?: Partial> + dependencies?: Partial< + Record< + keyof typeof websitePackageJson.dependencies, + 'latest' + > + > /** Optional post-processing applied to each file, both in Sandpack and in exported markdown. */ transform?: (source: string) => string } @@ -27,7 +32,10 @@ export const exampleManifests = { }, 'animation': { files: {'/App.tsx': 'AnimationExample.tsx'}, - dependencies: {'bezier-easing': 'latest', 'styled-components': 'latest'}, + dependencies: { + 'bezier-easing': 'latest', + 'styled-components': 'latest', + }, }, 'context': { files: { @@ -37,7 +45,9 @@ export const exampleManifests = { }, }, 'data-fetching': { - files: {'/App.tsx': 'DataFetchingExample.tsx'}, + files: { + '/App.tsx': 'DataFetchingExample.tsx', + }, }, 'errors': { files: { @@ -45,10 +55,14 @@ export const exampleManifests = { '/Example.tsx': 'Example.tsx', '/Counter.tsx': 'Counter.tsx', }, - dependencies: {'use-error-boundary': 'latest'}, + dependencies: { + 'use-error-boundary': 'latest', + }, }, 'event-handlers': { - files: {'/App.tsx': 'EventHandlersExample.tsx'}, + files: { + '/App.tsx': 'EventHandlersExample.tsx', + }, }, 'fetch': { files: {'/App.tsx': 'FetchExample.tsx'}, @@ -74,7 +88,9 @@ export const exampleManifests = { files: {'/App.tsx': 'HelloWorldExample.tsx'}, }, 'reactive-state': { - files: {'/App.tsx': 'ReactiveStateExample.tsx'}, + files: { + '/App.tsx': 'ReactiveStateExample.tsx', + }, }, 'search': { files: {'/App.tsx': 'SearchExample.tsx'}, @@ -92,7 +108,8 @@ export const exampleManifests = { files: { '/App.tsx': 'TickExample.tsx', './Ticker.tsx': 'Ticker.tsx', - './TickerWithSubTick.tsx': 'TickerWithSubTick.tsx', + './TickerWithSubTick.tsx': + 'TickerWithSubTick.tsx', }, }, 'todo-app': { @@ -101,4 +118,5 @@ export const exampleManifests = { }, } satisfies Record -export type ExampleName = keyof typeof exampleManifests +export type ExampleName = + keyof typeof exampleManifests diff --git a/website/src/examples/reactive-state/index.tsx b/website/src/examples/reactive-state/index.tsx index 5a25f124..29a62218 100644 --- a/website/src/examples/reactive-state/index.tsx +++ b/website/src/examples/reactive-state/index.tsx @@ -1,5 +1,7 @@ import ExampleSandpack from '@/components/ExampleSandpack' export default function Example() { - return + return ( + + ) }