-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathPaging.tsx
58 lines (51 loc) · 1.34 KB
/
Paging.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
import * as React from "react"
import { Override, Data } from "framer"
// Learn more: https://framer.com/docs/overrides/
const pagedTableData = Data({
pageSize: 10,
pageIndex: 0,
pageCount: 0,
})
export function PageInfo(props): Override {
return {
text: `Page ${pagedTableData.pageIndex + 1} of ${
pagedTableData.pageCount
}`,
}
}
export function TablePaged(props): Override {
return {
pageSize: pagedTableData.pageSize,
pageIndex: pagedTableData.pageIndex,
onPageChange: ({ pageCount }) => (pagedTableData.pageCount = pageCount),
}
}
export function NextPage(props): Override {
return {
whileHover: { backgroundColor: "#EEE" },
onTap: () => {
pagedTableData.pageIndex = Math.min(
pagedTableData.pageIndex + 1,
pagedTableData.pageCount - 1
)
},
}
}
export function PreviousPage(props): Override {
return {
whileHover: { backgroundColor: "#EEE" },
onTap: () =>
(pagedTableData.pageIndex = Math.max(
pagedTableData.pageIndex - 1,
0
)),
}
}
export function PageSize(props): Override {
return {
onChange: v => {
//@ts-ignore
pagedTableData.pageSize = Number.parseInt(v)
},
}
}