# kspg

> Kisaragi's Svelte Pagination component.

Latest version **0.1.0** (published 2023-06-11) · GPL-3.0-only license · 0 weekly downloads

## Install

```sh
npm install kspg
pnpm add kspg
yarn add kspg
bun add kspg
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.0 |
| Published | 2023-06-11 |
| First published | 2023-06-11 |
| Weekly downloads | 0 |
| License | GPL-3.0-only |
| TypeScript types | bundled |
| Module format | ESM |
| Dependencies | 1 |
| Unpacked size | 40.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | kisaragi-hiu |

## Links

- npm: https://www.npmjs.com/package/kspg
- npm.io page: https://npm.io/package/kspg

## Dependencies (1)

- [pupa](https://npm.io/package/pupa.md) ^3.1.0

## Recent versions

- 0.1.0 (latest) — 2023-06-11

## README

# kspg

Kisaragi's Svelte Pagination component.

## URL-based pagination

```javascript
// +page.js
import { redirect } from "@sveltejs/kit";
import { parsePageParam } from "kspg";
export function load({ url }) {
  const pageNumberFromUrl = parsePageParam(url.searchParams.get("p"));
  if (pageNumberFromUrl === false) {
    throw redirect(307, "/");
  }
  return {
    pageNumberFromUrl,
  };
}
```

```svelte
<!-- +page.svelte -->
<script>
  export let data;
  let pageNumberFromUrl;
  $: pageNumberFromUrl = data.pageNumberFromUrl;
</script>
<Pages
  pageCount={10}
  currentPage={pageNumberFromUrl}
  template={"/?p={0}"}
/>
```

## Store-based pagination

```svelte
<script>
  import { writable } from "svelte/store";
  const store = writable(1);
</script>
<Pages pageCount={10} currentPage={store} />
```

---
_Source: https://npm.io/package/kspg · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
