@ammarkhalidfarooq/dashboard-package 0.6.76 → 0.6.78

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.cjs.js CHANGED
@@ -399,6 +399,54 @@ var MetricSelector = function MetricSelector(_ref) {
399
399
  });
400
400
  };
401
401
 
402
+ var TREND_UP_COLOR = "#22C55E";
403
+ var TREND_DOWN_COLOR = "#EF4444";
404
+ function getTrendDirection(valueOrText) {
405
+ var text = String(valueOrText !== null && valueOrText !== void 0 ? valueOrText : "").trim();
406
+ if (text.includes("▼")) return "down";
407
+ if (text.includes("▲")) return "up";
408
+ var match = text.match(/-?\d+(\.\d+)?/);
409
+ if (!match) return "neutral";
410
+ var n = Number(match[0]);
411
+ if (n < 0) return "down";
412
+ if (n > 0) return "up";
413
+ return "neutral";
414
+ }
415
+ function getTrendColor(valueOrText) {
416
+ var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
417
+ _ref$up = _ref.up,
418
+ up = _ref$up === void 0 ? TREND_UP_COLOR : _ref$up,
419
+ _ref$down = _ref.down,
420
+ down = _ref$down === void 0 ? TREND_DOWN_COLOR : _ref$down,
421
+ _ref$neutral = _ref.neutral,
422
+ neutral = _ref$neutral === void 0 ? up : _ref$neutral;
423
+ var direction = getTrendDirection(valueOrText);
424
+ if (direction === "down") return down;
425
+ if (direction === "up") return up;
426
+ return neutral;
427
+ }
428
+ function getTrendArrow(valueOrText) {
429
+ var direction = getTrendDirection(valueOrText);
430
+ if (direction === "down") return "▼";
431
+ if (direction === "up") return "▲";
432
+ return "";
433
+ }
434
+ function formatCurrency(value) {
435
+ return "$".concat(Number(value !== null && value !== void 0 ? value : 0).toLocaleString("en-US"));
436
+ }
437
+ function formatNumber(num) {
438
+ if (num >= 1000000000) {
439
+ return (num / 1000000000).toFixed(1).replace(/\.0$/, "") + "B";
440
+ }
441
+ if (num >= 1000000) {
442
+ return (num / 1000000).toFixed(1).replace(/\.0$/, "") + "M";
443
+ }
444
+ if (num >= 1000) {
445
+ return (num / 1000).toFixed(1).replace(/\.0$/, "") + "K";
446
+ }
447
+ return (num !== null && num !== void 0 ? num : 0).toString();
448
+ }
449
+
402
450
  var RevenueChart = function RevenueChart(_ref) {
403
451
  var metric = _ref.metric,
404
452
  data = _ref.data,
@@ -414,9 +462,18 @@ var RevenueChart = function RevenueChart(_ref) {
414
462
  id = _ref$id === void 0 ? "revenue-chart" : _ref$id,
415
463
  colors = _ref.colors,
416
464
  _ref$showLegend = _ref.showLegend,
417
- showLegend = _ref$showLegend === void 0 ? true : _ref$showLegend;
465
+ showLegend = _ref$showLegend === void 0 ? true : _ref$showLegend,
466
+ _ref$isAmount = _ref.isAmount,
467
+ isAmount = _ref$isAmount === void 0 ? false : _ref$isAmount;
418
468
  var theme = styles.useTheme();
419
469
  var isRadial = type === 'donut' || type === 'pie';
470
+ var isCurrency = isAmount || (metric === null || metric === void 0 ? void 0 : metric.toLowerCase()) === 'revenue';
471
+ var isPercent = (metric === null || metric === void 0 ? void 0 : metric.toLowerCase()) === 'percent';
472
+ var formatValue = function formatValue(value) {
473
+ if (isCurrency) return formatCurrency(value);
474
+ if (isPercent) return "".concat(Number(value !== null && value !== void 0 ? value : 0).toLocaleString('en-US'), "%");
475
+ return Number(value !== null && value !== void 0 ? value : 0).toLocaleString('en-US');
476
+ };
420
477
 
421
478
  // Base options common to all charts
422
479
  var baseOptions = {
@@ -438,7 +495,7 @@ var RevenueChart = function RevenueChart(_ref) {
438
495
  theme: 'light',
439
496
  y: {
440
497
  formatter: function formatter(value) {
441
- return (metric === null || metric === void 0 ? void 0 : metric.toLowerCase()) === 'revenue' ? "$".concat((value || 0).toLocaleString()) : value || 0;
498
+ return formatValue(value);
442
499
  }
443
500
  }
444
501
  }
@@ -469,7 +526,7 @@ var RevenueChart = function RevenueChart(_ref) {
469
526
  var sum = w.globals.seriesTotals.reduce(function (a, b) {
470
527
  return a + b;
471
528
  }, 0);
472
- return metric === 'Revenue' ? "$".concat(Math.round(sum).toLocaleString()) : Math.round(sum).toLocaleString();
529
+ return isCurrency ? formatCurrency(Math.round(sum)) : Math.round(sum).toLocaleString('en-US');
473
530
  }
474
531
  }
475
532
  }
@@ -526,7 +583,7 @@ var RevenueChart = function RevenueChart(_ref) {
526
583
  fontSize: '12px'
527
584
  },
528
585
  formatter: function formatter(value) {
529
- return (metric === null || metric === void 0 ? void 0 : metric.toLowerCase()) === 'revenue' ? "$".concat((value || 0).toLocaleString()) : value || 0;
586
+ return formatValue(value);
530
587
  }
531
588
  }
