# @svelte-lean/query/infinite

> createInfinite(): "load more" walks over ordinary page entries, with head-only polling and per-page failures.

Page: https://svelte-lean.vercel.app/query/api/infinite · Markdown: https://svelte-lean.vercel.app/query/api/infinite.md · Index: https://svelte-lean.vercel.app/llms.txt

createInfinite(): a "load more" list. Each page is an ordinary cache entry, so pages fail, refetch and are evicted one by one, and only the head page polls.

> **Note** `./infinite` is experimental: the API can still change in a minor release. Stability per entry point: [Entry points](https://svelte-lean.vercel.app/query.md#entry-points).

## Import

`import`

```ts
import { createInfinite } from '@svelte-lean/query/infinite';
```

## Usage

`team-members.svelte`

```svelte
<script lang="ts">
	import { createInfinite } from '@svelte-lean/query/infinite';
	import { listMembers } from '$api/members';

	let { team }: { team: string } = $props();
	const members = createInfinite(listMembers, () => ({ team }), { perPage: 50 });
</script>

<ul>
	{#each members.rows as member (member.id)}<li>{member.name}</li>{/each}
</ul>
{#if members.hasMore}
	<button disabled={members.loadingMore} onclick={() => members.loadMore()}>More</button>
{/if}
```

## Size

Production Vite builds of a small consumer entry, Svelte external. A marginal row is the bytes the entry adds over the row it names.

| Build | Over | gzip | brotli | Budget (gzip) |
| --- | --- | --- | --- | --- |
| `infinite (marginal)` | `query` | 1648 B | 1502 B | 1800 B |

Read from `packages/query/artifacts/size.json`. Every entry and its method: [Performance](https://svelte-lean.vercel.app/query/performance.md).

## Functions

One binding over a page() endpoint.

### Exports

Runtime exports of the entry.

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| # `createInfinite` | `(endpoint: QueryEndpoint<P, Page<T>>, params: () => P \| undefined \| null, options?: InfiniteOptions) => InfiniteResult<T>` | – | Walks pages 1..n; each page's params are the params plus the profile's pageParams. |

## Options

InfiniteOptions, the third argument of createInfinite().

### InfiniteOptions

All optional.

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| # `perPage` | `number` | `20` | The page size. |
| # `when` | `boolean \| (() => boolean)` | – | A state condition: pauses the walk and polling, keeps rows. |
| # `keepPrevious` | `boolean` | `false` | Keep the rows of the previous params (a picker passes true). |
| # `maxPages` | `number` | `none` | A hard cap on the walk. |
| # `poll` | `PollOption \| (() => PollOption)` | – | Polls the head page only. |
| # `shift` | `'refetch' \| 'carry'` | `'refetch'` | What a head refresh with new rows does to deeper pages. |
| # `fresh` | `Duration` | – | Per-use freshness. |

## Result

InfiniteResult, what createInfinite() returns.

### InfiniteResult

Head-page fields describe the first page; the others the whole walk.

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| # `rows` | `T[]` | – | Pages 1..n in order, each row id kept at its first occurrence. |
| # `pages` | `number` | – | Pages walked. |
| # `hasMore` | `boolean` | – | Another page exists. |
| # `total` | `number \| undefined` | – | The head paginator's total; undefined for bare lists. |
| # `error` | `QueryError \| undefined` | – | The first error in walk order. |
| # `moreError` | `QueryError \| undefined` | – | The deepest page failed with no data; loadMore() retries it. |
| # `loading` | `boolean` | – | The head page is loading for the user. |
| # `loadingMore` | `boolean` | – | The deepest page has no data and is fetching. |
| # `refreshing` | `boolean` | – | Any page is refreshing quietly. |
| # `busy` | `boolean` | – | loading, loadingMore or refreshing. |
| # `blocked` | `Blocked \| undefined` | – | Of the head page; loadMore() sends nothing while set. |
| # `info` | `QueryInfo` | – | The head page's info: status, placeholder (the rows belong to the previous params), stale, slow, updatedAt, fetch. |
| # `loadMore` | `() => Promise<void>` | – | Walk one page further. |
| # `refetch` | `() => Promise<void>` | – | Every walked page, in parallel, cause user. |

## Guide

How to use it, with examples: [Lists](https://svelte-lean.vercel.app/query/lists.md). All entry points: [Svelte Lean Query](https://svelte-lean.vercel.app/query.md).