@gravitee/graphene-charts 2.47.0-fix-384-command-scroll.95d7e4a → 2.47.0-fix-384-command-scroll.5b18a0f
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 +409 -133
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -2196,6 +2196,282 @@ var xt = V((e, t) => {
|
|
|
2196
2196
|
});
|
|
2197
2197
|
xt.displayName = "GioDeveloperPortalIcon";
|
|
2198
2198
|
var St = V((e, t) => {
|
|
2199
|
+
let n = H();
|
|
2200
|
+
return /* @__PURE__ */ G("svg", {
|
|
2201
|
+
ref: t,
|
|
2202
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2203
|
+
width: 24,
|
|
2204
|
+
height: 24,
|
|
2205
|
+
viewBox: "238 238 724 726",
|
|
2206
|
+
fill: "none",
|
|
2207
|
+
...e,
|
|
2208
|
+
children: [/* @__PURE__ */ G("g", {
|
|
2209
|
+
className: "dark:hidden",
|
|
2210
|
+
children: [
|
|
2211
|
+
/* @__PURE__ */ W("path", {
|
|
2212
|
+
d: "M440 443.998H760V763.998H440V443.998Z",
|
|
2213
|
+
fill: `url(#${n}-l0)`
|
|
2214
|
+
}),
|
|
2215
|
+
/* @__PURE__ */ W("path", {
|
|
2216
|
+
d: "M238 238H398V398H238V238Z",
|
|
2217
|
+
fill: `url(#${n}-l1)`
|
|
2218
|
+
}),
|
|
2219
|
+
/* @__PURE__ */ W("path", {
|
|
2220
|
+
d: "M802 238H962V398H802V238Z",
|
|
2221
|
+
fill: `url(#${n}-l2)`
|
|
2222
|
+
}),
|
|
2223
|
+
/* @__PURE__ */ W("path", {
|
|
2224
|
+
d: "M238 802H398V962H238V802Z",
|
|
2225
|
+
fill: `url(#${n}-l3)`
|
|
2226
|
+
}),
|
|
2227
|
+
/* @__PURE__ */ W("path", {
|
|
2228
|
+
d: "M802 802H962V962H802V802Z",
|
|
2229
|
+
fill: `url(#${n}-l4)`
|
|
2230
|
+
}),
|
|
2231
|
+
/* @__PURE__ */ G("defs", { children: [
|
|
2232
|
+
/* @__PURE__ */ G("linearGradient", {
|
|
2233
|
+
id: `${n}-l0`,
|
|
2234
|
+
x1: "440",
|
|
2235
|
+
y1: "603.998",
|
|
2236
|
+
x2: "760",
|
|
2237
|
+
y2: "603.998",
|
|
2238
|
+
gradientUnits: "userSpaceOnUse",
|
|
2239
|
+
children: [
|
|
2240
|
+
/* @__PURE__ */ W("stop", { stopColor: "#410A00" }),
|
|
2241
|
+
/* @__PURE__ */ W("stop", {
|
|
2242
|
+
offset: "0.51",
|
|
2243
|
+
stopColor: "#F31013"
|
|
2244
|
+
}),
|
|
2245
|
+
/* @__PURE__ */ W("stop", {
|
|
2246
|
+
offset: "1",
|
|
2247
|
+
stopColor: "#FF8A00"
|
|
2248
|
+
})
|
|
2249
|
+
]
|
|
2250
|
+
}),
|
|
2251
|
+
/* @__PURE__ */ G("linearGradient", {
|
|
2252
|
+
id: `${n}-l1`,
|
|
2253
|
+
x1: "238",
|
|
2254
|
+
y1: "318",
|
|
2255
|
+
x2: "398",
|
|
2256
|
+
y2: "318",
|
|
2257
|
+
gradientUnits: "userSpaceOnUse",
|
|
2258
|
+
children: [
|
|
2259
|
+
/* @__PURE__ */ W("stop", { stopColor: "#410A00" }),
|
|
2260
|
+
/* @__PURE__ */ W("stop", {
|
|
2261
|
+
offset: "0.51",
|
|
2262
|
+
stopColor: "#F31013"
|
|
2263
|
+
}),
|
|
2264
|
+
/* @__PURE__ */ W("stop", {
|
|
2265
|
+
offset: "1",
|
|
2266
|
+
stopColor: "#FF8A00"
|
|
2267
|
+
})
|
|
2268
|
+
]
|
|
2269
|
+
}),
|
|
2270
|
+
/* @__PURE__ */ G("linearGradient", {
|
|
2271
|
+
id: `${n}-l2`,
|
|
2272
|
+
x1: "802",
|
|
2273
|
+
y1: "318",
|
|
2274
|
+
x2: "962",
|
|
2275
|
+
y2: "318",
|
|
2276
|
+
gradientUnits: "userSpaceOnUse",
|
|
2277
|
+
children: [
|
|
2278
|
+
/* @__PURE__ */ W("stop", { stopColor: "#410A00" }),
|
|
2279
|
+
/* @__PURE__ */ W("stop", {
|
|
2280
|
+
offset: "0.51",
|
|
2281
|
+
stopColor: "#F31013"
|
|
2282
|
+
}),
|
|
2283
|
+
/* @__PURE__ */ W("stop", {
|
|
2284
|
+
offset: "1",
|
|
2285
|
+
stopColor: "#FF8A00"
|
|
2286
|
+
})
|
|
2287
|
+
]
|
|
2288
|
+
}),
|
|
2289
|
+
/* @__PURE__ */ G("linearGradient", {
|
|
2290
|
+
id: `${n}-l3`,
|
|
2291
|
+
x1: "238",
|
|
2292
|
+
y1: "882",
|
|
2293
|
+
x2: "398",
|
|
2294
|
+
y2: "882",
|
|
2295
|
+
gradientUnits: "userSpaceOnUse",
|
|
2296
|
+
children: [
|
|
2297
|
+
/* @__PURE__ */ W("stop", { stopColor: "#410A00" }),
|
|
2298
|
+
/* @__PURE__ */ W("stop", {
|
|
2299
|
+
offset: "0.51",
|
|
2300
|
+
stopColor: "#F31013"
|
|
2301
|
+
}),
|
|
2302
|
+
/* @__PURE__ */ W("stop", {
|
|
2303
|
+
offset: "1",
|
|
2304
|
+
stopColor: "#FF8A00"
|
|
2305
|
+
})
|
|
2306
|
+
]
|
|
2307
|
+
}),
|
|
2308
|
+
/* @__PURE__ */ G("linearGradient", {
|
|
2309
|
+
id: `${n}-l4`,
|
|
2310
|
+
x1: "802",
|
|
2311
|
+
y1: "882",
|
|
2312
|
+
x2: "962",
|
|
2313
|
+
y2: "882",
|
|
2314
|
+
gradientUnits: "userSpaceOnUse",
|
|
2315
|
+
children: [
|
|
2316
|
+
/* @__PURE__ */ W("stop", { stopColor: "#410A00" }),
|
|
2317
|
+
/* @__PURE__ */ W("stop", {
|
|
2318
|
+
offset: "0.51",
|
|
2319
|
+
stopColor: "#F31013"
|
|
2320
|
+
}),
|
|
2321
|
+
/* @__PURE__ */ W("stop", {
|
|
2322
|
+
offset: "1",
|
|
2323
|
+
stopColor: "#FF8A00"
|
|
2324
|
+
})
|
|
2325
|
+
]
|
|
2326
|
+
})
|
|
2327
|
+
] })
|
|
2328
|
+
]
|
|
2329
|
+
}), /* @__PURE__ */ G("g", {
|
|
2330
|
+
className: "hidden dark:block",
|
|
2331
|
+
children: [
|
|
2332
|
+
/* @__PURE__ */ W("path", {
|
|
2333
|
+
d: "M440 443.998H760V763.998H440V443.998Z",
|
|
2334
|
+
fill: `url(#${n}-d0)`
|
|
2335
|
+
}),
|
|
2336
|
+
/* @__PURE__ */ W("path", {
|
|
2337
|
+
d: "M238 238H398V398H238V238Z",
|
|
2338
|
+
fill: `url(#${n}-d1)`
|
|
2339
|
+
}),
|
|
2340
|
+
/* @__PURE__ */ W("path", {
|
|
2341
|
+
d: "M802 238H962V398H802V238Z",
|
|
2342
|
+
fill: `url(#${n}-d2)`
|
|
2343
|
+
}),
|
|
2344
|
+
/* @__PURE__ */ W("path", {
|
|
2345
|
+
d: "M238 802H398V962H238V802Z",
|
|
2346
|
+
fill: `url(#${n}-d3)`
|
|
2347
|
+
}),
|
|
2348
|
+
/* @__PURE__ */ W("path", {
|
|
2349
|
+
d: "M802 802H962V962H802V802Z",
|
|
2350
|
+
fill: `url(#${n}-d4)`
|
|
2351
|
+
}),
|
|
2352
|
+
/* @__PURE__ */ G("defs", { children: [
|
|
2353
|
+
/* @__PURE__ */ G("linearGradient", {
|
|
2354
|
+
id: `${n}-d0`,
|
|
2355
|
+
x1: "440",
|
|
2356
|
+
y1: "603.998",
|
|
2357
|
+
x2: "760",
|
|
2358
|
+
y2: "603.998",
|
|
2359
|
+
gradientUnits: "userSpaceOnUse",
|
|
2360
|
+
children: [
|
|
2361
|
+
/* @__PURE__ */ W("stop", { stopColor: "#410A00" }),
|
|
2362
|
+
/* @__PURE__ */ W("stop", {
|
|
2363
|
+
offset: "0.26",
|
|
2364
|
+
stopColor: "#F31013"
|
|
2365
|
+
}),
|
|
2366
|
+
/* @__PURE__ */ W("stop", {
|
|
2367
|
+
offset: "0.66",
|
|
2368
|
+
stopColor: "#FF8A00"
|
|
2369
|
+
}),
|
|
2370
|
+
/* @__PURE__ */ W("stop", {
|
|
2371
|
+
offset: "1",
|
|
2372
|
+
stopColor: "white"
|
|
2373
|
+
})
|
|
2374
|
+
]
|
|
2375
|
+
}),
|
|
2376
|
+
/* @__PURE__ */ G("linearGradient", {
|
|
2377
|
+
id: `${n}-d1`,
|
|
2378
|
+
x1: "238",
|
|
2379
|
+
y1: "318",
|
|
2380
|
+
x2: "398",
|
|
2381
|
+
y2: "318",
|
|
2382
|
+
gradientUnits: "userSpaceOnUse",
|
|
2383
|
+
children: [
|
|
2384
|
+
/* @__PURE__ */ W("stop", { stopColor: "#410A00" }),
|
|
2385
|
+
/* @__PURE__ */ W("stop", {
|
|
2386
|
+
offset: "0.26",
|
|
2387
|
+
stopColor: "#F31013"
|
|
2388
|
+
}),
|
|
2389
|
+
/* @__PURE__ */ W("stop", {
|
|
2390
|
+
offset: "0.66",
|
|
2391
|
+
stopColor: "#FF8A00"
|
|
2392
|
+
}),
|
|
2393
|
+
/* @__PURE__ */ W("stop", {
|
|
2394
|
+
offset: "1",
|
|
2395
|
+
stopColor: "white"
|
|
2396
|
+
})
|
|
2397
|
+
]
|
|
2398
|
+
}),
|
|
2399
|
+
/* @__PURE__ */ G("linearGradient", {
|
|
2400
|
+
id: `${n}-d2`,
|
|
2401
|
+
x1: "802",
|
|
2402
|
+
y1: "318",
|
|
2403
|
+
x2: "962",
|
|
2404
|
+
y2: "318",
|
|
2405
|
+
gradientUnits: "userSpaceOnUse",
|
|
2406
|
+
children: [
|
|
2407
|
+
/* @__PURE__ */ W("stop", { stopColor: "#410A00" }),
|
|
2408
|
+
/* @__PURE__ */ W("stop", {
|
|
2409
|
+
offset: "0.26",
|
|
2410
|
+
stopColor: "#F31013"
|
|
2411
|
+
}),
|
|
2412
|
+
/* @__PURE__ */ W("stop", {
|
|
2413
|
+
offset: "0.66",
|
|
2414
|
+
stopColor: "#FF8A00"
|
|
2415
|
+
}),
|
|
2416
|
+
/* @__PURE__ */ W("stop", {
|
|
2417
|
+
offset: "1",
|
|
2418
|
+
stopColor: "white"
|
|
2419
|
+
})
|
|
2420
|
+
]
|
|
2421
|
+
}),
|
|
2422
|
+
/* @__PURE__ */ G("linearGradient", {
|
|
2423
|
+
id: `${n}-d3`,
|
|
2424
|
+
x1: "238",
|
|
2425
|
+
y1: "882",
|
|
2426
|
+
x2: "398",
|
|
2427
|
+
y2: "882",
|
|
2428
|
+
gradientUnits: "userSpaceOnUse",
|
|
2429
|
+
children: [
|
|
2430
|
+
/* @__PURE__ */ W("stop", { stopColor: "#410A00" }),
|
|
2431
|
+
/* @__PURE__ */ W("stop", {
|
|
2432
|
+
offset: "0.26",
|
|
2433
|
+
stopColor: "#F31013"
|
|
2434
|
+
}),
|
|
2435
|
+
/* @__PURE__ */ W("stop", {
|
|
2436
|
+
offset: "0.66",
|
|
2437
|
+
stopColor: "#FF8A00"
|
|
2438
|
+
}),
|
|
2439
|
+
/* @__PURE__ */ W("stop", {
|
|
2440
|
+
offset: "1",
|
|
2441
|
+
stopColor: "white"
|
|
2442
|
+
})
|
|
2443
|
+
]
|
|
2444
|
+
}),
|
|
2445
|
+
/* @__PURE__ */ G("linearGradient", {
|
|
2446
|
+
id: `${n}-d4`,
|
|
2447
|
+
x1: "802",
|
|
2448
|
+
y1: "882",
|
|
2449
|
+
x2: "962",
|
|
2450
|
+
y2: "882",
|
|
2451
|
+
gradientUnits: "userSpaceOnUse",
|
|
2452
|
+
children: [
|
|
2453
|
+
/* @__PURE__ */ W("stop", { stopColor: "#410A00" }),
|
|
2454
|
+
/* @__PURE__ */ W("stop", {
|
|
2455
|
+
offset: "0.26",
|
|
2456
|
+
stopColor: "#F31013"
|
|
2457
|
+
}),
|
|
2458
|
+
/* @__PURE__ */ W("stop", {
|
|
2459
|
+
offset: "0.66",
|
|
2460
|
+
stopColor: "#FF8A00"
|
|
2461
|
+
}),
|
|
2462
|
+
/* @__PURE__ */ W("stop", {
|
|
2463
|
+
offset: "1",
|
|
2464
|
+
stopColor: "white"
|
|
2465
|
+
})
|
|
2466
|
+
]
|
|
2467
|
+
})
|
|
2468
|
+
] })
|
|
2469
|
+
]
|
|
2470
|
+
})]
|
|
2471
|
+
});
|
|
2472
|
+
});
|
|
2473
|
+
St.displayName = "GioEdgeManagementIcon";
|
|
2474
|
+
var Ct = V((e, t) => {
|
|
2199
2475
|
let n = H();
|
|
2200
2476
|
return /* @__PURE__ */ G("svg", {
|
|
2201
2477
|
ref: t,
|
|
@@ -2382,8 +2658,8 @@ var St = V((e, t) => {
|
|
|
2382
2658
|
})]
|
|
2383
2659
|
});
|
|
2384
2660
|
});
|
|
2385
|
-
|
|
2386
|
-
var
|
|
2661
|
+
Ct.displayName = "GioEventApiManagementIcon";
|
|
2662
|
+
var wt = V((e, t) => {
|
|
2387
2663
|
let n = H();
|
|
2388
2664
|
return /* @__PURE__ */ G("svg", {
|
|
2389
2665
|
ref: t,
|
|
@@ -2624,8 +2900,8 @@ var Ct = V((e, t) => {
|
|
|
2624
2900
|
})]
|
|
2625
2901
|
});
|
|
2626
2902
|
});
|
|
2627
|
-
|
|
2628
|
-
var
|
|
2903
|
+
wt.displayName = "GioGammaIcon";
|
|
2904
|
+
var Tt = V((e, t) => {
|
|
2629
2905
|
let n = H();
|
|
2630
2906
|
return /* @__PURE__ */ G("svg", {
|
|
2631
2907
|
ref: t,
|
|
@@ -2866,8 +3142,8 @@ var wt = V((e, t) => {
|
|
|
2866
3142
|
})]
|
|
2867
3143
|
});
|
|
2868
3144
|
});
|
|
2869
|
-
|
|
2870
|
-
var
|
|
3145
|
+
Tt.displayName = "GioHomeIcon";
|
|
3146
|
+
var Et = V((e, t) => {
|
|
2871
3147
|
let n = H();
|
|
2872
3148
|
return /* @__PURE__ */ G("svg", {
|
|
2873
3149
|
ref: t,
|
|
@@ -3162,8 +3438,8 @@ var Tt = V((e, t) => {
|
|
|
3162
3438
|
})]
|
|
3163
3439
|
});
|
|
3164
3440
|
});
|
|
3165
|
-
|
|
3166
|
-
var
|
|
3441
|
+
Et.displayName = "GioIamIcon";
|
|
3442
|
+
var Dt = V((e, t) => {
|
|
3167
3443
|
let n = H();
|
|
3168
3444
|
return /* @__PURE__ */ G("svg", {
|
|
3169
3445
|
ref: t,
|
|
@@ -3388,8 +3664,8 @@ var Et = V((e, t) => {
|
|
|
3388
3664
|
})]
|
|
3389
3665
|
});
|
|
3390
3666
|
});
|
|
3391
|
-
|
|
3392
|
-
var
|
|
3667
|
+
Dt.displayName = "GioObservabilityIcon";
|
|
3668
|
+
var Ot = V((e, t) => {
|
|
3393
3669
|
let n = H();
|
|
3394
3670
|
return /* @__PURE__ */ G("svg", {
|
|
3395
3671
|
ref: t,
|
|
@@ -3508,8 +3784,8 @@ var Dt = V((e, t) => {
|
|
|
3508
3784
|
})]
|
|
3509
3785
|
});
|
|
3510
3786
|
});
|
|
3511
|
-
|
|
3512
|
-
var
|
|
3787
|
+
Ot.displayName = "GioObserveIcon";
|
|
3788
|
+
var kt = V((e, t) => {
|
|
3513
3789
|
let n = H();
|
|
3514
3790
|
return /* @__PURE__ */ G("svg", {
|
|
3515
3791
|
ref: t,
|
|
@@ -3840,8 +4116,8 @@ var Ot = V((e, t) => {
|
|
|
3840
4116
|
})]
|
|
3841
4117
|
});
|
|
3842
4118
|
});
|
|
3843
|
-
|
|
3844
|
-
var
|
|
4119
|
+
kt.displayName = "GioPlatformIcon";
|
|
4120
|
+
var At = V((e, t) => {
|
|
3845
4121
|
let n = H();
|
|
3846
4122
|
return /* @__PURE__ */ G("svg", {
|
|
3847
4123
|
ref: t,
|
|
@@ -3960,8 +4236,8 @@ var kt = V((e, t) => {
|
|
|
3960
4236
|
})]
|
|
3961
4237
|
});
|
|
3962
4238
|
});
|
|
3963
|
-
|
|
3964
|
-
var
|
|
4239
|
+
At.displayName = "GioProductizeIcon";
|
|
4240
|
+
var jt = V((e, t) => {
|
|
3965
4241
|
let n = H();
|
|
3966
4242
|
return /* @__PURE__ */ G("svg", {
|
|
3967
4243
|
ref: t,
|
|
@@ -4088,10 +4364,10 @@ var At = V((e, t) => {
|
|
|
4088
4364
|
})]
|
|
4089
4365
|
});
|
|
4090
4366
|
});
|
|
4091
|
-
|
|
4367
|
+
jt.displayName = "GioSecureIcon";
|
|
4092
4368
|
//#endregion
|
|
4093
4369
|
//#region src/lib/useContainerSize.ts
|
|
4094
|
-
function
|
|
4370
|
+
function Mt() {
|
|
4095
4371
|
let [e, t] = ce({
|
|
4096
4372
|
width: 0,
|
|
4097
4373
|
height: 0
|
|
@@ -4116,29 +4392,29 @@ function jt() {
|
|
|
4116
4392
|
}
|
|
4117
4393
|
//#endregion
|
|
4118
4394
|
//#region src/charts/Metric/Metric.tsx
|
|
4119
|
-
var
|
|
4395
|
+
var Nt = {
|
|
4120
4396
|
positive: "text-success",
|
|
4121
4397
|
negative: "text-destructive",
|
|
4122
4398
|
neutral: "text-muted-foreground"
|
|
4123
4399
|
};
|
|
4124
|
-
function
|
|
4400
|
+
function Pt(e, t) {
|
|
4125
4401
|
return e === "neutral" || t === "neutral" ? "neutral" : t === "higher-is-better" ? e === "up" ? "positive" : "negative" : e === "up" ? "negative" : "positive";
|
|
4126
4402
|
}
|
|
4127
|
-
var
|
|
4128
|
-
function
|
|
4403
|
+
var Ft = 56;
|
|
4404
|
+
function It(e, t) {
|
|
4129
4405
|
let n = Math.min(t > 0 ? t : 100, (e > 0 ? e : 200) * .65);
|
|
4130
4406
|
return Math.max(18, Math.min(96, Math.round(n * .22)));
|
|
4131
4407
|
}
|
|
4132
|
-
function
|
|
4408
|
+
function Lt(e) {
|
|
4133
4409
|
return Math.max(10, Math.round(e * .22));
|
|
4134
4410
|
}
|
|
4135
|
-
function
|
|
4411
|
+
function Rt(e) {
|
|
4136
4412
|
return e < 80 ? "text-sm font-semibold leading-tight" : e < 110 ? "text-base font-semibold leading-tight" : e < 150 ? "text-lg font-semibold leading-tight" : "text-xl font-semibold leading-tight";
|
|
4137
4413
|
}
|
|
4138
|
-
function
|
|
4414
|
+
function zt(e) {
|
|
4139
4415
|
return e < 50 ? "text-[9px]" : e < 80 ? "text-[10px]" : e < 120 ? "text-xs" : "text-sm";
|
|
4140
4416
|
}
|
|
4141
|
-
function
|
|
4417
|
+
function Bt(e) {
|
|
4142
4418
|
return e < 60 ? {
|
|
4143
4419
|
text: "text-[9px]",
|
|
4144
4420
|
icon: "size-2 stroke-[2.5]"
|
|
@@ -4153,7 +4429,7 @@ function zt(e) {
|
|
|
4153
4429
|
icon: "size-3.5 stroke-[2.5]"
|
|
4154
4430
|
};
|
|
4155
4431
|
}
|
|
4156
|
-
function
|
|
4432
|
+
function Vt({ data: t, color: n, colorClass: r }) {
|
|
4157
4433
|
let i = R.useRef(null), [a, o] = R.useState({
|
|
4158
4434
|
width: 0,
|
|
4159
4435
|
height: 0
|
|
@@ -4205,14 +4481,14 @@ function Bt({ data: t, color: n, colorClass: r }) {
|
|
|
4205
4481
|
] })
|
|
4206
4482
|
});
|
|
4207
4483
|
}
|
|
4208
|
-
function
|
|
4484
|
+
function Ht({ trend: t, sentiment: n, trendClass: r }) {
|
|
4209
4485
|
let i = t.direction === "down" ? Qe : et;
|
|
4210
4486
|
return /* @__PURE__ */ G("span", {
|
|
4211
|
-
className: e("inline-flex items-center gap-1 font-medium", r.text,
|
|
4487
|
+
className: e("inline-flex items-center gap-1 font-medium", r.text, Nt[n]),
|
|
4212
4488
|
children: [t.direction !== "neutral" && /* @__PURE__ */ W(i, { className: r.icon }), t.isNew ? "New" : `${t.value}%`]
|
|
4213
4489
|
});
|
|
4214
4490
|
}
|
|
4215
|
-
function
|
|
4491
|
+
function Ut({ className: t, ...n }) {
|
|
4216
4492
|
return /* @__PURE__ */ G("div", {
|
|
4217
4493
|
role: "img",
|
|
4218
4494
|
"aria-busy": "true",
|
|
@@ -4231,15 +4507,15 @@ function Ht({ className: t, ...n }) {
|
|
|
4231
4507
|
}), /* @__PURE__ */ W(_, { className: "min-h-5 w-full flex-1" })]
|
|
4232
4508
|
});
|
|
4233
4509
|
}
|
|
4234
|
-
function
|
|
4235
|
-
let { ref: p, width: m, height: h } =
|
|
4236
|
-
if (r === "loading") return /* @__PURE__ */ W(
|
|
4510
|
+
function Wt({ value: t, label: n, state: r, description: i, icon: a, trend: o, trendSentiment: s = "higher-is-better", centered: c = !1, sparklineData: l, sparklineColor: u, className: d, ...f }) {
|
|
4511
|
+
let { ref: p, width: m, height: h } = Mt();
|
|
4512
|
+
if (r === "loading") return /* @__PURE__ */ W(Ut, {
|
|
4237
4513
|
className: d,
|
|
4238
4514
|
...f
|
|
4239
4515
|
});
|
|
4240
|
-
let g = r === "empty" ? "—" : t, _ = r === "empty" ? void 0 : o, v = r === "empty" ? void 0 : l, y = _ ?
|
|
4516
|
+
let g = r === "empty" ? "—" : t, _ = r === "empty" ? void 0 : o, v = r === "empty" ? void 0 : l, y = _ ? Pt(_.direction, s) : void 0, b = !u && y ? Nt[y] : void 0, x = u ?? (y ? void 0 : "var(--chart-1)"), S = v != null && v.length >= 2 && h >= Ft && !c, C = c || !S, w = Rt(h), T = zt(h), E = Bt(h), D = n && h > 50, O = !!(_ && y && (S || h > 40));
|
|
4241
4517
|
if (C) {
|
|
4242
|
-
let t =
|
|
4518
|
+
let t = It(m, h), r = Lt(t);
|
|
4243
4519
|
return /* @__PURE__ */ G("div", {
|
|
4244
4520
|
ref: p,
|
|
4245
4521
|
className: e("flex h-full flex-col items-center justify-center gap-1 text-center", d),
|
|
@@ -4255,7 +4531,7 @@ function Ut({ value: t, label: n, state: r, description: i, icon: a, trend: o, t
|
|
|
4255
4531
|
style: { fontSize: r },
|
|
4256
4532
|
children: n
|
|
4257
4533
|
}),
|
|
4258
|
-
O && _ && y && /* @__PURE__ */ W(
|
|
4534
|
+
O && _ && y && /* @__PURE__ */ W(Ht, {
|
|
4259
4535
|
trend: _,
|
|
4260
4536
|
sentiment: y,
|
|
4261
4537
|
trendClass: E
|
|
@@ -4279,7 +4555,7 @@ function Ut({ value: t, label: n, state: r, description: i, icon: a, trend: o, t
|
|
|
4279
4555
|
}),
|
|
4280
4556
|
O && _ && y && /* @__PURE__ */ G("span", {
|
|
4281
4557
|
className: "flex shrink-0 items-center gap-1",
|
|
4282
|
-
children: [/* @__PURE__ */ W(
|
|
4558
|
+
children: [/* @__PURE__ */ W(Ht, {
|
|
4283
4559
|
trend: _,
|
|
4284
4560
|
sentiment: y,
|
|
4285
4561
|
trendClass: E
|
|
@@ -4299,7 +4575,7 @@ function Ut({ value: t, label: n, state: r, description: i, icon: a, trend: o, t
|
|
|
4299
4575
|
]
|
|
4300
4576
|
}), /* @__PURE__ */ W("div", {
|
|
4301
4577
|
className: "min-h-0 flex-1 pt-1",
|
|
4302
|
-
children: /* @__PURE__ */ W(
|
|
4578
|
+
children: /* @__PURE__ */ W(Vt, {
|
|
4303
4579
|
data: v,
|
|
4304
4580
|
color: x,
|
|
4305
4581
|
colorClass: b
|
|
@@ -4312,40 +4588,40 @@ function Ut({ value: t, label: n, state: r, description: i, icon: a, trend: o, t
|
|
|
4312
4588
|
function X(e) {
|
|
4313
4589
|
return "category" in e && "metrics" in e;
|
|
4314
4590
|
}
|
|
4315
|
-
var
|
|
4591
|
+
var Gt = {
|
|
4316
4592
|
positive: "text-success",
|
|
4317
4593
|
negative: "text-destructive",
|
|
4318
4594
|
neutral: "text-muted-foreground"
|
|
4319
4595
|
};
|
|
4320
|
-
function
|
|
4596
|
+
function Kt(e) {
|
|
4321
4597
|
let t = 0;
|
|
4322
4598
|
for (let n of e) t += X(n) ? n.metrics.length : 1;
|
|
4323
4599
|
return t;
|
|
4324
4600
|
}
|
|
4325
|
-
function
|
|
4601
|
+
function qt(e) {
|
|
4326
4602
|
return X(e) ? e.metrics.length : 1;
|
|
4327
4603
|
}
|
|
4328
|
-
var
|
|
4604
|
+
var Jt = [
|
|
4329
4605
|
"xs",
|
|
4330
4606
|
"sm",
|
|
4331
4607
|
"md",
|
|
4332
4608
|
"lg"
|
|
4333
4609
|
];
|
|
4334
|
-
function
|
|
4610
|
+
function Yt(e, t, n) {
|
|
4335
4611
|
let r = e / Math.max(n, 1), i = r < 40 ? "xs" : r < 70 ? "sm" : r < 110 ? "md" : "lg", a = t < 25 ? "xs" : t < 40 ? "sm" : t < 60 ? "md" : "lg";
|
|
4336
|
-
return
|
|
4612
|
+
return Jt[Math.min(Jt.indexOf(i), Jt.indexOf(a))];
|
|
4337
4613
|
}
|
|
4338
|
-
var
|
|
4614
|
+
var Xt = {
|
|
4339
4615
|
xs: 40,
|
|
4340
4616
|
sm: 55,
|
|
4341
4617
|
md: 75,
|
|
4342
4618
|
lg: 100
|
|
4343
|
-
},
|
|
4344
|
-
function
|
|
4345
|
-
if (e <
|
|
4346
|
-
let r =
|
|
4619
|
+
}, Zt = 40, Qt = 80;
|
|
4620
|
+
function $t(e, t, n) {
|
|
4621
|
+
if (e < Qt) return 0;
|
|
4622
|
+
let r = Xt[n], i = 0, a = 0;
|
|
4347
4623
|
for (let n = 0; n < t.length; n++) {
|
|
4348
|
-
let o = r *
|
|
4624
|
+
let o = r * qt(t[n]), s = t.length - (n + 1) > 0 ? Zt : 0;
|
|
4349
4625
|
if (a + o + s > e) break;
|
|
4350
4626
|
a += o, i++;
|
|
4351
4627
|
}
|
|
@@ -4389,15 +4665,15 @@ var Z = {
|
|
|
4389
4665
|
lg: "px-5"
|
|
4390
4666
|
}
|
|
4391
4667
|
};
|
|
4392
|
-
function
|
|
4668
|
+
function en({ trend: t, sentiment: n, size: r }) {
|
|
4393
4669
|
let i = t.direction === "down" ? Qe : et, a = r === "xs" || r === "sm";
|
|
4394
4670
|
return a && t.direction === "neutral" ? null : /* @__PURE__ */ G("span", {
|
|
4395
|
-
className: e("inline-flex items-center gap-px font-medium", Z.trend[r],
|
|
4671
|
+
className: e("inline-flex items-center gap-px font-medium", Z.trend[r], Gt[n]),
|
|
4396
4672
|
children: [t.direction !== "neutral" && /* @__PURE__ */ W(i, { className: Z.trendIcon[r] }), !a && (t.isNew ? "New" : `${t.value}%`)]
|
|
4397
4673
|
});
|
|
4398
4674
|
}
|
|
4399
|
-
function
|
|
4400
|
-
let i = t.trend ?
|
|
4675
|
+
function tn({ item: t, size: n, labelVisible: r }) {
|
|
4676
|
+
let i = t.trend ? Pt(t.trend.direction, t.trendSentiment ?? "higher-is-better") : void 0, a = r && t.label, o = /* @__PURE__ */ G("div", {
|
|
4401
4677
|
className: "flex w-full min-w-0 flex-col",
|
|
4402
4678
|
children: [/* @__PURE__ */ G("div", {
|
|
4403
4679
|
className: "flex items-baseline justify-between gap-1",
|
|
@@ -4406,7 +4682,7 @@ function en({ item: t, size: n, labelVisible: r }) {
|
|
|
4406
4682
|
children: t.value
|
|
4407
4683
|
}), t.trend && i && !(t.trend.direction === "neutral" && (n === "xs" || n === "sm")) && /* @__PURE__ */ W("span", {
|
|
4408
4684
|
className: "shrink-0",
|
|
4409
|
-
children: /* @__PURE__ */ W(
|
|
4685
|
+
children: /* @__PURE__ */ W(en, {
|
|
4410
4686
|
trend: t.trend,
|
|
4411
4687
|
sentiment: i,
|
|
4412
4688
|
size: n
|
|
@@ -4428,7 +4704,7 @@ function en({ item: t, size: n, labelVisible: r }) {
|
|
|
4428
4704
|
children: o
|
|
4429
4705
|
});
|
|
4430
4706
|
}
|
|
4431
|
-
function
|
|
4707
|
+
function nn({ count: t, size: n }) {
|
|
4432
4708
|
let r = `${t} more ${t === 1 ? "metric" : "metrics"} hidden`;
|
|
4433
4709
|
return /* @__PURE__ */ G(ne, { children: [/* @__PURE__ */ W(ie, {
|
|
4434
4710
|
asChild: !0,
|
|
@@ -4440,7 +4716,7 @@ function tn({ count: t, size: n }) {
|
|
|
4440
4716
|
})
|
|
4441
4717
|
}), /* @__PURE__ */ W(re, { children: r })] });
|
|
4442
4718
|
}
|
|
4443
|
-
function
|
|
4719
|
+
function rn({ count: t, className: n, ...r }) {
|
|
4444
4720
|
return /* @__PURE__ */ W("div", {
|
|
4445
4721
|
role: "img",
|
|
4446
4722
|
"aria-busy": "true",
|
|
@@ -4453,10 +4729,10 @@ function nn({ count: t, className: n, ...r }) {
|
|
|
4453
4729
|
}, t))
|
|
4454
4730
|
});
|
|
4455
4731
|
}
|
|
4456
|
-
function
|
|
4457
|
-
let { ref: o, width: s, height: c } =
|
|
4458
|
-
if (n === "loading") return /* @__PURE__ */ W(
|
|
4459
|
-
count: t.length > 0 ?
|
|
4732
|
+
function an({ items: t, state: n, skeletonCount: r, className: i, ...a }) {
|
|
4733
|
+
let { ref: o, width: s, height: c } = Mt();
|
|
4734
|
+
if (n === "loading") return /* @__PURE__ */ W(rn, {
|
|
4735
|
+
count: t.length > 0 ? Kt(t) : r ?? 5,
|
|
4460
4736
|
className: i,
|
|
4461
4737
|
...a
|
|
4462
4738
|
});
|
|
@@ -4471,7 +4747,7 @@ function rn({ items: t, state: n, skeletonCount: r, className: i, ...a }) {
|
|
|
4471
4747
|
...e,
|
|
4472
4748
|
value: "—",
|
|
4473
4749
|
trend: void 0
|
|
4474
|
-
}) : t, u =
|
|
4750
|
+
}) : t, u = Kt(l), d = s > 0 ? Yt(s, c, u) : "md", f = c >= 50, p = s > 0 ? $t(s, l, d) : l.length, m = l.slice(0, p), h = l.length - p, g = p === 0;
|
|
4475
4751
|
return /* @__PURE__ */ W(L, {
|
|
4476
4752
|
delayDuration: 300,
|
|
4477
4753
|
children: /* @__PURE__ */ G("div", {
|
|
@@ -4483,19 +4759,19 @@ function rn({ items: t, state: n, skeletonCount: r, className: i, ...a }) {
|
|
|
4483
4759
|
children: [s > 0 && !g && m.map((t) => {
|
|
4484
4760
|
let n = X(t) ? t.category : `${t.value}-${t.label ?? ""}`;
|
|
4485
4761
|
return /* @__PURE__ */ W("div", {
|
|
4486
|
-
style: { flex:
|
|
4762
|
+
style: { flex: qt(t) },
|
|
4487
4763
|
className: e("flex min-w-0 flex-col justify-center overflow-x-hidden", Z.cellPadding[d]),
|
|
4488
4764
|
children: X(t) ? /* @__PURE__ */ G(U, { children: [/* @__PURE__ */ W("span", {
|
|
4489
4765
|
className: e("mb-0.5 font-medium tracking-wider text-muted-foreground uppercase", Z.category[d]),
|
|
4490
4766
|
children: t.category
|
|
4491
4767
|
}), /* @__PURE__ */ W("div", {
|
|
4492
4768
|
className: "flex w-full min-w-0 items-stretch gap-3",
|
|
4493
|
-
children: t.metrics.map((e) => /* @__PURE__ */ W(
|
|
4769
|
+
children: t.metrics.map((e) => /* @__PURE__ */ W(tn, {
|
|
4494
4770
|
item: e,
|
|
4495
4771
|
size: d,
|
|
4496
4772
|
labelVisible: f
|
|
4497
4773
|
}, `${e.value}-${e.label ?? ""}`))
|
|
4498
|
-
})] }) : /* @__PURE__ */ W(
|
|
4774
|
+
})] }) : /* @__PURE__ */ W(tn, {
|
|
4499
4775
|
item: t,
|
|
4500
4776
|
size: d,
|
|
4501
4777
|
labelVisible: f
|
|
@@ -4503,7 +4779,7 @@ function rn({ items: t, state: n, skeletonCount: r, className: i, ...a }) {
|
|
|
4503
4779
|
}, n);
|
|
4504
4780
|
}), s > 0 && h > 0 && /* @__PURE__ */ W("div", {
|
|
4505
4781
|
className: e("flex shrink-0 items-center", g ? "" : "px-2"),
|
|
4506
|
-
children: /* @__PURE__ */ W(
|
|
4782
|
+
children: /* @__PURE__ */ W(nn, {
|
|
4507
4783
|
count: h,
|
|
4508
4784
|
size: d
|
|
4509
4785
|
})
|
|
@@ -4513,7 +4789,7 @@ function rn({ items: t, state: n, skeletonCount: r, className: i, ...a }) {
|
|
|
4513
4789
|
}
|
|
4514
4790
|
//#endregion
|
|
4515
4791
|
//#region src/charts/LineChart/LineChart.tsx
|
|
4516
|
-
function
|
|
4792
|
+
function on({ data: e, dataKeys: n, state: r, curveType: i = "monotone", showDots: a = !1, showGrid: s = !0, showCategoryAxis: c = !0, showValueAxis: l = !0, connectNulls: u = !1, valueTickFormatter: d, categoryTickFormatter: f, animated: h = !0, onPointHover: _, onPointLeave: v, ariaLabel: y, margin: b, className: S, children: C, ...w }) {
|
|
4517
4793
|
let { config: T } = t(), E = n ?? Ne(e, Object.keys(T));
|
|
4518
4794
|
return r === "loading" ? /* @__PURE__ */ W(x, {
|
|
4519
4795
|
ariaLabel: y,
|
|
@@ -4548,7 +4824,7 @@ function an({ data: e, dataKeys: n, state: r, curveType: i = "monotone", showDot
|
|
|
4548
4824
|
}
|
|
4549
4825
|
//#endregion
|
|
4550
4826
|
//#region src/charts/AreaChart/AreaChart.tsx
|
|
4551
|
-
function
|
|
4827
|
+
function sn({ data: e, dataKeys: n, state: r, curveType: i = "monotone", stacked: a = !0, gradient: s = !0, fillOpacity: c = .2, showGrid: l = !0, showCategoryAxis: u = !0, showValueAxis: d = !0, connectNulls: f = !1, animated: h = !0, ariaLabel: _, margin: v, valueTickFormatter: y, categoryTickFormatter: x, onPointHover: S, onPointLeave: C, className: w, children: T, ...E }) {
|
|
4552
4828
|
let { config: D } = t(), O = n ?? Ne(e, Object.keys(D)), k = a ? "default" : void 0;
|
|
4553
4829
|
return r === "loading" ? /* @__PURE__ */ W(b, {
|
|
4554
4830
|
ariaLabel: _,
|
|
@@ -4583,7 +4859,7 @@ function on({ data: e, dataKeys: n, state: r, curveType: i = "monotone", stacked
|
|
|
4583
4859
|
]
|
|
4584
4860
|
});
|
|
4585
4861
|
}
|
|
4586
|
-
function
|
|
4862
|
+
function cn(e) {
|
|
4587
4863
|
if (e === 0) return "0ns";
|
|
4588
4864
|
if (e < 1e3) return `${Math.round(e)}ns`;
|
|
4589
4865
|
let t = e / 1e3;
|
|
@@ -4595,7 +4871,7 @@ function sn(e) {
|
|
|
4595
4871
|
let i = Math.floor(r / 60), a = r % 60;
|
|
4596
4872
|
return `${i}m ${Math.round(a)}s`;
|
|
4597
4873
|
}
|
|
4598
|
-
function
|
|
4874
|
+
function ln(e) {
|
|
4599
4875
|
let t = 0;
|
|
4600
4876
|
for (let n of e) {
|
|
4601
4877
|
let e = n.startOffsetNs + n.durationNs;
|
|
@@ -4603,7 +4879,7 @@ function cn(e) {
|
|
|
4603
4879
|
}
|
|
4604
4880
|
return t > 0 ? t : 1;
|
|
4605
4881
|
}
|
|
4606
|
-
function
|
|
4882
|
+
function un(e, t, n, r) {
|
|
4607
4883
|
if (r <= 0 || n <= 0) return {
|
|
4608
4884
|
x: 0,
|
|
4609
4885
|
width: 0
|
|
@@ -4614,18 +4890,18 @@ function ln(e, t, n, r) {
|
|
|
4614
4890
|
width: a
|
|
4615
4891
|
};
|
|
4616
4892
|
}
|
|
4617
|
-
function
|
|
4893
|
+
function dn(e, t) {
|
|
4618
4894
|
if (t === 0 || e === 0) return "0%";
|
|
4619
4895
|
let n = e / t * 100;
|
|
4620
4896
|
return n < .1 ? "<0.1%" : n >= 100 ? "100%" : `${n < 1 ? n.toFixed(1) : Math.round(n)}%`;
|
|
4621
4897
|
}
|
|
4622
|
-
var
|
|
4623
|
-
function
|
|
4898
|
+
var fn = 6, pn = 80;
|
|
4899
|
+
function mn(e) {
|
|
4624
4900
|
if (e <= 0) return 0;
|
|
4625
|
-
let t = Math.floor(e /
|
|
4626
|
-
return Math.max(2, Math.min(t,
|
|
4901
|
+
let t = Math.floor(e / pn) + 1;
|
|
4902
|
+
return Math.max(2, Math.min(t, fn));
|
|
4627
4903
|
}
|
|
4628
|
-
function
|
|
4904
|
+
function hn(e, t = 5) {
|
|
4629
4905
|
if (e <= 0) return [0];
|
|
4630
4906
|
if (t <= 1) return [0, e];
|
|
4631
4907
|
let n = e / (t - 1);
|
|
@@ -4633,13 +4909,13 @@ function mn(e, t = 5) {
|
|
|
4633
4909
|
}
|
|
4634
4910
|
//#endregion
|
|
4635
4911
|
//#region src/charts/TraceWaterfall/TraceWaterfall.tsx
|
|
4636
|
-
var
|
|
4912
|
+
var gn = 280, _n = .45, vn = 36, Q = 20, yn = 20, bn = 4, $ = 12, xn = 48, Sn = 32, Cn = 3, wn = {
|
|
4637
4913
|
internal: "INTERNAL",
|
|
4638
4914
|
server: "SERVER",
|
|
4639
4915
|
client: "CLIENT",
|
|
4640
4916
|
producer: "PRODUCER",
|
|
4641
4917
|
consumer: "CONSUMER"
|
|
4642
|
-
},
|
|
4918
|
+
}, Tn = [
|
|
4643
4919
|
"bg-chart-1",
|
|
4644
4920
|
"bg-chart-2",
|
|
4645
4921
|
"bg-chart-3",
|
|
@@ -4649,21 +4925,21 @@ var hn = 280, gn = .45, _n = 36, Q = 20, vn = 20, yn = 4, $ = 12, bn = 48, xn =
|
|
|
4649
4925
|
"bg-chart-7",
|
|
4650
4926
|
"bg-chart-8"
|
|
4651
4927
|
];
|
|
4652
|
-
function
|
|
4928
|
+
function En(e) {
|
|
4653
4929
|
let t = /* @__PURE__ */ new Map(), n = 0;
|
|
4654
|
-
for (let r of e) t.has(r.serviceName) || (t.set(r.serviceName,
|
|
4930
|
+
for (let r of e) t.has(r.serviceName) || (t.set(r.serviceName, Tn[n % Tn.length]), n++);
|
|
4655
4931
|
return t;
|
|
4656
4932
|
}
|
|
4657
|
-
var
|
|
4933
|
+
var Dn = { error: "bg-destructive" }, On = {
|
|
4658
4934
|
ok: "success",
|
|
4659
4935
|
error: "destructive",
|
|
4660
4936
|
unset: "secondary"
|
|
4661
|
-
},
|
|
4937
|
+
}, kn = {
|
|
4662
4938
|
ok: "OK",
|
|
4663
4939
|
error: "Error",
|
|
4664
4940
|
unset: "Unset"
|
|
4665
4941
|
};
|
|
4666
|
-
function
|
|
4942
|
+
function An({ icon: e, label: t, children: n }) {
|
|
4667
4943
|
return /* @__PURE__ */ G("div", {
|
|
4668
4944
|
className: "flex items-center justify-between gap-4",
|
|
4669
4945
|
children: [/* @__PURE__ */ G("div", {
|
|
@@ -4675,7 +4951,7 @@ function kn({ icon: e, label: t, children: n }) {
|
|
|
4675
4951
|
})]
|
|
4676
4952
|
});
|
|
4677
4953
|
}
|
|
4678
|
-
function
|
|
4954
|
+
function jn({ span: t, serviceColor: n, traceDurationNs: r }) {
|
|
4679
4955
|
return /* @__PURE__ */ G(U, { children: [
|
|
4680
4956
|
/* @__PURE__ */ G("div", {
|
|
4681
4957
|
className: "space-y-1 px-2.5 pt-2 pb-1.5",
|
|
@@ -4688,13 +4964,13 @@ function An({ span: t, serviceColor: n, traceDurationNs: r }) {
|
|
|
4688
4964
|
}), /* @__PURE__ */ G("div", {
|
|
4689
4965
|
className: "flex items-center gap-1.5 pl-[14px]",
|
|
4690
4966
|
children: [/* @__PURE__ */ W(O, {
|
|
4691
|
-
variant:
|
|
4967
|
+
variant: On[t.status],
|
|
4692
4968
|
className: "h-4 text-[9px]",
|
|
4693
|
-
children:
|
|
4969
|
+
children: kn[t.status]
|
|
4694
4970
|
}), /* @__PURE__ */ W(O, {
|
|
4695
4971
|
variant: "outline",
|
|
4696
4972
|
className: "h-4 text-[9px]",
|
|
4697
|
-
children:
|
|
4973
|
+
children: wn[t.kind]
|
|
4698
4974
|
})]
|
|
4699
4975
|
})]
|
|
4700
4976
|
}),
|
|
@@ -4702,25 +4978,25 @@ function An({ span: t, serviceColor: n, traceDurationNs: r }) {
|
|
|
4702
4978
|
/* @__PURE__ */ G("div", {
|
|
4703
4979
|
className: "space-y-1 px-2.5 py-1.5 text-[11px]",
|
|
4704
4980
|
children: [
|
|
4705
|
-
/* @__PURE__ */ W(
|
|
4981
|
+
/* @__PURE__ */ W(An, {
|
|
4706
4982
|
icon: rt,
|
|
4707
4983
|
label: "Service",
|
|
4708
4984
|
children: t.serviceName
|
|
4709
4985
|
}),
|
|
4710
|
-
/* @__PURE__ */ W(
|
|
4986
|
+
/* @__PURE__ */ W(An, {
|
|
4711
4987
|
icon: nt,
|
|
4712
4988
|
label: "Duration",
|
|
4713
4989
|
children: /* @__PURE__ */ W("span", {
|
|
4714
4990
|
className: "font-mono tabular-nums",
|
|
4715
|
-
children:
|
|
4991
|
+
children: cn(t.durationNs)
|
|
4716
4992
|
})
|
|
4717
4993
|
}),
|
|
4718
|
-
/* @__PURE__ */ W(
|
|
4994
|
+
/* @__PURE__ */ W(An, {
|
|
4719
4995
|
icon: Ze,
|
|
4720
4996
|
label: "% of trace",
|
|
4721
4997
|
children: /* @__PURE__ */ W("span", {
|
|
4722
4998
|
className: "font-mono tabular-nums",
|
|
4723
|
-
children:
|
|
4999
|
+
children: dn(t.durationNs, r)
|
|
4724
5000
|
})
|
|
4725
5001
|
})
|
|
4726
5002
|
]
|
|
@@ -4734,7 +5010,7 @@ function An({ span: t, serviceColor: n, traceDurationNs: r }) {
|
|
|
4734
5010
|
})
|
|
4735
5011
|
] });
|
|
4736
5012
|
}
|
|
4737
|
-
function
|
|
5013
|
+
function Mn({ span: e, serviceColor: t, traceDurationNs: n, renderTooltip: r, children: i }) {
|
|
4738
5014
|
return /* @__PURE__ */ G(P, {
|
|
4739
5015
|
openDelay: 250,
|
|
4740
5016
|
closeDelay: 0,
|
|
@@ -4746,7 +5022,7 @@ function jn({ span: e, serviceColor: t, traceDurationNs: n, renderTooltip: r, ch
|
|
|
4746
5022
|
align: "start",
|
|
4747
5023
|
sideOffset: 4,
|
|
4748
5024
|
className: "w-56 p-0",
|
|
4749
|
-
children: r ? r(e) : /* @__PURE__ */ W(
|
|
5025
|
+
children: r ? r(e) : /* @__PURE__ */ W(jn, {
|
|
4750
5026
|
span: e,
|
|
4751
5027
|
serviceColor: t,
|
|
4752
5028
|
traceDurationNs: n
|
|
@@ -4754,7 +5030,7 @@ function jn({ span: e, serviceColor: t, traceDurationNs: n, renderTooltip: r, ch
|
|
|
4754
5030
|
})]
|
|
4755
5031
|
});
|
|
4756
5032
|
}
|
|
4757
|
-
function
|
|
5033
|
+
function Nn({ depth: e }) {
|
|
4758
5034
|
return e === 0 ? null : /* @__PURE__ */ W("span", {
|
|
4759
5035
|
className: "pointer-events-none relative shrink-0",
|
|
4760
5036
|
style: { width: e * Q },
|
|
@@ -4778,12 +5054,12 @@ function Mn({ depth: e }) {
|
|
|
4778
5054
|
})
|
|
4779
5055
|
});
|
|
4780
5056
|
}
|
|
4781
|
-
function
|
|
5057
|
+
function Pn(e) {
|
|
4782
5058
|
let t = /* @__PURE__ */ new Set(), n = new Set(e.map((e) => e.spanId));
|
|
4783
5059
|
for (let r of e) r.parentSpanId && n.has(r.parentSpanId) && t.add(r.parentSpanId);
|
|
4784
5060
|
return t;
|
|
4785
5061
|
}
|
|
4786
|
-
function
|
|
5062
|
+
function Fn(e, t) {
|
|
4787
5063
|
if (t.size === 0) return e;
|
|
4788
5064
|
let n = /* @__PURE__ */ new Set();
|
|
4789
5065
|
for (let r = 0; r < e.length; r++) {
|
|
@@ -4795,7 +5071,7 @@ function Pn(e, t) {
|
|
|
4795
5071
|
}
|
|
4796
5072
|
return e.filter((e) => !n.has(e.spanId));
|
|
4797
5073
|
}
|
|
4798
|
-
function
|
|
5074
|
+
function In(e) {
|
|
4799
5075
|
let t = /* @__PURE__ */ new Map(), n = [];
|
|
4800
5076
|
for (let r = e.length - 1; r >= 0; r--) {
|
|
4801
5077
|
let i = e[r].depth;
|
|
@@ -4805,11 +5081,11 @@ function Fn(e) {
|
|
|
4805
5081
|
}
|
|
4806
5082
|
return t;
|
|
4807
5083
|
}
|
|
4808
|
-
function
|
|
4809
|
-
let { x: h, width: g } =
|
|
5084
|
+
function Ln({ span: t, traceDurationNs: n, labelWidth: r, usableWidth: i, serviceColor: a, selected: o, hasChildren: s, collapsed: c, collapsedCount: l, onSelect: u, onToggle: d, onHover: f, onLeave: p, renderTooltip: m }) {
|
|
5085
|
+
let { x: h, width: g } = un(t.startOffsetNs, t.durationNs, n, i), _ = t.status === "error" ? Dn.error : a, v = cn(t.durationNs), y = g >= 56, b = !y;
|
|
4810
5086
|
return /* @__PURE__ */ G("div", {
|
|
4811
5087
|
className: e("group flex w-full cursor-pointer transition-colors", o ? "bg-accent/50" : "hover:bg-muted/30"),
|
|
4812
|
-
style: { height:
|
|
5088
|
+
style: { height: vn },
|
|
4813
5089
|
onClick: () => u?.(t),
|
|
4814
5090
|
onKeyDown: (e) => {
|
|
4815
5091
|
e.key === "Enter" || e.key === " " ? (e.preventDefault(), u?.(t)) : (e.key === "ArrowRight" && s && c || e.key === "ArrowLeft" && s && !c) && (e.preventDefault(), d?.(t.spanId));
|
|
@@ -4824,7 +5100,7 @@ function In({ span: t, traceDurationNs: n, labelWidth: r, usableWidth: i, servic
|
|
|
4824
5100
|
className: e("w-[3px] shrink-0 transition-colors", o ? "bg-primary" : "bg-transparent"),
|
|
4825
5101
|
"aria-hidden": "true"
|
|
4826
5102
|
}),
|
|
4827
|
-
/* @__PURE__ */ W(
|
|
5103
|
+
/* @__PURE__ */ W(Mn, {
|
|
4828
5104
|
span: t,
|
|
4829
5105
|
serviceColor: a,
|
|
4830
5106
|
traceDurationNs: n,
|
|
@@ -4833,7 +5109,7 @@ function In({ span: t, traceDurationNs: n, labelWidth: r, usableWidth: i, servic
|
|
|
4833
5109
|
className: "flex shrink-0 items-center gap-1 overflow-hidden border-r border-border/30 px-1.5",
|
|
4834
5110
|
style: { width: r },
|
|
4835
5111
|
children: [
|
|
4836
|
-
/* @__PURE__ */ W(
|
|
5112
|
+
/* @__PURE__ */ W(Nn, { depth: t.depth }),
|
|
4837
5113
|
s ? /* @__PURE__ */ W("button", {
|
|
4838
5114
|
type: "button",
|
|
4839
5115
|
tabIndex: -1,
|
|
@@ -4874,7 +5150,7 @@ function In({ span: t, traceDurationNs: n, labelWidth: r, usableWidth: i, servic
|
|
|
4874
5150
|
className: "relative flex-1 overflow-hidden",
|
|
4875
5151
|
style: {
|
|
4876
5152
|
paddingLeft: $,
|
|
4877
|
-
paddingRight:
|
|
5153
|
+
paddingRight: xn
|
|
4878
5154
|
},
|
|
4879
5155
|
"aria-label": `${t.name}: ${v}`,
|
|
4880
5156
|
children: [
|
|
@@ -4883,8 +5159,8 @@ function In({ span: t, traceDurationNs: n, labelWidth: r, usableWidth: i, servic
|
|
|
4883
5159
|
style: {
|
|
4884
5160
|
left: $ + h,
|
|
4885
5161
|
width: Math.max(g, 3),
|
|
4886
|
-
height:
|
|
4887
|
-
borderRadius:
|
|
5162
|
+
height: yn,
|
|
5163
|
+
borderRadius: bn
|
|
4888
5164
|
}
|
|
4889
5165
|
}),
|
|
4890
5166
|
y && /* @__PURE__ */ W("span", {
|
|
@@ -4905,14 +5181,14 @@ function In({ span: t, traceDurationNs: n, labelWidth: r, usableWidth: i, servic
|
|
|
4905
5181
|
]
|
|
4906
5182
|
});
|
|
4907
5183
|
}
|
|
4908
|
-
function
|
|
4909
|
-
let s =
|
|
5184
|
+
function Rn({ traceDurationNs: e, labelWidth: t, usableWidth: n, hasCollapsible: r, isAllCollapsed: i, onExpandAll: a, onCollapseAll: o }) {
|
|
5185
|
+
let s = hn(e, mn(n)), c = K().domain([0, e]).range([0, n]);
|
|
4910
5186
|
return /* @__PURE__ */ G("div", {
|
|
4911
5187
|
className: "flex shrink-0 items-end border-b border-border bg-muted/30",
|
|
4912
|
-
style: { height:
|
|
5188
|
+
style: { height: Sn },
|
|
4913
5189
|
children: [/* @__PURE__ */ G("div", {
|
|
4914
5190
|
className: "flex shrink-0 items-center justify-between border-r border-border/30 px-3 pb-2",
|
|
4915
|
-
style: { width: t +
|
|
5191
|
+
style: { width: t + Cn },
|
|
4916
5192
|
children: [/* @__PURE__ */ W("span", {
|
|
4917
5193
|
className: "truncate text-[11px] font-semibold tracking-wider text-muted-foreground uppercase",
|
|
4918
5194
|
children: "Service & Operation"
|
|
@@ -4927,7 +5203,7 @@ function Ln({ traceDurationNs: e, labelWidth: t, usableWidth: n, hasCollapsible:
|
|
|
4927
5203
|
className: "relative flex-1 pb-2",
|
|
4928
5204
|
style: {
|
|
4929
5205
|
paddingLeft: $,
|
|
4930
|
-
paddingRight:
|
|
5206
|
+
paddingRight: xn
|
|
4931
5207
|
},
|
|
4932
5208
|
children: s.map((e, t) => {
|
|
4933
5209
|
let n = t === 0, r = t === s.length - 1;
|
|
@@ -4937,18 +5213,18 @@ function Ln({ traceDurationNs: e, labelWidth: t, usableWidth: n, hasCollapsible:
|
|
|
4937
5213
|
left: $ + c(e),
|
|
4938
5214
|
transform: n ? "none" : r ? "translateX(-100%)" : "translateX(-50%)"
|
|
4939
5215
|
},
|
|
4940
|
-
children:
|
|
5216
|
+
children: cn(e)
|
|
4941
5217
|
}, e);
|
|
4942
5218
|
})
|
|
4943
5219
|
})]
|
|
4944
5220
|
});
|
|
4945
5221
|
}
|
|
4946
|
-
function
|
|
4947
|
-
let i =
|
|
5222
|
+
function zn({ traceDurationNs: e, labelWidth: t, usableWidth: n, rowCount: r }) {
|
|
5223
|
+
let i = hn(e, mn(n)), a = K().domain([0, e]).range([0, n]), o = r * vn;
|
|
4948
5224
|
return /* @__PURE__ */ W("svg", {
|
|
4949
5225
|
className: "pointer-events-none absolute top-0",
|
|
4950
5226
|
style: {
|
|
4951
|
-
left: t +
|
|
5227
|
+
left: t + Cn + $,
|
|
4952
5228
|
width: n,
|
|
4953
5229
|
height: o
|
|
4954
5230
|
},
|
|
@@ -4964,7 +5240,7 @@ function Rn({ traceDurationNs: e, labelWidth: t, usableWidth: n, rowCount: r })
|
|
|
4964
5240
|
}, e))
|
|
4965
5241
|
});
|
|
4966
5242
|
}
|
|
4967
|
-
var
|
|
5243
|
+
var Bn = [
|
|
4968
5244
|
{
|
|
4969
5245
|
indent: 0,
|
|
4970
5246
|
labelPct: 60,
|
|
@@ -4996,7 +5272,7 @@ var zn = [
|
|
|
4996
5272
|
barPct: 65
|
|
4997
5273
|
}
|
|
4998
5274
|
];
|
|
4999
|
-
function
|
|
5275
|
+
function Vn({ ariaLabel: t, className: n, ...r }) {
|
|
5000
5276
|
return /* @__PURE__ */ G("div", {
|
|
5001
5277
|
role: "img",
|
|
5002
5278
|
"aria-busy": "true",
|
|
@@ -5005,13 +5281,13 @@ function Bn({ ariaLabel: t, className: n, ...r }) {
|
|
|
5005
5281
|
...r,
|
|
5006
5282
|
children: [/* @__PURE__ */ W("div", {
|
|
5007
5283
|
className: "flex shrink-0 items-center border-b border-border bg-muted/30 px-3",
|
|
5008
|
-
style: { height:
|
|
5284
|
+
style: { height: Sn },
|
|
5009
5285
|
children: /* @__PURE__ */ W(_, { className: "h-3 w-1/3 max-w-32" })
|
|
5010
5286
|
}), /* @__PURE__ */ W("div", {
|
|
5011
5287
|
className: "flex-1",
|
|
5012
|
-
children:
|
|
5288
|
+
children: Bn.map((e, t) => /* @__PURE__ */ G("div", {
|
|
5013
5289
|
className: "flex items-center gap-2 px-2",
|
|
5014
|
-
style: { height:
|
|
5290
|
+
style: { height: vn },
|
|
5015
5291
|
children: [/* @__PURE__ */ G("div", {
|
|
5016
5292
|
className: "flex shrink-0 items-center gap-1.5",
|
|
5017
5293
|
style: { paddingLeft: e.indent * 12 },
|
|
@@ -5029,7 +5305,7 @@ function Bn({ ariaLabel: t, className: n, ...r }) {
|
|
|
5029
5305
|
className: "rounded-sm",
|
|
5030
5306
|
style: {
|
|
5031
5307
|
width: `${e.barPct}%`,
|
|
5032
|
-
height:
|
|
5308
|
+
height: yn
|
|
5033
5309
|
}
|
|
5034
5310
|
})
|
|
5035
5311
|
})]
|
|
@@ -5037,14 +5313,14 @@ function Bn({ ariaLabel: t, className: n, ...r }) {
|
|
|
5037
5313
|
})]
|
|
5038
5314
|
});
|
|
5039
5315
|
}
|
|
5040
|
-
function
|
|
5316
|
+
function Hn({ spans: t, state: n, selectedSpanId: r, onSpanSelect: i, onSpanHover: a, onSpanLeave: o, defaultCollapsed: s = !1, renderTooltip: c, ariaLabel: l = "Trace waterfall timeline", className: u, ...d }) {
|
|
5041
5317
|
let f = h(n, t.length), [p, m] = R.useState({
|
|
5042
|
-
labelWidth:
|
|
5318
|
+
labelWidth: gn,
|
|
5043
5319
|
timelineWidth: 0
|
|
5044
|
-
}), g = R.useRef(null), _ = R.useMemo(() =>
|
|
5320
|
+
}), g = R.useRef(null), _ = R.useMemo(() => Pn(t), [t]), [y, b] = R.useState(() => s ? new Set(Pn(t)) : /* @__PURE__ */ new Set()), x = R.useCallback((e) => {
|
|
5045
5321
|
if (g.current &&= (g.current.disconnect(), null), e) {
|
|
5046
5322
|
let t = new ResizeObserver(([e]) => {
|
|
5047
|
-
let t = Math.round(e.contentRect.width), n = Math.min(
|
|
5323
|
+
let t = Math.round(e.contentRect.width), n = Math.min(gn, Math.round(t * _n)), r = t - n - Cn - $ - xn;
|
|
5048
5324
|
m({
|
|
5049
5325
|
labelWidth: n,
|
|
5050
5326
|
timelineWidth: Math.max(r, 0)
|
|
@@ -5052,13 +5328,13 @@ function Vn({ spans: t, state: n, selectedSpanId: r, onSpanSelect: i, onSpanHove
|
|
|
5052
5328
|
});
|
|
5053
5329
|
t.observe(e), g.current = t;
|
|
5054
5330
|
}
|
|
5055
|
-
}, []), S = R.useMemo(() =>
|
|
5331
|
+
}, []), S = R.useMemo(() => ln(t), [t]), C = R.useMemo(() => En(t), [t]), w = R.useMemo(() => In(t), [t]), T = R.useMemo(() => Fn(t, y), [t, y]), E = R.useCallback((e) => {
|
|
5056
5332
|
b((t) => {
|
|
5057
5333
|
let n = new Set(t);
|
|
5058
5334
|
return n.has(e) ? n.delete(e) : n.add(e), n;
|
|
5059
5335
|
});
|
|
5060
5336
|
}, []), D = R.useCallback(() => b(/* @__PURE__ */ new Set()), []), O = R.useCallback(() => b(new Set(_)), [_]), k = y.size > 0;
|
|
5061
|
-
return f === "loading" ? /* @__PURE__ */ W(
|
|
5337
|
+
return f === "loading" ? /* @__PURE__ */ W(Vn, {
|
|
5062
5338
|
ariaLabel: l,
|
|
5063
5339
|
className: u,
|
|
5064
5340
|
...d
|
|
@@ -5072,7 +5348,7 @@ function Vn({ spans: t, state: n, selectedSpanId: r, onSpanSelect: i, onSpanHove
|
|
|
5072
5348
|
role: "treegrid",
|
|
5073
5349
|
"aria-label": l,
|
|
5074
5350
|
...d,
|
|
5075
|
-
children: [/* @__PURE__ */ W(
|
|
5351
|
+
children: [/* @__PURE__ */ W(Rn, {
|
|
5076
5352
|
traceDurationNs: S,
|
|
5077
5353
|
labelWidth: p.labelWidth,
|
|
5078
5354
|
usableWidth: p.timelineWidth,
|
|
@@ -5084,17 +5360,17 @@ function Vn({ spans: t, state: n, selectedSpanId: r, onSpanSelect: i, onSpanHove
|
|
|
5084
5360
|
className: "min-h-0 flex-1",
|
|
5085
5361
|
children: /* @__PURE__ */ G("div", {
|
|
5086
5362
|
className: "relative",
|
|
5087
|
-
children: [/* @__PURE__ */ W(
|
|
5363
|
+
children: [/* @__PURE__ */ W(zn, {
|
|
5088
5364
|
traceDurationNs: S,
|
|
5089
5365
|
labelWidth: p.labelWidth,
|
|
5090
5366
|
usableWidth: p.timelineWidth,
|
|
5091
5367
|
rowCount: T.length
|
|
5092
|
-
}), T.map((e) => /* @__PURE__ */ W(
|
|
5368
|
+
}), T.map((e) => /* @__PURE__ */ W(Ln, {
|
|
5093
5369
|
span: e,
|
|
5094
5370
|
traceDurationNs: S,
|
|
5095
5371
|
labelWidth: p.labelWidth,
|
|
5096
5372
|
usableWidth: p.timelineWidth,
|
|
5097
|
-
serviceColor: C.get(e.serviceName) ??
|
|
5373
|
+
serviceColor: C.get(e.serviceName) ?? Tn[0],
|
|
5098
5374
|
selected: e.spanId === r,
|
|
5099
5375
|
hasChildren: _.has(e.spanId),
|
|
5100
5376
|
collapsed: y.has(e.spanId),
|
|
@@ -5110,4 +5386,4 @@ function Vn({ spans: t, state: n, selectedSpanId: r, onSpanSelect: i, onSpanHove
|
|
|
5110
5386
|
});
|
|
5111
5387
|
}
|
|
5112
5388
|
//#endregion
|
|
5113
|
-
export {
|
|
5389
|
+
export { sn as AreaChart, Me as AreaSeries, Fe as BarChart, Ae as BarSeries, a as CHART_THEMES, m as CartesianChart, g as CategoryAxis, g as XAxis, he as ChartCard, E as ChartContainer, Te as ChartLegend, we as ChartLegendContent, i as ChartStyle, Se as ChartTooltip, xe as ChartTooltipContent, r as DEFAULT_MARGIN, Be as DoughnutChart, o as Grid, on as LineChart, Oe as LineSeries, Wt as Metric, an as MetricGroup, f as ReferenceLine, Hn as TraceWaterfall, p as ValueAxis, p as YAxis, hn as buildTimeAxisTicks, e as cn, n as compactTick, un as computeBarGeometry, ln as computeTraceDurationNs, cn as formatDurationNs, dn as formatTracePercent, Pt as resolveSentiment, t as useChartConfig };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gravitee/graphene-charts",
|
|
3
|
-
"version": "2.47.0-fix-384-command-scroll.
|
|
3
|
+
"version": "2.47.0-fix-384-command-scroll.5b18a0f",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Theme-compliant data visualization components for the Graphene design system. Built on D3, styled with Tailwind, and designed to inherit the Graphene token system out of the box.",
|
|
6
6
|
"keywords": [
|
|
@@ -64,7 +64,7 @@
|
|
|
64
64
|
"d3-shape": "3.2.0"
|
|
65
65
|
},
|
|
66
66
|
"peerDependencies": {
|
|
67
|
-
"@gravitee/graphene-core": "2.47.0-fix-384-command-scroll.
|
|
67
|
+
"@gravitee/graphene-core": "2.47.0-fix-384-command-scroll.5b18a0f",
|
|
68
68
|
"@xyflow/react": "^12.0.0",
|
|
69
69
|
"react": "^19.0.0",
|
|
70
70
|
"react-dom": "^19.0.0",
|