@optifye/dashboard-core 6.10.44 → 6.10.45

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -30328,13 +30328,37 @@ var HourlyOutputChartComponent = ({
30328
30328
  }, []);
30329
30329
  const xAxisConfig = React26__namespace.default.useMemo(() => {
30330
30330
  if (containerWidth >= 960) {
30331
- return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12 };
30331
+ return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12, labelMode: "full" };
30332
30332
  }
30333
30333
  if (containerWidth >= 760) {
30334
- return { interval: 1, angle: -35, height: 76, tickFont: 9, tickMargin: 8 };
30334
+ return { interval: 0, angle: -35, height: 76, tickFont: 9, tickMargin: 8, labelMode: "compact" };
30335
30335
  }
30336
- return { interval: 2, angle: -30, height: 64, tickFont: 9, tickMargin: 6 };
30336
+ return { interval: 0, angle: -30, height: 64, tickFont: 9, tickMargin: 6, labelMode: "start" };
30337
30337
  }, [containerWidth]);
30338
+ const formatXAxisTick = React26__namespace.default.useCallback((raw) => {
30339
+ const label = typeof raw === "string" ? raw : String(raw);
30340
+ if (xAxisConfig.labelMode === "full") return label;
30341
+ const parts = label.split("-");
30342
+ if (parts.length !== 2) return label;
30343
+ const parsePart = (part) => {
30344
+ const match = part.match(/^(\d{1,2})(?::(\d{2}))?(AM|PM)$/);
30345
+ if (!match) return null;
30346
+ const [, hh, mm, meridiem] = match;
30347
+ const time2 = mm ? `${hh}:${mm}` : hh;
30348
+ const merShort = meridiem === "AM" ? "A" : "P";
30349
+ return { time: time2, meridiem, merShort };
30350
+ };
30351
+ const start = parsePart(parts[0]);
30352
+ const end = parsePart(parts[1]);
30353
+ if (!start || !end) return label;
30354
+ if (xAxisConfig.labelMode === "start") {
30355
+ return `${start.time}${start.merShort}`;
30356
+ }
30357
+ if (start.meridiem === end.meridiem) {
30358
+ return `${start.time}-${end.time}${end.merShort}`;
30359
+ }
30360
+ return `${start.time}${start.merShort}-${end.time}${end.merShort}`;
30361
+ }, [xAxisConfig.labelMode]);
30338
30362
  const formatHour = React26__namespace.default.useCallback((hourIndex) => {
30339
30363
  const isLastHour = hourIndex === SHIFT_DURATION - 1;
30340
30364
  const startDecimalHour = shiftStartTime.decimalHour + hourIndex;
@@ -30558,7 +30582,8 @@ var HourlyOutputChartComponent = ({
30558
30582
  angle: xAxisConfig.angle,
30559
30583
  textAnchor: "end",
30560
30584
  tickMargin: xAxisConfig.tickMargin,
30561
- height: xAxisConfig.height
30585
+ height: xAxisConfig.height,
30586
+ tickFormatter: formatXAxisTick
30562
30587
  }
30563
30588
  ),
30564
30589
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -32567,13 +32592,37 @@ var HourlyUptimeChartComponent = ({
32567
32592
  }, []);
32568
32593
  const xAxisConfig = React26__namespace.default.useMemo(() => {
32569
32594
  if (containerWidth >= 960) {
32570
- return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12 };
32595
+ return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12, labelMode: "full" };
32571
32596
  }
32572
32597
  if (containerWidth >= 760) {
32573
- return { interval: 1, angle: -35, height: 76, tickFont: 9, tickMargin: 8 };
32598
+ return { interval: 0, angle: -35, height: 76, tickFont: 9, tickMargin: 8, labelMode: "compact" };
32574
32599
  }
32575
- return { interval: 2, angle: -30, height: 64, tickFont: 9, tickMargin: 6 };
32600
+ return { interval: 0, angle: -30, height: 64, tickFont: 9, tickMargin: 6, labelMode: "start" };
32576
32601
  }, [containerWidth]);
