@ztwoint/z-ui 0.1.86 → 0.1.88
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/components/assets/icons/index.d.ts +1 -0
- package/dist/components/assets/icons/table-cols-2.d.ts +8 -0
- package/dist/components/assets/icons/table-cols-2.js +60 -0
- package/dist/components/table-card/table-card.js +43 -42
- package/dist/components/table-card/table-card.type.d.ts +1 -1
- package/dist/components/table-filter/close-filter-confirm/filter-confirmation-dialog.d.ts +0 -1
- package/dist/components/table-filter/close-filter-confirm/filter-confirmation-dialog.js +14 -26
- package/dist/components/table-filter/filters/checkbox.js +28 -26
- package/dist/components/table-filter/selected-filters-display/selected-filters-display.js +23 -27
- package/dist/components/table-filter/selected-filters-display/selected-filters-display.type.d.ts +5 -3
- package/dist/components/table-filter/selected-filters-display/selected-filters-display.utils.d.ts +1 -4
- package/dist/components/table-filter/selected-filters-display/selected-filters-display.utils.js +11 -26
- package/dist/components/table-filter/table-filter-button.js +104 -88
- package/dist/components/table-filter/table-filter-column-button.d.ts +1 -1
- package/dist/components/table-filter/table-filter-column-button.js +74 -73
- package/dist/components/table-filter/table-filter-provider.js +11 -6
- package/dist/components/table-filter/table-filter.hook.d.ts +1 -2
- package/dist/components/table-filter/table-filter.hook.js +54 -45
- package/dist/components/table-filter/table-filter.type.d.ts +2 -1
- package/dist/components/table-filter/table-filter.utils.d.ts +2 -0
- package/dist/components/table-filter/table-filter.utils.js +12 -0
- package/dist/css/styles/tailwind.css +1 -1
- package/dist/index.js +21 -19
- package/dist/types/components/assets/icons/index.d.ts +1 -0
- package/dist/types/components/assets/icons/table-cols-2.d.ts +8 -0
- package/dist/types/components/table-card/table-card.type.d.ts +1 -1
- package/dist/types/components/table-filter/close-filter-confirm/filter-confirmation-dialog.d.ts +0 -1
- package/dist/types/components/table-filter/selected-filters-display/selected-filters-display.type.d.ts +5 -3
- package/dist/types/components/table-filter/selected-filters-display/selected-filters-display.utils.d.ts +1 -4
- package/dist/types/components/table-filter/table-filter-column-button.d.ts +1 -1
- package/dist/types/components/table-filter/table-filter.hook.d.ts +1 -2
- package/dist/types/components/table-filter/table-filter.type.d.ts +2 -1
- package/dist/types/components/table-filter/table-filter.utils.d.ts +2 -0
- package/package.json +1 -1
|
@@ -35,3 +35,4 @@ export { default as Z2Icon } from './z2-icon';
|
|
|
35
35
|
export { default as Z2SlashIcon } from './z2-slash';
|
|
36
36
|
export { default as Z2DataIcon } from './z2data';
|
|
37
37
|
export { default as Vector3Icon } from './vector_3';
|
|
38
|
+
export { default as TableCols2Icon } from './table-cols-2';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { SVGProps } from 'react';
|
|
2
|
+
type IconProps = SVGProps<SVGSVGElement> & {
|
|
3
|
+
secondaryfill?: string;
|
|
4
|
+
strokewidth?: number;
|
|
5
|
+
title?: string;
|
|
6
|
+
};
|
|
7
|
+
declare function TableCols2({ fill, secondaryfill, strokewidth, width, height, title, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export default TableCols2;
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import { jsxs as o, jsx as t } from "react/jsx-runtime";
|
|
2
|
+
function a({
|
|
3
|
+
fill: e = "currentColor",
|
|
4
|
+
secondaryfill: r,
|
|
5
|
+
strokewidth: n = 1,
|
|
6
|
+
width: i = "1em",
|
|
7
|
+
height: s = "1em",
|
|
8
|
+
title: d = "badge 13",
|
|
9
|
+
...h
|
|
10
|
+
}) {
|
|
11
|
+
return r = r || e, /* @__PURE__ */ o(
|
|
12
|
+
"svg",
|
|
13
|
+
{
|
|
14
|
+
height: s,
|
|
15
|
+
width: i,
|
|
16
|
+
viewBox: "0 0 20 20",
|
|
17
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
18
|
+
...h,
|
|
19
|
+
children: [
|
|
20
|
+
/* @__PURE__ */ t("title", { children: d }),
|
|
21
|
+
/* @__PURE__ */ o("g", { fill: e, children: [
|
|
22
|
+
/* @__PURE__ */ t(
|
|
23
|
+
"line",
|
|
24
|
+
{
|
|
25
|
+
fill: "none",
|
|
26
|
+
stroke: r,
|
|
27
|
+
strokeLinecap: "round",
|
|
28
|
+
strokeLinejoin: "round",
|
|
29
|
+
strokeWidth: n,
|
|
30
|
+
x1: "10",
|
|
31
|
+
x2: "10",
|
|
32
|
+
y1: "17",
|
|
33
|
+
y2: "3"
|
|
34
|
+
}
|
|
35
|
+
),
|
|
36
|
+
/* @__PURE__ */ t(
|
|
37
|
+
"rect",
|
|
38
|
+
{
|
|
39
|
+
height: "14",
|
|
40
|
+
width: "14",
|
|
41
|
+
fill: "none",
|
|
42
|
+
rx: "3",
|
|
43
|
+
ry: "3",
|
|
44
|
+
stroke: e,
|
|
45
|
+
strokeLinecap: "round",
|
|
46
|
+
strokeLinejoin: "round",
|
|
47
|
+
strokeWidth: "2",
|
|
48
|
+
transform: "translate(0 20) rotate(-90)",
|
|
49
|
+
x: "3",
|
|
50
|
+
y: "3"
|
|
51
|
+
}
|
|
52
|
+
)
|
|
53
|
+
] })
|
|
54
|
+
]
|
|
55
|
+
}
|
|
56
|
+
);
|
|
57
|
+
}
|
|
58
|
+
export {
|
|
59
|
+
a as default
|
|
60
|
+
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as e, jsxs as
|
|
1
|
+
import { jsx as e, jsxs as s } from "react/jsx-runtime";
|
|
2
2
|
import { Table as r } from "../table/table-provider.js";
|
|
3
3
|
import "react";
|
|
4
4
|
import { cn as d } from "../../lib/utils.js";
|
|
@@ -45,12 +45,12 @@ const we = ({
|
|
|
45
45
|
dataSource: w,
|
|
46
46
|
schema: B,
|
|
47
47
|
loading: b,
|
|
48
|
-
emptyMessage:
|
|
49
|
-
className:
|
|
50
|
-
rounded:
|
|
51
|
-
bordered:
|
|
48
|
+
emptyMessage: k,
|
|
49
|
+
className: H,
|
|
50
|
+
rounded: c = !0,
|
|
51
|
+
bordered: n = !0,
|
|
52
52
|
showHeader: g = !0,
|
|
53
|
-
headerClassName:
|
|
53
|
+
headerClassName: j,
|
|
54
54
|
search: m,
|
|
55
55
|
filter: t,
|
|
56
56
|
headerLeftContent: h,
|
|
@@ -63,35 +63,35 @@ const we = ({
|
|
|
63
63
|
showFooter: P = !0,
|
|
64
64
|
footerClassName: T,
|
|
65
65
|
pagination: o,
|
|
66
|
-
paginationInfo:
|
|
67
|
-
paginationQuickJumper:
|
|
66
|
+
paginationInfo: i,
|
|
67
|
+
paginationQuickJumper: a,
|
|
68
68
|
error: x = !1,
|
|
69
69
|
dataSourceError: _ = !1
|
|
70
70
|
}) => {
|
|
71
|
-
var
|
|
71
|
+
var F;
|
|
72
72
|
if (x)
|
|
73
|
-
return /* @__PURE__ */ e("div", { className: "flex flex-col items-center justify-center h-64 bg-background-error-subtle rounded-lg text-text-warning-secondary", children: /* @__PURE__ */
|
|
73
|
+
return /* @__PURE__ */ e("div", { className: "flex flex-col items-center justify-center h-64 bg-background-error-subtle rounded-lg text-text-warning-secondary", children: /* @__PURE__ */ s("div", { className: "flex gap-2", children: [
|
|
74
74
|
/* @__PURE__ */ e(S, { className: "mt-1.5" }),
|
|
75
|
-
/* @__PURE__ */
|
|
75
|
+
/* @__PURE__ */ s("div", { className: "flex flex-col gap-2", children: [
|
|
76
76
|
/* @__PURE__ */ e("div", { className: "text-text-error-primary text-lg font-medium", children: "Error loading data" }),
|
|
77
77
|
/* @__PURE__ */ e("div", { className: "text-sm", children: "Please try again later" }),
|
|
78
78
|
typeof x == "string" && /* @__PURE__ */ e("div", { className: "text-text-warning-secondary text-sm", children: x })
|
|
79
79
|
] })
|
|
80
80
|
] }) });
|
|
81
|
-
const C =
|
|
82
|
-
return /* @__PURE__ */
|
|
83
|
-
/* @__PURE__ */
|
|
84
|
-
g && v && /* @__PURE__ */
|
|
81
|
+
const C = a && a.totalPage && a.totalPage >= 2, N = o && o.totalPage && o.totalPage >= 2 || !!i || C, v = m || t || h || u, R = typeof (t == null ? void 0 : t.showFilterButton) > "u" ? !0 : t == null ? void 0 : t.showFilterButton;
|
|
82
|
+
return /* @__PURE__ */ s("div", { className: d("flex flex-col overflow-hidden relative", H), children: [
|
|
83
|
+
/* @__PURE__ */ s(r, { dataSource: w, schema: B, emptyMessage: k, children: [
|
|
84
|
+
g && v && /* @__PURE__ */ s(
|
|
85
85
|
r.Header,
|
|
86
86
|
{
|
|
87
87
|
className: d(
|
|
88
88
|
"flex-shrink-0",
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
89
|
+
n && "border-stroke-solid-medium border-1 border-b-0",
|
|
90
|
+
c && "rounded-t-xl",
|
|
91
|
+
j
|
|
92
92
|
),
|
|
93
93
|
children: [
|
|
94
|
-
/* @__PURE__ */
|
|
94
|
+
/* @__PURE__ */ s(r.HeaderContent, { children: [
|
|
95
95
|
h && h,
|
|
96
96
|
m && /* @__PURE__ */ e(
|
|
97
97
|
r.Search,
|
|
@@ -105,7 +105,7 @@ const we = ({
|
|
|
105
105
|
className: m.className
|
|
106
106
|
}
|
|
107
107
|
),
|
|
108
|
-
t && /* @__PURE__ */
|
|
108
|
+
t && /* @__PURE__ */ s(
|
|
109
109
|
p,
|
|
110
110
|
{
|
|
111
111
|
filterSchema: t.filterSchema,
|
|
@@ -113,11 +113,12 @@ const we = ({
|
|
|
113
113
|
value: t.value || [],
|
|
114
114
|
onChange: t.onChange || (() => {
|
|
115
115
|
}),
|
|
116
|
-
|
|
116
|
+
onFilterClick: t.onFilterClick,
|
|
117
|
+
loading: t.loading
|
|
117
118
|
},
|
|
118
119
|
children: [
|
|
119
120
|
R && /* @__PURE__ */ e(p.FilterButton, {}),
|
|
120
|
-
(
|
|
121
|
+
(F = t == null ? void 0 : t.quickFilters) == null ? void 0 : F.map((f) => /* @__PURE__ */ e(p.FilterColumnButton, { filterName: f }, f))
|
|
121
122
|
]
|
|
122
123
|
}
|
|
123
124
|
)
|
|
@@ -134,44 +135,44 @@ const we = ({
|
|
|
134
135
|
sort: l == null ? void 0 : l.sort,
|
|
135
136
|
className: d(
|
|
136
137
|
"flex-1 min-h-0",
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
138
|
+
n && "border-stroke-solid-light border-1",
|
|
139
|
+
c && !(g && v) && "rounded-t-xl",
|
|
140
|
+
c && !(P && N) && "rounded-b-xl",
|
|
141
|
+
n && "[&_td:first-child]:border-l-0 [&_td:last-child]:border-r-0",
|
|
142
|
+
n && "[&_th:first-child]:border-l-0 [&_th:last-child]:border-r-0",
|
|
142
143
|
l == null ? void 0 : l.className
|
|
143
144
|
),
|
|
144
145
|
stickyHeader: l == null ? void 0 : l.stickyHeader
|
|
145
146
|
}
|
|
146
147
|
),
|
|
147
|
-
P && N && /* @__PURE__ */
|
|
148
|
+
P && N && /* @__PURE__ */ s(
|
|
148
149
|
r.Footer,
|
|
149
150
|
{
|
|
150
151
|
className: d(
|
|
151
152
|
"flex-shrink-0 border-stroke-solid-light border-t-[0.5px] mt-[-2px]",
|
|
152
|
-
|
|
153
|
-
|
|
153
|
+
n && "border",
|
|
154
|
+
c && "rounded-b-xl",
|
|
154
155
|
T
|
|
155
156
|
),
|
|
156
157
|
children: [
|
|
157
|
-
|
|
158
|
+
i ? /* @__PURE__ */ e(r.FooterContent, { children: /* @__PURE__ */ e(
|
|
158
159
|
r.PaginationInfo,
|
|
159
160
|
{
|
|
160
|
-
showTotal:
|
|
161
|
-
totalItems:
|
|
162
|
-
currentPage:
|
|
163
|
-
itemsPerPage:
|
|
161
|
+
showTotal: i.showTotal,
|
|
162
|
+
totalItems: i.totalItems,
|
|
163
|
+
currentPage: i.currentPage,
|
|
164
|
+
itemsPerPage: i.itemsPerPage
|
|
164
165
|
}
|
|
165
|
-
) }) :
|
|
166
|
-
(
|
|
166
|
+
) }) : a || o ? /* @__PURE__ */ e(r.FooterContent, { children: null }) : null,
|
|
167
|
+
(a || o) && /* @__PURE__ */ s(r.FooterContent, { children: [
|
|
167
168
|
C && /* @__PURE__ */ e(
|
|
168
169
|
r.PaginationQuickJumper,
|
|
169
170
|
{
|
|
170
|
-
currentPage:
|
|
171
|
-
totalPage:
|
|
172
|
-
onChange:
|
|
171
|
+
currentPage: a.currentPage,
|
|
172
|
+
totalPage: a.totalPage,
|
|
173
|
+
onChange: a.onChange || (() => {
|
|
173
174
|
}),
|
|
174
|
-
disabled:
|
|
175
|
+
disabled: a.disabled
|
|
175
176
|
}
|
|
176
177
|
),
|
|
177
178
|
o && /* @__PURE__ */ e(
|
|
@@ -189,7 +190,7 @@ const we = ({
|
|
|
189
190
|
}
|
|
190
191
|
)
|
|
191
192
|
] }),
|
|
192
|
-
b && /* @__PURE__ */ e("div", { className: "absolute top-0 inset-0 w-full h-full bg-white/80 flex items-center justify-center", children: /* @__PURE__ */
|
|
193
|
+
b && /* @__PURE__ */ e("div", { className: "absolute top-0 inset-0 w-full h-full bg-white/80 flex items-center justify-center", children: /* @__PURE__ */ s("div", { className: "flex flex-col items-center gap-3", children: [
|
|
193
194
|
/* @__PURE__ */ e("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-text-brand-secondary" }),
|
|
194
195
|
/* @__PURE__ */ e("p", { className: "text-text-neutral-primary font-medium", children: "Loading..." })
|
|
195
196
|
] }) })
|
|
@@ -17,7 +17,7 @@ export interface TableCardProps {
|
|
|
17
17
|
quickFilters?: string[];
|
|
18
18
|
showFilterButton?: boolean;
|
|
19
19
|
filterSchema: FilterSchema;
|
|
20
|
-
|
|
20
|
+
onFilterClick?: (filters: FilterRule[], selectedColumn: string) => void;
|
|
21
21
|
};
|
|
22
22
|
headerLeftContent?: React.ReactNode;
|
|
23
23
|
headerActions?: React.ReactNode;
|
|
@@ -1,32 +1,20 @@
|
|
|
1
|
-
import { jsx as e, jsxs as
|
|
2
|
-
import { Button as
|
|
3
|
-
import { Z2Dialog as
|
|
4
|
-
const
|
|
1
|
+
import { jsx as e, jsxs as i } from "react/jsx-runtime";
|
|
2
|
+
import { Button as r } from "../../button/button.js";
|
|
3
|
+
import { Z2Dialog as a, Z2DialogContent as t, Z2DialogHeader as s, Z2DialogTitle as d, Z2DialogDescription as h, Z2DialogFooter as c } from "../../dialog/dialog.js";
|
|
4
|
+
const u = ({
|
|
5
5
|
onClose: l,
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
/* @__PURE__ */
|
|
12
|
-
/* @__PURE__ */ e(h, { children: "Unsaved Filter Changes" }),
|
|
13
|
-
/* @__PURE__ */ e(
|
|
14
|
-
i,
|
|
15
|
-
{
|
|
16
|
-
"aria-label": "Close",
|
|
17
|
-
className: "ml-4 p-2 text-xl leading-none font-bold bg-transparent border-none shadow-none hover:bg-gray-100 min-w-0 min-h-0",
|
|
18
|
-
onClick: o,
|
|
19
|
-
children: "×"
|
|
20
|
-
}
|
|
21
|
-
)
|
|
22
|
-
] }),
|
|
23
|
-
/* @__PURE__ */ e(c, { children: "You have unsaved filter changes. Would you like to keep these changes or revert to the previous state?" })
|
|
6
|
+
onRevertChanges: n,
|
|
7
|
+
onApplyChanges: o
|
|
8
|
+
}) => /* @__PURE__ */ e(a, { open: !0, onOpenChange: l, children: /* @__PURE__ */ i(t, { className: "max-w-md p-4 rounded-2xl", children: [
|
|
9
|
+
/* @__PURE__ */ i(s, { children: [
|
|
10
|
+
/* @__PURE__ */ e("div", { className: "flex justify-between", children: /* @__PURE__ */ e(d, { children: "Unsaved Filter Changes" }) }),
|
|
11
|
+
/* @__PURE__ */ e(h, { children: "You have unsaved filter changes. Would you like to keep these changes or revert to the previous state?" })
|
|
24
12
|
] }),
|
|
25
|
-
/* @__PURE__ */
|
|
26
|
-
/* @__PURE__ */ e(
|
|
27
|
-
/* @__PURE__ */ e(
|
|
13
|
+
/* @__PURE__ */ i(c, { children: [
|
|
14
|
+
/* @__PURE__ */ e(r, { onClick: n, variant: "stroke", shade: "danger", size: "small", children: "Discard" }),
|
|
15
|
+
/* @__PURE__ */ e(r, { onClick: o, variant: "filled", shade: "brand", size: "small", children: "Apply Changes" })
|
|
28
16
|
] })
|
|
29
17
|
] }) });
|
|
30
18
|
export {
|
|
31
|
-
|
|
19
|
+
u as FilterConfirmationDialog
|
|
32
20
|
};
|
|
@@ -1,61 +1,63 @@
|
|
|
1
|
-
import { jsx as t, jsxs as
|
|
2
|
-
import { useState as
|
|
1
|
+
import { jsx as t, jsxs as s } from "react/jsx-runtime";
|
|
2
|
+
import { useState as d, useEffect as h } from "react";
|
|
3
3
|
import { Virtuoso as k } from "react-virtuoso";
|
|
4
4
|
import { MagnifierIcon as y } from "../../assets/icons/magnifier-icon.js";
|
|
5
5
|
import S from "../../assets/icons/x.js";
|
|
6
6
|
import { Z2Checkbox as w } from "../../checkbox/checkbox.js";
|
|
7
|
-
const E = ({ value:
|
|
8
|
-
const [
|
|
9
|
-
|
|
10
|
-
const e =
|
|
7
|
+
const E = ({ value: n, onChange: f, filterOptions: r = [] }) => {
|
|
8
|
+
const [c, o] = d([]), [m, u] = d(""), [x, i] = d(r), p = (l) => {
|
|
9
|
+
u(l.target.value);
|
|
10
|
+
const e = r.filter(
|
|
11
11
|
(a) => a.label.toLowerCase().includes(l.target.value.toLowerCase())
|
|
12
12
|
);
|
|
13
|
-
|
|
13
|
+
i(e);
|
|
14
14
|
};
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
}, [
|
|
18
|
-
|
|
15
|
+
h(() => {
|
|
16
|
+
n && Array.isArray(n.value) ? o(n.value.filter(Boolean) ?? []) : o([]);
|
|
17
|
+
}, [n]), h(() => {
|
|
18
|
+
i(r);
|
|
19
|
+
}, [r]);
|
|
20
|
+
const b = (l, e) => {
|
|
19
21
|
let a;
|
|
20
|
-
e ? a = [...
|
|
21
|
-
},
|
|
22
|
-
|
|
23
|
-
},
|
|
24
|
-
/* @__PURE__ */
|
|
22
|
+
e ? a = [...c, l] : a = c.filter((N) => N !== l), o(a), f({ value: a });
|
|
23
|
+
}, C = () => {
|
|
24
|
+
u(""), i(r);
|
|
25
|
+
}, g = (l) => c.includes(l), v = (l, e) => /* @__PURE__ */ s("div", { className: "flex justify-between items-center py-2 px-3", children: [
|
|
26
|
+
/* @__PURE__ */ s("label", { className: "flex items-center space-x-2 cursor-pointer", children: [
|
|
25
27
|
/* @__PURE__ */ t(
|
|
26
28
|
w,
|
|
27
29
|
{
|
|
28
|
-
checked:
|
|
29
|
-
onCheckedChange: (a) =>
|
|
30
|
+
checked: g(e.value),
|
|
31
|
+
onCheckedChange: (a) => b(e.value, a === !0)
|
|
30
32
|
}
|
|
31
33
|
),
|
|
32
34
|
/* @__PURE__ */ t("span", { className: "text-text-neutral-primary leading-none-medium-sm", children: e.label })
|
|
33
35
|
] }),
|
|
34
|
-
e.total && /* @__PURE__ */
|
|
36
|
+
e.total && /* @__PURE__ */ s("span", { className: "text-text-neutral-muted text-sm", children: [
|
|
35
37
|
"[",
|
|
36
38
|
e.total,
|
|
37
39
|
"]"
|
|
38
40
|
] })
|
|
39
41
|
] });
|
|
40
|
-
return
|
|
41
|
-
/* @__PURE__ */
|
|
42
|
+
return r.length === 0 ? /* @__PURE__ */ t("div", { className: "text-text-neutral-muted text-sm p-4", children: "No filter options available for this column" }) : /* @__PURE__ */ s("div", { className: "flex flex-col h-full", children: [
|
|
43
|
+
/* @__PURE__ */ s("div", { className: "relative border-b border-stroke-solid-medium", children: [
|
|
42
44
|
/* @__PURE__ */ t(y, { className: "absolute left-3 top-3.5 text-text-neutral-muted" }),
|
|
43
45
|
/* @__PURE__ */ t(
|
|
44
46
|
"input",
|
|
45
47
|
{
|
|
46
48
|
placeholder: "Search options",
|
|
47
|
-
value:
|
|
48
|
-
onChange:
|
|
49
|
+
value: m,
|
|
50
|
+
onChange: p,
|
|
49
51
|
className: "border-none outline-none bg-surface-neutral-default text-text-neutral-primary rounded p-3 pl-8 leading-none-medium-sm w-full"
|
|
50
52
|
}
|
|
51
53
|
),
|
|
52
|
-
|
|
54
|
+
m && /* @__PURE__ */ t("span", { className: "absolute right-3 top-3.5", onClick: C, children: /* @__PURE__ */ t(S, {}) })
|
|
53
55
|
] }),
|
|
54
56
|
/* @__PURE__ */ t("div", { className: "flex-1", children: /* @__PURE__ */ t(
|
|
55
57
|
k,
|
|
56
58
|
{
|
|
57
|
-
data:
|
|
58
|
-
itemContent:
|
|
59
|
+
data: x,
|
|
60
|
+
itemContent: v,
|
|
59
61
|
className: "h-full min-h-60",
|
|
60
62
|
style: { height: "100%" },
|
|
61
63
|
overscan: 5
|
|
@@ -1,30 +1,26 @@
|
|
|
1
|
-
import { jsxs as e, jsx as
|
|
1
|
+
import { jsxs as e, jsx as t, Fragment as s } from "react/jsx-runtime";
|
|
2
2
|
import * as m from "react";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
"
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
c < l.length - 1 && /* @__PURE__ */ a("span", { className: "text-text-neutral-muted", children: "•" })
|
|
25
|
-
] }, t.field)) })
|
|
26
|
-
] });
|
|
27
|
-
};
|
|
3
|
+
const d = ({
|
|
4
|
+
selectedItems: n,
|
|
5
|
+
totalCount: l
|
|
6
|
+
}) => /* @__PURE__ */ e("div", { className: "flex flex-col gap-2.5 max-w-md", children: [
|
|
7
|
+
l > 0 && /* @__PURE__ */ e("span", { className: "text-text-neutral-primary leading-none-medium-sm", children: [
|
|
8
|
+
l.toLocaleString(),
|
|
9
|
+
" total"
|
|
10
|
+
] }),
|
|
11
|
+
/* @__PURE__ */ t("div", { className: "flex flex-wrap items-center gap-2.5 max-w-md", children: n.map((a, r) => /* @__PURE__ */ e(m.Fragment, { children: [
|
|
12
|
+
/* @__PURE__ */ t("div", { className: "inline-flex items-center text-text-neutral-secondary rounded-md leading-none-regular-sm", children: /* @__PURE__ */ e("span", { className: "text-text-neutral-muted", children: [
|
|
13
|
+
a.name,
|
|
14
|
+
" ",
|
|
15
|
+
a.total !== void 0 && /* @__PURE__ */ e(s, { children: [
|
|
16
|
+
"[",
|
|
17
|
+
/* @__PURE__ */ t("span", { className: "text-text-neutral-secondary", children: a.total.toLocaleString() }),
|
|
18
|
+
"]"
|
|
19
|
+
] })
|
|
20
|
+
] }) }),
|
|
21
|
+
r < n.length - 1 && /* @__PURE__ */ t("span", { className: "text-text-neutral-muted", children: "•" })
|
|
22
|
+
] }, a.name)) })
|
|
23
|
+
] });
|
|
28
24
|
export {
|
|
29
|
-
|
|
25
|
+
d as SelectedFiltersDisplay
|
|
30
26
|
};
|
package/dist/components/table-filter/selected-filters-display/selected-filters-display.type.d.ts
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
|
-
import { FilterRule, FilterSchema } from '../table-filter.type';
|
|
2
1
|
export interface SelectedFilterDisplayProps {
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
selectedItems: {
|
|
3
|
+
name: string;
|
|
4
|
+
total: number;
|
|
5
|
+
}[];
|
|
6
|
+
totalCount: number;
|
|
5
7
|
}
|
|
6
8
|
export interface FilterDisplayItem {
|
|
7
9
|
field: string;
|
package/dist/components/table-filter/selected-filters-display/selected-filters-display.utils.d.ts
CHANGED
|
@@ -1,6 +1,3 @@
|
|
|
1
|
-
import { FilterRule,
|
|
2
|
-
import { FilterDisplayItem } from './selected-filters-display.type';
|
|
1
|
+
import { FilterRule, FilterOption } from '../table-filter.type';
|
|
3
2
|
export declare const formatFilterValue: (value: string | string[]) => string;
|
|
4
3
|
export declare const getFilterCount: (filterRule: FilterRule, filterOptions?: FilterOption[]) => number | undefined;
|
|
5
|
-
export declare const createFilterDisplayItems: (selectedFilters: FilterRule[], schema: FilterSchema) => FilterDisplayItem[];
|
|
6
|
-
export declare const calculateTotalCount: (filterDisplayItems: FilterDisplayItem[]) => number;
|
package/dist/components/table-filter/selected-filters-display/selected-filters-display.utils.js
CHANGED
|
@@ -1,30 +1,15 @@
|
|
|
1
|
-
const
|
|
2
|
-
if (!
|
|
3
|
-
if (Array.isArray(
|
|
4
|
-
const
|
|
5
|
-
(
|
|
6
|
-
).reduce((
|
|
7
|
-
return
|
|
1
|
+
const r = (e, t) => {
|
|
2
|
+
if (!t || t.length === 0) return e.value !== "" ? 1 : 0;
|
|
3
|
+
if (Array.isArray(e.value)) {
|
|
4
|
+
const u = t.filter(
|
|
5
|
+
(n) => e.value.includes(n.value)
|
|
6
|
+
).reduce((n, o) => n + (o.total || 0), 0);
|
|
7
|
+
return u > 0 ? u : void 0;
|
|
8
8
|
} else {
|
|
9
|
-
const
|
|
10
|
-
return
|
|
9
|
+
const a = t.find((u) => u.value === e.value);
|
|
10
|
+
return a == null ? void 0 : a.total;
|
|
11
11
|
}
|
|
12
|
-
}
|
|
13
|
-
const t = o.find((u) => u.filterKey === e.field), r = t != null && t.options ? Object.entries(t.options).map(([u, l]) => ({
|
|
14
|
-
label: u,
|
|
15
|
-
value: u,
|
|
16
|
-
total: l
|
|
17
|
-
})) : void 0, a = c(e, r);
|
|
18
|
-
return {
|
|
19
|
-
field: e.field,
|
|
20
|
-
fieldTitle: (t == null ? void 0 : t.title) || e.field,
|
|
21
|
-
value: e.value,
|
|
22
|
-
condition: e.condition,
|
|
23
|
-
count: a
|
|
24
|
-
};
|
|
25
|
-
}), d = (n) => n.reduce((o, e) => o + (e.count || 1), 0);
|
|
12
|
+
};
|
|
26
13
|
export {
|
|
27
|
-
|
|
28
|
-
s as createFilterDisplayItems,
|
|
29
|
-
c as getFilterCount
|
|
14
|
+
r as getFilterCount
|
|
30
15
|
};
|