@wssto2/vue-core 0.4.6 → 0.4.8

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.
Files changed (37) hide show
  1. package/README.md +2 -1
  2. package/dist/{Activity-BVk8iG3X.js → Activity-BqmMjwAS.js} +1 -1
  3. package/dist/{Changes-CaiZpcyW.js → Changes-CoDcwt3C.js} +1 -1
  4. package/dist/CollectionPage.vue_vue_type_script_setup_true_lang-C35PsfKK.js +1569 -0
  5. package/dist/{DataTable.vue_vue_type_script_setup_true_lang-KPm5NrDE.js → DataTable.vue_vue_type_script_setup_true_lang-4CL_kEKf.js} +21 -17
  6. package/dist/{DeadLetters-BOMgmmOg.js → DeadLetters-DaWaCeYJ.js} +2 -2
  7. package/dist/{General-BaW63VQg.js → General-sP35jv3T.js} +1 -1
  8. package/dist/{ProfilePage-Bbv5KH3L.js → ProfilePage-CMtis35I.js} +2 -2
  9. package/dist/{Sessions-r9WHf0nU.js → Sessions-CWqbbgzF.js} +1 -1
  10. package/dist/{SettingsPage-Dcib_TK0.js → SettingsPage-BYwmti4E.js} +1 -1
  11. package/dist/{SignIn-DJ-ai_ap.js → SignIn-BGs0x7Cg.js} +1 -1
  12. package/dist/{SignInPage-CJAsxvc6.js → SignInPage-Djhf9T9M.js} +1 -1
  13. package/dist/{SignInTable.vue_vue_type_script_setup_true_lang-ALAuc0sI.js → SignInTable.vue_vue_type_script_setup_true_lang-BxqBA5pD.js} +1 -1
  14. package/dist/{SignIns-NnIqezxn.js → SignIns-DkR9TvZT.js} +2 -2
  15. package/dist/{UserRecord-JZFQ40hK.js → UserRecord-C2jOiPcF.js} +2 -2
  16. package/dist/{UsersList-cfhb1GE7.js → UsersList-CFDuDIu_.js} +3 -3
  17. package/dist/collection/CollectionPage.vue.d.ts +2 -0
  18. package/dist/collection/CollectionRows.vue.d.ts +6 -1
  19. package/dist/collection/CollectionTable.vue.d.ts +9 -0
  20. package/dist/collection/CollectionToolbar.vue.d.ts +3 -2
  21. package/dist/collection/DataTable.vue.d.ts +3 -0
  22. package/dist/collection/index.js +3 -3
  23. package/dist/collection/rowInteractions.d.ts +3 -1
  24. package/dist/collection/useCollection.d.ts +4 -0
  25. package/dist/i18n/index.js +8 -8
  26. package/dist/identity/index.js +1 -1
  27. package/dist/{index-By5B18A3.js → index-0QeMiN0l.js} +10 -10
  28. package/dist/{index-7QcMXQZq.js → index-DtPd4laZ.js} +2 -2
  29. package/dist/index.d.ts +1 -1
  30. package/dist/index.js +1 -1
  31. package/dist/notifications/index.js +1 -1
  32. package/dist/rowLayout-D1cYQghV.js +663 -0
  33. package/dist/{status-Ct8ixCoS.js → status-7L8lC-_q.js} +1 -1
  34. package/dist/styles.css +1 -1
  35. package/package.json +1 -1
  36. package/dist/CollectionPage.vue_vue_type_script_setup_true_lang-kBBHIJTB.js +0 -1520
  37. package/dist/rowLayout-BkQWulan.js +0 -621
