@apipass/design-system 1.20.1 → 1.21.0
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.
- package/dist/lib/embedded-styles.js +1 -1
- package/dist/lib/lib.index.cjs +1 -1
- package/dist/lib/lib.index.js +688 -687
- package/dist/lib/style.css +1 -1
- package/dist/lib/ui/components/DataTable/DataTable.cjs +1 -1
- package/dist/lib/ui/components/DataTable/DataTable.cjs.map +1 -1
- package/dist/lib/ui/components/DataTable/DataTable.js +117 -171
- package/dist/lib/ui/components/DataTable/DataTable.js.map +1 -1
- package/dist/lib/ui/primitives/Pagination/Pagination.cjs +1 -1
- package/dist/lib/ui/primitives/Pagination/Pagination.cjs.map +1 -1
- package/dist/lib/ui/primitives/Pagination/Pagination.js +70 -55
- package/dist/lib/ui/primitives/Pagination/Pagination.js.map +1 -1
- package/dist/types/ui/primitives/Pagination/Pagination.d.ts +12 -2
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.cjs","sources":["../../../../../src/ui/primitives/Pagination/Pagination.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useMediaQuery } from \"hooks\";\nimport { IconArrowLeft, IconArrowRight } from \"icons\";\nimport type React from \"react\";\nimport { AnchorOrButton } from \"utils\";\nimport \"./pagination.css\";\n\nexport type
|
|
1
|
+
{"version":3,"file":"Pagination.cjs","sources":["../../../../../src/ui/primitives/Pagination/Pagination.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useMediaQuery } from \"hooks\";\nimport { IconArrowLeft, IconArrowRight } from \"icons\";\nimport type React from \"react\";\nimport { AnchorOrButton } from \"utils\";\nimport \"./pagination.css\";\n\nexport type PaginationManualProps = React.ComponentPropsWithoutRef<\"nav\">;\n\nexport type PaginationControlledProps = {\n page: number;\n totalPages: number;\n onPageChange: (page: number) => void;\n previousLabel: string;\n nextLabel: string;\n className?: string;\n};\n\nexport type PaginationProps = PaginationManualProps | PaginationControlledProps;\n\nfunction isControlledProps(\n props: PaginationProps,\n): props is PaginationControlledProps {\n return \"totalPages\" in props;\n}\n\nexport function Pagination(props: PaginationProps) {\n if (isControlledProps(props)) {\n const { page, totalPages, onPageChange, previousLabel, nextLabel, className } = props;\n if (totalPages <= 1) return null;\n return (\n <nav aria-label=\"Page navigation\" className={clsx(className, \"pagination\")}>\n <PaginationPrevious isDisabled={page <= 1} onPress={() => onPageChange(Math.max(1, page - 1))}>\n {previousLabel}\n </PaginationPrevious>\n <PaginationList>\n {buildPaginationPages(page, totalPages).map((p, i) =>\n p === \"...\" ? (\n <PaginationGap key={`gap-${i}`} />\n ) : (\n <PaginationPage key={p} current={p === page} onPress={() => onPageChange(p)}>\n {String(p)}\n </PaginationPage>\n ),\n )}\n </PaginationList>\n <PaginationNext isDisabled={page >= totalPages} onPress={() => onPageChange(Math.min(totalPages, page + 1))}>\n {nextLabel}\n </PaginationNext>\n </nav>\n );\n }\n const { \"aria-label\": ariaLabel = \"Page navigation\", className, ...rest } = props;\n return <nav aria-label={ariaLabel} {...rest} className={clsx(className, \"pagination\")} />;\n}\n\nexport function PaginationPrevious({\n href = null,\n onPress,\n isDisabled = false,\n children = \"Previous\",\n}: {\n href?: string | null;\n onPress?: () => void;\n isDisabled?: boolean;\n children?: React.ReactNode;\n}) {\n return (\n <AnchorOrButton\n {...(href !== null ? { href } : {})}\n onPress={onPress}\n isDisabled={isDisabled || (href === null && !onPress)}\n className={clsx(\"pagination-btn\", \"pagination-nav\")}\n aria-label=\"Previous page\"\n >\n <IconArrowLeft size=\"16\" />\n {children}\n </AnchorOrButton>\n );\n}\n\nexport function PaginationNext({\n href = null,\n onPress,\n isDisabled = false,\n children = \"Next\",\n}: {\n href?: string | null;\n onPress?: () => void;\n isDisabled?: boolean;\n children?: React.ReactNode;\n}) {\n return (\n <AnchorOrButton\n {...(href !== null ? { href } : {})}\n onPress={onPress}\n isDisabled={isDisabled || (href === null && !onPress)}\n className={clsx(\"pagination-btn\", \"pagination-nav\")}\n aria-label=\"Next page\"\n >\n {children}\n <IconArrowRight size=\"16\" />\n </AnchorOrButton>\n );\n}\n\nexport function PaginationList({ children }: { children: React.ReactNode }) {\n const { isTabletUp } = useMediaQuery();\n return isTabletUp && <span className=\"pagination-list\">{children}</span>;\n}\n\nexport function PaginationPage({\n href,\n onPress,\n children,\n current = false,\n}: {\n href?: string;\n onPress?: () => void;\n children: string;\n current?: boolean;\n}) {\n return (\n <AnchorOrButton\n {...(href ? { href } : {})}\n onPress={onPress}\n aria-label={`Page ${children}`}\n aria-current={current ? \"page\" : undefined}\n className={clsx(\"pagination-btn\", current && \"pagination-btn-active\")}\n >\n {children}\n </AnchorOrButton>\n );\n}\n\nexport function PaginationGap() {\n return (\n <div aria-hidden=\"true\" className=\"pagination-gap\">\n …\n </div>\n );\n}\n\nexport function buildPaginationPages(current: number, total: number): Array<number | \"...\"> {\n if (total <= 6) return Array.from({ length: total }, (_, i) => i + 1);\n const head = [1, 2, 3];\n const tail = [total - 1, total];\n if (current <= 4) return [...head, \"...\", ...tail];\n if (current >= total - 3) return [1, 2, \"...\", total - 2, total - 1, total];\n return [1, \"...\", current - 1, current, current + 1, \"...\", total];\n}\n"],"names":["isControlledProps","props","Pagination","page","totalPages","onPageChange","previousLabel","nextLabel","className","jsxs","clsx","jsx","PaginationPrevious","PaginationList","buildPaginationPages","p","i","PaginationGap","PaginationPage","PaginationNext","ariaLabel","rest","href","onPress","isDisabled","children","AnchorOrButton","IconArrowLeft","IconArrowRight","isTabletUp","useMediaQuery","current","total","_","head","tail"],"mappings":"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"}
|
|
@@ -1,91 +1,106 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { clsx as
|
|
1
|
+
import { jsxs as u, jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import { clsx as o } from "../../../vendor/clsx/dist/clsx.js";
|
|
3
3
|
/* empty css */
|
|
4
|
-
import { IconArrowLeft as
|
|
5
|
-
import { IconArrowRight as
|
|
6
|
-
import { useMediaQuery as
|
|
7
|
-
import { AnchorOrButton as
|
|
8
|
-
function
|
|
9
|
-
"
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
4
|
+
import { IconArrowLeft as d } from "../../icons/IconArrowLeft.js";
|
|
5
|
+
import { IconArrowRight as f } from "../../icons/IconArrowRight.js";
|
|
6
|
+
import { useMediaQuery as v } from "../../hooks/useMediaQuery.js";
|
|
7
|
+
import { AnchorOrButton as c } from "../../utils/AnchorOrButton.js";
|
|
8
|
+
function N(a) {
|
|
9
|
+
return "totalPages" in a;
|
|
10
|
+
}
|
|
11
|
+
function B(a) {
|
|
12
|
+
if (N(a)) {
|
|
13
|
+
const { page: t, totalPages: s, onPageChange: g, previousLabel: m, nextLabel: p, className: P } = a;
|
|
14
|
+
return s <= 1 ? null : /* @__PURE__ */ u("nav", { "aria-label": "Page navigation", className: o(P, "pagination"), children: [
|
|
15
|
+
/* @__PURE__ */ i(h, { isDisabled: t <= 1, onPress: () => g(Math.max(1, t - 1)), children: m }),
|
|
16
|
+
/* @__PURE__ */ i(L, { children: M(t, s).map(
|
|
17
|
+
(l, b) => l === "..." ? /* @__PURE__ */ i(D, {}, `gap-${b}`) : /* @__PURE__ */ i(A, { current: l === t, onPress: () => g(l), children: String(l) }, l)
|
|
18
|
+
) }),
|
|
19
|
+
/* @__PURE__ */ i(x, { isDisabled: t >= s, onPress: () => g(Math.min(s, t + 1)), children: p })
|
|
20
|
+
] });
|
|
21
|
+
}
|
|
22
|
+
const { "aria-label": n = "Page navigation", className: e, ...r } = a;
|
|
23
|
+
return /* @__PURE__ */ i("nav", { "aria-label": n, ...r, className: o(e, "pagination") });
|
|
15
24
|
}
|
|
16
|
-
function
|
|
25
|
+
function h({
|
|
17
26
|
href: a = null,
|
|
18
|
-
onPress:
|
|
19
|
-
isDisabled:
|
|
20
|
-
children:
|
|
27
|
+
onPress: n,
|
|
28
|
+
isDisabled: e = !1,
|
|
29
|
+
children: r = "Previous"
|
|
21
30
|
}) {
|
|
22
|
-
return /* @__PURE__ */
|
|
23
|
-
|
|
31
|
+
return /* @__PURE__ */ u(
|
|
32
|
+
c,
|
|
24
33
|
{
|
|
25
34
|
...a !== null ? { href: a } : {},
|
|
26
|
-
onPress:
|
|
27
|
-
isDisabled:
|
|
28
|
-
className:
|
|
35
|
+
onPress: n,
|
|
36
|
+
isDisabled: e || a === null && !n,
|
|
37
|
+
className: o("pagination-btn", "pagination-nav"),
|
|
29
38
|
"aria-label": "Previous page",
|
|
30
39
|
children: [
|
|
31
|
-
/* @__PURE__ */
|
|
32
|
-
|
|
40
|
+
/* @__PURE__ */ i(d, { size: "16" }),
|
|
41
|
+
r
|
|
33
42
|
]
|
|
34
43
|
}
|
|
35
44
|
);
|
|
36
45
|
}
|
|
37
46
|
function x({
|
|
38
47
|
href: a = null,
|
|
39
|
-
onPress:
|
|
40
|
-
isDisabled:
|
|
41
|
-
children:
|
|
48
|
+
onPress: n,
|
|
49
|
+
isDisabled: e = !1,
|
|
50
|
+
children: r = "Next"
|
|
42
51
|
}) {
|
|
43
|
-
return /* @__PURE__ */
|
|
44
|
-
|
|
52
|
+
return /* @__PURE__ */ u(
|
|
53
|
+
c,
|
|
45
54
|
{
|
|
46
55
|
...a !== null ? { href: a } : {},
|
|
47
|
-
onPress:
|
|
48
|
-
isDisabled:
|
|
49
|
-
className:
|
|
56
|
+
onPress: n,
|
|
57
|
+
isDisabled: e || a === null && !n,
|
|
58
|
+
className: o("pagination-btn", "pagination-nav"),
|
|
50
59
|
"aria-label": "Next page",
|
|
51
60
|
children: [
|
|
52
|
-
|
|
53
|
-
/* @__PURE__ */
|
|
61
|
+
r,
|
|
62
|
+
/* @__PURE__ */ i(f, { size: "16" })
|
|
54
63
|
]
|
|
55
64
|
}
|
|
56
65
|
);
|
|
57
66
|
}
|
|
58
|
-
function
|
|
59
|
-
const { isTabletUp:
|
|
60
|
-
return
|
|
67
|
+
function L({ children: a }) {
|
|
68
|
+
const { isTabletUp: n } = v();
|
|
69
|
+
return n && /* @__PURE__ */ i("span", { className: "pagination-list", children: a });
|
|
61
70
|
}
|
|
62
|
-
function
|
|
71
|
+
function A({
|
|
63
72
|
href: a,
|
|
64
|
-
onPress:
|
|
65
|
-
children:
|
|
66
|
-
current:
|
|
73
|
+
onPress: n,
|
|
74
|
+
children: e,
|
|
75
|
+
current: r = !1
|
|
67
76
|
}) {
|
|
68
|
-
return /* @__PURE__ */
|
|
69
|
-
|
|
77
|
+
return /* @__PURE__ */ i(
|
|
78
|
+
c,
|
|
70
79
|
{
|
|
71
80
|
...a ? { href: a } : {},
|
|
72
|
-
onPress:
|
|
73
|
-
"aria-label": `Page ${
|
|
74
|
-
"aria-current":
|
|
75
|
-
className:
|
|
76
|
-
children:
|
|
81
|
+
onPress: n,
|
|
82
|
+
"aria-label": `Page ${e}`,
|
|
83
|
+
"aria-current": r ? "page" : void 0,
|
|
84
|
+
className: o("pagination-btn", r && "pagination-btn-active"),
|
|
85
|
+
children: e
|
|
77
86
|
}
|
|
78
87
|
);
|
|
79
88
|
}
|
|
80
|
-
function
|
|
81
|
-
return /* @__PURE__ */
|
|
89
|
+
function D() {
|
|
90
|
+
return /* @__PURE__ */ i("div", { "aria-hidden": "true", className: "pagination-gap", children: "…" });
|
|
91
|
+
}
|
|
92
|
+
function M(a, n) {
|
|
93
|
+
if (n <= 6) return Array.from({ length: n }, (t, s) => s + 1);
|
|
94
|
+
const e = [1, 2, 3], r = [n - 1, n];
|
|
95
|
+
return a <= 4 ? [...e, "...", ...r] : a >= n - 3 ? [1, 2, "...", n - 2, n - 1, n] : [1, "...", a - 1, a, a + 1, "...", n];
|
|
82
96
|
}
|
|
83
97
|
export {
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
98
|
+
B as Pagination,
|
|
99
|
+
D as PaginationGap,
|
|
100
|
+
L as PaginationList,
|
|
87
101
|
x as PaginationNext,
|
|
88
|
-
|
|
89
|
-
|
|
102
|
+
A as PaginationPage,
|
|
103
|
+
h as PaginationPrevious,
|
|
104
|
+
M as buildPaginationPages
|
|
90
105
|
};
|
|
91
106
|
//# sourceMappingURL=Pagination.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.js","sources":["../../../../../src/ui/primitives/Pagination/Pagination.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useMediaQuery } from \"hooks\";\nimport { IconArrowLeft, IconArrowRight } from \"icons\";\nimport type React from \"react\";\nimport { AnchorOrButton } from \"utils\";\nimport \"./pagination.css\";\n\nexport type
|
|
1
|
+
{"version":3,"file":"Pagination.js","sources":["../../../../../src/ui/primitives/Pagination/Pagination.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useMediaQuery } from \"hooks\";\nimport { IconArrowLeft, IconArrowRight } from \"icons\";\nimport type React from \"react\";\nimport { AnchorOrButton } from \"utils\";\nimport \"./pagination.css\";\n\nexport type PaginationManualProps = React.ComponentPropsWithoutRef<\"nav\">;\n\nexport type PaginationControlledProps = {\n page: number;\n totalPages: number;\n onPageChange: (page: number) => void;\n previousLabel: string;\n nextLabel: string;\n className?: string;\n};\n\nexport type PaginationProps = PaginationManualProps | PaginationControlledProps;\n\nfunction isControlledProps(\n props: PaginationProps,\n): props is PaginationControlledProps {\n return \"totalPages\" in props;\n}\n\nexport function Pagination(props: PaginationProps) {\n if (isControlledProps(props)) {\n const { page, totalPages, onPageChange, previousLabel, nextLabel, className } = props;\n if (totalPages <= 1) return null;\n return (\n <nav aria-label=\"Page navigation\" className={clsx(className, \"pagination\")}>\n <PaginationPrevious isDisabled={page <= 1} onPress={() => onPageChange(Math.max(1, page - 1))}>\n {previousLabel}\n </PaginationPrevious>\n <PaginationList>\n {buildPaginationPages(page, totalPages).map((p, i) =>\n p === \"...\" ? (\n <PaginationGap key={`gap-${i}`} />\n ) : (\n <PaginationPage key={p} current={p === page} onPress={() => onPageChange(p)}>\n {String(p)}\n </PaginationPage>\n ),\n )}\n </PaginationList>\n <PaginationNext isDisabled={page >= totalPages} onPress={() => onPageChange(Math.min(totalPages, page + 1))}>\n {nextLabel}\n </PaginationNext>\n </nav>\n );\n }\n const { \"aria-label\": ariaLabel = \"Page navigation\", className, ...rest } = props;\n return <nav aria-label={ariaLabel} {...rest} className={clsx(className, \"pagination\")} />;\n}\n\nexport function PaginationPrevious({\n href = null,\n onPress,\n isDisabled = false,\n children = \"Previous\",\n}: {\n href?: string | null;\n onPress?: () => void;\n isDisabled?: boolean;\n children?: React.ReactNode;\n}) {\n return (\n <AnchorOrButton\n {...(href !== null ? { href } : {})}\n onPress={onPress}\n isDisabled={isDisabled || (href === null && !onPress)}\n className={clsx(\"pagination-btn\", \"pagination-nav\")}\n aria-label=\"Previous page\"\n >\n <IconArrowLeft size=\"16\" />\n {children}\n </AnchorOrButton>\n );\n}\n\nexport function PaginationNext({\n href = null,\n onPress,\n isDisabled = false,\n children = \"Next\",\n}: {\n href?: string | null;\n onPress?: () => void;\n isDisabled?: boolean;\n children?: React.ReactNode;\n}) {\n return (\n <AnchorOrButton\n {...(href !== null ? { href } : {})}\n onPress={onPress}\n isDisabled={isDisabled || (href === null && !onPress)}\n className={clsx(\"pagination-btn\", \"pagination-nav\")}\n aria-label=\"Next page\"\n >\n {children}\n <IconArrowRight size=\"16\" />\n </AnchorOrButton>\n );\n}\n\nexport function PaginationList({ children }: { children: React.ReactNode }) {\n const { isTabletUp } = useMediaQuery();\n return isTabletUp && <span className=\"pagination-list\">{children}</span>;\n}\n\nexport function PaginationPage({\n href,\n onPress,\n children,\n current = false,\n}: {\n href?: string;\n onPress?: () => void;\n children: string;\n current?: boolean;\n}) {\n return (\n <AnchorOrButton\n {...(href ? { href } : {})}\n onPress={onPress}\n aria-label={`Page ${children}`}\n aria-current={current ? \"page\" : undefined}\n className={clsx(\"pagination-btn\", current && \"pagination-btn-active\")}\n >\n {children}\n </AnchorOrButton>\n );\n}\n\nexport function PaginationGap() {\n return (\n <div aria-hidden=\"true\" className=\"pagination-gap\">\n …\n </div>\n );\n}\n\nexport function buildPaginationPages(current: number, total: number): Array<number | \"...\"> {\n if (total <= 6) return Array.from({ length: total }, (_, i) => i + 1);\n const head = [1, 2, 3];\n const tail = [total - 1, total];\n if (current <= 4) return [...head, \"...\", ...tail];\n if (current >= total - 3) return [1, 2, \"...\", total - 2, total - 1, total];\n return [1, \"...\", current - 1, current, current + 1, \"...\", total];\n}\n"],"names":["isControlledProps","props","Pagination","page","totalPages","onPageChange","previousLabel","nextLabel","className","jsxs","clsx","jsx","PaginationPrevious","PaginationList","buildPaginationPages","p","i","PaginationGap","PaginationPage","PaginationNext","ariaLabel","rest","href","onPress","isDisabled","children","AnchorOrButton","IconArrowLeft","IconArrowRight","isTabletUp","useMediaQuery","current","total","_","head","tail"],"mappings":"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"}
|
|
@@ -1,7 +1,16 @@
|
|
|
1
1
|
import type React from "react";
|
|
2
2
|
import "./pagination.css";
|
|
3
|
-
export type
|
|
4
|
-
export
|
|
3
|
+
export type PaginationManualProps = React.ComponentPropsWithoutRef<"nav">;
|
|
4
|
+
export type PaginationControlledProps = {
|
|
5
|
+
page: number;
|
|
6
|
+
totalPages: number;
|
|
7
|
+
onPageChange: (page: number) => void;
|
|
8
|
+
previousLabel: string;
|
|
9
|
+
nextLabel: string;
|
|
10
|
+
className?: string;
|
|
11
|
+
};
|
|
12
|
+
export type PaginationProps = PaginationManualProps | PaginationControlledProps;
|
|
13
|
+
export declare function Pagination(props: PaginationProps): import("react/jsx-runtime").JSX.Element | null;
|
|
5
14
|
export declare function PaginationPrevious({ href, onPress, isDisabled, children, }: {
|
|
6
15
|
href?: string | null;
|
|
7
16
|
onPress?: () => void;
|
|
@@ -24,3 +33,4 @@ export declare function PaginationPage({ href, onPress, children, current, }: {
|
|
|
24
33
|
current?: boolean;
|
|
25
34
|
}): import("react/jsx-runtime").JSX.Element;
|
|
26
35
|
export declare function PaginationGap(): import("react/jsx-runtime").JSX.Element;
|
|
36
|
+
export declare function buildPaginationPages(current: number, total: number): Array<number | "...">;
|