@motiadev/plugin-logs 0.13.0 → 0.13.1-beta.163-660633

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,1295 +1,338 @@
1
- import { Stream as gt } from "@motiadev/stream-client-browser";
2
- import * as _ from "react";
3
- import K, { forwardRef as rt, createElement as fe, useState as F, useCallback as ne, useEffect as xe, createContext as mt, useContext as J, isValidElement as vt, useRef as Ce, useMemo as se } from "react";
4
- import { Sidebar as ht, LevelDot as at, Input as jt, Button as bt, Table as yt, TableBody as wt, TableRow as xt, cn as Ct, TableCell as re } from "@motiadev/ui";
5
- const Re = (e) => {
6
- let t;
7
- const n = /* @__PURE__ */ new Set(), r = (d, g) => {
8
- const m = typeof d == "function" ? d(t) : d;
9
- if (!Object.is(m, t)) {
10
- const y = t;
11
- t = g ?? (typeof m != "object" || m === null) ? m : Object.assign({}, t, m), n.forEach((E) => E(t, y));
12
- }
13
- }, l = () => t, c = { setState: r, getState: l, getInitialState: () => u, subscribe: (d) => (n.add(d), () => n.delete(d)) }, u = t = e(r, l, c);
14
- return c;
15
- }, Et = (e) => e ? Re(e) : Re, At = (e) => e;
16
- function St(e, t = At) {
17
- const n = K.useSyncExternalStore(
18
- e.subscribe,
19
- K.useCallback(() => t(e.getState()), [e, t]),
20
- K.useCallback(() => t(e.getInitialState()), [e, t])
21
- );
22
- return K.useDebugValue(n), n;
23
- }
24
- const kt = (e) => {
25
- const t = Et(e), n = (r) => St(t, r);
26
- return Object.assign(n, t), n;
27
- }, _t = (e) => kt, ee = _t()((e) => ({
28
- logs: [],
29
- selectedLogId: void 0,
30
- addLog: (t) => e((n) => n.logs.find((r) => r.id === t.id) ? n : {
31
- logs: [t, ...n.logs]
32
- }),
33
- setLogs: (t) => e({
34
- logs: [...t].reverse()
35
- }),
36
- resetLogs: () => {
37
- e({ logs: [] });
38
- },
39
- selectLogId: (t) => e({ selectedLogId: t })
40
- })), Tt = "__motia.logs", Nt = "default", Ot = "log", Rt = () => {
41
- const t = new gt(window.location.origin.replace("http", "ws")).subscribeGroup(Tt, Nt), n = ee.getState();
42
- t.addChangeListener((r) => {
43
- r && n.setLogs(r);
44
- }), t.onEvent(Ot, n.addLog);
45
- };
46
- var ae = { exports: {} }, X = {};
47
- /**
48
- * @license React
49
- * react-jsx-runtime.production.js
50
- *
51
- * Copyright (c) Meta Platforms, Inc. and affiliates.
52
- *
53
- * This source code is licensed under the MIT license found in the
54
- * LICENSE file in the root directory of this source tree.
55
- */
56
- var Le;
57
- function Lt() {
58
- if (Le) return X;
59
- Le = 1;
60
- var e = Symbol.for("react.transitional.element"), t = Symbol.for("react.fragment");
61
- function n(r, l, i) {
62
- var o = null;
63
- if (i !== void 0 && (o = "" + i), l.key !== void 0 && (o = "" + l.key), "key" in l) {
64
- i = {};
65
- for (var c in l)
66
- c !== "key" && (i[c] = l[c]);
67
- } else i = l;
68
- return l = i.ref, {
69
- $$typeof: e,
70
- type: r,
71
- key: o,
72
- ref: l !== void 0 ? l : null,
73
- props: i
74
- };
75
- }
76
- return X.Fragment = t, X.jsx = n, X.jsxs = n, X;
77
- }
78
- var Q = {};
79
- /**
80
- * @license React
81
- * react-jsx-runtime.development.js
82
- *
83
- * Copyright (c) Meta Platforms, Inc. and affiliates.
84
- *
85
- * This source code is licensed under the MIT license found in the
86
- * LICENSE file in the root directory of this source tree.
87
- */
88
- var De;
89
- function Dt() {
90
- return De || (De = 1, process.env.NODE_ENV !== "production" && function() {
91
- function e(s) {
92
- if (s == null) return null;
93
- if (typeof s == "function")
94
- return s.$$typeof === Y ? null : s.displayName || s.name || null;
95
- if (typeof s == "string") return s;
96
- switch (s) {
97
- case C:
98
- return "Fragment";
99
- case A:
100
- return "Profiler";
101
- case N:
102
- return "StrictMode";
103
- case h:
104
- return "Suspense";
105
- case S:
106
- return "SuspenseList";
107
- case O:
108
- return "Activity";
109
- }
110
- if (typeof s == "object")
111
- switch (typeof s.tag == "number" && console.error(
112
- "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
113
- ), s.$$typeof) {
114
- case w:
115
- return "Portal";
116
- case P:
117
- return (s.displayName || "Context") + ".Provider";
118
- case D:
119
- return (s._context.displayName || "Context") + ".Consumer";
120
- case v:
121
- var p = s.render;
122
- return s = s.displayName, s || (s = p.displayName || p.name || "", s = s !== "" ? "ForwardRef(" + s + ")" : "ForwardRef"), s;
123
- case x:
124
- return p = s.displayName || null, p !== null ? p : e(s.type) || "Memo";
125
- case H:
126
- p = s._payload, s = s._init;
127
- try {
128
- return e(s(p));
129
- } catch {
130
- }
131
- }
132
- return null;
133
- }
134
- function t(s) {
135
- return "" + s;
136
- }
137
- function n(s) {
138
- try {
139
- t(s);
140
- var p = !1;
141
- } catch {
142
- p = !0;
143
- }
144
- if (p) {
145
- p = console;
146
- var b = p.error, f = typeof Symbol == "function" && Symbol.toStringTag && s[Symbol.toStringTag] || s.constructor.name || "Object";
147
- return b.call(
148
- p,
149
- "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
150
- f
151
- ), t(s);
152
- }
153
- }
154
- function r(s) {
155
- if (s === C) return "<>";
156
- if (typeof s == "object" && s !== null && s.$$typeof === H)
157
- return "<...>";
158
- try {
159
- var p = e(s);
160
- return p ? "<" + p + ">" : "<...>";
161
- } catch {
162
- return "<...>";
163
- }
164
- }
165
- function l() {
166
- var s = R.A;
167
- return s === null ? null : s.getOwner();
168
- }
169
- function i() {
170
- return Error("react-stack-top-frame");
171
- }
172
- function o(s) {
173
- if (L.call(s, "key")) {
174
- var p = Object.getOwnPropertyDescriptor(s, "key").get;
175
- if (p && p.isReactWarning) return !1;
176
- }
177
- return s.key !== void 0;
178
- }
179
- function c(s, p) {
180
- function b() {
181
- T || (T = !0, console.error(
182
- "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
183
- p
184
- ));
185
- }
186
- b.isReactWarning = !0, Object.defineProperty(s, "key", {
187
- get: b,
188
- configurable: !0
189
- });
190
- }
191
- function u() {
192
- var s = e(this.type);
193
- return $[s] || ($[s] = !0, console.error(
194
- "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
195
- )), s = this.props.ref, s !== void 0 ? s : null;
196
- }
197
- function d(s, p, b, f, j, z, le, ce) {
198
- return b = z.ref, s = {
199
- $$typeof: E,
200
- type: s,
201
- key: p,
202
- props: z,
203
- _owner: j
204
- }, (b !== void 0 ? b : null) !== null ? Object.defineProperty(s, "ref", {
205
- enumerable: !1,
206
- get: u
207
- }) : Object.defineProperty(s, "ref", { enumerable: !1, value: null }), s._store = {}, Object.defineProperty(s._store, "validated", {
208
- configurable: !1,
209
- enumerable: !1,
210
- writable: !0,
211
- value: 0
212
- }), Object.defineProperty(s, "_debugInfo", {
213
- configurable: !1,
214
- enumerable: !1,
215
- writable: !0,
216
- value: null
217
- }), Object.defineProperty(s, "_debugStack", {
218
- configurable: !1,
219
- enumerable: !1,
220
- writable: !0,
221
- value: le
222
- }), Object.defineProperty(s, "_debugTask", {
223
- configurable: !1,
224
- enumerable: !1,
225
- writable: !0,
226
- value: ce
227
- }), Object.freeze && (Object.freeze(s.props), Object.freeze(s)), s;
228
- }
229
- function g(s, p, b, f, j, z, le, ce) {
230
- var I = p.children;
231
- if (I !== void 0)
232
- if (f)
233
- if (U(I)) {
234
- for (f = 0; f < I.length; f++)
235
- m(I[f]);
236
- Object.freeze && Object.freeze(I);
237
- } else
238
- console.error(
239
- "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
240
- );
241
- else m(I);
242
- if (L.call(p, "key")) {
243
- I = e(s);
244
- var q = Object.keys(p).filter(function(pt) {
245
- return pt !== "key";
246
- });
247
- f = 0 < q.length ? "{key: someKey, " + q.join(": ..., ") + ": ...}" : "{key: someKey}", M[I + f] || (q = 0 < q.length ? "{" + q.join(": ..., ") + ": ...}" : "{}", console.error(
248
- `A props object containing a "key" prop is being spread into JSX:
249
- let props = %s;
250
- <%s {...props} />
251
- React keys must be passed directly to JSX without using spread:
252
- let props = %s;
253
- <%s key={someKey} {...props} />`,
254
- f,
255
- I,
256
- q,
257
- I
258
- ), M[I + f] = !0);
259
- }
260
- if (I = null, b !== void 0 && (n(b), I = "" + b), o(p) && (n(p.key), I = "" + p.key), "key" in p) {
261
- b = {};
262
- for (var ue in p)
263
- ue !== "key" && (b[ue] = p[ue]);
264
- } else b = p;
265
- return I && c(
266
- b,
267
- typeof s == "function" ? s.displayName || s.name || "Unknown" : s
268
- ), d(
269
- s,
270
- I,
271
- z,
272
- j,
273
- l(),
274
- b,
275
- le,
276
- ce
277
- );
278
- }
279
- function m(s) {
280
- typeof s == "object" && s !== null && s.$$typeof === E && s._store && (s._store.validated = 1);
281
- }
282
- var y = K, E = Symbol.for("react.transitional.element"), w = Symbol.for("react.portal"), C = Symbol.for("react.fragment"), N = Symbol.for("react.strict_mode"), A = Symbol.for("react.profiler"), D = Symbol.for("react.consumer"), P = Symbol.for("react.context"), v = Symbol.for("react.forward_ref"), h = Symbol.for("react.suspense"), S = Symbol.for("react.suspense_list"), x = Symbol.for("react.memo"), H = Symbol.for("react.lazy"), O = Symbol.for("react.activity"), Y = Symbol.for("react.client.reference"), R = y.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, L = Object.prototype.hasOwnProperty, U = Array.isArray, Z = console.createTask ? console.createTask : function() {
283
- return null;
284
- };
285
- y = {
286
- react_stack_bottom_frame: function(s) {
287
- return s();
288
- }
289
- };
290
- var T, $ = {}, k = y.react_stack_bottom_frame.bind(
291
- y,
292
- i
293
- )(), V = Z(r(i)), M = {};
294
- Q.Fragment = C, Q.jsx = function(s, p, b, f, j) {
295
- var z = 1e4 > R.recentlyCreatedOwnerStacks++;
296
- return g(
297
- s,
298
- p,
299
- b,
300
- !1,
301
- f,
302
- j,
303
- z ? Error("react-stack-top-frame") : k,
304
- z ? Z(r(s)) : V
305
- );
306
- }, Q.jsxs = function(s, p, b, f, j) {
307
- var z = 1e4 > R.recentlyCreatedOwnerStacks++;
308
- return g(
309
- s,
310
- p,
311
- b,
312
- !0,
313
- f,
314
- j,
315
- z ? Error("react-stack-top-frame") : k,
316
- z ? Z(r(s)) : V
317
- );
318
- };
319
- }()), Q;
320
- }
321
- var Ie;
322
- function It() {
323
- return Ie || (Ie = 1, process.env.NODE_ENV === "production" ? ae.exports = Lt() : ae.exports = Dt()), ae.exports;
324
- }
325
- var a = It();
326
- /**
327
- * @license lucide-react v0.545.0 - ISC
328
- *
329
- * This source code is licensed under the ISC license.
330
- * See the LICENSE file in the root directory of this source tree.
331
- */
332
- const Pt = (e) => e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), $t = (e) => e.replace(
333
- /^([A-Z])|[\s-_]+(\w)/g,
334
- (t, n, r) => r ? r.toUpperCase() : n.toLowerCase()
335
- ), Pe = (e) => {
336
- const t = $t(e);
337
- return t.charAt(0).toUpperCase() + t.slice(1);
338
- }, st = (...e) => e.filter((t, n, r) => !!t && t.trim() !== "" && r.indexOf(t) === n).join(" ").trim(), Mt = (e) => {
339
- for (const t in e)
340
- if (t.startsWith("aria-") || t === "role" || t === "title")
341
- return !0;
342
- };
343
- /**
344
- * @license lucide-react v0.545.0 - ISC
345
- *
346
- * This source code is licensed under the ISC license.
347
- * See the LICENSE file in the root directory of this source tree.
348
- */
349
- var Ft = {
350
- xmlns: "http://www.w3.org/2000/svg",
351
- width: 24,
352
- height: 24,
353
- viewBox: "0 0 24 24",
354
- fill: "none",
355
- stroke: "currentColor",
356
- strokeWidth: 2,
357
- strokeLinecap: "round",
358
- strokeLinejoin: "round"
1
+ import { Stream } from "@motiadev/stream-client-browser";
2
+ import { create } from "zustand";
3
+ import { c } from "react/compiler-runtime";
4
+ import { Button, Input, LevelDot, Sidebar, Table, TableBody, TableCell, TableRow, cn } from "@motiadev/ui";
5
+ import { Search, Trash, X } from "lucide-react";
6
+ import { useMemo, useState } from "react";
7
+ import ReactJson from "react18-json-view";
8
+ import "react18-json-view/src/dark.css";
9
+ import "react18-json-view/src/style.css";
10
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
11
+
12
+ import './index.css';
13
+ //#region src/stores/use-logs-store.ts
14
+ const useLogsStore = create()((set) => ({
15
+ logs: [],
16
+ selectedLogId: void 0,
17
+ addLog: (log) => set((state) => {
18
+ if (state.logs.find((l) => l.id === log.id)) return state;
19
+ return { logs: [log, ...state.logs] };
20
+ }),
21
+ setLogs: (logs) => set({ logs: [...logs].reverse() }),
22
+ resetLogs: () => {
23
+ set({ logs: [] });
24
+ },
25
+ selectLogId: (logId) => set({ selectedLogId: logId })
26
+ }));
27
+
28
+ //#endregion
29
+ //#region src/utils/init-log-listener.ts
30
+ const streamName = "__motia.logs";
31
+ const groupId = "default";
32
+ const type = "log";
33
+ const initLogListener = () => {
34
+ const subscription = new Stream(window.location.origin.replace("http", "ws")).subscribeGroup(streamName, groupId);
35
+ const store = useLogsStore.getState();
36
+ subscription.addChangeListener((logs) => {
37
+ if (logs) store.setLogs(logs);
38
+ });
39
+ subscription.onEvent(type, store.addLog);
359
40
  };
360
- /**
361
- * @license lucide-react v0.545.0 - ISC
362
- *
363
- * This source code is licensed under the ISC license.
364
- * See the LICENSE file in the root directory of this source tree.
365
- */
366
- const Ht = rt(
367
- ({
368
- color: e = "currentColor",
369
- size: t = 24,
370
- strokeWidth: n = 2,
371
- absoluteStrokeWidth: r,
372
- className: l = "",
373
- children: i,
374
- iconNode: o,
375
- ...c
376
- }, u) => fe(
377
- "svg",
378
- {
379
- ref: u,
380
- ...Ft,
381
- width: t,
382
- height: t,
383
- stroke: e,
384
- strokeWidth: r ? Number(n) * 24 / Number(t) : n,
385
- className: st("lucide", l),
386
- ...!i && !Mt(c) && { "aria-hidden": "true" },
387
- ...c
388
- },
389
- [
390
- ...o.map(([d, g]) => fe(d, g)),
391
- ...Array.isArray(i) ? i : [i]
392
- ]
393
- )
394
- );
395
- /**
396
- * @license lucide-react v0.545.0 - ISC
397
- *
398
- * This source code is licensed under the ISC license.
399
- * See the LICENSE file in the root directory of this source tree.
400
- */
401
- const Ee = (e, t) => {
402
- const n = rt(
403
- ({ className: r, ...l }, i) => fe(Ht, {
404
- ref: i,
405
- iconNode: t,
406
- className: st(
407
- `lucide-${Pt(Pe(e))}`,
408
- `lucide-${e}`,
409
- r
410
- ),
411
- ...l
412
- })
413
- );
414
- return n.displayName = Pe(e), n;
41
+
42
+ //#endregion
43
+ //#region src/utils/format-timestamp.ts
44
+ const formatTimestamp = (time) => {
45
+ const date = new Date(Number(time));
46
+ return `${date.toLocaleDateString("en-US", {
47
+ year: void 0,
48
+ month: "short",
49
+ day: "2-digit"
50
+ })}, ${date.toLocaleTimeString("en-US", {
51
+ hour: "2-digit",
52
+ minute: "2-digit",
53
+ second: "2-digit",
54
+ hourCycle: "h24"
55
+ })}.${date.getMilliseconds().toString().padStart(3, "0")}`;
415
56
  };
416
- /**
417
- * @license lucide-react v0.545.0 - ISC
418
- *
419
- * This source code is licensed under the ISC license.
420
- * See the LICENSE file in the root directory of this source tree.
421
- */
422
- const Ut = [
423
- ["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
424
- ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
425
- ], Zt = Ee("search", Ut);
426
- /**
427
- * @license lucide-react v0.545.0 - ISC
428
- *
429
- * This source code is licensed under the ISC license.
430
- * See the LICENSE file in the root directory of this source tree.
431
- */
432
- const Vt = [
433
- ["path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6", key: "miytrc" }],
434
- ["path", { d: "M3 6h18", key: "d0wm0j" }],
435
- ["path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2", key: "e791ji" }]
436
- ], zt = Ee("trash", Vt);
437
- /**
438
- * @license lucide-react v0.545.0 - ISC
439
- *
440
- * This source code is licensed under the ISC license.
441
- * See the LICENSE file in the root directory of this source tree.
442
- */
443
- const Yt = [
444
- ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
445
- ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
446
- ], ot = Ee("x", Yt), it = (e) => {
447
- const t = new Date(Number(e));
448
- return `${t.toLocaleDateString("en-US", { year: void 0, month: "short", day: "2-digit" })}, ${t.toLocaleTimeString("en-US", { hour: "2-digit", minute: "2-digit", second: "2-digit", hourCycle: "h24" })}.${t.getMilliseconds().toString().padStart(3, "0")}`;
449
- };
450
- function Bt(e, t, n, r) {
451
- function l(i) {
452
- return i instanceof n ? i : new n(function(o) {
453
- o(i);
454
- });
455
- }
456
- return new (n || (n = Promise))(function(i, o) {
457
- function c(g) {
458
- try {
459
- d(r.next(g));
460
- } catch (m) {
461
- o(m);
462
- }
463
- }
464
- function u(g) {
465
- try {
466
- d(r.throw(g));
467
- } catch (m) {
468
- o(m);
469
- }
470
- }
471
- function d(g) {
472
- g.done ? i(g.value) : l(g.value).then(c, u);
473
- }
474
- d((r = r.apply(e, [])).next());
475
- });
476
- }
477
- var Wt = function() {
478
- var e = document.getSelection();
479
- if (!e.rangeCount)
480
- return function() {
481
- };
482
- for (var t = document.activeElement, n = [], r = 0; r < e.rangeCount; r++)
483
- n.push(e.getRangeAt(r));
484
- switch (t.tagName.toUpperCase()) {
485
- // .toUpperCase handles XHTML
486
- case "INPUT":
487
- case "TEXTAREA":
488
- t.blur();
489
- break;
490
- default:
491
- t = null;
492
- break;
493
- }
494
- return e.removeAllRanges(), function() {
495
- e.type === "Caret" && e.removeAllRanges(), e.rangeCount || n.forEach(function(l) {
496
- e.addRange(l);
497
- }), t && t.focus();
498
- };
499
- }, Jt = Wt, $e = {
500
- "text/plain": "Text",
501
- "text/html": "Url",
502
- default: "Text"
503
- }, qt = "Copy to clipboard: #{key}, Enter";
504
- function Kt(e) {
505
- var t = (/mac os x/i.test(navigator.userAgent) ? "⌘" : "Ctrl") + "+C";
506
- return e.replace(/#{\s*key\s*}/g, t);
507
- }
508
- function Gt(e, t) {
509
- var n, r, l, i, o, c, u = !1;
510
- t || (t = {}), n = t.debug || !1;
511
- try {
512
- l = Jt(), i = document.createRange(), o = document.getSelection(), c = document.createElement("span"), c.textContent = e, c.ariaHidden = "true", c.style.all = "unset", c.style.position = "fixed", c.style.top = 0, c.style.clip = "rect(0, 0, 0, 0)", c.style.whiteSpace = "pre", c.style.webkitUserSelect = "text", c.style.MozUserSelect = "text", c.style.msUserSelect = "text", c.style.userSelect = "text", c.addEventListener("copy", function(g) {
513
- if (g.stopPropagation(), t.format)
514
- if (g.preventDefault(), typeof g.clipboardData > "u") {
515
- n && console.warn("unable to use e.clipboardData"), n && console.warn("trying IE specific stuff"), window.clipboardData.clearData();
516
- var m = $e[t.format] || $e.default;
517
- window.clipboardData.setData(m, e);
518
- } else
519
- g.clipboardData.clearData(), g.clipboardData.setData(t.format, e);
520
- t.onCopy && (g.preventDefault(), t.onCopy(g.clipboardData));
521
- }), document.body.appendChild(c), i.selectNodeContents(c), o.addRange(i);
522
- var d = document.execCommand("copy");
523
- if (!d)
524
- throw new Error("copy command was unsuccessful");
525
- u = !0;
526
- } catch (g) {
527
- n && console.error("unable to copy using execCommand: ", g), n && console.warn("trying IE specific stuff");
528
- try {
529
- window.clipboardData.setData(t.format || "text", e), t.onCopy && t.onCopy(window.clipboardData), u = !0;
530
- } catch (m) {
531
- n && console.error("unable to copy using clipboardData: ", m), n && console.error("falling back to prompt"), r = Kt("message" in t ? t.message : qt), window.prompt(r, e);
532
- }
533
- } finally {
534
- o && (typeof o.removeRange == "function" ? o.removeRange(i) : o.removeAllRanges()), c && document.body.removeChild(c), l();
535
- }
536
- return u;
537
- }
538
- var Xt = Gt;
539
- function B(e) {
540
- return Object.prototype.toString.call(e) === "[object Object]";
541
- }
542
- function te(e) {
543
- return Array.isArray(e) ? e.length : B(e) ? Object.keys(e).length : 0;
544
- }
545
- function Qt(e, t) {
546
- if (typeof e == "string")
547
- return e;
548
- try {
549
- return JSON.stringify(e, (n, r) => {
550
- switch (typeof r) {
551
- case "bigint":
552
- return String(r) + "n";
553
- case "number":
554
- case "boolean":
555
- case "object":
556
- case "string":
557
- return r;
558
- default:
559
- return String(r);
560
- }
561
- }, t);
562
- } catch (n) {
563
- return `${n.name}: ${n.message}` || "JSON.stringify failed";
564
- }
565
- }
566
- function en(e) {
567
- return Bt(this, void 0, void 0, function* () {
568
- try {
569
- yield navigator.clipboard.writeText(e);
570
- } catch {
571
- Xt(e);
572
- }
573
- });
574
- }
575
- function Me(e, t, n, r, l, i) {
576
- if (i && i.collapsed !== void 0)
577
- return !!i.collapsed;
578
- if (typeof r == "boolean")
579
- return r;
580
- if (typeof r == "number" && t > r)
581
- return !0;
582
- const o = te(e);
583
- if (typeof r == "function") {
584
- const c = Ae(r, [{ node: e, depth: t, indexOrName: n, size: o }]);
585
- if (typeof c == "boolean")
586
- return c;
587
- }
588
- return !!(Array.isArray(e) && o > l || B(e) && o > l);
589
- }
590
- function Fe(e, t, n, r, l, i) {
591
- if (i && i.collapsed !== void 0)
592
- return !!i.collapsed;
593
- if (typeof r == "boolean")
594
- return r;
595
- if (typeof r == "number" && t > r)
596
- return !0;
597
- const o = Math.ceil(e.length / 100);
598
- if (typeof r == "function") {
599
- const c = Ae(r, [{ node: e, depth: t, indexOrName: n, size: o }]);
600
- if (typeof c == "boolean")
601
- return c;
602
- }
603
- return !!(Array.isArray(e) && o > l || B(e) && o > l);
604
- }
605
- function G(e, t, n) {
606
- return typeof e == "boolean" ? e : !!(typeof e == "number" && t > e || e === "collapsed" && n || e === "expanded" && !n);
607
- }
608
- function Ae(e, t) {
609
- try {
610
- return e(...t);
611
- } catch (n) {
612
- reportError(n);
613
- }
614
- }
615
- function lt(e) {
616
- if (e === !0 || B(e) && e.add === !0)
617
- return !0;
618
- }
619
- function He(e) {
620
- if (e === !0 || B(e) && e.edit === !0)
621
- return !0;
622
- }
623
- function Se(e) {
624
- if (e === !0 || B(e) && e.delete === !0)
625
- return !0;
626
- }
627
- function tn(e) {
628
- return typeof e == "function";
629
- }
630
- function ct(e) {
631
- return !e || e.add === void 0 || !!e.add;
632
- }
633
- function Ue(e) {
634
- return !e || e.edit === void 0 || !!e.edit;
635
- }
636
- function ke(e) {
637
- return !e || e.delete === void 0 || !!e.delete;
638
- }
639
- function oe(e) {
640
- return !e || e.enableClipboard === void 0 || !!e.enableClipboard;
641
- }
642
- function nn(e) {
643
- return !e || e.matchesURL === void 0 || !!e.matchesURL;
644
- }
645
- function rn(e, t) {
646
- return e === "string" ? t.trim().replace(/^\"([\s\S]+?)\"$/, "$1") : t;
647
- }
648
- var Ze;
649
- function de() {
650
- return de = Object.assign ? Object.assign.bind() : function(e) {
651
- for (var t = 1; t < arguments.length; t++) {
652
- var n = arguments[t];
653
- for (var r in n)
654
- Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
655
- }
656
- return e;
657
- }, de.apply(this, arguments);
658
- }
659
- var _e = function(t) {
660
- return /* @__PURE__ */ _.createElement("svg", de({
661
- xmlns: "http://www.w3.org/2000/svg",
662
- width: 16,
663
- height: 16,
664
- fill: "none",
665
- viewBox: "0 0 16 16"
666
- }, t), Ze || (Ze = /* @__PURE__ */ _.createElement("path", {
667
- fill: "currentColor",
668
- d: "M12.473 5.806a.666.666 0 0 0-.946 0L8.473 8.86a.667.667 0 0 1-.946 0L4.473 5.806a.667.667 0 1 0-.946.94l3.06 3.06a2 2 0 0 0 2.826 0l3.06-3.06a.667.667 0 0 0 0-.94Z"
669
- })));
670
- }, Ve;
671
- function pe() {
672
- return pe = Object.assign ? Object.assign.bind() : function(e) {
673
- for (var t = 1; t < arguments.length; t++) {
674
- var n = arguments[t];
675
- for (var r in n)
676
- Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
677
- }
678
- return e;
679
- }, pe.apply(this, arguments);
680
- }
681
- var an = function(t) {
682
- return /* @__PURE__ */ _.createElement("svg", pe({
683
- xmlns: "http://www.w3.org/2000/svg",
684
- width: 24,
685
- height: 24,
686
- fill: "none",
687
- viewBox: "0 0 24 24"
688
- }, t), Ve || (Ve = /* @__PURE__ */ _.createElement("path", {
689
- fill: "currentColor",
690
- d: "M17.542 2.5h-4.75a3.963 3.963 0 0 0-3.959 3.958v4.75a3.963 3.963 0 0 0 3.959 3.959h4.75a3.963 3.963 0 0 0 3.958-3.959v-4.75A3.963 3.963 0 0 0 17.542 2.5Zm2.375 8.708a2.378 2.378 0 0 1-2.375 2.375h-4.75a2.378 2.378 0 0 1-2.375-2.375v-4.75a2.378 2.378 0 0 1 2.375-2.375h4.75a2.378 2.378 0 0 1 2.375 2.375v4.75Zm-4.75 6.334a3.963 3.963 0 0 1-3.959 3.958h-4.75A3.963 3.963 0 0 1 2.5 17.542v-4.75a3.963 3.963 0 0 1 3.958-3.959.791.791 0 1 1 0 1.584 2.378 2.378 0 0 0-2.375 2.375v4.75a2.378 2.378 0 0 0 2.375 2.375h4.75a2.378 2.378 0 0 0 2.375-2.375.792.792 0 1 1 1.584 0Z"
691
- })));
692
- }, ze, Ye;
693
- function ge() {
694
- return ge = Object.assign ? Object.assign.bind() : function(e) {
695
- for (var t = 1; t < arguments.length; t++) {
696
- var n = arguments[t];
697
- for (var r in n)
698
- Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
699
- }
700
- return e;
701
- }, ge.apply(this, arguments);
702
- }
703
- var sn = function(t) {
704
- return /* @__PURE__ */ _.createElement("svg", ge({
705
- xmlns: "http://www.w3.org/2000/svg",
706
- width: 24,
707
- height: 24,
708
- fill: "none",
709
- viewBox: "0 0 24 24"
710
- }, t), ze || (ze = /* @__PURE__ */ _.createElement("path", {
711
- fill: "currentColor",
712
- d: "M17.25 3H6.75A3.755 3.755 0 0 0 3 6.75v10.5A3.754 3.754 0 0 0 6.75 21h10.5A3.754 3.754 0 0 0 21 17.25V6.75A3.755 3.755 0 0 0 17.25 3Zm2.25 14.25a2.25 2.25 0 0 1-2.25 2.25H6.75a2.25 2.25 0 0 1-2.25-2.25V6.75A2.25 2.25 0 0 1 6.75 4.5h10.5a2.25 2.25 0 0 1 2.25 2.25v10.5Z"
713
- })), Ye || (Ye = /* @__PURE__ */ _.createElement("path", {
714
- fill: "#14C786",
715
- d: "M10.312 14.45 7.83 11.906a.625.625 0 0 0-.896 0 .659.659 0 0 0 0 .918l2.481 2.546a1.264 1.264 0 0 0 .896.381 1.237 1.237 0 0 0 .895-.38l5.858-6.011a.658.658 0 0 0 0-.919.625.625 0 0 0-.896 0l-5.857 6.01Z"
716
- })));
717
- };
718
- function ie({ node: e, nodeMeta: t }) {
719
- const { customizeCopy: n, CopyComponent: r, CopiedComponent: l } = J(W), [i, o] = F(!1), c = (u) => {
720
- u.stopPropagation();
721
- const d = n(e, t);
722
- typeof d == "string" && d && en(d), o(!0), setTimeout(() => o(!1), 3e3);
723
- };
724
- return i ? typeof l == "function" ? a.jsx(l, { className: "json-view--copy", style: { display: "inline-block" } }) : a.jsx(sn, { className: "json-view--copy", style: { display: "inline-block" } }) : typeof r == "function" ? a.jsx(r, { onClick: c, className: "json-view--copy" }) : a.jsx(an, { onClick: c, className: "json-view--copy" });
725
- }
726
- function me({ indexOrName: e, value: t, depth: n, deleteHandle: r, editHandle: l, parent: i, parentPath: o }) {
727
- const { displayArrayIndex: c } = J(W), u = Array.isArray(i);
728
- return a.jsxs("div", Object.assign({ className: "json-view--pair" }, { children: [!u || u && c ? a.jsxs(a.Fragment, { children: [a.jsx("span", Object.assign({ className: typeof e == "number" ? "json-view--index" : "json-view--property" }, { children: e })), ":", " "] }) : a.jsx(a.Fragment, {}), a.jsx(ft, { node: t, depth: n + 1, deleteHandle: (d, g) => r(d, g), editHandle: (d, g, m, y) => l(d, g, m, y), parent: i, indexOrName: e, parentPath: o })] }));
729
- }
730
- var Be, We;
731
- function ve() {
732
- return ve = Object.assign ? Object.assign.bind() : function(e) {
733
- for (var t = 1; t < arguments.length; t++) {
734
- var n = arguments[t];
735
- for (var r in n)
736
- Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
737
- }
738
- return e;
739
- }, ve.apply(this, arguments);
740
- }
741
- var Te = function(t) {
742
- return /* @__PURE__ */ _.createElement("svg", ve({
743
- xmlns: "http://www.w3.org/2000/svg",
744
- width: 24,
745
- height: 24,
746
- fill: "none",
747
- viewBox: "0 0 24 24"
748
- }, t), Be || (Be = /* @__PURE__ */ _.createElement("path", {
749
- fill: "currentColor",
750
- d: "M18.75 6h-2.325a3.757 3.757 0 0 0-3.675-3h-1.5a3.757 3.757 0 0 0-3.675 3H5.25a.75.75 0 0 0 0 1.5H6v9.75A3.754 3.754 0 0 0 9.75 21h4.5A3.754 3.754 0 0 0 18 17.25V7.5h.75a.75.75 0 1 0 0-1.5Zm-7.5-1.5h1.5A2.255 2.255 0 0 1 14.872 6H9.128a2.255 2.255 0 0 1 2.122-1.5Zm5.25 12.75a2.25 2.25 0 0 1-2.25 2.25h-4.5a2.25 2.25 0 0 1-2.25-2.25V7.5h9v9.75Z"
751
- })), We || (We = /* @__PURE__ */ _.createElement("path", {
752
- fill: "#DA0000",
753
- d: "M10.5 16.5a.75.75 0 0 0 .75-.75v-4.5a.75.75 0 1 0-1.5 0v4.5a.75.75 0 0 0 .75.75ZM13.5 16.5a.75.75 0 0 0 .75-.75v-4.5a.75.75 0 1 0-1.5 0v4.5a.75.75 0 0 0 .75.75Z"
754
- })));
755
- }, Je, qe;
756
- function he() {
757
- return he = Object.assign ? Object.assign.bind() : function(e) {
758
- for (var t = 1; t < arguments.length; t++) {
759
- var n = arguments[t];
760
- for (var r in n)
761
- Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
762
- }
763
- return e;
764
- }, he.apply(this, arguments);
765
- }
766
- var ut = function(t) {
767
- return /* @__PURE__ */ _.createElement("svg", he({
768
- xmlns: "http://www.w3.org/2000/svg",
769
- width: 24,
770
- height: 24,
771
- fill: "none",
772
- viewBox: "0 0 24 24"
773
- }, t), Je || (Je = /* @__PURE__ */ _.createElement("path", {
774
- fill: "currentColor",
775
- d: "M21 6.75v10.5A3.754 3.754 0 0 1 17.25 21H6.75A3.754 3.754 0 0 1 3 17.25V6.75A3.754 3.754 0 0 1 6.75 3h10.5A3.754 3.754 0 0 1 21 6.75Zm-1.5 0c0-1.24-1.01-2.25-2.25-2.25H6.75C5.51 4.5 4.5 5.51 4.5 6.75v10.5c0 1.24 1.01 2.25 2.25 2.25h10.5c1.24 0 2.25-1.01 2.25-2.25V6.75Z"
776
- })), qe || (qe = /* @__PURE__ */ _.createElement("path", {
777
- fill: "#14C786",
778
- d: "M15 12.75a.75.75 0 1 0 0-1.5h-2.25V9a.75.75 0 1 0-1.5 0v2.25H9a.75.75 0 1 0 0 1.5h2.25V15a.75.75 0 1 0 1.5 0v-2.25H15Z"
779
- })));
780
- }, Ke, Ge;
781
- function je() {
782
- return je = Object.assign ? Object.assign.bind() : function(e) {
783
- for (var t = 1; t < arguments.length; t++) {
784
- var n = arguments[t];
785
- for (var r in n)
786
- Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
787
- }
788
- return e;
789
- }, je.apply(this, arguments);
790
- }
791
- var Ne = function(t) {
792
- return /* @__PURE__ */ _.createElement("svg", je({
793
- xmlns: "http://www.w3.org/2000/svg",
794
- width: 24,
795
- height: 24,
796
- fill: "none",
797
- viewBox: "0 0 24 24"
798
- }, t), Ke || (Ke = /* @__PURE__ */ _.createElement("path", {
799
- fill: "currentColor",
800
- d: "M12 3a9 9 0 1 0 9 9 9.01 9.01 0 0 0-9-9Zm0 16.5a7.5 7.5 0 1 1 7.5-7.5 7.509 7.509 0 0 1-7.5 7.5Z"
801
- })), Ge || (Ge = /* @__PURE__ */ _.createElement("path", {
802
- fill: "#14C786",
803
- d: "m10.85 13.96-1.986-2.036a.5.5 0 0 0-.716 0 .527.527 0 0 0 0 .735l1.985 2.036a1.01 1.01 0 0 0 .717.305.99.99 0 0 0 .716-.305l4.686-4.808a.526.526 0 0 0 0-.735.5.5 0 0 0-.716 0l-4.687 4.809Z"
804
- })));
805
- }, Xe, Qe;
806
- function be() {
807
- return be = Object.assign ? Object.assign.bind() : function(e) {
808
- for (var t = 1; t < arguments.length; t++) {
809
- var n = arguments[t];
810
- for (var r in n)
811
- Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
812
- }
813
- return e;
814
- }, be.apply(this, arguments);
815
- }
816
- var Oe = function(t) {
817
- return /* @__PURE__ */ _.createElement("svg", be({
818
- xmlns: "http://www.w3.org/2000/svg",
819
- width: 24,
820
- height: 24,
821
- fill: "none",
822
- viewBox: "0 0 24 24"
823
- }, t), Xe || (Xe = /* @__PURE__ */ _.createElement("path", {
824
- fill: "#DA0000",
825
- d: "M15 9a.75.75 0 0 0-1.06 0L12 10.94 10.06 9A.75.75 0 0 0 9 10.06L10.94 12 9 13.94A.75.75 0 0 0 10.06 15L12 13.06 13.94 15A.75.75 0 0 0 15 13.94L13.06 12 15 10.06A.75.75 0 0 0 15 9Z"
826
- })), Qe || (Qe = /* @__PURE__ */ _.createElement("path", {
827
- fill: "currentColor",
828
- d: "M12 3a9 9 0 1 0 9 9 9.01 9.01 0 0 0-9-9Zm0 16.5a7.5 7.5 0 1 1 7.5-7.5 7.509 7.509 0 0 1-7.5 7.5Z"
829
- })));
830
- };
831
- function on({ originNode: e, node: t, depth: n, index: r, deleteHandle: l, customOptions: i, startIndex: o, parent: c, parentPath: u }) {
832
- const { enableClipboard: d, src: g, onEdit: m, onChange: y, forceUpdate: E, displaySize: w, CustomOperation: C } = J(W), N = [...u, String(r)], [A, D] = F(!0), P = ne((S, x, H) => {
833
- e[S] = x, m && m({
834
- newValue: x,
835
- oldValue: H,
836
- depth: n,
837
- src: g,
838
- indexOrName: S,
839
- parentType: "array",
840
- parentPath: u
841
- }), y && y({ type: "edit", depth: n, src: g, indexOrName: S, parentType: "array", parentPath: u }), E();
842
- }, [t, m, y, E]), v = (S) => {
843
- e.splice(S, 1), l && l(S, u), E();
844
- }, h = a.jsxs(a.Fragment, { children: [!A && a.jsxs("span", Object.assign({ onClick: () => D(!0), className: "jv-size-chevron" }, { children: [G(w, n, A) && a.jsxs("span", Object.assign({ className: "jv-size" }, { children: [te(t), " Items"] })), a.jsx(_e, { className: "jv-chevron" })] })), !A && d && oe(i) && a.jsx(ie, { node: t, nodeMeta: { depth: n, indexOrName: r, parent: c, parentPath: u, currentPath: N } }), typeof C == "function" ? a.jsx(C, { node: t }) : null] });
845
- return a.jsxs("div", { children: [a.jsx("span", { children: "[" }), h, A ? a.jsxs("button", Object.assign({ onClick: () => D(!1), className: "jv-button" }, { children: [o, " ... ", o + t.length - 1] })) : a.jsx("div", Object.assign({ className: "jv-indent" }, { children: t.map((S, x) => a.jsx(me, { indexOrName: x + o, value: S, depth: n, parent: t, deleteHandle: v, editHandle: P, parentPath: u }, String(r) + String(x))) })), a.jsx("span", { children: "]" })] });
846
- }
847
- function ln({ node: e, depth: t, deleteHandle: n, indexOrName: r, customOptions: l, parent: i, parentPath: o }) {
848
- const c = typeof r < "u" ? [...o, String(r)] : o, u = [];
849
- for (let T = 0; T < e.length; T += 100)
850
- u.push(e.slice(T, T + 100));
851
- const { collapsed: d, enableClipboard: g, collapseObjectsAfterLength: m, editable: y, onDelete: E, src: w, onAdd: C, CustomOperation: N, onChange: A, forceUpdate: D, displaySize: P } = J(W), [v, h] = F(Fe(e, t, r, d, m, l));
852
- xe(() => {
853
- h(Fe(e, t, r, d, m, l));
854
- }, [d, m]);
855
- const [S, x] = F(!1), H = () => {
856
- x(!1), n && n(r, o), E && E({ value: e, depth: t, src: w, indexOrName: r, parentType: "array", parentPath: o }), A && A({
857
- type: "delete",
858
- depth: t,
859
- src: w,
860
- indexOrName: r,
861
- parentType: "array",
862
- parentPath: o
863
- });
864
- }, [O, Y] = F(!1), R = () => {
865
- const T = e;
866
- T.push(null), C && C({ indexOrName: T.length - 1, depth: t, src: w, parentType: "array", parentPath: o }), A && A({ type: "add", indexOrName: T.length - 1, depth: t, src: w, parentType: "array", parentPath: o }), D();
867
- }, L = S || O, U = () => {
868
- x(!1), Y(!1);
869
- }, Z = a.jsxs(a.Fragment, { children: [!v && !L && a.jsxs("span", Object.assign({ onClick: () => h(!0), className: "jv-size-chevron" }, { children: [G(P, t, v) && a.jsxs("span", Object.assign({ className: "jv-size" }, { children: [e.length, " Items"] })), a.jsx(_e, { className: "jv-chevron" })] })), L && a.jsx(Ne, { className: "json-view--edit", style: { display: "inline-block" }, onClick: O ? R : H }), L && a.jsx(Oe, { className: "json-view--edit", style: { display: "inline-block" }, onClick: U }), !v && !L && g && oe(l) && a.jsx(ie, { node: e, nodeMeta: { depth: t, indexOrName: r, parent: i, parentPath: o, currentPath: c } }), !v && !L && lt(y) && ct(l) && a.jsx(ut, { className: "json-view--edit", onClick: () => {
870
- R();
871
- } }), !v && !L && Se(y) && ke(l) && n && a.jsx(Te, { className: "json-view--edit", onClick: () => x(!0) }), typeof N == "function" ? a.jsx(N, { node: e }) : null] });
872
- return a.jsxs(a.Fragment, { children: [a.jsx("span", { children: "[" }), Z, v ? a.jsx("button", Object.assign({ onClick: () => h(!1), className: "jv-button" }, { children: "..." })) : a.jsx("div", Object.assign({ className: "jv-indent" }, { children: u.map((T, $) => a.jsx(on, { originNode: e, node: T, depth: t, index: $, startIndex: $ * 100, deleteHandle: n, customOptions: l, parentPath: o }, String(r) + String($))) })), a.jsx("span", { children: "]" }), v && G(P, t, v) && a.jsxs("span", Object.assign({ onClick: () => h(!1), className: "jv-size" }, { children: [e.length, " Items"] }))] });
873
- }
874
- function cn({ node: e, depth: t, indexOrName: n, deleteHandle: r, customOptions: l, parent: i, parentPath: o }) {
875
- const { collapsed: c, onCollapse: u, enableClipboard: d, ignoreLargeArray: g, collapseObjectsAfterLength: m, editable: y, onDelete: E, src: w, onAdd: C, onEdit: N, onChange: A, forceUpdate: D, displaySize: P, CustomOperation: v } = J(W), h = typeof n < "u" ? [...o, String(n)] : o;
876
- if (!g && Array.isArray(e) && e.length > 100)
877
- return a.jsx(ln, { node: e, depth: t, indexOrName: n, deleteHandle: r, customOptions: l, parentPath: h });
878
- const S = B(e), [x, H] = F(Me(e, t, n, c, m, l)), O = (f) => {
879
- u?.({ isCollapsing: !f, node: e, depth: t, indexOrName: n }), H(f);
880
- };
881
- xe(() => {
882
- O(Me(e, t, n, c, m, l));
883
- }, [c, m]);
884
- const Y = ne((f, j, z) => {
885
- Array.isArray(e) ? e[+f] = j : e && (e[f] = j), N && N({
886
- newValue: j,
887
- oldValue: z,
888
- depth: t,
889
- src: w,
890
- indexOrName: f,
891
- parentType: S ? "object" : "array",
892
- parentPath: h
893
- }), A && A({ type: "edit", depth: t, src: w, indexOrName: f, parentType: S ? "object" : "array", parentPath: h }), D();
894
- }, [e, N, A, D]), R = (f) => {
895
- Array.isArray(e) ? e.splice(+f, 1) : e && delete e[f], D();
896
- }, [L, U] = F(!1), Z = () => {
897
- U(!1), r && r(n, h), E && E({ value: e, depth: t, src: w, indexOrName: n, parentType: S ? "object" : "array", parentPath: h }), A && A({
898
- type: "delete",
899
- depth: t,
900
- src: w,
901
- indexOrName: n,
902
- parentType: S ? "object" : "array",
903
- parentPath: h
904
- });
905
- }, [T, $] = F(!1), k = Ce(null), V = () => {
906
- var f;
907
- if (S) {
908
- const j = (f = k.current) === null || f === void 0 ? void 0 : f.value;
909
- j && (e[j] = null, k.current && (k.current.value = ""), $(!1), C && C({ indexOrName: j, depth: t, src: w, parentType: "object", parentPath: h }), A && A({ type: "add", indexOrName: j, depth: t, src: w, parentType: "object", parentPath: h }));
910
- } else if (Array.isArray(e)) {
911
- const j = e;
912
- j.push(null), C && C({ indexOrName: j.length - 1, depth: t, src: w, parentType: "array", parentPath: h }), A && A({ type: "add", indexOrName: j.length - 1, depth: t, src: w, parentType: "array", parentPath: h });
913
- }
914
- D();
915
- }, M = (f) => {
916
- f.key === "Enter" ? (f.preventDefault(), V()) : f.key === "Escape" && p();
917
- }, s = L || T, p = () => {
918
- U(!1), $(!1);
919
- }, b = a.jsxs(a.Fragment, { children: [!x && !s && a.jsxs("span", Object.assign({ onClick: () => O(!0), className: "jv-size-chevron" }, { children: [G(P, t, x) && a.jsxs("span", Object.assign({ className: "jv-size" }, { children: [te(e), " Items"] })), a.jsx(_e, { className: "jv-chevron" })] })), T && S && a.jsx("input", { className: "json-view--input", placeholder: "property", ref: k, onKeyDown: M }), s && a.jsx(Ne, { className: "json-view--edit", style: { display: "inline-block" }, onClick: T ? V : Z }), s && a.jsx(Oe, { className: "json-view--edit", style: { display: "inline-block" }, onClick: p }), !x && !s && d && oe(l) && a.jsx(ie, { node: e, nodeMeta: { depth: t, indexOrName: n, parent: i, parentPath: o, currentPath: h } }), !x && !s && lt(y) && ct(l) && a.jsx(ut, { className: "json-view--edit", onClick: () => {
920
- S ? ($(!0), setTimeout(() => {
921
- var f;
922
- return (f = k.current) === null || f === void 0 ? void 0 : f.focus();
923
- })) : V();
924
- } }), !x && !s && Se(y) && ke(l) && r && a.jsx(Te, { className: "json-view--edit", onClick: () => U(!0) }), typeof v == "function" ? a.jsx(v, { node: e }) : null] });
925
- return Array.isArray(e) ? a.jsxs(a.Fragment, { children: [a.jsx("span", { children: "[" }), b, x ? a.jsx("button", Object.assign({ onClick: () => O(!1), className: "jv-button" }, { children: "..." })) : a.jsx("div", Object.assign({ className: "jv-indent" }, { children: e.map((f, j) => a.jsx(me, { indexOrName: j, value: f, depth: t, parent: e, deleteHandle: R, editHandle: Y, parentPath: h }, String(n) + String(j))) })), a.jsx("span", { children: "]" }), x && G(P, t, x) && a.jsxs("span", Object.assign({ onClick: () => O(!1), className: "jv-size" }, { children: [te(e), " Items"] }))] }) : S ? a.jsxs(a.Fragment, { children: [a.jsx("span", { children: "{" }), b, x ? a.jsx("button", Object.assign({ onClick: () => O(!1), className: "jv-button" }, { children: "..." })) : a.jsx("div", Object.assign({ className: "jv-indent" }, { children: Object.entries(e).map(([f, j]) => a.jsx(me, { indexOrName: f, value: j, depth: t, parent: e, deleteHandle: R, editHandle: Y, parentPath: h }, String(n) + String(f))) })), a.jsx("span", { children: "}" }), x && G(P, t, x) && a.jsxs("span", Object.assign({ onClick: () => O(!1), className: "jv-size" }, { children: [te(e), " Items"] }))] }) : a.jsx("span", { children: String(e) });
926
- }
927
- const un = K.forwardRef(({ str: e, className: t, ctrlClick: n }, r) => {
928
- let { collapseStringMode: l, collapseStringsAfterLength: i, customizeCollapseStringUI: o } = J(W);
929
- const [c, u] = F(!0), d = Ce(null);
930
- i = i > 0 ? i : 0;
931
- const g = e.replace(/\s+/g, " "), m = typeof o == "function" ? o(g, c) : typeof o == "string" ? o : "...", y = (E) => {
932
- var w;
933
- if ((E.ctrlKey || E.metaKey) && n)
934
- n(E);
935
- else {
936
- const C = window.getSelection();
937
- if (C && C.anchorOffset !== C.focusOffset && ((w = C.anchorNode) === null || w === void 0 ? void 0 : w.parentElement) === d.current)
938
- return;
939
- u(!c);
940
- }
941
- };
942
- if (e.length <= i)
943
- return a.jsxs("span", Object.assign({ ref: d, className: t, onClick: n }, { children: ['"', e, '"'] }));
944
- if (l === "address")
945
- return e.length <= 10 ? a.jsxs("span", Object.assign({ ref: d, className: t, onClick: n }, { children: ['"', e, '"'] })) : a.jsxs("span", Object.assign({ ref: d, onClick: y, className: t + " cursor-pointer" }, { children: ['"', c ? [g.slice(0, 6), m, g.slice(-4)] : e, '"'] }));
946
- if (l === "directly")
947
- return a.jsxs("span", Object.assign({ ref: d, onClick: y, className: t + " cursor-pointer" }, { children: ['"', c ? [g.slice(0, i), m] : e, '"'] }));
948
- if (l === "word") {
949
- let E = i, w = i + 1, C = g, N = 1;
950
- for (; ; ) {
951
- if (/\W/.test(e[E])) {
952
- C = e.slice(0, E);
953
- break;
954
- }
955
- if (/\W/.test(e[w])) {
956
- C = e.slice(0, w);
957
- break;
958
- }
959
- if (N === 6) {
960
- C = e.slice(0, i);
961
- break;
962
- }
963
- N++, E--, w++;
964
- }
965
- return a.jsxs("span", Object.assign({ ref: d, onClick: y, className: t + " cursor-pointer" }, { children: ['"', c ? [C, m] : e, '"'] }));
966
- }
967
- return a.jsxs("span", Object.assign({ ref: d, className: t }, { children: ['"', e, '"'] }));
968
- });
969
- var et;
970
- function ye() {
971
- return ye = Object.assign ? Object.assign.bind() : function(e) {
972
- for (var t = 1; t < arguments.length; t++) {
973
- var n = arguments[t];
974
- for (var r in n)
975
- Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
976
- }
977
- return e;
978
- }, ye.apply(this, arguments);
979
- }
980
- var fn = function(t) {
981
- return /* @__PURE__ */ _.createElement("svg", ye({
982
- xmlns: "http://www.w3.org/2000/svg",
983
- width: 24,
984
- height: 24,
985
- fill: "none",
986
- viewBox: "0 0 24 24"
987
- }, t), et || (et = /* @__PURE__ */ _.createElement("path", {
988
- fill: "currentColor",
989
- d: "M17.25 3H6.75A3.754 3.754 0 0 0 3 6.75v10.5A3.754 3.754 0 0 0 6.75 21h10.5A3.754 3.754 0 0 0 21 17.25V6.75A3.754 3.754 0 0 0 17.25 3Zm2.25 14.25c0 1.24-1.01 2.25-2.25 2.25H6.75c-1.24 0-2.25-1.01-2.25-2.25V6.75c0-1.24 1.01-2.25 2.25-2.25h10.5c1.24 0 2.25 1.01 2.25 2.25v10.5Zm-6.09-9.466-5.031 5.03a2.981 2.981 0 0 0-.879 2.121v1.19c0 .415.336.75.75.75h1.19c.8 0 1.554-.312 2.12-.879l5.03-5.03a2.252 2.252 0 0 0 0-3.182c-.85-.85-2.331-.85-3.18 0Zm-2.91 7.151c-.28.28-.666.44-1.06.44H9v-.44c0-.4.156-.777.44-1.06l3.187-3.188 1.06 1.061-3.187 3.188Zm5.03-5.03-.782.783-1.06-1.061.782-.782a.766.766 0 0 1 1.06 0 .75.75 0 0 1 0 1.06Z"
990
- })));
991
- }, tt, nt;
992
- function we() {
993
- return we = Object.assign ? Object.assign.bind() : function(e) {
994
- for (var t = 1; t < arguments.length; t++) {
995
- var n = arguments[t];
996
- for (var r in n)
997
- Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
998
- }
999
- return e;
1000
- }, we.apply(this, arguments);
1001
- }
1002
- var dn = function(t) {
1003
- return /* @__PURE__ */ _.createElement("svg", we({
1004
- xmlns: "http://www.w3.org/2000/svg",
1005
- width: 24,
1006
- height: 24,
1007
- fill: "none",
1008
- viewBox: "0 0 24 24"
1009
- }, t), tt || (tt = /* @__PURE__ */ _.createElement("path", {
1010
- fill: "currentColor",
1011
- d: "M6.75 3h5.5v1.5h-5.5C5.51 4.5 4.5 5.51 4.5 6.75v10.5c0 1.24 1.01 2.25 2.25 2.25h10.5c1.24 0 2.25-1.01 2.25-2.25v-5.5H21v5.5A3.754 3.754 0 0 1 17.25 21H6.75A3.754 3.754 0 0 1 3 17.25V6.75A3.754 3.754 0 0 1 6.75 3Z"
1012
- })), nt || (nt = /* @__PURE__ */ _.createElement("path", {
1013
- fill: "currentColor",
1014
- d: "M20.013 3h-3.946a.987.987 0 0 0 0 1.973h1.564l-6.342 6.342a1.004 1.004 0 0 0 0 1.396 1.004 1.004 0 0 0 1.396 0l6.342-6.342v1.564a.987.987 0 0 0 1.973 0V3.987A.987.987 0 0 0 20.013 3Z"
1015
- })));
1016
- };
1017
- function ft({ node: e, depth: t, deleteHandle: n, indexOrName: r, parent: l, editHandle: i, parentPath: o }) {
1018
- const { collapseStringsAfterLength: c, enableClipboard: u, editable: d, src: g, onDelete: m, onChange: y, customizeNode: E, matchesURL: w, urlRegExp: C, EditComponent: N, DoneComponent: A, CancelComponent: D, CustomOperation: P } = J(W);
1019
- let v;
1020
- if (typeof E == "function" && (v = Ae(E, [{ node: e, depth: t, indexOrName: r }])), v) {
1021
- if (vt(v))
1022
- return v;
1023
- if (tn(v)) {
1024
- const h = v;
1025
- return a.jsx(h, { node: e, depth: t, indexOrName: r });
1026
- }
1027
- }
1028
- if (Array.isArray(e) || B(e))
1029
- return a.jsx(cn, { parent: l, node: e, depth: t, indexOrName: r, deleteHandle: n, parentPath: o, customOptions: typeof v == "object" ? v : void 0 });
1030
- {
1031
- const h = typeof e, S = typeof r < "u" ? [...o, String(r)] : o, [x, H] = F(!1), [O, Y] = F(!1), R = Ce(null), L = () => {
1032
- H(!0), setTimeout(() => {
1033
- var f, j;
1034
- (f = window.getSelection()) === null || f === void 0 || f.selectAllChildren(R.current), (j = R.current) === null || j === void 0 || j.focus();
1035
- });
1036
- }, U = ne(() => {
1037
- let f = R.current.innerText;
1038
- try {
1039
- const j = JSON.parse(f);
1040
- i && i(r, j, e, o);
1041
- } catch {
1042
- const z = rn(h, f);
1043
- i && i(r, z, e, o);
1044
- }
1045
- H(!1);
1046
- }, [i, r, e, o, h]), Z = () => {
1047
- H(!1), Y(!1);
1048
- }, T = () => {
1049
- Y(!1), n && n(r, o), m && m({
1050
- value: e,
1051
- depth: t,
1052
- src: g,
1053
- indexOrName: r,
1054
- parentType: Array.isArray(l) ? "array" : "object",
1055
- parentPath: o
1056
- }), y && y({
1057
- depth: t,
1058
- src: g,
1059
- indexOrName: r,
1060
- parentType: Array.isArray(l) ? "array" : "object",
1061
- type: "delete",
1062
- parentPath: o
1063
- });
1064
- }, $ = ne((f) => {
1065
- f.key === "Enter" ? (f.preventDefault(), U()) : f.key === "Escape" && Z();
1066
- }, [U]), k = x || O, V = !k && He(d) && Ue(v) && i ? (f) => {
1067
- (f.ctrlKey || f.metaKey) && L();
1068
- } : void 0, M = a.jsxs(a.Fragment, { children: [k && (typeof A == "function" ? a.jsx(A, { className: "json-view--edit", style: { display: "inline-block" }, onClick: O ? T : U }) : a.jsx(Ne, { className: "json-view--edit", style: { display: "inline-block" }, onClick: O ? T : U })), k && (typeof D == "function" ? a.jsx(D, { className: "json-view--edit", style: { display: "inline-block" }, onClick: Z }) : a.jsx(Oe, { className: "json-view--edit", style: { display: "inline-block" }, onClick: Z })), !k && u && oe(v) && a.jsx(ie, { node: e, nodeMeta: { depth: t, indexOrName: r, parent: l, parentPath: o, currentPath: S } }), !k && w && h === "string" && C.test(e) && nn(v) && a.jsx("a", Object.assign({ href: e, target: "_blank", className: "json-view--link" }, { children: a.jsx(dn, {}) })), !k && He(d) && Ue(v) && i && (typeof N == "function" ? a.jsx(N, { className: "json-view--edit", onClick: L }) : a.jsx(fn, { className: "json-view--edit", onClick: L })), !k && Se(d) && ke(v) && n && a.jsx(Te, { className: "json-view--edit", onClick: () => Y(!0) }), typeof P == "function" ? a.jsx(P, { node: e }) : null] });
1069
- let s = "json-view--string";
1070
- switch (h) {
1071
- case "number":
1072
- case "bigint":
1073
- s = "json-view--number";
1074
- break;
1075
- case "boolean":
1076
- s = "json-view--boolean";
1077
- break;
1078
- case "object":
1079
- s = "json-view--null";
1080
- break;
1081
- }
1082
- typeof v?.className == "string" && (s += " " + v.className), O && (s += " json-view--deleting");
1083
- let p = String(e);
1084
- h === "bigint" && (p += "n");
1085
- const b = se(() => a.jsx("span", { contentEditable: !0, className: s, dangerouslySetInnerHTML: { __html: h === "string" ? `"${p}"` : p }, ref: R, onKeyDown: $ }), [p, h, $]);
1086
- return h === "string" ? a.jsxs(a.Fragment, { children: [x ? b : e.length > c ? a.jsx(un, { str: e, ref: R, className: s, ctrlClick: V }) : a.jsxs("span", Object.assign({ className: s, onClick: V }, { children: ['"', p, '"'] })), M] }) : a.jsxs(a.Fragment, { children: [x ? b : a.jsx("span", Object.assign({ className: s, onClick: V }, { children: p })), M] });
1087
- }
1088
- }
1089
- const dt = /^(((ht|f)tps?):\/\/)?([^!@#$%^&*?.\s-]([^!@#$%^&*?.\s]{0,63}[^!@#$%^&*?.\s])?\.)+[a-z]{2,6}\/?/, W = mt({
1090
- src: void 0,
1091
- collapseStringsAfterLength: 99,
1092
- collapseStringMode: "directly",
1093
- customizeCollapseStringUI: void 0,
1094
- collapseObjectsAfterLength: 20,
1095
- collapsed: !1,
1096
- onCollapse: void 0,
1097
- enableClipboard: !0,
1098
- editable: !1,
1099
- onEdit: void 0,
1100
- onDelete: void 0,
1101
- onAdd: void 0,
1102
- onChange: void 0,
1103
- forceUpdate: () => {
1104
- },
1105
- customizeNode: void 0,
1106
- customizeCopy: () => {
1107
- },
1108
- displaySize: void 0,
1109
- displayArrayIndex: !0,
1110
- matchesURL: !1,
1111
- urlRegExp: dt,
1112
- ignoreLargeArray: !1,
1113
- CopyComponent: void 0,
1114
- CopiedComponent: void 0,
1115
- EditComponent: void 0,
1116
- CancelComponent: void 0,
1117
- DoneComponent: void 0,
1118
- CustomOperation: void 0
1119
- });
1120
- function pn({ src: e, collapseStringsAfterLength: t = 99, collapseStringMode: n = "directly", customizeCollapseStringUI: r, collapseObjectsAfterLength: l = 99, collapsed: i, onCollapse: o, enableClipboard: c = !0, editable: u = !1, onEdit: d, onDelete: g, onAdd: m, onChange: y, dark: E = !1, theme: w = "default", customizeNode: C, customizeCopy: N = (Z) => Qt(Z), displaySize: A, displayArrayIndex: D = !0, style: P, className: v, matchesURL: h = !1, urlRegExp: S = dt, ignoreLargeArray: x = !1, CopyComponent: H, CopiedComponent: O, EditComponent: Y, CancelComponent: R, DoneComponent: L, CustomOperation: U }) {
1121
- const [Z, T] = F(0), $ = ne(() => T((M) => ++M), []), [k, V] = F(e);
1122
- return xe(() => V(e), [e]), a.jsx(W.Provider, Object.assign({ value: {
1123
- src: k,
1124
- collapseStringsAfterLength: t,
1125
- collapseStringMode: n,
1126
- customizeCollapseStringUI: r,
1127
- collapseObjectsAfterLength: l,
1128
- collapsed: i,
1129
- onCollapse: o,
1130
- enableClipboard: c,
1131
- editable: u,
1132
- onEdit: d,
1133
- onDelete: g,
1134
- onAdd: m,
1135
- onChange: y,
1136
- forceUpdate: $,
1137
- customizeNode: C,
1138
- customizeCopy: N,
1139
- displaySize: A,
1140
- displayArrayIndex: D,
1141
- matchesURL: h,
1142
- urlRegExp: S,
1143
- ignoreLargeArray: x,
1144
- CopyComponent: H,
1145
- CopiedComponent: O,
1146
- EditComponent: Y,
1147
- CancelComponent: R,
1148
- DoneComponent: L,
1149
- CustomOperation: U
1150
- } }, { children: a.jsx("code", Object.assign({ className: "json-view" + (E ? " dark" : "") + (w && w !== "default" ? " json-view_" + w : "") + (v ? " " + v : ""), style: P }, { children: a.jsx(ft, { node: k, depth: 1, editHandle: (M, s, p, b) => {
1151
- V(s), d && d({
1152
- newValue: s,
1153
- oldValue: p,
1154
- depth: 1,
1155
- src: k,
1156
- indexOrName: M,
1157
- parentType: null,
1158
- parentPath: b
1159
- }), y && y({ type: "edit", depth: 1, src: k, indexOrName: M, parentType: null, parentPath: b });
1160
- }, deleteHandle: (M, s) => {
1161
- V(void 0), g && g({
1162
- value: k,
1163
- depth: 1,
1164
- src: k,
1165
- indexOrName: M,
1166
- parentType: null,
1167
- parentPath: s
1168
- }), y && y({
1169
- depth: 1,
1170
- src: k,
1171
- indexOrName: M,
1172
- parentType: null,
1173
- type: "delete",
1174
- parentPath: s
1175
- });
1176
- }, parentPath: [] }) })) }));
1177
- }
1178
- const gn = ["id", "msg", "time", "level", "step", "flows", "traceId"], mn = ({ log: e, onClose: t }) => {
1179
- const [n, r] = F(!1), l = se(() => {
1180
- if (!e)
1181
- return null;
1182
- const i = Object.keys(e ?? {}).filter((o) => !gn.includes(o));
1183
- return r(i.length > 0), i.reduce(
1184
- (o, c) => (o[c] = e[c], o),
1185
- {}
1186
- );
1187
- }, [e]);
1188
- return e ? /* @__PURE__ */ a.jsx(
1189
- ht,
1190
- {
1191
- onClose: t,
1192
- title: "Logs Details",
1193
- subtitle: "Details including custom properties",
1194
- actions: [{ icon: /* @__PURE__ */ a.jsx(ot, {}), onClick: t, label: "Close" }],
1195
- details: [
1196
- {
1197
- label: "Level",
1198
- value: /* @__PURE__ */ a.jsxs("div", { className: "flex items-center gap-2", children: [
1199
- /* @__PURE__ */ a.jsx(at, { level: e.level }),
1200
- /* @__PURE__ */ a.jsx("div", { className: "capitalize", children: e.level })
1201
- ] })
1202
- },
1203
- { label: "Time", value: it(e.time) },
1204
- { label: "Step", value: e.step },
1205
- { label: "Flows", value: e.flows.join(", ") },
1206
- { label: "Trace ID", value: e.traceId }
1207
- ],
1208
- children: n && /* @__PURE__ */ a.jsx(pn, { src: l, theme: "default", enableClipboard: !0 })
1209
- }
1210
- ) : null;
1211
- }, bn = () => {
1212
- const e = ee((u) => u.logs), t = ee((u) => u.resetLogs), n = ee((u) => u.selectedLogId), r = ee((u) => u.selectLogId), l = se(
1213
- () => n ? e.find((u) => u.id === n) : void 0,
1214
- [e, n]
1215
- ), [i, o] = F(""), c = se(() => e.filter((u) => u.msg.toLowerCase().includes(i.toLowerCase()) || u.traceId.toLowerCase().includes(i.toLowerCase()) || u.step.toLowerCase().includes(i.toLowerCase())), [e, i]);
1216
- return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
1217
- /* @__PURE__ */ a.jsxs("div", { className: "grid grid-rows-[auto_1fr] h-full", "data-testid": "logs-container", children: [
1218
- /* @__PURE__ */ a.jsxs("div", { className: "flex p-2 border-b gap-2", "data-testid": "logs-search-container", children: [
1219
- /* @__PURE__ */ a.jsxs("div", { className: "flex-1 relative", children: [
1220
- /* @__PURE__ */ a.jsx(
1221
- jt,
1222
- {
1223
- variant: "shade",
1224
- value: i,
1225
- onChange: (u) => o(u.target.value),
1226
- className: "px-9 font-medium",
1227
- placeholder: "Search by Trace ID or Message"
1228
- }
1229
- ),
1230
- /* @__PURE__ */ a.jsx(Zt, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50" }),
1231
- /* @__PURE__ */ a.jsx(
1232
- ot,
1233
- {
1234
- className: "cursor-pointer absolute right-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50 hover:text-muted-foreground",
1235
- onClick: () => o("")
1236
- }
1237
- )
1238
- ] }),
1239
- /* @__PURE__ */ a.jsxs(bt, { variant: "default", onClick: t, className: "h-[34px]", children: [
1240
- /* @__PURE__ */ a.jsx(zt, {}),
1241
- " Clear"
1242
- ] })
1243
- ] }),
1244
- /* @__PURE__ */ a.jsx(yt, { children: /* @__PURE__ */ a.jsx(wt, { className: "font-mono font-medium", children: c.map((u, d) => /* @__PURE__ */ a.jsxs(
1245
- xt,
1246
- {
1247
- "data-testid": "log-row",
1248
- className: Ct("font-mono font-semibold cursor-pointer border-0", {
1249
- "bg-muted-foreground/10 hover:bg-muted-foreground/20": n === u.id,
1250
- "hover:bg-muted-foreground/10": n !== u.id
1251
- }),
1252
- onClick: () => r(u.id),
1253
- children: [
1254
- /* @__PURE__ */ a.jsxs(
1255
- re,
1256
- {
1257
- "data-testid": `time-${d}`,
1258
- className: "whitespace-nowrap flex items-center gap-2 text-muted-foreground",
1259
- children: [
1260
- /* @__PURE__ */ a.jsx(at, { level: u.level }),
1261
- it(u.time)
1262
- ]
1263
- }
1264
- ),
1265
- /* @__PURE__ */ a.jsx(
1266
- re,
1267
- {
1268
- "data-testid": `trace-${u.traceId}`,
1269
- className: "whitespace-nowrap cursor-pointer hover:text-primary text-muted-foreground",
1270
- onClick: () => o(u.traceId),
1271
- children: u.traceId
1272
- }
1273
- ),
1274
- /* @__PURE__ */ a.jsx(re, { "data-testid": `step-${d}`, "aria-label": u.step, className: "whitespace-nowrap", children: u.step }),
1275
- /* @__PURE__ */ a.jsx(
1276
- re,
1277
- {
1278
- "data-testid": `msg-${d}`,
1279
- "aria-label": u.msg,
1280
- className: "whitespace-nowrap max-w-[500px] truncate w-full",
1281
- children: u.msg
1282
- }
1283
- )
1284
- ]
1285
- },
1286
- d
1287
- )) }) })
1288
- ] }),
1289
- /* @__PURE__ */ a.jsx(mn, { log: l, onClose: () => r(void 0) })
1290
- ] });
57
+
58
+ //#endregion
59
+ //#region src/components/log-detail.tsx
60
+ const defaultProps = [
61
+ "id",
62
+ "msg",
63
+ "time",
64
+ "level",
65
+ "step",
66
+ "flows",
67
+ "traceId"
68
+ ];
69
+ const LogDetail = ({ log, onClose }) => {
70
+ const [hasOtherProps, setHasOtherProps] = useState(false);
71
+ const otherPropsObject = useMemo(() => {
72
+ if (!log) return null;
73
+ const otherProps = Object.keys(log ?? {}).filter((key) => !defaultProps.includes(key));
74
+ setHasOtherProps(otherProps.length > 0);
75
+ return otherProps.reduce((acc, key_0) => {
76
+ acc[key_0] = log[key_0];
77
+ return acc;
78
+ }, {});
79
+ }, [log]);
80
+ if (!log) return null;
81
+ return /* @__PURE__ */ jsx(Sidebar, {
82
+ onClose,
83
+ title: "Logs Details",
84
+ subtitle: "Details including custom properties",
85
+ actions: [{
86
+ icon: /* @__PURE__ */ jsx(X, {}),
87
+ onClick: onClose,
88
+ label: "Close"
89
+ }],
90
+ details: [
91
+ {
92
+ label: "Level",
93
+ value: /* @__PURE__ */ jsxs("div", {
94
+ className: "flex items-center gap-2",
95
+ children: [/* @__PURE__ */ jsx(LevelDot, { level: log.level }), /* @__PURE__ */ jsx("div", {
96
+ className: "capitalize",
97
+ children: log.level
98
+ })]
99
+ })
100
+ },
101
+ {
102
+ label: "Time",
103
+ value: formatTimestamp(log.time)
104
+ },
105
+ {
106
+ label: "Step",
107
+ value: log.step
108
+ },
109
+ {
110
+ label: "Flows",
111
+ value: log.flows.join(", ")
112
+ },
113
+ {
114
+ label: "Trace ID",
115
+ value: log.traceId
116
+ }
117
+ ],
118
+ children: hasOtherProps && /* @__PURE__ */ jsx(ReactJson, {
119
+ src: otherPropsObject,
120
+ theme: "default",
121
+ enableClipboard: true
122
+ })
123
+ });
1291
124
  };
1292
- Rt();
1293
- export {
1294
- bn as LogsPage
125
+
126
+ //#endregion
127
+ //#region src/components/logs-page.tsx
128
+ const LogsPage = () => {
129
+ const $ = c(41);
130
+ const logs = useLogsStore(_temp);
131
+ const resetLogs = useLogsStore(_temp2);
132
+ const selectedLogId = useLogsStore(_temp3);
133
+ const selectLogId = useLogsStore(_temp4);
134
+ let t0;
135
+ if ($[0] !== logs || $[1] !== selectedLogId) {
136
+ t0 = selectedLogId ? logs.find((log) => log.id === selectedLogId) : void 0;
137
+ $[0] = logs;
138
+ $[1] = selectedLogId;
139
+ $[2] = t0;
140
+ } else t0 = $[2];
141
+ const selectedLog = t0;
142
+ const [search, setSearch] = useState("");
143
+ let t1;
144
+ if ($[3] !== logs || $[4] !== search) {
145
+ let t2$1;
146
+ if ($[6] !== search) {
147
+ t2$1 = (log_0) => log_0.msg.toLowerCase().includes(search.toLowerCase()) || log_0.traceId.toLowerCase().includes(search.toLowerCase()) || log_0.step.toLowerCase().includes(search.toLowerCase());
148
+ $[6] = search;
149
+ $[7] = t2$1;
150
+ } else t2$1 = $[7];
151
+ t1 = logs.filter(t2$1);
152
+ $[3] = logs;
153
+ $[4] = search;
154
+ $[5] = t1;
155
+ } else t1 = $[5];
156
+ const filteredLogs = t1;
157
+ let t2;
158
+ if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
159
+ t2 = (e) => setSearch(e.target.value);
160
+ $[8] = t2;
161
+ } else t2 = $[8];
162
+ let t3;
163
+ if ($[9] !== search) {
164
+ t3 = /* @__PURE__ */ jsx(Input, {
165
+ variant: "shade",
166
+ value: search,
167
+ onChange: t2,
168
+ className: "px-9! font-medium",
169
+ placeholder: "Search by Trace ID or Message"
170
+ });
171
+ $[9] = search;
172
+ $[10] = t3;
173
+ } else t3 = $[10];
174
+ let t4;
175
+ if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
176
+ t4 = /* @__PURE__ */ jsx(Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50" });
177
+ $[11] = t4;
178
+ } else t4 = $[11];
179
+ let t5;
180
+ if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
181
+ t5 = /* @__PURE__ */ jsx(X, {
182
+ className: "cursor-pointer absolute right-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50 hover:text-muted-foreground",
183
+ onClick: () => setSearch("")
184
+ });
185
+ $[12] = t5;
186
+ } else t5 = $[12];
187
+ let t6;
188
+ if ($[13] !== t3) {
189
+ t6 = /* @__PURE__ */ jsxs("div", {
190
+ className: "flex-1 relative",
191
+ children: [
192
+ t3,
193
+ t4,
194
+ t5
195
+ ]
196
+ });
197
+ $[13] = t3;
198
+ $[14] = t6;
199
+ } else t6 = $[14];
200
+ let t7;
201
+ if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
202
+ t7 = /* @__PURE__ */ jsx(Trash, {});
203
+ $[15] = t7;
204
+ } else t7 = $[15];
205
+ let t8;
206
+ if ($[16] !== resetLogs) {
207
+ t8 = /* @__PURE__ */ jsxs(Button, {
208
+ variant: "default",
209
+ onClick: resetLogs,
210
+ className: "h-[34px]",
211
+ children: [t7, " Clear"]
212
+ });
213
+ $[16] = resetLogs;
214
+ $[17] = t8;
215
+ } else t8 = $[17];
216
+ let t9;
217
+ if ($[18] !== t6 || $[19] !== t8) {
218
+ t9 = /* @__PURE__ */ jsxs("div", {
219
+ className: "flex p-2 border-b gap-2",
220
+ "data-testid": "logs-search-container",
221
+ children: [t6, t8]
222
+ });
223
+ $[18] = t6;
224
+ $[19] = t8;
225
+ $[20] = t9;
226
+ } else t9 = $[20];
227
+ let t10;
228
+ if ($[21] !== filteredLogs || $[22] !== selectLogId || $[23] !== selectedLogId) {
229
+ let t11$1;
230
+ if ($[25] !== selectLogId || $[26] !== selectedLogId) {
231
+ t11$1 = (log_1, index) => /* @__PURE__ */ jsxs(TableRow, {
232
+ "data-testid": "log-row",
233
+ className: cn("font-mono font-semibold cursor-pointer border-0", {
234
+ "bg-muted-foreground/10 hover:bg-muted-foreground/20": selectedLogId === log_1.id,
235
+ "hover:bg-muted-foreground/10": selectedLogId !== log_1.id
236
+ }),
237
+ onClick: () => selectLogId(log_1.id),
238
+ children: [
239
+ /* @__PURE__ */ jsxs(TableCell, {
240
+ "data-testid": `time-${index}`,
241
+ className: "whitespace-nowrap flex items-center gap-2 text-muted-foreground",
242
+ children: [/* @__PURE__ */ jsx(LevelDot, { level: log_1.level }), formatTimestamp(log_1.time)]
243
+ }),
244
+ /* @__PURE__ */ jsx(TableCell, {
245
+ "data-testid": `trace-${log_1.traceId}`,
246
+ className: "whitespace-nowrap cursor-pointer hover:text-primary text-muted-foreground",
247
+ onClick: () => setSearch(log_1.traceId),
248
+ children: log_1.traceId
249
+ }),
250
+ /* @__PURE__ */ jsx(TableCell, {
251
+ "data-testid": `step-${index}`,
252
+ "aria-label": log_1.step,
253
+ className: "whitespace-nowrap",
254
+ children: log_1.step
255
+ }),
256
+ /* @__PURE__ */ jsx(TableCell, {
257
+ "data-testid": `msg-${index}`,
258
+ "aria-label": log_1.msg,
259
+ className: "whitespace-nowrap max-w-[500px] truncate w-full",
260
+ children: log_1.msg
261
+ })
262
+ ]
263
+ }, index);
264
+ $[25] = selectLogId;
265
+ $[26] = selectedLogId;
266
+ $[27] = t11$1;
267
+ } else t11$1 = $[27];
268
+ t10 = filteredLogs.map(t11$1);
269
+ $[21] = filteredLogs;
270
+ $[22] = selectLogId;
271
+ $[23] = selectedLogId;
272
+ $[24] = t10;
273
+ } else t10 = $[24];
274
+ let t11;
275
+ if ($[28] !== t10) {
276
+ t11 = /* @__PURE__ */ jsx(Table, { children: /* @__PURE__ */ jsx(TableBody, {
277
+ className: "font-mono font-medium",
278
+ children: t10
279
+ }) });
280
+ $[28] = t10;
281
+ $[29] = t11;
282
+ } else t11 = $[29];
283
+ let t12;
284
+ if ($[30] !== t11 || $[31] !== t9) {
285
+ t12 = /* @__PURE__ */ jsxs("div", {
286
+ className: "grid grid-rows-[auto_1fr] h-full",
287
+ "data-testid": "logs-container",
288
+ children: [t9, t11]
289
+ });
290
+ $[30] = t11;
291
+ $[31] = t9;
292
+ $[32] = t12;
293
+ } else t12 = $[32];
294
+ let t13;
295
+ if ($[33] !== selectLogId) {
296
+ t13 = () => selectLogId(void 0);
297
+ $[33] = selectLogId;
298
+ $[34] = t13;
299
+ } else t13 = $[34];
300
+ let t14;
301
+ if ($[35] !== selectedLog || $[36] !== t13) {
302
+ t14 = /* @__PURE__ */ jsx(LogDetail, {
303
+ log: selectedLog,
304
+ onClose: t13
305
+ });
306
+ $[35] = selectedLog;
307
+ $[36] = t13;
308
+ $[37] = t14;
309
+ } else t14 = $[37];
310
+ let t15;
311
+ if ($[38] !== t12 || $[39] !== t14) {
312
+ t15 = /* @__PURE__ */ jsxs(Fragment, { children: [t12, t14] });
313
+ $[38] = t12;
314
+ $[39] = t14;
315
+ $[40] = t15;
316
+ } else t15 = $[40];
317
+ return t15;
1295
318
  };
319
+ function _temp(state) {
320
+ return state.logs;
321
+ }
322
+ function _temp2(state_0) {
323
+ return state_0.resetLogs;
324
+ }
325
+ function _temp3(state_1) {
326
+ return state_1.selectedLogId;
327
+ }
328
+ function _temp4(state_2) {
329
+ return state_2.selectLogId;
330
+ }
331
+
332
+ //#endregion
333
+ //#region src/index.ts
334
+ initLogListener();
335
+
336
+ //#endregion
337
+ export { LogsPage };
338
+ //# sourceMappingURL=index.js.map