@3birds/midori-ui 0.0.51 → 0.0.53

package/dist/components/Pagination.svelte

@@ -1,29 +1,32 @@
 <script lang="ts">
-	import { Btn } from '@3birds/midori-ui';
+	import { page as pageState } from '$app/state';
+	import { Btn } from '..';
 
 	let {
-		value = $bindable(),
 		per,
 		deadend,
 		class: className
-	}: { value: number; per: number; deadend: boolean; class?: string } = $props();
+	}: { per: number; deadend: boolean; class?: string } = $props();
 
-	const onClickPrev = () => {
-		value--;
-		window.scrollTo({ top: 0, behavior: 'smooth' });
-	};
+	const pageQuery = $derived(Number(pageState.url.searchParams.get('page')) || 1);
+
+	const generatePaginationHref = (value: number): string => {
+		const searchParams: URLSearchParams = new URLSearchParams(pageState.url.searchParams);
 
-	const onClickNext = () => {
-		value++;
-		window.scrollTo({ top: 0, behavior: 'smooth' });
+		searchParams.set('page', value.toString());
+
+		return `${pageState.url.pathname}?${searchParams.toString()}`;
 	};
+
+	const prevHref = $derived(pageQuery === 1 ? '' : generatePaginationHref(pageQuery - 1));
+	const nextHref = $derived(deadend ? '' : generatePaginationHref(pageQuery + 1));
 </script>
 
 <div class="join col-span-8 col-start-3 grid grid-cols-2 {className}">
-	<Btn class="join-item rounded-r-none btn-outline" disabled={value === 1} onclick={onClickPrev}
+	<Btn class="join-item rounded-r-none btn-outline" href={prevHref} disabled={pageQuery === 1}
 		>前の{per}件</Btn
 	>
-	<Btn class="join-item rounded-l-none btn-outline" disabled={deadend} onclick={onClickNext}
+	<Btn class="join-item rounded-l-none btn-outline" disabled={deadend} href={nextHref}
 		>次の{per}件</Btn
 	>
 </div>

package/dist/components/Pagination.svelte.d.ts

@@ -1,9 +1,8 @@
 type $$ComponentProps = {
-    value: number;
     per: number;
     deadend: boolean;
     class?: string;
 };
-declare const Pagination: import("svelte").Component<$$ComponentProps, {}, "value">;
+declare const Pagination: import("svelte").Component<$$ComponentProps, {}, "">;
 type Pagination = ReturnType<typeof Pagination>;
 export default Pagination;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@3birds/midori-ui",
-	"version": "0.0.51",
+	"version": "0.0.53",
 	"type": "module",
 	"scripts": {
 		"dev": "vite dev",