From 92257f05d5dc063d34940042d75f7eea083e7e55 Mon Sep 17 00:00:00 2001 From: jer3m01 Date: Wed, 12 Aug 2026 00:54:31 +0200 Subject: [PATCH 1/2] chore: redirect solid v2 to external --- vite.config.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/vite.config.ts b/vite.config.ts index a810bb534..aea798a21 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -63,12 +63,13 @@ export default defineConfig({ latest: { path: "", label: "Latest" }, v2: { path: "v2", label: "v2" }, v1: { path: "v1", label: "v1" }, + solid_v2_external: { href: "https://v2.solidjs.com", label: "v2" }, }, }, include: [ { project: "solid", - version: ["latest", "v2"], + version: ["latest", "solid_v2_external"], }, { project: "start", From 684b03d29348a8cfba65a4dd0d2780bdbc35895e Mon Sep 17 00:00:00 2001 From: jer3m01 Date: Wed, 12 Aug 2026 00:55:58 +0200 Subject: [PATCH 2/2] chore: delete solid v2 content --- src/routes/v2/(0)index.mdx | 30 --- src/routes/v2/(1)getting-started.mdx | 28 --- .../reference/(1)reactivity/create-effect.mdx | 185 -------------- .../reference/(1)reactivity/create-memo.mdx | 192 -------------- .../(1)reactivity/create-optimistic.mdx | 80 ------ .../reference/(1)reactivity/create-signal.mdx | 211 ---------------- .../v2/reference/(1)reactivity/flush.mdx | 63 ----- .../v2/reference/(1)reactivity/is-pending.mdx | 51 ---- .../v2/reference/(1)reactivity/latest.mdx | 48 ---- .../v2/reference/(1)reactivity/untrack.mdx | 53 ---- .../(2)stores/create-optimistic-store.mdx | 100 -------- .../reference/(2)stores/create-projection.mdx | 133 ---------- .../v2/reference/(2)stores/create-store.mdx | 183 -------------- src/routes/v2/reference/(2)stores/merge.mdx | 63 ----- src/routes/v2/reference/(2)stores/omit.mdx | 75 ------ .../v2/reference/(2)stores/reconcile.mdx | 63 ----- .../reference/(3)lifecycle-actions/action.mdx | 70 ------ .../(3)lifecycle-actions/on-settled.mdx | 120 --------- .../(3)lifecycle-actions/refresh.mdx | 52 ---- .../(4)components-context/children.mdx | 77 ------ .../(4)components-context/create-context.mdx | 114 --------- .../create-unique-id.mdx | 52 ---- .../(4)components-context/dynamic.mdx | 55 ---- .../reference/(4)components-context/lazy.mdx | 68 ----- .../(4)components-context/use-context.mdx | 82 ------ .../reference/(5)components-jsx/dynamic.mdx | 59 ----- .../reference/(5)components-jsx/errored.mdx | 55 ---- .../v2/reference/(5)components-jsx/for.mdx | 70 ------ .../reference/(5)components-jsx/loading.mdx | 70 ------ .../v2/reference/(5)components-jsx/portal.mdx | 50 ---- .../v2/reference/(5)components-jsx/repeat.mdx | 50 ---- .../v2/reference/(5)components-jsx/reveal.mdx | 109 -------- .../v2/reference/(5)components-jsx/show.mdx | 71 ------ .../(5)components-jsx/switch-and-match.mdx | 167 ------------- .../v2/reference/(6)rendering-ssr/hydrate.mdx | 34 --- .../v2/reference/(6)rendering-ssr/is-dev.mdx | 35 --- .../reference/(6)rendering-ssr/is-server.mdx | 35 --- .../(6)rendering-ssr/render-to-stream.mdx | 78 ------ .../render-to-string-async.mdx | 70 ------ .../(6)rendering-ssr/render-to-string.mdx | 70 ------ .../v2/reference/(6)rendering-ssr/render.mdx | 63 ----- .../(1)owner-introspection/create-root.mdx | 64 ----- .../(1)owner-introspection/get-observer.mdx | 50 ---- .../(1)owner-introspection/get-owner.mdx | 62 ----- .../(1)owner-introspection/is-disposed.mdx | 50 ---- .../(1)owner-introspection/run-with-owner.mdx | 53 ---- .../create-reaction.mdx | 70 ------ .../create-render-effect.mdx | 80 ------ .../create-tracked-effect.mdx | 74 ------ .../(2)specialized-reactivity/on-cleanup.mdx | 79 ------ .../(7)advanced/(3)store-advanced/deep.mdx | 53 ---- .../(3)store-advanced/is-wrappable.mdx | 52 ---- .../(3)store-advanced/snapshot.mdx | 53 ---- .../(3)store-advanced/store-path.mdx | 189 -------------- .../create-error-boundary.mdx | 65 ----- .../create-loading-boundary.mdx | 73 ------ .../create-reveal-order.mdx | 82 ------ .../(4)jsx-component-primitives/map-array.mdx | 90 ------- .../(4)jsx-component-primitives/repeat.mdx | 55 ---- .../(5)manual-hydration/hydration.mdx | 53 ---- .../(5)manual-hydration/no-hydration.mdx | 47 ---- .../enable-external-source.mdx | 117 --------- .../(7)advanced/(6)interop-async/flatten.mdx | 65 ----- .../(6)interop-async/not-ready-error.mdx | 63 ----- .../(7)advanced/(6)interop-async/resolve.mdx | 56 ----- .../(7)diagnostics-dev-hooks/dev.mdx | 235 ------------------ .../v2/reference/(8)types/component-types.mdx | 215 ---------------- .../v2/reference/(8)types/context-types.mdx | 64 ----- src/routes/v2/reference/(8)types/owner.mdx | 101 -------- .../v2/reference/(8)types/reactive-types.mdx | 102 -------- .../v2/reference/(8)types/store-types.mdx | 132 ---------- vite.config.ts | 34 +-- 72 files changed, 1 insertion(+), 5911 deletions(-) delete mode 100644 src/routes/v2/(0)index.mdx delete mode 100644 src/routes/v2/(1)getting-started.mdx delete mode 100644 src/routes/v2/reference/(1)reactivity/create-effect.mdx delete mode 100644 src/routes/v2/reference/(1)reactivity/create-memo.mdx delete mode 100644 src/routes/v2/reference/(1)reactivity/create-optimistic.mdx delete mode 100644 src/routes/v2/reference/(1)reactivity/create-signal.mdx delete mode 100644 src/routes/v2/reference/(1)reactivity/flush.mdx delete mode 100644 src/routes/v2/reference/(1)reactivity/is-pending.mdx delete mode 100644 src/routes/v2/reference/(1)reactivity/latest.mdx delete mode 100644 src/routes/v2/reference/(1)reactivity/untrack.mdx delete mode 100644 src/routes/v2/reference/(2)stores/create-optimistic-store.mdx delete mode 100644 src/routes/v2/reference/(2)stores/create-projection.mdx delete mode 100644 src/routes/v2/reference/(2)stores/create-store.mdx delete mode 100644 src/routes/v2/reference/(2)stores/merge.mdx delete mode 100644 src/routes/v2/reference/(2)stores/omit.mdx delete mode 100644 src/routes/v2/reference/(2)stores/reconcile.mdx delete mode 100644 src/routes/v2/reference/(3)lifecycle-actions/action.mdx delete mode 100644 src/routes/v2/reference/(3)lifecycle-actions/on-settled.mdx delete mode 100644 src/routes/v2/reference/(3)lifecycle-actions/refresh.mdx delete mode 100644 src/routes/v2/reference/(4)components-context/children.mdx delete mode 100644 src/routes/v2/reference/(4)components-context/create-context.mdx delete mode 100644 src/routes/v2/reference/(4)components-context/create-unique-id.mdx delete mode 100644 src/routes/v2/reference/(4)components-context/dynamic.mdx delete mode 100644 src/routes/v2/reference/(4)components-context/lazy.mdx delete mode 100644 src/routes/v2/reference/(4)components-context/use-context.mdx delete mode 100644 src/routes/v2/reference/(5)components-jsx/dynamic.mdx delete mode 100644 src/routes/v2/reference/(5)components-jsx/errored.mdx delete mode 100644 src/routes/v2/reference/(5)components-jsx/for.mdx delete mode 100644 src/routes/v2/reference/(5)components-jsx/loading.mdx delete mode 100644 src/routes/v2/reference/(5)components-jsx/portal.mdx delete mode 100644 src/routes/v2/reference/(5)components-jsx/repeat.mdx delete mode 100644 src/routes/v2/reference/(5)components-jsx/reveal.mdx delete mode 100644 src/routes/v2/reference/(5)components-jsx/show.mdx delete mode 100644 src/routes/v2/reference/(5)components-jsx/switch-and-match.mdx delete mode 100644 src/routes/v2/reference/(6)rendering-ssr/hydrate.mdx delete mode 100644 src/routes/v2/reference/(6)rendering-ssr/is-dev.mdx delete mode 100644 src/routes/v2/reference/(6)rendering-ssr/is-server.mdx delete mode 100644 src/routes/v2/reference/(6)rendering-ssr/render-to-stream.mdx delete mode 100644 src/routes/v2/reference/(6)rendering-ssr/render-to-string-async.mdx delete mode 100644 src/routes/v2/reference/(6)rendering-ssr/render-to-string.mdx delete mode 100644 src/routes/v2/reference/(6)rendering-ssr/render.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(1)owner-introspection/create-root.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(1)owner-introspection/get-observer.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(1)owner-introspection/get-owner.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(1)owner-introspection/is-disposed.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(1)owner-introspection/run-with-owner.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(2)specialized-reactivity/create-reaction.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(2)specialized-reactivity/create-render-effect.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(2)specialized-reactivity/create-tracked-effect.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(2)specialized-reactivity/on-cleanup.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(3)store-advanced/deep.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(3)store-advanced/is-wrappable.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(3)store-advanced/snapshot.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(3)store-advanced/store-path.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(4)jsx-component-primitives/create-error-boundary.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(4)jsx-component-primitives/create-loading-boundary.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(4)jsx-component-primitives/create-reveal-order.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(4)jsx-component-primitives/map-array.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(4)jsx-component-primitives/repeat.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(5)manual-hydration/hydration.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(5)manual-hydration/no-hydration.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(6)interop-async/enable-external-source.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(6)interop-async/flatten.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(6)interop-async/not-ready-error.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(6)interop-async/resolve.mdx delete mode 100644 src/routes/v2/reference/(7)advanced/(7)diagnostics-dev-hooks/dev.mdx delete mode 100644 src/routes/v2/reference/(8)types/component-types.mdx delete mode 100644 src/routes/v2/reference/(8)types/context-types.mdx delete mode 100644 src/routes/v2/reference/(8)types/owner.mdx delete mode 100644 src/routes/v2/reference/(8)types/reactive-types.mdx delete mode 100644 src/routes/v2/reference/(8)types/store-types.mdx diff --git a/src/routes/v2/(0)index.mdx b/src/routes/v2/(0)index.mdx deleted file mode 100644 index 69abb97b8..000000000 --- a/src/routes/v2/(0)index.mdx +++ /dev/null @@ -1,30 +0,0 @@ ---- -title: Overview -titleTemplate: ":title" -mainNavExclude: true -use_cases: >- - getting started, learning solid, understanding framework, first project, - introduction -tags: - - introduction - - overview - - getting-started - - basics - - framework -version: "2.0" -description: >- - Solid is a reactive JavaScript framework for building fast, efficient UIs. - Learn about fine-grained reactivity and modern web development. ---- - -:::note[Documentation is currently under construction] -Like Solid v2, this documentation is in beta. -You may encounter missing content or rough edges in the tooling surrounding Solid v2. -We are actively working to improve these aspects and expand the available content. -If you're seeking a more stable experience, please refer to the [Solid v1 documentation](/). -::: - -Solid is a framework for building user interfaces (UIs) on the web. -You can use it to create anything from small personal projects to complex full-stack applications (with Solid's full-stack framework, [SolidStart](/solid-start/v2)), and everything in between. - -You can try Solid online in the [playground](https://playground.solidjs.com/) or [start a project](/v2/getting-started) right away! diff --git a/src/routes/v2/(1)getting-started.mdx b/src/routes/v2/(1)getting-started.mdx deleted file mode 100644 index 655fa5e65..000000000 --- a/src/routes/v2/(1)getting-started.mdx +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: Getting started -titleTemplate: ":title" -mainNavExclude: true -version: "2.0" ---- - -Use Solid CLI to create a new project: - -```package-create -solid -``` - -You will be prompted to answer a few questions about your project. -If you're unsure, stick with the default options. -By default, the setup uses SolidStart, which is Solid's full-stack framework. - -## Alternatives to SolidStart - -While we strongly recommend using Solid with SolidStart, you can also use Solid directly with [Vite](https://vite.dev/) by selecting the `SolidJS + Vite` option in the Solid CLI. - -:::note -Vite is commonly used for building [single-page applications (SPAs)](https://en.wikipedia.org/wiki/Single-page_application), which you can also build with [SolidStart](/solid-start/v2). -::: - -## Getting help - -If you need assistance, don't hesitate to ask for help in the [Discord chatroom](https://discord.com/invite/solidjs)! diff --git a/src/routes/v2/reference/(1)reactivity/create-effect.mdx b/src/routes/v2/reference/(1)reactivity/create-effect.mdx deleted file mode 100644 index 708043247..000000000 --- a/src/routes/v2/reference/(1)reactivity/create-effect.mdx +++ /dev/null @@ -1,185 +0,0 @@ ---- -title: "createEffect" -category: "Reactivity" -use_cases: "reactivity api, createeffect usage" -tags: - - "create" - - "effect" - - "reactivity" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Creates a reactive effect with **separate compute and effect phases**." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/signals.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Creates a reactive effect with **separate compute and effect phases**. - -- `compute(prev)` runs reactively — _put all reactive reads here_. The - returned value is passed to `effect` and is also the new "previous" value - for the next run. -- `effect(next, prev?)` runs imperatively (untracked) after the queue - flushes. _Put DOM writes / fetch / logging / subscriptions here._ It may - return a cleanup function which runs before the next effect or on - disposal. - -Reactive reads inside `effect` will _not_ re-trigger this effect — that's -intentional. If you need a single-phase tracked effect, use -`createTrackedEffect` (with the tradeoffs noted there). - -Pass an `EffectBundle` (`{ effect, error }`) instead of a plain function to -intercept errors thrown from the compute or effect phases. - -```typescript -createEffect(compute, effectFn | { effect, error }, options?: EffectOptions); -``` - -> Deprecated: `createEffect(compute)` (single argument) is no longer supported. -> Pass a separate effect function as the second argument: -> `createEffect(compute, effect)`. See `MISSING_EFFECT_FN`. - -- For a side effect that reacts to changes, split the work: - `createEffect(() => signal(), value => doWork(value))`. -- For a derived value, use `createMemo(() => signal())`. -- For a one-shot side effect at construction time, just call the function. - -## Import - -```ts -import { createEffect } from "solid-js"; -``` - -## Type signature - -```ts -function createEffect( - compute: ComputeFunction, T>, - effectFn: EffectFunction, T> | EffectBundle, T>, - options?: EffectOptions -): void; -function createEffect( - compute: ComputeFunction, T> -): never; -``` - -## Parameters - -### `compute` - -A function that receives its previous value and returns a new value used to react on a computation - -### `effectFn` - -A function that receives the new value and is used to perform side effects (return a cleanup function), or an `EffectBundle` with `effect` and `error` handlers - -### `options` - -`EffectOptions` -- name, defer, schedule - -## Examples - -```ts -const [count, setCount] = createSignal(0); - -createEffect( - () => count(), // compute: tracks `count` - (value) => console.log(value) // effect: side effect -); - -setCount(1); // logs 1 after the next flush -``` - -```ts -createEffect( - () => userId(), - (id) => { - const ctrl = new AbortController(); - fetch(`/users/${id}`, { signal: ctrl.signal }); - return () => ctrl.abort(); // cleanup before next run / disposal - } -); -``` - -## Related types - -### `ComputeFunction` - -```ts -type ComputeFunction = ( - v: Prev -) => PromiseLike | AsyncIterable | Next; -``` - -### `EffectBundle` - -```ts -type EffectBundle = { - effect: EffectFunction; - error: (err: unknown, cleanup: () => void) => void; -}; -``` - -#### `effect` - -- **Type:** `EffectFunction<Prev, Next>` - -#### `error` - -- **Type:** `(err: unknown, cleanup: () => void) => void` - -### `EffectFunction` - -```ts -type EffectFunction = ( - v: Next, - p?: Prev -) => (() => void) | void; -``` - -### `EffectOptions` - -Options for effect primitives that support deferring/scheduling their initial run (`createEffect`, `createRenderEffect`, `createReaction`). - -```ts -interface EffectOptions extends BaseEffectOptions { - defer?: boolean; - schedule?: boolean; - sync?: boolean; -} -``` - -#### `defer` - -- **Type:** `boolean` - -When true, defers the initial effect execution until the next change - -#### `schedule` - -- **Type:** `boolean` - -When true, enqueues the initial effect callback through the effect queue instead of running -it synchronously at creation. Lets the initial run participate in transitions -- if any -source throws `NotReadyError` during the compute phase, the callback is held until the -transition settles. - -Primarily for render effects that need transition-aware initial mounts (e.g. The root -`insert()` in `render()`). - -#### `sync` - -- **Type:** `boolean` - -Advanced. When true, asserts the compute function returns synchronous -values only (never `PromiseLike` / `AsyncIterable`). Skips the -async-shape probe in `recompute` for a small fixed-cost win per run. -Intended for compiler emissions (`_$effect`) and library code that -provably returns sync values. Returning a Promise or async iterable -from a `sync: true` effect is undefined behavior — the value will be -stored as-is and never awaited. diff --git a/src/routes/v2/reference/(1)reactivity/create-memo.mdx b/src/routes/v2/reference/(1)reactivity/create-memo.mdx deleted file mode 100644 index 4dd8bffe3..000000000 --- a/src/routes/v2/reference/(1)reactivity/create-memo.mdx +++ /dev/null @@ -1,192 +0,0 @@ ---- -title: "createMemo" -category: "Reactivity" -use_cases: "reactivity api, creatememo usage" -tags: - - "create" - - "memo" - - "reactivity" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Creates a readonly derived reactive memoized signal." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/signals.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Creates a readonly derived reactive memoized signal. - -```typescript -const value = createMemo(compute, options?: MemoOptions); -``` - -## Import - -```ts -import { createMemo } from "solid-js"; -``` - -## Type signature - -```ts -function createMemo( - compute: ComputeFunction, T>, - options?: MemoOptions -): SourceAccessor; -``` - -## Parameters - -### `compute` - -A function that receives its previous value and returns a new value used to react on a computation - -### `options` - -`MemoOptions` -- id, name, equals, unobserved, lazy - -## Examples - -```ts -const [first, setFirst] = createSignal("Ada"); -const [last, setLast] = createSignal("Lovelace"); - -const fullName = createMemo(() => `${first()} ${last()}`); - -fullName(); // "Ada Lovelace" -``` - -```ts -// Async memo — reads surface as pending inside -const user = createMemo(async () => { - const res = await fetch(`/users/${id()}`); - return res.json(); -}); -``` - -## Related types - -### `isEqual` - -```ts -function isEqual(a: T, b: T): boolean; -``` - -### `MemoOptions` - -Options for read-only memos created with `createMemo`. -Also used in combination with `SignalOptions` for writable memos -(`createSignal(fn)` / `createOptimistic(fn)`). - -```ts -interface MemoOptions { - id?: string; - name?: string; - transparent?: boolean; - equals?: false | ((prev: T, next: T) => boolean); - unobserved?: () => void; - lazy?: boolean; - sync?: boolean; -} -``` - -#### `id` - -- **Type:** `string` - -Stable identifier for the owner hierarchy - -#### `name` - -- **Type:** `string` - -Debug name (dev mode only) - -#### `transparent` - -- **Type:** `boolean` - -When true, the owner is invisible to the ID scheme -- inherits parent ID and doesn't consume a childCount slot - -#### `equals` - -- **Type:** `false | ((prev: T, next: T) => boolean)` - -Custom equality function, or `false` to always notify subscribers. -Defaults to reference equality (`isEqual`). Pass a comparator (e.g. -`(a, b) => a.id === b.id`) for value-based equality, or `false` to -notify on every recompute regardless of equality. - -#### `unobserved` - -- **Type:** `() => void` - -Callback invoked when the computed loses all subscribers - -#### `lazy` - -- **Type:** `boolean` - -When true, defers the initial computation until the value is first read, -**and** opts the memo into autodisposal — once it has no remaining -subscribers it is torn down and recomputed from scratch on the next read. -Use it for compute-on-demand values that should not retain state across -idle periods. Non-lazy owned memos live for their owner's lifetime and -never autodispose. - -#### `sync` - -- **Type:** `boolean` - -Advanced. When true, asserts the compute function returns synchronous -values only (never `PromiseLike` / `AsyncIterable`). Skips the -async-shape probe in `recompute` for a small fixed-cost win per run. -Intended for compiler emissions (`_$memo`) and library code that -provably returns sync values. Returning a Promise or async iterable -from a `sync: true` memo is undefined behavior — the value will be -stored as-is and never awaited. - -### `SignalOptions` - -Options for plain signals created with `createSignal(value)` or `createOptimistic(value)`. - -```ts -interface SignalOptions { - name?: string; - equals?: false | ((prev: T, next: T) => boolean); - ownedWrite?: boolean; - unobserved?: () => void; -} -``` - -#### `name` - -- **Type:** `string` - -Debug name (dev mode only) - -#### `equals` - -- **Type:** `false | ((prev: T, next: T) => boolean)` - -Custom equality function, or `false` to always notify subscribers. -Defaults to reference equality (`isEqual`). Pass a comparator (e.g. -`(a, b) => a.id === b.id`) for value-based equality, or `false` to -notify on every write regardless of equality. - -#### `ownedWrite` - -- **Type:** `boolean` - -Suppress dev-mode warnings when writing inside an owned scope - -#### `unobserved` - -- **Type:** `() => void` - -Callback invoked when the signal loses all subscribers diff --git a/src/routes/v2/reference/(1)reactivity/create-optimistic.mdx b/src/routes/v2/reference/(1)reactivity/create-optimistic.mdx deleted file mode 100644 index 43a776420..000000000 --- a/src/routes/v2/reference/(1)reactivity/create-optimistic.mdx +++ /dev/null @@ -1,80 +0,0 @@ ---- -title: "createOptimistic" -category: "Reactivity" -use_cases: "reactivity api, createoptimistic usage" -tags: - - "create" - - "optimistic" - - "reactivity" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Creates an optimistic signal that can be used to optimistically update a value\nand then revert it back to the previous value at end of transition." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/signals.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Creates an optimistic signal that can be used to optimistically update a value -and then revert it back to the previous value at end of transition. - -When called with a plain value, creates an optimistic signal with `SignalOptions` (name, equals, ownedWrite, unobserved). -When called with a function, creates a writable optimistic memo with `SignalOptions & MemoOptions` (adds id, lazy). - -```typescript -// Plain optimistic signal -const [state, setState] = createOptimistic(value, options?: SignalOptions); -// Writable optimistic memo (function overload) -const [state, setState] = createOptimistic(fn, options?: SignalOptions & MemoOptions); -``` - -## Import - -```ts -import { createOptimistic } from "solid-js"; -``` - -## Type signature - -```ts -function createOptimistic(): Signal; -function createOptimistic( - value: Exclude, - options?: SignalOptions -): Signal; -function createOptimistic( - fn: ComputeFunction, - options?: SignalOptions & MemoOptions -): Signal; -``` - -## Parameters - -### `value` - -Initial value of the signal; if empty, the signal's type will automatically extended with undefined - -### `options` - -Optional object with a name for debugging purposes and equals, a comparator function for the previous and next value to allow fine-grained control over the reactivity - -## Return value - -`[state: Accessor, setState: Setter]` - -## Examples - -```ts -const [todos, setTodos] = createOptimistic(initialTodos); - -const addTodo = action(function* (text: string) { - const tempId = crypto.randomUUID(); - setTodos((t) => [...t, { id: tempId, text, pending: true }]); // optimistic - const saved = yield api.createTodo(text); - setTodos((t) => t.map((x) => (x.id === tempId ? saved : x))); // reconcile -}); -``` diff --git a/src/routes/v2/reference/(1)reactivity/create-signal.mdx b/src/routes/v2/reference/(1)reactivity/create-signal.mdx deleted file mode 100644 index 49dc03aec..000000000 --- a/src/routes/v2/reference/(1)reactivity/create-signal.mdx +++ /dev/null @@ -1,211 +0,0 @@ ---- -title: "createSignal" -category: "Reactivity" -use_cases: "reactivity api, createsignal usage" -tags: - - "create" - - "signal" - - "reactivity" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Creates a simple reactive state with a getter and setter." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/signals.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Creates a simple reactive state with a getter and setter. - -When called with a plain value, creates a signal with `SignalOptions` (name, equals, ownedWrite, unobserved). -When called with a function, creates a writable memo with `SignalOptions & MemoOptions` (adds id, lazy). - -```typescript -// Plain signal -const [state, setState] = createSignal(value, options?: SignalOptions); -// Writable memo (function overload) -const [state, setState] = createSignal(fn, initialValue?, options?: SignalOptions & MemoOptions); -``` - -## Import - -```ts -import { createSignal } from "solid-js"; -``` - -## Type signature - -```ts -function createSignal(): Signal; -function createSignal( - value: Exclude, - options?: SignalOptions -): Signal; -function createSignal( - fn: ComputeFunction, - options?: SignalOptions & MemoOptions -): Signal; -``` - -## Parameters - -### `value` - -Initial value of the state; if empty, the state's type will automatically extended with undefined - -### `options` - -Optional object with a name for debugging purposes and equals, a comparator function for the previous and next value to allow fine-grained control over the reactivity - -## Return value - -`[state: Accessor, setState: Setter]` - -## Examples - -```ts -const [count, setCount] = createSignal(0); - -count(); // 0 -setCount(1); // explicit value -setCount((c) => c + 1); // updater -``` - -```ts -// Writable memo: starts as `fn()`, can be locally overwritten by setter. -const [user, setUser] = createSignal(() => fetchUser(userId())); - -setUser({ ...user(), name: "Alice" }); // optimistic local edit -``` - -## Related types - -### `isEqual` - -```ts -function isEqual(a: T, b: T): boolean; -``` - -### `MemoOptions` - -Options for read-only memos created with `createMemo`. -Also used in combination with `SignalOptions` for writable memos -(`createSignal(fn)` / `createOptimistic(fn)`). - -```ts -interface MemoOptions { - id?: string; - name?: string; - transparent?: boolean; - equals?: false | ((prev: T, next: T) => boolean); - unobserved?: () => void; - lazy?: boolean; - sync?: boolean; -} -``` - -#### `id` - -- **Type:** `string` - -Stable identifier for the owner hierarchy - -#### `name` - -- **Type:** `string` - -Debug name (dev mode only) - -#### `transparent` - -- **Type:** `boolean` - -When true, the owner is invisible to the ID scheme -- inherits parent ID and doesn't consume a childCount slot - -#### `equals` - -- **Type:** `false | ((prev: T, next: T) => boolean)` - -Custom equality function, or `false` to always notify subscribers. -Defaults to reference equality (`isEqual`). Pass a comparator (e.g. -`(a, b) => a.id === b.id`) for value-based equality, or `false` to -notify on every recompute regardless of equality. - -#### `unobserved` - -- **Type:** `() => void` - -Callback invoked when the computed loses all subscribers - -#### `lazy` - -- **Type:** `boolean` - -When true, defers the initial computation until the value is first read, -**and** opts the memo into autodisposal — once it has no remaining -subscribers it is torn down and recomputed from scratch on the next read. -Use it for compute-on-demand values that should not retain state across -idle periods. Non-lazy owned memos live for their owner's lifetime and -never autodispose. - -#### `sync` - -- **Type:** `boolean` - -Advanced. When true, asserts the compute function returns synchronous -values only (never `PromiseLike` / `AsyncIterable`). Skips the -async-shape probe in `recompute` for a small fixed-cost win per run. -Intended for compiler emissions (`_$memo`) and library code that -provably returns sync values. Returning a Promise or async iterable -from a `sync: true` memo is undefined behavior — the value will be -stored as-is and never awaited. - -### `NoInfer` - -```ts -type NoInfer = [T][T extends any ? 0 : never]; -``` - -### `SignalOptions` - -Options for plain signals created with `createSignal(value)` or `createOptimistic(value)`. - -```ts -interface SignalOptions { - name?: string; - equals?: false | ((prev: T, next: T) => boolean); - ownedWrite?: boolean; - unobserved?: () => void; -} -``` - -#### `name` - -- **Type:** `string` - -Debug name (dev mode only) - -#### `equals` - -- **Type:** `false | ((prev: T, next: T) => boolean)` - -Custom equality function, or `false` to always notify subscribers. -Defaults to reference equality (`isEqual`). Pass a comparator (e.g. -`(a, b) => a.id === b.id`) for value-based equality, or `false` to -notify on every write regardless of equality. - -#### `ownedWrite` - -- **Type:** `boolean` - -Suppress dev-mode warnings when writing inside an owned scope - -#### `unobserved` - -- **Type:** `() => void` - -Callback invoked when the signal loses all subscribers diff --git a/src/routes/v2/reference/(1)reactivity/flush.mdx b/src/routes/v2/reference/(1)reactivity/flush.mdx deleted file mode 100644 index 640b1441d..000000000 --- a/src/routes/v2/reference/(1)reactivity/flush.mdx +++ /dev/null @@ -1,63 +0,0 @@ ---- -title: "flush" -category: "Reactivity" -use_cases: "reactivity api, flush usage" -tags: - - "flush" - - "reactivity" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Synchronously processes the pending reactive queue, or runs `fn` in a synchronous\nflush scope before draining the queue." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/core/scheduler.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Synchronously processes the pending reactive queue, or runs `fn` in a synchronous -flush scope before draining the queue. - -Reactive updates are normally batched onto the microtask queue, so multiple -writes in a row collapse into a single update pass. Call `flush()` when you -need to _observe_ the result of those writes synchronously — most commonly -in tests, but also at the boundary of imperative integration code. Pass a -callback when the writes themselves should bypass microtask scheduling and -drain synchronously when the callback returns. - -## Import - -```ts -import { flush } from "solid-js"; -``` - -## Type signature - -```ts -function flush(): void; -function flush(fn: () => T): T; -``` - -## Examples - -```ts -const [count, setCount] = createSignal(0); -const doubled = createMemo(() => count() * 2); - -setCount(5); -flush(); -expect(doubled()).toBe(10); - -flush(() => setCount(6)); -expect(doubled()).toBe(12); - -// Nested flushes drain at each level: -flush(() => { - setCount(7); - flush(() => setCount(8)); // inner drain — effects fire here - // outer continues with up-to-date state -}); -``` diff --git a/src/routes/v2/reference/(1)reactivity/is-pending.mdx b/src/routes/v2/reference/(1)reactivity/is-pending.mdx deleted file mode 100644 index 3e61787ca..000000000 --- a/src/routes/v2/reference/(1)reactivity/is-pending.mdx +++ /dev/null @@ -1,51 +0,0 @@ ---- -title: "isPending" -category: "Reactivity" -use_cases: "reactivity api, ispending usage" -tags: - - "is" - - "pending" - - "reactivity" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Returns `true` if any reactive read inside `fn` is showing a stale value\nwhile newer async work is pending. Does not subscribe — pair with a tracked\nmemo if you want to react to pending status changes." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/core/core.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Returns `true` if any reactive read inside `fn` is showing a stale value -while newer async work is pending. Does not subscribe — pair with a tracked -memo if you want to react to pending status changes. - -Useful for showing inline transition indicators alongside the previous -value (rather than swapping to a `` fallback). -Because `fn` is read normally, `isPending` participates in Loading/SSR -readiness the same way the read itself would. - -## Import - -```ts -import { isPending } from "solid-js"; -``` - -## Type signature - -```ts -function isPending(fn: () => any): boolean; -``` - -## Examples - -```tsx -const pending = createMemo(() => isPending(() => user())); - - - - -``` diff --git a/src/routes/v2/reference/(1)reactivity/latest.mdx b/src/routes/v2/reference/(1)reactivity/latest.mdx deleted file mode 100644 index d192322e4..000000000 --- a/src/routes/v2/reference/(1)reactivity/latest.mdx +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: "latest" -category: "Reactivity" -use_cases: "reactivity api, latest usage" -tags: - - "latest" - - "reactivity" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Reads reactive expressions while bypassing any pending async overlay — i.e.\nAlways returns the most-recently-committed value, even when newer reads\ninside `fn` are still in flight." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/core/core.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Reads reactive expressions while bypassing any pending async overlay — i.e. -Always returns the most-recently-committed value, even when newer reads -inside `fn` are still in flight. - -Useful inside a `` boundary's children when you want to keep -showing the previous resolved data instead of the fallback while the next -value loads. - -## Import - -```ts -import { latest } from "solid-js"; -``` - -## Type signature - -```ts -function latest(fn: () => T): T; -``` - -## Examples - -```tsx -}> - {/* During a transition, render the previous user instead of skeleton: *\/} - user())} /> - -``` diff --git a/src/routes/v2/reference/(1)reactivity/untrack.mdx b/src/routes/v2/reference/(1)reactivity/untrack.mdx deleted file mode 100644 index 4eaec5f36..000000000 --- a/src/routes/v2/reference/(1)reactivity/untrack.mdx +++ /dev/null @@ -1,53 +0,0 @@ ---- -title: "untrack" -category: "Reactivity" -use_cases: "reactivity api, untrack usage" -tags: - - "untrack" - - "reactivity" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Runs `fn` outside of any reactive tracking — reads inside `fn` will not\nsubscribe the current scope. Returns whatever `fn` returns." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/core/core.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Runs `fn` outside of any reactive tracking — reads inside `fn` will not -subscribe the current scope. Returns whatever `fn` returns. - -Use `untrack` inside a memo or effect when you need to read a signal once -without making the surrounding computation depend on its future changes. - -Pass a `strictReadLabel` string to enable a dev-mode warning: any reactive -read inside `fn` that isn't inside a nested tracking scope will log a -warning naming the label. - -## Import - -```ts -import { untrack } from "solid-js"; -``` - -## Type signature - -```ts -function untrack(fn: () => T, strictReadLabel?: string | false): T; -``` - -## Examples - -```ts -createEffect( - () => trigger(), // tracks `trigger` only - () => { - const snapshot = untrack(() => state); // read once, untracked - log(snapshot); - } -); -``` diff --git a/src/routes/v2/reference/(2)stores/create-optimistic-store.mdx b/src/routes/v2/reference/(2)stores/create-optimistic-store.mdx deleted file mode 100644 index acbcd5957..000000000 --- a/src/routes/v2/reference/(2)stores/create-optimistic-store.mdx +++ /dev/null @@ -1,100 +0,0 @@ ---- -title: "createOptimisticStore" -category: "Stores" -use_cases: "stores api, createoptimisticstore usage" -tags: - - "create" - - "optimistic" - - "store" - - "stores" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "The store equivalent of `createOptimistic`. Writes inside an `action`\ntransition are tentative — they show up immediately but auto-revert (or\nreconcile to the action's resolved value) once the transition finishes." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/store/optimistic.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -The store equivalent of `createOptimistic`. Writes inside an `action` -transition are tentative — they show up immediately but auto-revert (or -reconcile to the action's resolved value) once the transition finishes. - -Use this for optimistic UI on collection-shaped data. For single-value -optimistic state, prefer `createOptimistic`. - -- Plain form: `createOptimisticStore(initialValue)`. -- Derived form: `createOptimisticStore(fn, seed, options?)` — a projection - store whose authoritative value is recomputed by `fn` and whose - optimistic overlay reverts after each transition. - -`options.key` defaults to `"id"`; specify it only when your data uses a -different identity field (e.g. `{ key: "uuid" }` or `{ key: t => t.slug }`). -Restating the default just adds noise. - -## Import - -```ts -import { createOptimisticStore } from "solid-js"; -``` - -## Type signature - -```ts -function createOptimisticStore( - store: NoFn | Store> -): [get: Store, set: StoreSetter]; -function createOptimisticStore( - fn: (store: T) => void | T | Promise | AsyncIterable, - store: Partial | Store>, - options?: ProjectionOptions -): [get: Refreshable>, set: StoreSetter]; -``` - -## Return value - -`[store: Store, setStore: StoreSetter]` - -## Examples - -```ts -const [todos, setTodos] = createOptimisticStore([]); - -// Mutation: optimistic add, then in-place reconcile to the saved row. -const addTodo = action(function* (text: string) { - const tempId = crypto.randomUUID(); - setTodos((t) => { - t.push({ id: tempId, text, pending: true }); - }); - const saved = yield api.createTodo(text); - setTodos((t) => { - const i = t.findIndex((x) => x.id === tempId); - if (i >= 0) t[i] = saved; - }); -}); - -// Return form: filter is the natural shape for removal. -const removeTodo = action(function* (id: string) { - setTodos((t) => t.filter((x) => x.id !== id)); - yield api.removeTodo(id); -}); -``` - -## Related types - -### `Refreshable` - -Brand applied to values that participate in the `refresh()` re-run protocol. -Accessors receive this handle internally; projected stores expose it through -their public return type so user-defined hooks that wrap `createOptimisticStore` -/ `createProjection` / projection-form `createStore` can have their return -types inferred without leaking the internal `$REFRESH` symbol into public type -signatures (TS4058). - -```ts -type Refreshable = T & { readonly [$REFRESH]: any }; -``` diff --git a/src/routes/v2/reference/(2)stores/create-projection.mdx b/src/routes/v2/reference/(2)stores/create-projection.mdx deleted file mode 100644 index 608d71d59..000000000 --- a/src/routes/v2/reference/(2)stores/create-projection.mdx +++ /dev/null @@ -1,133 +0,0 @@ ---- -title: "createProjection" -category: "Stores" -use_cases: "stores api, createprojection usage" -tags: - - "create" - - "projection" - - "stores" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Creates a derived (projected) store. Like `createMemo` but for stores: the\nderive function receives a mutable draft and either mutates it in place\n(canonical) or returns a new value. Either way the result is reconciled\nagainst the previous draft by `options.key` (default `\"id\"`), so surviving\nitems keep their proxy identity — only added/removed items are\ncreated/disposed." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/store/projection.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Creates a derived (projected) store. Like `createMemo` but for stores: the -derive function receives a mutable draft and either mutates it in place -(canonical) or returns a new value. Either way the result is reconciled -against the previous draft by `options.key` (default `"id"`), so surviving -items keep their proxy identity — only added/removed items are -created/disposed. - -Returns the projected store directly (no setter — reads only). - -Use this when you want the structural-sharing / per-property tracking -behaviour of a store on top of a derived computation. For simple read-only -derivations, `createMemo` is lighter. - -## Import - -```ts -import { createProjection } from "solid-js"; -``` - -## Type signature - -```ts -function createProjection( - fn: (draft: T) => void | T | Promise | AsyncIterable, - seed: Partial, - options?: ProjectionOptions -): Refreshable>; -``` - -## Parameters - -### `fn` - -Receives the current draft; mutate it in place or return new -data. Return is convenient for filter/derive shapes where mutation is -awkward. - -### `seed` - -The backing store value to wrap and reconcile into - -### `options` - -`ProjectionOptions` — `name`, `key`. `key` defaults to -`"id"`; specify it only when your data uses a different identity field -(e.g. `{ key: "uuid" }` or `{ key: u => u.slug }`). - -## Examples - -```ts -// Mutation form — update individual fields on the draft. -const summary = createProjection<{ total: number; active: number }>( - (draft) => { - draft.total = users().length; - draft.active = users().filter((u) => u.active).length; - }, - { total: 0, active: 0 } -); - -// Return form — produce a derived collection. Reconciled by `id` so each -// surviving user keeps the same store identity across recomputes. -const activeUsers = createProjection( - () => allUsers().filter((u) => u.active), - [] -); -``` - -## Related - -- `://github.com/solidjs/x-reactivity#createprojection` - -## Related types - -### `ProjectionOptions` - -Options for derived/projected stores created with `createStore(fn)`, `createProjection`, or `createOptimisticStore(fn)`. - -```ts -interface ProjectionOptions extends StoreOptions { - key?: string | ((item: NonNullable) => any); -} -``` - -#### `key` - -- **Type:** `string | ((item: NonNullable<any>) => any)` - -Key property name or function for reconciliation identity - -### `ProjectionStoreReturn` - -Tuple returned by the derived `createStore(fn, seed, options?)` form. - -```ts -type ProjectionStoreReturn = [ - get: Refreshable>, - set: StoreSetter, -]; -``` - -### `Refreshable` - -Brand applied to values that participate in the `refresh()` re-run protocol. -Accessors receive this handle internally; projected stores expose it through -their public return type so user-defined hooks that wrap `createOptimisticStore` -/ `createProjection` / projection-form `createStore` can have their return -types inferred without leaking the internal `$REFRESH` symbol into public type -signatures (TS4058). - -```ts -type Refreshable = T & { readonly [$REFRESH]: any }; -``` diff --git a/src/routes/v2/reference/(2)stores/create-store.mdx b/src/routes/v2/reference/(2)stores/create-store.mdx deleted file mode 100644 index 508fc2b9c..000000000 --- a/src/routes/v2/reference/(2)stores/create-store.mdx +++ /dev/null @@ -1,183 +0,0 @@ ---- -title: "createStore" -category: "Stores" -use_cases: "stores api, createstore usage" -tags: - - "create" - - "store" - - "stores" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Creates a deeply-reactive store backed by a Proxy. Reads track each property\naccessed; only the parts that change trigger updates." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/store/store.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Creates a deeply-reactive store backed by a Proxy. Reads track each property -accessed; only the parts that change trigger updates. - -Store properties hold **plain values**, not accessors. The proxy already -tracks reads per-property — wrapping a value in `() => state.foo` produces -a getter that _won't_ track when called, which looks like a reactivity bug -but is just a category error. If you have a signal-shaped piece of state, -make it a property of the store (`{ foo: 1 }`) rather than nesting an -accessor inside (`{ foo: () => signal() }`). - -The setter takes a **draft-mutating** function — mutate the draft in place -(canonical). The callback may also return a new value: arrays are replaced -by index (length adjusted), objects are shallow-diffed at the top level -(keys present in the returned value are written, missing keys deleted). Use -the return form for shapes where mutation is awkward — most commonly -removing items via `filter`. The setter does **not** do keyed reconciliation; -for that, use the derived/projection form (or `createProjection`). - -- Plain form: `createStore(initialValue)` — wraps a value in a reactive - proxy. -- Derived form: `createStore(fn, seed, options?)` — a _projection store_ - whose contents are computed by `fn(draft)`. `fn` may be sync, async, or - an `AsyncIterable`; the projection's result reconciles against the - existing store by `options.key` (default `"id"`) for stable identity. - -## Import - -```ts -import { createStore } from "solid-js"; -``` - -## Type signature - -```ts -function createStore( - store: NoFn | Store> -): StoreReturn; -function createStore( - fn: (store: T) => void | T | Promise | AsyncIterable, - store: Partial | Store>, - options?: ProjectionOptions -): ProjectionStoreReturn; -``` - -## Return value - -`[store: Store, setStore: StoreSetter]` - -## Examples - -```ts -const [state, setState] = createStore({ - user: { name: "Ada", age: 36 }, - todos: [] as { id: string; text: string; done: boolean }[], -}); - -// Canonical: mutate the draft in place. -setState((s) => { - s.user.age = 37; -}); -setState((s) => { - s.todos.push({ id: "1", text: "x", done: false }); -}); - -// Return form: reach for it when mutation is awkward. -setState((s) => s.todos.filter((t) => !t.done)); // remove items -setState((s) => ({ ...s, user: { name: "Grace", age: 85 } })); // shallow replace -``` - -```ts -// Derived store — auto-fetches & reconciles by `id`. -const [users] = createStore( - async () => fetch("/users").then((r) => r.json()), - [] as User[] -); -``` - -## Related types - -### `ProjectionOptions` - -Options for derived/projected stores created with `createStore(fn)`, `createProjection`, or `createOptimisticStore(fn)`. - -```ts -interface ProjectionOptions extends StoreOptions { - key?: string | ((item: NonNullable) => any); -} -``` - -#### `key` - -- **Type:** `string | ((item: NonNullable<any>) => any)` - -Key property name or function for reconciliation identity - -### `ProjectionStoreReturn` - -Tuple returned by the derived `createStore(fn, seed, options?)` form. - -```ts -type ProjectionStoreReturn = [ - get: Refreshable>, - set: StoreSetter, -]; -``` - -### `Refreshable` - -Brand applied to values that participate in the `refresh()` re-run protocol. -Accessors receive this handle internally; projected stores expose it through -their public return type so user-defined hooks that wrap `createOptimisticStore` -/ `createProjection` / projection-form `createStore` can have their return -types inferred without leaking the internal `$REFRESH` symbol into public type -signatures (TS4058). - -```ts -type Refreshable = T & { readonly [$REFRESH]: any }; -``` - -### `StoreOptions` - -Base options for store primitives. - -```ts -interface StoreOptions { - name?: string; -} -``` - -#### `name` - -- **Type:** `string` - -Debug name (dev mode only) - -### `StoreReturn` - -Tuple returned by the plain `createStore(initialValue)` form. - -```ts -type StoreReturn = [get: Store, set: StoreSetter]; -``` - -### `StoreSetter` - -A store setter. The callback receives a writable **draft** of the store. - -- **Mutate in place (canonical):** `s.foo = 1`, `s.list.push(x)`, - `s.list.splice(i, 1)`. This is the default form for most updates. -- **Return a new value:** for shapes where mutation is awkward, most - commonly removing items (`s => s.list.filter(...)`). Arrays are replaced - by index (length adjusted); objects are shallow-diffed at the top level - (keys present in the returned value are written, missing keys deleted). - -The setter does **not** perform keyed reconciliation. If you need surviving -items to keep their store identity across full-array replacement, use the -projection form — `createStore(fn, seed, { key })` or `createProjection` — -whose derive function reconciles its return by `options.key`. - -```ts -type StoreSetter = (fn: (state: T) => T | void) => void; -``` diff --git a/src/routes/v2/reference/(2)stores/merge.mdx b/src/routes/v2/reference/(2)stores/merge.mdx deleted file mode 100644 index d719f5767..000000000 --- a/src/routes/v2/reference/(2)stores/merge.mdx +++ /dev/null @@ -1,63 +0,0 @@ ---- -title: "merge" -category: "Stores" -use_cases: "stores api, merge usage" -tags: - - "merge" - - "stores" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Merges multiple props-like objects into a single proxy that *preserves\nreactivity*. Reads are forwarded to the right-most source that defines the\nproperty, so later sources override earlier ones (like `Object.assign`)." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/store/utils.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Merges multiple props-like objects into a single proxy that _preserves -reactivity_. Reads are forwarded to the right-most source that defines the -property, so later sources override earlier ones (like `Object.assign`). - -Function arguments are treated as memo-backed sources — useful for passing -derived defaults whose computation should track reactively. - -Use this in component bodies to merge defaults / overrides without losing -Solid's per-property tracking. - -## Import - -```ts -import { merge } from "solid-js"; -``` - -## Type signature - -```ts -function merge(...sources: T): Merge; -``` - -## Examples - -```tsx -function Button(_props: { label: string; type?: string; disabled?: boolean }) { - const props = merge({ type: "button", disabled: false }, _props); - - return ( - - ); -} -``` - -## Related types - -### `Merge` - -```ts -type Merge = Simplify<_Merge>; -``` diff --git a/src/routes/v2/reference/(2)stores/omit.mdx b/src/routes/v2/reference/(2)stores/omit.mdx deleted file mode 100644 index eeb78ae3d..000000000 --- a/src/routes/v2/reference/(2)stores/omit.mdx +++ /dev/null @@ -1,75 +0,0 @@ ---- -title: "omit" -category: "Stores" -use_cases: "stores api, omit usage" -tags: - - "omit" - - "stores" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Returns a reactive proxy of `props` with the listed keys hidden. Tracking\non the remaining keys is preserved." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/store/utils.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Returns a reactive proxy of `props` with the listed keys hidden. Tracking -on the remaining keys is preserved. - -Use it to forward "rest" props to a child element while pulling out the -keys your component handles itself — the equivalent of `splitProps(p, ["a","b"])[1]`. - -## Import - -```ts -import { omit } from "solid-js"; -``` - -## Type signature - -```ts -function omit, K extends readonly (keyof T)[]>( - props: T, - ...keys: K -): Omit; -``` - -## Examples - -```tsx -function Input( - props: { - label: string; - value: string; - onInput: (v: string) => void; - } & JSX.HTMLAttributes -) { - const rest = omit(props, "label", "value", "onInput"); - - return ( - - ); -} -``` - -## Related types - -### `Omit` - -```ts -type Omit = { - [P in keyof T as Exclude]: T[P]; -}; -``` diff --git a/src/routes/v2/reference/(2)stores/reconcile.mdx b/src/routes/v2/reference/(2)stores/reconcile.mdx deleted file mode 100644 index 38fe758f4..000000000 --- a/src/routes/v2/reference/(2)stores/reconcile.mdx +++ /dev/null @@ -1,63 +0,0 @@ ---- -title: "reconcile" -category: "Stores" -use_cases: "stores api, reconcile usage" -tags: - - "reconcile" - - "stores" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Returns a draft-mutating function that smart-merges `value` into a store,\npreserving the identity of items whose `key` field matches between old and\nnew states. Useful when applying server payloads or full-replacement data\nonto an existing store without losing fine-grained reactivity." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/store/reconcile.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Returns a draft-mutating function that smart-merges `value` into a store, -preserving the identity of items whose `key` field matches between old and -new states. Useful when applying server payloads or full-replacement data -onto an existing store without losing fine-grained reactivity. - -Items with the same key are updated in place (only changed properties -trigger updates). Items added or removed update the corresponding signals. - -## Import - -```ts -import { reconcile } from "solid-js"; -``` - -## Type signature - -```ts -function reconcile( - value: T, - key: string | ((item: NonNullable) => any) -); -``` - -## Parameters - -### `value` - -The next state to merge in - -### `key` - -Property name (string) or extractor function for stable identity - -## Examples - -```ts -const [todos, setTodos] = createStore([]); - -async function refresh() { - const fresh = await api.getTodos(); - setTodos(reconcile(fresh, "id")); // diff-merge by `id` -} -``` diff --git a/src/routes/v2/reference/(3)lifecycle-actions/action.mdx b/src/routes/v2/reference/(3)lifecycle-actions/action.mdx deleted file mode 100644 index 199d821b5..000000000 --- a/src/routes/v2/reference/(3)lifecycle-actions/action.mdx +++ /dev/null @@ -1,70 +0,0 @@ ---- -title: "action" -category: "Lifecycle & Actions" -use_cases: "lifecycle & actions api, action usage" -tags: - - "action" - - "lifecycle" - - "actions" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Wraps a generator function so each invocation runs as a single transaction\n(a \"transition\") that batches every signal/store write between yields. The\nsurrounding UI sees one atomic update per yielded step; nothing is committed\nuntil the action either completes or the next `yield` resolves." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/core/action.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Wraps a generator function so each invocation runs as a single transaction -(a "transition") that batches every signal/store write between yields. The -surrounding UI sees one atomic update per yielded step; nothing is committed -until the action either completes or the next `yield` resolves. - -Yield promises (or any awaitable) inside the generator — the action waits -for each before continuing, but the writes you made beforehand are already -visible (or held by `` if optimistic). Yield bare values for -synchronous batched steps. - -Each call returns a `Promise` that resolves with the generator's return -value, or rejects if it throws. Pair with `createOptimistic` / -`createOptimisticStore` to apply tentative writes that auto-revert if the -action fails. - -## Import - -```ts -import { action } from "solid-js"; -``` - -## Type signature - -```ts -function action( - genFn: (...args: Args) => Generator | AsyncGenerator -); -``` - -## Examples - -```ts -const [todos, setTodos] = createOptimisticStore([]); - -const addTodo = action(function* (text: string) { - const tempId = crypto.randomUUID(); - setTodos((t) => { - t.push({ id: tempId, text, pending: true }); - }); // optimistic - const saved = yield api.createTodo(text); // network round-trip - setTodos((t) => { - const i = t.findIndex((x) => x.id === tempId); - if (i >= 0) t[i] = saved; - }); - return saved; -}); - -await addTodo("buy milk"); -``` diff --git a/src/routes/v2/reference/(3)lifecycle-actions/on-settled.mdx b/src/routes/v2/reference/(3)lifecycle-actions/on-settled.mdx deleted file mode 100644 index 72244d53c..000000000 --- a/src/routes/v2/reference/(3)lifecycle-actions/on-settled.mdx +++ /dev/null @@ -1,120 +0,0 @@ ---- -title: "onSettled" -category: "Lifecycle & Actions" -use_cases: "lifecycle & actions api, onsettled usage" -tags: - - "on" - - "settled" - - "lifecycle" - - "actions" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Schedules `callback` to run **once** after the reactive graph has fully\nsettled — i.e. Once every pending async read inside the current owner has\nresolved and the queue has flushed. Each call registers a single fire; it\ndoes not create an ongoing subscription." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/signals.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Schedules `callback` to run **once** after the reactive graph has fully -settled — i.e. Once every pending async read inside the current owner has -resolved and the queue has flushed. Each call registers a single fire; it -does not create an ongoing subscription. - -The canonical lifecycle primitive in 2.0. Three main usages: - -- **Component-level setup-and-teardown** _(the most common shape)_: run - setup after the component's first stable render and **return a cleanup - function** to dispose it on owner disposal. This is the replacement for - the 1.x `onMount` + `onCleanup` pairing — setup and teardown live in one - block, and `onCleanup` is no longer the right tool for component - bodies. (`onMount` no longer exists in 2.0.) -- **Post-settle "ready" hook:** run once after a component's first stable - render — analytics ping, focus, scroll-into-view, etc. No cleanup needed. -- **Inside an event handler:** schedule work to run after the action / - transition triggered by the event has completed. - -Reactive reads inside the callback are _not_ tracked — to react to -subsequent settles, register a new `onSettled` each time. - -`onCleanup` is **not** allowed inside the callback — return a cleanup -function instead. The returned cleanup runs on owner disposal. - -A cleanup return is only honored when `onSettled` is called from an **owned** -scope (e.g. A component body). When it fires out of band from an _unowned_ -scope — an event handler, a tracked effect, or another `onSettled` — there is -no owner lifecycle to bind a cleanup to; returning one is a dev-mode error -(and is dropped in production). Use the post-settle/event-handler forms below -for one-shot work, and keep setup-with-teardown in an owned scope. - -## Import - -```ts -import { onSettled } from "solid-js"; -``` - -## Type signature - -```ts -function onSettled(callback: () => void | (() => void)): void; -``` - -## Parameters - -### `callback` - -Function to run; may return a cleanup function that fires -on owner disposal - -## Examples - -```tsx -// Component-level setup + teardown — replaces onMount + onCleanup. -// Subscribe to an external source on mount, unsubscribe on dispose. -function useViewportWidth() { - const [width, setWidth] = createSignal(window.innerWidth); - onSettled(() => { - const onResize = () => setWidth(window.innerWidth); - window.addEventListener("resize", onResize); - return () => window.removeEventListener("resize", onResize); - }); - return width; -} -``` - -```tsx -// Post-settle "ready" hook — no cleanup needed. -function Dashboard() { - const data = createMemo(async () => fetchData()); - - onSettled(() => { - analytics.track("dashboard.ready"); - }); - - return ( - }> - 
{data()}
- - ); -} -``` - -```tsx -// Event-handler — runs after the action settles. -function SaveButton() { - const save = action(function* () { - yield api.save(); - }); - - const handleClick = () => { - save(); - onSettled(() => toast("Saved!")); - }; - - return ; -} -``` diff --git a/src/routes/v2/reference/(3)lifecycle-actions/refresh.mdx b/src/routes/v2/reference/(3)lifecycle-actions/refresh.mdx deleted file mode 100644 index 252292663..000000000 --- a/src/routes/v2/reference/(3)lifecycle-actions/refresh.mdx +++ /dev/null @@ -1,52 +0,0 @@ ---- -title: "refresh" -category: "Lifecycle & Actions" -use_cases: "lifecycle & actions api, refresh usage" -tags: - - "refresh" - - "lifecycle" - - "actions" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Invalidates one reactive source, forcing it to re-execute even if its inputs\nhaven't changed." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid-signals/src/core/core.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Invalidates one reactive source, forcing it to re-execute even if its inputs -haven't changed. - -Pass either a Solid-created accessor or a projected store created from -`createStore(fn, ...)` / `createProjection(...)`. `refresh()` is a -write-like invalidation operation: it does not read the target's value, and -refreshing a plain signal accessor is a no-op. - -Use it to invalidate cached async values (e.g. Force a re-fetch) without -tearing the consumer down. - -## Import - -```ts -import { refresh } from "solid-js"; -``` - -## Type signature - -```ts -function refresh(target: Refreshable): void; -``` - -## Examples - -```ts -const user = createMemo(async () => fetch(`/users/${id()}`).then(r => r.json())); - -// Re-fetch on demand - -``` diff --git a/src/routes/v2/reference/(4)components-context/children.mdx b/src/routes/v2/reference/(4)components-context/children.mdx deleted file mode 100644 index 8a0cd3417..000000000 --- a/src/routes/v2/reference/(4)components-context/children.mdx +++ /dev/null @@ -1,77 +0,0 @@ ---- -title: "children" -category: "Components & Context" -use_cases: "components & context api, children usage" -tags: - - "children" - - "components" - - "context" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Resolves a `children` accessor and exposes the result as an accessor with\na `.toArray()` helper. Use this when a component needs to inspect or\niterate over its children rather than just render them through." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid/src/client/core.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Resolves a `children` accessor and exposes the result as an accessor with -a `.toArray()` helper. Use this when a component needs to inspect or -iterate over its children rather than just render them through. - -## Import - -```ts -import { children } from "solid-js"; -``` - -## Type signature - -```ts -function children(fn: Accessor): ChildrenReturn; -``` - -## Parameters - -### `fn` - -An accessor for the children - -## Return value - -An accessor of the resolved children, with `.toArray()` for iteration - -## Examples - -```tsx -function List(props: { children: Element }) { - const items = children(() => props.children); - return ( -
    - {items.toArray().map((item) => ( -
  • {item}
    • - ))} -
