@ztwoint/z-ui 0.1.45 → 0.1.46
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/table/components/pagination/index.d.ts +1 -0
- package/dist/components/table/components/pagination/pagination.hook.d.ts +1 -1
- package/dist/components/table/components/pagination/pagination.hook.js +20 -16
- package/dist/components/table/components/table-filter/filters/checkbox.js +35 -51
- package/dist/components/table/components/table-filter/filters/text.js +41 -39
- package/dist/components/table/components/table-filter/index.d.ts +4 -1
- package/dist/components/table/components/table-filter/selected-filters-display/index.d.ts +2 -0
- package/dist/components/table/components/table-filter/selected-filters-display/selected-filters-display.d.ts +3 -0
- package/dist/components/table/components/table-filter/selected-filters-display/selected-filters-display.js +30 -0
- package/dist/components/table/components/table-filter/selected-filters-display/selected-filters-display.type.d.ts +12 -0
- package/dist/components/table/components/table-filter/selected-filters-display/selected-filters-display.utils.d.ts +6 -0
- package/dist/components/table/components/table-filter/selected-filters-display/selected-filters-display.utils.js +26 -0
- package/dist/components/table/components/table-filter/table-filter-button.d.ts +2 -0
- package/dist/components/table/components/table-filter/table-filter-button.js +103 -0
- package/dist/components/table/components/table-filter/table-filter-column-button.d.ts +3 -0
- package/dist/components/table/components/table-filter/table-filter-column-button.js +78 -0
- package/dist/components/table/components/table-filter/table-filter-column-button.type.d.ts +3 -0
- package/dist/components/table/components/table-filter/table-filter-provider.d.ts +14 -0
- package/dist/components/table/components/table-filter/table-filter-provider.js +32 -0
- package/dist/components/table/components/table-filter/table-filter.context.d.ts +21 -0
- package/dist/components/table/components/table-filter/table-filter.context.js +13 -0
- package/dist/components/table/components/table-filter/table-filter.hook.d.ts +1 -2
- package/dist/components/table/components/table-filter/table-filter.hook.js +39 -37
- package/dist/components/table/index.d.ts +1 -2
- package/dist/components/table/table-provider.d.ts +1 -1
- package/dist/components/table/table-provider.js +13 -13
- package/dist/components/table/table.type.d.ts +2 -0
- package/dist/components/table/table.utils.d.ts +0 -1
- package/dist/components/table/table.utils.js +5 -3
- package/dist/components/table-card/table-card.js +69 -64
- package/dist/components/table-card/table-card.type.d.ts +7 -7
- package/dist/css/styles/tailwind.css +1 -1
- package/dist/hooks/useClickOutside.d.ts +1 -0
- package/dist/hooks/useClickOutside.js +14 -0
- package/dist/index.js +107 -110
- package/dist/types/components/table/components/pagination/index.d.ts +1 -0
- package/dist/types/components/table/components/pagination/pagination.hook.d.ts +1 -1
- package/dist/types/components/table/components/table-filter/index.d.ts +4 -1
- package/dist/types/components/table/components/table-filter/selected-filters-display/index.d.ts +2 -0
- package/dist/types/components/table/components/table-filter/selected-filters-display/selected-filters-display.d.ts +3 -0
- package/dist/types/components/table/components/table-filter/selected-filters-display/selected-filters-display.type.d.ts +12 -0
- package/dist/types/components/table/components/table-filter/selected-filters-display/selected-filters-display.utils.d.ts +6 -0
- package/dist/types/components/table/components/table-filter/table-filter-button.d.ts +2 -0
- package/dist/types/components/table/components/table-filter/table-filter-column-button.d.ts +3 -0
- package/dist/types/components/table/components/table-filter/table-filter-column-button.type.d.ts +3 -0
- package/dist/types/components/table/components/table-filter/table-filter-provider.d.ts +14 -0
- package/dist/types/components/table/components/table-filter/table-filter.context.d.ts +21 -0
- package/dist/types/components/table/components/table-filter/table-filter.hook.d.ts +1 -2
- package/dist/types/components/table/index.d.ts +1 -2
- package/dist/types/components/table/table-provider.d.ts +1 -1
- package/dist/types/components/table/table.type.d.ts +2 -0
- package/dist/types/components/table/table.utils.d.ts +0 -1
- package/dist/types/components/table-card/table-card.type.d.ts +7 -7
- package/dist/types/hooks/useClickOutside.d.ts +1 -0
- package/package.json +2 -1
- package/dist/components/table/components/table-filter/table-filter.d.ts +0 -9
- package/dist/components/table/components/table-filter/table-filter.js +0 -120
- package/dist/types/components/table/components/table-filter/table-filter.d.ts +0 -9
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useClickOutside: (ref: React.RefObject<HTMLElement | null>, callback: () => void) => void;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { useEffect as r } from "react";
|
|
2
|
+
const s = (t, n) => {
|
|
3
|
+
r(() => {
|
|
4
|
+
function e(o) {
|
|
5
|
+
t.current && !t.current.contains(o.target) && n();
|
|
6
|
+
}
|
|
7
|
+
return document.addEventListener("mousedown", e), document.addEventListener("touchstart", e), () => {
|
|
8
|
+
document.removeEventListener("mousedown", e), document.removeEventListener("touchstart", e);
|
|
9
|
+
};
|
|
10
|
+
}, [t, n]);
|
|
11
|
+
};
|
|
12
|
+
export {
|
|
13
|
+
s as useClickOutside
|
|
14
|
+
};
|
package/dist/index.js
CHANGED
|
@@ -1,134 +1,132 @@
|
|
|
1
1
|
/* empty css */
|
|
2
|
-
import { Alert as p, AlertDescription as n, AlertTitle as
|
|
2
|
+
import { Alert as p, AlertDescription as n, AlertTitle as m } from "./components/alert/alert.js";
|
|
3
3
|
import { AlertCirclesIcon as f } from "./components/alert/icons/circles-icon.js";
|
|
4
4
|
import { Button as i, buttonVariants as Z } from "./components/button/button.js";
|
|
5
|
-
import { Z2SideNavBarProvider as
|
|
5
|
+
import { Z2SideNavBarProvider as S } from "./components/collapsible-side-nav-bar/side-nav-bar-provider.js";
|
|
6
6
|
import { Z2SideNavBar as D, Z2SidebarVariants as T } from "./components/collapsible-side-nav-bar/side-nav-bar.js";
|
|
7
|
-
import { Z2SideNavBarHeader as
|
|
7
|
+
import { Z2SideNavBarHeader as C } from "./components/collapsible-side-nav-bar/side-nav-bar-header.js";
|
|
8
8
|
import { Z2SideNavBarContent as w } from "./components/collapsible-side-nav-bar/side-nav-bar-content.js";
|
|
9
9
|
import { Z2SideNavBarFooter as s } from "./components/collapsible-side-nav-bar/side-nav-bar-footer.js";
|
|
10
10
|
import { Z2SideNavBarGroup as v } from "./components/collapsible-side-nav-bar/side-nav-bar-group.js";
|
|
11
11
|
import { Z2SideNavBarItem as M } from "./components/collapsible-side-nav-bar/side-nav-bar-item.js";
|
|
12
|
-
import { Z2SideNavBarSeparator as
|
|
13
|
-
import { useZ2SideNavBar as
|
|
12
|
+
import { Z2SideNavBarSeparator as P } from "./components/collapsible-side-nav-bar/side-nav-bar-separator.js";
|
|
13
|
+
import { useZ2SideNavBar as N } from "./components/collapsible-side-nav-bar/context.js";
|
|
14
14
|
import { Z2Popover as F } from "./components/collapsible-side-nav-bar/popover/popover.js";
|
|
15
15
|
import { ChevronUpIcon as _ } from "./components/assets/icons/chevron-up-icon.js";
|
|
16
16
|
import { default as h } from "./components/assets/icons/sub-nav-indicator.js";
|
|
17
|
-
import { default as
|
|
18
|
-
import { default as
|
|
17
|
+
import { default as R } from "./components/assets/icons/circles-icon.js";
|
|
18
|
+
import { default as V } from "./components/assets/icons/database-copy.js";
|
|
19
19
|
import { default as k } from "./components/assets/icons/window-left-copy.js";
|
|
20
20
|
import { default as J } from "./components/assets/icons/sidebar-left-show-copy.js";
|
|
21
21
|
import { SIDEBAR_WIDTH as Y, SIDEBAR_WIDTH_COLLAPSED as j } from "./components/collapsible-side-nav-bar/constants.js";
|
|
22
22
|
import { CountryFlags as z } from "./components/country-flags/country-flags.js";
|
|
23
|
-
import { Z2Dialog as X, Z2DialogClose as $, Z2DialogContent as oo, Z2DialogDescription as
|
|
24
|
-
import { DropdownContext as fo, Z2Dropdown as xo, Z2DropdownContent as io, Z2DropdownInput as Zo, Z2DropdownItem as
|
|
25
|
-
import { Z2DropdownMenu as
|
|
23
|
+
import { Z2Dialog as X, Z2DialogClose as $, Z2DialogContent as oo, Z2DialogDescription as ro, Z2DialogFooter as eo, Z2DialogHeader as to, Z2DialogOverlay as ao, Z2DialogPortal as po, Z2DialogTitle as no, Z2DialogTrigger as mo } from "./components/dialog/dialog.js";
|
|
24
|
+
import { DropdownContext as fo, Z2Dropdown as xo, Z2DropdownContent as io, Z2DropdownInput as Zo, Z2DropdownItem as So, Z2DropdownSub as uo, Z2DropdownSubContent as Do, Z2DropdownSubItem as To, Z2DropdownSubTrigger as bo } from "./components/dropdown/z2-dropdown.js";
|
|
25
|
+
import { Z2DropdownMenu as go, Z2DropdownMenuCheckboxItem as wo, Z2DropdownMenuContent as co, Z2DropdownMenuGroup as so, Z2DropdownMenuItem as Io, Z2DropdownMenuLabel as vo, Z2DropdownMenuPortal as Bo, Z2DropdownMenuRadioGroup as Mo, Z2DropdownMenuRadioItem as Ao, Z2DropdownMenuSeparator as Po, Z2DropdownMenuShortcut as Lo, Z2DropdownMenuSub as No, Z2DropdownMenuSubContent as Eo, Z2DropdownMenuSubTrigger as Fo, Z2DropdownMenuTrigger as Ho } from "./components/dropdown-menu/z2-dropdown-menu.js";
|
|
26
26
|
import { FileUploadArea as yo } from "./components/file-upload-area/file-upload-area.js";
|
|
27
|
-
import { DEFAULT_ACCEPT as
|
|
28
|
-
import { Input as
|
|
27
|
+
import { DEFAULT_ACCEPT as Go } from "./components/file-upload-area/file-upload-area.const.js";
|
|
28
|
+
import { Input as Uo } from "./components/input/input.js";
|
|
29
29
|
import { NavHeader as Wo } from "./components/nav-header/nav-header.js";
|
|
30
30
|
import { NavItem as Oo } from "./components/nav-header/nav-item/nav-item.js";
|
|
31
|
-
import { Z2Select as Qo, Z2SelectContent as Yo, Z2SelectGroup as jo, Z2SelectItem as qo, Z2SelectLabel as zo, Z2SelectScrollDownButton as Ko, Z2SelectScrollUpButton as Xo, Z2SelectSeparator as $o, Z2SelectTrigger as
|
|
32
|
-
import { Z2Stepper as
|
|
33
|
-
import { Z2StepperItem as
|
|
34
|
-
import { Z2Tabs as
|
|
35
|
-
import { Table as
|
|
36
|
-
import { TableBody as
|
|
37
|
-
import { extractCellValue as
|
|
38
|
-
import { DEFAULT_EMPTY_MESSAGE as
|
|
39
|
-
import { TableContext as
|
|
40
|
-
import { TableCell as
|
|
41
|
-
import { TextCell as
|
|
42
|
-
import { NumberCell as
|
|
43
|
-
import { BooleanCell as
|
|
44
|
-
import { TableHeader as
|
|
31
|
+
import { Z2Select as Qo, Z2SelectContent as Yo, Z2SelectGroup as jo, Z2SelectItem as qo, Z2SelectLabel as zo, Z2SelectScrollDownButton as Ko, Z2SelectScrollUpButton as Xo, Z2SelectSeparator as $o, Z2SelectTrigger as or, Z2SelectValue as rr } from "./components/select/z2-select.js";
|
|
32
|
+
import { Z2Stepper as tr } from "./components/stepper/stepper.js";
|
|
33
|
+
import { Z2StepperItem as pr } from "./components/stepper-item/stepper-item.js";
|
|
34
|
+
import { Z2Tabs as mr, Z2TabsContent as lr, Z2TabsList as fr, Z2TabsTrigger as xr } from "./components/tab/tab.js";
|
|
35
|
+
import { Table as Zr, TableProvider as dr } from "./components/table/table-provider.js";
|
|
36
|
+
import { TableBody as ur } from "./components/table/table.js";
|
|
37
|
+
import { extractCellValue as Tr } from "./components/table/table.utils.js";
|
|
38
|
+
import { DEFAULT_EMPTY_MESSAGE as Cr, TABLE_CSS_CLASSES as gr } from "./components/table/table.const.js";
|
|
39
|
+
import { TableContext as cr, useTableContext as sr } from "./components/table/table.context.js";
|
|
40
|
+
import { TableCell as vr } from "./components/table/components/table-cell.js";
|
|
41
|
+
import { TextCell as Mr } from "./components/table/components/cell/text-cell.js";
|
|
42
|
+
import { NumberCell as Pr } from "./components/table/components/cell/number-cell.js";
|
|
43
|
+
import { BooleanCell as Nr } from "./components/table/components/cell/boolean-cell.js";
|
|
44
|
+
import { TableHeader as Fr } from "./components/table/components/table-header/table-header.js";
|
|
45
45
|
import "react/jsx-runtime";
|
|
46
|
-
import { TableRow as
|
|
47
|
-
import { TableEmptyState as
|
|
48
|
-
import { TableLoadingState as
|
|
49
|
-
import { Pagination as
|
|
50
|
-
import { TableHeaderWrapper as
|
|
51
|
-
import { TableHeaderContent as
|
|
52
|
-
import { TableFooter as
|
|
53
|
-
import { TableFooterContent as
|
|
54
|
-
import { MagnifierIcon as
|
|
55
|
-
import {
|
|
56
|
-
import {
|
|
57
|
-
import { PaginationQuickJumper as ar } from "./components/table/components/pagination/components/pagination-quick-jumper.js";
|
|
46
|
+
import { TableRow as _r } from "./components/table/components/table-row.js";
|
|
47
|
+
import { TableEmptyState as hr } from "./components/table/components/table-empty-state.js";
|
|
48
|
+
import { TableLoadingState as Rr } from "./components/table/components/table-loading-state.js";
|
|
49
|
+
import { Pagination as Vr } from "./components/table/components/pagination/pagination.js";
|
|
50
|
+
import { TableHeaderWrapper as kr } from "./components/table/components/table-header-wrapper.js";
|
|
51
|
+
import { TableHeaderContent as Jr } from "./components/table/components/table-header-content.js";
|
|
52
|
+
import { TableFooter as Yr } from "./components/table/components/table-footer.js";
|
|
53
|
+
import { TableFooterContent as qr } from "./components/table/components/table-footer-content.js";
|
|
54
|
+
import { MagnifierIcon as Kr } from "./components/assets/icons/magnifier-icon.js";
|
|
55
|
+
import { PaginationInfo as $r } from "./components/table/components/pagination/components/pagination-info.js";
|
|
56
|
+
import { PaginationQuickJumper as re } from "./components/table/components/pagination/components/pagination-quick-jumper.js";
|
|
58
57
|
import "react";
|
|
59
|
-
import { Z2Tooltip as
|
|
60
|
-
import { default as
|
|
61
|
-
import { Badge as
|
|
62
|
-
import { Avatar as
|
|
63
|
-
import { InfoIcon as
|
|
64
|
-
import { useTheme as
|
|
65
|
-
import { cn as
|
|
66
|
-
import { Z2PopoverTrigger as
|
|
67
|
-
import { Z2PopoverContent as
|
|
58
|
+
import { Z2Tooltip as te } from "./components/tooltip/tooltip.js";
|
|
59
|
+
import { default as pe } from "./components/table-card/table-card.js";
|
|
60
|
+
import { Badge as me, badgeVariants as le } from "./components/badge/badge.js";
|
|
61
|
+
import { Avatar as xe, AvatarWithLabel as ie } from "./components/avatar/avatar.js";
|
|
62
|
+
import { InfoIcon as de } from "./components/assets/icons/info-icon.js";
|
|
63
|
+
import { useTheme as ue } from "./lib/theme.hook.js";
|
|
64
|
+
import { cn as Te } from "./lib/utils.js";
|
|
65
|
+
import { Z2PopoverTrigger as Ce } from "./components/collapsible-side-nav-bar/popover/popover-trigger.js";
|
|
66
|
+
import { Z2PopoverContent as we } from "./components/collapsible-side-nav-bar/popover/popover-content.js";
|
|
68
67
|
export {
|
|
69
68
|
p as Alert,
|
|
70
69
|
f as AlertCirclesIcon,
|
|
71
70
|
n as AlertDescription,
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
71
|
+
m as AlertTitle,
|
|
72
|
+
xe as Avatar,
|
|
73
|
+
ie as AvatarWithLabel,
|
|
74
|
+
me as Badge,
|
|
75
|
+
Nr as BooleanCell,
|
|
77
76
|
i as Button,
|
|
78
77
|
_ as ChevronUpIcon,
|
|
79
|
-
|
|
78
|
+
R as CirclesIcon,
|
|
80
79
|
z as CountryFlags,
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
80
|
+
Go as DEFAULT_ACCEPT,
|
|
81
|
+
Cr as DEFAULT_EMPTY_MESSAGE,
|
|
82
|
+
V as DatabaseCopy,
|
|
84
83
|
fo as DropdownContext,
|
|
85
84
|
yo as FileUploadArea,
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
85
|
+
de as InfoIcon,
|
|
86
|
+
Uo as Input,
|
|
87
|
+
Kr as MagnifierIcon,
|
|
89
88
|
Wo as NavHeader,
|
|
90
89
|
Oo as NavItem,
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
90
|
+
Pr as NumberCell,
|
|
91
|
+
$r as PaginationInfo,
|
|
92
|
+
re as PaginationQuickJumper,
|
|
94
93
|
Y as SIDEBAR_WIDTH,
|
|
95
94
|
j as SIDEBAR_WIDTH_COLLAPSED,
|
|
96
95
|
J as SidebarLeftShowCopy,
|
|
97
96
|
h as SubNavIndicator,
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
Ae as TextCell,
|
|
97
|
+
gr as TABLE_CSS_CLASSES,
|
|
98
|
+
Zr as Table,
|
|
99
|
+
ur as TableBody,
|
|
100
|
+
pe as TableCard,
|
|
101
|
+
vr as TableCell,
|
|
102
|
+
cr as TableContext,
|
|
103
|
+
hr as TableEmptyState,
|
|
104
|
+
Yr as TableFooter,
|
|
105
|
+
qr as TableFooterContent,
|
|
106
|
+
Fr as TableHeader,
|
|
107
|
+
Jr as TableHeaderContent,
|
|
108
|
+
kr as TableHeaderWrapper,
|
|
109
|
+
Rr as TableLoadingState,
|
|
110
|
+
Vr as TablePagination,
|
|
111
|
+
dr as TableProvider,
|
|
112
|
+
_r as TableRow,
|
|
113
|
+
Mr as TextCell,
|
|
116
114
|
k as WindowLeftCopy,
|
|
117
115
|
X as Z2Dialog,
|
|
118
116
|
$ as Z2DialogClose,
|
|
119
117
|
oo as Z2DialogContent,
|
|
120
|
-
|
|
121
|
-
|
|
118
|
+
ro as Z2DialogDescription,
|
|
119
|
+
eo as Z2DialogFooter,
|
|
122
120
|
to as Z2DialogHeader,
|
|
123
121
|
ao as Z2DialogOverlay,
|
|
124
122
|
po as Z2DialogPortal,
|
|
125
123
|
no as Z2DialogTitle,
|
|
126
|
-
|
|
124
|
+
mo as Z2DialogTrigger,
|
|
127
125
|
xo as Z2Dropdown,
|
|
128
126
|
io as Z2DropdownContent,
|
|
129
127
|
Zo as Z2DropdownInput,
|
|
130
|
-
|
|
131
|
-
|
|
128
|
+
So as Z2DropdownItem,
|
|
129
|
+
go as Z2DropdownMenu,
|
|
132
130
|
wo as Z2DropdownMenuCheckboxItem,
|
|
133
131
|
co as Z2DropdownMenuContent,
|
|
134
132
|
so as Z2DropdownMenuGroup,
|
|
@@ -137,19 +135,19 @@ export {
|
|
|
137
135
|
Bo as Z2DropdownMenuPortal,
|
|
138
136
|
Mo as Z2DropdownMenuRadioGroup,
|
|
139
137
|
Ao as Z2DropdownMenuRadioItem,
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
138
|
+
Po as Z2DropdownMenuSeparator,
|
|
139
|
+
Lo as Z2DropdownMenuShortcut,
|
|
140
|
+
No as Z2DropdownMenuSub,
|
|
143
141
|
Eo as Z2DropdownMenuSubContent,
|
|
144
142
|
Fo as Z2DropdownMenuSubTrigger,
|
|
145
143
|
Ho as Z2DropdownMenuTrigger,
|
|
146
|
-
|
|
144
|
+
uo as Z2DropdownSub,
|
|
147
145
|
Do as Z2DropdownSubContent,
|
|
148
146
|
To as Z2DropdownSubItem,
|
|
149
147
|
bo as Z2DropdownSubTrigger,
|
|
150
148
|
F as Z2Popover,
|
|
151
|
-
|
|
152
|
-
|
|
149
|
+
we as Z2PopoverContent,
|
|
150
|
+
Ce as Z2PopoverTrigger,
|
|
153
151
|
Qo as Z2Select,
|
|
154
152
|
Yo as Z2SelectContent,
|
|
155
153
|
jo as Z2SelectGroup,
|
|
@@ -158,30 +156,29 @@ export {
|
|
|
158
156
|
Ko as Z2SelectScrollDownButton,
|
|
159
157
|
Xo as Z2SelectScrollUpButton,
|
|
160
158
|
$o as Z2SelectSeparator,
|
|
161
|
-
|
|
162
|
-
|
|
159
|
+
or as Z2SelectTrigger,
|
|
160
|
+
rr as Z2SelectValue,
|
|
163
161
|
D as Z2SideNavBar,
|
|
164
162
|
w as Z2SideNavBarContent,
|
|
165
163
|
s as Z2SideNavBarFooter,
|
|
166
164
|
v as Z2SideNavBarGroup,
|
|
167
|
-
|
|
165
|
+
C as Z2SideNavBarHeader,
|
|
168
166
|
M as Z2SideNavBarItem,
|
|
169
|
-
|
|
170
|
-
|
|
167
|
+
S as Z2SideNavBarProvider,
|
|
168
|
+
P as Z2SideNavBarSeparator,
|
|
171
169
|
T as Z2SidebarVariants,
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
170
|
+
tr as Z2Stepper,
|
|
171
|
+
pr as Z2StepperItem,
|
|
172
|
+
mr as Z2Tabs,
|
|
173
|
+
lr as Z2TabsContent,
|
|
174
|
+
fr as Z2TabsList,
|
|
175
|
+
xr as Z2TabsTrigger,
|
|
176
|
+
te as Z2Tooltip,
|
|
177
|
+
le as badgeVariants,
|
|
180
178
|
Z as buttonVariants,
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
L as useZ2SideNavBar
|
|
179
|
+
Te as cn,
|
|
180
|
+
Tr as extractCellValue,
|
|
181
|
+
sr as useTableContext,
|
|
182
|
+
ue as useTheme,
|
|
183
|
+
N as useZ2SideNavBar
|
|
187
184
|
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export { Pagination, default } from './pagination';
|
|
2
|
+
export { PaginationInfo, PaginationQuickJumper } from './components';
|
|
2
3
|
export type { PaginationProps, PaginationInfoProps, PaginationQuickJumperProps, } from './pagination.type';
|
|
3
4
|
export { usePagination } from './pagination.hook';
|
|
4
5
|
export { usePaginationQuickJumper } from './components/pagination-quick-jumper.hook';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { PaginationHookProps, PaginationHookReturn } from './pagination.type';
|
|
2
|
-
export declare const usePagination: (
|
|
2
|
+
export declare const usePagination: ({ currentPage, totalPage, maxVisiblePages, }: PaginationHookProps) => PaginationHookReturn & {
|
|
3
3
|
goToPage: (page: number) => boolean;
|
|
4
4
|
canGoToPage: (page: number) => boolean;
|
|
5
5
|
};
|
|
@@ -1 +1,4 @@
|
|
|
1
|
-
export { TableFilter } from './table-filter';
|
|
1
|
+
export { TableFilterProvider, TableFilter } from './table-filter-provider';
|
|
2
|
+
export { TableFilterButton } from './table-filter-button';
|
|
3
|
+
export { TableFilterColumnButton } from './table-filter-column-button';
|
|
4
|
+
export { useTableFilterContext } from './table-filter.context';
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { FilterRule, TableSchema } from '../../../table.type';
|
|
2
|
+
export interface SelectedFilterDisplayProps {
|
|
3
|
+
selectedFilters: FilterRule[];
|
|
4
|
+
schema: TableSchema;
|
|
5
|
+
}
|
|
6
|
+
export interface FilterDisplayItem {
|
|
7
|
+
field: string;
|
|
8
|
+
fieldTitle: string;
|
|
9
|
+
value: string | string[];
|
|
10
|
+
condition?: string;
|
|
11
|
+
count?: number;
|
|
12
|
+
}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { FilterRule, TableSchema, FilterOption } from '../../../table.type';
|
|
2
|
+
import { FilterDisplayItem } from './selected-filters-display.type';
|
|
3
|
+
export declare const formatFilterValue: (value: string | string[]) => string;
|
|
4
|
+
export declare const getFilterCount: (filterRule: FilterRule, filterOptions?: FilterOption[]) => number | undefined;
|
|
5
|
+
export declare const createFilterDisplayItems: (selectedFilters: FilterRule[], schema: TableSchema) => FilterDisplayItem[];
|
|
6
|
+
export declare const calculateTotalCount: (filterDisplayItems: FilterDisplayItem[]) => number;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { TableFilterProps } from './table-filter.type';
|
|
3
|
+
import { TableFilterButton } from './table-filter-button';
|
|
4
|
+
import { TableFilterColumnButton } from './table-filter-column-button';
|
|
5
|
+
export interface TableFilterProviderProps extends TableFilterProps {
|
|
6
|
+
children: React.ReactNode;
|
|
7
|
+
}
|
|
8
|
+
export declare const TableFilterProvider: React.FC<TableFilterProviderProps>;
|
|
9
|
+
interface TableFilterCompoundComponent extends React.FC<TableFilterProviderProps> {
|
|
10
|
+
FilterButton: typeof TableFilterButton;
|
|
11
|
+
FilterColumnButton: typeof TableFilterColumnButton;
|
|
12
|
+
}
|
|
13
|
+
export declare const TableFilter: TableFilterCompoundComponent;
|
|
14
|
+
export {};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { TableSchema, TableFilter as TableFilterType, FilterRule } from '../../table.type';
|
|
3
|
+
import { FilterComponentType } from './table-filter.type';
|
|
4
|
+
export interface TableFilterContextValue {
|
|
5
|
+
selectedColumn: string | null;
|
|
6
|
+
setSelectedColumn: (column: string | null) => void;
|
|
7
|
+
getFilterForColumn: (columnKey: string) => FilterRule | undefined;
|
|
8
|
+
hasFilterForColumn: (columnKey: string) => boolean;
|
|
9
|
+
hasAppliedFilterForColumn: (columnKey: string) => boolean;
|
|
10
|
+
updateColumnFilter: (columnKey: string, condition?: string, value?: string | string[]) => void;
|
|
11
|
+
clearAllFilters: () => void;
|
|
12
|
+
applyFilters: () => void;
|
|
13
|
+
hasActiveFilters: boolean;
|
|
14
|
+
filterableFields: TableSchema;
|
|
15
|
+
tempFilters: FilterRule[];
|
|
16
|
+
schema: TableSchema;
|
|
17
|
+
filter: TableFilterType;
|
|
18
|
+
filterComponents?: Record<string, FilterComponentType>;
|
|
19
|
+
}
|
|
20
|
+
export declare const TableFilterContext: React.Context<TableFilterContextValue | undefined>;
|
|
21
|
+
export declare const useTableFilterContext: () => TableFilterContextValue;
|
|
@@ -2,16 +2,15 @@ import React from 'react';
|
|
|
2
2
|
import { TableFilterProps } from './table-filter.type';
|
|
3
3
|
import { FilterRule } from '../../table.type';
|
|
4
4
|
declare const useTableFilter: ({ filter, schema }: TableFilterProps) => {
|
|
5
|
-
isOpen: boolean;
|
|
6
5
|
selectedColumn: string | null;
|
|
7
6
|
setSelectedColumn: React.Dispatch<React.SetStateAction<string | null>>;
|
|
8
7
|
getFilterForColumn: (columnKey: string) => FilterRule | undefined;
|
|
9
8
|
hasFilterForColumn: (columnKey: string) => boolean;
|
|
9
|
+
hasAppliedFilterForColumn: (columnKey: string) => boolean;
|
|
10
10
|
updateColumnFilter: (columnKey: string, condition?: string, value?: string | string[]) => void;
|
|
11
11
|
clearAllFilters: () => void;
|
|
12
12
|
applyFilters: () => void;
|
|
13
13
|
hasActiveFilters: boolean;
|
|
14
|
-
setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
|
|
15
14
|
tempFilters: FilterRule[];
|
|
16
15
|
filterableFields: import("../../table.type").TableSchemaColumn[];
|
|
17
16
|
};
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
export { Table as default, Table, TableProvider } from './table-provider';
|
|
2
2
|
export { TableBody } from './table';
|
|
3
3
|
export type { TableProps, TableSchema, TableSchemaColumn, CellType, CellValue, CellRenderer, CellRendererProps, FilterRule, FilterCondition, FilterOption, TableFilter as TableFilterType, TablePaginationConfig, SortDirection, SortColumn, TableSort, } from './table.type';
|
|
4
|
-
export {
|
|
4
|
+
export { extractCellValue } from './table.utils';
|
|
5
5
|
export { DEFAULT_EMPTY_MESSAGE, TABLE_CSS_CLASSES } from './table.const';
|
|
6
6
|
export { TableContext, useTableContext } from './table.context';
|
|
7
7
|
export { TableCell, TableHeader, TableRow, TableEmptyState, TableLoadingState, TablePagination, TextCell, NumberCell, BooleanCell, TableHeaderWrapper, TableHeaderContent, TableFooter, TableFooterContent, } from './components';
|
|
8
|
-
export { TableFilter } from './components/table-filter';
|
|
9
8
|
export { PaginationInfo, PaginationQuickJumper } from './components/pagination/components';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { TableProps } from './table.type';
|
|
3
3
|
import { TableBody } from './table';
|
|
4
|
-
import { TableFilter } from './components/table-filter';
|
|
4
|
+
import { TableFilter } from './components/table-filter/table-filter-provider';
|
|
5
5
|
import { TableSearch } from './components/table-search';
|
|
6
6
|
import { Pagination } from './components/pagination';
|
|
7
7
|
import { TableHeaderWrapper, TableHeaderContent, TableFooter, TableFooterContent } from './components';
|
|
@@ -17,6 +17,7 @@ export type FilterRule = {
|
|
|
17
17
|
export type FilterOption = {
|
|
18
18
|
label: string;
|
|
19
19
|
value: string;
|
|
20
|
+
total?: number;
|
|
20
21
|
};
|
|
21
22
|
export type TableFilter = {
|
|
22
23
|
value: FilterRule[];
|
|
@@ -47,6 +48,7 @@ export type TableSort = {
|
|
|
47
48
|
};
|
|
48
49
|
export type TableSchemaColumn = {
|
|
49
50
|
key: string;
|
|
51
|
+
valueGetter?: (record: Record<string, any>) => string | number | boolean | null | undefined;
|
|
50
52
|
title: string;
|
|
51
53
|
cellType: CellType;
|
|
52
54
|
cellRenderer?: CellRenderer;
|
|
@@ -1,3 +1,2 @@
|
|
|
1
1
|
import { CellValue, TableSchemaColumn } from './table.type';
|
|
2
|
-
export declare const getNestedValue: (object: Record<string, unknown>, path: string) => CellValue;
|
|
3
2
|
export declare const extractCellValue: (record: Record<string, unknown>, column: TableSchemaColumn) => CellValue;
|
|
@@ -12,7 +12,10 @@ export interface TableCardProps {
|
|
|
12
12
|
search?: Partial<TableSearch> & {
|
|
13
13
|
className?: string;
|
|
14
14
|
};
|
|
15
|
-
filter?: Partial<TableFilter
|
|
15
|
+
filter?: Partial<TableFilter> & {
|
|
16
|
+
quickFilters?: string[];
|
|
17
|
+
showFilterButton?: boolean;
|
|
18
|
+
};
|
|
16
19
|
headerLeftContent?: React.ReactNode;
|
|
17
20
|
headerActions?: React.ReactNode;
|
|
18
21
|
body?: {
|
|
@@ -23,12 +26,9 @@ export interface TableCardProps {
|
|
|
23
26
|
};
|
|
24
27
|
showFooter?: boolean;
|
|
25
28
|
footerClassName?: string;
|
|
26
|
-
pagination?:
|
|
27
|
-
paginationInfo?:
|
|
28
|
-
|
|
29
|
-
totalItems: number;
|
|
30
|
-
};
|
|
31
|
-
paginationQuickJumper?: Partial<PaginationQuickJumperProps>;
|
|
29
|
+
pagination?: PaginationProps;
|
|
30
|
+
paginationInfo?: PaginationInfoProps;
|
|
31
|
+
paginationQuickJumper?: PaginationQuickJumperProps;
|
|
32
32
|
loading?: boolean;
|
|
33
33
|
emptyMessage?: string;
|
|
34
34
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useClickOutside: (ref: React.RefObject<HTMLElement | null>, callback: () => void) => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ztwoint/z-ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.46",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.js",
|
|
@@ -35,6 +35,7 @@
|
|
|
35
35
|
"lint": "eslint \"src/components/**/*.{js,jsx,ts,tsx}\" --ignore-pattern \"**/*.d.ts\" --ignore-pattern \"**/*.stories.tsx\"",
|
|
36
36
|
"lint:fix": "eslint \"src/components/**/*.{js,jsx,ts,tsx}\" --ignore-pattern \"**/*.d.ts\" --ignore-pattern \"**/*.stories.tsx\" --fix",
|
|
37
37
|
"format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,css,scss,md}\"",
|
|
38
|
+
"type-check": "tsc --noEmit --pretty",
|
|
38
39
|
"prepare": "husky"
|
|
39
40
|
},
|
|
40
41
|
"devDependencies": {
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { FilterComponentType } from './table-filter.type';
|
|
2
|
-
import { TableSchema, TableFilter as TableFilterType } from '../../table.type';
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
export interface TableFilterProps {
|
|
5
|
-
filterComponents?: Record<string, FilterComponentType>;
|
|
6
|
-
schema: TableSchema;
|
|
7
|
-
filter?: TableFilterType;
|
|
8
|
-
}
|
|
9
|
-
export declare const TableFilter: React.FC<TableFilterProps>;
|