@@ -1,1520 +0,0 @@
1
- import { hasInjectionContext as et, inject as tt, shallowRef as _e, computed as x, watch as ze, toValue as Ce, ref as se, getCurrentScope as lt, onScopeDispose as ot, defineComponent as de, openBlock as d, createElementBlock as y, createVNode as C, unref as l, createElementVNode as c, toDisplayString as g, Fragment as Z, renderList as ee, createCommentVNode as z, createBlock as W, mergeProps as ue, withCtx as q, createTextVNode as J, normalizeClass as ae, useTemplateRef as ie, withModifiers as De, withDirectives as Ve, vModelText as Pe, nextTick as nt, onBeforeUnmount as st, onMounted as at, renderSlot as ve, useSlots as je, createSlots as He, normalizeProps as Ke, guardReactiveProps as We } from "vue";
2
- import { routerKey as rt } from "vue-router";
3
- import { i as Fe, a as ct } from "./error-CD7x0Jrz.js";
4
- import { a as it, d as qe, o as ut, L as Re, e as Se, w as dt, b as ft } from "./http-D_D9YbLH.js";
5
- import { a as pt } from "./AdaptivePageShell.vue_vue_type_script_setup_true_lang-B7qSUiee.js";
6
- import { useI18n as me } from "vue-i18n";
7
- import { _ as ce, u as Te } from "./Button.vue_vue_type_script_setup_true_lang-CL9Qh5yq.js";
8
- import { _ as Qe } from "./Tabs.vue_vue_type_script_setup_true_lang-CcMcE38r.js";
9
- import { u as Le } from "./format-B8mJm946.js";
10
- import { _ as B } from "./Icon.vue_vue_type_script_lang-D7oC-d-S.js";
11
- import { _ as Ne } from "./Banner.vue_vue_type_script_setup_true_lang-DSStj_5z.js";
12
- import { _ as vt } from "./EmptyState.vue_vue_type_script_setup_true_lang-50p-Mp8I.js";
13
- import { u as mt, _ as bt } from "./rowLayout-BkQWulan.js";
14
- import { _ as Xe } from "./Menu.vue_vue_type_script_setup_true_lang-uPmxWvds.js";
15
- import { _ as Je } from "./Popover.vue_vue_type_script_setup_true_lang-Dx-tDhNE.js";
16
- import { _ as we } from "./ToneDot.vue_vue_type_script_setup_true_lang-99rNn-L5.js";
17
- import { _ as gt } from "./NumberField.vue_vue_type_script_setup_true_lang-C7N5nq0P.js";
18
- import { _ as ht } from "./SelectField.vue_vue_type_script_setup_true_lang-BJoAkBo2.js";
19
- import { a as yt } from "./mediaQuery-CygcXmFW.js";
20
- import { _ as _t } from "./Sheet.vue_vue_type_script_setup_true_lang-DgOFV4fa.js";
21
- import { t as xe } from "./toast-CqSDTWRX.js";
22
- const re = (n) => n == null || n === "";
23
- function Ge(n) {
24
- if (!n) return [null, null];
25
- const [o = "", a = ""] = String(n).split(",");
26
- return [o.trim() || null, a.trim() || null];
27
- }
28
- function xt(n, o) {
29
- const a = re(n) ? "" : String(n), v = re(o) ? "" : String(o);
30
- return a === "" && v === "" ? null : `${a},${v}`;
31
- }
32
- function wt(n, o) {
33
- const a = re(o) ? null : new Set(String(o).split(",")), v = (n.options ?? []).filter(
34
- (i) => !n.dependsOn || !a || i.parentValue !== void 0 && a.has(String(i.parentValue))
35
- ), s = /* @__PURE__ */ new Map();
36
- for (const i of v) {
37
- const p = s.get(i.label) ?? { values: [], dot: i.dot }, f = String(i.value);
38
- p.values.includes(f) || p.values.push(f), s.set(i.label, p);
39
- }
40
- return [...s.entries()].map(([i, { values: p, dot: f }]) => ({ label: i, value: p.join(","), ...f ? { dot: f } : {} }));
41
- }
42
- function kt(n, o, a) {
43
- if (re(o)) return null;
44
- if (n.type === "range") {
45
- const [s, i] = Ge(String(o)), p = n.unit ? ` ${n.unit}` : "", f = (b) => `${n.unit ? a.formatNumber(Number(b)) : b}${p}`;
46
- return s !== null && i !== null ? `${f(s)} – ${f(i)}` : s !== null ? `${a.from.toLowerCase()} ${f(s)}` : i !== null ? `${a.until.toLowerCase()} ${f(i)}` : null;
47
- }
48
- const v = new Set(String(o).split(","));
49
- return (n.options ?? []).find((s) => v.has(String(s.value)))?.label ?? String(o);
50
- }
51
- function Ye(n, o, a) {
52
- const v = new Set(n.map((p) => p.key)), s = (p) => n.find((f) => f.dependsOn === p), i = [];
53
- for (const p of n.filter((f) => !f.dependsOn || !v.has(f.dependsOn))) {
54
- const f = [];
55
- for (let S = p; S && !f.includes(S); S = s(S.key)) f.push(S);
56
- const b = f.map((S) => ({ filter: S, value: kt(S, o[S.key], a) })).filter((S) => S.value !== null);
57
- b.length !== 0 && i.push({
58
- key: p.key,
59
- label: b.length === 1 ? b[0].filter.label : null,
60
- values: b.map((S) => S.value),
61
- clears: f.map((S) => S.key)
62
- });
63
- }
64
- return i;
65
- }
66
- function $t(n, o) {
67
- return n.filter((a) => !re(o[a.key])).length;
68
- }
69
- const Ae = /* @__PURE__ */ new WeakMap();
70
- function Ct(n, o, a, v) {
71
- let s = Ae.get(n);
72
- s || Ae.set(n, s = /* @__PURE__ */ new Map());
73
- const i = `${a}\0${v}`, p = s.get(i);
74
- if (p && p.id !== o)
75
- throw new Error(
76
- `useCollection("${o}"): the URL state key "${v}" is already used by the list "${p.id}" on this page. Two lists on one page each need their own \`state: { kind: "url", key }\`, or they overwrite each other's state.`
77
- );
78
- const f = p ?? { id: o, count: 0 };
79
- return f.count++, s.set(i, f), () => {
80
- --f.count <= 0 && s.delete(i);
81
- };
82
- }
83
- const Oe = (n) => n.status === "loaded" || n.status === "refreshing" || n.status === "stale", Ee = (n) => n instanceof Error && n.message !== "" ? n.message : String(n);
84
- function Eo(n, o) {
85
- const a = `useCollection("${n.id}")`, v = o.state;
86
- let s = null, i = "", p = "", f = () => {
87
- };
88
- if (v.kind === "url") {
89
- if (s = et() ? tt(rt, null) : null, !s) throw new Error(`${a}: a URL state needs the application's router. Call it while a component is being set up, with the router installed, or use \`state: { kind: "memory" }\`.`);
90
- if (!v.key) throw new Error(`${a}: \`state.key\` must not be empty.`);
91
- p = v.key, i = s.currentRoute.value.path, f = Ct(s, n.id, i, p);
92
- }
93
- const b = o.defaults ? it({
94
- ...n,
95
- query: { ...n.contract, sorts: n.contract.sorts ?? void 0, filters: n.contract.filters ?? void 0, views: n.contract.views ?? void 0 },
96
- defaults: { ...n.defaults, ...o.defaults }
97
- }).defaults : n.defaults, S = { search: o.defaults?.search ?? "", filters: o.defaults?.filters ?? {} }, R = o.defaults ? b : void 0, F = (() => {
98
- if (!s) return b;
99
- const e = s.currentRoute.value.query[p];
100
- return qe(n, Array.isArray(e) ? e[0] : e, R) ?? b;
101
- })(), w = _e(F), _ = _e({ status: "loading" }), L = _e(null), $ = _e(null), I = x(() => Oe(_.value) ? _.value.value : $.value);
102
- let N = !1, U = null, Q = 0, A = !1;
103
- const G = [];
104
- s && o.linked && oe(s.currentRoute.value.query, o.linked);
105
- function oe(e, u) {
106
- let O = w.value;
107
- const D = (K) => {
108
- const T = e[K], le = Array.isArray(T) ? T[0] : T;
109
- return typeof le == "string" && le !== "" ? le : null;
110
- };
111
- if (u.view) {
112
- const K = D(u.view), T = K !== null && (n.contract.views ? n.contract.views.includes(K) : !0);
113
- K !== null && T && (O = { ...O, view: K, page: 1 }, G.push(u.view));
114
- }
115
- for (const [K, T] of Object.entries(u.params ?? {})) {
116
- const le = D(K);
117
- if (le === null) continue;
118
- const E = typeof T == "string" ? T : T.filter, M = typeof T == "string" ? le : T.value(le), Y = { ...O.filters };
119
- M === null || M === "any" || M === "" ? delete Y[E] : Y[E] = String(M), O = { ...O, filters: Y, page: 1 }, G.push(K);
120
- }
121
- if (G.length > 0) {
122
- for (const K of u.consume ?? []) K in e && G.push(K);
123
- w.value = O;
124
- }
125
- }
126
- async function te(e) {
127
- if (N) return;
128
- U?.abort();
129
- const u = ++Q, O = U = new AbortController(), D = _.value, K = w.value;
130
- _.value = e && Oe(D) ? { status: "refreshing", value: D.value } : { status: "loading" };
131
- try {
132
- const T = await n.load(K, { signal: O.signal });
133
- if (u !== Q) return;
134
- if (T.lastPage >= 1 && K.page > T.lastPage) {
135
- w.value = { ...K, page: T.lastPage }, P(), te(!1);
136
- return;
137
- }
138
- L.value = null, $.value = T, _.value = { status: "loaded", value: T };
139
- } catch (T) {
140
- if (u !== Q || O.signal.aborted || Fe(T)) return;
141
- L.value = T, _.value = e && Oe(D) ? { status: "stale", value: D.value, error: Ee(T) } : { status: "failed", error: Ee(T) };
142
- }
143
- }
144
- function k() {
145
- P(), !(A || N) && (A = !0, queueMicrotask(() => {
146
- A && (A = !1, te(!1));
147
- }));
148
- }
149
- function H() {
150
- return A = !1, te(!0);
151
- }
152
- let V = !1, h = !1, j = !1;
153
- function P() {
154
- !s || V || N || (V = !0, queueMicrotask(() => {
155
- V = !1, ne();
156
- }));
157
- }
158
- async function ne() {
159
- if (s) {
160
- if (h) {
161
- j = !0;
162
- return;
163
- }
164
- h = !0;
165
- try {
166
- do {
167
- j = !1;
168
- const e = s.currentRoute.value;
169
- if (N || e.path !== i) return;
170
- const u = Se(n, w.value, R), O = { ...e.query };
171
- for (const D of G.splice(0)) delete O[D];
172
- e.query[p] === u && Object.keys(O).length === Object.keys(e.query).length || await s.replace({ query: { ...O, [p]: u }, hash: e.hash });
173
- } while (j);
174
- } catch {
175
- } finally {
176
- h = !1;
177
- }
178
- }
179
- }
180
- const fe = s ? ze(
181
- () => s.currentRoute.value.query[p],
182
- (e) => {
183
- const u = s.currentRoute.value;
184
- if (N || h || u.path !== i) return;
185
- const O = Array.isArray(e) ? e[0] : e, D = qe(n, O, R) ?? b;
186
- JSON.stringify(D) !== JSON.stringify(w.value) ? (w.value = D, k()) : P();
187
- }
188
- ) : () => {
189
- }, X = (e, u = !1) => {
190
- w.value = { ...w.value, ...e, ...u ? { page: 1 } : {} }, k();
191
- }, be = (e) => {
192
- const u = { ...w.value.filters };
193
- for (const [O, D] of Object.entries(e))
194
- D == null || re(D) ? delete u[O] : u[O] = String(D);
195
- return u;
196
- }, pe = x(
197
- () => w.value.search !== "" && w.value.search !== S.search || Object.entries(w.value.filters).some(([e, u]) => !re(u) && u !== S.filters[e])
198
- ), ge = x(() => I.value?.rows ?? []), he = x(() => {
199
- const e = _.value;
200
- return e.status === "loading" ? "loading" : e.status === "failed" ? "failed" : e.value.rows.length > 0 ? "rows" : pe.value ? "no-matches" : "empty";
201
- }), ke = x(() => {
202
- const e = new Map((I.value?.views ?? []).map((u) => [u.key, u.count]));
203
- return (Ce(o.views) ?? []).map((u) => e.has(u.key) ? { ...u, count: e.get(u.key) } : u);
204
- });
205
- let ye = () => {
206
- };
207
- const $e = o.savedViews ? m(o.savedViews) : null;
208
- function r(e) {
209
- const u = { v: e.state.version, f: e.state.filters, s: e.state.search, w: e.state.view ?? void 0 };
210
- return ft(n, u, R);
211
- }
212
- function m(e) {
213
- const u = se([]), O = se("idle");
214
- let D = null;
215
- const K = (E, M) => E.name.localeCompare(M.name), T = x(() => u.value.filter((E) => r(E) !== null));
216
- ye = () => {
217
- D?.abort(), u.value = [], O.value = "idle";
218
- };
219
- const le = () => ({
220
- version: n.stateVersion,
221
- filters: Object.fromEntries(Object.entries(w.value.filters).filter(([E, M]) => M !== void 0 && !n.contract.sensitive.includes(E))),
222
- search: w.value.search,
223
- view: w.value.view
224
- });
225
- return {
226
- items: T,
227
- status: O,
228
- async load() {
229
- D?.abort();
230
- const E = D = new AbortController();
231
- O.value = "loading";
232
- try {
233
- const M = await e.list(n.id, { signal: E.signal });
234
- if (E.signal.aborted) return;
235
- u.value = [...M].sort(K), O.value = "ready";
236
- } catch (M) {
237
- if (E.signal.aborted || Fe(M)) return;
238
- O.value = "failed";
239
- }
240
- },
241
- current: le,
242
- async save(E, M) {
243
- const Y = await e.save(n.id, E, { ...le(), ...M });
244
- return u.value = [...u.value.filter((Ze) => Ze.id !== Y.id), Y].sort(K), Y;
245
- },
246
- apply(E) {
247
- const M = r(E);
248
- M && X({ filters: M.filters, search: M.search, view: E.state.view ? M.view : w.value.view }, !0);
249
- },
250
- stageRemoval(E) {
251
- const M = u.value.find((Y) => Y.id === E) ?? null;
252
- return u.value = u.value.filter((Y) => Y.id !== E), {
253
- revert() {
254
- M && !u.value.some((Y) => Y.id === E) && (u.value = [...u.value, M].sort(K));
255
- },
256
- // Saved again under the same name while the toast was up: the server replaced that very row, it must not be deleted now.
257
- async commit() {
258
- u.value.some((Y) => Y.id === E) || await e.remove(n.id, E);
259
- }
260
- };
261
- }
262
- };
263
- }
264
- function t() {
265
- N || (N = !0, U?.abort(), Q++, fe(), f());
266
- }
267
- return lt() && ot(t), ut((e) => {
268
- U?.abort(), Q++, _.value = { status: "loading" }, $.value = null, L.value = null, ye(), e !== null && k();
269
- }), k(), {
270
- id: n.id,
271
- pageSizes: n.contract.pageSizes,
272
- searchable: n.contract.search,
273
- rowKey: (e) => n.key(e),
274
- state: _,
275
- query: w,
276
- page: I,
277
- rows: ge,
278
- total: x(() => I.value?.total ?? 0),
279
- display: he,
280
- isFiltered: pe,
281
- error: L,
282
- columns: x(() => {
283
- const e = Ce(o.columns) ?? [], u = n.contract.sorts;
284
- if (u) {
285
- for (const O of e) if (O.sort !== void 0 && !u.includes(O.sort)) throw new Error(`${a}: column "${O.key}" sorts by "${O.sort}", which is not in the query contract's sorts (${u.join(", ")}).`);
286
- }
287
- return e;
288
- }),
289
- filters: x(() => Ce(o.filters) ?? []),
290
- views: ke,
291
- savedViews: $e,
292
- refresh: H,
293
- goToPage: (e) => {
294
- Number.isInteger(e) && e >= 1 && e !== w.value.page && X({ page: e });
295
- },
296
- nextPage: () => {
297
- const e = I.value?.lastPage ?? 0;
298
- w.value.page < e && X({ page: w.value.page + 1 });
299
- },
300
- previousPage: () => {
301
- w.value.page > 1 && X({ page: w.value.page - 1 });
302
- },
303
- setPageSize: (e) => {
304
- n.contract.pageSizes.includes(e) && e !== w.value.pageSize && X({ pageSize: e }, !0);
305
- },
306
- sortBy: (e, u = "asc") => {
307
- if (n.contract.sorts && !n.contract.sorts.includes(e)) throw new Error(`${a}: "${e}" is not in the query contract's sorts.`);
308
- X({ sort: e, direction: u });
309
- },
310
- toggleSort: (e) => {
311
- const u = w.value;
312
- X({ sort: e, direction: u.sort === e && u.direction === "asc" ? "desc" : "asc" });
313
- },
314
- search: (e) => X({ search: e }, !0),
315
- setFilter: (e, u) => X({ filters: be({ [e]: u }) }, !0),
316
- setFilters: (e) => X({ filters: be(e) }, !0),
317
- clearFilters: () => X({ filters: {}, search: "" }, !0),
318
- setView: (e) => X({ view: e }, !0),
319
- reset: () => {
320
- w.value = b, k();
321
- },
322
- recordLocation: (e) => {
323
- const u = o.recordRoute?.(e);
324
- return u ? s ? dt(u, { [Re]: Se(n, w.value, R) }) : u : null;
325
- },
326
- linkContext: () => s ? { [Re]: Se(n, w.value, R) } : {}
327
- };
328
- }
329
- const St = {
330
- class: "mx-auto max-w-xl py-8 text-center",
331
- "data-test": "collection-empty-filtered"
332
- }, Ot = { class: "mt-3 mb-1 text-headline font-semibold text-content-strong" }, jt = { class: "text-sm text-content-muted" }, zt = { class: "mt-4 flex flex-wrap justify-center gap-2" }, Vt = {
333
- key: 0,
334
- class: "shrink-0 text-content-muted"
335
- }, Pt = ["title"], Lt = ["aria-label", "onClick"], Ft = { class: "mt-5 flex flex-wrap justify-center gap-2" }, qt = /* @__PURE__ */ de({
336
- __name: "CollectionEmptyResult",
337
- props: {
338
- chips: {},
339
- lastChip: {}
340
- },
341
- emits: ["remove", "clearAll"],
342
- setup(n, { emit: o }) {
343
- const a = n, v = o, { t: s } = me();
344
- return (i, p) => (d(), y("div", St, [
345
- C(l(B), {
346
- name: "filter3",
347
- size: 32,
348
- class: "mx-auto text-content-disabled"
349
- }),
350
- c("h3", Ot, g(l(s)("core.collection.empty.title")), 1),
351
- c("p", jt, g(l(s)("core.collection.empty.description")), 1),
352
- c("ul", zt, [
353
- (d(!0), y(Z, null, ee(a.chips, (f) => (d(), y("li", {
354
- key: f.key,
355
- class: "inline-flex h-7 max-w-full min-w-0 items-center gap-1.5 rounded-control bg-surface-cell pr-0.5 pl-2.5 text-sm shadow-group ring-1 ring-inset ring-border-separator"
356
- }, [
357
- f.label ? (d(), y("span", Vt, g(f.label), 1)) : z("", !0),
358
- c("span", {
359
- class: "min-w-0 truncate font-medium text-content-strong",
360
- title: f.values.join(" › ")
361
- }, g(f.values.join(" › ")), 9, Pt),
362
- c("button", {
363
- type: "button",
364
- class: "shrink-0 cursor-pointer rounded p-1 text-content-disabled hover:bg-fill hover:text-content-strong",
365
- "aria-label": `${l(s)("core.collection.clear")}: ${f.label ?? f.values.join(" › ")}`,
366
- onClick: (b) => v("remove", f)
367
- }, [
368
- C(l(B), {
369
- name: "close",
370
- size: 12
371
- })
372
- ], 8, Lt)
373
- ]))), 128))
374
- ]),
375
- c("div", Ft, [
376
- a.lastChip ? (d(), W(ce, ue({ key: 0 }, { "data-test": "collection-empty-remove-last" }, {
377
- prominence: "secondary",
378
- size: "sm",
379
- onClick: p[0] || (p[0] = (f) => v("remove", a.lastChip))
380
- }), {
381
- default: q(() => [
382
- J(g(l(s)("core.collection.empty.remove_last", { filter: a.lastChip.values.join(" › ") })), 1)
383
- ]),
384
- _: 1
385
- }, 16)) : z("", !0),
386
- C(ce, ue({ "data-test": "collection-empty-clear-all" }, {
387
- size: "sm",
388
- onClick: p[1] || (p[1] = (f) => v("clearAll"))
389
- }), {
390
- default: q(() => [
391
- J(g(l(s)("core.collection.empty.clear_all")), 1)
392
- ]),
393
- _: 1
394
- }, 16)
395
- ])
396
- ]));
397
- }
398
- }), Rt = ["aria-label"], Tt = ["disabled"], Nt = { class: "sr-only" }, At = {
399
- class: "text-subheadline tabular-nums text-content-muted",
400
- "aria-live": "polite"
401
- }, Et = ["disabled"], Ut = { class: "sr-only" }, Mt = {
402
- key: 1,
403
- class: "flex select-none flex-col items-center justify-between gap-3 border-t border-border-separator px-4 py-2.5 md:flex-row"
404
- }, Bt = { class: "flex flex-col items-center gap-x-4 text-footnote tabular-nums text-content-muted md:flex-row" }, It = {
405
- key: 0,
406
- "aria-live": "polite"
407
- }, Dt = { class: "flex items-center" }, Ht = { class: "mr-2" }, Kt = ["value"], Wt = ["value"], Qt = ["aria-label"], Xt = ["disabled"], Jt = { class: "sr-only" }, Gt = {
408
- key: 0,
409
- class: "px-1.5 text-content-disabled"
410
- }, Yt = ["aria-current", "onClick"], Zt = ["disabled"], el = { class: "sr-only" }, tl = /* @__PURE__ */ de({
411
- __name: "CollectionPager",
412
- props: {
413
- collection: {},
414
- compact: { type: Boolean },
415
- flat: { type: Boolean }
416
- },
417
- emits: ["turned"],
418
- setup(n, { emit: o }) {
419
- const a = n, v = o, { t: s } = me(), i = Le(), p = x(() => a.collection.query.value.page), f = x(() => a.collection.page.value?.lastPage ?? 0), b = x(() => a.collection.page.value), S = x(() => {
420
- if (f.value <= 1) return f.value === 1 ? [1] : [];
421
- const _ = [1], L = Math.max(2, p.value - 2), $ = Math.min(f.value - 1, p.value + 2);
422
- L > 2 && _.push(null);
423
- for (let I = L; I <= $; I++) _.push(I);
424
- return $ < f.value - 1 && _.push(null), _.push(f.value), _;
425
- });
426
- function R(_) {
427
- _ === 1 ? a.collection.nextPage() : a.collection.previousPage(), v("turned");
428
- }
429
- const F = (_) => [
430
- "hit-target inline-flex h-7 min-w-7 cursor-pointer items-center justify-center rounded-button px-2 transition-colors duration-motion-fast disabled:cursor-not-allowed disabled:opacity-40",
431
- _ ? "bg-tint font-semibold text-content-on-tint" : "text-content-strong hover:bg-fill disabled:hover:bg-transparent"
432
- ].join(" ");
433
- function w(_) {
434
- a.collection.setPageSize(Number(_.target.value));
435
- }
436
- return (_, L) => a.compact && f.value > 1 ? (d(), y("nav", {
437
- key: 0,
438
- "aria-label": l(s)("core.collection.page.label"),
439
- class: ae(["flex select-none items-center justify-between gap-3 px-1 py-2", a.flat ? "mt-1" : "border-t border-border-separator"]),
440
- "data-test": "collection-pager-compact"
441
- }, [
442
- c("button", {
443
- type: "button",
444
- class: "inline-flex size-11 cursor-pointer items-center justify-center rounded-full text-content-link active:bg-fill disabled:cursor-not-allowed disabled:text-content-disabled",
445
- disabled: p.value <= 1,
446
- onClick: L[0] || (L[0] = ($) => R(-1))
447
- }, [
448
- C(l(B), {
449
- name: "arrowLeftSLine",
450
- size: 20
451
- }),
452
- c("span", Nt, g(l(s)("core.collection.page.previous")), 1)
453
- ], 8, Tt),
454
- c("span", At, g(l(s)("core.collection.page.page_of", { current: l(i).number(p.value), total: l(i).number(f.value) })), 1),
455
- c("button", {
456
- type: "button",
457
- class: "inline-flex size-11 cursor-pointer items-center justify-center rounded-full text-content-link active:bg-fill disabled:cursor-not-allowed disabled:text-content-disabled",
458
- disabled: p.value >= f.value,
459
- onClick: L[1] || (L[1] = ($) => R(1))
460
- }, [
461
- C(l(B), {
462
- name: "arrowRightSLine",
463
- size: 20
464
- }),
465
- c("span", Ut, g(l(s)("core.collection.page.next")), 1)
466
- ], 8, Et)
467
- ], 10, Rt)) : a.compact ? z("", !0) : (d(), y("div", Mt, [
468
- c("div", Bt, [
469
- b.value ? (d(), y("span", It, g(l(s)("core.collection.page.total", { from: l(i).number(b.value.from), to: l(i).number(b.value.to), total: l(i).number(b.value.total) })), 1)) : z("", !0),
470
- c("label", Dt, [
471
- c("span", Ht, g(l(s)("core.collection.page.per_page")) + ":", 1),
472
- c("select", {
473
- value: a.collection.query.value.pageSize,
474
- class: "cursor-pointer rounded-control bg-transparent py-0.5 pr-1 font-semibold text-content-strong hover:bg-fill",
475
- onChange: w
476
- }, [
477
- (d(!0), y(Z, null, ee(a.collection.pageSizes, ($) => (d(), y("option", {
478
- key: $,
479
- value: $
480
- }, g($), 9, Wt))), 128))
481
- ], 40, Kt)
482
- ])
483
- ]),
484
- c("nav", {
485
- "aria-label": l(s)("core.collection.page.label"),
486
- class: "flex items-center gap-0.5 text-subheadline tabular-nums"
487
- }, [
488
- c("button", {
489
- type: "button",
490
- class: ae(F(!1)),
491
- disabled: p.value <= 1,
492
- onClick: L[2] || (L[2] = ($) => R(-1))
493
- }, [
494
- C(l(B), {
495
- name: "arrowLeftSLine",
496
- size: 16
497
- }),
498
- c("span", Jt, g(l(s)("core.collection.page.previous")), 1)
499
- ], 10, Xt),
500
- (d(!0), y(Z, null, ee(S.value, ($, I) => (d(), y(Z, { key: I }, [
501
- $ === null ? (d(), y("span", Gt, "…")) : (d(), y("button", {
502
- key: 1,
503
- type: "button",
504
- class: ae(F($ === p.value)),
505
- "aria-current": $ === p.value ? "page" : void 0,
506
- onClick: (N) => a.collection.goToPage($)
507
- }, g(l(i).number($)), 11, Yt))
508
- ], 64))), 128)),
509
- c("button", {
510
- type: "button",
511
- class: ae(F(!1)),
512
- disabled: p.value >= f.value,
513
- onClick: L[3] || (L[3] = ($) => R(1))
514
- }, [
515
- C(l(B), {
516
- name: "arrowRightSLine",
517
- size: 16
518
- }),
519
- c("span", el, g(l(s)("core.collection.page.next")), 1)
520
- ], 10, Zt)
521
- ], 8, Qt)
522
- ]));
523
- }
524
- }), ll = ["onClick"], ol = { class: "max-w-56 truncate" }, nl = { class: "flex flex-col gap-1.5 text-footnote font-medium text-content-muted" }, sl = ["placeholder"], al = { class: "flex items-center justify-between gap-2" }, rl = {
525
- type: "submit",
526
- class: "cursor-pointer rounded-control bg-tint px-3 py-1.5 text-footnote font-semibold text-content-on-tint"
527
- }, cl = ["onClick"], il = { class: "max-w-56 truncate" }, Ue = "inline-flex shrink-0 cursor-pointer items-center gap-x-2 rounded-button px-3 py-1.5 text-subheadline transition-colors duration-motion-fast focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-border-focus", ul = /* @__PURE__ */ de({
528
- __name: "CollectionFilterMenu",
529
- props: {
530
- filter: {},
531
- value: {}
532
- },
533
- emits: ["update"],
534
- setup(n, { emit: o }) {
535
- const a = n, v = o, { t: s } = me(), i = x(() => re(a.value) ? null : String(a.value)), p = x(() => a.filter.options?.find((N) => String(N.value) === i.value) ?? null), f = x(() => [
536
- ...a.filter.withoutDefaultOption ? [] : [{ id: "__all", label: a.filter.defaultOptionTitle ?? s("core.collection.filters.show_all"), checked: i.value === null, onSelect: () => v("update", null) }],
537
- ...(a.filter.options ?? []).map((U) => ({
538
- id: `option-${String(U.value)}`,
539
- label: U.label,
540
- icon: U.icon,
541
- dot: U.dot,
542
- checked: i.value === String(U.value),
543
- onSelect: () => v("update", String(U.value))
544
- }))
545
- ]), b = x(() => a.filter.type === "text" && i.value ? `${a.filter.label}: ${i.value}` : p.value?.label ?? a.filter.label), S = x(() => i.value !== null), R = x(
546
- () => S.value ? "bg-tint-soft font-semibold text-content-link" : "bg-surface-cell font-medium text-content-strong ring-1 ring-inset ring-border-separator hover:bg-fill"
547
- ), F = se(""), w = ie("popover");
548
- ze(i, (N) => F.value = N ?? "", { immediate: !0 });
549
- function _() {
550
- const N = F.value.trim();
551
- v("update", N === "" ? null : N), w.value?.dismiss();
552
- }
553
- function L() {
554
- F.value = "", v("update", null), w.value?.dismiss();
555
- }
556
- const $ = ie("field");
557
- async function I() {
558
- await nt(), $.value?.focus();
559
- }
560
- return (N, U) => a.filter.type === "text" ? (d(), W(l(Je), {
561
- key: 0,
562
- ref_key: "popover",
563
- ref: w,
564
- label: a.filter.label,
565
- width: "md",
566
- placement: "bottom-start",
567
- onPresented: I
568
- }, {
569
- trigger: q(({ toggle: Q, attrs: A }) => [
570
- c("button", ue(A, {
571
- type: "button",
572
- class: [Ue, R.value],
573
- onClick: Q
574
- }), [
575
- a.filter.icon ? (d(), W(l(B), {
576
- key: 0,
577
- name: a.filter.icon,
578
- size: 16
579
- }, null, 8, ["name"])) : z("", !0),
580
- c("span", ol, g(b.value), 1),
581
- C(l(B), {
582
- name: "arrowDownSLine",
583
- size: 16,
584
- class: "text-content-muted"
585
- })
586
- ], 16, ll)
587
- ]),
588
- default: q(() => [
589
- c("form", {
590
- class: "flex flex-col gap-3",
591
- onSubmit: De(_, ["prevent"])
592
- }, [
593
- c("label", nl, [
594
- J(g(a.filter.label) + " ", 1),
595
- Ve(c("input", {
596
- ref_key: "field",
597
- ref: $,
598
- "onUpdate:modelValue": U[0] || (U[0] = (Q) => F.value = Q),
599
- type: "text",
600
- autocomplete: "off",
601
- placeholder: l(s)("core.collection.filters.type_to_filter"),
602
- class: "rounded-control bg-fill px-2.5 py-1.5 text-body text-content-strong outline-none placeholder:text-content-disabled focus:bg-surface-cell focus:ring-[1.5px] focus:ring-inset focus:ring-border-focus"
603
- }, null, 8, sl), [
604
- [Pe, F.value]
605
- ])
606
- ]),
607
- c("div", al, [
608
- c("button", {
609
- type: "button",
610
- class: "cursor-pointer rounded-control px-2 py-1 text-footnote text-content-muted hover:text-content-strong",
611
- onClick: L
612
- }, g(l(s)("core.collection.filters.clear")), 1),
613
- c("button", rl, g(l(s)("core.collection.filters.apply")), 1)
614
- ])
615
- ], 32)
616
- ]),
617
- _: 1
618
- }, 8, ["label"])) : (d(), W(l(Xe), {
619
- key: 1,
620
- items: f.value,
621
- label: a.filter.label,
622
- placement: "bottom-start"
623
- }, {
624
- trigger: q(({ toggle: Q, attrs: A }) => [
625
- c("button", ue(A, {
626
- type: "button",
627
- class: [Ue, R.value],
628
- onClick: Q
629
- }), [
630
- a.filter.icon ? (d(), W(l(B), {
631
- key: 0,
632
- name: a.filter.icon,
633
- size: 16
634
- }, null, 8, ["name"])) : z("", !0),
635
- p.value?.dot ? (d(), W(we, {
636
- key: 1,
637
- tone: p.value.dot
638
- }, null, 8, ["tone"])) : z("", !0),
639
- c("span", il, g(b.value), 1),
640
- C(l(B), {
641
- name: "arrowDownSLine",
642
- size: 16,
643
- class: "text-content-muted"
644
- })
645
- ], 16, cl)
646
- ]),
647
- _: 1
648
- }, 8, ["items", "label"]));
649
- }
650
- }), dl = {
651
- key: 0,
652
- "data-test": "filter-drilldown"
653
- }, fl = { class: "mb-3 text-headline font-semibold" }, pl = ["aria-label"], vl = ["aria-selected", "onClick"], ml = { class: "flex min-w-0 items-center gap-2" }, bl = { class: "min-w-0 truncate" }, gl = {
654
- key: 0,
655
- class: "mb-5 border-b border-border-separator pb-5",
656
- "data-test": "saved-filters"
657
- }, hl = { class: "mb-2 text-footnote font-medium text-content-muted" }, yl = { class: "flex flex-wrap gap-2" }, _l = ["onClick"], xl = ["aria-label", "title", "onClick"], wl = { class: "space-y-5" }, kl = { key: 0 }, $l = { class: "mb-1.5 text-footnote font-medium text-content-muted" }, Cl = ["aria-label"], Sl = { class: "mb-1.5 text-footnote font-medium text-content-muted" }, Ol = {
658
- key: 0,
659
- class: "grid grid-cols-2 gap-3"
660
- }, jl = ["aria-label"], zl = { class: "mb-2 text-footnote font-medium text-content-muted" }, Vl = { class: "flex flex-wrap gap-2" }, Pl = ["aria-pressed", "onClick"], Ll = { class: "inline-flex items-center gap-2" }, Fl = ["disabled", "onClick"], ql = { class: "shrink-0 text-subheadline font-medium" }, Rl = { class: "truncate" }, Tl = { class: "flex items-center justify-between gap-2" }, Nl = { class: "flex items-center gap-2" }, Al = ["title"], El = { class: "sm:hidden" }, Ul = { class: "hidden sm:inline" }, Ml = { class: "flex flex-col gap-1.5 text-footnote font-medium text-content-muted" }, Bl = ["placeholder"], Il = {
661
- key: 0,
662
- class: "text-footnote text-status-warning-content",
663
- "data-test": "saved-filter-replace-hint"
664
- }, Dl = { class: "flex justify-end gap-2" }, Hl = 8, Kl = 18, Me = 6e3, Wl = /* @__PURE__ */ de({
665
- __name: "CollectionFilterPanel",
666
- props: {
667
- collection: {},
668
- filters: {}
669
- },
670
- emits: ["touched"],
671
- setup(n, { expose: o, emit: a }) {
672
- const v = n, s = a, { t: i } = me(), p = ie("sheet"), f = yt("(max-width: 1023px), (pointer: coarse)"), b = se({}), S = se({}), R = se(null), F = x(() => v.filters.find((r) => r.key === R.value) ?? null);
673
- function w() {
674
- const r = {}, m = {};
675
- for (const t of v.filters) {
676
- const e = v.collection.query.value.filters[t.key];
677
- if (r[t.key] = re(e) ? null : String(e), t.type === "range") {
678
- const [u, O] = Ge(r[t.key]);
679
- m[t.key] = { min: u ?? "", max: O ?? "" };
680
- }
681
- }
682
- b.value = r, S.value = m, R.value = null, p.value?.present();
683
- }
684
- function _(r, m) {
685
- const t = re(m) ? null : String(m);
686
- if (b.value[r] !== t) {
687
- b.value = { ...b.value, [r]: t };
688
- for (const e of v.filters.filter((u) => u.dependsOn === r)) _(e.key, null);
689
- }
690
- }
691
- function L() {
692
- for (const r of v.filters)
693
- b.value[r.key] = null, r.type === "range" && (S.value[r.key] = { min: "", max: "" });
694
- }
695
- const $ = (r) => r.replace(/[^\d.,-]/g, "").replace(",", "."), I = (r, m) => {
696
- const t = S.value[r]?.[m] ?? "", e = t === "" ? Number.NaN : Number($(t));
697
- return Number.isNaN(e) ? null : e;
698
- };
699
- function N(r, m, t) {
700
- const e = S.value[r];
701
- e && (e[m] = t === null ? "" : String(t));
702
- }
703
- function U() {
704
- const r = {};
705
- for (const m of v.filters) {
706
- const t = S.value[m.key];
707
- r[m.key] = m.type === "range" ? xt(t ? $(t.min) : null, t ? $(t.max) : null) : b.value[m.key] ?? null;
708
- }
709
- return r;
710
- }
711
- function Q() {
712
- const r = U(), m = Object.keys(r).filter((t) => (v.collection.query.value.filters[t] ?? null) !== r[t]);
713
- s("touched", m), v.collection.setFilters(r), p.value?.dismiss();
714
- }
715
- const A = (r) => wt(r, r.dependsOn ? b.value[r.dependsOn] : null), G = (r) => r.defaultOptionTitle ?? i("core.collection.filters.show_all");
716
- function oe(r) {
717
- const m = b.value[r.key];
718
- return m == null ? G(r) : A(r).find((t) => t.value === m)?.label ?? m;
719
- }
720
- const te = (r) => [{ value: null, label: G(r) }, ...A(r)], k = (r) => {
721
- const m = b.value[r.key];
722
- return m == null ? void 0 : A(r).find((t) => t.value === m)?.dot;
723
- }, H = (r) => [
724
- { value: "", label: G(r) },
725
- ...A(r).map((m) => ({ value: String(m.value), label: m.label, dot: m.dot }))
726
- ], V = (r) => [
727
- { value: "", label: G(r) },
728
- ...(r.options ?? []).map((m) => ({ value: String(m.value), label: m.label }))
729
- ];
730
- function h(r) {
731
- const m = A(r);
732
- return !r.dependsOn && m.length > 0 && m.length <= Hl && m.every((t) => t.label.length <= Kl);
733
- }
734
- const j = x(() => f.value && F.value !== null), P = x(() => v.collection.savedViews), ne = se(""), fe = se(!1), X = ie("savePopover");
735
- function be() {
736
- const r = new Set(v.filters.map((t) => t.key)), m = {};
737
- for (const [t, e] of Object.entries(v.collection.query.value.filters))
738
- !r.has(t) && e !== void 0 && e !== "" && (m[t] = String(e));
739
- for (const [t, e] of Object.entries(U())) e !== null && (m[t] = e);
740
- return { filters: m, search: v.collection.query.value.search };
741
- }
742
- const pe = x(() => {
743
- const r = be();
744
- return Object.keys(r.filters).length > 0 || r.search.trim() !== "";
745
- }), ge = x(() => {
746
- const r = ne.value.trim();
747
- return r ? P.value?.items.value.find((m) => m.name === r) ?? null : null;
748
- }), he = (r, m) => ct(r) && r.message ? r.message : m;
749
- async function ke() {
750
- const r = ne.value.trim(), m = P.value;
751
- if (!(!m || !r || fe.value || !pe.value)) {
752
- fe.value = !0;
753
- try {
754
- const t = await m.save(r, be());
755
- ne.value = "", X.value?.dismiss(), xe.success(i("core.collection.saved.saved_toast", { name: t.name })), m.apply(t), s("touched", []), p.value?.dismiss();
756
- } catch (t) {
757
- xe.error(he(t, i("core.collection.saved.save_failed")));
758
- } finally {
759
- fe.value = !1;
760
- }
761
- }
762
- }
763
- function ye(r) {
764
- P.value?.apply(r), s("touched", []), p.value?.dismiss();
765
- }
766
- function $e(r) {
767
- const m = P.value;
768
- if (!m) return;
769
- const { revert: t, commit: e } = m.stageRemoval(r.id), u = setTimeout(() => {
770
- e().catch((O) => {
771
- t(), xe.error(he(O, i("core.collection.saved.delete_failed")));
772
- });
773
- }, Me);
774
- xe.success(i("core.collection.saved.deleted_toast", { name: r.name }), {
775
- duration: Me,
776
- action: {
777
- label: i("core.collection.saved.undo"),
778
- onClick: () => {
779
- clearTimeout(u), t();
780
- }
781
- }
782
- });
783
- }
784
- return o({ present: w }), (r, m) => (d(), W(l(_t), {
785
- ref_key: "sheet",
786
- ref: p,
787
- title: l(i)("core.collection.filters.panel_title"),
788
- grouped: j.value
789
- }, {
790
- footer: q(() => [
791
- c("div", Tl, [
792
- C(ce, {
793
- prominence: "standard",
794
- class: "whitespace-nowrap",
795
- onClick: L
796
- }, {
797
- default: q(() => [
798
- J(g(l(i)("core.collection.filters.reset_all")), 1)
799
- ]),
800
- _: 1
801
- }),
802
- c("div", Nl, [
803
- P.value ? (d(), W(l(Je), {
804
- key: 0,
805
- ref_key: "savePopover",
806
- ref: X,
807
- placement: "top-end",
808
- label: l(i)("core.collection.saved.save_button")
809
- }, {
810
- trigger: q(({ toggle: t, attrs: e }) => [
811
- c("span", {
812
- title: pe.value ? void 0 : l(i)("core.collection.saved.nothing_to_save")
813
- }, [
814
- C(ce, ue({ ...e, "data-test": "saved-filter-open" }, {
815
- prominence: "standard",
816
- icon: "save",
817
- class: "whitespace-nowrap",
818
- disabled: !pe.value,
819
- onClick: t
820
- }), {
821
- default: q(() => [
822
- c("span", El, g(l(i)("core.collection.saved.save")), 1),
823
- c("span", Ul, g(l(i)("core.collection.saved.save_button")), 1)
824
- ]),
825
- _: 1
826
- }, 16, ["disabled", "onClick"])
827
- ], 8, Al)
828
- ]),
829
- default: q(() => [
830
- c("form", {
831
- class: "flex flex-col gap-3",
832
- "data-test": "saved-filter-form",
833
- onSubmit: De(ke, ["prevent"])
834
- }, [
835
- c("label", Ml, [
836
- J(g(l(i)("core.collection.saved.name_label")) + " ", 1),
837
- Ve(c("input", {
838
- "onUpdate:modelValue": m[1] || (m[1] = (t) => ne.value = t),
839
- type: "text",
840
- maxlength: "60",
841
- autocomplete: "off",
842
- placeholder: l(i)("core.collection.saved.name_placeholder"),
843
- class: "rounded-control bg-fill px-2.5 py-1.5 text-body text-content-strong outline-none placeholder:text-content-disabled focus:bg-surface-cell focus:ring-[1.5px] focus:ring-inset focus:ring-border-focus"
844
- }, null, 8, Bl), [
845
- [Pe, ne.value]
846
- ])
847
- ]),
848
- ge.value ? (d(), y("p", Il, g(l(i)("core.collection.saved.replace_hint", { name: ge.value.name })), 1)) : z("", !0),
849
- c("div", Dl, [
850
- C(ce, {
851
- size: "sm",
852
- onClick: m[2] || (m[2] = (t) => X.value?.dismiss())
853
- }, {
854
- default: q(() => [
855
- J(g(l(i)("core.actions.cancel")), 1)
856
- ]),
857
- _: 1
858
- }),
859
- C(ce, ue({ "data-test": "saved-filter-save" }, {
860
- type: "submit",
861
- prominence: "primary",
862
- size: "sm",
863
- processing: fe.value,
864
- disabled: !ne.value.trim()
865
- }), {
866
- default: q(() => [
867
- J(g(ge.value ? l(i)("core.collection.saved.replace") : l(i)("core.collection.saved.save")), 1)
868
- ]),
869
- _: 1
870
- }, 16, ["processing", "disabled"])
871
- ])
872
- ], 32)
873
- ]),
874
- _: 1
875
- }, 8, ["label"])) : z("", !0),
876
- C(ce, {
877
- prominence: "primary",
878
- icon: "filter3",
879
- class: "whitespace-nowrap",
880
- onClick: Q
881
- }, {
882
- default: q(() => [
883
- J(g(l(i)("core.collection.filters.apply")), 1)
884
- ]),
885
- _: 1
886
- })
887
- ])
888
- ])
889
- ]),
890
- default: q(() => [
891
- l(f) && F.value ? (d(), y("div", dl, [
892
- c("button", {
893
- type: "button",
894
- "data-test": "filter-drilldown-back",
895
- class: "-mx-2 -mt-2 mb-1 inline-flex h-10 cursor-pointer items-center gap-0.5 rounded-control px-2 text-body font-medium text-content-link active:bg-tint-soft",
896
- onClick: m[0] || (m[0] = (t) => R.value = null)
897
- }, [
898
- C(l(B), {
899
- name: "arrowLeftSLine",
900
- size: 20
901
- }),
902
- J(" " + g(l(i)("core.collection.filters.panel_title")), 1)
903
- ]),
904
- c("p", fl, g(F.value.label), 1),
905
- c("ul", {
906
- class: "overflow-hidden rounded-group bg-surface-cell shadow-group",
907
- role: "listbox",
908
- "aria-label": F.value.label
909
- }, [
910
- (d(!0), y(Z, null, ee(te(F.value), (t) => (d(), y("li", {
911
- key: String(t.value),
912
- role: "presentation"
913
- }, [
914
- c("button", {
915
- type: "button",
916
- role: "option",
917
- "aria-selected": (b.value[F.value.key] ?? null) === t.value,
918
- class: "flex min-h-11 w-full cursor-pointer items-center justify-between gap-3 px-row-inset text-left text-body active:bg-fill",
919
- onClick: (e) => {
920
- _(F.value.key, t.value), R.value = null;
921
- }
922
- }, [
923
- c("span", ml, [
924
- t.dot ? (d(), W(we, {
925
- key: 0,
926
- tone: t.dot
927
- }, null, 8, ["tone"])) : z("", !0),
928
- c("span", bl, g(t.label), 1)
929
- ]),
930
- (b.value[F.value.key] ?? null) === t.value ? (d(), W(l(B), {
931
- key: 0,
932
- name: "checkboxCircleFill",
933
- size: 18,
934
- class: "shrink-0 text-content-link"
935
- })) : z("", !0)
936
- ], 8, vl)
937
- ]))), 128))
938
- ], 8, pl)
939
- ])) : (d(), y(Z, { key: 1 }, [
940
- P.value && P.value.items.value.length > 0 ? (d(), y("section", gl, [
941
- c("p", hl, g(l(i)("core.collection.saved.title")), 1),
942
- c("div", yl, [
943
- (d(!0), y(Z, null, ee(P.value.items.value, (t) => (d(), y("span", {
944
- key: t.id,
945
- class: "inline-flex h-8 items-center rounded-control bg-surface-cell text-subheadline shadow-group ring-1 ring-inset ring-border-separator"
946
- }, [
947
- c("button", {
948
- type: "button",
949
- "data-test": "saved-filter-apply",
950
- class: "inline-flex h-full cursor-pointer items-center gap-1.5 rounded-l-control pr-1.5 pl-2.5 font-medium text-content-strong hover:bg-fill",
951
- onClick: (e) => ye(t)
952
- }, [
953
- C(l(B), {
954
- name: "starFill",
955
- size: 12,
956
- class: "text-status-warning-content"
957
- }),
958
- J(" " + g(t.name), 1)
959
- ], 8, _l),
960
- c("button", {
961
- type: "button",
962
- "data-test": "saved-filter-delete",
963
- "aria-label": l(i)("core.collection.saved.delete", { name: t.name }),
964
- title: l(i)("core.collection.saved.delete", { name: t.name }),
965
- class: "h-full cursor-pointer rounded-r-control px-1.5 text-content-muted hover:bg-fill hover:text-content-destructive",
966
- onClick: (e) => $e(t)
967
- }, [
968
- C(l(B), {
969
- name: "close",
970
- size: 12
971
- })
972
- ], 8, xl)
973
- ]))), 128))
974
- ])
975
- ])) : z("", !0),
976
- c("div", wl, [
977
- (d(!0), y(Z, null, ee(v.filters, (t) => (d(), y(Z, {
978
- key: t.key
979
- }, [
980
- t.type === "segmented" ? (d(), y("div", kl, [
981
- c("p", $l, g(t.label), 1),
982
- C(l(Qe), {
983
- "model-value": b.value[t.key] ?? "",
984
- tabs: V(t),
985
- label: t.label,
986
- stretch: "",
987
- "onUpdate:modelValue": (e) => _(t.key, e === null ? null : String(e))
988
- }, null, 8, ["model-value", "tabs", "label", "onUpdate:modelValue"])
989
- ])) : t.type === "range" ? (d(), y("div", {
990
- key: 1,
991
- role: "group",
992
- "aria-label": t.label
993
- }, [
994
- c("p", Sl, g(t.label), 1),
995
- S.value[t.key] ? (d(), y("div", Ol, [
996
- (d(), y(Z, null, ee(["min", "max"], (e) => C(gt, {
997
- key: e,
998
- "model-value": I(t.key, e),
999
- name: `${t.key}_${e}`,
1000
- width: "full",
1001
- decimals: t.decimals ?? 0,
1002
- suffix: t.unit,
1003
- label: l(i)(e === "min" ? "core.collection.filters.range_from" : "core.collection.filters.range_until"),
1004
- "onUpdate:modelValue": (u) => N(t.key, e, u)
1005
- }, null, 8, ["model-value", "name", "decimals", "suffix", "label", "onUpdate:modelValue"])), 64))
1006
- ])) : z("", !0)
1007
- ], 8, Cl)) : l(f) && h(t) ? (d(), y("div", {
1008
- key: 2,
1009
- role: "group",
1010
- "aria-label": t.label,
1011
- "data-test": "filter-chips"
1012
- }, [
1013
- c("p", zl, g(t.label), 1),
1014
- c("div", Vl, [
1015
- (d(!0), y(Z, null, ee(te(t), (e) => (d(), y("button", {
1016
- key: String(e.value),
1017
- type: "button",
1018
- "aria-pressed": (b.value[t.key] ?? null) === e.value,
1019
- class: ae(["min-h-9 cursor-pointer rounded-full px-3.5 text-subheadline ring-1 ring-inset transition-colors", (b.value[t.key] ?? null) === e.value ? "bg-tint-soft font-semibold text-content-link ring-border-selected" : "bg-surface-cell text-content ring-border-separator active:bg-fill"]),
1020
- onClick: (u) => _(t.key, e.value)
1021
- }, [
1022
- c("span", Ll, [
1023
- e.dot ? (d(), W(we, {
1024
- key: 0,
1025
- tone: e.dot
1026
- }, null, 8, ["tone"])) : z("", !0),
1027
- J(g(e.label), 1)
1028
- ])
1029
- ], 10, Pl))), 128))
1030
- ])
1031
- ], 8, jl)) : l(f) ? (d(), y("button", {
1032
- key: 3,
1033
- type: "button",
1034
- "data-test": "filter-row",
1035
- disabled: !!t.dependsOn && A(t).length === 0,
1036
- class: "flex min-h-12 w-full cursor-pointer items-center gap-3 rounded-group bg-surface-cell px-3 text-left ring-1 ring-inset ring-border-separator active:bg-fill disabled:cursor-not-allowed disabled:opacity-50",
1037
- onClick: (e) => R.value = t.key
1038
- }, [
1039
- c("span", ql, g(t.label), 1),
1040
- c("span", {
1041
- class: ae(["flex min-w-0 flex-1 items-center justify-end gap-2 text-subheadline", b.value[t.key] == null ? "text-content-disabled" : "font-medium text-content-link"])
1042
- }, [
1043
- k(t) ? (d(), W(we, {
1044
- key: 0,
1045
- tone: k(t)
1046
- }, null, 8, ["tone"])) : z("", !0),
1047
- c("span", Rl, g(oe(t)), 1)
1048
- ], 2),
1049
- C(l(B), {
1050
- name: "arrowRightSLine",
1051
- size: 18,
1052
- class: "shrink-0 text-content-muted"
1053
- })
1054
- ], 8, Fl)) : (d(), W(ht, {
1055
- key: 4,
1056
- "model-value": b.value[t.key] ?? "",
1057
- label: t.label,
1058
- options: H(t),
1059
- disabled: !!t.dependsOn && A(t).length === 0,
1060
- "onUpdate:modelValue": (e) => _(t.key, e === "" ? null : e)
1061
- }, null, 8, ["model-value", "label", "options", "disabled", "onUpdate:modelValue"]))
1062
- ], 64))), 128))
1063
- ])
1064
- ], 64))
1065
- ]),
1066
- _: 1
1067
- }, 8, ["title", "grouped"]));
1068
- }
1069
- }), Ql = { class: "flex flex-col items-start gap-2 lg:flex-row" }, Xl = {
1070
- key: 0,
1071
- class: "flex h-9 w-full items-center rounded-control bg-fill px-2.5 text-content-muted transition-colors duration-motion-fast focus-within:outline-2 focus-within:outline-offset-1 focus-within:outline-border-focus lg:w-72 compact:h-10"
1072
- }, Jl = ["placeholder", "aria-label"], Gl = ["aria-label"], Yl = ["title"], Zl = {
1073
- key: 0,
1074
- class: "min-w-4.5 rounded-full bg-tint px-1 text-center text-caption font-semibold leading-4.5 text-content-on-tint"
1075
- }, eo = ["onClick"], to = {
1076
- key: 0,
1077
- class: "mt-2.5 flex flex-wrap items-center gap-2",
1078
- "data-test": "collection-filter-chips"
1079
- }, lo = {
1080
- key: 0,
1081
- class: "shrink-0 opacity-80"
1082
- }, oo = { class: "flex min-w-0 flex-wrap items-center gap-1 font-semibold" }, no = { class: "break-words" }, so = ["aria-label", "onClick"], Be = "__search", ao = 3, ro = 300, co = /* @__PURE__ */ de({
1083
- __name: "CollectionToolbar",
1084
- props: {
1085
- collection: {},
1086
- narrow: { type: Boolean },
1087
- flat: { type: Boolean }
1088
- },
1089
- emits: ["touched"],
1090
- setup(n, { emit: o }) {
1091
- const a = n, v = o, { t: s } = me(), i = Le(), p = se(a.collection.query.value.search), f = ie("field");
1092
- let b = null;
1093
- ze(() => a.collection.query.value.search, (k) => {
1094
- k !== p.value.trim() && (p.value = k);
1095
- });
1096
- function S() {
1097
- b && clearTimeout(b);
1098
- const k = p.value;
1099
- k.length > 0 && k.length < ao || (b = setTimeout(() => {
1100
- b = null, k !== a.collection.query.value.search && (v("touched", [Be]), a.collection.search(k));
1101
- }, ro));
1102
- }
1103
- function R() {
1104
- b && clearTimeout(b), p.value = "", v("touched", [Be]), a.collection.search(""), f.value?.focus();
1105
- }
1106
- st(() => b && clearTimeout(b));
1107
- const F = (k) => k.placement === "panel" || a.narrow && k.type !== "text", w = x(() => a.collection.filters.value.filter((k) => !F(k))), _ = x(() => a.collection.filters.value.filter(F)), L = x(() => a.collection.query.value.filters), $ = x(
1108
- () => Ye(_.value, L.value, {
1109
- formatNumber: (k) => i.number(k),
1110
- from: s("core.collection.filters.range_from"),
1111
- until: s("core.collection.filters.range_until")
1112
- })
1113
- ), I = x(() => $t(_.value, L.value));
1114
- function N(k, H) {
1115
- v("touched", [k]), a.collection.setFilter(k, H);
1116
- }
1117
- function U(k) {
1118
- a.collection.setFilters(Object.fromEntries(k.map((H) => [H, null])));
1119
- }
1120
- const Q = ie("panel"), A = ie("panelButton"), G = (k) => !!k && (typeof k.checkVisibility != "function" || k.checkVisibility());
1121
- Te({ key: "/", group: "list", label: () => s("core.shortcuts.focus_search") }, () => {
1122
- if (!G(f.value)) return !1;
1123
- f.value?.focus(), f.value?.select();
1124
- }), Te({ key: "f", group: "list", label: () => _.value.length > 0 ? s("core.shortcuts.open_filters") : "" }, () => {
1125
- if (_.value.length === 0 || !G(A.value)) return !1;
1126
- Q.value?.present();
1127
- });
1128
- const oe = x(() => a.collection.savedViews);
1129
- at(() => void oe.value?.load());
1130
- const te = x(
1131
- () => (oe.value?.items.value ?? []).map((k) => ({
1132
- id: `saved-${k.id}`,
1133
- label: k.name,
1134
- icon: "starFill",
1135
- onSelect: () => {
1136
- v("touched", []), oe.value?.apply(k);
1137
- }
1138
- }))
1139
- );
1140
- return (k, H) => (d(), y("div", {
1141
- class: ae([a.flat ? "pb-3" : "border-b border-border-separator px-3 py-2.5", "select-none"]),
1142
- "data-test": "collection-toolbar"
1143
- }, [
1144
- c("div", Ql, [
1145
- a.collection.searchable ? (d(), y("div", Xl, [
1146
- C(l(B), {
1147
- name: "search",
1148
- size: 16
1149
- }),
1150
- Ve(c("input", {
1151
- ref_key: "field",
1152
- ref: f,
1153
- "onUpdate:modelValue": H[0] || (H[0] = (V) => p.value = V),
1154
- type: "text",
1155
- name: "collection-search",
1156
- autocomplete: "off",
1157
- placeholder: l(s)("core.collection.search.placeholder"),
1158
- "aria-label": l(s)("core.collection.search.label"),
1159
- class: "peer block min-w-0 flex-1 bg-transparent px-2 py-1.5 text-body text-content-strong outline-0 placeholder:text-content-disabled",
1160
- onInput: S
1161
- }, null, 40, Jl), [
1162
- [Pe, p.value]
1163
- ]),
1164
- H[4] || (H[4] = c("kbd", {
1165
- "aria-hidden": "true",
1166
- class: "rounded border border-border-separator px-1.5 font-mono text-2xs leading-5 text-content-disabled peer-focus:hidden peer-[:not(:placeholder-shown)]:hidden [@media(pointer:coarse)]:hidden"
1167
- }, "/", -1)),
1168
- p.value !== "" ? (d(), y("button", {
1169
- key: 0,
1170
- type: "button",
1171
- "aria-label": l(s)("core.collection.clear"),
1172
- class: "cursor-pointer rounded-full text-content-disabled hover:text-content-muted",
1173
- onClick: R
1174
- }, [
1175
- C(l(B), {
1176
- name: "close",
1177
- size: 16
1178
- })
1179
- ], 8, Gl)) : z("", !0)
1180
- ])) : z("", !0),
1181
- c("div", {
1182
- class: ae(["flex min-w-0 flex-1 items-center gap-2", a.narrow ? "w-full flex-nowrap overflow-x-auto [scrollbar-width:none]" : "flex-wrap"])
1183
- }, [
1184
- _.value.length > 0 ? (d(), y("button", {
1185
- key: 0,
1186
- ref_key: "panelButton",
1187
- ref: A,
1188
- type: "button",
1189
- "data-test": "collection-filter-panel-button",
1190
- title: `${l(s)("core.collection.filters.panel_button")} (F)`,
1191
- class: ae(["hit-target inline-flex h-8 shrink-0 cursor-pointer items-center gap-x-1.5 rounded-button px-3 text-subheadline font-semibold transition-colors duration-motion-fast compact:h-9", I.value > 0 ? "bg-tint-soft text-content-link" : "bg-surface-cell text-content-strong shadow-group ring-1 ring-inset ring-border-separator hover:bg-fill"]),
1192
- onClick: H[1] || (H[1] = (V) => Q.value?.present())
1193
- }, [
1194
- C(l(B), {
1195
- name: "filter3",
1196
- size: 16
1197
- }),
1198
- J(" " + g(l(s)("core.collection.filters.panel_button")) + " ", 1),
1199
- I.value > 0 ? (d(), y("span", Zl, g(I.value), 1)) : z("", !0)
1200
- ], 10, Yl)) : z("", !0),
1201
- te.value.length > 0 ? (d(), W(l(Xe), {
1202
- key: 1,
1203
- items: te.value,
1204
- label: l(s)("core.collection.saved.menu"),
1205
- placement: "bottom-start"
1206
- }, {
1207
- trigger: q(({ toggle: V, attrs: h }) => [
1208
- c("button", ue(h, {
1209
- type: "button",
1210
- "data-test": "saved-filters-menu",
1211
- class: "inline-flex shrink-0 cursor-pointer items-center gap-1.5 rounded-button bg-surface-cell px-3 py-1.5 text-subheadline font-semibold text-content-strong shadow-group ring-1 ring-inset ring-border-separator transition-colors hover:bg-fill",
1212
- onClick: V
1213
- }), [
1214
- C(l(B), {
1215
- name: "starFill",
1216
- size: 14,
1217
- class: "text-status-warning-content"
1218
- }),
1219
- J(" " + g(l(s)("core.collection.saved.menu")), 1)
1220
- ], 16, eo)
1221
- ]),
1222
- _: 1
1223
- }, 8, ["items", "label"])) : z("", !0),
1224
- (d(!0), y(Z, null, ee(w.value, (V) => (d(), W(ul, {
1225
- key: V.key,
1226
- filter: V,
1227
- value: L.value[V.key],
1228
- onUpdate: (h) => N(V.key, h)
1229
- }, null, 8, ["filter", "value", "onUpdate"]))), 128))
1230
- ], 2),
1231
- ve(k.$slots, "default")
1232
- ]),
1233
- $.value.length > 0 ? (d(), y("div", to, [
1234
- (d(!0), y(Z, null, ee($.value, (V) => (d(), y("span", {
1235
- key: V.key,
1236
- class: "inline-flex min-h-7 max-w-full items-center gap-1.5 rounded-control bg-tint-soft py-0.5 pr-0.5 pl-2.5 text-subheadline text-content-link"
1237
- }, [
1238
- V.label ? (d(), y("span", lo, g(V.label), 1)) : z("", !0),
1239
- c("span", oo, [
1240
- (d(!0), y(Z, null, ee(V.values, (h, j) => (d(), y(Z, { key: j }, [
1241
- j > 0 ? (d(), W(l(B), {
1242
- key: 0,
1243
- name: "arrowRightSLine",
1244
- size: 12,
1245
- class: "opacity-60"
1246
- })) : z("", !0),
1247
- c("span", no, g(h), 1)
1248
- ], 64))), 128))
1249
- ]),
1250
- c("button", {
1251
- type: "button",
1252
- class: "hit-target flex size-5 shrink-0 cursor-pointer items-center justify-center rounded-full hover:bg-tint/15",
1253
- "aria-label": l(s)("core.collection.clear"),
1254
- onClick: (h) => U(V.clears)
1255
- }, [
1256
- C(l(B), {
1257
- name: "close",
1258
- size: 12
1259
- })
1260
- ], 8, so)
1261
- ]))), 128)),
1262
- $.value.length > 1 ? (d(), y("button", {
1263
- key: 0,
1264
- type: "button",
1265
- class: "cursor-pointer px-2 text-subheadline text-content-muted hover:text-content-strong hover:underline",
1266
- onClick: H[2] || (H[2] = (V) => U(_.value.map((h) => h.key)))
1267
- }, g(l(s)("core.collection.filters.reset_all")), 1)) : z("", !0)
1268
- ])) : z("", !0),
1269
- _.value.length > 0 ? (d(), W(Wl, {
1270
- key: 1,
1271
- ref_key: "panel",
1272
- ref: Q,
1273
- collection: a.collection,
1274
- filters: _.value,
1275
- onTouched: H[3] || (H[3] = (V) => v("touched", V))
1276
- }, null, 8, ["collection", "filters"])) : z("", !0)
1277
- ], 2));
1278
- }
1279
- }), io = ["aria-busy"], uo = {
1280
- key: 0,
1281
- class: "mb-3 select-none"
1282
- }, fo = {
1283
- key: 0,
1284
- role: "status",
1285
- "data-test": "collection-refreshing",
1286
- class: "m-2 flex w-fit max-w-full items-center gap-2 rounded-group bg-fill py-1 pr-3 pl-3 text-footnote text-content-muted"
1287
- }, po = {
1288
- key: 1,
1289
- class: "m-2",
1290
- "data-test": "collection-stale"
1291
- }, vo = { class: "flex flex-wrap items-center justify-between gap-3" }, mo = { class: "flex flex-wrap items-center justify-between gap-3" }, bo = { class: "font-semibold" }, Ie = "__search", go = /* @__PURE__ */ de({
1292
- __name: "CollectionTable",
1293
- props: {
1294
- collection: {},
1295
- rowActions: { type: Function, default: void 0 },
1296
- rowLabel: { type: Function, default: void 0 },
1297
- rowHeight: { default: void 0 },
1298
- density: { default: "regular" },
1299
- viewsPresentation: { default: "segmented" },
1300
- actionsVisible: { type: Boolean, default: !1 }
1301
- },
1302
- setup(n) {
1303
- const o = n, a = je(), { t: v } = me(), s = Le(), i = x(() => Object.keys(je()).filter((h) => h !== "toolbar" && h !== "empty")), p = x(() => o.collection.columns.value), { narrow: f, phone: b } = mt(() => p.value), S = x(() => o.collection.rows.value), R = (h) => o.collection.recordLocation(h), F = x(() => o.collection.query.value.search), w = x(() => o.collection.views.value.map((h) => ({ value: h.key, label: h.label, icon: h.icon, badge: h.count }))), _ = se([]), L = (h) => _.value = [..._.value.filter((j) => !h.includes(j)), ...h], $ = x(() => {
1304
- const h = Ye(o.collection.filters.value, o.collection.query.value.filters, {
1305
- formatNumber: (P) => s.number(P),
1306
- from: v("core.collection.filters.range_from"),
1307
- until: v("core.collection.filters.range_until")
1308
- }), j = o.collection.query.value.search;
1309
- return j && h.push({ key: Ie, label: v("core.collection.empty.search"), values: [j], clears: [] }), h;
1310
- }), I = x(() => {
1311
- for (const h of [..._.value].reverse()) {
1312
- const j = $.value.find((P) => P.key === h || P.clears.includes(h));
1313
- if (j) return j;
1314
- }
1315
- return $.value[$.value.length - 1] ?? null;
1316
- });
1317
- function N(h) {
1318
- _.value = _.value.filter((j) => j !== h.key && !h.clears.includes(j)), h.key === Ie ? o.collection.search("") : o.collection.setFilters(Object.fromEntries(h.clears.map((j) => [j, null])));
1319
- }
1320
- function U() {
1321
- _.value = [], o.collection.clearFilters();
1322
- }
1323
- const Q = x(() => {
1324
- const { sort: h, direction: j } = o.collection.query.value;
1325
- return h === null ? null : { key: h, direction: j };
1326
- }), A = ie("card"), G = () => A.value?.scrollIntoView?.({ block: "start", behavior: "smooth" }), oe = x(() => o.collection.display.value === "loading"), te = x(() => o.collection.query.value.pageSize), k = x(() => o.collection.state.value.status === "refreshing"), H = x(() => o.collection.state.value.status === "stale"), V = x(() => {
1327
- const h = o.collection.state.value;
1328
- return h.status === "failed" || h.status === "stale" ? h.error ?? "" : "";
1329
- });
1330
- return (h, j) => (d(), y("div", {
1331
- class: "collection",
1332
- "aria-busy": oe.value || k.value || void 0,
1333
- "data-test": "collection"
1334
- }, [
1335
- w.value.length > 0 ? (d(), y("div", uo, [
1336
- C(l(Qe), {
1337
- "model-value": o.collection.query.value.view,
1338
- tabs: w.value,
1339
- presentation: o.viewsPresentation,
1340
- label: l(v)("core.collection.views_label"),
1341
- "onUpdate:modelValue": j[0] || (j[0] = (P) => o.collection.setView(P === null ? null : String(P)))
1342
- }, null, 8, ["model-value", "tabs", "presentation", "label"])
1343
- ])) : z("", !0),
1344
- c("div", {
1345
- ref_key: "card",
1346
- ref: A,
1347
- class: ae(["scroll-mt-16", l(b) ? "" : "rounded-group bg-surface-cell shadow-group"])
1348
- }, [
1349
- C(co, {
1350
- collection: o.collection,
1351
- narrow: l(f),
1352
- flat: l(b),
1353
- onTouched: L
1354
- }, {
1355
- default: q(() => [
1356
- ve(h.$slots, "toolbar")
1357
- ]),
1358
- _: 3
1359
- }, 8, ["collection", "narrow", "flat"]),
1360
- k.value ? (d(), y("div", fo, [
1361
- C(l(B), {
1362
- name: "loader4Line",
1363
- size: 14,
1364
- class: "animate-spin motion-reduce:animate-none"
1365
- }),
1366
- J(" " + g(l(v)("core.state.refreshing")), 1)
1367
- ])) : z("", !0),
1368
- H.value ? (d(), y("div", po, [
1369
- C(l(Ne), {
1370
- tone: "warning",
1371
- role: "alert"
1372
- }, {
1373
- default: q(() => [
1374
- c("div", vo, [
1375
- c("div", null, [
1376
- c("p", null, g(V.value), 1),
1377
- c("p", null, g(l(v)("core.state.stale")), 1)
1378
- ]),
1379
- C(ce, {
1380
- prominence: "secondary",
1381
- size: "sm",
1382
- onClick: j[1] || (j[1] = (P) => o.collection.refresh())
1383
- }, {
1384
- default: q(() => [
1385
- J(g(l(v)("core.actions.retry")), 1)
1386
- ]),
1387
- _: 1
1388
- })
1389
- ])
1390
- ]),
1391
- _: 1
1392
- })
1393
- ])) : z("", !0),
1394
- C(bt, {
1395
- columns: p.value,
1396
- rows: S.value,
1397
- "row-key": o.collection.rowKey,
1398
- display: o.collection.display.value,
1399
- phone: l(b),
1400
- link: R,
1401
- search: F.value,
1402
- sorted: Q.value,
1403
- "row-actions": o.rowActions,
1404
- "row-label": o.rowLabel,
1405
- "row-height": o.rowHeight,
1406
- density: o.density,
1407
- "actions-visible": o.actionsVisible,
1408
- "skeleton-rows": te.value,
1409
- "reserve-rows": oe.value ? te.value : void 0,
1410
- onSort: j[3] || (j[3] = (P) => o.collection.toggleSort(P))
1411
- }, He({
1412
- failed: q(() => [
1413
- C(l(Ne), {
1414
- tone: "warning",
1415
- role: "alert"
1416
- }, {
1417
- default: q(() => [
1418
- c("div", mo, [
1419
- c("div", null, [
1420
- c("p", bo, g(l(v)("core.collection.failed.title")), 1),
1421
- c("p", null, g(V.value), 1)
1422
- ]),
1423
- C(ce, {
1424
- prominence: "secondary",
1425
- size: "sm",
1426
- onClick: j[2] || (j[2] = (P) => o.collection.refresh())
1427
- }, {
1428
- default: q(() => [
1429
- J(g(l(v)("core.actions.retry")), 1)
1430
- ]),
1431
- _: 1
1432
- })
1433
- ])
1434
- ]),
1435
- _: 1
1436
- })
1437
- ]),
1438
- empty: q(() => [
1439
- o.collection.display.value === "empty" && a.empty ? ve(h.$slots, "empty", {}, void 0, void 0, 0) : o.collection.display.value !== "empty" && $.value.length > 0 ? (d(), W(qt, {
1440
- key: 1,
1441
- chips: $.value,
1442
- "last-chip": I.value,
1443
- onRemove: N,
1444
- onClearAll: U
1445
- }, null, 8, ["chips", "last-chip"])) : (d(), W(l(vt), {
1446
- key: 2,
1447
- title: l(v)("core.collection.no_data"),
1448
- description: l(v)("core.collection.no_results")
1449
- }, null, 8, ["title", "description"]))
1450
- ]),
1451
- _: 2
1452
- }, [
1453
- ee(i.value, (P) => ({
1454
- name: P,
1455
- fn: q((ne) => [
1456
- ve(h.$slots, P, Ke(We(ne ?? {})))
1457
- ])
1458
- }))
1459
- ]), 1032, ["columns", "rows", "row-key", "display", "phone", "search", "sorted", "row-actions", "row-label", "row-height", "density", "actions-visible", "skeleton-rows", "reserve-rows"]),
1460
- C(tl, {
1461
- collection: o.collection,
1462
- compact: l(f),
1463
- flat: l(b),
1464
- onTurned: G
1465
- }, null, 8, ["collection", "compact", "flat"])
1466
- ], 2)
1467
- ], 8, io));
1468
- }
1469
- }), Uo = /* @__PURE__ */ de({
1470
- __name: "CollectionPage",
1471
- props: {
1472
- collection: {},
1473
- title: {},
1474
- description: { default: void 0 },
1475
- icon: { default: void 0 },
1476
- actions: { default: () => [] },
1477
- rowActions: { type: Function, default: void 0 },
1478
- rowLabel: { type: Function, default: void 0 },
1479
- rowHeight: { default: void 0 },
1480
- density: { default: "regular" },
1481
- viewsPresentation: { default: "segmented" },
1482
- actionsVisible: { type: Boolean, default: !1 }
1483
- },
1484
- setup(n) {
1485
- const o = n, a = x(() => Object.keys(je()).filter((s) => s !== "default")), v = x(() => o.collection.total.value || null);
1486
- return (s, i) => (d(), W(l(pt), {
1487
- title: o.title,
1488
- description: o.description,
1489
- icon: o.icon,
1490
- count: v.value,
1491
- actions: o.actions
1492
- }, {
1493
- default: q(() => [
1494
- C(go, {
1495
- collection: o.collection,
1496
- "row-actions": o.rowActions,
1497
- "row-label": o.rowLabel,
1498
- "row-height": o.rowHeight,
1499
- density: o.density,
1500
- "views-presentation": o.viewsPresentation,
1501
- "actions-visible": o.actionsVisible
1502
- }, He({ _: 2 }, [
1503
- ee(a.value, (p) => ({
1504
- name: p,
1505
- fn: q((f) => [
1506
- ve(s.$slots, p, Ke(We(f ?? {})))
1507
- ])
1508
- }))
1509
- ]), 1032, ["collection", "row-actions", "row-label", "row-height", "density", "views-presentation", "actions-visible"]),
1510
- ve(s.$slots, "default")
1511
- ]),
1512
- _: 3
1513
- }, 8, ["title", "description", "icon", "count", "actions"]));
1514
- }
1515
- });
1516
- export {
1517
- Uo as _,
1518
- go as a,
1519
- Eo as u
1520
- };