module@warp-drive/experiments/pagination @experimental

Interface RealPaginationLink sincev5.9.0

interface RealPaginationLink {
  readonly distanceFromActiveIndex: number;
  readonly index: number;
  readonly isCurrent: boolean;
  readonly isReal: true;
  setActive: () => Promise<unknown>;
  readonly url: string;
  get text(): string;
}

Defined in: warp-drive-packages/core/src/signals/pagination-links.ts:31

Hideconstructor

A single numbered link, e.g. page 3. Loads its page and makes it active when setActive runs. Carries its index and its distanceFromActiveIndex so a UI can style links by how far they sit from the current page.

<EachLink @pages={{pages}} as |state|>
  {{#each state.links as |link|}}
    {{#if link.isReal}}
      <button class={{if link.isCurrent "active"}} {{on "click" link.setActive}}>
        {{link.text}}
      </button>
    {{/if}}
  {{/each}}
</EachLink>

Properties

distanceFromActiveIndex

readonly distanceFromActiveIndex: number;

Defined in: warp-drive-packages/core/src/signals/pagination-links.ts:37

---

index

readonly index: number;

Defined in: warp-drive-packages/core/src/signals/pagination-links.ts:35

---

isCurrent

readonly isCurrent: boolean;

Defined in: warp-drive-packages/core/src/signals/pagination-links.ts:36

---

isReal

readonly isReal: true;

Defined in: warp-drive-packages/core/src/signals/pagination-links.ts:32

---

setActive

setActive: () => Promise<unknown>;

Defined in: warp-drive-packages/core/src/signals/pagination-links.ts:62

Loads this link's page and makes it the active page on the associated PaginationState. It is a stable reference, so it is safe to pass around as an "action" or "event" handler:

<button {{on "click" link.setActive}}>{{link.text}}</button>

Returns

Promise<unknown>

---

url

readonly url: string;

Defined in: warp-drive-packages/core/src/signals/pagination-links.ts:34

text

Get Signature

get text(): string;

Defined in: warp-drive-packages/core/src/signals/pagination-links.ts:49

Returns

string