@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.
Files changed (2) hide show
  1. package/dist/index.js +409 -133
  2. 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
- St.displayName = "GioEventApiManagementIcon";
2386
- var Ct = V((e, t) => {
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
- Ct.displayName = "GioGammaIcon";
2628
- var wt = V((e, t) => {
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
- wt.displayName = "GioHomeIcon";
2870
- var Tt = V((e, t) => {
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
- Tt.displayName = "GioIamIcon";
3166
- var Et = V((e, t) => {
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
- Et.displayName = "GioObservabilityIcon";
3392
- var Dt = V((e, t) => {
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
- Dt.displayName = "GioObserveIcon";
3512
- var Ot = V((e, t) => {
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
- Ot.displayName = "GioPlatformIcon";
3844
- var kt = V((e, t) => {
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
- kt.displayName = "GioProductizeIcon";
3964
- var At = V((e, t) => {
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
- At.displayName = "GioSecureIcon";
4367
+ jt.displayName = "GioSecureIcon";
4092
4368
  //#endregion
4093
4369
  //#region src/lib/useContainerSize.ts
4094
- function jt() {
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 Mt = {
4395
+ var Nt = {
4120
4396
  positive: "text-success",
4121
4397
  negative: "text-destructive",
4122
4398
  neutral: "text-muted-foreground"
4123
4399
  };
4124
- function Nt(e, t) {
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 Pt = 56;
4128
- function Ft(e, t) {
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 It(e) {
4408
+ function Lt(e) {
4133
4409
  return Math.max(10, Math.round(e * .22));
4134
4410
  }
4135
- function Lt(e) {
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 Rt(e) {
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 zt(e) {
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 Bt({ data: t, color: n, colorClass: r }) {
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 Vt({ trend: t, sentiment: n, trendClass: r }) {
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, Mt[n]),
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 Ht({ className: t, ...n }) {
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 Ut({ 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 }) {
4235
- let { ref: p, width: m, height: h } = jt();
4236
- if (r === "loading") return /* @__PURE__ */ W(Ht, {
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 = _ ? Nt(_.direction, s) : void 0, b = !u && y ? Mt[y] : void 0, x = u ?? (y ? void 0 : "var(--chart-1)"), S = v != null && v.length >= 2 && h >= Pt && !c, C = c || !S, w = Lt(h), T = Rt(h), E = zt(h), D = n && h > 50, O = !!(_ && y && (S || h > 40));
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 = Ft(m, h), r = It(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(Vt, {
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(Vt, {
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(Bt, {
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 Wt = {
4591
+ var Gt = {
4316
4592
  positive: "text-success",
4317
4593
  negative: "text-destructive",
4318
4594
  neutral: "text-muted-foreground"
4319
4595
  };
4320
- function Gt(e) {
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 Kt(e) {
4601
+ function qt(e) {
4326
4602
  return X(e) ? e.metrics.length : 1;
4327
4603
  }
4328
- var qt = [
4604
+ var Jt = [
4329
4605
  "xs",
4330
4606
  "sm",
4331
4607
  "md",
4332
4608
  "lg"
4333
4609
  ];
4334
- function Jt(e, t, n) {
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 qt[Math.min(qt.indexOf(i), qt.indexOf(a))];
4612
+ return Jt[Math.min(Jt.indexOf(i), Jt.indexOf(a))];
4337
4613
  }
4338
- var Yt = {
4614
+ var Xt = {
4339
4615
  xs: 40,
4340
4616
  sm: 55,
4341
4617
  md: 75,
4342
4618
  lg: 100
4343
- }, Xt = 40, Zt = 80;
4344
- function Qt(e, t, n) {
4345
- if (e < Zt) return 0;
4346
- let r = Yt[n], i = 0, a = 0;
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 * Kt(t[n]), s = t.length - (n + 1) > 0 ? Xt : 0;
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 $t({ trend: t, sentiment: n, size: r }) {
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], Wt[n]),
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 en({ item: t, size: n, labelVisible: r }) {
4400
- let i = t.trend ? Nt(t.trend.direction, t.trendSentiment ?? "higher-is-better") : void 0, a = r && t.label, o = /* @__PURE__ */ G("div", {
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($t, {
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 tn({ count: t, size: n }) {
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 nn({ count: t, className: n, ...r }) {
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 rn({ items: t, state: n, skeletonCount: r, className: i, ...a }) {
4457
- let { ref: o, width: s, height: c } = jt();
4458
- if (n === "loading") return /* @__PURE__ */ W(nn, {
4459
- count: t.length > 0 ? Gt(t) : r ?? 5,
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 = Gt(l), d = s > 0 ? Jt(s, c, u) : "md", f = c >= 50, p = s > 0 ? Qt(s, l, d) : l.length, m = l.slice(0, p), h = l.length - p, g = p === 0;
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: Kt(t) },
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(en, {
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(en, {
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(tn, {
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 an({ 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 }) {
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 on({ 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 }) {
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 sn(e) {
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 cn(e) {
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 ln(e, t, n, r) {
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 un(e, t) {
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 dn = 6, fn = 80;
4623
- function pn(e) {
4898
+ var fn = 6, pn = 80;
4899
+ function mn(e) {
4624
4900
  if (e <= 0) return 0;
4625
- let t = Math.floor(e / fn) + 1;
4626
- return Math.max(2, Math.min(t, dn));
4901
+ let t = Math.floor(e / pn) + 1;
4902
+ return Math.max(2, Math.min(t, fn));
4627
4903
  }
4628
- function mn(e, t = 5) {
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 hn = 280, gn = .45, _n = 36, Q = 20, vn = 20, yn = 4, $ = 12, bn = 48, xn = 32, Sn = 3, Cn = {
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
- }, wn = [
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 Tn(e) {
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, wn[n % wn.length]), n++);
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 En = { error: "bg-destructive" }, Dn = {
4933
+ var Dn = { error: "bg-destructive" }, On = {
4658
4934
  ok: "success",
4659
4935
  error: "destructive",
4660
4936
  unset: "secondary"
4661
- }, On = {
4937
+ }, kn = {
4662
4938
  ok: "OK",
4663
4939
  error: "Error",
4664
4940
  unset: "Unset"
4665
4941
  };
4666
- function kn({ icon: e, label: t, children: n }) {
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 An({ span: t, serviceColor: n, traceDurationNs: r }) {
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: Dn[t.status],
4967
+ variant: On[t.status],
4692
4968
  className: "h-4 text-[9px]",
4693
- children: On[t.status]
4969
+ children: kn[t.status]
4694
4970
  }), /* @__PURE__ */ W(O, {
4695
4971
  variant: "outline",
4696
4972
  className: "h-4 text-[9px]",
4697
- children: Cn[t.kind]
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(kn, {
4981
+ /* @__PURE__ */ W(An, {
4706
4982
  icon: rt,
4707
4983
  label: "Service",
4708
4984
  children: t.serviceName
4709
4985
  }),
4710
- /* @__PURE__ */ W(kn, {
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: sn(t.durationNs)
4991
+ children: cn(t.durationNs)
4716
4992
  })
4717
4993
  }),
4718
- /* @__PURE__ */ W(kn, {
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: un(t.durationNs, r)
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 jn({ span: e, serviceColor: t, traceDurationNs: n, renderTooltip: r, children: i }) {
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(An, {
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 Mn({ depth: e }) {
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 Nn(e) {
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 Pn(e, t) {
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 Fn(e) {
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 In({ 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 }) {
4809
- let { x: h, width: g } = ln(t.startOffsetNs, t.durationNs, n, i), _ = t.status === "error" ? En.error : a, v = sn(t.durationNs), y = g >= 56, b = !y;
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: _n },
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(jn, {
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(Mn, { depth: t.depth }),
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: bn
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: vn,
4887
- borderRadius: yn
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 Ln({ traceDurationNs: e, labelWidth: t, usableWidth: n, hasCollapsible: r, isAllCollapsed: i, onExpandAll: a, onCollapseAll: o }) {
4909
- let s = mn(e, pn(n)), c = K().domain([0, e]).range([0, n]);
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: xn },
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 + Sn },
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: bn
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: sn(e)
5216
+ children: cn(e)
4941
5217
  }, e);
4942
5218
  })
4943
5219
  })]
4944
5220
  });
4945
5221
  }
4946
- function Rn({ traceDurationNs: e, labelWidth: t, usableWidth: n, rowCount: r }) {
4947
- let i = mn(e, pn(n)), a = K().domain([0, e]).range([0, n]), o = r * _n;
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 + Sn + $,
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 zn = [
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 Bn({ ariaLabel: t, className: n, ...r }) {
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: xn },
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: zn.map((e, t) => /* @__PURE__ */ G("div", {
5288
+ children: Bn.map((e, t) => /* @__PURE__ */ G("div", {
5013
5289
  className: "flex items-center gap-2 px-2",
5014
- style: { height: _n },
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: vn
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 Vn({ 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 }) {
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: hn,
5318
+ labelWidth: gn,
5043
5319
  timelineWidth: 0
5044
- }), g = R.useRef(null), _ = R.useMemo(() => Nn(t), [t]), [y, b] = R.useState(() => s ? new Set(Nn(t)) : /* @__PURE__ */ new Set()), x = R.useCallback((e) => {
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(hn, Math.round(t * gn)), r = t - n - Sn - $ - bn;
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(() => cn(t), [t]), C = R.useMemo(() => Tn(t), [t]), w = R.useMemo(() => Fn(t), [t]), T = R.useMemo(() => Pn(t, y), [t, y]), E = R.useCallback((e) => {
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(Bn, {
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(Ln, {
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(Rn, {
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(In, {
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) ?? wn[0],
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 { on 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, an as LineChart, Oe as LineSeries, Ut as Metric, rn as MetricGroup, f as ReferenceLine, Vn as TraceWaterfall, p as ValueAxis, p as YAxis, mn as buildTimeAxisTicks, e as cn, n as compactTick, ln as computeBarGeometry, cn as computeTraceDurationNs, sn as formatDurationNs, un as formatTracePercent, Nt as resolveSentiment, t as useChartConfig };
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.95d7e4a",
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.95d7e4a",
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",