@hortiview/shared-components 2.29.0 → 2.30.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/CHANGELOG.md +30 -0
- package/GenericTableService-svNuHOet.js +98 -0
- package/assets/AllowedIconButton.css +1 -0
- package/assets/Filter.css +1 -1
- package/assets/GenericTableService.css +1 -0
- package/assets/Modal.css +1 -1
- package/components/AllowedIconButton/AllowedIconButton.js +22 -19
- package/components/Filter/Filter.js +84 -81
- package/components/GenericTable/GenericTable.d.ts +6 -1
- package/components/GenericTable/GenericTable.js +2771 -2739
- package/components/GenericTable/GenericTableService.d.ts +5 -1
- package/components/GenericTable/GenericTableService.js +6 -62
- package/components/Iconify/Iconify.js +4 -4
- package/components/Modal/Modal.js +100 -98
- package/package.json +1 -1
- package/types/GenericTable.d.ts +157 -5
- package/assets/GenericTable.css +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,33 @@
|
|
|
1
|
+
## [2.30.0](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/compare/v2.29.0...v2.30.0) (2026-07-29)
|
|
2
|
+
|
|
3
|
+
### Features
|
|
4
|
+
|
|
5
|
+
* add constrained height option and enhanced max-height behavior for GenericTable, improve resizable column handling, and update sticky column z-index styles ([7523e1c](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/7523e1c08649277473d2cf5732c05828cad49c55))
|
|
6
|
+
* add large icon font-size fix ([93e0332](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/93e03323297b6ec38f935ed8dd6c5fb4fcb9529a))
|
|
7
|
+
* add resizable and sticky column functionality to GenericTable, update docs and styles ([4b1fc39](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/4b1fc39483626e4da698a4e01e75ab4e406b0f0e))
|
|
8
|
+
* change filter icon ([8f0ba94](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/8f0ba941e5cf532e60839aa2735f57a69af4ac12))
|
|
9
|
+
* enhance GenericTable with resizable column keys, no-border option, and updated styles ([a3efed8](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/a3efed82a5e1606e5ae2ae09e5d6cc72c8e897a1))
|
|
10
|
+
* enhance Modal with better footerSupplemental and action alignment styling, clsx refactor ([a682aaf](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/a682aafec611d4011f3256d4b1981a12d997c2b4))
|
|
11
|
+
* replace season-end icon with new version ([76957d3](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/76957d3541b0b793daa22808b7163d3f3c8932d2))
|
|
12
|
+
* update GenericTable styles for better sticky header and column handling, remove unused scrollWrapper styling ([5d95a74](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/5d95a74a9ada59333a6357c599d575a183fadfed))
|
|
13
|
+
|
|
14
|
+
### Bug Fixes
|
|
15
|
+
|
|
16
|
+
* appply PR suggestions; icon color, style comments, docs ([c319f59](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/c319f59a41ccb78375261ad5282e05901e0361cf))
|
|
17
|
+
* style overrride for the sticky actions header ([7d71668](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/7d716684a7b53b8b8c4d1bb08e3c512ab750c4de))
|
|
18
|
+
* update fallback offsetHeight in GenericTable pagination calculation to prevent layout issues ([38128e5](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/38128e521590675c1787291dbe420f88def4d438))
|
|
19
|
+
* use currentColor for svg fill ([0a7cb31](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/0a7cb3152b7a6e1dd3b076c0fb5ce411b1ef3473))
|
|
20
|
+
|
|
21
|
+
### Documentation
|
|
22
|
+
|
|
23
|
+
* generic table dynamic height calculations ([2927482](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/2927482853b12d57b921719ba642fe29991280fd))
|
|
24
|
+
|
|
25
|
+
### Code Refactoring
|
|
26
|
+
|
|
27
|
+
* deprecate `tableElevationLevel`, update table styles, and remove unused code ([9086f5f](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/9086f5f2ef481a2da3d8f3b345295040b6c781cf))
|
|
28
|
+
* remove unnecessary overflow-y styling updates in GenericTable maxHeight logic ([f339105](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/f339105a7fcef87583eb19fdd85ffeb2af7aadd6))
|
|
29
|
+
* update filterButtonSize control to use select with options ([589bfa5](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/commit/589bfa5c7dbc72632dd12177f21842f3be7ce17c))
|
|
30
|
+
|
|
1
31
|
## [2.29.0](https://sdundc.visualstudio.com/HV%20Platform/_git/HortiView-Frontend-Shared/compare/v2.28.3...v2.29.0) (2026-07-22)
|
|
2
32
|
|
|
3
33
|
### Features
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
import { jsx as u } from "react/jsx-runtime";
|
|
2
|
+
import { useMemo as p } from "react";
|
|
3
|
+
import { ContextMenu as q } from "./components/ContextMenu/ContextMenu.js";
|
|
4
|
+
import './assets/GenericTableService.css';const g = "_topBar_7lsq9_1", B = "_leadingContent_7lsq9_5", v = "_filterBar_7lsq9_9", x = "_rowActions_7lsq9_14", y = "_start_7lsq9_20", C = "_emptyTable_7lsq9_25", A = "_tableContainer_7lsq9_33", m = "_table_7lsq9_33", w = "_noBorder_7lsq9_47", z = "_fullWidth_7lsq9_75", P = "_hasActions_7lsq9_104", F = "_resizable_7lsq9_112", I = "_stickyColumns_7lsq9_112", L = "_stickyFirst_7lsq9_113", N = "_stickyLast_7lsq9_114", j = {
|
|
5
|
+
topBar: g,
|
|
6
|
+
leadingContent: B,
|
|
7
|
+
filterBar: v,
|
|
8
|
+
rowActions: x,
|
|
9
|
+
start: y,
|
|
10
|
+
emptyTable: C,
|
|
11
|
+
tableContainer: A,
|
|
12
|
+
table: m,
|
|
13
|
+
noBorder: w,
|
|
14
|
+
fullWidth: z,
|
|
15
|
+
hasActions: P,
|
|
16
|
+
resizable: F,
|
|
17
|
+
stickyColumns: I,
|
|
18
|
+
stickyFirst: L,
|
|
19
|
+
stickyLast: N
|
|
20
|
+
}, K = ({
|
|
21
|
+
data: t = [],
|
|
22
|
+
order: s = [],
|
|
23
|
+
cellTemplates: e = void 0,
|
|
24
|
+
headerTranslation: r = (_) => _,
|
|
25
|
+
getRowActions: i = void 0,
|
|
26
|
+
customColumnWidth: o,
|
|
27
|
+
cardTitleColumn: c,
|
|
28
|
+
cardSubTitleColumn: a,
|
|
29
|
+
stickyColumns: f,
|
|
30
|
+
resizableColumns: d = []
|
|
31
|
+
}) => p(() => {
|
|
32
|
+
if (t?.length === 0) return [];
|
|
33
|
+
const _ = M(t[0], s).map((n) => {
|
|
34
|
+
const l = o ? o[n] : void 0, b = d ? d.includes(n) : !1;
|
|
35
|
+
return {
|
|
36
|
+
id: n,
|
|
37
|
+
header: r(n),
|
|
38
|
+
accessor: n,
|
|
39
|
+
cellTemplate: e ? e[n] : void 0,
|
|
40
|
+
cellProps: l ? { width: l } : void 0,
|
|
41
|
+
headerCellProps: l ? { width: l } : void 0,
|
|
42
|
+
asCardTitle: n === c,
|
|
43
|
+
asCardSubtitle: n === a,
|
|
44
|
+
disableResizing: !b,
|
|
45
|
+
width: Number.isInteger(l) ? Number(l) : 150
|
|
46
|
+
};
|
|
47
|
+
}), h = i ? [
|
|
48
|
+
..._,
|
|
49
|
+
{
|
|
50
|
+
id: "actions",
|
|
51
|
+
header: " ",
|
|
52
|
+
accessor: "actions",
|
|
53
|
+
cellProps: { id: "actions" },
|
|
54
|
+
headerCellProps: { id: "actions" },
|
|
55
|
+
disableResizing: !0,
|
|
56
|
+
width: 64
|
|
57
|
+
// 4rem
|
|
58
|
+
}
|
|
59
|
+
] : _;
|
|
60
|
+
return G(h, f);
|
|
61
|
+
}, [
|
|
62
|
+
t,
|
|
63
|
+
s,
|
|
64
|
+
i,
|
|
65
|
+
f,
|
|
66
|
+
o,
|
|
67
|
+
r,
|
|
68
|
+
e,
|
|
69
|
+
c,
|
|
70
|
+
a,
|
|
71
|
+
d
|
|
72
|
+
]), G = (t, s) => !s?.first && !s?.last || t.length === 0 ? t : t.map((e, r) => r === 0 && s?.first ? {
|
|
73
|
+
...e,
|
|
74
|
+
fixed: "leading"
|
|
75
|
+
} : r === t.length - 1 && s?.last ? {
|
|
76
|
+
...e,
|
|
77
|
+
fixed: "trailing"
|
|
78
|
+
} : e), S = ({
|
|
79
|
+
data: t = [],
|
|
80
|
+
getRowActions: s = void 0
|
|
81
|
+
}) => p(() => s ? t.map((e) => {
|
|
82
|
+
const r = s(e);
|
|
83
|
+
if (!r || r.length === 0) return e;
|
|
84
|
+
const i = /* @__PURE__ */ u("div", { className: j.rowActions, children: /* @__PURE__ */ u(q, { hoistToBody: !0, actions: r, iconOrientation: "horizontal" }) });
|
|
85
|
+
return { ...e, actions: i };
|
|
86
|
+
}) : t, [t, s]), M = (t, s) => {
|
|
87
|
+
if (!t) return [];
|
|
88
|
+
let e = Object.keys(t).map((r) => r);
|
|
89
|
+
return s?.length > 0 && (e = e.sort((r, i) => {
|
|
90
|
+
const o = s.findIndex((a) => a === r), c = s.findIndex((a) => a === i);
|
|
91
|
+
return o === -1 ? 1 : c === -1 ? -1 : o - c;
|
|
92
|
+
})), e;
|
|
93
|
+
};
|
|
94
|
+
export {
|
|
95
|
+
S as a,
|
|
96
|
+
j as s,
|
|
97
|
+
K as u
|
|
98
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._largeIconFix_10hc4_1 i[class*=lmnt-icon--large]{font-size:32px}
|
package/assets/Filter.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._filterButton_1qsua_1{width:15rem;height:100%!important;margin:0;border-radius:.25rem!important}._filterButton_1qsua_1,._filterButton_1qsua_1:hover,._filterButton_1qsua_1:focus,._filterButton_1qsua_1:active,._filterButton_1qsua_1:target,._filterButton_1qsua_1 [class^=mdc-button__ripple],._filterButton_1qsua_1:hover [class^=mdc-button__ripple],._filterButton_1qsua_1:focus [class^=mdc-button__ripple],._filterButton_1qsua_1:active [class^=mdc-button__ripple],._filterButton_1qsua_1:target [class^=mdc-button__ripple]{border-radius:.25rem!important}._relativeParent_1qsua_21{position:relative}._iconColor_1qsua_25{color:var(--lmnt-theme-primary)}._largeIconFix_1qsua_29 i[class*=lmnt-icon--large]{font-size:32px}._filterBadge_1qsua_33{position:absolute;top:0;right:0;transform:translate(50%,-50%)}._dense_1qsua_40,._dense_1qsua_40 div[class*=lmnt-select__anchor]{height:2.5rem!important}._filterModal_1qsua_45 [class="lmnt-modal__actions mdc-dialog__actions"]{margin-bottom:0!important}._borderRadius_1qsua_49 [class*=mdc-notched-outline__leading]{border-radius:.25rem 0 0 .25rem!important}._borderRadius_1qsua_49 [class*=mdc-notched-outline__trailing]{border-radius:0 .25rem .25rem 0!important}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._topBar_7lsq9_1 [class*=lmnt-table__top-bar__title]{display:none}._leadingContent_7lsq9_5{padding:.5rem 1rem}._filterBar_7lsq9_9{padding:unset;width:inherit!important}._rowActions_7lsq9_14{width:4rem;display:flex;justify-content:center}._start_7lsq9_20{padding-top:0;padding-bottom:0}._emptyTable_7lsq9_25{height:16rem}[class*=mnt-pagination][class*=mdc-data-table__pagination]{border-top:1px solid var(--lmnt-theme-on-secondary-stroke)}._tableContainer_7lsq9_33{display:contents}._elevation_7lsq9_37{border-radius:.4rem;width:100%}._elevation_7lsq9_37._noShadow_7lsq9_42{box-shadow:none!important;border-radius:0}._table_7lsq9_33._noBorder_7lsq9_47{border:none}._table_7lsq9_33,._table_7lsq9_33 [class*=mdc-data-table__table-container]{border-radius:.4rem}._table_7lsq9_33 *[id=actions]{width:44px;padding:0 2px;position:sticky;right:0;background-color:var(--lmnt-theme-background)}._table_7lsq9_33 tr:hover td[id=actions]{background-color:var(--table-bg-color-hover)}._noBorder_7lsq9_47{border:none}._fullWidth_7lsq9_75{width:100%}._table_7lsq9_33 [class*=mdc-data-table__row],._table_7lsq9_33 [class*=mdc-data-table__header-row]{width:-webkit-fill-available!important}._table_7lsq9_33 [class*=lmnt-table__header]{position:sticky;top:0;z-index:2!important;background-color:var(--lmnt-theme-background)}._table_7lsq9_33 [class*=lmnt-table__table]{min-width:max-content;width:100%}._table_7lsq9_33 [class*=mdc-data-table__row]>div:not(:last-child),._table_7lsq9_33 [class*=mdc-data-table__header-row]>div:not(:last-child){min-width:4.5rem}._table_7lsq9_33._hasActions_7lsq9_104 [class*=mdc-data-table__row]>div:last-child,._table_7lsq9_33._hasActions_7lsq9_104 [class*=mdc-data-table__header-row]>div:last-child{min-width:4rem}._table_7lsq9_33._resizable_7lsq9_112._stickyColumns_7lsq9_112 [class*=mdc-data-table__row]>div:not(:first-child):not(:last-child),._table_7lsq9_33._resizable_7lsq9_112._stickyColumns_7lsq9_112:not(._stickyFirst_7lsq9_113) [class*=mdc-data-table__row]>div:first-child,._table_7lsq9_33._resizable_7lsq9_112._stickyColumns_7lsq9_112:not(._stickyLast_7lsq9_114) [class*=mdc-data-table__row]>div:last-child{width:unset!important;flex:1!important;min-width:9.375rem}._table_7lsq9_33._resizable_7lsq9_112._stickyColumns_7lsq9_112 [class*=mdc-data-table__header-row]>div:not(:first-child):not(:last-child),._table_7lsq9_33._resizable_7lsq9_112._stickyColumns_7lsq9_112:not(._stickyFirst_7lsq9_113) [class*=mdc-data-table__header-row]>div:first-child,._table_7lsq9_33._resizable_7lsq9_112._stickyColumns_7lsq9_112:not(._stickyLast_7lsq9_114) [class*=mdc-data-table__header-row]>div:last-child{width:unset!important;flex:1!important;min-width:9.375rem}._table_7lsq9_33._stickyFirst_7lsq9_113 [class*=mdc-data-table__cell]:first-child,._table_7lsq9_33._stickyFirst_7lsq9_113 [class*=mdc-data-table__header-cell]:first-child{position:sticky!important;left:0;z-index:1!important;background-color:var(--lmnt-theme-background)}._table_7lsq9_33._stickyFirst_7lsq9_113 [class*=mdc-data-table__header-cell]:first-child{z-index:3!important}._table_7lsq9_33._stickyLast_7lsq9_114 [class*=mdc-data-table__cell]:last-child,._table_7lsq9_33._stickyLast_7lsq9_114 [class*=mdc-data-table__header-cell]:last-child{position:sticky!important;right:0;z-index:1!important;background-color:var(--lmnt-theme-background)}._table_7lsq9_33._stickyLast_7lsq9_114 [class*=mdc-data-table__header-cell]:last-child{z-index:3!important}._table_7lsq9_33._stickyFirst_7lsq9_113 tr:hover td:first-child,._table_7lsq9_33._stickyLast_7lsq9_114 tr:hover td:last-child{background-color:var(--table-bg-color-hover)}._table_7lsq9_33._resizable_7lsq9_112 [class*=lmnt-table__resize-handle]{border-left:.5rem solid transparent;border-right:.5rem solid transparent}._table_7lsq9_33 div[id=actions]{position:sticky!important}
|
package/assets/Modal.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._modal_3lh36_1{z-index:75}._modal_3lh36_1 div[class*=lmnt-modal__surface]{max-height:100svh!important;max-width:100svw!important}._modal_3lh36_1 div:not([class*=mdc-dialog--fullscreen]) div[class*=lmnt-modal__surface]{border-radius:1rem!important}._modal_3lh36_1 footer{margin-bottom:0!important}._gap_3lh36_18{gap:4px!important;padding-left:.5rem!important}._title_3lh36_23{header{display:flex;justify-content:start;padding-inline:0!important;>div{width:100%;margin-left:0!important}}}._titleWithoutCloseIcon_3lh36_36{margin-left:1rem!important}._closeButton_3lh36_40{color:var(--lmnt-theme-on-surface-inactive)}._closeButton_3lh36_40:before{display:none!important}._closeButton_3lh36_40:hover{background-color:var(--lmnt-theme-surface-variant)!important}._errorBanner_3lh36_52{width:100%}._headerActions_3lh36_56{margin-left:.5rem}._footerLayoutFixes_3lh36_66{footer[class*=lmnt-modal__actions]{justify-content:space-between!important;padding:0 .75rem .25rem}div[class*=lmnt-modal_actions_button]{margin:unset!important}}
|
|
@@ -1,26 +1,29 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { I as
|
|
3
|
-
import { Allowed as
|
|
4
|
-
const
|
|
1
|
+
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { I as d } from "../../index.es-BwhRJBEH.js";
|
|
3
|
+
import { Allowed as s } from "../Allowed/Allowed.js";
|
|
4
|
+
import '../../assets/AllowedIconButton.css';const m = "_largeIconFix_10hc4_1", I = {
|
|
5
|
+
largeIconFix: m
|
|
6
|
+
}, p = ({
|
|
5
7
|
"data-testid": t,
|
|
6
|
-
variant:
|
|
7
|
-
iconType:
|
|
8
|
-
size:
|
|
9
|
-
formId:
|
|
10
|
-
permissions:
|
|
11
|
-
entityIds:
|
|
12
|
-
...
|
|
13
|
-
}) => /* @__PURE__ */
|
|
14
|
-
|
|
8
|
+
variant: i = "filled-primary",
|
|
9
|
+
iconType: l = "filled",
|
|
10
|
+
size: o = "medium",
|
|
11
|
+
formId: n,
|
|
12
|
+
permissions: r,
|
|
13
|
+
entityIds: a,
|
|
14
|
+
...c
|
|
15
|
+
}) => /* @__PURE__ */ e(s, { neededPermissions: r, entityIds: a, children: /* @__PURE__ */ e(
|
|
16
|
+
d,
|
|
15
17
|
{
|
|
16
|
-
...
|
|
18
|
+
...c,
|
|
17
19
|
"data-testid": `allowed-icon-button-${t}`,
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
20
|
+
className: o === "large" ? I.largeIconFix : "",
|
|
21
|
+
form: n,
|
|
22
|
+
iconSize: o,
|
|
23
|
+
iconType: l,
|
|
24
|
+
variant: i
|
|
22
25
|
}
|
|
23
26
|
) });
|
|
24
27
|
export {
|
|
25
|
-
|
|
28
|
+
p as AllowedIconButton
|
|
26
29
|
};
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import { jsx as e, jsxs as B, Fragment as
|
|
2
|
-
import { N as
|
|
3
|
-
import { B as
|
|
1
|
+
import { jsx as e, jsxs as B, Fragment as W } from "react/jsx-runtime";
|
|
2
|
+
import { N as y } from "../../index.es-BIgjyLDa.js";
|
|
3
|
+
import { B as g } from "../../index.es-B9C7vzr4.js";
|
|
4
4
|
import { G as v } from "../../index.es-BE1XL1dD.js";
|
|
5
|
-
import { I as
|
|
6
|
-
import { S as
|
|
7
|
-
import { c as
|
|
5
|
+
import { I as j } from "../../index.es-BwhRJBEH.js";
|
|
6
|
+
import { S as z } from "../../index.es-DCWPAtXu.js";
|
|
7
|
+
import { c as N } from "../../index-_-9ybP20.js";
|
|
8
8
|
import { useState as b } from "react";
|
|
9
|
-
import { Iconify as
|
|
10
|
-
import { u as
|
|
9
|
+
import { Iconify as G } from "../Iconify/Iconify.js";
|
|
10
|
+
import { u as $ } from "../../useBreakpoints-DDrM9Cfx.js";
|
|
11
11
|
import "../../react-tooltip.min-DKaGxvdz.js";
|
|
12
12
|
import "../../orderBy-Ce85KqD6.js";
|
|
13
|
-
import { SearchBar as
|
|
13
|
+
import { SearchBar as H } from "../SearchBar/SearchBar.js";
|
|
14
14
|
import "../../index-CuHybtft.js";
|
|
15
15
|
import "../SharedComponentsPermissionProvider/PermissionContext.js";
|
|
16
16
|
import { Modal as K } from "../Modal/Modal.js";
|
|
@@ -24,90 +24,91 @@ import "../../isString-LDbI4UeI.js";
|
|
|
24
24
|
import "../../omit-DUqu4lDk.js";
|
|
25
25
|
import "../../types/Time.js";
|
|
26
26
|
import "../../react.esm-B3AK8zW1.js";
|
|
27
|
-
import '../../assets/Filter.css';const T = "
|
|
27
|
+
import '../../assets/Filter.css';const T = "_filterButton_1qsua_1", V = "_relativeParent_1qsua_21", E = "_iconColor_1qsua_25", J = "_largeIconFix_1qsua_29", Q = "_filterBadge_1qsua_33", U = "_dense_1qsua_40", X = "_filterModal_1qsua_45", Y = "_borderRadius_1qsua_49", l = {
|
|
28
28
|
filterButton: T,
|
|
29
29
|
relativeParent: V,
|
|
30
30
|
iconColor: E,
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
31
|
+
largeIconFix: J,
|
|
32
|
+
filterBadge: Q,
|
|
33
|
+
dense: U,
|
|
34
|
+
filterModal: X,
|
|
35
|
+
borderRadius: Y
|
|
35
36
|
}, yt = ({
|
|
36
37
|
clearFilterText: u,
|
|
37
38
|
closeCallback: d,
|
|
38
39
|
currentFilter: i,
|
|
39
|
-
filterButtonAsIcon:
|
|
40
|
-
filterButtonText:
|
|
40
|
+
filterButtonAsIcon: f = !1,
|
|
41
|
+
filterButtonText: c,
|
|
41
42
|
filterModalTitle: t,
|
|
42
|
-
filters:
|
|
43
|
+
filters: n,
|
|
43
44
|
modalCancelButtonText: m,
|
|
44
45
|
modalConfirmButtonText: h,
|
|
45
46
|
useModal: o = !0,
|
|
46
47
|
selectAllLabel: r,
|
|
47
|
-
filterButtonSize:
|
|
48
|
-
filterButtonClassName:
|
|
49
|
-
"data-testid":
|
|
48
|
+
filterButtonSize: k = "medium",
|
|
49
|
+
filterButtonClassName: I,
|
|
50
|
+
"data-testid": w
|
|
50
51
|
}) => {
|
|
51
|
-
const { isDesktop:
|
|
52
|
-
|
|
53
|
-
p.reduce((
|
|
52
|
+
const { isDesktop: A } = $(), [R, _] = b(!1), [p, x] = b(i), [O, C] = b(0), F = () => {
|
|
53
|
+
_(!1), d(p), C(
|
|
54
|
+
p.reduce((s, { filterValue: a }) => a === void 0 ? s : typeof a == "boolean" ? a ? s + 1 : s : Array.isArray(a) ? s + a.length : typeof a == "string" && a.length ? s + 1 : s, 0)
|
|
54
55
|
);
|
|
55
|
-
},
|
|
56
|
-
|
|
57
|
-
},
|
|
58
|
-
const
|
|
59
|
-
...p.filter((
|
|
60
|
-
|
|
56
|
+
}, P = () => {
|
|
57
|
+
x([]), C(0);
|
|
58
|
+
}, S = (s) => {
|
|
59
|
+
const a = [
|
|
60
|
+
...p.filter((D) => D.id !== s.id),
|
|
61
|
+
s
|
|
61
62
|
];
|
|
62
|
-
|
|
63
|
+
x(a), o || d(a);
|
|
63
64
|
};
|
|
64
|
-
return o ? /* @__PURE__ */ B(
|
|
65
|
+
return o ? /* @__PURE__ */ B(W, { children: [
|
|
65
66
|
/* @__PURE__ */ e(
|
|
66
|
-
|
|
67
|
+
Z,
|
|
67
68
|
{
|
|
68
|
-
filterButtonText:
|
|
69
|
-
filterButtonAsIcon:
|
|
70
|
-
count:
|
|
71
|
-
onClick: () =>
|
|
72
|
-
"data-testid":
|
|
73
|
-
filterButtonSize:
|
|
74
|
-
filterButtonClassName:
|
|
69
|
+
filterButtonText: c,
|
|
70
|
+
filterButtonAsIcon: f,
|
|
71
|
+
count: O,
|
|
72
|
+
onClick: () => _(!0),
|
|
73
|
+
"data-testid": w,
|
|
74
|
+
filterButtonSize: k,
|
|
75
|
+
filterButtonClassName: I
|
|
75
76
|
}
|
|
76
77
|
),
|
|
77
78
|
/* @__PURE__ */ e(
|
|
78
79
|
K,
|
|
79
80
|
{
|
|
80
|
-
open:
|
|
81
|
-
className:
|
|
82
|
-
onClose:
|
|
81
|
+
open: R,
|
|
82
|
+
className: l.filterModal,
|
|
83
|
+
onClose: F,
|
|
83
84
|
title: t,
|
|
84
|
-
modalSize:
|
|
85
|
-
headerActions: /* @__PURE__ */ e(
|
|
85
|
+
modalSize: A ? "small" : "fullscreen",
|
|
86
|
+
headerActions: /* @__PURE__ */ e(g, { "data-testid": "filter-clear-button", variant: "text", onClick: P, children: u }),
|
|
86
87
|
footerSupplemental: /* @__PURE__ */ e(
|
|
87
|
-
|
|
88
|
+
g,
|
|
88
89
|
{
|
|
89
90
|
"data-testid": "filter-cancel-button",
|
|
90
91
|
variant: "outlined",
|
|
91
|
-
onClick: () =>
|
|
92
|
+
onClick: () => _(!1),
|
|
92
93
|
children: m
|
|
93
94
|
}
|
|
94
95
|
),
|
|
95
|
-
actionButton: /* @__PURE__ */ e(
|
|
96
|
-
children: /* @__PURE__ */ e(v, { direction: "vertical", "data-testid": "filter-map-filters", children:
|
|
96
|
+
actionButton: /* @__PURE__ */ e(g, { "data-testid": "filter-confirm-button", variant: "filled", onClick: F, children: h }),
|
|
97
|
+
children: /* @__PURE__ */ e(v, { direction: "vertical", "data-testid": "filter-map-filters", children: q(n, p, S, r) })
|
|
97
98
|
}
|
|
98
99
|
)
|
|
99
|
-
] }) : /* @__PURE__ */ e(v, { secondaryAlign: "center", fullWidth: !0, children:
|
|
100
|
-
},
|
|
101
|
-
h ? /* @__PURE__ */ e(
|
|
100
|
+
] }) : /* @__PURE__ */ e(v, { secondaryAlign: "center", fullWidth: !0, children: q(n, p, S, r, !1) });
|
|
101
|
+
}, q = (u, d, i, f, c = !0) => u.map(({ id: t, title: n, availableOptions: m, icon: h, type: o }) => /* @__PURE__ */ B(v, { fullWidth: !0, secondaryAlign: "center", "data-testid": `filter-${o}-group-${t}`, children: [
|
|
102
|
+
h ? /* @__PURE__ */ e(G, { icon: h, iconSize: "medium" }) : null,
|
|
102
103
|
o === "select" && /* @__PURE__ */ e(
|
|
103
104
|
M,
|
|
104
105
|
{
|
|
105
106
|
"data-testid": `filter-select-${t}`,
|
|
106
|
-
selectAllLabel:
|
|
107
|
-
className: `${
|
|
107
|
+
selectAllLabel: f,
|
|
108
|
+
className: `${c ? void 0 : l.dense} ${l.borderRadius}`,
|
|
108
109
|
variant: "outlined",
|
|
109
110
|
options: m,
|
|
110
|
-
label:
|
|
111
|
+
label: n,
|
|
111
112
|
multiSelect: !0,
|
|
112
113
|
textKey: "text",
|
|
113
114
|
valueKey: "id",
|
|
@@ -117,53 +118,55 @@ import '../../assets/Filter.css';const T = "_filterButton_1qtzn_1", V = "_relati
|
|
|
117
118
|
menuMaxHeight: "300px",
|
|
118
119
|
disabled: t === "location",
|
|
119
120
|
showOptionFilter: !1,
|
|
120
|
-
dense: !
|
|
121
|
-
fixedHeightInput: !
|
|
122
|
-
multiDisplayType:
|
|
121
|
+
dense: !c,
|
|
122
|
+
fixedHeightInput: !c,
|
|
123
|
+
multiDisplayType: c ? "pills" : "text"
|
|
123
124
|
}
|
|
124
125
|
),
|
|
125
126
|
o === "toggle" && /* @__PURE__ */ e(
|
|
126
|
-
|
|
127
|
+
z,
|
|
127
128
|
{
|
|
128
129
|
"data-testid": `filter-switch-${t}`,
|
|
129
|
-
label:
|
|
130
|
+
label: n,
|
|
130
131
|
onChange: (r) => i({ id: t, type: o, filterValue: r }),
|
|
131
132
|
checked: !!d.find((r) => r.id === t)?.filterValue
|
|
132
133
|
}
|
|
133
134
|
),
|
|
134
135
|
o === "search" && /* @__PURE__ */ e(
|
|
135
|
-
|
|
136
|
+
H,
|
|
136
137
|
{
|
|
137
138
|
"data-testid": `filter-search-${t}`,
|
|
138
|
-
placeholder:
|
|
139
|
+
placeholder: n,
|
|
139
140
|
searchTerm: d.find((r) => r.id === t)?.filterValue,
|
|
140
|
-
className:
|
|
141
|
+
className: l.borderRadius,
|
|
141
142
|
setSearchTerm: (r) => i({ id: t, type: o, filterValue: r })
|
|
142
143
|
}
|
|
143
144
|
)
|
|
144
|
-
] }, t)),
|
|
145
|
+
] }, t)), Z = ({
|
|
145
146
|
filterButtonText: u,
|
|
146
147
|
filterButtonAsIcon: d,
|
|
147
148
|
count: i,
|
|
148
|
-
filterButtonSize:
|
|
149
|
-
filterButtonClassName:
|
|
149
|
+
filterButtonSize: f,
|
|
150
|
+
filterButtonClassName: c,
|
|
150
151
|
"data-testid": t,
|
|
151
|
-
onClick:
|
|
152
|
+
onClick: n
|
|
152
153
|
}) => {
|
|
153
|
-
const { isDesktop: m } =
|
|
154
|
+
const { isDesktop: m } = $();
|
|
154
155
|
return d ? /* @__PURE__ */ e(
|
|
155
|
-
|
|
156
|
+
j,
|
|
156
157
|
{
|
|
157
|
-
className:
|
|
158
|
+
className: N(l.iconColor, {
|
|
159
|
+
[l.largeIconFix]: f === "large"
|
|
160
|
+
}),
|
|
158
161
|
"data-testid": t ?? "filter-icon-button",
|
|
159
|
-
icon: "
|
|
160
|
-
onClick:
|
|
161
|
-
iconSize:
|
|
162
|
+
icon: "filter_list",
|
|
163
|
+
onClick: n,
|
|
164
|
+
iconSize: f,
|
|
162
165
|
badge: i !== 0 && /* @__PURE__ */ e(
|
|
163
|
-
|
|
166
|
+
y,
|
|
164
167
|
{
|
|
165
168
|
counter: i,
|
|
166
|
-
className:
|
|
169
|
+
className: l.filterBadge,
|
|
167
170
|
themeColor: "secondary",
|
|
168
171
|
"data-testid": "filter-badge"
|
|
169
172
|
}
|
|
@@ -173,28 +176,28 @@ import '../../assets/Filter.css';const T = "_filterButton_1qtzn_1", V = "_relati
|
|
|
173
176
|
"div",
|
|
174
177
|
{
|
|
175
178
|
"data-testid": t ?? "filter-button-container",
|
|
176
|
-
className:
|
|
179
|
+
className: l.relativeParent,
|
|
177
180
|
style: { height: "100%", width: m ? void 0 : "100%" },
|
|
178
181
|
children: [
|
|
179
182
|
/* @__PURE__ */ e(
|
|
180
|
-
|
|
183
|
+
g,
|
|
181
184
|
{
|
|
182
185
|
"data-testid": "filter-button",
|
|
183
186
|
variant: "outlined",
|
|
184
187
|
themeColor: "primary",
|
|
185
188
|
leadingIcon: "filter_list_alt",
|
|
186
|
-
onClick:
|
|
187
|
-
className:
|
|
189
|
+
onClick: n,
|
|
190
|
+
className: N(c, l.filterButton),
|
|
188
191
|
fullWidth: !m,
|
|
189
|
-
buttonSize:
|
|
192
|
+
buttonSize: f,
|
|
190
193
|
children: u
|
|
191
194
|
}
|
|
192
195
|
),
|
|
193
196
|
i !== 0 && /* @__PURE__ */ e(
|
|
194
|
-
|
|
197
|
+
y,
|
|
195
198
|
{
|
|
196
199
|
counter: i,
|
|
197
|
-
className:
|
|
200
|
+
className: l.filterBadge,
|
|
198
201
|
themeColor: "secondary",
|
|
199
202
|
"data-testid": "filter-badge"
|
|
200
203
|
}
|
|
@@ -61,6 +61,11 @@ import { TableLayoutProps } from '../../types/GenericTable';
|
|
|
61
61
|
* @param tableLayout layout of the table, can be 'standard' or 'flex'
|
|
62
62
|
* @param isOnline Whether the user is online; shows OfflineView when false.
|
|
63
63
|
* @param offlineViewProps Props forwarded to OfflineView when offline.
|
|
64
|
+
* @param resizableColumns Enables resizing handles for the specified columns. Be aware that sticky columns limit the resizable columns to the first column.
|
|
65
|
+
* @param stickyColumns pin the first and/or last column via CSS while scrolling horizontally; !! When combined with resizableColumns, only the first column can be resized, regardless of the resizableColumns keys. !!
|
|
66
|
+
* @param tableMaxHeight Set a max height in px that the table will be clamped to. Content rows will be scrollable if the whole table exceeds this height.
|
|
67
|
+
* @param noBorder Render the table without borders or the elevation
|
|
68
|
+
* @param disableRowsPerPageSelection Disable the rows per page selection dropdown
|
|
64
69
|
* @returns a table based on a given type and data
|
|
65
70
|
*/
|
|
66
|
-
export declare const GenericTable: <T>({ data, hiddenColumns, order, cellTemplates, tableActions, noContentText, headerTranslation, pagination, getRowActions, customColumnWidth, title, cardTitleColumn, cardSubTitleColumn, pageTranslation, pageOfTranslation, rowsPerPageTranslation, tableActionPosition,
|
|
71
|
+
export declare const GenericTable: <T>({ data, hiddenColumns, order, cellTemplates, tableActions, noContentText, headerTranslation, pagination, getRowActions, customColumnWidth, title, cardTitleColumn, cardSubTitleColumn, pageTranslation, pageOfTranslation, rowsPerPageTranslation, tableActionPosition, tableLayout, isOnline, offlineViewProps, resizableColumns, stickyColumns, tableMaxHeight, noBorder, disableRowsPerPageSelection, }: TableLayoutProps<T>) => import("react").JSX.Element;
|