bits-ui 1.0.0-next.50 → 1.0.0-next.52
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -30,6 +30,8 @@ declare class PaginationRootState {
|
|
|
30
30
|
setPage: (page: number) => void;
|
|
31
31
|
getPageTriggerNodes: () => HTMLElement[];
|
|
32
32
|
getButtonNode: (type: "prev" | "next") => HTMLElement | null | undefined;
|
|
33
|
+
hasPrevPage: boolean;
|
|
34
|
+
hasNextPage: boolean;
|
|
33
35
|
prevPage: () => void;
|
|
34
36
|
nextPage: () => void;
|
|
35
37
|
snippetProps: {
|
|
@@ -79,6 +81,7 @@ declare class PaginationButtonState {
|
|
|
79
81
|
readonly id: string;
|
|
80
82
|
readonly "data-pagination-prev": "" | undefined;
|
|
81
83
|
readonly "data-pagination-next": "" | undefined;
|
|
84
|
+
readonly disabled: boolean;
|
|
82
85
|
readonly onpointerdown: (e: PointerEvent) => void;
|
|
83
86
|
readonly onpointerup: (e: PointerEvent) => void;
|
|
84
87
|
readonly onkeydown: (e: KeyboardEvent) => void;
|
|
@@ -62,6 +62,8 @@ class PaginationRootState {
|
|
|
62
62
|
return;
|
|
63
63
|
return node.querySelector(`[data-pagination-${type}]`);
|
|
64
64
|
};
|
|
65
|
+
hasPrevPage = $derived.by(() => this.page.current > 1);
|
|
66
|
+
hasNextPage = $derived.by(() => this.page.current < this.totalPages);
|
|
65
67
|
prevPage = () => {
|
|
66
68
|
this.page.current = Math.max(this.page.current - 1, 1);
|
|
67
69
|
};
|
|
@@ -153,6 +155,15 @@ class PaginationButtonState {
|
|
|
153
155
|
#action = () => {
|
|
154
156
|
this.type === "prev" ? this.#root.prevPage() : this.#root.nextPage();
|
|
155
157
|
};
|
|
158
|
+
#isDisabled = $derived.by(() => {
|
|
159
|
+
if (this.#disabled.current)
|
|
160
|
+
return true;
|
|
161
|
+
if (this.type === "prev")
|
|
162
|
+
return !this.#root.hasPrevPage;
|
|
163
|
+
if (this.type === "next")
|
|
164
|
+
return !this.#root.hasNextPage;
|
|
165
|
+
return false;
|
|
166
|
+
});
|
|
156
167
|
#onpointerdown = (e) => {
|
|
157
168
|
if (this.#disabled.current)
|
|
158
169
|
return;
|
|
@@ -181,6 +192,7 @@ class PaginationButtonState {
|
|
|
181
192
|
id: this.id.current,
|
|
182
193
|
[PREV_ATTR]: this.type === "prev" ? "" : undefined,
|
|
183
194
|
[NEXT_ATTR]: this.type === "next" ? "" : undefined,
|
|
195
|
+
disabled: this.#isDisabled,
|
|
184
196
|
//
|
|
185
197
|
onpointerdown: this.#onpointerdown,
|
|
186
198
|
onpointerup: this.#onpointerup,
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
{#if children}
|
|
23
23
|
{@render children?.()}
|
|
24
24
|
{:else}
|
|
25
|
-
<svg {width} {height} viewBox="0 0 30 10" preserveAspectRatio="none">
|
|
25
|
+
<svg {width} {height} viewBox="0 0 30 10" preserveAspectRatio="none" data-arrow="">
|
|
26
26
|
<polygon points="0,0 30,0 15,10" fill="currentColor" />
|
|
27
27
|
</svg>
|
|
28
28
|
{/if}
|