@object-ui/fields 4.0.4 → 4.0.6

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.
@@ -1,938 +0,0 @@
1
- import { t as e } from "./rolldown-runtime-CAFD8bLK.js";
2
- import { t } from "./useFieldTranslation-Bv3oUVgb.js";
3
- import { useCallback as n, useContext as r, useEffect as i, useMemo as a, useRef as o, useState as s } from "react";
4
- import { Badge as c, Button as l, Checkbox as u, Dialog as ee, DialogContent as te, DialogFooter as d, DialogHeader as f, DialogTitle as p, EmptyValue as ne, Input as m, Label as h, Popover as re, PopoverContent as ie, PopoverTrigger as ae, Select as oe, SelectContent as se, SelectItem as ce, SelectTrigger as le, SelectValue as ue, Skeleton as de, Table as fe, TableBody as pe, TableCell as g, TableHead as _, TableHeader as v, TableRow as y, cn as me } from "@object-ui/components";
5
- import { AlertCircle as he, ArrowDown as b, ArrowUp as ge, ArrowUpDown as _e, Check as x, ChevronLeft as S, ChevronRight as C, Loader2 as ve, Plus as ye, Search as be, SlidersHorizontal as xe, TableProperties as w, X as Se } from "lucide-react";
6
- import { Fragment as Ce, jsx as T, jsxs as E } from "react/jsx-runtime";
7
- import { SchemaRendererContext as D } from "@object-ui/react";
8
- //#region src/widgets/RecordPickerDialog.tsx
9
- var O = 10, we = 60, Te = 5;
10
- function k(e) {
11
- return typeof e == "string" ? { field: e } : e;
12
- }
13
- function A(e) {
14
- return e.replace(/_/g, " ").replace(/([a-z])([A-Z])/g, "$1 $2").replace(/\b\w/g, (e) => e.toUpperCase());
15
- }
16
- function Ee(e) {
17
- let t = {};
18
- for (let n of e) switch (n.operator) {
19
- case "eq":
20
- t[n.field] = n.value;
21
- break;
22
- case "ne":
23
- t[n.field] = { $ne: n.value };
24
- break;
25
- case "gt":
26
- t[n.field] = { $gt: n.value };
27
- break;
28
- case "lt":
29
- t[n.field] = { $lt: n.value };
30
- break;
31
- case "gte":
32
- t[n.field] = { $gte: n.value };
33
- break;
34
- case "lte":
35
- t[n.field] = { $lte: n.value };
36
- break;
37
- case "contains":
38
- t[n.field] = { $contains: n.value };
39
- break;
40
- case "in":
41
- t[n.field] = { $in: n.value };
42
- break;
43
- case "notIn":
44
- t[n.field] = { $nin: n.value };
45
- break;
46
- }
47
- return t;
48
- }
49
- function De(e, t) {
50
- let n = {};
51
- for (let r of t) {
52
- let t = e[r.field];
53
- t == null || t === "" || (r.type === "boolean" ? n[r.field] = !!t : r.type === "text" ? n[r.field] = { $contains: t } : n[r.field] = t);
54
- }
55
- return n;
56
- }
57
- function j({ open: e, onOpenChange: t, title: r = "Select Record", multiple: c = !1, dataSource: ne, objectName: re, columns: ie, displayField: ae = "name", idField: ye = "id", pageSize: w = O, value: D, onSelect: j, onSelectRecords: M, lookupFilters: N, cellRenderer: Oe, filterColumns: P, renderFilterBar: ke, renderGrid: Ae }) {
58
- let [F, je] = s([]), [I, Me] = s(!1), [L, R] = s(null), [z, B] = s(0), [V, Ne] = s(""), [H, U] = s(1), W = o(null), [G, Pe] = s(null), [K, q] = s("asc"), [J, Fe] = s(/* @__PURE__ */ new Set()), Ie = o(/* @__PURE__ */ new Map()), [Y, Le] = s(-1), Re = o(null), [ze, Be] = s(!1), [X, Ve] = s({}), [He, Ue] = s({}), We = o(null), [Ge, Ke] = s(""), qe = a(() => ie && ie.length > 0 ? ie.map(k) : [{
59
- field: ae,
60
- label: A(ae)
61
- }], [ie, ae]), Z = a(() => {
62
- if (P && P.length > 0) return P;
63
- if (N && N.length > 0) return N.map((e) => {
64
- let t = "text";
65
- return typeof e.value == "boolean" ? t = "boolean" : Array.isArray(e.value) ? t = "select" : typeof e.value == "number" || e.operator === "gt" || e.operator === "lt" || e.operator === "gte" || e.operator === "lte" ? t = "number" : (e.operator === "in" || e.operator === "notIn") && (t = "select"), {
66
- field: e.field,
67
- label: A(e.field),
68
- type: t,
69
- ...Array.isArray(e.value) ? { options: e.value.map((e) => {
70
- if (typeof e == "object" && e) {
71
- let t = e;
72
- return {
73
- label: String(t.name || t.label || t.title || e),
74
- value: e
75
- };
76
- }
77
- return {
78
- label: String(e),
79
- value: e
80
- };
81
- }) } : {}
82
- };
83
- });
84
- }, [P, N]), Je = a(() => {
85
- let e = N?.length ? Ee(N) : {}, t = Z?.length ? De(X, Z) : {}, n = {
86
- ...e,
87
- ...t
88
- };
89
- return Object.keys(n).length > 0 ? n : void 0;
90
- }, [
91
- N,
92
- Z,
93
- X
94
- ]), Q = Math.max(1, Math.ceil(z / w)), Ye = n(async (e, t = 1, n, r) => {
95
- if (!(!ne || !re)) {
96
- Me(!0), R(null);
97
- try {
98
- let i = {
99
- $top: w,
100
- $skip: (t - 1) * w
101
- };
102
- e && e.trim() && (i.$search = e.trim()), n && (i.$orderby = { [n.field]: n.direction });
103
- let a = r === void 0 ? Je : r;
104
- a && Object.keys(a).length > 0 && (i.$filter = a);
105
- let o = await ne.find(re, i), s = o?.data ?? o ?? [];
106
- je(s), B(o?.total ?? s.length), Le(-1);
107
- } catch (e) {
108
- R(e instanceof Error ? e.message : String(e)), je([]);
109
- } finally {
110
- Me(!1);
111
- }
112
- }
113
- }, [
114
- ne,
115
- re,
116
- w,
117
- Je
118
- ]), Xe = a(() => G ? {
119
- field: G,
120
- direction: K
121
- } : null, [G, K]);
122
- i(() => {
123
- e || (Ne(""), U(1), R(null), je([]), Pe(null), q("asc"), Le(-1), Be(!1), Ve({}), Ue({}), Ke(""), Fe(new Set(c && Array.isArray(D) ? D : [])), Ie.current.clear());
124
- }, [e]), i(() => {
125
- e && Ye(V || void 0, H, Xe);
126
- }, [
127
- e,
128
- H,
129
- Xe,
130
- Je
131
- ]), i(() => {
132
- e && c && Fe(new Set(Array.isArray(D) ? D : []));
133
- }, [
134
- e,
135
- c,
136
- D
137
- ]);
138
- let Ze = n((e) => {
139
- Ne(e), U(1), W.current && clearTimeout(W.current), W.current = setTimeout(() => {
140
- Ye(e || void 0, 1, Xe);
141
- }, 300);
142
- }, [Ye, Xe]);
143
- i(() => () => {
144
- W.current && clearTimeout(W.current);
145
- }, []);
146
- let Qe = n((e) => {
147
- Pe((t) => t === e ? (q((e) => e === "asc" ? "desc" : "asc"), e) : (q("asc"), e)), U(1);
148
- }, []), $e = n((e) => e[ye] ?? e.id ?? e._id, [ye]), et = n((e) => {
149
- let t = $e(e);
150
- return c ? J.has(t) : D === t;
151
- }, [
152
- c,
153
- D,
154
- J,
155
- $e
156
- ]), tt = n((e) => {
157
- let n = $e(e);
158
- c ? Fe((t) => {
159
- let r = new Set(t);
160
- return r.has(n) ? (r.delete(n), Ie.current.delete(n)) : (r.add(n), Ie.current.set(n, e)), r;
161
- }) : (j(n), M?.([e]), t(!1));
162
- }, [
163
- c,
164
- $e,
165
- j,
166
- M,
167
- t
168
- ]), nt = n(() => {
169
- let e = Array.from(J);
170
- j(e);
171
- let n = e.map((e) => Ie.current.get(e)).filter(Boolean);
172
- M?.(n), t(!1);
173
- }, [
174
- J,
175
- j,
176
- M,
177
- t
178
- ]), rt = n(() => {
179
- U((e) => Math.max(1, e - 1));
180
- }, []), it = n(() => {
181
- U((e) => Math.min(Q, e + 1));
182
- }, [Q]), at = n((e) => {
183
- if (e.key !== "Enter") return;
184
- let t = parseInt(Ge, 10);
185
- !isNaN(t) && t >= 1 && t <= Q && U(t), Ke("");
186
- }, [Ge, Q]), ot = n((e) => {
187
- F.length !== 0 && (e.key === "ArrowDown" ? (e.preventDefault(), Le((e) => Math.min(e + 1, F.length - 1))) : e.key === "ArrowUp" ? (e.preventDefault(), Le((e) => Math.max(e - 1, 0))) : (e.key === "Enter" || e.key === " ") && (e.preventDefault(), Y >= 0 && Y < F.length && tt(F[Y])));
188
- }, [
189
- F,
190
- Y,
191
- tt
192
- ]);
193
- i(() => {
194
- if (Y >= 0 && Re.current) {
195
- let e = Re.current.querySelector(`[data-row-index="${Y}"]`);
196
- e && typeof e.scrollIntoView == "function" && e.scrollIntoView({ block: "nearest" });
197
- }
198
- }, [Y]);
199
- let st = n((e, t) => {
200
- let n = e[t.field];
201
- if (t.type && Oe) {
202
- let e = Oe(t.type);
203
- if (e) return /* @__PURE__ */ T(e, {
204
- value: n,
205
- field: {
206
- name: t.field,
207
- type: t.type
208
- }
209
- });
210
- }
211
- return n == null ? "" : typeof n == "object" ? n.$numberDecimal ? String(Number(n.$numberDecimal)) : n.$oid ? String(n.$oid) : n.$date ? new Date(n.$date).toLocaleDateString() : n.name || n.label ? String(n.name || n.label) : JSON.stringify(n) : typeof n == "boolean" ? n ? "Yes" : "No" : String(n);
212
- }, [Oe]), ct = n((e) => G === e ? T(K === "asc" ? ge : b, { className: "ml-1 size-3" }) : /* @__PURE__ */ T(_e, { className: "ml-1 size-3 opacity-40" }), [G, K]), lt = n((e, t, n) => {
213
- e.preventDefault(), e.stopPropagation(), We.current = {
214
- field: t,
215
- startX: e.clientX,
216
- startWidth: n
217
- };
218
- let r = (e) => {
219
- if (!We.current) return;
220
- let t = e.clientX - We.current.startX, n = Math.max(we, We.current.startWidth + t);
221
- Ue((e) => ({
222
- ...e,
223
- [We.current.field]: n
224
- }));
225
- }, i = () => {
226
- We.current = null, document.removeEventListener("mousemove", r), document.removeEventListener("mouseup", i);
227
- };
228
- document.addEventListener("mousemove", r), document.addEventListener("mouseup", i);
229
- }, []), $ = n((e, t) => {
230
- Ve((n) => ({
231
- ...n,
232
- [e]: t
233
- })), U(1);
234
- }, []), ut = n(() => {
235
- Ve({}), U(1);
236
- }, []), dt = a(() => Object.values(X).filter((e) => e != null && e !== "").length, [X]), ft = n((e) => {
237
- let t = X[e.field], n = e.label || A(e.field);
238
- switch (e.type) {
239
- case "select": return /* @__PURE__ */ E("div", {
240
- className: "space-y-1",
241
- children: [/* @__PURE__ */ T(h, {
242
- className: "text-xs text-muted-foreground",
243
- children: n
244
- }), /* @__PURE__ */ E(oe, {
245
- value: t == null ? "" : String(t),
246
- onValueChange: (t) => $(e.field, t),
247
- children: [/* @__PURE__ */ T(le, {
248
- className: "h-8 text-xs",
249
- children: /* @__PURE__ */ T(ue, { placeholder: `Filter ${n}` })
250
- }), /* @__PURE__ */ T(se, { children: e.options?.map((e) => /* @__PURE__ */ T(ce, {
251
- value: String(e.value),
252
- children: e.label
253
- }, String(e.value))) })]
254
- })]
255
- });
256
- case "number": return /* @__PURE__ */ E("div", {
257
- className: "space-y-1",
258
- children: [/* @__PURE__ */ T(h, {
259
- className: "text-xs text-muted-foreground",
260
- children: n
261
- }), /* @__PURE__ */ T(m, {
262
- type: "number",
263
- className: "h-8 text-xs",
264
- value: t ?? "",
265
- placeholder: `Filter ${n}`,
266
- onChange: (t) => {
267
- let n = t.target.value;
268
- $(e.field, n === "" ? "" : Number(n));
269
- }
270
- })]
271
- });
272
- case "date": return /* @__PURE__ */ E("div", {
273
- className: "space-y-1",
274
- children: [/* @__PURE__ */ T(h, {
275
- className: "text-xs text-muted-foreground",
276
- children: n
277
- }), /* @__PURE__ */ T(m, {
278
- type: "date",
279
- className: "h-8 text-xs",
280
- value: t ?? "",
281
- onChange: (t) => $(e.field, t.target.value)
282
- })]
283
- });
284
- case "boolean": return /* @__PURE__ */ E("div", {
285
- className: "space-y-1",
286
- children: [/* @__PURE__ */ T(h, {
287
- className: "text-xs text-muted-foreground",
288
- children: n
289
- }), /* @__PURE__ */ E("div", {
290
- className: "flex items-center gap-2 h-8",
291
- children: [/* @__PURE__ */ T(u, {
292
- checked: !!t,
293
- onCheckedChange: (t) => $(e.field, !!t)
294
- }), /* @__PURE__ */ T("span", {
295
- className: "text-xs text-muted-foreground",
296
- children: "Yes"
297
- })]
298
- })]
299
- });
300
- default: return /* @__PURE__ */ E("div", {
301
- className: "space-y-1",
302
- children: [/* @__PURE__ */ T(h, {
303
- className: "text-xs text-muted-foreground",
304
- children: n
305
- }), /* @__PURE__ */ T(m, {
306
- className: "h-8 text-xs",
307
- value: t ?? "",
308
- placeholder: `Filter ${n}`,
309
- onChange: (t) => $(e.field, t.target.value)
310
- })]
311
- });
312
- }
313
- }, [X, $]), pt = n((e, t) => e ? "bg-primary/5 hover:bg-primary/10" : t % 2 == 1 ? "bg-muted/20 hover:bg-accent/30" : "hover:bg-accent/30", []);
314
- return /* @__PURE__ */ T(ee, {
315
- open: e,
316
- onOpenChange: t,
317
- children: /* @__PURE__ */ E(te, {
318
- className: "w-[95vw] sm:max-w-3xl lg:max-w-5xl max-h-[85vh] sm:max-h-[80vh] flex flex-col gap-0",
319
- "data-testid": "record-picker-dialog",
320
- children: [
321
- /* @__PURE__ */ T(f, { children: /* @__PURE__ */ E(p, { children: [r, c && /* @__PURE__ */ T("span", {
322
- className: "sr-only",
323
- children: " (multiple selection)"
324
- })] }) }),
325
- /* @__PURE__ */ E("div", {
326
- className: "relative rounded-md border bg-muted/30 mb-3",
327
- children: [
328
- /* @__PURE__ */ T(be, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" }),
329
- /* @__PURE__ */ T(m, {
330
- placeholder: "Search...",
331
- value: V,
332
- onChange: (e) => Ze(e.target.value),
333
- className: "pl-9 border-0 bg-transparent shadow-none focus-visible:ring-0",
334
- "data-testid": "record-picker-search"
335
- }),
336
- I && /* @__PURE__ */ T(ve, {
337
- className: "absolute right-3 top-1/2 -translate-y-1/2 size-4 animate-spin text-muted-foreground",
338
- "data-testid": "record-picker-loading-indicator"
339
- })
340
- ]
341
- }),
342
- Z && Z.length > 0 && /* @__PURE__ */ T("div", {
343
- className: "py-2",
344
- children: ke ? /* @__PURE__ */ T("div", {
345
- "data-testid": "record-picker-filter-bar",
346
- children: ke({
347
- filterColumns: Z,
348
- values: X,
349
- onChange: $,
350
- onClear: ut,
351
- activeCount: dt
352
- })
353
- }) : /* @__PURE__ */ E(Ce, { children: [/* @__PURE__ */ E("div", {
354
- className: "flex items-center gap-2",
355
- "data-testid": "record-picker-filter-bar",
356
- children: [/* @__PURE__ */ E(l, {
357
- type: "button",
358
- variant: dt > 0 ? "secondary" : "outline",
359
- size: "sm",
360
- className: "gap-1.5 shrink-0",
361
- onClick: () => Be((e) => !e),
362
- children: [
363
- /* @__PURE__ */ T(xe, { className: "size-3.5" }),
364
- "Filters",
365
- dt > 0 && /* @__PURE__ */ T("span", {
366
- className: "inline-flex h-5 min-w-[20px] items-center justify-center rounded-full bg-primary/10 px-1 text-xs font-medium text-primary",
367
- children: dt
368
- })
369
- ]
370
- }), dt > 0 && /* @__PURE__ */ E(l, {
371
- type: "button",
372
- variant: "ghost",
373
- size: "sm",
374
- className: "gap-1 text-xs",
375
- onClick: ut,
376
- children: [/* @__PURE__ */ T(Se, { className: "size-3" }), "Clear"]
377
- })]
378
- }), ze && /* @__PURE__ */ T("div", {
379
- className: "mt-2 grid gap-3 sm:grid-cols-2 lg:grid-cols-3 border rounded-md p-3 bg-muted/30",
380
- "data-testid": "record-picker-filter-panel",
381
- children: Z.map((e) => /* @__PURE__ */ T("div", { children: ft(e) }, e.field))
382
- })] })
383
- }),
384
- L && /* @__PURE__ */ E("div", {
385
- className: "flex flex-col items-center gap-2 py-4",
386
- role: "alert",
387
- children: [
388
- /* @__PURE__ */ T(he, { className: "size-5 text-destructive" }),
389
- /* @__PURE__ */ T("p", {
390
- className: "text-sm text-destructive",
391
- children: L
392
- }),
393
- /* @__PURE__ */ T(l, {
394
- variant: "outline",
395
- size: "sm",
396
- onClick: () => Ye(V || void 0, H, Xe),
397
- type: "button",
398
- children: "Retry"
399
- })
400
- ]
401
- }),
402
- Ae ? /* @__PURE__ */ T("div", {
403
- className: "flex-1 min-h-0",
404
- "data-testid": "record-picker-grid-slot",
405
- children: Ae({
406
- columns: qe,
407
- records: F,
408
- loading: I,
409
- totalCount: z,
410
- currentPage: H,
411
- pageSize: w,
412
- sortField: G,
413
- sortDirection: K,
414
- onSort: Qe,
415
- onPageChange: U,
416
- onRowClick: tt,
417
- isSelected: et,
418
- multiple: c,
419
- idField: ye,
420
- cellRenderer: Oe
421
- })
422
- }) : /* @__PURE__ */ E(Ce, { children: [
423
- I && F.length === 0 && !L && /* @__PURE__ */ T("div", {
424
- className: "flex-1 overflow-hidden min-h-0 border rounded-md",
425
- role: "status",
426
- "aria-live": "polite",
427
- "data-testid": "record-picker-skeleton",
428
- children: /* @__PURE__ */ E(fe, { children: [/* @__PURE__ */ T(v, { children: /* @__PURE__ */ E(y, {
429
- className: "bg-muted/40",
430
- children: [c && /* @__PURE__ */ T(_, { className: "w-10" }), qe.map((e) => /* @__PURE__ */ T(_, { children: /* @__PURE__ */ T(de, { className: "h-4 w-20" }) }, e.field))]
431
- }) }), /* @__PURE__ */ T(pe, { children: Array.from({ length: Te }, (e, t) => /* @__PURE__ */ E(y, { children: [c && /* @__PURE__ */ T(g, {
432
- className: "w-10",
433
- children: /* @__PURE__ */ T(de, { className: "size-4 rounded" })
434
- }), qe.map((e) => /* @__PURE__ */ T(g, { children: /* @__PURE__ */ T(de, { className: "h-4 w-full" }) }, e.field))] }, t)) })] })
435
- }),
436
- !I && !L && F.length === 0 && /* @__PURE__ */ T("div", {
437
- className: "py-8 text-center",
438
- children: /* @__PURE__ */ T("p", {
439
- className: "text-sm text-muted-foreground",
440
- children: "No records found"
441
- })
442
- }),
443
- !L && F.length > 0 && /* @__PURE__ */ E("div", {
444
- className: "relative flex-1 overflow-auto min-h-0 border rounded-md",
445
- tabIndex: 0,
446
- onKeyDown: ot,
447
- role: "grid",
448
- "aria-label": "Records",
449
- children: [I && /* @__PURE__ */ T("div", {
450
- className: "absolute inset-0 z-10 flex items-center justify-center bg-background/60",
451
- "data-testid": "record-picker-loading-overlay",
452
- children: /* @__PURE__ */ T(ve, { className: "size-6 animate-spin text-muted-foreground" })
453
- }), /* @__PURE__ */ E(fe, {
454
- style: Object.keys(He).length > 0 ? { tableLayout: "fixed" } : void 0,
455
- children: [/* @__PURE__ */ T(v, {
456
- className: "sticky top-0 z-[5] bg-muted/50 [&_tr]:border-b",
457
- "data-testid": "record-picker-sticky-header",
458
- children: /* @__PURE__ */ E(y, { children: [c && /* @__PURE__ */ T(_, { className: "w-10" }), qe.map((e) => {
459
- let t = He[e.field];
460
- return /* @__PURE__ */ E(_, {
461
- style: t ? {
462
- width: `${t}px`,
463
- minWidth: `${t}px`
464
- } : e.width ? { width: e.width } : void 0,
465
- className: "cursor-pointer select-none relative group text-xs font-semibold uppercase tracking-wider",
466
- onClick: () => Qe(e.field),
467
- "aria-sort": G === e.field ? K === "asc" ? "ascending" : "descending" : "none",
468
- children: [/* @__PURE__ */ E("span", {
469
- className: "inline-flex items-center",
470
- children: [e.label || A(e.field), ct(e.field)]
471
- }), /* @__PURE__ */ T("span", {
472
- role: "separator",
473
- "aria-orientation": "vertical",
474
- className: "absolute right-0 top-0 bottom-0 w-1 cursor-col-resize opacity-0 group-hover:opacity-100 bg-border hover:bg-primary/50 transition-opacity",
475
- onMouseDown: (t) => {
476
- let n = t.currentTarget.parentElement?.getBoundingClientRect();
477
- lt(t, e.field, n?.width ?? 100);
478
- },
479
- onClick: (e) => e.stopPropagation(),
480
- "data-testid": `resize-handle-${e.field}`
481
- })]
482
- }, e.field);
483
- })] })
484
- }), /* @__PURE__ */ T(pe, {
485
- ref: Re,
486
- children: F.map((e, t) => {
487
- let n = $e(e), r = et(e), i = t === Y;
488
- return /* @__PURE__ */ E(y, {
489
- "data-row-index": t,
490
- className: me("cursor-pointer transition-colors", pt(r, t), i && "ring-2 ring-primary ring-inset"),
491
- onClick: () => tt(e),
492
- "data-testid": `record-row-${n}`,
493
- "aria-selected": r,
494
- children: [c && /* @__PURE__ */ T(g, {
495
- className: "w-10",
496
- children: r && /* @__PURE__ */ T(x, { className: "size-4 text-primary" })
497
- }), qe.map((t) => /* @__PURE__ */ T(g, {
498
- className: "py-2.5",
499
- children: st(e, t)
500
- }, t.field))]
501
- }, n ?? t);
502
- })
503
- })]
504
- })]
505
- }),
506
- !L && z > 0 && /* @__PURE__ */ E("div", {
507
- className: "flex items-center justify-between text-sm text-muted-foreground border-t pt-3 mt-2 px-1",
508
- "data-testid": "record-picker-pagination",
509
- children: [/* @__PURE__ */ E("span", { children: [
510
- z,
511
- " ",
512
- z === 1 ? "record" : "records",
513
- Q > 1 && ` · Page ${H} of ${Q}`
514
- ] }), Q > 1 && /* @__PURE__ */ E("div", {
515
- className: "flex items-center gap-1.5",
516
- children: [
517
- /* @__PURE__ */ T(l, {
518
- variant: "outline",
519
- size: "icon",
520
- className: "size-7",
521
- onClick: rt,
522
- disabled: H <= 1,
523
- type: "button",
524
- "aria-label": "Previous page",
525
- children: /* @__PURE__ */ T(S, { className: "size-4" })
526
- }),
527
- /* @__PURE__ */ T(m, {
528
- className: "h-7 w-12 text-center text-xs px-1",
529
- placeholder: String(H),
530
- value: Ge,
531
- onChange: (e) => Ke(e.target.value),
532
- onKeyDown: at,
533
- "aria-label": "Jump to page",
534
- "data-testid": "record-picker-page-jump"
535
- }),
536
- /* @__PURE__ */ T(l, {
537
- variant: "outline",
538
- size: "icon",
539
- className: "size-7",
540
- onClick: it,
541
- disabled: H >= Q,
542
- type: "button",
543
- "aria-label": "Next page",
544
- children: /* @__PURE__ */ T(C, { className: "size-4" })
545
- })
546
- ]
547
- })]
548
- })
549
- ] }),
550
- c && /* @__PURE__ */ T(d, { children: /* @__PURE__ */ E("div", {
551
- className: "flex items-center gap-2 w-full justify-between",
552
- children: [/* @__PURE__ */ E("span", {
553
- className: "text-sm text-muted-foreground",
554
- children: [J.size, " selected"]
555
- }), /* @__PURE__ */ E("div", {
556
- className: "flex gap-2",
557
- children: [/* @__PURE__ */ T(l, {
558
- variant: "outline",
559
- type: "button",
560
- onClick: () => t(!1),
561
- children: "Cancel"
562
- }), /* @__PURE__ */ T(l, {
563
- type: "button",
564
- onClick: nt,
565
- children: "Confirm"
566
- })]
567
- })]
568
- }) })
569
- ]
570
- })
571
- });
572
- }
573
- //#endregion
574
- //#region src/widgets/_cell-renderer-bridge.ts
575
- var M;
576
- function N(e) {
577
- M = e;
578
- }
579
- function Oe() {
580
- return M;
581
- }
582
- //#endregion
583
- //#region src/widgets/LookupField.tsx
584
- var P = /* @__PURE__ */ e({ LookupField: () => I }), ke = 50, Ae = D;
585
- function F(e, t, n, r) {
586
- let i = e[n] ?? e.id ?? e._id, a = e[t] ?? e.label ?? e.name ?? String(i), o = r ? e[r] : void 0;
587
- return {
588
- value: i,
589
- label: String(a),
590
- description: o,
591
- ...e
592
- };
593
- }
594
- function je(e) {
595
- return {
596
- text: "text",
597
- number: "number",
598
- currency: "number",
599
- percent: "number",
600
- select: "select",
601
- status: "select",
602
- date: "date",
603
- datetime: "date",
604
- boolean: "boolean"
605
- }[e];
606
- }
607
- function I({ value: e, onChange: u, field: ee, readonly: te, ...d }) {
608
- let [f, p] = s(!1), [h, oe] = s(""), { t: se } = t(), [ce, le] = s([]), [ue, de] = s(!1), [fe, pe] = s(null), [g, _] = s(0), v = o(null), [y, me] = s([]), [b, ge] = s(-1), _e = o(null), x = ee || d.schema, S = x?.field, C = S && typeof S == "object" && ("reference_to" in S || "reference" in S || "type" in S) ? S : x, xe = C?.options || [], D = C?.multiple || !1, O = C?.display_field || C?.reference_field || "name", we = C?.description_field, Te = C?.id_field || "id", k = C?.reference_to || C?.reference, A = C?.lookup_columns, Ee = C?.lookup_page_size, De = C?.lookup_filters, M = a(() => {
609
- let e = C?.depends_on ?? C?.dependsOn;
610
- return e && Array.isArray(e) ? e.map((e) => typeof e == "string" ? {
611
- field: e,
612
- param: e
613
- } : {
614
- field: e.field,
615
- param: e.param ?? e.field
616
- }) : [];
617
- }, [C?.depends_on, C?.dependsOn]), N = d.dependentValues, P = a(() => {
618
- if (!A) return;
619
- let e = [];
620
- for (let t of A) if (typeof t == "object" && t.type) {
621
- let n = je(t.type);
622
- n && e.push({
623
- field: t.field,
624
- label: t.label,
625
- type: n
626
- });
627
- }
628
- return e.length > 0 ? e : void 0;
629
- }, [A]), I = r(Ae), Me = I?.dataSource ?? null, L = d.dataSource ?? x?.dataSource ?? C?.dataSource ?? Me, R = a(() => N || (I?.formValues ?? I?.data ?? {}), [
630
- N,
631
- I?.formValues,
632
- I?.data
633
- ]), z = a(() => M.length === 0 ? !1 : M.some(({ field: e }) => {
634
- let t = R[e];
635
- return t == null || t === "" || Array.isArray(t) && t.length === 0;
636
- }), [M, R]), B = L != null && typeof L.find == "function" && !!k, V = d.onCreateNew ?? x?.onCreateNew, [Ne, H] = s(!1), U = B ? ce : xe, W = a(() => {
637
- if (B || !h) return U;
638
- let e = h.toLowerCase();
639
- return U.filter((t) => t.label.toLowerCase().includes(e) || t.description && t.description.toLowerCase().includes(e));
640
- }, [
641
- B,
642
- U,
643
- h
644
- ]);
645
- i(() => {
646
- ge(-1);
647
- }, [W.length]);
648
- let G = n(async (e) => {
649
- if (!(!L || !k)) {
650
- if (z) {
651
- le([]), _(0);
652
- return;
653
- }
654
- de(!0), pe(null);
655
- try {
656
- let t = { $top: ke };
657
- if (e && e.trim() && (t.$search = e.trim()), M.length > 0) {
658
- let e = {};
659
- for (let { field: t, param: n } of M) {
660
- let r = R[t];
661
- r == null || r === "" || (e[n] = typeof r == "number" ? r : String(r));
662
- }
663
- Object.keys(e).length > 0 && (t.$filter = e);
664
- }
665
- let n = await L.find(k, t), r = n?.data ?? n ?? [];
666
- le(r.map((e) => F(e, O, Te, we))), _(n?.total ?? r.length);
667
- } catch (e) {
668
- pe(e instanceof Error ? e.message : String(e)), le([]);
669
- } finally {
670
- de(!1);
671
- }
672
- }
673
- }, [
674
- L,
675
- k,
676
- O,
677
- Te,
678
- we,
679
- z,
680
- M,
681
- R
682
- ]);
683
- i(() => {
684
- f && B && M.length > 0 && G(h || void 0);
685
- }, [a(() => M.map((e) => `${e.param}=${R[e.field] ?? ""}`).join("|"), [M, R])]), i(() => {
686
- f && B && G(h || void 0), f || (oe(""), pe(null), ge(-1));
687
- }, [f]);
688
- let Pe = n((e) => {
689
- oe(e), B && (v.current && clearTimeout(v.current), v.current = setTimeout(() => {
690
- G(e || void 0);
691
- }, 300));
692
- }, [B, G]);
693
- i(() => () => {
694
- v.current && clearTimeout(v.current);
695
- }, []);
696
- let K = n((e) => xe.find((t) => t.value === e) ?? ce.find((t) => t.value === e) ?? y.find((t) => t.value === e), [
697
- xe,
698
- ce,
699
- y
700
- ]), q = D ? (Array.isArray(e) ? e : []).map(K).filter(Boolean) : e ? [K(e)].filter(Boolean) : [], J = n((t) => {
701
- if (D) {
702
- let n = Array.isArray(e) ? e : [];
703
- n.includes(t.value) ? u(n.filter((e) => e !== t.value)) : u([...n, t.value]);
704
- } else u(t.value), p(!1);
705
- }, [
706
- D,
707
- e,
708
- u
709
- ]), Fe = (t) => {
710
- u(D ? (Array.isArray(e) ? e : []).filter((e) => e !== t) : null);
711
- }, Ie = n((e) => {
712
- me(e.map((e) => F(e, O, Te, we)));
713
- }, [
714
- O,
715
- Te,
716
- we
717
- ]), Y = n((e) => {
718
- e.key === "ArrowDown" ? (e.preventDefault(), ge((e) => e < W.length - 1 ? e + 1 : e)) : e.key === "ArrowUp" ? (e.preventDefault(), ge((e) => e > 0 ? e - 1 : 0)) : e.key === "Enter" && (e.preventDefault(), b >= 0 && b < W.length && J(W[b]));
719
- }, [
720
- W,
721
- b,
722
- J
723
- ]);
724
- return i(() => {
725
- b >= 0 && _e.current && _e.current.querySelector(`[data-lookup-index="${b}"]`)?.scrollIntoView({ block: "nearest" });
726
- }, [b]), te ? q.length ? D ? /* @__PURE__ */ T("div", {
727
- className: "flex flex-wrap gap-1",
728
- children: q.map((e, t) => /* @__PURE__ */ T(c, {
729
- variant: "outline",
730
- children: e?.[O] || e?.label
731
- }, t))
732
- }) : /* @__PURE__ */ T("span", {
733
- className: "text-sm",
734
- children: q[0]?.[O] || q[0]?.label
735
- }) : /* @__PURE__ */ T(ne, {}) : /* @__PURE__ */ E("div", {
736
- className: "space-y-2",
737
- children: [
738
- q.length > 0 && /* @__PURE__ */ T("div", {
739
- className: "flex flex-wrap gap-1",
740
- children: q.map((e, t) => /* @__PURE__ */ E(c, {
741
- variant: "outline",
742
- className: "gap-1",
743
- children: [e?.[O] || e?.label, /* @__PURE__ */ T("button", {
744
- onClick: () => Fe(e?.value),
745
- className: "ml-1 hover:text-destructive",
746
- type: "button",
747
- "aria-label": `Remove ${e?.[O] || e?.label}`,
748
- children: /* @__PURE__ */ T(Se, { className: "size-3" })
749
- })]
750
- }, t))
751
- }),
752
- /* @__PURE__ */ E("div", {
753
- className: "flex items-center gap-1.5",
754
- children: [/* @__PURE__ */ E(re, {
755
- open: f,
756
- onOpenChange: (e) => !z && p(e),
757
- children: [/* @__PURE__ */ T(ae, {
758
- asChild: !0,
759
- children: /* @__PURE__ */ E(l, {
760
- variant: "outline",
761
- className: "min-w-0 flex-1 justify-start text-left font-normal",
762
- type: "button",
763
- disabled: z || d.disabled,
764
- "data-testid": z ? "lookup-trigger-gated" : void 0,
765
- title: z ? `Select ${M.map((e) => e.field).join(", ")} first` : void 0,
766
- children: [/* @__PURE__ */ T(be, { className: "mr-2 size-4" }), z ? `Select ${M.map((e) => e.field).join(", ")} first` : q.length === 0 ? x?.placeholder || se("common.select") : D ? se("table.selected", { count: q.length }) : se("common.select")]
767
- })
768
- }), /* @__PURE__ */ E(ie, {
769
- className: "w-[var(--radix-popover-trigger-width)] p-0",
770
- align: "start",
771
- children: [
772
- /* @__PURE__ */ T("div", {
773
- className: "p-2",
774
- children: /* @__PURE__ */ E("div", {
775
- className: "relative",
776
- children: [
777
- /* @__PURE__ */ T(be, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" }),
778
- /* @__PURE__ */ T(m, {
779
- placeholder: se("common.search") + "...",
780
- value: h,
781
- onChange: (e) => Pe(e.target.value),
782
- onKeyDown: Y,
783
- className: "w-full pl-9 h-8 text-sm"
784
- }),
785
- ue && /* @__PURE__ */ T(ve, {
786
- className: "absolute right-3 top-1/2 -translate-y-1/2 size-4 animate-spin text-muted-foreground",
787
- "data-testid": "lookup-loading"
788
- })
789
- ]
790
- })
791
- }),
792
- fe && /* @__PURE__ */ E("div", {
793
- className: "flex flex-col items-center gap-2 py-4 px-2",
794
- role: "alert",
795
- children: [
796
- /* @__PURE__ */ T(he, { className: "size-5 text-destructive" }),
797
- /* @__PURE__ */ T("p", {
798
- className: "text-sm text-destructive",
799
- children: fe
800
- }),
801
- /* @__PURE__ */ T(l, {
802
- variant: "outline",
803
- size: "sm",
804
- onClick: () => G(h || void 0),
805
- type: "button",
806
- children: "Retry"
807
- })
808
- ]
809
- }),
810
- ue && W.length === 0 && !fe && /* @__PURE__ */ E("div", {
811
- className: "flex flex-col items-center gap-2 py-6",
812
- role: "status",
813
- "aria-live": "polite",
814
- children: [/* @__PURE__ */ T(ve, { className: "size-6 animate-spin text-muted-foreground" }), /* @__PURE__ */ T("p", {
815
- className: "text-sm text-muted-foreground",
816
- children: "Loading…"
817
- })]
818
- }),
819
- !fe && !(ue && W.length === 0) && /* @__PURE__ */ T("div", {
820
- ref: _e,
821
- className: "max-h-64 overflow-y-auto px-1 pb-1",
822
- role: "listbox",
823
- children: W.length === 0 ? /* @__PURE__ */ E("div", {
824
- className: "py-4 text-center",
825
- children: [/* @__PURE__ */ T("p", {
826
- className: "text-sm text-muted-foreground",
827
- children: "No options found"
828
- }), V && /* @__PURE__ */ E(l, {
829
- variant: "ghost",
830
- size: "sm",
831
- className: "mt-2 gap-1",
832
- type: "button",
833
- onClick: () => {
834
- V(h), p(!1);
835
- },
836
- children: [/* @__PURE__ */ T(ye, { className: "size-4" }), "Create new"]
837
- })]
838
- }) : /* @__PURE__ */ E(Ce, { children: [
839
- W.map((t, n) => {
840
- let r = D ? (Array.isArray(e) ? e : []).includes(t.value) : e === t.value;
841
- return /* @__PURE__ */ E("button", {
842
- "data-lookup-index": n,
843
- role: "option",
844
- "aria-selected": r,
845
- onClick: () => J(t),
846
- className: `w-full text-left px-3 py-2 rounded-md text-sm hover:bg-accent flex items-center justify-between ${n === b ? "bg-accent text-accent-foreground" : r ? "bg-accent/50 text-accent-foreground" : ""}`,
847
- type: "button",
848
- children: [/* @__PURE__ */ E("div", {
849
- className: "min-w-0 flex-1",
850
- children: [/* @__PURE__ */ T("span", {
851
- className: "block truncate",
852
- children: t.label
853
- }), t.description && /* @__PURE__ */ T("span", {
854
- className: "block truncate text-xs text-muted-foreground",
855
- children: t.description
856
- })]
857
- }), r && /* @__PURE__ */ T(c, {
858
- variant: "default",
859
- className: "ml-2 shrink-0",
860
- children: "Selected"
861
- })]
862
- }, t.value);
863
- }),
864
- B && g > W.length && /* @__PURE__ */ E("p", {
865
- className: "text-xs text-muted-foreground text-center py-2",
866
- children: [
867
- "Showing ",
868
- W.length,
869
- " of ",
870
- g,
871
- " results."
872
- ]
873
- }),
874
- B && g > W.length && /* @__PURE__ */ E("button", {
875
- type: "button",
876
- className: "w-full text-center px-3 py-2 rounded-md text-sm font-medium text-primary hover:bg-accent flex items-center justify-center gap-1.5",
877
- onClick: () => {
878
- p(!1), H(!0);
879
- },
880
- "data-testid": "show-all-results",
881
- children: [
882
- /* @__PURE__ */ T(w, { className: "size-3.5" }),
883
- "Show All Results (",
884
- g,
885
- ")"
886
- ]
887
- }),
888
- V && /* @__PURE__ */ E("button", {
889
- type: "button",
890
- className: "w-full text-left px-3 py-2 rounded-md text-sm hover:bg-accent flex items-center gap-1.5 text-muted-foreground",
891
- onClick: () => {
892
- V(h), p(!1);
893
- },
894
- children: [
895
- /* @__PURE__ */ T(ye, { className: "size-3.5" }),
896
- "Create new",
897
- h ? ` "${h}"` : ""
898
- ]
899
- })
900
- ] })
901
- })
902
- ]
903
- })]
904
- }), B && /* @__PURE__ */ T(l, {
905
- variant: "outline",
906
- size: "icon",
907
- className: "shrink-0",
908
- type: "button",
909
- onClick: () => H(!0),
910
- "aria-label": "Browse all records",
911
- title: "Browse all records",
912
- "data-testid": "browse-all-records",
913
- children: /* @__PURE__ */ T(w, { className: "size-4" })
914
- })]
915
- }),
916
- B && L && k && /* @__PURE__ */ T(j, {
917
- open: Ne,
918
- onOpenChange: H,
919
- title: x?.label || "Select",
920
- multiple: D,
921
- dataSource: L,
922
- objectName: k,
923
- columns: A,
924
- displayField: O,
925
- idField: Te,
926
- pageSize: Ee,
927
- value: e,
928
- onSelect: u,
929
- onSelectRecords: Ie,
930
- lookupFilters: De,
931
- cellRenderer: Oe(),
932
- filterColumns: P
933
- })
934
- ]
935
- });
936
- }
937
- //#endregion
938
- export { j as i, P as n, N as r, I as t };