diff --git a/docs/framework/angular/quick-start.md b/docs/framework/angular/quick-start.md index 06b708b7..b4b48695 100644 --- a/docs/framework/angular/quick-start.md +++ b/docs/framework/angular/quick-start.md @@ -32,10 +32,10 @@ export class AppComponent {} **store.ts** ```typescript -import { Store } from '@tanstack/angular-store'; +import { createStore } from '@tanstack/angular-store'; // You can instantiate the store outside of Angular components too! -export const store = new Store({ +export const store = createStore({ dogs: 0, cats: 0, }); diff --git a/docs/framework/angular/reference/functions/injectStore.md b/docs/framework/angular/reference/functions/injectStore.md index 91883003..0219a908 100644 --- a/docs/framework/angular/reference/functions/injectStore.md +++ b/docs/framework/angular/reference/functions/injectStore.md @@ -14,7 +14,7 @@ function injectStore( options?): Signal; ``` -Defined in: [index.ts:19](https://github.com/TanStack/store/blob/main/packages/angular-store/src/index.ts#L19) +Defined in: [index.ts:16](https://github.com/TanStack/store/blob/main/packages/angular-store/src/index.ts#L16) ### Type Parameters @@ -30,7 +30,7 @@ Defined in: [index.ts:19](https://github.com/TanStack/store/blob/main/packages/a #### store -`Store`\<`TState`, `any`\> +`Atom`\<`TState`\> #### selector? @@ -53,7 +53,7 @@ function injectStore( options?): Signal; ``` -Defined in: [index.ts:24](https://github.com/TanStack/store/blob/main/packages/angular-store/src/index.ts#L24) +Defined in: [index.ts:21](https://github.com/TanStack/store/blob/main/packages/angular-store/src/index.ts#L21) ### Type Parameters @@ -69,7 +69,7 @@ Defined in: [index.ts:24](https://github.com/TanStack/store/blob/main/packages/a #### store -`Derived`\<`TState`, `any`\> +`Atom`\<`TState`\> | `ReadonlyAtom`\<`TState`\> #### selector? diff --git a/docs/framework/preact/quick-start.md b/docs/framework/preact/quick-start.md index 96e19d2e..841fcab7 100644 --- a/docs/framework/preact/quick-start.md +++ b/docs/framework/preact/quick-start.md @@ -7,10 +7,10 @@ The basic preact app example to get started with the TanStack preact-store. ```tsx import { render } from "preact"; -import { Store, useStore } from "@tanstack/preact-store"; +import { createStore, useStore } from "@tanstack/preact-store"; // You can instantiate the store outside of Preact components too! -export const store = new Store({ +export const store = createStore({ dogs: 0, cats: 0, }); diff --git a/docs/framework/preact/reference/functions/shallow.md b/docs/framework/preact/reference/functions/shallow.md index 8284ccaf..eb6e75c9 100644 --- a/docs/framework/preact/reference/functions/shallow.md +++ b/docs/framework/preact/reference/functions/shallow.md @@ -9,7 +9,7 @@ title: shallow function shallow(objA, objB): boolean; ``` -Defined in: [index.ts:130](https://github.com/TanStack/store/blob/main/packages/preact-store/src/index.ts#L130) +Defined in: [index.ts:116](https://github.com/TanStack/store/blob/main/packages/preact-store/src/index.ts#L116) ## Type Parameters diff --git a/docs/framework/preact/reference/functions/useStore.md b/docs/framework/preact/reference/functions/useStore.md index 22d4ed55..b9a67a5d 100644 --- a/docs/framework/preact/reference/functions/useStore.md +++ b/docs/framework/preact/reference/functions/useStore.md @@ -5,80 +5,39 @@ title: useStore # Function: useStore() -## Call Signature - -```ts -function useStore( - store, - selector?, - options?): TSelected; -``` - -Defined in: [index.ts:104](https://github.com/TanStack/store/blob/main/packages/preact-store/src/index.ts#L104) - -### Type Parameters - -#### TState - -`TState` - -#### TSelected - -`TSelected` = `NoInfer`\<`TState`\> - -### Parameters - -#### store - -`Store`\<`TState`, `any`\> - -#### selector? - -(`state`) => `TSelected` - -#### options? - -`UseStoreOptions`\<`TSelected`\> - -### Returns - -`TSelected` - -## Call Signature - ```ts function useStore( store, - selector?, - options?): TSelected; + selector, + options): TSelected; ``` -Defined in: [index.ts:109](https://github.com/TanStack/store/blob/main/packages/preact-store/src/index.ts#L109) +Defined in: [index.ts:100](https://github.com/TanStack/store/blob/main/packages/preact-store/src/index.ts#L100) -### Type Parameters +## Type Parameters -#### TState +### TState `TState` -#### TSelected +### TSelected `TSelected` = `NoInfer`\<`TState`\> -### Parameters +## Parameters -#### store +### store -`Derived`\<`TState`, `any`\> +`Atom`\<`TState`\> | `ReadonlyAtom`\<`TState`\> -#### selector? +### selector (`state`) => `TSelected` -#### options? +### options -`UseStoreOptions`\<`TSelected`\> +`UseStoreOptions`\<`TSelected`\> = `{}` -### Returns +## Returns `TSelected` diff --git a/docs/framework/react/quick-start.md b/docs/framework/react/quick-start.md index 50baa085..bab45973 100644 --- a/docs/framework/react/quick-start.md +++ b/docs/framework/react/quick-start.md @@ -8,10 +8,10 @@ The basic react app example to get started with the TanStack react-store. ```tsx import React from "react"; import ReactDOM from "react-dom/client"; -import { Store, useStore } from "@tanstack/react-store"; +import { createStore, useStore } from "@tanstack/react-store"; // You can instantiate the store outside of React components too! -export const store = new Store({ +export const store = createStore({ dogs: 0, cats: 0, }); diff --git a/docs/framework/react/reference/functions/shallow.md b/docs/framework/react/reference/functions/shallow.md index c1070f2a..bcc68b19 100644 --- a/docs/framework/react/reference/functions/shallow.md +++ b/docs/framework/react/reference/functions/shallow.md @@ -9,7 +9,7 @@ title: shallow function shallow(objA, objB): boolean; ``` -Defined in: [index.ts:42](https://github.com/TanStack/store/blob/main/packages/react-store/src/index.ts#L42) +Defined in: [index.ts:5](https://github.com/TanStack/store/blob/main/packages/react-store/src/index.ts#L5) ## Type Parameters diff --git a/docs/framework/react/reference/functions/useSelector.md b/docs/framework/react/reference/functions/useSelector.md new file mode 100644 index 00000000..434bd11c --- /dev/null +++ b/docs/framework/react/reference/functions/useSelector.md @@ -0,0 +1,43 @@ +--- +id: useSelector +title: useSelector +--- + +# Function: useSelector() + +```ts +function useSelector( + atom, + selector, + compare): T; +``` + +Defined in: [useSelector.ts:13](https://github.com/TanStack/store/blob/main/packages/react-store/src/useSelector.ts#L13) + +## Type Parameters + +### TAtom + +`TAtom` *extends* `AnyAtom` \| `undefined` + +### T + +`T` + +## Parameters + +### atom + +`TAtom` + +### selector + +(`snapshot`) => `T` + +### compare + +(`a`, `b`) => `boolean` + +## Returns + +`T` diff --git a/docs/framework/react/reference/functions/useStore.md b/docs/framework/react/reference/functions/useStore.md deleted file mode 100644 index 422e7948..00000000 --- a/docs/framework/react/reference/functions/useStore.md +++ /dev/null @@ -1,84 +0,0 @@ ---- -id: useStore -title: useStore ---- - -# Function: useStore() - -## Call Signature - -```ts -function useStore( - store, - selector?, - options?): TSelected; -``` - -Defined in: [index.ts:15](https://github.com/TanStack/store/blob/main/packages/react-store/src/index.ts#L15) - -### Type Parameters - -#### TState - -`TState` - -#### TSelected - -`TSelected` = `NoInfer`\<`TState`\> - -### Parameters - -#### store - -`Store`\<`TState`, `any`\> - -#### selector? - -(`state`) => `TSelected` - -#### options? - -`UseStoreOptions`\<`TSelected`\> - -### Returns - -`TSelected` - -## Call Signature - -```ts -function useStore( - store, - selector?, - options?): TSelected; -``` - -Defined in: [index.ts:20](https://github.com/TanStack/store/blob/main/packages/react-store/src/index.ts#L20) - -### Type Parameters - -#### TState - -`TState` - -#### TSelected - -`TSelected` = `NoInfer`\<`TState`\> - -### Parameters - -#### store - -`Derived`\<`TState`, `any`\> - -#### selector? - -(`state`) => `TSelected` - -#### options? - -`UseStoreOptions`\<`TSelected`\> - -### Returns - -`TSelected` diff --git a/docs/framework/react/reference/index.md b/docs/framework/react/reference/index.md index 11b180f1..51b6b87c 100644 --- a/docs/framework/react/reference/index.md +++ b/docs/framework/react/reference/index.md @@ -8,4 +8,4 @@ title: "@tanstack/react-store" ## Functions - [shallow](functions/shallow.md) -- [useStore](functions/useStore.md) +- [useSelector](functions/useSelector.md) diff --git a/docs/framework/solid/quick-start.md b/docs/framework/solid/quick-start.md index 6d2da158..67819d76 100644 --- a/docs/framework/solid/quick-start.md +++ b/docs/framework/solid/quick-start.md @@ -6,12 +6,12 @@ id: quick-start The basic Solid app example to get started with the TanStack Solid-store. ```jsx -import { Store, useStore } from '@tanstack/solid-store'; +import { createStore, useStore } from '@tanstack/solid-store'; // You can instantiate the store outside of Solid components too! -export const store = new Store({ -  cats: 0, -  dogs: 0 +export const store = createStore({ + cats: 0, + dogs: 0 }) export const Display = (props) => { diff --git a/docs/framework/solid/reference/functions/shallow.md b/docs/framework/solid/reference/functions/shallow.md index 4f071a7a..d8809f33 100644 --- a/docs/framework/solid/reference/functions/shallow.md +++ b/docs/framework/solid/reference/functions/shallow.md @@ -9,7 +9,7 @@ title: shallow function shallow(objA, objB): boolean; ``` -Defined in: [index.tsx:49](https://github.com/TanStack/store/blob/main/packages/solid-store/src/index.tsx#L49) +Defined in: [index.tsx:35](https://github.com/TanStack/store/blob/main/packages/solid-store/src/index.tsx#L35) ## Type Parameters diff --git a/docs/framework/solid/reference/functions/useStore.md b/docs/framework/solid/reference/functions/useStore.md index dc667d6b..6952ba19 100644 --- a/docs/framework/solid/reference/functions/useStore.md +++ b/docs/framework/solid/reference/functions/useStore.md @@ -5,80 +5,39 @@ title: useStore # Function: useStore() -## Call Signature - -```ts -function useStore( - store, - selector?, -options?): Accessor; -``` - -Defined in: [index.tsx:16](https://github.com/TanStack/store/blob/main/packages/solid-store/src/index.tsx#L16) - -### Type Parameters - -#### TState - -`TState` - -#### TSelected - -`TSelected` = `NoInfer`\<`TState`\> - -### Parameters - -#### store - -`Store`\<`TState`, `any`\> - -#### selector? - -(`state`) => `TSelected` - -#### options? - -`UseStoreOptions`\<`TSelected`\> - -### Returns - -`Accessor`\<`TSelected`\> - -## Call Signature - ```ts function useStore( store, - selector?, -options?): Accessor; + selector, +options): Accessor; ``` -Defined in: [index.tsx:21](https://github.com/TanStack/store/blob/main/packages/solid-store/src/index.tsx#L21) +Defined in: [index.tsx:12](https://github.com/TanStack/store/blob/main/packages/solid-store/src/index.tsx#L12) -### Type Parameters +## Type Parameters -#### TState +### TState `TState` -#### TSelected +### TSelected `TSelected` = `NoInfer`\<`TState`\> -### Parameters +## Parameters -#### store +### store -`Derived`\<`TState`, `any`\> +`Atom`\<`TState`\> | `ReadonlyAtom`\<`TState`\> -#### selector? +### selector (`state`) => `TSelected` -#### options? +### options -`UseStoreOptions`\<`TSelected`\> +`UseStoreOptions`\<`TSelected`\> = `{}` -### Returns +## Returns `Accessor`\<`TSelected`\> diff --git a/docs/framework/svelte/quick-start.md b/docs/framework/svelte/quick-start.md index b74fedc5..3c126fb2 100644 --- a/docs/framework/svelte/quick-start.md +++ b/docs/framework/svelte/quick-start.md @@ -7,10 +7,10 @@ The basic Svelte app example to get started with the TanStack svelte-store. **store.ts** ```ts -import { Store } from '@tanstack/svelte-store'; +import { createStore } from '@tanstack/svelte-store'; // You can instantiate the store outside of Svelte files too! -export const store = new Store({ +export const store = createStore({ dogs: 0, cats: 0, }); diff --git a/docs/framework/svelte/reference/functions/shallow.md b/docs/framework/svelte/reference/functions/shallow.md index 0fcd2973..dc1f1465 100644 --- a/docs/framework/svelte/reference/functions/shallow.md +++ b/docs/framework/svelte/reference/functions/shallow.md @@ -9,7 +9,7 @@ title: shallow function shallow(objA, objB): boolean; ``` -Defined in: [index.svelte.ts:51](https://github.com/TanStack/store/blob/main/packages/svelte-store/src/index.svelte.ts#L51) +Defined in: [index.svelte.ts:37](https://github.com/TanStack/store/blob/main/packages/svelte-store/src/index.svelte.ts#L37) ## Type Parameters diff --git a/docs/framework/svelte/reference/functions/useStore.md b/docs/framework/svelte/reference/functions/useStore.md index cb2b354b..fb67a1a5 100644 --- a/docs/framework/svelte/reference/functions/useStore.md +++ b/docs/framework/svelte/reference/functions/useStore.md @@ -5,91 +5,44 @@ title: useStore # Function: useStore() -## Call Signature - -```ts -function useStore( - store, - selector?, - options?): object; -``` - -Defined in: [index.svelte.ts:14](https://github.com/TanStack/store/blob/main/packages/svelte-store/src/index.svelte.ts#L14) - -### Type Parameters - -#### TState - -`TState` - -#### TSelected - -`TSelected` = `NoInfer`\<`TState`\> - -### Parameters - -#### store - -`Store`\<`TState`, `any`\> - -#### selector? - -(`state`) => `TSelected` - -#### options? - -`UseStoreOptions`\<`TSelected`\> - -### Returns - -`object` - -#### current - -```ts -readonly current: TSelected; -``` - -## Call Signature - ```ts function useStore( store, - selector?, - options?): object; + selector, + options): object; ``` -Defined in: [index.svelte.ts:19](https://github.com/TanStack/store/blob/main/packages/svelte-store/src/index.svelte.ts#L19) +Defined in: [index.svelte.ts:10](https://github.com/TanStack/store/blob/main/packages/svelte-store/src/index.svelte.ts#L10) -### Type Parameters +## Type Parameters -#### TState +### TState `TState` -#### TSelected +### TSelected `TSelected` = `NoInfer`\<`TState`\> -### Parameters +## Parameters -#### store +### store -`Derived`\<`TState`, `any`\> +`Atom`\<`TState`\> | `ReadonlyAtom`\<`TState`\> -#### selector? +### selector (`state`) => `TSelected` -#### options? +### options -`UseStoreOptions`\<`TSelected`\> +`UseStoreOptions`\<`TSelected`\> = `{}` -### Returns +## Returns `object` -#### current +### current ```ts readonly current: TSelected; diff --git a/docs/framework/vue/quick-start.md b/docs/framework/vue/quick-start.md index 3f0d858d..3d96a5f0 100644 --- a/docs/framework/vue/quick-start.md +++ b/docs/framework/vue/quick-start.md @@ -24,10 +24,10 @@ import Display from './Display.vue'; **store.js** ```js -import { Store } from '@tanstack/vue-store'; +import { createStore } from '@tanstack/vue-store'; // You can instantiate the store outside of Vue components too! -export const store = new Store({ +export const store = createStore({ dogs: 0, cats: 0, }); diff --git a/docs/framework/vue/reference/functions/shallow.md b/docs/framework/vue/reference/functions/shallow.md index 48ef7d1e..19259e90 100644 --- a/docs/framework/vue/reference/functions/shallow.md +++ b/docs/framework/vue/reference/functions/shallow.md @@ -9,7 +9,7 @@ title: shallow function shallow(objA, objB): boolean; ``` -Defined in: [index.ts:55](https://github.com/TanStack/store/blob/main/packages/vue-store/src/index.ts#L55) +Defined in: [index.ts:41](https://github.com/TanStack/store/blob/main/packages/vue-store/src/index.ts#L41) ## Type Parameters diff --git a/docs/framework/vue/reference/functions/useStore.md b/docs/framework/vue/reference/functions/useStore.md index fb924f0c..1cb6091b 100644 --- a/docs/framework/vue/reference/functions/useStore.md +++ b/docs/framework/vue/reference/functions/useStore.md @@ -5,80 +5,39 @@ title: useStore # Function: useStore() -## Call Signature - -```ts -function useStore( - store, - selector?, -options?): Readonly>; -``` - -Defined in: [index.ts:16](https://github.com/TanStack/store/blob/main/packages/vue-store/src/index.ts#L16) - -### Type Parameters - -#### TState - -`TState` - -#### TSelected - -`TSelected` = `NoInfer`\<`TState`\> - -### Parameters - -#### store - -`Store`\<`TState`, `any`\> - -#### selector? - -(`state`) => `TSelected` - -#### options? - -`UseStoreOptions`\<`TSelected`\> - -### Returns - -`Readonly`\<`Ref`\<`TSelected`\>\> - -## Call Signature - ```ts function useStore( store, - selector?, -options?): Readonly>; + selector, +options): Readonly>; ``` -Defined in: [index.ts:21](https://github.com/TanStack/store/blob/main/packages/vue-store/src/index.ts#L21) +Defined in: [index.ts:12](https://github.com/TanStack/store/blob/main/packages/vue-store/src/index.ts#L12) -### Type Parameters +## Type Parameters -#### TState +### TState `TState` -#### TSelected +### TSelected `TSelected` = `NoInfer`\<`TState`\> -### Parameters +## Parameters -#### store +### store -`Derived`\<`TState`, `any`\> +`Atom`\<`TState`\> | `ReadonlyAtom`\<`TState`\> -#### selector? +### selector (`state`) => `TSelected` -#### options? +### options -`UseStoreOptions`\<`TSelected`\> +`UseStoreOptions`\<`TSelected`\> = `{}` -### Returns +## Returns `Readonly`\<`Ref`\<`TSelected`\>\> diff --git a/docs/quick-start.md b/docs/quick-start.md index 22a62e72..595c8e69 100644 --- a/docs/quick-start.md +++ b/docs/quick-start.md @@ -12,9 +12,9 @@ It can be used with any of our framework adapters, but can also be used in vanil You'll start by creating a new store instance, which is a wrapper around your data: ```typescript -import { Store } from '@tanstack/store'; +import { createStore } from '@tanstack/store'; -const countStore = new Store(0); +const countStore = createStore(0); console.log(countStore.state); // 0 countStore.setState(() => 1); @@ -32,30 +32,6 @@ const unsub = countStore.subscribe(() => { unsub(); ``` -You can even transform the data before it's updated: - -```typescript -const count = new Store(12, { - updateFn: (prevValue) => (updateValue) => { - return updateValue(prevValue) + previous; - } -}); - -count.setState(() => 12); -// count.state === 24 -``` - -And implement a primitive form of derived state: - -```typescript -let double = 0; -const count = new Store(0, { - onUpdate: () => { - double = count.state * 2; - } -}) -``` - ### Batch Updates You can batch updates to a store by using the `batch` function: @@ -70,84 +46,49 @@ batch(() => { }); ``` -## Derived +## Derived Stores -You can also use the `Derived` class to create derived values that lazily update when their dependencies change: +You can create derived stores that automatically update when their dependencies change: ```typescript -const count = new Store(0); +const count = createStore(0); -const double = new Derived({ - fn: () => count.state * 2, - // Must explicitly list dependencies - deps: [count] -}); - -// Must mount the derived value to start listening for updates -const unmount = double.mount(); +const double = createStore(() => count.state * 2); -// Later, to cleanup -unmount(); +console.log(double.state); // 0 +count.setState(() => 5); +console.log(double.state); // 10 ``` ### Previous Derived Value -You can access the previous value of a derived computation by using the `prevVal` argument passed to the `fn` function: +You can access the previous value of a derived computation by using the `prev` argument passed to the function: ```typescript -const count = new Store(1); +const count = createStore(1); -const double = new Derived({ - fn: ({ prevVal }) => { - return count.state + (prevVal ?? 0); - }, - deps: [count] +const sum = createStore((prev) => { + return count.state + (prev ?? 0); }); -double.mount(); -double.state; // 1 +console.log(sum.state); // 1 count.setState(() => 2); -double.state; // 3 +console.log(sum.state); // 3 ``` -### Dependency Values +## Subscriptions -You can access the values of the dependencies of a derived computation by using the `prevDepVals` and `currDepVals` arguments passed to the `fn` function: +You can subscribe to store changes to perform side effects: ```typescript -const count = new Store(1); +const count = createStore(0); -const double = new Derived({ - fn: ({ prevDepVals, currDepVals }) => { - return (prevDepVals[0] ?? 0) + currDepVals[0]; - }, - deps: [count] +const unsubscribe = count.subscribe((state) => { + console.log('The count is now:', state); }); -double.mount(); -double.state; // 1 -count.setState(() => 2); -double.state; // 3 -``` - -## Effects - -You can also use the `Effect` class to manage side effects across multiple stores and derived values: - -```typescript -const effect = new Effect({ - fn: () => { - console.log('The count is now:', count.state); - }, - // Array of `Store`s or `Derived`s - deps: [count], - // Should effect run immediately, default is false - eager: true -}) - -// Must mount the effect to start listening for updates -const unmount = effect.mount(); +count.setState(() => 5); // Logs: "The count is now: 5" // Later, to cleanup -unmount(); +unsubscribe(); ``` diff --git a/docs/reference/classes/Derived.md b/docs/reference/classes/Derived.md deleted file mode 100644 index ef453e6a..00000000 --- a/docs/reference/classes/Derived.md +++ /dev/null @@ -1,238 +0,0 @@ ---- -id: Derived -title: Derived ---- - -# Class: Derived\ - -Defined in: [derived.ts:61](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L61) - -## Type Parameters - -### TState - -`TState` - -### TArr - -`TArr` *extends* `ReadonlyArray`\<`Derived`\<`any`\> \| [`Store`](Store.md)\<`any`\>\> = `ReadonlyArray`\<`any`\> - -## Constructors - -### Constructor - -```ts -new Derived(options): Derived; -``` - -Defined in: [derived.ts:96](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L96) - -#### Parameters - -##### options - -[`DerivedOptions`](../interfaces/DerivedOptions.md)\<`TState`, `TArr`\> - -#### Returns - -`Derived`\<`TState`, `TArr`\> - -## Properties - -### lastSeenDepValues - -```ts -lastSeenDepValues: unknown[] = []; -``` - -Defined in: [derived.ts:78](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L78) - -*** - -### listeners - -```ts -listeners: Set>; -``` - -Defined in: [derived.ts:67](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L67) - -*** - -### options - -```ts -options: DerivedOptions; -``` - -Defined in: [derived.ts:70](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L70) - -*** - -### prevState - -```ts -prevState: TState | undefined; -``` - -Defined in: [derived.ts:69](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L69) - -*** - -### state - -```ts -state: TState; -``` - -Defined in: [derived.ts:68](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L68) - -## Methods - -### checkIfRecalculationNeededDeeply() - -```ts -checkIfRecalculationNeededDeeply(): void; -``` - -Defined in: [derived.ts:178](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L178) - -#### Returns - -`void` - -*** - -### getDepVals() - -```ts -getDepVals(): object; -``` - -Defined in: [derived.ts:79](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L79) - -#### Returns - -`object` - -##### currDepVals - -```ts -currDepVals: unknown[]; -``` - -##### prevDepVals - -```ts -prevDepVals: unknown[]; -``` - -##### prevVal - -```ts -prevVal: NonNullable | undefined; -``` - -*** - -### mount() - -```ts -mount(): () => void; -``` - -Defined in: [derived.ts:199](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L199) - -#### Returns - -```ts -(): void; -``` - -##### Returns - -`void` - -*** - -### recompute() - -```ts -recompute(): void; -``` - -Defined in: [derived.ts:170](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L170) - -#### Returns - -`void` - -*** - -### registerOnGraph() - -```ts -registerOnGraph(deps): void; -``` - -Defined in: [derived.ts:105](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L105) - -#### Parameters - -##### deps - -readonly ( - \| `Derived`\<`any`, readonly `any`[]\> - \| [`Store`](Store.md)\<`any`, (`cb`) => `any`\>)[] = `...` - -#### Returns - -`void` - -*** - -### subscribe() - -```ts -subscribe(listener): () => void; -``` - -Defined in: [derived.ts:211](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L211) - -#### Parameters - -##### listener - -`Listener`\<`TState`\> - -#### Returns - -```ts -(): void; -``` - -##### Returns - -`void` - -*** - -### unregisterFromGraph() - -```ts -unregisterFromGraph(deps): void; -``` - -Defined in: [derived.ts:147](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L147) - -#### Parameters - -##### deps - -readonly ( - \| `Derived`\<`any`, readonly `any`[]\> - \| [`Store`](Store.md)\<`any`, (`cb`) => `any`\>)[] = `...` - -#### Returns - -`void` diff --git a/docs/reference/classes/Effect.md b/docs/reference/classes/Effect.md deleted file mode 100644 index ffb09cd4..00000000 --- a/docs/reference/classes/Effect.md +++ /dev/null @@ -1,48 +0,0 @@ ---- -id: Effect -title: Effect ---- - -# Class: Effect - -Defined in: [effect.ts:17](https://github.com/TanStack/store/blob/main/packages/store/src/effect.ts#L17) - -## Constructors - -### Constructor - -```ts -new Effect(opts): Effect; -``` - -Defined in: [effect.ts:23](https://github.com/TanStack/store/blob/main/packages/store/src/effect.ts#L23) - -#### Parameters - -##### opts - -`EffectOptions` - -#### Returns - -`Effect` - -## Methods - -### mount() - -```ts -mount(): () => void; -``` - -Defined in: [effect.ts:39](https://github.com/TanStack/store/blob/main/packages/store/src/effect.ts#L39) - -#### Returns - -```ts -(): void; -``` - -##### Returns - -`void` diff --git a/docs/reference/classes/Store.md b/docs/reference/classes/Store.md index c0b8080c..42dab607 100644 --- a/docs/reference/classes/Store.md +++ b/docs/reference/classes/Store.md @@ -3,145 +3,101 @@ id: Store title: Store --- -# Class: Store\ +# Class: Store\ -Defined in: [store.ts:28](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L28) +Defined in: [store.ts:4](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L4) ## Type Parameters -### TState +### T -`TState` - -### TUpdater - -`TUpdater` *extends* `AnyUpdater` = (`cb`) => `TState` +`T` ## Constructors ### Constructor ```ts -new Store(initialState, options?): Store; +new Store(getValue): Store; ``` -Defined in: [store.ts:37](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L37) +Defined in: [store.ts:6](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L6) #### Parameters -##### initialState - -`TState` - -##### options? +##### getValue -[`StoreOptions`](../interfaces/StoreOptions.md)\<`TState`, `TUpdater`\> +(`prev?`) => `T` #### Returns -`Store`\<`TState`, `TUpdater`\> +`Store`\<`T`\> -## Properties - -### listeners +### Constructor ```ts -listeners: Set>; +new Store(initialValue): Store; ``` -Defined in: [store.ts:32](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L32) - -*** - -### options? +Defined in: [store.ts:7](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L7) -```ts -optional options: StoreOptions; -``` - -Defined in: [store.ts:35](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L35) +#### Parameters -*** +##### initialValue -### prevState +`T` -```ts -prevState: TState; -``` +#### Returns -Defined in: [store.ts:34](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L34) +`Store`\<`T`\> -*** +## Accessors ### state -```ts -state: TState; -``` - -Defined in: [store.ts:33](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L33) - -## Methods - -### setState() - -#### Call Signature +#### Get Signature ```ts -setState(updater): void; +get state(): T; ``` -Defined in: [store.ts:55](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L55) - -Update the store state safely with improved type checking - -##### Parameters - -###### updater - -(`prevState`) => `TState` +Defined in: [store.ts:18](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L18) ##### Returns -`void` +`T` + +## Methods -#### Call Signature +### get() ```ts -setState(updater): void; +get(): T; ``` -Defined in: [store.ts:56](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L56) - -Update the store state safely with improved type checking - -##### Parameters +Defined in: [store.ts:21](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L21) -###### updater - -`TState` +#### Returns -##### Returns +`T` -`void` +*** -#### Call Signature +### setState() ```ts setState(updater): void; ``` -Defined in: [store.ts:57](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L57) - -Update the store state safely with improved type checking +Defined in: [store.ts:15](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L15) -##### Parameters +#### Parameters -###### updater +##### updater -`TUpdater` +(`prev`) => `T` -##### Returns +#### Returns `void` @@ -150,23 +106,17 @@ Update the store state safely with improved type checking ### subscribe() ```ts -subscribe(listener): () => void; +subscribe(observerOrFn): Subscription; ``` -Defined in: [store.ts:43](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L43) +Defined in: [store.ts:24](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L24) #### Parameters -##### listener +##### observerOrFn -`Listener`\<`TState`\> +[`Observer`](../type-aliases/Observer.md)\<`T`\> | (`value`) => `void` #### Returns -```ts -(): void; -``` - -##### Returns - -`void` +[`Subscription`](../interfaces/Subscription.md) diff --git a/docs/reference/functions/batch.md b/docs/reference/functions/batch.md deleted file mode 100644 index 8d1c6e06..00000000 --- a/docs/reference/functions/batch.md +++ /dev/null @@ -1,22 +0,0 @@ ---- -id: batch -title: batch ---- - -# Function: batch() - -```ts -function batch(fn): void; -``` - -Defined in: [scheduler.ts:133](https://github.com/TanStack/store/blob/main/packages/store/src/scheduler.ts#L133) - -## Parameters - -### fn - -() => `void` - -## Returns - -`void` diff --git a/docs/reference/functions/createAsyncAtom.md b/docs/reference/functions/createAsyncAtom.md new file mode 100644 index 00000000..c8b2135f --- /dev/null +++ b/docs/reference/functions/createAsyncAtom.md @@ -0,0 +1,32 @@ +--- +id: createAsyncAtom +title: createAsyncAtom +--- + +# Function: createAsyncAtom() + +```ts +function createAsyncAtom(getValue, options?): ReadonlyAtom>; +``` + +Defined in: [atom.ts:85](https://github.com/TanStack/store/blob/main/packages/store/src/atom.ts#L85) + +## Type Parameters + +### T + +`T` + +## Parameters + +### getValue + +() => `Promise`\<`T`\> + +### options? + +[`AtomOptions`](../interfaces/AtomOptions.md)\<`AsyncAtomState`\<`T`, `unknown`\>\> + +## Returns + +[`ReadonlyAtom`](../interfaces/ReadonlyAtom.md)\<`AsyncAtomState`\<`T`, `unknown`\>\> diff --git a/docs/reference/functions/createAtom.md b/docs/reference/functions/createAtom.md new file mode 100644 index 00000000..4a64d07b --- /dev/null +++ b/docs/reference/functions/createAtom.md @@ -0,0 +1,62 @@ +--- +id: createAtom +title: createAtom +--- + +# Function: createAtom() + +## Call Signature + +```ts +function createAtom(getValue, options?): ReadonlyAtom; +``` + +Defined in: [atom.ts:123](https://github.com/TanStack/store/blob/main/packages/store/src/atom.ts#L123) + +### Type Parameters + +#### T + +`T` + +### Parameters + +#### getValue + +(`prev?`) => `T` + +#### options? + +[`AtomOptions`](../interfaces/AtomOptions.md)\<`T`\> + +### Returns + +[`ReadonlyAtom`](../interfaces/ReadonlyAtom.md)\<`T`\> + +## Call Signature + +```ts +function createAtom(initialValue, options?): Atom; +``` + +Defined in: [atom.ts:127](https://github.com/TanStack/store/blob/main/packages/store/src/atom.ts#L127) + +### Type Parameters + +#### T + +`T` + +### Parameters + +#### initialValue + +`T` + +#### options? + +[`AtomOptions`](../interfaces/AtomOptions.md)\<`T`\> + +### Returns + +[`Atom`](../interfaces/Atom.md)\<`T`\> diff --git a/docs/reference/functions/createStore.md b/docs/reference/functions/createStore.md new file mode 100644 index 00000000..6ff2171a --- /dev/null +++ b/docs/reference/functions/createStore.md @@ -0,0 +1,54 @@ +--- +id: createStore +title: createStore +--- + +# Function: createStore() + +## Call Signature + +```ts +function createStore(getValue): Store; +``` + +Defined in: [store.ts:31](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L31) + +### Type Parameters + +#### T + +`T` + +### Parameters + +#### getValue + +(`prev?`) => `T` + +### Returns + +[`Store`](../classes/Store.md)\<`T`\> + +## Call Signature + +```ts +function createStore(initialValue): Store; +``` + +Defined in: [store.ts:32](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L32) + +### Type Parameters + +#### T + +`T` + +### Parameters + +#### initialValue + +`T` + +### Returns + +[`Store`](../classes/Store.md)\<`T`\> diff --git a/docs/reference/functions/isUpdaterFunction.md b/docs/reference/functions/isUpdaterFunction.md deleted file mode 100644 index 6b544c1b..00000000 --- a/docs/reference/functions/isUpdaterFunction.md +++ /dev/null @@ -1,30 +0,0 @@ ---- -id: isUpdaterFunction -title: isUpdaterFunction ---- - -# Function: isUpdaterFunction() - -```ts -function isUpdaterFunction(updater): updater is (prev: T) => T; -``` - -Defined in: [types.ts:27](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L27) - -Type guard to check if updater is a function - -## Type Parameters - -### T - -`T` - -## Parameters - -### updater - -[`Updater`](../type-aliases/Updater.md)\<`T`\> - -## Returns - -`updater is (prev: T) => T` diff --git a/docs/reference/functions/toObserver.md b/docs/reference/functions/toObserver.md new file mode 100644 index 00000000..2f7a17ee --- /dev/null +++ b/docs/reference/functions/toObserver.md @@ -0,0 +1,39 @@ +--- +id: toObserver +title: toObserver +--- + +# Function: toObserver() + +```ts +function toObserver( + nextHandler?, + errorHandler?, +completionHandler?): Observer; +``` + +Defined in: [atom.ts:12](https://github.com/TanStack/store/blob/main/packages/store/src/atom.ts#L12) + +## Type Parameters + +### T + +`T` + +## Parameters + +### nextHandler? + +[`Observer`](../type-aliases/Observer.md)\<`T`\> | (`value`) => `void` + +### errorHandler? + +(`error`) => `void` + +### completionHandler? + +() => `void` + +## Returns + +[`Observer`](../type-aliases/Observer.md)\<`T`\> diff --git a/docs/reference/index.md b/docs/reference/index.md index 39a015bf..7f50c4d1 100644 --- a/docs/reference/index.md +++ b/docs/reference/index.md @@ -7,28 +7,30 @@ title: "@tanstack/store" ## Classes -- [Derived](classes/Derived.md) -- [Effect](classes/Effect.md) - [Store](classes/Store.md) ## Interfaces -- [DerivedFnProps](interfaces/DerivedFnProps.md) -- [DerivedOptions](interfaces/DerivedOptions.md) -- [StoreOptions](interfaces/StoreOptions.md) +- [Atom](interfaces/Atom.md) +- [AtomOptions](interfaces/AtomOptions.md) +- [BaseAtom](interfaces/BaseAtom.md) +- [InternalBaseAtom](interfaces/InternalBaseAtom.md) +- [InternalReadonlyAtom](interfaces/InternalReadonlyAtom.md) +- [InteropSubscribable](interfaces/InteropSubscribable.md) +- [Readable](interfaces/Readable.md) +- [ReadonlyAtom](interfaces/ReadonlyAtom.md) +- [Subscribable](interfaces/Subscribable.md) +- [Subscription](interfaces/Subscription.md) ## Type Aliases -- [UnwrapDerivedOrStore](type-aliases/UnwrapDerivedOrStore.md) -- [Updater](type-aliases/Updater.md) - -## Variables - -- [\_\_depsThatHaveWrittenThisTick](variables/depsThatHaveWrittenThisTick.md) -- [\_\_derivedToStore](variables/derivedToStore.md) -- [\_\_storeToDerived](variables/storeToDerived.md) +- [AnyAtom](type-aliases/AnyAtom.md) +- [Observer](type-aliases/Observer.md) +- [Selection](type-aliases/Selection.md) ## Functions -- [batch](functions/batch.md) -- [isUpdaterFunction](functions/isUpdaterFunction.md) +- [createAsyncAtom](functions/createAsyncAtom.md) +- [createAtom](functions/createAtom.md) +- [createStore](functions/createStore.md) +- [toObserver](functions/toObserver.md) diff --git a/docs/reference/interfaces/Atom.md b/docs/reference/interfaces/Atom.md new file mode 100644 index 00000000..63124fd2 --- /dev/null +++ b/docs/reference/interfaces/Atom.md @@ -0,0 +1,62 @@ +--- +id: Atom +title: Atom +--- + +# Interface: Atom\ + +Defined in: [types.ts:42](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L42) + +## Extends + +- [`BaseAtom`](BaseAtom.md)\<`T`\> + +## Type Parameters + +### T + +`T` + +## Properties + +### get() + +```ts +get: () => T; +``` + +Defined in: [types.ts:30](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L30) + +#### Returns + +`T` + +#### Inherited from + +[`BaseAtom`](BaseAtom.md).[`get`](BaseAtom.md#get) + +*** + +### set + +```ts +set: (fn) => void & (value) => void; +``` + +Defined in: [types.ts:44](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L44) + +Sets the value of the atom using a function. + +*** + +### subscribe + +```ts +subscribe: (observer) => Subscription & (next, error?, complete?) => Subscription; +``` + +Defined in: [types.ts:21](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L21) + +#### Inherited from + +[`BaseAtom`](BaseAtom.md).[`subscribe`](BaseAtom.md#subscribe) diff --git a/docs/reference/interfaces/AtomOptions.md b/docs/reference/interfaces/AtomOptions.md new file mode 100644 index 00000000..c05fee8d --- /dev/null +++ b/docs/reference/interfaces/AtomOptions.md @@ -0,0 +1,38 @@ +--- +id: AtomOptions +title: AtomOptions +--- + +# Interface: AtomOptions\ + +Defined in: [types.ts:47](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L47) + +## Type Parameters + +### T + +`T` + +## Properties + +### compare()? + +```ts +optional compare: (prev, next) => boolean; +``` + +Defined in: [types.ts:48](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L48) + +#### Parameters + +##### prev + +`T` + +##### next + +`T` + +#### Returns + +`boolean` diff --git a/docs/reference/interfaces/BaseAtom.md b/docs/reference/interfaces/BaseAtom.md new file mode 100644 index 00000000..57de2ed9 --- /dev/null +++ b/docs/reference/interfaces/BaseAtom.md @@ -0,0 +1,55 @@ +--- +id: BaseAtom +title: BaseAtom +--- + +# Interface: BaseAtom\ + +Defined in: [types.ts:33](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L33) + +## Extends + +- [`Subscribable`](Subscribable.md)\<`T`\>.[`Readable`](Readable.md)\<`T`\> + +## Extended by + +- [`Atom`](Atom.md) +- [`ReadonlyAtom`](ReadonlyAtom.md) + +## Type Parameters + +### T + +`T` + +## Properties + +### get() + +```ts +get: () => T; +``` + +Defined in: [types.ts:30](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L30) + +#### Returns + +`T` + +#### Inherited from + +[`Readable`](Readable.md).[`get`](Readable.md#get) + +*** + +### subscribe + +```ts +subscribe: (observer) => Subscription & (next, error?, complete?) => Subscription; +``` + +Defined in: [types.ts:21](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L21) + +#### Inherited from + +[`Subscribable`](Subscribable.md).[`subscribe`](Subscribable.md#subscribe) diff --git a/docs/reference/interfaces/DerivedFnProps.md b/docs/reference/interfaces/DerivedFnProps.md deleted file mode 100644 index 6b652b2c..00000000 --- a/docs/reference/interfaces/DerivedFnProps.md +++ /dev/null @@ -1,52 +0,0 @@ ---- -id: DerivedFnProps -title: DerivedFnProps ---- - -# Interface: DerivedFnProps\ - -Defined in: [derived.ts:30](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L30) - -## Type Parameters - -### TArr - -`TArr` *extends* `ReadonlyArray`\< - \| [`Derived`](../classes/Derived.md)\<`any`\> - \| [`Store`](../classes/Store.md)\<`any`\>\> = `ReadonlyArray`\<`any`\> - -### TUnwrappedArr - -`TUnwrappedArr` *extends* `UnwrapReadonlyDerivedOrStoreArray`\<`TArr`\> = `UnwrapReadonlyDerivedOrStoreArray`\<`TArr`\> - -## Properties - -### currDepVals - -```ts -currDepVals: TUnwrappedArr; -``` - -Defined in: [derived.ts:42](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L42) - -*** - -### prevDepVals - -```ts -prevDepVals: TUnwrappedArr | undefined; -``` - -Defined in: [derived.ts:41](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L41) - -*** - -### prevVal - -```ts -prevVal: unknown; -``` - -Defined in: [derived.ts:40](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L40) - -`undefined` if it's the first run diff --git a/docs/reference/interfaces/DerivedOptions.md b/docs/reference/interfaces/DerivedOptions.md deleted file mode 100644 index 584b4fd8..00000000 --- a/docs/reference/interfaces/DerivedOptions.md +++ /dev/null @@ -1,96 +0,0 @@ ---- -id: DerivedOptions -title: DerivedOptions ---- - -# Interface: DerivedOptions\ - -Defined in: [derived.ts:45](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L45) - -## Type Parameters - -### TState - -`TState` - -### TArr - -`TArr` *extends* `ReadonlyArray`\< - \| [`Derived`](../classes/Derived.md)\<`any`\> - \| [`Store`](../classes/Store.md)\<`any`\>\> = `ReadonlyArray`\<`any`\> - -## Properties - -### deps - -```ts -deps: TArr; -``` - -Defined in: [derived.ts:54](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L54) - -*** - -### fn() - -```ts -fn: (props) => TState; -``` - -Defined in: [derived.ts:58](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L58) - -Values of the `deps` from before and after the current invocation of `fn` - -#### Parameters - -##### props - -[`DerivedFnProps`](DerivedFnProps.md)\<`TArr`\> - -#### Returns - -`TState` - -*** - -### onSubscribe()? - -```ts -optional onSubscribe: (listener, derived) => () => void; -``` - -Defined in: [derived.ts:49](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L49) - -#### Parameters - -##### listener - -`Listener`\<`TState`\> - -##### derived - -[`Derived`](../classes/Derived.md)\<`TState`\> - -#### Returns - -```ts -(): void; -``` - -##### Returns - -`void` - -*** - -### onUpdate()? - -```ts -optional onUpdate: () => void; -``` - -Defined in: [derived.ts:53](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L53) - -#### Returns - -`void` diff --git a/docs/reference/interfaces/InternalBaseAtom.md b/docs/reference/interfaces/InternalBaseAtom.md new file mode 100644 index 00000000..b2716e81 --- /dev/null +++ b/docs/reference/interfaces/InternalBaseAtom.md @@ -0,0 +1,88 @@ +--- +id: InternalBaseAtom +title: InternalBaseAtom +--- + +# Interface: InternalBaseAtom\ + +Defined in: [types.ts:35](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L35) + +## Extends + +- [`Subscribable`](Subscribable.md)\<`T`\>.[`Readable`](Readable.md)\<`T`\> + +## Extended by + +- [`InternalReadonlyAtom`](InternalReadonlyAtom.md) + +## Type Parameters + +### T + +`T` + +## Properties + +### \_snapshot + +```ts +_snapshot: T; +``` + +Defined in: [types.ts:37](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L37) + +**`Internal`** + +*** + +### \_update() + +```ts +_update: (getValue?) => boolean; +``` + +Defined in: [types.ts:39](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L39) + +**`Internal`** + +#### Parameters + +##### getValue? + +`T` | (`snapshot`) => `T` + +#### Returns + +`boolean` + +*** + +### get() + +```ts +get: () => T; +``` + +Defined in: [types.ts:30](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L30) + +#### Returns + +`T` + +#### Inherited from + +[`Readable`](Readable.md).[`get`](Readable.md#get) + +*** + +### subscribe + +```ts +subscribe: (observer) => Subscription & (next, error?, complete?) => Subscription; +``` + +Defined in: [types.ts:21](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L21) + +#### Inherited from + +[`Subscribable`](Subscribable.md).[`subscribe`](Subscribable.md#subscribe) diff --git a/docs/reference/interfaces/InternalReadonlyAtom.md b/docs/reference/interfaces/InternalReadonlyAtom.md new file mode 100644 index 00000000..c4b92f33 --- /dev/null +++ b/docs/reference/interfaces/InternalReadonlyAtom.md @@ -0,0 +1,172 @@ +--- +id: InternalReadonlyAtom +title: InternalReadonlyAtom +--- + +# Interface: InternalReadonlyAtom\ + +Defined in: [types.ts:53](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L53) + +## Extends + +- [`InternalBaseAtom`](InternalBaseAtom.md)\<`T`\>.`ReactiveNode` + +## Type Parameters + +### T + +`T` + +## Properties + +### \_snapshot + +```ts +_snapshot: T; +``` + +Defined in: [types.ts:37](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L37) + +**`Internal`** + +#### Inherited from + +[`InternalBaseAtom`](InternalBaseAtom.md).[`_snapshot`](InternalBaseAtom.md#_snapshot) + +*** + +### \_update() + +```ts +_update: (getValue?) => boolean; +``` + +Defined in: [types.ts:39](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L39) + +**`Internal`** + +#### Parameters + +##### getValue? + +`T` | (`snapshot`) => `T` + +#### Returns + +`boolean` + +#### Inherited from + +[`InternalBaseAtom`](InternalBaseAtom.md).[`_update`](InternalBaseAtom.md#_update) + +*** + +### deps? + +```ts +optional deps: Link; +``` + +Defined in: [alien.ts:6](https://github.com/TanStack/store/blob/main/packages/store/src/alien.ts#L6) + +#### Inherited from + +```ts +ReactiveNode.deps +``` + +*** + +### depsTail? + +```ts +optional depsTail: Link; +``` + +Defined in: [alien.ts:7](https://github.com/TanStack/store/blob/main/packages/store/src/alien.ts#L7) + +#### Inherited from + +```ts +ReactiveNode.depsTail +``` + +*** + +### flags + +```ts +flags: ReactiveFlags; +``` + +Defined in: [alien.ts:10](https://github.com/TanStack/store/blob/main/packages/store/src/alien.ts#L10) + +#### Inherited from + +```ts +ReactiveNode.flags +``` + +*** + +### get() + +```ts +get: () => T; +``` + +Defined in: [types.ts:30](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L30) + +#### Returns + +`T` + +#### Inherited from + +[`InternalBaseAtom`](InternalBaseAtom.md).[`get`](InternalBaseAtom.md#get) + +*** + +### subs? + +```ts +optional subs: Link; +``` + +Defined in: [alien.ts:8](https://github.com/TanStack/store/blob/main/packages/store/src/alien.ts#L8) + +#### Inherited from + +```ts +ReactiveNode.subs +``` + +*** + +### subscribe + +```ts +subscribe: (observer) => Subscription & (next, error?, complete?) => Subscription; +``` + +Defined in: [types.ts:21](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L21) + +#### Inherited from + +[`InternalBaseAtom`](InternalBaseAtom.md).[`subscribe`](InternalBaseAtom.md#subscribe) + +*** + +### subsTail? + +```ts +optional subsTail: Link; +``` + +Defined in: [alien.ts:9](https://github.com/TanStack/store/blob/main/packages/store/src/alien.ts#L9) + +#### Inherited from + +```ts +ReactiveNode.subsTail +``` diff --git a/docs/reference/interfaces/InteropSubscribable.md b/docs/reference/interfaces/InteropSubscribable.md new file mode 100644 index 00000000..45c4cea3 --- /dev/null +++ b/docs/reference/interfaces/InteropSubscribable.md @@ -0,0 +1,38 @@ +--- +id: InteropSubscribable +title: InteropSubscribable +--- + +# Interface: InteropSubscribable\ + +Defined in: [types.ts:5](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L5) + +## Extended by + +- [`Subscribable`](Subscribable.md) + +## Type Parameters + +### T + +`T` + +## Properties + +### subscribe() + +```ts +subscribe: (observer) => Subscription; +``` + +Defined in: [types.ts:6](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L6) + +#### Parameters + +##### observer + +[`Observer`](../type-aliases/Observer.md)\<`T`\> + +#### Returns + +[`Subscription`](Subscription.md) diff --git a/docs/reference/interfaces/Readable.md b/docs/reference/interfaces/Readable.md new file mode 100644 index 00000000..96f344b1 --- /dev/null +++ b/docs/reference/interfaces/Readable.md @@ -0,0 +1,51 @@ +--- +id: Readable +title: Readable +--- + +# Interface: Readable\ + +Defined in: [types.ts:29](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L29) + +## Extends + +- [`Subscribable`](Subscribable.md)\<`T`\> + +## Extended by + +- [`BaseAtom`](BaseAtom.md) +- [`InternalBaseAtom`](InternalBaseAtom.md) + +## Type Parameters + +### T + +`T` + +## Properties + +### get() + +```ts +get: () => T; +``` + +Defined in: [types.ts:30](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L30) + +#### Returns + +`T` + +*** + +### subscribe + +```ts +subscribe: (observer) => Subscription & (next, error?, complete?) => Subscription; +``` + +Defined in: [types.ts:21](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L21) + +#### Inherited from + +[`Subscribable`](Subscribable.md).[`subscribe`](Subscribable.md#subscribe) diff --git a/docs/reference/interfaces/ReadonlyAtom.md b/docs/reference/interfaces/ReadonlyAtom.md new file mode 100644 index 00000000..2aeaa860 --- /dev/null +++ b/docs/reference/interfaces/ReadonlyAtom.md @@ -0,0 +1,60 @@ +--- +id: ReadonlyAtom +title: ReadonlyAtom +--- + +# Interface: ReadonlyAtom\ + +Defined in: [types.ts:67](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L67) + +An atom that is read-only and cannot be set. + +## Example + +```ts +const atom = createAtom(() => 42); +// @ts-expect-error - Cannot set a readonly atom +atom.set(43); +``` + +## Extends + +- [`BaseAtom`](BaseAtom.md)\<`T`\> + +## Type Parameters + +### T + +`T` + +## Properties + +### get() + +```ts +get: () => T; +``` + +Defined in: [types.ts:30](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L30) + +#### Returns + +`T` + +#### Inherited from + +[`BaseAtom`](BaseAtom.md).[`get`](BaseAtom.md#get) + +*** + +### subscribe + +```ts +subscribe: (observer) => Subscription & (next, error?, complete?) => Subscription; +``` + +Defined in: [types.ts:21](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L21) + +#### Inherited from + +[`BaseAtom`](BaseAtom.md).[`subscribe`](BaseAtom.md#subscribe) diff --git a/docs/reference/interfaces/StoreOptions.md b/docs/reference/interfaces/StoreOptions.md deleted file mode 100644 index c20094c3..00000000 --- a/docs/reference/interfaces/StoreOptions.md +++ /dev/null @@ -1,102 +0,0 @@ ---- -id: StoreOptions -title: StoreOptions ---- - -# Interface: StoreOptions\ - -Defined in: [store.ts:5](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L5) - -## Type Parameters - -### TState - -`TState` - -### TUpdater - -`TUpdater` *extends* `AnyUpdater` = (`cb`) => `TState` - -## Properties - -### onSubscribe()? - -```ts -optional onSubscribe: (listener, store) => () => void; -``` - -Defined in: [store.ts:18](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L18) - -Called when a listener subscribes to the store. - -#### Parameters - -##### listener - -`Listener`\<`TState`\> - -##### store - -[`Store`](../classes/Store.md)\<`TState`, `TUpdater`\> - -#### Returns - -a function to unsubscribe the listener - -```ts -(): void; -``` - -##### Returns - -`void` - -*** - -### onUpdate()? - -```ts -optional onUpdate: () => void; -``` - -Defined in: [store.ts:25](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L25) - -Called after the state has been updated, used to derive other state. - -#### Returns - -`void` - -*** - -### updateFn()? - -```ts -optional updateFn: (previous) => (updater) => TState; -``` - -Defined in: [store.ts:12](https://github.com/TanStack/store/blob/main/packages/store/src/store.ts#L12) - -Replace the default update function with a custom one. - -#### Parameters - -##### previous - -`TState` - -#### Returns - -```ts -(updater): TState; -``` - -##### Parameters - -###### updater - -`TUpdater` - -##### Returns - -`TState` diff --git a/docs/reference/interfaces/Subscribable.md b/docs/reference/interfaces/Subscribable.md new file mode 100644 index 00000000..0857be0c --- /dev/null +++ b/docs/reference/interfaces/Subscribable.md @@ -0,0 +1,38 @@ +--- +id: Subscribable +title: Subscribable +--- + +# Interface: Subscribable\ + +Defined in: [types.ts:20](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L20) + +## Extends + +- [`InteropSubscribable`](InteropSubscribable.md)\<`T`\> + +## Extended by + +- [`Readable`](Readable.md) +- [`BaseAtom`](BaseAtom.md) +- [`InternalBaseAtom`](InternalBaseAtom.md) + +## Type Parameters + +### T + +`T` + +## Properties + +### subscribe + +```ts +subscribe: (observer) => Subscription & (next, error?, complete?) => Subscription; +``` + +Defined in: [types.ts:21](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L21) + +#### Overrides + +[`InteropSubscribable`](InteropSubscribable.md).[`subscribe`](InteropSubscribable.md#subscribe) diff --git a/docs/reference/interfaces/Subscription.md b/docs/reference/interfaces/Subscription.md new file mode 100644 index 00000000..5ddc5fba --- /dev/null +++ b/docs/reference/interfaces/Subscription.md @@ -0,0 +1,22 @@ +--- +id: Subscription +title: Subscription +--- + +# Interface: Subscription + +Defined in: [types.ts:16](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L16) + +## Properties + +### unsubscribe() + +```ts +unsubscribe: () => void; +``` + +Defined in: [types.ts:17](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L17) + +#### Returns + +`void` diff --git a/docs/reference/type-aliases/AnyAtom.md b/docs/reference/type-aliases/AnyAtom.md new file mode 100644 index 00000000..d41e125c --- /dev/null +++ b/docs/reference/type-aliases/AnyAtom.md @@ -0,0 +1,12 @@ +--- +id: AnyAtom +title: AnyAtom +--- + +# Type Alias: AnyAtom + +```ts +type AnyAtom = BaseAtom; +``` + +Defined in: [types.ts:51](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L51) diff --git a/docs/reference/type-aliases/Observer.md b/docs/reference/type-aliases/Observer.md new file mode 100644 index 00000000..47cd75dd --- /dev/null +++ b/docs/reference/type-aliases/Observer.md @@ -0,0 +1,72 @@ +--- +id: Observer +title: Observer +--- + +# Type Alias: Observer\ + +```ts +type Observer = object; +``` + +Defined in: [types.ts:10](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L10) + +## Type Parameters + +### T + +`T` + +## Properties + +### complete()? + +```ts +optional complete: () => void; +``` + +Defined in: [types.ts:13](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L13) + +#### Returns + +`void` + +*** + +### error()? + +```ts +optional error: (err) => void; +``` + +Defined in: [types.ts:12](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L12) + +#### Parameters + +##### err + +`unknown` + +#### Returns + +`void` + +*** + +### next()? + +```ts +optional next: (value) => void; +``` + +Defined in: [types.ts:11](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L11) + +#### Parameters + +##### value + +`T` + +#### Returns + +`void` diff --git a/docs/reference/type-aliases/Selection.md b/docs/reference/type-aliases/Selection.md new file mode 100644 index 00000000..484ad187 --- /dev/null +++ b/docs/reference/type-aliases/Selection.md @@ -0,0 +1,18 @@ +--- +id: Selection +title: Selection +--- + +# Type Alias: Selection\ + +```ts +type Selection = Readable; +``` + +Defined in: [types.ts:3](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L3) + +## Type Parameters + +### TSelected + +`TSelected` diff --git a/docs/reference/type-aliases/UnwrapDerivedOrStore.md b/docs/reference/type-aliases/UnwrapDerivedOrStore.md deleted file mode 100644 index c2430f0f..00000000 --- a/docs/reference/type-aliases/UnwrapDerivedOrStore.md +++ /dev/null @@ -1,18 +0,0 @@ ---- -id: UnwrapDerivedOrStore -title: UnwrapDerivedOrStore ---- - -# Type Alias: UnwrapDerivedOrStore\ - -```ts -type UnwrapDerivedOrStore = T extends Derived ? InnerD : T extends Store ? InnerS : never; -``` - -Defined in: [derived.ts:5](https://github.com/TanStack/store/blob/main/packages/store/src/derived.ts#L5) - -## Type Parameters - -### T - -`T` diff --git a/docs/reference/type-aliases/Updater.md b/docs/reference/type-aliases/Updater.md deleted file mode 100644 index 16a9300e..00000000 --- a/docs/reference/type-aliases/Updater.md +++ /dev/null @@ -1,20 +0,0 @@ ---- -id: Updater -title: Updater ---- - -# Type Alias: Updater\ - -```ts -type Updater = (prev) => T | T; -``` - -Defined in: [types.ts:9](https://github.com/TanStack/store/blob/main/packages/store/src/types.ts#L9) - -Type-safe updater that can be either a function or direct value - -## Type Parameters - -### T - -`T` diff --git a/docs/reference/variables/depsThatHaveWrittenThisTick.md b/docs/reference/variables/depsThatHaveWrittenThisTick.md deleted file mode 100644 index c48d0df0..00000000 --- a/docs/reference/variables/depsThatHaveWrittenThisTick.md +++ /dev/null @@ -1,22 +0,0 @@ ---- -id: __depsThatHaveWrittenThisTick -title: __depsThatHaveWrittenThisTick ---- - -# Variable: \_\_depsThatHaveWrittenThisTick - -```ts -const __depsThatHaveWrittenThisTick: object; -``` - -Defined in: [scheduler.ts:28](https://github.com/TanStack/store/blob/main/packages/store/src/scheduler.ts#L28) - -## Type Declaration - -### current - -```ts -current: ( - | Derived - | Store unknown>)[]; -``` diff --git a/docs/reference/variables/derivedToStore.md b/docs/reference/variables/derivedToStore.md deleted file mode 100644 index b24d5859..00000000 --- a/docs/reference/variables/derivedToStore.md +++ /dev/null @@ -1,12 +0,0 @@ ---- -id: __derivedToStore -title: __derivedToStore ---- - -# Variable: \_\_derivedToStore - -```ts -const __derivedToStore: WeakMap, Set unknown>>>; -``` - -Defined in: [scheduler.ts:23](https://github.com/TanStack/store/blob/main/packages/store/src/scheduler.ts#L23) diff --git a/docs/reference/variables/storeToDerived.md b/docs/reference/variables/storeToDerived.md deleted file mode 100644 index 6c18cf96..00000000 --- a/docs/reference/variables/storeToDerived.md +++ /dev/null @@ -1,26 +0,0 @@ ---- -id: __storeToDerived -title: __storeToDerived ---- - -# Variable: \_\_storeToDerived - -```ts -const __storeToDerived: WeakMap unknown>, Derived[]>; -``` - -Defined in: [scheduler.ts:19](https://github.com/TanStack/store/blob/main/packages/store/src/scheduler.ts#L19) - -This is here to solve the pyramid dependency problem where: - A - / \ - B C - \ / - D - -Where we deeply traverse this tree, how do we avoid D being recomputed twice; once when B is updated, once when C is. - -To solve this, we create linkedDeps that allows us to sync avoid writes to the state until all of the deps have been -resolved. - -This is a record of stores, because derived stores are not able to write values to, but stores are diff --git a/eslint.config.js b/eslint.config.js index ff189dd2..fe12570d 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -1,5 +1,6 @@ // @ts-check import { tanstackConfig } from '@tanstack/eslint-config' +import { defineConfig } from 'eslint/config' -export default [...tanstackConfig] +export default defineConfig([...tanstackConfig]) diff --git a/examples/angular/simple/package.json b/examples/angular/simple/package.json index 1dc85490..39d1f53b 100644 --- a/examples/angular/simple/package.json +++ b/examples/angular/simple/package.json @@ -10,22 +10,22 @@ "test": "ng test" }, "dependencies": { - "@angular/animations": "^19.2.15", - "@angular/common": "^19.2.15", - "@angular/compiler": "^19.2.15", - "@angular/core": "^19.2.15", - "@angular/platform-browser": "^19.2.15", - "@angular/platform-browser-dynamic": "^19.2.15", - "@angular/router": "^19.2.15", + "@angular/animations": "^21.1.2", + "@angular/common": "^21.1.2", + "@angular/compiler": "^21.1.2", + "@angular/core": "^21.1.2", + "@angular/platform-browser": "^21.1.2", + "@angular/platform-browser-dynamic": "^21.1.2", + "@angular/router": "^21.1.2", "@tanstack/angular-store": "^0.8.0", "rxjs": "^7.8.2", "tslib": "^2.8.1", "zone.js": "^0.15.1" }, "devDependencies": { - "@angular-devkit/build-angular": "^19.2.17", - "@angular/cli": "^19.2.17", - "@angular/compiler-cli": "^19.2.15", - "typescript": "5.6.3" + "@angular-devkit/build-angular": "^21.1.0", + "@angular/cli": "^21.1.0", + "@angular/compiler-cli": "^21.1.2", + "typescript": "^5.9.0" } } diff --git a/examples/react/simple/src/index.tsx b/examples/react/simple/src/index.tsx index cbf83568..2ace1a6e 100644 --- a/examples/react/simple/src/index.tsx +++ b/examples/react/simple/src/index.tsx @@ -1,6 +1,6 @@ import { scan } from 'react-scan' // dev-tools for demo import ReactDOM from 'react-dom/client' -import { Store, useStore } from '@tanstack/react-store' +import { Store, useSelector } from '@tanstack/react-store' // You can use instantiate a Store outside of React components too! export const store = new Store({ @@ -14,12 +14,12 @@ interface DisplayProps { // This will only re-render when `state[animal]` changes. If an unrelated store property changes, it won't re-render const Display = ({ animal }: DisplayProps) => { - const count = useStore(store, (state) => state[animal]) + const count = useSelector(store, (state) => state[animal]) return
{`${animal}: ${count}`}
} const updateState = (animal: 'dogs' | 'cats') => { - store.setState((state) => { + store.setState((state: { dogs: number; cats: number }) => { return { ...state, [animal]: state[animal] + 1, diff --git a/knip.json b/knip.json index bee8234c..f5ccede8 100644 --- a/knip.json +++ b/knip.json @@ -6,5 +6,6 @@ } }, "ignoreDependencies": ["vue"], - "ignoreWorkspaces": ["examples/**"] + "ignoreWorkspaces": ["examples/**"], + "ignore": ["packages/store/src/alien.ts"] } diff --git a/package.json b/package.json index 5af6e0cf..e750921d 100644 --- a/package.json +++ b/package.json @@ -42,13 +42,13 @@ "@changesets/cli": "^2.29.8", "@eslint-react/eslint-plugin": "^1.53.1", "@svitejs/changesets-changelog-github-compact": "^1.2.0", - "@tanstack/eslint-config": "0.3.3", + "@tanstack/eslint-config": "0.3.4", "@tanstack/typedoc-config": "0.3.1", "@tanstack/vite-config": "0.4.1", "@testing-library/jest-dom": "^6.9.1", "@testing-library/user-event": "^14.6.1", - "@types/node": "^24.1.0", - "@vitest/coverage-istanbul": "^3.2.4", + "@types/node": "^25.2.1", + "@vitest/coverage-istanbul": "^4.0.18", "eslint": "^9.37.0", "eslint-plugin-react-hooks": "^5.2.0", "jsdom": "^25.0.1", @@ -61,13 +61,12 @@ "publint": "^0.3.15", "sherif": "^1.9.0", "tinyglobby": "^0.2.15", - "typescript": "5.6.3", - "typescript50": "npm:typescript@5.0", - "typescript51": "npm:typescript@5.1", - "typescript52": "npm:typescript@5.2", - "typescript53": "npm:typescript@5.3", - "vite": "^6.3.6", - "vitest": "^3.2.4", + "typescript": "5.9.3", + "typescript56": "npm:typescript@5.6", + "typescript57": "npm:typescript@5.7", + "typescript58": "npm:typescript@5.8", + "vite": "^7.3.1", + "vitest": "^4.0.18", "vue": "^3.5.22" }, "overrides": { @@ -78,5 +77,22 @@ "@tanstack/store": "workspace:*", "@tanstack/svelte-store": "workspace:*", "@tanstack/vue-store": "workspace:*" + }, + "pnpm": { + "overrides": { + "@types/node": "25.2.1" + }, + "packageExtensions": { + "@vue/composition-api": { + "peerDependencies": { + "vue": ">= 2.5" + } + } + } + }, + "sherif": { + "ignorePackage": [ + "./examples/*" + ] } } diff --git a/packages/angular-store/eslint.config.js b/packages/angular-store/eslint.config.js index 8ce6ad05..6f7e1f4a 100644 --- a/packages/angular-store/eslint.config.js +++ b/packages/angular-store/eslint.config.js @@ -1,5 +1,6 @@ // @ts-check +import { defineConfig } from 'eslint/config' import rootConfig from '../../eslint.config.js' -export default [...rootConfig] +export default defineConfig([...rootConfig]) diff --git a/packages/angular-store/package.json b/packages/angular-store/package.json index cde42aad..86210d57 100644 --- a/packages/angular-store/package.json +++ b/packages/angular-store/package.json @@ -26,7 +26,7 @@ "test:types": "tsc", "test:lib": "vitest", "test:lib:dev": "pnpm run test:lib --watch", - "test:build": "publint --strict", + "test:build": "nx run @tanstack/angular-store:build && publint --strict", "build": "ng-packagr -p ng-package.json -c tsconfig.build.json && premove ./dist/package.json" }, "type": "module", @@ -51,14 +51,14 @@ "tslib": "^2.8.1" }, "devDependencies": { - "@analogjs/vite-plugin-angular": "^1.21.2", - "@angular/common": "^19.2.15", - "@angular/compiler": "^19.2.15", - "@angular/compiler-cli": "^19.2.15", - "@angular/core": "^19.2.15", - "@angular/platform-browser": "^19.2.15", - "@angular/platform-browser-dynamic": "^19.2.15", - "ng-packagr": "^19.2.2", + "@analogjs/vite-plugin-angular": "^2.2.3", + "@angular/common": "^21.1.2", + "@angular/compiler": "^21.1.2", + "@angular/compiler-cli": "^21.1.2", + "@angular/core": "^21.1.2", + "@angular/platform-browser": "^21.1.2", + "@angular/platform-browser-dynamic": "^21.1.2", + "ng-packagr": "^21.1.0", "zone.js": "^0.15.1" }, "peerDependencies": { diff --git a/packages/angular-store/src/index.ts b/packages/angular-store/src/index.ts index 130120a4..746bfed2 100644 --- a/packages/angular-store/src/index.ts +++ b/packages/angular-store/src/index.ts @@ -6,29 +6,30 @@ import { linkedSignal, runInInjectionContext, } from '@angular/core' -import type { Derived, Store } from '@tanstack/store' +import type { Atom, ReadonlyAtom } from '@tanstack/store' import type { CreateSignalOptions, Signal } from '@angular/core' -export * from '@tanstack/store' +type StoreContext = Record -/** - * @private - */ -type NoInfer = [T][T extends any ? 0 : never] +export * from '@tanstack/store' export function injectStore>( - store: Store, + store: Atom, selector?: (state: NoInfer) => TSelected, options?: CreateSignalOptions & { injector?: Injector }, ): Signal export function injectStore>( - store: Derived, + store: Atom | ReadonlyAtom, selector?: (state: NoInfer) => TSelected, options?: CreateSignalOptions & { injector?: Injector }, ): Signal -export function injectStore>( - store: Store | Derived, - selector: (state: NoInfer) => TSelected = (d) => d as TSelected, +export function injectStore< + TState extends StoreContext, + TSelected = NoInfer, +>( + store: Atom | ReadonlyAtom, + selector: (state: NoInfer) => TSelected = (d) => + d as unknown as TSelected, options: CreateSignalOptions & { injector?: Injector } = { equal: shallow, }, @@ -41,10 +42,10 @@ export function injectStore>( return runInInjectionContext(options.injector, () => { const destroyRef = inject(DestroyRef) - const slice = linkedSignal(() => selector(store.state), options) + const slice = linkedSignal(() => selector(store.get()), options) - const unsubscribe = store.subscribe(() => { - slice.set(selector(store.state)) + const { unsubscribe } = store.subscribe((s) => { + slice.set(selector(s)) }) destroyRef.onDestroy(() => { @@ -95,10 +96,10 @@ function shallow(objA: T, objB: T) { return false } - for (let i = 0; i < keysA.length; i++) { + for (const key of keysA) { if ( - !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) || - !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T]) + !Object.prototype.hasOwnProperty.call(objB, key) || + !Object.is(objA[key as keyof T], objB[key as keyof T]) ) { return false } diff --git a/packages/angular-store/tests/index.test.ts b/packages/angular-store/tests/index.test.ts index 17c5e465..88da8df7 100644 --- a/packages/angular-store/tests/index.test.ts +++ b/packages/angular-store/tests/index.test.ts @@ -2,12 +2,12 @@ import { describe, expect, test } from 'vitest' import { Component, effect } from '@angular/core' import { TestBed } from '@angular/core/testing' import { By } from '@angular/platform-browser' -import { Store } from '@tanstack/store' +import { createStore } from '@tanstack/store' import { injectStore } from '../src/index' describe('injectStore', () => { test(`allows us to select state using a selector`, () => { - const store = new Store({ select: 0, ignored: 1 }) + const store = createStore({ select: 0, ignored: 1 }) @Component({ template: `

Store: {{ storeVal() }}

`, @@ -25,7 +25,7 @@ describe('injectStore', () => { }) test('only triggers a re-render when selector state is updated', () => { - const store = new Store({ select: 0, ignored: 1 }) + const store = createStore({ select: 0, ignored: 1 }) let count = 0 @Component({ @@ -96,7 +96,7 @@ describe('injectStore', () => { describe('dataType', () => { test('date change trigger re-render', () => { - const store = new Store({ date: new Date('2025-03-29T21:06:30.401Z') }) + const store = createStore({ date: new Date('2025-03-29T21:06:30.401Z') }) @Component({ template: ` diff --git a/packages/angular-store/tests/test.test-d.ts b/packages/angular-store/tests/test.test-d.ts index 414ae52b..430a75a7 100644 --- a/packages/angular-store/tests/test.test-d.ts +++ b/packages/angular-store/tests/test.test-d.ts @@ -1,20 +1,16 @@ import { expectTypeOf, test } from 'vitest' -import { Derived, Store, injectStore } from '../src' +import { createStore } from '@tanstack/store' +import { injectStore } from '../src' import type { Signal } from '@angular/core' test('injectStore works with derived state', () => { - const store = new Store(12) - const derived = new Derived({ - deps: [store], - fn: () => { - return { val: store.state * 2 } - }, - }) + const store = createStore(12) + const derived = createStore(() => store.state * 2) const val = injectStore(derived, (state) => { - expectTypeOf(state).toMatchTypeOf<{ val: number }>() - return state.val + expectTypeOf(state).toEqualTypeOf() + return state }) - expectTypeOf(val).toMatchTypeOf>() + expectTypeOf(val).toEqualTypeOf>() }) diff --git a/packages/angular-store/tsconfig.build.json b/packages/angular-store/tsconfig.build.json index e63b08e7..287a29c5 100644 --- a/packages/angular-store/tsconfig.build.json +++ b/packages/angular-store/tsconfig.build.json @@ -1,5 +1,5 @@ { - "extends": "./node_modules/ng-packagr/lib/ts/conf/tsconfig.ngc.json", + "extends": "./node_modules/ng-packagr/src/lib/ts/conf/tsconfig.ngc.json", "compilerOptions": { "allowJs": true, "module": "ESNext", diff --git a/packages/preact-store/eslint.config.js b/packages/preact-store/eslint.config.js index c7ee4fe2..0c53c13d 100644 --- a/packages/preact-store/eslint.config.js +++ b/packages/preact-store/eslint.config.js @@ -1,12 +1,13 @@ // @ts-check +import { defineConfig } from 'eslint/config' // @ts-ignore: no types for eslint-config-preact import preact from 'eslint-config-preact' import rootConfig from '../../eslint.config.js' // eslint-config-preact uses typescript-eslint under the hood import tseslint from 'typescript-eslint' -export default [ +export default defineConfig([ ...rootConfig, ...preact, { @@ -27,4 +28,4 @@ export default [ '@typescript-eslint/no-redeclare': 'error', }, }, -] +]) diff --git a/packages/preact-store/package.json b/packages/preact-store/package.json index 8d883450..a5a8120b 100644 --- a/packages/preact-store/package.json +++ b/packages/preact-store/package.json @@ -23,11 +23,10 @@ "clean": "premove ./dist ./coverage", "test:eslint": "eslint ./src ./tests", "test:types": "pnpm run \"/^test:types:ts[0-9]{2}$/\"", - "test:types:ts50": "node ../../node_modules/typescript50/lib/tsc.js", - "test:types:ts51": "node ../../node_modules/typescript51/lib/tsc.js", - "test:types:ts52": "node ../../node_modules/typescript52/lib/tsc.js", - "test:types:ts53": "node ../../node_modules/typescript53/lib/tsc.js", - "test:types:ts54": "tsc", + "test:types:ts56": "node ../../node_modules/typescript56/lib/tsc.js", + "test:types:ts57": "node ../../node_modules/typescript57/lib/tsc.js", + "test:types:ts58": "node ../../node_modules/typescript58/lib/tsc.js", + "test:types:ts59": "tsc", "test:lib": "vitest", "test:lib:dev": "pnpm run test:lib --watch", "test:build": "publint --strict", @@ -65,7 +64,7 @@ "jsdom": "^25.0.1", "preact": "^10.27.2", "typescript-eslint": "^8.48.0", - "vitest": "^3.2.4" + "vitest": "^4.0.18" }, "peerDependencies": { "preact": "^10.0.0" diff --git a/packages/preact-store/src/index.ts b/packages/preact-store/src/index.ts index 7b2c5bcc..c4572691 100644 --- a/packages/preact-store/src/index.ts +++ b/packages/preact-store/src/index.ts @@ -1,5 +1,5 @@ import { useEffect, useLayoutEffect, useRef, useState } from 'preact/hooks' -import type { Derived, Store } from '@tanstack/store' +import type { Atom, ReadonlyAtom } from '@tanstack/store' export * from '@tanstack/store' @@ -67,10 +67,6 @@ function didSnapshotChange(inst: { } } -/** - * @private - */ -export type NoInfer = [T][T extends any ? 0 : never] type EqualityFn = (objA: T, objB: T) => boolean interface UseStoreOptions { equal?: EqualityFn @@ -102,24 +98,14 @@ function useSyncExternalStoreWithSelector( } export function useStore>( - store: Store, - selector?: (state: NoInfer) => TSelected, - options?: UseStoreOptions, -): TSelected -export function useStore>( - store: Derived, - selector?: (state: NoInfer) => TSelected, - options?: UseStoreOptions, -): TSelected -export function useStore>( - store: Store | Derived, + store: Atom | ReadonlyAtom, selector: (state: NoInfer) => TSelected = (d) => d as any, options: UseStoreOptions = {}, ): TSelected { const equal = options.equal ?? shallow const slice = useSyncExternalStoreWithSelector( - store.subscribe, - () => store.state, + (onStoreChange) => store.subscribe(onStoreChange).unsubscribe, + () => store.get(), selector, equal, ) diff --git a/packages/preact-store/tests/index.test.tsx b/packages/preact-store/tests/index.test.tsx index 06315d51..8012ddf9 100644 --- a/packages/preact-store/tests/index.test.tsx +++ b/packages/preact-store/tests/index.test.tsx @@ -1,15 +1,14 @@ import { describe, expect, it, test, vi } from 'vitest' import { render, waitFor } from '@testing-library/preact' -import { Derived, Store } from '@tanstack/store' -import { useState } from 'preact/hooks' import { userEvent } from '@testing-library/user-event' +import { createStore } from '@tanstack/store' import { shallow, useStore } from '../src/index' const user = userEvent.setup() describe('useStore', () => { it('allows us to select state using a selector', () => { - const store = new Store({ + const store = createStore({ select: 0, ignored: 1, }) @@ -26,19 +25,19 @@ describe('useStore', () => { // This should ideally test the custom uSES hook it('only triggers a re-render when selector state is updated', async () => { - const store = new Store({ + const store = createStore({ select: 0, ignored: 1, }) + const renderSpy = vi.fn() function Comp() { const storeVal = useStore(store, (state) => state.select) - const [fn] = useState(vi.fn) - fn() + renderSpy() return (
-

Number rendered: {fn.mock.calls.length}

+

Number rendered: {renderSpy.mock.calls.length}

Store: {storeVal}