532
589
  },
@@ -581,51 +638,6 @@ var RevenueChart = function RevenueChart(_ref) {
581
638
  }, "".concat(id, "-").concat(type, "-").concat(chartSeries.length));
582
639
  };
583
640
 
584
- var TREND_UP_COLOR = "#22C55E";
585
- var TREND_DOWN_COLOR = "#EF4444";
586
- function getTrendDirection(valueOrText) {
587
- var text = String(valueOrText !== null && valueOrText !== void 0 ? valueOrText : "").trim();
588
- if (text.includes("▼")) return "down";
589
- if (text.includes("▲")) return "up";
590
- var match = text.match(/-?\d+(\.\d+)?/);
591
- if (!match) return "neutral";
592
- var n = Number(match[0]);
593
- if (n < 0) return "down";
594
- if (n > 0) return "up";
595
- return "neutral";
596
- }
597
- function getTrendColor(valueOrText) {
598
- var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
599
- _ref$up = _ref.up,
600
- up = _ref$up === void 0 ? TREND_UP_COLOR : _ref$up,
601
- _ref$down = _ref.down,
602
- down = _ref$down === void 0 ? TREND_DOWN_COLOR : _ref$down,
603
- _ref$neutral = _ref.neutral,
604
- neutral = _ref$neutral === void 0 ? up : _ref$neutral;
605
- var direction = getTrendDirection(valueOrText);
606
- if (direction === "down") return down;
607
- if (direction === "up") return up;
608
- return neutral;
609
- }
610
- function getTrendArrow(valueOrText) {
611
- var direction = getTrendDirection(valueOrText);
612
- if (direction === "down") return "▼";
613
- if (direction === "up") return "▲";
614
- return "";
615
- }
616
- function formatNumber(num) {
617
- if (num >= 1000000000) {
618
- return (num / 1000000000).toFixed(1).replace(/\.0$/, "") + "B";
619
- }
620
- if (num >= 1000000) {
621
- return (num / 1000000).toFixed(1).replace(/\.0$/, "") + "M";
622
- }
623
- if (num >= 1000) {
624
- return (num / 1000).toFixed(1).replace(/\.0$/, "") + "K";
625
- }
626
- return (num !== null && num !== void 0 ? num : 0).toString();
627
- }
628
-
629
641
  var RenderChartCard = function RenderChartCard(_ref) {
630
642
  var item = _ref.item,
631
643
  index = _ref.index,
@@ -655,6 +667,22 @@ var RenderChartCard = function RenderChartCard(_ref) {
655
667
  });
656
668
  var trendArrow = getTrendArrow(trendText);
657
669
  var trendBadgeBg = trendColor === "#EF4444" ? "#fee2e2" : "#8df3be9a";
