feat: better components

This commit is contained in:
2025-05-12 11:27:33 -04:00
parent 398ddde169
commit cdeaa13d92
135 changed files with 10487 additions and 2088 deletions

View File

@ -0,0 +1,47 @@
<script lang="ts">
import { Pagination as PaginationPrimitive } from 'bits-ui';
import { cn } from '$lib/utils.js';
import { pushState } from '$app/navigation';
let {
ref = $bindable(null),
class: className,
count = 0,
perPage = 10,
page = $bindable(1),
siblingCount = 1,
onPageChange,
...restProps
}: PaginationPrimitive.RootProps = $props();
</script>
<svelte:window
onpopstate={(state) => {
const sks = state.state['sveltekit:states'] as {} | string;
if (typeof sks === 'string' && sks.includes('#pagination-')) {
page = Number(sks.split('#pagination-')[1]);
onPageChange?.(page);
} else {
page = 1;
onPageChange?.(page);
}
}}
/>
<PaginationPrimitive.Root
bind:ref
bind:page
onPageChange={(p) => {
pushState('', `#pagination-${p}`);
onPageChange?.(p);
}}
role="navigation"
aria-label="pagination"
data-slot="pagination"
class={cn('mx-auto flex w-full justify-center', className)}
{count}
{perPage}
{siblingCount}
{...restProps}
/>