@mittwald/flow-react-components 0.1.0-alpha.180 → 0.1.0-alpha.181
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/List.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
var r = (i, t, e) =>
|
|
3
|
+
var dt = Object.defineProperty;
|
|
4
|
+
var mt = (i, t, e) => t in i ? dt(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e;
|
|
5
|
+
var r = (i, t, e) => mt(i, typeof t != "symbol" ? t + "" : t, e);
|
|
6
6
|
import n, { createContext as ht, useContext as gt, createElement as W, useState as pt, useEffect as T, useRef as ft, cloneElement as bt } from "react";
|
|
7
7
|
import "./propsContext-DzAKlmhS.js";
|
|
8
8
|
import { P as St } from "./PropsContextProvider-C6Z4XGp6.js";
|
|
9
9
|
import "@react-aria/utils";
|
|
10
10
|
import { unique as vt, times as yt } from "remeda";
|
|
11
|
-
import { d as
|
|
11
|
+
import { d as Et } from "./dynamic-ClpUSmEt.js";
|
|
12
12
|
import { B as f } from "./Button-BRmT11B1.js";
|
|
13
13
|
import "@tabler/icons-react";
|
|
14
14
|
import "./Icon-BCN5qdXA.js";
|
|
15
|
-
import { I as
|
|
15
|
+
import { I as wt } from "./IconContextMenu-Cy6_2TgT.js";
|
|
16
16
|
import { a as x, C as Y } from "./ContextMenuTrigger-DuiGa0Zj.js";
|
|
17
17
|
import { M as Q } from "./MenuItem-Cb7EDu-b.js";
|
|
18
18
|
import { useLocalizedStringFormatter as b } from "react-aria";
|
|
@@ -28,20 +28,20 @@ import { T as It } from "./TextField-DhdMjRzb.js";
|
|
|
28
28
|
import { autorun as At, runInAction as kt, makeObservable as Vt, observable as O, computed as H, action as L } from "mobx";
|
|
29
29
|
import "./context-BB3_MApL.js";
|
|
30
30
|
import { u as xt } from "./useOnChange-C1Quwyuz.js";
|
|
31
|
-
import { getProperty as
|
|
32
|
-
import { useReactTable as
|
|
31
|
+
import { getProperty as Bt } from "dot-prop";
|
|
32
|
+
import { useReactTable as Pt, getCoreRowModel as Dt, getSortedRowModel as Nt, getFilteredRowModel as Rt, getPaginationRowModel as Mt, getFacetedUniqueValues as zt } from "@tanstack/react-table";
|
|
33
33
|
import _ from "invariant";
|
|
34
34
|
import { useLocalObservable as Ut } from "mobx-react-lite";
|
|
35
35
|
import { getAsyncResource as q } from "@mittwald/react-use-promise";
|
|
36
36
|
import { u as G } from "./useSelector-DpU7_HMO.js";
|
|
37
|
-
import * as
|
|
37
|
+
import * as B from "react-aria-components";
|
|
38
38
|
import { I as $t } from "./IllustratedMessage-B3MHD01M.js";
|
|
39
39
|
import { I as Ot } from "./IconSearch-Bxe-heXD.js";
|
|
40
40
|
import { H as tt } from "./Heading-1M1gRZfk.js";
|
|
41
41
|
import { S as I } from "./Skeleton-CgOx_15R.js";
|
|
42
42
|
import { d as y, a as K } from "./deepFindOfType-6pG0fH7S.js";
|
|
43
43
|
import { ListLoaderAsyncResource as Ht, TypedListLoaderAsyncResource as qt } from "./List/ListLoaderAsyncResource.js";
|
|
44
|
-
const Gt = "flow--list--items--item--view", Kt = "flow--list--items--item--view--title", jt = "flow--list--items--item--view--top-content", Jt = "flow--list--items--item--view--content", Wt = "flow--list--items--item--view--action", Yt = "flow--list--items--item--view--avatar", Qt = "flow--list--items--item--view--text", Xt = "flow--list--items--item--view--heading",
|
|
44
|
+
const Gt = "flow--list--items--item--view", Kt = "flow--list--items--item--view--title", jt = "flow--list--items--item--view--top-content", Jt = "flow--list--items--item--view--content", Wt = "flow--list--items--item--view--action", Yt = "flow--list--items--item--view--avatar", Qt = "flow--list--items--item--view--text", Xt = "flow--list--items--item--view--heading", m = {
|
|
45
45
|
view: Gt,
|
|
46
46
|
title: Kt,
|
|
47
47
|
topContent: jt,
|
|
@@ -84,43 +84,43 @@ const Gt = "flow--list--items--item--view", Kt = "flow--list--items--item--view-
|
|
|
84
84
|
className: t,
|
|
85
85
|
"aria-label": a.format("list.options")
|
|
86
86
|
},
|
|
87
|
-
/* @__PURE__ */ n.createElement(
|
|
87
|
+
/* @__PURE__ */ n.createElement(wt, null)
|
|
88
88
|
), e);
|
|
89
|
-
}, _t = (i) => i === "top" ?
|
|
89
|
+
}, _t = (i) => i === "top" ? m.topContent : i === "bottom" ? m.content : m.topContent, et = (i) => {
|
|
90
90
|
const { children: t, className: e, containerBreakpointSize: a = "m" } = i, s = {
|
|
91
91
|
ContextMenu: {
|
|
92
|
-
wrapWith: /* @__PURE__ */ n.createElement(Zt, { className:
|
|
92
|
+
wrapWith: /* @__PURE__ */ n.createElement(Zt, { className: m.action }),
|
|
93
93
|
placement: "bottom end"
|
|
94
94
|
},
|
|
95
95
|
Button: {
|
|
96
|
-
className:
|
|
96
|
+
className: m.action
|
|
97
97
|
},
|
|
98
98
|
Content: {
|
|
99
|
-
className:
|
|
99
|
+
className: Et((l) => _t(l.slot)),
|
|
100
100
|
tunnelId: "topContent"
|
|
101
101
|
},
|
|
102
102
|
Avatar: {
|
|
103
|
-
className:
|
|
103
|
+
className: m.avatar,
|
|
104
104
|
tunnelId: "title"
|
|
105
105
|
},
|
|
106
106
|
Heading: {
|
|
107
|
-
className:
|
|
107
|
+
className: m.heading,
|
|
108
108
|
level: 5,
|
|
109
109
|
tunnelId: "title"
|
|
110
110
|
},
|
|
111
111
|
Text: {
|
|
112
|
-
className:
|
|
112
|
+
className: m.text,
|
|
113
113
|
tunnelId: "title"
|
|
114
114
|
},
|
|
115
115
|
Link: {
|
|
116
116
|
unstyled: !0
|
|
117
117
|
}
|
|
118
118
|
}, o = C(
|
|
119
|
-
|
|
119
|
+
m.view,
|
|
120
120
|
e,
|
|
121
|
-
|
|
121
|
+
m[Ft(a)]
|
|
122
122
|
);
|
|
123
|
-
return /* @__PURE__ */ n.createElement("div", { className: o }, /* @__PURE__ */ n.createElement(St, { props: s }, /* @__PURE__ */ n.createElement(Ct, null, t, /* @__PURE__ */ n.createElement("div", { className:
|
|
123
|
+
return /* @__PURE__ */ n.createElement("div", { className: o }, /* @__PURE__ */ n.createElement(St, { props: s }, /* @__PURE__ */ n.createElement(Ct, null, t, /* @__PURE__ */ n.createElement("div", { className: m.title }, /* @__PURE__ */ n.createElement($, { id: "title" })), /* @__PURE__ */ n.createElement($, { id: "topContent" }))));
|
|
124
124
|
}, at = ht({}), h = () => gt(at).list, te = () => h().loader.getLoaderInvocationHooks().map((t, e) => /* @__PURE__ */ n.createElement(Tt, { key: e }, () => {
|
|
125
125
|
t();
|
|
126
126
|
})), ee = (i) => {
|
|
@@ -130,10 +130,10 @@ const Gt = "flow--list--items--item--view", Kt = "flow--list--items--item--view-
|
|
|
130
130
|
const { children: t, locales: e, variables: a } = i;
|
|
131
131
|
return b(e).format(t, a);
|
|
132
132
|
}, ae = () => {
|
|
133
|
-
const i = h(), t = i.
|
|
134
|
-
if (
|
|
133
|
+
const i = h(), t = i.visibleSorting.map((s) => /* @__PURE__ */ n.createElement(ee, { sorting: s, key: s.id }));
|
|
134
|
+
if (t.length === 0)
|
|
135
135
|
return null;
|
|
136
|
-
const e = i.
|
|
136
|
+
const e = i.visibleSorting.find((s) => s.isSorted()), a = /* @__PURE__ */ n.createElement(S, null, e ? /* @__PURE__ */ n.createElement(
|
|
137
137
|
A,
|
|
138
138
|
{
|
|
139
139
|
locales: g,
|
|
@@ -155,19 +155,19 @@ const Gt = "flow--list--items--item--view", Kt = "flow--list--items--item--view-
|
|
|
155
155
|
t
|
|
156
156
|
));
|
|
157
157
|
}, se = (i) => {
|
|
158
|
-
const { filter: t } = i, { values: e, mode: a, name: s, property: o } = t, l = e.map((u) => /* @__PURE__ */ n.createElement(Q, { key: t.getValueId(u), id: String(u) }, String(u))), c = e.filter((u) => t.isValueActive(u)).map((u) => String(u)),
|
|
158
|
+
const { filter: t } = i, { values: e, mode: a, name: s, property: o } = t, l = e.map((u) => /* @__PURE__ */ n.createElement(Q, { key: t.getValueId(u), id: String(u) }, String(u))), c = e.filter((u) => t.isValueActive(u)).map((u) => String(u)), d = (u) => {
|
|
159
159
|
t.toggleValue(u);
|
|
160
160
|
};
|
|
161
161
|
return /* @__PURE__ */ n.createElement(x, null, /* @__PURE__ */ n.createElement(f, { variant: "soft", size: "s", color: "secondary" }, /* @__PURE__ */ n.createElement(S, null, s ?? o), /* @__PURE__ */ n.createElement(X, null)), /* @__PURE__ */ n.createElement(
|
|
162
162
|
Y,
|
|
163
163
|
{
|
|
164
|
-
onAction:
|
|
164
|
+
onAction: d,
|
|
165
165
|
selectionMode: a === "one" ? "single" : "multiple",
|
|
166
166
|
selectedKeys: c
|
|
167
167
|
},
|
|
168
168
|
l
|
|
169
169
|
));
|
|
170
|
-
}, ie = "flow--list--header", ne = "flow--list--header--picker-list-and-search", re = "flow--list--header--picker-list", oe = "flow--list--header--search-field",
|
|
170
|
+
}, ie = "flow--list--header", ne = "flow--list--header--picker-list-and-search", re = "flow--list--header--picker-list", oe = "flow--list--header--search-field", E = {
|
|
171
171
|
header: ie,
|
|
172
172
|
pickerListAndSearch: ne,
|
|
173
173
|
pickerList: re,
|
|
@@ -199,12 +199,12 @@ const Gt = "flow--list--items--item--view", Kt = "flow--list--items--item--view-
|
|
|
199
199
|
},
|
|
200
200
|
/* @__PURE__ */ n.createElement(A, { locales: g }, "list.resetAll")
|
|
201
201
|
));
|
|
202
|
-
},
|
|
202
|
+
}, de = (i) => {
|
|
203
203
|
const { className: t, onChange: e, value: a, ...s } = i, o = b(g), [l, c] = pt(a ?? "");
|
|
204
204
|
xt(a, () => {
|
|
205
205
|
c(a ?? "");
|
|
206
206
|
}, [l]);
|
|
207
|
-
const
|
|
207
|
+
const d = o.format("list.search"), u = () => {
|
|
208
208
|
e(void 0), c("");
|
|
209
209
|
}, v = (p) => {
|
|
210
210
|
p.key === "Enter" ? l.trim() === "" ? e(void 0) : e(l) : p.key === "Escape" && u();
|
|
@@ -213,8 +213,8 @@ const Gt = "flow--list--items--item--view", Kt = "flow--list--items--item--view-
|
|
|
213
213
|
It,
|
|
214
214
|
{
|
|
215
215
|
style: { flexGrow: "1" },
|
|
216
|
-
"aria-label":
|
|
217
|
-
placeholder:
|
|
216
|
+
"aria-label": d,
|
|
217
|
+
placeholder: d,
|
|
218
218
|
value: l,
|
|
219
219
|
onKeyUp: v,
|
|
220
220
|
onChange: (p) => c(p),
|
|
@@ -231,8 +231,8 @@ const Gt = "flow--list--items--item--view", Kt = "flow--list--items--item--view-
|
|
|
231
231
|
},
|
|
232
232
|
/* @__PURE__ */ n.createElement(Z, null)
|
|
233
233
|
));
|
|
234
|
-
},
|
|
235
|
-
const { className: t, search: e } = i, a = e.render ??
|
|
234
|
+
}, me = (i) => {
|
|
235
|
+
const { className: t, search: e } = i, a = e.render ?? de;
|
|
236
236
|
return W(a, {
|
|
237
237
|
className: t,
|
|
238
238
|
value: e.value,
|
|
@@ -240,8 +240,11 @@ const Gt = "flow--list--items--item--view", Kt = "flow--list--items--item--view-
|
|
|
240
240
|
...e.textFieldProps
|
|
241
241
|
});
|
|
242
242
|
}, he = (i) => {
|
|
243
|
-
const { className: t } = i, e = h()
|
|
244
|
-
|
|
243
|
+
const { className: t } = i, e = h();
|
|
244
|
+
if (e.filters.length === 0 && e.visibleSorting.length === 0 && !e.search)
|
|
245
|
+
return null;
|
|
246
|
+
const a = e.filters.map((s) => /* @__PURE__ */ n.createElement(se, { key: s.property, filter: s }));
|
|
247
|
+
return /* @__PURE__ */ n.createElement("div", { className: C(t, E.header) }, /* @__PURE__ */ n.createElement("div", { className: E.pickerListAndSearch }, /* @__PURE__ */ n.createElement("div", { className: E.pickerList }, /* @__PURE__ */ n.createElement(ae, null), a), e.search && /* @__PURE__ */ n.createElement(me, { className: E.searchField, search: e.search })), /* @__PURE__ */ n.createElement(ue, null));
|
|
245
248
|
}, ge = "flow--list", pe = {
|
|
246
249
|
list: ge
|
|
247
250
|
};
|
|
@@ -329,7 +332,7 @@ class ye {
|
|
|
329
332
|
}
|
|
330
333
|
getReactTableFilterFn() {
|
|
331
334
|
return (t, e, a) => this.checkFilterMatches(
|
|
332
|
-
|
|
335
|
+
Bt(t.original, this.property),
|
|
333
336
|
a
|
|
334
337
|
);
|
|
335
338
|
}
|
|
@@ -397,18 +400,24 @@ class ye {
|
|
|
397
400
|
this.onFilterUpdateCallbacks.add(t);
|
|
398
401
|
}
|
|
399
402
|
}
|
|
400
|
-
class
|
|
403
|
+
class Ee {
|
|
401
404
|
constructor(t, e) {
|
|
402
405
|
r(this, "list");
|
|
403
406
|
r(this, "property");
|
|
404
407
|
r(this, "name");
|
|
405
408
|
r(this, "direction");
|
|
406
409
|
r(this, "defaultEnabled");
|
|
407
|
-
this.list = t, this.property = e.property, this.name = e.name, this.direction = e.direction ?? "asc", this.defaultEnabled =
|
|
410
|
+
this.list = t, this.property = e.property, this.name = e.name, this.direction = e.direction ?? "asc", this.defaultEnabled = e.defaultEnabled ?? !1;
|
|
408
411
|
}
|
|
409
412
|
updateTableColumnDef(t) {
|
|
410
413
|
t.enableSorting = !0;
|
|
411
414
|
}
|
|
415
|
+
getReactTableColumnSort() {
|
|
416
|
+
return {
|
|
417
|
+
id: this.property,
|
|
418
|
+
desc: this.direction === "desc"
|
|
419
|
+
};
|
|
420
|
+
}
|
|
412
421
|
isSorted() {
|
|
413
422
|
return this.getTableColumn().getIsSorted() == this.direction;
|
|
414
423
|
}
|
|
@@ -425,8 +434,8 @@ class we {
|
|
|
425
434
|
return `${this.getTableColumn().id}:${this.direction}`;
|
|
426
435
|
}
|
|
427
436
|
}
|
|
428
|
-
const
|
|
429
|
-
class
|
|
437
|
+
const we = (i) => T(At(i));
|
|
438
|
+
class P {
|
|
430
439
|
constructor(t, e = {}) {
|
|
431
440
|
r(this, "list");
|
|
432
441
|
r(this, "table");
|
|
@@ -443,26 +452,25 @@ class B {
|
|
|
443
452
|
this.list = t, this.tableState = Ut(() => ({ value: void 0 })), this.table = this.useReactTable(e);
|
|
444
453
|
}
|
|
445
454
|
static useNew(t, e = {}) {
|
|
446
|
-
return new
|
|
455
|
+
return new P(t, e);
|
|
447
456
|
}
|
|
448
457
|
useReactTable(t = {}) {
|
|
449
|
-
const e = this.list.loader.useData(), a = this.list.sorting.filter(
|
|
458
|
+
const e = this.list.loader.useData(), a = this.list.sorting.filter(
|
|
459
|
+
(o) => o.defaultEnabled !== !1
|
|
460
|
+
), s = Pt({
|
|
450
461
|
data: e,
|
|
451
462
|
initialState: {
|
|
452
463
|
pagination: {
|
|
453
464
|
pageSize: this.list.batches.batchSize
|
|
454
465
|
},
|
|
455
|
-
sorting: a.map((o) => (
|
|
456
|
-
id: String(o.property),
|
|
457
|
-
desc: o.direction === "desc"
|
|
458
|
-
}))
|
|
466
|
+
sorting: a.map((o) => o.getReactTableColumnSort())
|
|
459
467
|
},
|
|
460
468
|
columns: this.getTableColumnDefs(),
|
|
461
469
|
getCoreRowModel: Dt(),
|
|
462
470
|
getSortedRowModel: Nt(),
|
|
463
471
|
getFilteredRowModel: Rt(),
|
|
464
|
-
getPaginationRowModel:
|
|
465
|
-
getFacetedUniqueValues:
|
|
472
|
+
getPaginationRowModel: Mt(),
|
|
473
|
+
getFacetedUniqueValues: zt(),
|
|
466
474
|
onStateChange: this.onTableStateChange,
|
|
467
475
|
globalFilterFn: "auto",
|
|
468
476
|
...t
|
|
@@ -470,7 +478,7 @@ class B {
|
|
|
470
478
|
return this.useUpdateTableState(s), s;
|
|
471
479
|
}
|
|
472
480
|
useUpdateTableState(t) {
|
|
473
|
-
|
|
481
|
+
we(() => {
|
|
474
482
|
const e = this.tableState.value;
|
|
475
483
|
e ? t.setOptions((a) => ({
|
|
476
484
|
...a,
|
|
@@ -479,7 +487,13 @@ class B {
|
|
|
479
487
|
});
|
|
480
488
|
}
|
|
481
489
|
getUpdatedTableState(t, e) {
|
|
482
|
-
|
|
490
|
+
const a = this.list.sorting.filter(
|
|
491
|
+
(s) => s.defaultEnabled === "hidden" && !e.sorting.some((o) => o.id === s.property)
|
|
492
|
+
).map((s) => s.getReactTableColumnSort());
|
|
493
|
+
return {
|
|
494
|
+
...e,
|
|
495
|
+
sorting: [...a, ...e.sorting]
|
|
496
|
+
};
|
|
483
497
|
}
|
|
484
498
|
get searchString() {
|
|
485
499
|
var t;
|
|
@@ -515,6 +529,9 @@ class D {
|
|
|
515
529
|
r(this, "prevDataBatches", []);
|
|
516
530
|
r(this, "batchLoadingStates", ["void"]);
|
|
517
531
|
Vt(this, {
|
|
532
|
+
prevDataBatches: !1,
|
|
533
|
+
useMergedData: !1,
|
|
534
|
+
useIsLoading: !1,
|
|
518
535
|
dataBatches: O.shallow,
|
|
519
536
|
batchLoadingStates: O.shallow,
|
|
520
537
|
mergedData: H,
|
|
@@ -562,7 +579,7 @@ class N {
|
|
|
562
579
|
const { source: a } = e;
|
|
563
580
|
this.dataSource = a ?? { staticData: Ce };
|
|
564
581
|
const s = "manualPagination" in this.dataSource ? this.dataSource.manualPagination : void 0, o = "manualFiltering" in this.dataSource ? this.dataSource.manualFiltering : void 0, l = "manualSorting" in this.dataSource ? this.dataSource.manualSorting : void 0;
|
|
565
|
-
this.list = t, this.loaderState = D.useNew(), this.manualPagination = s ?? !1, this.manualFiltering = o ?? this.manualPagination, this.manualSorting = l ?? this.manualPagination, this.list.filters.forEach((
|
|
582
|
+
this.list = t, this.loaderState = D.useNew(), this.manualPagination = s ?? !1, this.manualFiltering = o ?? this.manualPagination, this.manualSorting = l ?? this.manualPagination, this.list.filters.forEach((d) => d.onFilterUpdated(() => this.reset())), (c = this.list.search) == null || c.onUpdated(() => this.reset());
|
|
566
583
|
}
|
|
567
584
|
static useNew(t, e = {}) {
|
|
568
585
|
return new N(t, e);
|
|
@@ -670,7 +687,7 @@ class Fe {
|
|
|
670
687
|
this.onUpdateCallbacks.add(t);
|
|
671
688
|
}
|
|
672
689
|
}
|
|
673
|
-
const
|
|
690
|
+
const w = class w {
|
|
674
691
|
constructor(t, e = {}) {
|
|
675
692
|
r(this, "list");
|
|
676
693
|
r(this, "textValue");
|
|
@@ -682,11 +699,11 @@ const E = class E {
|
|
|
682
699
|
this.list = t, this.textValue = o, this.renderFn = c, this.href = l, this.onAction = a, this.fallback = s;
|
|
683
700
|
}
|
|
684
701
|
render(t) {
|
|
685
|
-
return (this.renderFn ??
|
|
702
|
+
return (this.renderFn ?? w.fallbackRenderItemFn)(t);
|
|
686
703
|
}
|
|
687
704
|
};
|
|
688
|
-
r(
|
|
689
|
-
let k =
|
|
705
|
+
r(w, "fallbackRenderItemFn", (t) => W("pre", void 0, JSON.stringify(t)));
|
|
706
|
+
let k = w, Le = class it {
|
|
690
707
|
constructor(t) {
|
|
691
708
|
r(this, "filters");
|
|
692
709
|
r(this, "itemView");
|
|
@@ -704,7 +721,7 @@ let k = E, Le = class it {
|
|
|
704
721
|
batchesController: o,
|
|
705
722
|
hasAction: l
|
|
706
723
|
} = t;
|
|
707
|
-
this.items = new be(this), this.filters = a.map((c) => new ye(this, c)), this.sorting = s.map((c) => new
|
|
724
|
+
this.items = new be(this), this.filters = a.map((c) => new ye(this, c)), this.sorting = s.map((c) => new Ee(this, c)), this.search = t.search ? new Fe(this, t.search) : void 0, this.itemView = new k(this, e), this.batches = new Se(this, o), this.loader = N.useNew(this, t.loader), this.reactTable = P.useNew(this, {
|
|
708
725
|
manualFiltering: this.loader.manualFiltering,
|
|
709
726
|
manualPagination: this.loader.manualPagination,
|
|
710
727
|
manualSorting: this.loader.manualSorting
|
|
@@ -716,6 +733,9 @@ let k = E, Le = class it {
|
|
|
716
733
|
get isFiltered() {
|
|
717
734
|
return this.filters.some((t) => t.isActive()) || !!this.search && this.search.isSet;
|
|
718
735
|
}
|
|
736
|
+
get visibleSorting() {
|
|
737
|
+
return this.sorting.filter((t) => t.defaultEnabled !== "hidden");
|
|
738
|
+
}
|
|
719
739
|
getSorting(t) {
|
|
720
740
|
const e = this.sorting.find((a) => a.id === t);
|
|
721
741
|
return _(!!e, `Could not get Sorting (ID: ${t})`), e;
|
|
@@ -738,41 +758,41 @@ const Te = "flow--list--items", Ie = "flow--list--items--is-loading", J = {
|
|
|
738
758
|
item: Ae,
|
|
739
759
|
hasAction: ke
|
|
740
760
|
}, Ve = (i) => {
|
|
741
|
-
const { data: t, children: e } = i, a = h(), s = a.itemView, o = s.onAction, l = s.textValue ? s.textValue(t) : void 0, c = o ? () => o(t) : void 0,
|
|
761
|
+
const { data: t, children: e } = i, a = h(), s = a.itemView, o = s.onAction, l = s.textValue ? s.textValue(t) : void 0, c = o ? () => o(t) : void 0, d = s.href ? s.href(t) : void 0, u = a.hasAction || !!c || !!d, v = C(V.item, u && V.hasAction);
|
|
742
762
|
return /* @__PURE__ */ n.createElement(
|
|
743
|
-
|
|
763
|
+
B.GridListItem,
|
|
744
764
|
{
|
|
745
765
|
className: v,
|
|
746
766
|
onAction: c,
|
|
747
767
|
textValue: l,
|
|
748
|
-
href:
|
|
768
|
+
href: d
|
|
749
769
|
},
|
|
750
770
|
e ?? s.render(t)
|
|
751
771
|
);
|
|
752
|
-
}, xe = (i) => /* @__PURE__ */ n.createElement(
|
|
772
|
+
}, xe = (i) => /* @__PURE__ */ n.createElement(B.GridListItem, { textValue: "-", className: V.item }, i.children), Be = () => {
|
|
753
773
|
const i = b(g);
|
|
754
774
|
return /* @__PURE__ */ n.createElement($t, null, /* @__PURE__ */ n.createElement(Ot, null), /* @__PURE__ */ n.createElement(tt, null, i.format("list.noResult.heading")), /* @__PURE__ */ n.createElement(S, null, i.format("list.noResult.text")));
|
|
755
|
-
},
|
|
756
|
-
const t = h().itemView.fallback ?? /* @__PURE__ */ n.createElement(
|
|
775
|
+
}, Pe = () => /* @__PURE__ */ n.createElement(et, null, /* @__PURE__ */ n.createElement(tt, null, /* @__PURE__ */ n.createElement(I, { width: "200px" })), /* @__PURE__ */ n.createElement(S, null, /* @__PURE__ */ n.createElement(I, { width: "300px" }))), De = () => {
|
|
776
|
+
const t = h().itemView.fallback ?? /* @__PURE__ */ n.createElement(Pe, null);
|
|
757
777
|
return Array.from(Array(5)).map((e, a) => /* @__PURE__ */ n.createElement(xe, { key: a }, bt(t)));
|
|
758
778
|
}, Ne = (i) => {
|
|
759
|
-
const { className: t, ...e } = i, a = h(), s = a.loader.useIsLoading(), o = a.loader.useIsInitiallyLoading(), l = a.useIsEmpty(), c = a.items.entries.map((u) => /* @__PURE__ */ n.createElement(Ve, { key: u.id, data: u.data })),
|
|
779
|
+
const { className: t, ...e } = i, a = h(), s = a.loader.useIsLoading(), o = a.loader.useIsInitiallyLoading(), l = a.useIsEmpty(), c = a.items.entries.map((u) => /* @__PURE__ */ n.createElement(Ve, { key: u.id, data: u.data })), d = C(
|
|
760
780
|
J.items,
|
|
761
781
|
t,
|
|
762
782
|
s && J.isLoading
|
|
763
783
|
);
|
|
764
|
-
return l ? /* @__PURE__ */ n.createElement(
|
|
765
|
-
}, nt = (i) => null, Re = () => nt, rt = (i) => null,
|
|
784
|
+
return l ? /* @__PURE__ */ n.createElement(Be, null) : /* @__PURE__ */ n.createElement("div", { "aria-hidden": o, "aria-busy": s }, /* @__PURE__ */ n.createElement(B.GridList, { className: d, ...e }, o ? /* @__PURE__ */ n.createElement(De, null) : c));
|
|
785
|
+
}, nt = (i) => null, Re = () => nt, rt = (i) => null, Me = () => rt, ot = (i) => null, ze = () => ot, lt = (i) => null, Ue = () => lt, ct = (i) => null, $e = () => ct, Oe = "flow--list--footer", He = {
|
|
766
786
|
footer: Oe
|
|
767
787
|
}, qe = (i) => {
|
|
768
788
|
const t = b(g), e = h(), a = e.batches, s = e.loader.useIsInitiallyLoading(), o = e.useIsEmpty(), l = a.getTotalItemsCount(), c = a.getVisibleItemsCount();
|
|
769
789
|
if (o)
|
|
770
790
|
return null;
|
|
771
|
-
const
|
|
791
|
+
const d = s ? /* @__PURE__ */ n.createElement(I, { width: "200px" }) : t.format("list.paginationInfo", {
|
|
772
792
|
visibleItemsCount: c,
|
|
773
793
|
totalItemsCount: l
|
|
774
794
|
});
|
|
775
|
-
return /* @__PURE__ */ n.createElement(S, { ...i },
|
|
795
|
+
return /* @__PURE__ */ n.createElement(S, { ...i }, d);
|
|
776
796
|
}, Ge = (i) => {
|
|
777
797
|
const t = b(g), e = h(), a = e.loader.useIsLoading(), s = e.loader.useIsInitiallyLoading();
|
|
778
798
|
return !e.batches.hasNextBatch() && !a ? null : /* @__PURE__ */ n.createElement(
|
|
@@ -792,14 +812,14 @@ function ut(i) {
|
|
|
792
812
|
return null;
|
|
793
813
|
}
|
|
794
814
|
const je = () => ut, Je = Lt("List", (i) => {
|
|
795
|
-
var p, R,
|
|
815
|
+
var p, R, M, z, U;
|
|
796
816
|
const { children: t, batchSize: e, ...a } = i, s = (p = y(
|
|
797
817
|
t,
|
|
798
818
|
nt
|
|
799
819
|
)) == null ? void 0 : p.props, o = (R = y(
|
|
800
820
|
t,
|
|
801
821
|
Ht
|
|
802
|
-
)) == null ? void 0 : R.props, l = (
|
|
822
|
+
)) == null ? void 0 : R.props, l = (M = y(t, ct)) == null ? void 0 : M.props, c = {
|
|
803
823
|
source: s ? {
|
|
804
824
|
...s,
|
|
805
825
|
asyncLoader: s.children
|
|
@@ -809,14 +829,14 @@ const je = () => ut, Je = Lt("List", (i) => {
|
|
|
809
829
|
} : l ? {
|
|
810
830
|
staticData: l.data
|
|
811
831
|
} : void 0
|
|
812
|
-
},
|
|
832
|
+
}, d = (z = y(t, ut)) == null ? void 0 : z.props, u = (U = y(t, lt)) == null ? void 0 : U.props, v = Le.useNew({
|
|
813
833
|
loader: c,
|
|
814
834
|
filters: K(t, rt).map(
|
|
815
835
|
(F) => F.props
|
|
816
836
|
),
|
|
817
|
-
search:
|
|
818
|
-
render:
|
|
819
|
-
textFieldProps:
|
|
837
|
+
search: d ? {
|
|
838
|
+
render: d.children,
|
|
839
|
+
textFieldProps: d
|
|
820
840
|
} : void 0,
|
|
821
841
|
sorting: K(t, ot).map((F) => F.props),
|
|
822
842
|
itemView: u ? {
|
|
@@ -838,11 +858,11 @@ const je = () => ut, Je = Lt("List", (i) => {
|
|
|
838
858
|
/* @__PURE__ */ n.createElement(te, null),
|
|
839
859
|
/* @__PURE__ */ n.createElement("div", { className: pe.list }, /* @__PURE__ */ n.createElement(he, null), /* @__PURE__ */ n.createElement(Ne, { ...a }), /* @__PURE__ */ n.createElement(Ke, null))
|
|
840
860
|
);
|
|
841
|
-
}),
|
|
861
|
+
}), Ba = () => ({
|
|
842
862
|
List: Je,
|
|
843
|
-
Filter:
|
|
863
|
+
Filter: Me(),
|
|
844
864
|
Search: je(),
|
|
845
|
-
Sorting:
|
|
865
|
+
Sorting: ze(),
|
|
846
866
|
Item: Ue(),
|
|
847
867
|
ItemView: et,
|
|
848
868
|
StaticData: $e(),
|
|
@@ -857,10 +877,10 @@ export {
|
|
|
857
877
|
nt as ListLoaderAsync,
|
|
858
878
|
ot as ListSorting,
|
|
859
879
|
ct as ListStaticData,
|
|
860
|
-
|
|
880
|
+
Me as TypedListFilter,
|
|
861
881
|
Ue as TypedListItem,
|
|
862
882
|
Re as TypedListLoaderAsync,
|
|
863
|
-
|
|
883
|
+
ze as TypedListSorting,
|
|
864
884
|
$e as TypedListStaticData,
|
|
865
|
-
|
|
885
|
+
Ba as typedList
|
|
866
886
|
};
|