32602
+ const formatXAxisTick = React26__namespace.default.useCallback((raw) => {
32603
+ const label = typeof raw === "string" ? raw : String(raw);
32604
+ if (xAxisConfig.labelMode === "full") return label;
32605
+ const parts = label.split("-");
32606
+ if (parts.length !== 2) return label;
32607
+ const parsePart = (part) => {
32608
+ const match = part.match(/^(\d{1,2})(?::(\d{2}))?(AM|PM)$/);
32609
+ if (!match) return null;
32610
+ const [, hh, mm, meridiem] = match;
32611
+ const time2 = mm ? `${hh}:${mm}` : hh;
32612
+ const merShort = meridiem === "AM" ? "A" : "P";
32613
+ return { time: time2, meridiem, merShort };
32614
+ };
32615
+ const start = parsePart(parts[0]);
32616
+ const end = parsePart(parts[1]);
32617
+ if (!start || !end) return label;
32618
+ if (xAxisConfig.labelMode === "start") {
32619
+ return `${start.time}${start.merShort}`;
32620
+ }
32621
+ if (start.meridiem === end.meridiem) {
32622
+ return `${start.time}-${end.time}${end.merShort}`;
32623
+ }
32624
+ return `${start.time}${start.merShort}-${end.time}${end.merShort}`;
32625
+ }, [xAxisConfig.labelMode]);
32577
32626
  if (!hasAggregateData && !uptimeSeries.hasData) {
32578
32627
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `w-full h-full flex items-center justify-center text-sm text-gray-500 ${className}`, children: "No uptime data available." });
32579
32628
  }
@@ -32611,7 +32660,8 @@ var HourlyUptimeChartComponent = ({
32611
32660
  angle: xAxisConfig.angle,
32612
32661
  textAnchor: "end",
32613
32662
  tickMargin: xAxisConfig.tickMargin,
32614
- height: xAxisConfig.height
32663
+ height: xAxisConfig.height,
32664
+ tickFormatter: formatXAxisTick
32615
32665
  }
32616
32666
  ),
32617
32667
  /* @__PURE__ */ jsxRuntime.jsx(
package/dist/index.mjs CHANGED
@@ -30299,13 +30299,37 @@ var HourlyOutputChartComponent = ({
30299
30299
  }, []);
30300
30300
  const xAxisConfig = React26__default.useMemo(() => {
30301
30301
  if (containerWidth >= 960) {
30302
- return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12 };
30302
+ return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12, labelMode: "full" };
30303
30303
  }
30304
30304
  if (containerWidth >= 760) {
30305
- return { interval: 1, angle: -35, height: 76, tickFont: 9, tickMargin: 8 };
30305
+ return { interval: 0, angle: -35, height: 76, tickFont: 9, tickMargin: 8, labelMode: "compact" };
30306
30306
  }
30307
- return { interval: 2, angle: -30, height: 64, tickFont: 9, tickMargin: 6 };
30307
+ return { interval: 0, angle: -30, height: 64, tickFont: 9, tickMargin: 6, labelMode: "start" };
30308
30308
  }, [containerWidth]);