670
+ var resolveChartMetric = function resolveChartMetric() {
671
+ if (item.label.includes("Rate") || item.label.includes("Performance") || item.label.includes("source") || item.label === "URL") {
672
+ return "Percent";
673
+ }
674
+ if (item.isAmount || (metric === null || metric === void 0 ? void 0 : metric.toLowerCase()) === "revenue") {
675
+ return "Revenue";
676
+ }
677
+ if (item.stacked && item.label.includes("Traffic")) {
678
+ return "Visitors";
679
+ }
680
+ if (item.stacked) {
681
+ return "Donors";
682
+ }
683
+ return metric;
684
+ };
685
+ var chartMetric = resolveChartMetric();
658
686
  return /*#__PURE__*/jsxRuntime.jsx(material.Grid, {
659
687
  item: true,
660
688
  xs: 12,
@@ -849,7 +877,8 @@ var RenderChartCard = function RenderChartCard(_ref) {
849
877
  },
850
878
  children: [/*#__PURE__*/jsxRuntime.jsx(RevenueChart, {
851
879
  id: "".concat(item.label, "-").concat(index),
852
- metric: item.label.includes("Rate") || item.label.includes("Performance") || item.label.includes("source") || item.label === "URL" ? "Percent" : item.stacked ? item.label.includes("Traffic") ? "Visitors" : "Donors" : metric,
880
+ metric: chartMetric,
881
+ isAmount: item.isAmount,
853
882
  data: item.data,
854
883
  series: item.series,
855
884
  categories: item.categories,
@@ -2769,14 +2798,17 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref14, ref) {
2769
2798
  var now = new Date();
2770
2799
  var daysLabel = "".concat(numberOfDays, " day").concat(numberOfDays === 1 ? "" : "s");
2771
2800
  var windowLabel = "".concat(numberOfDays, "-day window");
2772
- var generatedLabel = now.toLocaleDateString("en-US", {
2801
+ var estOptions = {
2802
+ timeZone: "America/New_York"
2803
+ };
2804
+ var generatedLabel = now.toLocaleDateString("en-US", _objectSpread2({
2773
2805
  month: "short",
2774
2806
  day: "numeric",
2775
2807
  year: "numeric"
2776
- }) + " · " + now.toLocaleTimeString("en-US", {
2808
+ }, estOptions)) + " · " + now.toLocaleTimeString("en-US", _objectSpread2({
2777
2809
  hour: "2-digit",
2778
2810
  minute: "2-digit"
2779
- }) + " GMT";
2811
+ }, estOptions)) + " EST";
2780
2812
  var dateLabel = dateName;
2781
2813
  var _normalizeFiltersText = function normalizeFiltersText(filtersInput) {
2782
2814
  if (typeof filtersInput === "string") {
@@ -4730,7 +4762,9 @@ var MetricSparklineCard = function MetricSparklineCard(_ref) {
4730
4762
  _ref$bottomSection = _ref.bottomSection,
4731
4763
  bottomSection = _ref$bottomSection === void 0 ? false : _ref$bottomSection,
4732
4764
  _ref$compact = _ref.compact,
4733
- compact = _ref$compact === void 0 ? false : _ref$compact;
4765
+ compact = _ref$compact === void 0 ? false : _ref$compact,
4766
+ _ref$isAmount = _ref.isAmount,
4767
+ isAmount = _ref$isAmount === void 0 ? false : _ref$isAmount;
4734
4768
  var resolvedTrendColor = trendColor !== null && trendColor !== void 0 ? trendColor : getTrendColor(trend);
4735
4769
 
4736
4770
  // Extract values for chart series
@@ -4791,13 +4825,13 @@ var MetricSparklineCard = function MetricSparklineCard(_ref) {
4791
4825
  },
4792
4826
  y: {
4793
4827
  formatter: function formatter(val) {
4794
- if (title !== null && title !== void 0 && title.toLowerCase().includes("revenue")) {
4795
- return "$".concat(Number(val).toLocaleString());
4828
+ if (isAmount || title !== null && title !== void 0 && title.toLowerCase().includes("revenue")) {
4829
+ return formatCurrency(val);
4796
4830
  }
4797
4831
  if (title !== null && title !== void 0 && title.toLowerCase().includes("rate") || title !== null && title !== void 0 && title.toLowerCase().includes("bounce")) {
4798
4832
  return "".concat(val, "%");
4799
4833
  }
4800
- return Number(val).toLocaleString();
4834
+ return Number(val).toLocaleString("en-US");
4801
4835
  }
4802
4836
  },
4803
4837
  marker: {
@@ -6963,6 +6997,7 @@ var OverallDetailsGrid = function OverallDetailsGrid(_ref) {
6963
6997
  value: item.revenue
6964
6998
  };
6965
6999
  })) || [],
7000
+ isAmount: true,
6966
7001
  footerMetrics: [{
6967
7002
  label: "Avg / Day",
6968
7003
  value: "$".concat(formatNumber((orderBumpData === null || orderBumpData === void 0 ? void 0 : orderBumpData.averagePerDay) || 0))
@@ -7005,6 +7040,7 @@ var OverallDetailsGrid = function OverallDetailsGrid(_ref) {
7005
7040
  value: item.revenue
7006
7041
  };
7007
7042
  })) || [],
7043
+ isAmount: true,
7008
7044
  footerMetrics: [{
7009
7045
  label: "Referrers",
7010
7046
  value: formatNumber((referralData === null || referralData === void 0 ? void 0 : referralData.totalReferrers) || 0)
@@ -17807,7 +17843,8 @@ var OverallSection = function OverallSection(_ref) {
17807
17843
  mainChart = _objectSpread2(_objectSpread2({}, mainChart), {}, {
17808
17844
  label: mainChart.label || activeMetric,
17809
17845
  value: selectedInfo.value,
17810
- trend: selectedInfo.subValue
17846
+ trend: selectedInfo.subValue,
17847
+ isAmount: selectedInfo.money
17811
17848
  });
17812
17849
  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
17813
17850
  children: [/*#__PURE__*/jsxRuntime.jsx(material.Box, {
@@ -17837,7 +17874,7 @@ var OverallSection = function OverallSection(_ref) {
17837
17874
  isPremium: true,
17838
17875
  isPrimary: true,
17839
17876
  numberOfDays: numberOfDays,
17840
- metric: activeMetric.includes("Raised") || activeMetric.includes("donation") ? "Revenue" : "Donors"
17877
+ metric: activeMetric === "Conversion" ? "Percent" : selectedInfo.money ? "Revenue" : "Donors"
17841
17878
  })
17842
17879
  }), /*#__PURE__*/jsxRuntime.jsx(OverallDetailsGrid, {
17843
17880
  activeCampaignsRows: activeCampaignsData.map(function (campaign) {