- ); -} -``` - -## Related types - -### `ChildrenReturn` - -```ts -type ChildrenReturn = Accessor & { - toArray: () => ResolvedElement[]; -}; -``` - -### `ResolvedChildren` - -```ts -type ResolvedChildren = ResolvedElement | ResolvedElement[]; -``` diff --git a/src/routes/v2/reference/(4)components-context/create-context.mdx b/src/routes/v2/reference/(4)components-context/create-context.mdx deleted file mode 100644 index 3d929a592..000000000 --- a/src/routes/v2/reference/(4)components-context/create-context.mdx +++ /dev/null @@ -1,114 +0,0 @@ ---- -title: "createContext" -category: "Components & Context" -use_cases: "components & context api, createcontext usage" -tags: - - "create" - - "context" - - "components" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Creates a Context for sharing state with descendants of a Provider in the\ncomponent tree." -source_repo: "solidjs/solid" -source_ref: "next" -source_sha: "bad66625e13abb5a86168b8be0db8638097f7b71" -source_path: "packages/solid/src/client/core.ts" ---- - -{/* Generated by scripts/extract-solid-ref.mjs. Edit the source JSDoc or disposition map, then regenerate. */} - -Creates a Context for sharing state with descendants of a Provider in the -component tree. - -The returned `Context` is itself a provider component — pass it a `value` -prop to scope a value to its children. Read it inside descendants with -`useContext`. - -Two forms: - -- **`createContext()`** (default-less, the canonical form). Reading via - `useContext` outside an enclosing Provider throws `ContextNotFoundError`. - Use this for everything that carries reactive state — signals, stores, - `[state, actions]` tuples, services. The Provider is mandatory by - construction; the throw makes a missing Provider a loud bug instead of a - silent no-op. The annotation `` is required because there is no value - to infer from. -- **`createContext(defaultValue)`** (default form). Reserved for the - narrow case of contexts whose value is a primitive with a meaningful - static fallback (theme, locale, frozen config). Outside any Provider, - `useContext` returns `defaultValue`. - -If you want truly app-wide state, **don't use Context** — a module-scope -signal/store _is_ a global. Context is for scoping state to a subtree; -that's why a Provider is required. - -## Import - -```ts -import { createContext } from "solid-js"; -``` - -## Type signature - -```ts -function createContext( - defaultValue?: T, - options?: EffectOptions -): Context; -``` - -## Parameters - -### `defaultValue` - -Optional default; only meaningful for primitive -fallbacks. Omit for any context carrying reactive state. - -### `options` - -`{ name }` for debugging in development - -## Return value - -A context object that doubles as its own provider component - -## Examples - -```tsx -// Reactive payload — default-less, throws if no Provider. -type TodosCtx = readonly [Store, TodoActions]; -const TodosContext = createContext(); - -function App() { - return ( - - - - ); -} - -function TodoList() { - const [todos, { addTodo }] = useContext(TodosContext); // typed as TodosCtx - // ... -} -``` - -```tsx -// Primitive default — falls back to "light" outside a Provider. -const ThemeContext = createContext<"light" | "dark">("light"); - -function Button() { - const theme = useContext(ThemeContext); // "light" | "dark" - return ; -} -``` - -## Related types - -### `ContextRecord` - -```ts -type ContextRecord = Record; -``` diff --git a/src/routes/v2/reference/(4)components-context/create-unique-id.mdx b/src/routes/v2/reference/(4)components-context/create-unique-id.mdx deleted file mode 100644 index 8b77ee2e8..000000000 --- a/src/routes/v2/reference/(4)components-context/create-unique-id.mdx +++ /dev/null @@ -1,52 +0,0 @@ ---- -title: "createUniqueId" -category: "Components & Context" -use_cases: "components & context api, createuniqueid usage" -tags: - - "create" - - "unique" - - "id" - - "components" - - "context" - - "reference" - - "api" - - "v2" -version: "2.0" -description: "Returns a stable id string that matches between server-rendered and\nclient-hydrated trees. Use it for `