30309
+ const formatXAxisTick = React26__default.useCallback((raw) => {
30310
+ const label = typeof raw === "string" ? raw : String(raw);
30311
+ if (xAxisConfig.labelMode === "full") return label;
30312
+ const parts = label.split("-");
30313
+ if (parts.length !== 2) return label;
30314
+ const parsePart = (part) => {
30315
+ const match = part.match(/^(\d{1,2})(?::(\d{2}))?(AM|PM)$/);
30316
+ if (!match) return null;
30317
+ const [, hh, mm, meridiem] = match;
30318
+ const time2 = mm ? `${hh}:${mm}` : hh;
30319
+ const merShort = meridiem === "AM" ? "A" : "P";
30320
+ return { time: time2, meridiem, merShort };
30321
+ };
30322
+ const start = parsePart(parts[0]);
30323
+ const end = parsePart(parts[1]);
30324
+ if (!start || !end) return label;
30325
+ if (xAxisConfig.labelMode === "start") {
30326
+ return `${start.time}${start.merShort}`;
30327
+ }
30328
+ if (start.meridiem === end.meridiem) {
30329
+ return `${start.time}-${end.time}${end.merShort}`;
30330
+ }
30331
+ return `${start.time}${start.merShort}-${end.time}${end.merShort}`;
30332
+ }, [xAxisConfig.labelMode]);
30309
30333
  const formatHour = React26__default.useCallback((hourIndex) => {
30310
30334
  const isLastHour = hourIndex === SHIFT_DURATION - 1;
30311
30335
  const startDecimalHour = shiftStartTime.decimalHour + hourIndex;
@@ -30529,7 +30553,8 @@ var HourlyOutputChartComponent = ({
30529
30553
  angle: xAxisConfig.angle,
30530
30554
  textAnchor: "end",
30531
30555
  tickMargin: xAxisConfig.tickMargin,
30532
- height: xAxisConfig.height
30556
+ height: xAxisConfig.height,
30557
+ tickFormatter: formatXAxisTick
30533
30558
  }
30534
30559
  ),
30535
30560
  /* @__PURE__ */ jsx(
@@ -32538,13 +32563,37 @@ var HourlyUptimeChartComponent = ({
32538
32563
  }, []);
32539
32564
  const xAxisConfig = React26__default.useMemo(() => {
32540
32565
  if (containerWidth >= 960) {
32541
- return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12 };
32566
+ return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12, labelMode: "full" };
32542
32567
  }
32543
32568
  if (containerWidth >= 760) {
32544
- return { interval: 1, angle: -35, height: 76, tickFont: 9, tickMargin: 8 };
32569
+ return { interval: 0, angle: -35, height: 76, tickFont: 9, tickMargin: 8, labelMode: "compact" };
32545
32570
  }
32546
- return { interval: 2, angle: -30, height: 64, tickFont: 9, tickMargin: 6 };
32571
+ return { interval: 0, angle: -30, height: 64, tickFont: 9, tickMargin: 6, labelMode: "start" };
32547
32572
  }, [containerWidth]);
32573
+ const formatXAxisTick = React26__default.useCallback((raw) => {
32574
+ const label = typeof raw === "string" ? raw : String(raw);
32575
+ if (xAxisConfig.labelMode === "full") return label;
32576
+ const parts = label.split("-");
32577
+ if (parts.length !== 2) return label;
32578
+ const parsePart = (part) => {
32579
+ const match = part.match(/^(\d{1,2})(?::(\d{2}))?(AM|PM)$/);
32580
+ if (!match) return null;
32581
+ const [, hh, mm, meridiem] = match;
32582
+ const time2 = mm ? `${hh}:${mm}` : hh;
32583
+ const merShort = meridiem === "AM" ? "A" : "P";
32584
+ return { time: time2, meridiem, merShort };
32585
+ };
32586
+ const start = parsePart(parts[0]);
32587
+ const end = parsePart(parts[1]);
32588
+ if (!start || !end) return label;
32589
+ if (xAxisConfig.labelMode === "start") {
32590
+ return `${start.time}${start.merShort}`;
32591
+ }
32592
+ if (start.meridiem === end.meridiem) {
32593
+ return `${start.time}-${end.time}${end.merShort}`;
32594
+ }
32595
+ return `${start.time}${start.merShort}-${end.time}${end.merShort}`;
32596
+ }, [xAxisConfig.labelMode]);
32548
32597
  if (!hasAggregateData && !uptimeSeries.hasData) {
32549
32598
  return /* @__PURE__ */ jsx("div", { className: `w-full h-full flex items-center justify-center text-sm text-gray-500 ${className}`, children: "No uptime data available." });
32550
32599
  }
@@ -32582,7 +32631,8 @@ var HourlyUptimeChartComponent = ({
32582
32631
  angle: xAxisConfig.angle,
32583
32632
  textAnchor: "end",
32584
32633
  tickMargin: xAxisConfig.tickMargin,
32585
- height: xAxisConfig.height
32634
+ height: xAxisConfig.height,
32635
+ tickFormatter: formatXAxisTick
32586
32636
  }
32587
32637
  ),
32588
32638
  /* @__PURE__ */ jsx(
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@optifye/dashboard-core",
3
- "version": "6.10.44",
3
+ "version": "6.10.45",
4
4
  "description": "Reusable UI & logic for Optifye dashboard",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",