@mittwald/flow-react-components 0.1.0-alpha.58 → 0.1.0-alpha.59
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/{Button-h6RkBrWE.js → Button-DTVMsKTK.js} +1 -1
- package/dist/Button.js +1 -1
- package/dist/ContextMenu.js +2 -2
- package/dist/{ContextMenuItem-DDPBrwII.js → ContextMenuItem-Cc7czdsZ.js} +1 -1
- package/dist/CopyButton.js +1 -1
- package/dist/FieldDescription.js +1 -1
- package/dist/List.js +159 -160
- package/dist/NumberField.js +1 -1
- package/dist/StatusBadge.js +1 -1
- package/dist/Text-c5-UeE0Y.js +43 -0
- package/dist/Text.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/types/components/EmulatedBoldText/EmulatedBoldText.d.ts +6 -0
- package/dist/types/components/EmulatedBoldText/index.d.ts +4 -0
- package/dist/types/components/EmulatedBoldText/stories/Default.stories.d.ts +7 -0
- package/dist/types/components/List/components/Header/ListSorting.d.ts +1 -0
- package/dist/types/components/List/model/sorting/Sorting.d.ts +4 -4
- package/dist/types/components/List/model/sorting/types.d.ts +1 -0
- package/dist/types/components/Text/Text.d.ts +1 -0
- package/package.json +32 -32
- package/dist/Text-Dc6eN_n2.js +0 -29
package/dist/List.js
CHANGED
|
@@ -1,53 +1,53 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
var o = (
|
|
6
|
-
import r, { createContext as
|
|
7
|
-
import * as
|
|
8
|
-
import { MenuTrigger as
|
|
3
|
+
var Q = Object.defineProperty;
|
|
4
|
+
var X = (i, t, e) => t in i ? Q(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e;
|
|
5
|
+
var o = (i, t, e) => (X(i, typeof t != "symbol" ? t + "" : t, e), e);
|
|
6
|
+
import r, { createContext as Y, useContext as Z, createElement as _, useEffect as C, useState as tt, Suspense as et } from "react";
|
|
7
|
+
import * as x from "react-aria-components";
|
|
8
|
+
import { MenuTrigger as at } from "react-aria-components";
|
|
9
9
|
import "./propsContext-Dx7WKmmM.js";
|
|
10
10
|
import "@react-aria/utils";
|
|
11
|
-
import { times as
|
|
11
|
+
import { times as st } from "remeda";
|
|
12
12
|
import "@mittwald/react-tunnel";
|
|
13
|
-
import { a as
|
|
14
|
-
import { T as
|
|
13
|
+
import { a as U, C as O, d as rt } from "./ContextMenuItem-Cc7czdsZ.js";
|
|
14
|
+
import { T as b } from "./Text-c5-UeE0Y.js";
|
|
15
15
|
import "@tabler/icons-react";
|
|
16
|
-
import
|
|
16
|
+
import $ from "clsx";
|
|
17
17
|
import "html-react-parser";
|
|
18
|
-
import { I as
|
|
19
|
-
import { B as
|
|
18
|
+
import { I as H } from "./IconChevronDown-C3dBD472.js";
|
|
19
|
+
import { B as h } from "./Button-DTVMsKTK.js";
|
|
20
20
|
import "react-children-utilities";
|
|
21
|
-
import { useMessageFormatter as
|
|
22
|
-
import { I as
|
|
21
|
+
import { useMessageFormatter as q, useLocalizedStringFormatter as K } from "react-aria";
|
|
22
|
+
import { I as nt } from "./IconClose-DIMx1m3Z.js";
|
|
23
23
|
import { getProperty as it } from "dot-prop";
|
|
24
24
|
import { useReactTable as ot, getCoreRowModel as lt, getSortedRowModel as ct, getFilteredRowModel as ut, getPaginationRowModel as mt, getFacetedUniqueValues as dt } from "@tanstack/react-table";
|
|
25
|
-
import
|
|
25
|
+
import j from "invariant";
|
|
26
26
|
import { useLocalObservable as ht } from "mobx-react-lite";
|
|
27
|
-
import { autorun as gt, runInAction as pt, makeObservable as ft, observable as k, computed as
|
|
28
|
-
import { getAsyncResource as
|
|
29
|
-
import { u as
|
|
27
|
+
import { autorun as gt, runInAction as pt, makeObservable as ft, observable as k, computed as D, action as y } from "mobx";
|
|
28
|
+
import { getAsyncResource as P } from "@mittwald/react-use-promise";
|
|
29
|
+
import { u as R } from "./useSelector-DpU7_HMO.js";
|
|
30
30
|
import { P as bt } from "./PropsContextProvider-BsrVIv1a.js";
|
|
31
31
|
import { W as St } from "./Wrap-DGT1h1o3.js";
|
|
32
32
|
import { L as yt } from "./Link-DtSY1xrt.js";
|
|
33
33
|
import { I as Ct } from "./IconContextMenu-BF-N2Mtz.js";
|
|
34
|
-
import { d as
|
|
34
|
+
import { d as f, a as V } from "./deepFindOfType-6pG0fH7S.js";
|
|
35
35
|
import "./context-BlNV7smK.js";
|
|
36
36
|
import { I as vt } from "./InlineCode-DZzyKdCm.js";
|
|
37
37
|
import { ListLoaderAsyncResource as Ft } from "./List/ListLoaderAsyncResource.js";
|
|
38
|
-
const
|
|
38
|
+
const J = Y({}), m = () => Z(J).list, Tt = (i) => /* @__PURE__ */ r.createElement(r.Fragment, null, i.children()), Et = () => m().loader.getLoaderInvocationHooks().map((t, e) => /* @__PURE__ */ r.createElement(Tt, { key: e }, () => {
|
|
39
39
|
t();
|
|
40
|
-
})), wt = (
|
|
41
|
-
const { sorting: t } =
|
|
42
|
-
return /* @__PURE__ */ r.createElement(
|
|
40
|
+
})), wt = (i) => {
|
|
41
|
+
const { sorting: t } = i;
|
|
42
|
+
return /* @__PURE__ */ r.createElement(U, { id: t.getTableColumn().id }, t.name);
|
|
43
43
|
}, g = {
|
|
44
44
|
"de-DE": {
|
|
45
45
|
options: "Optionen",
|
|
46
46
|
paginationInfo: "{visibleItemsCount} von insgesamt {totalItemsCount} angezeigt",
|
|
47
47
|
paginationInfoFiltered: "{visibleItemsCount} von insgesamt {filteredItemsCount} (gefiltert aus {totalItemsCount}) angezeigt",
|
|
48
48
|
resetAll: "Alles zurücksetzen",
|
|
49
|
+
setSorting: "Sortierung: {property}",
|
|
49
50
|
showMore: "Mehr anzeigen",
|
|
50
|
-
sortedBy: "Sortiert nach: {property}",
|
|
51
51
|
sorting: "Sortierung"
|
|
52
52
|
},
|
|
53
53
|
"en-EN": {
|
|
@@ -55,35 +55,44 @@ const W = Z({}), d = () => _(W).list, Tt = (n) => /* @__PURE__ */ r.createElemen
|
|
|
55
55
|
paginationInfo: "Showing {visibleRows} of {totalRows}",
|
|
56
56
|
paginationInfoFiltered: "Showing {visibleItemsCount} of {filteredItemsCount} (unfiltered total count {totalItemsCount})",
|
|
57
57
|
resetAll: "Reset filters",
|
|
58
|
+
setSorting: "Sorting: {property}",
|
|
58
59
|
showMore: "Show more",
|
|
59
|
-
sortedBy: "Sorted by: {property}",
|
|
60
60
|
sorting: "Sorting"
|
|
61
61
|
}
|
|
62
|
-
}, v = (
|
|
63
|
-
const { children: t, locales: e, variables: a } =
|
|
64
|
-
return
|
|
62
|
+
}, v = (i) => {
|
|
63
|
+
const { children: t, locales: e, variables: a } = i;
|
|
64
|
+
return q(e)(t, a);
|
|
65
65
|
}, Lt = () => {
|
|
66
|
-
const
|
|
67
|
-
if (
|
|
66
|
+
const i = m(), t = i.sorting.map((s) => /* @__PURE__ */ r.createElement(wt, { sorting: s, key: s.getTableColumn().id }));
|
|
67
|
+
if (i.sorting.length === 0)
|
|
68
68
|
return null;
|
|
69
|
-
const e =
|
|
70
|
-
|
|
71
|
-
|
|
69
|
+
const e = i.sorting.find((s) => s.isSorted()), a = /* @__PURE__ */ r.createElement(b, null, e ? /* @__PURE__ */ r.createElement(
|
|
70
|
+
v,
|
|
71
|
+
{
|
|
72
|
+
locales: g,
|
|
73
|
+
variables: {
|
|
74
|
+
property: e.name ?? e.property
|
|
75
|
+
}
|
|
76
|
+
},
|
|
77
|
+
"setSorting"
|
|
78
|
+
) : /* @__PURE__ */ r.createElement(v, { locales: g }, "sorting"));
|
|
79
|
+
return /* @__PURE__ */ r.createElement(x.MenuTrigger, null, /* @__PURE__ */ r.createElement(h, { style: "soft", size: "s", variant: "secondary" }, a, /* @__PURE__ */ r.createElement(H, null)), /* @__PURE__ */ r.createElement(
|
|
80
|
+
O,
|
|
72
81
|
{
|
|
73
82
|
selectionMode: "single",
|
|
74
|
-
selectedKeys: e,
|
|
75
|
-
onAction: (
|
|
76
|
-
|
|
83
|
+
selectedKeys: e ? [e.property] : [],
|
|
84
|
+
onAction: (s) => {
|
|
85
|
+
i.getSorting(String(s)).enable();
|
|
77
86
|
}
|
|
78
87
|
},
|
|
79
88
|
t
|
|
80
89
|
));
|
|
81
|
-
}, It = (
|
|
82
|
-
const { filter: t } =
|
|
83
|
-
t.toggleValue(
|
|
90
|
+
}, It = (i) => {
|
|
91
|
+
const { filter: t } = i, e = t.values.map((n) => /* @__PURE__ */ r.createElement(U, { key: t.getValueId(n), id: String(n) }, String(n))), a = t.values.filter((n) => t.isValueActive(n)).map((n) => String(n)), s = (n) => {
|
|
92
|
+
t.toggleValue(n);
|
|
84
93
|
};
|
|
85
|
-
return /* @__PURE__ */ r.createElement(
|
|
86
|
-
|
|
94
|
+
return /* @__PURE__ */ r.createElement(x.MenuTrigger, null, /* @__PURE__ */ r.createElement(h, { style: "soft", size: "s", variant: "secondary" }, /* @__PURE__ */ r.createElement(b, null, t.name ?? t.property), /* @__PURE__ */ r.createElement(H, null)), /* @__PURE__ */ r.createElement(
|
|
95
|
+
O,
|
|
87
96
|
{
|
|
88
97
|
onAction: s,
|
|
89
98
|
selectionMode: "multiple",
|
|
@@ -91,56 +100,44 @@ const W = Z({}), d = () => _(W).list, Tt = (n) => /* @__PURE__ */ r.createElemen
|
|
|
91
100
|
},
|
|
92
101
|
e
|
|
93
102
|
));
|
|
94
|
-
}, Bt = "flow--list--header", At = "flow--list--header--picker-list",
|
|
103
|
+
}, Bt = "flow--list--header", At = "flow--list--header--picker-list", M = {
|
|
95
104
|
header: Bt,
|
|
96
105
|
pickerList: At
|
|
97
|
-
},
|
|
98
|
-
activeFilters:
|
|
99
|
-
clearButton:
|
|
106
|
+
}, kt = "flow--list--header--active-filters", Dt = "flow--list--header--clear-button", N = {
|
|
107
|
+
activeFilters: kt,
|
|
108
|
+
clearButton: Dt
|
|
100
109
|
}, Pt = () => {
|
|
101
|
-
const
|
|
102
|
-
(
|
|
103
|
-
|
|
110
|
+
const i = m(), t = i.filters.flatMap(
|
|
111
|
+
(e) => e.values.filter((a) => e.isValueActive(a)).map((a) => /* @__PURE__ */ r.createElement(
|
|
112
|
+
h,
|
|
104
113
|
{
|
|
105
114
|
style: "soft",
|
|
106
115
|
size: "s",
|
|
107
|
-
key: String(
|
|
108
|
-
onPress: () =>
|
|
116
|
+
key: String(a),
|
|
117
|
+
onPress: () => e.deactivateValue(a)
|
|
109
118
|
},
|
|
110
|
-
/* @__PURE__ */ r.createElement(
|
|
111
|
-
/* @__PURE__ */ r.createElement(
|
|
119
|
+
/* @__PURE__ */ r.createElement(b, null, String(a)),
|
|
120
|
+
/* @__PURE__ */ r.createElement(nt, null)
|
|
112
121
|
))
|
|
113
|
-
)
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
locales: g,
|
|
117
|
-
variables: { property: s.name ?? s.property }
|
|
118
|
-
},
|
|
119
|
-
"sortedBy"
|
|
120
|
-
)), /* @__PURE__ */ r.createElement(D, null)));
|
|
121
|
-
if (t.length <= 0 && e.length <= 0)
|
|
122
|
-
return null;
|
|
123
|
-
const a = () => {
|
|
124
|
-
n.clearSorting(), n.clearFilters();
|
|
125
|
-
};
|
|
126
|
-
return /* @__PURE__ */ r.createElement("div", { className: z.activeFilters }, e, t, /* @__PURE__ */ r.createElement(
|
|
127
|
-
u,
|
|
122
|
+
);
|
|
123
|
+
return t.length <= 0 ? null : /* @__PURE__ */ r.createElement("div", { className: N.activeFilters }, t, /* @__PURE__ */ r.createElement(
|
|
124
|
+
h,
|
|
128
125
|
{
|
|
129
|
-
className:
|
|
126
|
+
className: N.clearButton,
|
|
130
127
|
size: "s",
|
|
131
128
|
style: "plain",
|
|
132
|
-
onPress:
|
|
129
|
+
onPress: () => i.clearFilters()
|
|
133
130
|
},
|
|
134
131
|
/* @__PURE__ */ r.createElement(v, { locales: g }, "resetAll")
|
|
135
132
|
));
|
|
136
|
-
}, Rt = (
|
|
137
|
-
const { className: t } =
|
|
138
|
-
return /* @__PURE__ */ r.createElement("div", { className:
|
|
133
|
+
}, Rt = (i) => {
|
|
134
|
+
const { className: t } = i, a = m().filters.map((s) => /* @__PURE__ */ r.createElement(It, { key: s.property, filter: s }));
|
|
135
|
+
return /* @__PURE__ */ r.createElement("div", { className: $(t, M.header) }, /* @__PURE__ */ r.createElement("div", { className: M.pickerList }, /* @__PURE__ */ r.createElement(Lt, null), a), /* @__PURE__ */ r.createElement(Pt, null));
|
|
139
136
|
}, Vt = "flow--list", Mt = {
|
|
140
137
|
list: Vt
|
|
141
138
|
};
|
|
142
|
-
var
|
|
143
|
-
let Nt = (
|
|
139
|
+
var u;
|
|
140
|
+
let Nt = (u = class {
|
|
144
141
|
constructor(t, e, a) {
|
|
145
142
|
o(this, "id");
|
|
146
143
|
o(this, "data");
|
|
@@ -148,12 +145,12 @@ let Nt = (m = class {
|
|
|
148
145
|
this.collection = t, this.id = e, this.data = a;
|
|
149
146
|
}
|
|
150
147
|
render() {
|
|
151
|
-
return (this.collection.list.render ??
|
|
148
|
+
return (this.collection.list.render ?? u.fallbackRenderItemFn)(this.data);
|
|
152
149
|
}
|
|
153
150
|
static fromRow(t, e) {
|
|
154
|
-
return new
|
|
151
|
+
return new u(t, e.id, e.original);
|
|
155
152
|
}
|
|
156
|
-
}, o(
|
|
153
|
+
}, o(u, "fallbackRenderItemFn", (t) => _("pre", void 0, JSON.stringify(t))), u);
|
|
157
154
|
class F {
|
|
158
155
|
constructor(t) {
|
|
159
156
|
o(this, "list");
|
|
@@ -215,7 +212,7 @@ class zt {
|
|
|
215
212
|
}
|
|
216
213
|
}
|
|
217
214
|
}
|
|
218
|
-
const xt = (
|
|
215
|
+
const xt = (i, t) => i === t;
|
|
219
216
|
class Ut {
|
|
220
217
|
constructor(t, e) {
|
|
221
218
|
o(this, "_values");
|
|
@@ -239,12 +236,12 @@ class Ut {
|
|
|
239
236
|
checkFilterMatches(t, e) {
|
|
240
237
|
if (e === null)
|
|
241
238
|
return !0;
|
|
242
|
-
const a = (
|
|
239
|
+
const a = (n) => Array.isArray(n) ? n : [n], s = (n) => this.matcher(n, t);
|
|
243
240
|
if (this.mode === "all")
|
|
244
241
|
return a(e).every(s);
|
|
245
242
|
if (this.mode === "some") {
|
|
246
|
-
const
|
|
247
|
-
return
|
|
243
|
+
const n = a(e);
|
|
244
|
+
return n.length === 0 || n.some(s);
|
|
248
245
|
} else if (this.mode === "one")
|
|
249
246
|
return s(e);
|
|
250
247
|
throw new Error(`Unknown filter mode '${this.mode}'`);
|
|
@@ -292,7 +289,7 @@ class Ut {
|
|
|
292
289
|
toggleValue(t) {
|
|
293
290
|
const e = this.isValueActive(t), a = this.getArrayValue();
|
|
294
291
|
let s;
|
|
295
|
-
this.mode === "all" || this.mode === "some" ? e ? s = a.filter((
|
|
292
|
+
this.mode === "all" || this.mode === "some" ? e ? s = a.filter((n) => n !== t) : s = [...a, t] : s = e ? null : t, this.list.reactTable.getTableColumn(this.property).setFilterValue(s), this.onFilterUpdateCallbacks.forEach((n) => n());
|
|
296
293
|
}
|
|
297
294
|
onFilterUpdated(t) {
|
|
298
295
|
this.onFilterUpdateCallbacks.add(t);
|
|
@@ -303,29 +300,27 @@ class Ot {
|
|
|
303
300
|
o(this, "list");
|
|
304
301
|
o(this, "property");
|
|
305
302
|
o(this, "name");
|
|
306
|
-
o(this, "
|
|
307
|
-
this
|
|
303
|
+
o(this, "direction");
|
|
304
|
+
o(this, "defaultEnabled");
|
|
305
|
+
this.list = t, this.property = e.property, this.name = e.name, this.direction = e.direction ?? "asc", this.defaultEnabled = !!e.defaultEnabled;
|
|
308
306
|
}
|
|
309
307
|
updateTableColumnDef(t) {
|
|
310
308
|
t.enableSorting = !0;
|
|
311
309
|
}
|
|
312
|
-
|
|
313
|
-
return this.list.reactTable.getTableColumn(this.property).getIsSorted();
|
|
310
|
+
isSorted() {
|
|
311
|
+
return this.list.reactTable.getTableColumn(this.property).getIsSorted() !== !1;
|
|
314
312
|
}
|
|
315
313
|
getTableColumn() {
|
|
316
314
|
return this.list.reactTable.getTableColumn(this.property);
|
|
317
315
|
}
|
|
318
|
-
|
|
319
|
-
this.list.reactTable.getTableColumn(this.property).toggleSorting(this.
|
|
316
|
+
enable() {
|
|
317
|
+
this.list.reactTable.getTableColumn(this.property).toggleSorting(this.direction === "desc", !1);
|
|
320
318
|
}
|
|
321
319
|
clear() {
|
|
322
320
|
this.list.reactTable.getTableColumn(this.property).clearSorting();
|
|
323
321
|
}
|
|
324
|
-
get enabled() {
|
|
325
|
-
return this.direction !== !1;
|
|
326
|
-
}
|
|
327
322
|
}
|
|
328
|
-
const $t = (
|
|
323
|
+
const $t = (i) => C(gt(i));
|
|
329
324
|
class T {
|
|
330
325
|
constructor(t, e = {}) {
|
|
331
326
|
o(this, "list");
|
|
@@ -346,12 +341,16 @@ class T {
|
|
|
346
341
|
return new T(t, e);
|
|
347
342
|
}
|
|
348
343
|
useReactTable(t = {}) {
|
|
349
|
-
const e = this.list.loader.useData(), a = ot({
|
|
344
|
+
const e = this.list.loader.useData(), a = this.list.sorting.filter((n) => n.defaultEnabled), s = ot({
|
|
350
345
|
data: e,
|
|
351
346
|
initialState: {
|
|
352
347
|
pagination: {
|
|
353
348
|
pageSize: this.list.batches.batchSize
|
|
354
|
-
}
|
|
349
|
+
},
|
|
350
|
+
sorting: a.map((n) => ({
|
|
351
|
+
id: String(n.property),
|
|
352
|
+
desc: n.direction === "desc"
|
|
353
|
+
}))
|
|
355
354
|
},
|
|
356
355
|
columns: this.getTableColumnDefs(),
|
|
357
356
|
getCoreRowModel: lt(),
|
|
@@ -362,7 +361,7 @@ class T {
|
|
|
362
361
|
onStateChange: this.onTableStateChange,
|
|
363
362
|
...t
|
|
364
363
|
});
|
|
365
|
-
return this.useUpdateTableState(
|
|
364
|
+
return this.useUpdateTableState(s), s;
|
|
366
365
|
}
|
|
367
366
|
useUpdateTableState(t) {
|
|
368
367
|
$t(() => {
|
|
@@ -378,20 +377,20 @@ class T {
|
|
|
378
377
|
}
|
|
379
378
|
getTableColumn(t) {
|
|
380
379
|
const e = this.table.getColumn(t);
|
|
381
|
-
return
|
|
380
|
+
return j(!!e, `Column #${t} is not defined`), e;
|
|
382
381
|
}
|
|
383
382
|
getTableColumnDefs() {
|
|
384
383
|
const t = /* @__PURE__ */ new Map(), e = (a) => {
|
|
385
384
|
const s = t.get(a);
|
|
386
385
|
if (s)
|
|
387
386
|
return s;
|
|
388
|
-
const
|
|
387
|
+
const n = {
|
|
389
388
|
id: a,
|
|
390
389
|
accessorKey: a,
|
|
391
390
|
enableSorting: !1,
|
|
392
391
|
enableColumnFilter: !1
|
|
393
392
|
};
|
|
394
|
-
return t.set(a,
|
|
393
|
+
return t.set(a, n), n;
|
|
395
394
|
};
|
|
396
395
|
return this.list.filters.forEach(
|
|
397
396
|
(a) => a.updateTableColumnDef(e(a.property))
|
|
@@ -408,15 +407,15 @@ class E {
|
|
|
408
407
|
ft(this, {
|
|
409
408
|
dataBatches: k,
|
|
410
409
|
batchLoadingStates: k,
|
|
411
|
-
mergedData:
|
|
412
|
-
isLoading:
|
|
410
|
+
mergedData: D,
|
|
411
|
+
isLoading: D,
|
|
413
412
|
reset: y.bound,
|
|
414
413
|
setDataBatch: y.bound,
|
|
415
414
|
setBatchLoadingState: y.bound
|
|
416
415
|
});
|
|
417
416
|
}
|
|
418
417
|
static useNew() {
|
|
419
|
-
return
|
|
418
|
+
return tt(new E())[0];
|
|
420
419
|
}
|
|
421
420
|
reset() {
|
|
422
421
|
this.batchLoadingStates = [], this.dataBatches = [];
|
|
@@ -431,13 +430,13 @@ class E {
|
|
|
431
430
|
return (this.dataBatches.length === 0 ? this.prevDataBatches : this.dataBatches).flatMap((e) => e);
|
|
432
431
|
}
|
|
433
432
|
useMergedData() {
|
|
434
|
-
return
|
|
433
|
+
return R(() => this.mergedData);
|
|
435
434
|
}
|
|
436
435
|
get isLoading() {
|
|
437
436
|
return this.batchLoadingStates.some((t) => t === "loading");
|
|
438
437
|
}
|
|
439
438
|
useIsLoading() {
|
|
440
|
-
return
|
|
439
|
+
return R(() => this.isLoading);
|
|
441
440
|
}
|
|
442
441
|
}
|
|
443
442
|
const Ht = [];
|
|
@@ -451,8 +450,8 @@ class w {
|
|
|
451
450
|
o(this, "loaderState");
|
|
452
451
|
const { source: a } = e;
|
|
453
452
|
this.dataSource = a ?? { staticData: Ht };
|
|
454
|
-
const s = "manualPagination" in this.dataSource ? this.dataSource.manualPagination : void 0,
|
|
455
|
-
this.list = t, this.loaderState = E.useNew(), this.manualPagination = s ?? !1, this.manualFiltering =
|
|
453
|
+
const s = "manualPagination" in this.dataSource ? this.dataSource.manualPagination : void 0, n = "manualFiltering" in this.dataSource ? this.dataSource.manualFiltering : void 0, l = "manualSorting" in this.dataSource ? this.dataSource.manualSorting : void 0;
|
|
454
|
+
this.list = t, this.loaderState = E.useNew(), this.manualPagination = s ?? !1, this.manualFiltering = n ?? this.manualPagination, this.manualSorting = l ?? this.manualPagination, this.list.filters.forEach((d) => d.onFilterUpdated(() => this.reset()));
|
|
456
455
|
}
|
|
457
456
|
static useNew(t, e = {}) {
|
|
458
457
|
return new w(t, e);
|
|
@@ -467,7 +466,7 @@ class w {
|
|
|
467
466
|
return this.loaderState.useMergedData();
|
|
468
467
|
}
|
|
469
468
|
getLoaderInvocationHooks() {
|
|
470
|
-
return
|
|
469
|
+
return st(this.list.batches.getBatchIndex() + 1, (e) => e).map((e) => () => {
|
|
471
470
|
this.useLoadBatch(e);
|
|
472
471
|
});
|
|
473
472
|
}
|
|
@@ -478,8 +477,8 @@ class w {
|
|
|
478
477
|
C(() => {
|
|
479
478
|
if (!a.hasValue)
|
|
480
479
|
return;
|
|
481
|
-
const { data: s, itemTotalCount:
|
|
482
|
-
this.loaderState.setDataBatch(t, s),
|
|
480
|
+
const { data: s, itemTotalCount: n } = a.value;
|
|
481
|
+
this.loaderState.setDataBatch(t, s), n !== void 0 && this.list.batches.updateItemTotalCount(n);
|
|
483
482
|
}, [t, a.maybeValue]), C(() => (this.loaderState.setBatchLoadingState(
|
|
484
483
|
t,
|
|
485
484
|
e.state.value
|
|
@@ -494,7 +493,7 @@ class w {
|
|
|
494
493
|
offset: this.list.batches.batchSize * t
|
|
495
494
|
} : void 0,
|
|
496
495
|
sorting: this.manualSorting ? Object.fromEntries(
|
|
497
|
-
this.list.sorting.filter((e) => e.
|
|
496
|
+
this.list.sorting.filter((e) => e.isSorted()).map((e) => [e.property, e.direction])
|
|
498
497
|
) : void 0,
|
|
499
498
|
filtering: this.manualFiltering ? Object.fromEntries(
|
|
500
499
|
this.list.filters.filter((e) => e.getValue() !== null).map((e) => [
|
|
@@ -508,7 +507,7 @@ class w {
|
|
|
508
507
|
const e = this.dataSource, a = this.getDataLoaderOptions(t);
|
|
509
508
|
if ("staticData" in e) {
|
|
510
509
|
const s = e.staticData;
|
|
511
|
-
return
|
|
510
|
+
return P(
|
|
512
511
|
async () => ({
|
|
513
512
|
data: s,
|
|
514
513
|
itemTotalCount: s.length
|
|
@@ -518,7 +517,7 @@ class w {
|
|
|
518
517
|
}
|
|
519
518
|
if ("asyncLoader" in e) {
|
|
520
519
|
const s = e.asyncLoader;
|
|
521
|
-
return
|
|
520
|
+
return P(s, [a]);
|
|
522
521
|
}
|
|
523
522
|
if ("asyncResourceFactory" in e) {
|
|
524
523
|
const s = e.asyncResourceFactory;
|
|
@@ -527,7 +526,7 @@ class w {
|
|
|
527
526
|
throw new Error("Unknown data source");
|
|
528
527
|
}
|
|
529
528
|
}
|
|
530
|
-
let qt = class
|
|
529
|
+
let qt = class W {
|
|
531
530
|
constructor(t) {
|
|
532
531
|
o(this, "filters");
|
|
533
532
|
o(this, "sorting");
|
|
@@ -536,22 +535,22 @@ let qt = class G {
|
|
|
536
535
|
o(this, "reactTable");
|
|
537
536
|
o(this, "batches");
|
|
538
537
|
o(this, "loader");
|
|
539
|
-
const { render: e, filters: a = [], sorting: s = [], batchesController:
|
|
540
|
-
this.render = e, this.items = F.useNew(this), this.filters = a.map((l) => new Ut(this, l)), this.sorting = s.map((l) => new Ot(this, l)), this.batches = new zt(this,
|
|
538
|
+
const { render: e, filters: a = [], sorting: s = [], batchesController: n } = t;
|
|
539
|
+
this.render = e, this.items = F.useNew(this), this.filters = a.map((l) => new Ut(this, l)), this.sorting = s.map((l) => new Ot(this, l)), this.batches = new zt(this, n), this.loader = w.useNew(this, t.loader), this.reactTable = T.useNew(this, {
|
|
541
540
|
manualFiltering: this.loader.manualFiltering,
|
|
542
541
|
manualPagination: this.loader.manualPagination,
|
|
543
542
|
manualSorting: this.loader.manualSorting
|
|
544
543
|
});
|
|
545
544
|
}
|
|
546
545
|
static useNew(t) {
|
|
547
|
-
return new
|
|
546
|
+
return new W(t);
|
|
548
547
|
}
|
|
549
548
|
isFiltered() {
|
|
550
549
|
return this.filters.some((t) => t.isActive());
|
|
551
550
|
}
|
|
552
551
|
getSorting(t) {
|
|
553
552
|
const e = this.sorting.find((a) => a.property === t);
|
|
554
|
-
return
|
|
553
|
+
return j(!!e, `Could not get Sorting (property: ${t})`), e;
|
|
555
554
|
}
|
|
556
555
|
clearSorting() {
|
|
557
556
|
return this.sorting.forEach((t) => t.clear());
|
|
@@ -560,7 +559,7 @@ let qt = class G {
|
|
|
560
559
|
return this.filters.forEach((t) => t.clearValues());
|
|
561
560
|
}
|
|
562
561
|
};
|
|
563
|
-
const Kt = "flow--list--items--item-list", jt = "flow--list--items--is-loading",
|
|
562
|
+
const Kt = "flow--list--items--item-list", jt = "flow--list--items--is-loading", z = {
|
|
564
563
|
itemList: Kt,
|
|
565
564
|
isLoading: jt
|
|
566
565
|
}, Jt = "flow--list--items--item", Wt = "flow--list--items--options-button", Gt = "flow--list--items--avatar", Qt = "flow--list--items--text", Xt = "flow--list--items--status-badge", Yt = "flow--list--items--heading", Zt = "flow--list--items--content", c = {
|
|
@@ -571,10 +570,10 @@ const Kt = "flow--list--items--item-list", jt = "flow--list--items--is-loading",
|
|
|
571
570
|
statusBadge: Xt,
|
|
572
571
|
heading: Yt,
|
|
573
572
|
content: Zt
|
|
574
|
-
}, _t = (
|
|
575
|
-
const { className: t, children: e } =
|
|
576
|
-
return /* @__PURE__ */ r.createElement(
|
|
577
|
-
|
|
573
|
+
}, _t = (i) => {
|
|
574
|
+
const { className: t, children: e } = i, a = K(g);
|
|
575
|
+
return /* @__PURE__ */ r.createElement(at, null, /* @__PURE__ */ r.createElement(
|
|
576
|
+
h,
|
|
578
577
|
{
|
|
579
578
|
style: "plain",
|
|
580
579
|
className: t,
|
|
@@ -582,8 +581,8 @@ const Kt = "flow--list--items--item-list", jt = "flow--list--items--is-loading",
|
|
|
582
581
|
},
|
|
583
582
|
/* @__PURE__ */ r.createElement(Ct, null)
|
|
584
583
|
), e);
|
|
585
|
-
}, te = (
|
|
586
|
-
const { children: t } =
|
|
584
|
+
}, te = (i) => {
|
|
585
|
+
const { children: t } = i, e = rt(t, yt), a = {
|
|
587
586
|
Avatar: {
|
|
588
587
|
className: c.avatar
|
|
589
588
|
},
|
|
@@ -602,7 +601,7 @@ const Kt = "flow--list--items--item-list", jt = "flow--list--items--is-loading",
|
|
|
602
601
|
},
|
|
603
602
|
ContextMenu: {
|
|
604
603
|
placement: "bottom end",
|
|
605
|
-
hoc: (
|
|
604
|
+
hoc: (n) => /* @__PURE__ */ r.createElement(_t, { className: c.optionsButton }, n)
|
|
606
605
|
}
|
|
607
606
|
}, s = {
|
|
608
607
|
...a,
|
|
@@ -613,89 +612,89 @@ const Kt = "flow--list--items--item-list", jt = "flow--list--items--is-loading",
|
|
|
613
612
|
}
|
|
614
613
|
};
|
|
615
614
|
return /* @__PURE__ */ r.createElement(St, { if: !e }, /* @__PURE__ */ r.createElement("div", { className: c.item }, /* @__PURE__ */ r.createElement(bt, { props: s }, t)));
|
|
616
|
-
}, ee = (
|
|
617
|
-
const { className: t } =
|
|
618
|
-
|
|
615
|
+
}, ee = (i) => /* @__PURE__ */ r.createElement(vt, null, JSON.stringify(i.data)), ae = (i) => {
|
|
616
|
+
const { className: t } = i, e = m(), a = e.loader.useIsLoading(), s = e.items.entries.map((l) => /* @__PURE__ */ r.createElement(te, { key: l.id }, /* @__PURE__ */ r.createElement(et, null, l.render()))), n = $(
|
|
617
|
+
z.itemList,
|
|
619
618
|
t,
|
|
620
|
-
a &&
|
|
619
|
+
a && z.isLoading
|
|
621
620
|
);
|
|
622
|
-
return /* @__PURE__ */ r.createElement("div", { className:
|
|
621
|
+
return /* @__PURE__ */ r.createElement("div", { className: n }, s);
|
|
623
622
|
};
|
|
624
|
-
function se(
|
|
623
|
+
function se(i) {
|
|
625
624
|
return null;
|
|
626
625
|
}
|
|
627
|
-
function re(
|
|
626
|
+
function re(i) {
|
|
628
627
|
return null;
|
|
629
628
|
}
|
|
630
|
-
function ne(
|
|
629
|
+
function ne(i) {
|
|
631
630
|
return null;
|
|
632
631
|
}
|
|
633
|
-
function ie(
|
|
632
|
+
function ie(i) {
|
|
634
633
|
return null;
|
|
635
634
|
}
|
|
636
|
-
function oe(
|
|
635
|
+
function oe(i) {
|
|
637
636
|
return null;
|
|
638
637
|
}
|
|
639
638
|
const le = "flow--list--footer", ce = {
|
|
640
639
|
footer: le
|
|
641
|
-
}, ue = (
|
|
642
|
-
const t =
|
|
643
|
-
if (
|
|
640
|
+
}, ue = (i) => {
|
|
641
|
+
const t = q(g), e = m(), a = e.batches, s = e.isFiltered() && !e.loader.manualFiltering, n = a.getTotalItemsCount(), l = a.getFilteredItemsCount(), d = a.getVisibleItemsCount();
|
|
642
|
+
if (n === 0)
|
|
644
643
|
return null;
|
|
645
644
|
const S = s ? t("paginationInfoFiltered", {
|
|
646
|
-
visibleItemsCount:
|
|
645
|
+
visibleItemsCount: d,
|
|
647
646
|
filteredItemsCount: l,
|
|
648
|
-
totalItemsCount:
|
|
647
|
+
totalItemsCount: n
|
|
649
648
|
}) : t("paginationInfo", {
|
|
650
|
-
visibleItemsCount:
|
|
651
|
-
totalItemsCount:
|
|
649
|
+
visibleItemsCount: d,
|
|
650
|
+
totalItemsCount: n
|
|
652
651
|
});
|
|
653
|
-
return /* @__PURE__ */ r.createElement(
|
|
654
|
-
}, me = (
|
|
655
|
-
const t =
|
|
652
|
+
return /* @__PURE__ */ r.createElement(b, { ...i }, S);
|
|
653
|
+
}, me = (i) => {
|
|
654
|
+
const t = K(g), e = m(), a = e.loader.useIsLoading(), n = e.batches.hasNextBatch();
|
|
656
655
|
return /* @__PURE__ */ r.createElement(
|
|
657
|
-
|
|
656
|
+
h,
|
|
658
657
|
{
|
|
659
658
|
isPending: a,
|
|
660
|
-
...
|
|
659
|
+
...i,
|
|
661
660
|
onPress: () => e.batches.nextBatch(),
|
|
662
661
|
style: "plain",
|
|
663
|
-
isDisabled: !
|
|
662
|
+
isDisabled: !n,
|
|
664
663
|
size: "s"
|
|
665
664
|
},
|
|
666
665
|
t.format("showMore")
|
|
667
666
|
);
|
|
668
667
|
}, de = () => /* @__PURE__ */ r.createElement("div", { className: ce.footer }, /* @__PURE__ */ r.createElement(ue, null), /* @__PURE__ */ r.createElement(me, null));
|
|
669
|
-
function je(
|
|
668
|
+
function je(i) {
|
|
670
669
|
var L, I, B, A;
|
|
671
|
-
const { children: t, batchSize: e, ...a } =
|
|
670
|
+
const { children: t, batchSize: e, ...a } = i, s = (L = f(t, se)) == null ? void 0 : L.props, n = (I = f(
|
|
672
671
|
t,
|
|
673
672
|
Ft
|
|
674
|
-
)) == null ? void 0 : I.props, l = (B =
|
|
673
|
+
)) == null ? void 0 : I.props, l = (B = f(t, oe)) == null ? void 0 : B.props, d = {
|
|
675
674
|
source: s ? {
|
|
676
675
|
...s,
|
|
677
676
|
asyncLoader: s.children
|
|
678
|
-
} :
|
|
679
|
-
...
|
|
680
|
-
asyncResourceFactory:
|
|
677
|
+
} : n ? {
|
|
678
|
+
...n,
|
|
679
|
+
asyncResourceFactory: n.children
|
|
681
680
|
} : l ? {
|
|
682
681
|
staticData: l.data
|
|
683
682
|
} : void 0
|
|
684
|
-
}, S = (p) => /* @__PURE__ */ r.createElement(ee, { data: p }),
|
|
685
|
-
loader:
|
|
686
|
-
filters:
|
|
687
|
-
sorting:
|
|
688
|
-
render: ((A =
|
|
683
|
+
}, S = (p) => /* @__PURE__ */ r.createElement(ee, { data: p }), G = qt.useNew({
|
|
684
|
+
loader: d,
|
|
685
|
+
filters: V(t, re).map((p) => p.props),
|
|
686
|
+
sorting: V(t, ne).map((p) => p.props),
|
|
687
|
+
render: ((A = f(t, ie)) == null ? void 0 : A.props.children) ?? S,
|
|
689
688
|
...a,
|
|
690
689
|
batchesController: {
|
|
691
690
|
batchSize: e
|
|
692
691
|
}
|
|
693
692
|
});
|
|
694
693
|
return /* @__PURE__ */ r.createElement(
|
|
695
|
-
|
|
694
|
+
J.Provider,
|
|
696
695
|
{
|
|
697
696
|
value: {
|
|
698
|
-
list:
|
|
697
|
+
list: G
|
|
699
698
|
}
|
|
700
699
|
},
|
|
701
700
|
/* @__PURE__ */ r.createElement(Et, null),
|
package/dist/NumberField.js
CHANGED
|
@@ -10,7 +10,7 @@ import "@react-aria/utils";
|
|
|
10
10
|
import "./propsContext-Dx7WKmmM.js";
|
|
11
11
|
import "remeda";
|
|
12
12
|
import { F as f } from "./FieldError-BDRDWTgn.js";
|
|
13
|
-
import { B as s } from "./Button-
|
|
13
|
+
import { B as s } from "./Button-DTVMsKTK.js";
|
|
14
14
|
import "@tabler/icons-react";
|
|
15
15
|
import "html-react-parser";
|
|
16
16
|
import "@mittwald/react-tunnel";
|