@ammarkhalidfarooq/dashboard-package 0.6.69 → 0.6.70
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 +140 -97
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.es.js +140 -97
- package/dist/index.es.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -2097,17 +2097,82 @@ var ProgressBar = function ProgressBar(_ref8) {
|
|
|
2097
2097
|
})]
|
|
2098
2098
|
});
|
|
2099
2099
|
};
|
|
2100
|
-
var
|
|
2101
|
-
var _ref9$
|
|
2102
|
-
|
|
2103
|
-
_ref9$
|
|
2104
|
-
|
|
2105
|
-
_ref9$
|
|
2106
|
-
|
|
2107
|
-
|
|
2108
|
-
|
|
2109
|
-
|
|
2110
|
-
|
|
2100
|
+
var DonorGeographyPanel = function DonorGeographyPanel(_ref9) {
|
|
2101
|
+
var _ref9$geoList = _ref9.geoList,
|
|
2102
|
+
geoList = _ref9$geoList === void 0 ? [] : _ref9$geoList,
|
|
2103
|
+
_ref9$totalDonors = _ref9.totalDonors,
|
|
2104
|
+
totalDonors = _ref9$totalDonors === void 0 ? 0 : _ref9$totalDonors,
|
|
2105
|
+
_ref9$barColor = _ref9.barColor,
|
|
2106
|
+
barColor = _ref9$barColor === void 0 ? "#6366F1" : _ref9$barColor;
|
|
2107
|
+
return /*#__PURE__*/jsxRuntime.jsx(Panel, {
|
|
2108
|
+
title: "Donor geography",
|
|
2109
|
+
subtitle: "Top countries \xB7 ".concat(formatNumber(totalDonors), " total"),
|
|
2110
|
+
children: (geoList.length ? geoList.slice(0, 6) : []).map(function (g, i) {
|
|
2111
|
+
var _g$percentage;
|
|
2112
|
+
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
2113
|
+
style: {
|
|
2114
|
+
padding: i < 5 ? "0 0 5px" : 0,
|
|
2115
|
+
marginBottom: i < 5 ? 5 : 0,
|
|
2116
|
+
borderBottom: i < 5 ? "1px solid #F3F4F6" : "none"
|
|
2117
|
+
},
|
|
2118
|
+
children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
2119
|
+
style: {
|
|
2120
|
+
display: "flex",
|
|
2121
|
+
justifyContent: "space-between",
|
|
2122
|
+
alignItems: "center",
|
|
2123
|
+
gap: 6,
|
|
2124
|
+
marginBottom: 3
|
|
2125
|
+
},
|
|
2126
|
+
children: [/*#__PURE__*/jsxRuntime.jsx("span", {
|
|
2127
|
+
style: {
|
|
2128
|
+
fontSize: 9,
|
|
2129
|
+
color: "#374151",
|
|
2130
|
+
overflow: "hidden",
|
|
2131
|
+
textOverflow: "ellipsis",
|
|
2132
|
+
whiteSpace: "nowrap",
|
|
2133
|
+
minWidth: 0
|
|
2134
|
+
},
|
|
2135
|
+
children: g.country
|
|
2136
|
+
}), /*#__PURE__*/jsxRuntime.jsxs("span", {
|
|
2137
|
+
style: {
|
|
2138
|
+
fontSize: 9,
|
|
2139
|
+
fontWeight: 700,
|
|
2140
|
+
color: "#111827",
|
|
2141
|
+
flexShrink: 0
|
|
2142
|
+
},
|
|
2143
|
+
children: [formatNumber(g.value), " \xB7 ", formatNumber(g.percentage), "%"]
|
|
2144
|
+
})]
|
|
2145
|
+
}), /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
2146
|
+
style: {
|
|
2147
|
+
height: 5,
|
|
2148
|
+
background: "#F3F4F6",
|
|
2149
|
+
borderRadius: 3,
|
|
2150
|
+
overflow: "hidden"
|
|
2151
|
+
},
|
|
2152
|
+
children: /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
2153
|
+
style: {
|
|
2154
|
+
width: "".concat(Math.min(100, Math.max(0, Number((_g$percentage = g.percentage) !== null && _g$percentage !== void 0 ? _g$percentage : 0))), "%"),
|
|
2155
|
+
height: "100%",
|
|
2156
|
+
background: barColor,
|
|
2157
|
+
borderRadius: 3
|
|
2158
|
+
}
|
|
2159
|
+
})
|
|
2160
|
+
})]
|
|
2161
|
+
}, i);
|
|
2162
|
+
})
|
|
2163
|
+
});
|
|
2164
|
+
};
|
|
2165
|
+
var DonationTypeBarSvg = function DonationTypeBarSvg(_ref0) {
|
|
2166
|
+
var _ref0$categories = _ref0.categories,
|
|
2167
|
+
categories = _ref0$categories === void 0 ? [] : _ref0$categories,
|
|
2168
|
+
_ref0$recurring = _ref0.recurring,
|
|
2169
|
+
recurring = _ref0$recurring === void 0 ? [] : _ref0$recurring,
|
|
2170
|
+
_ref0$oneTime = _ref0.oneTime,
|
|
2171
|
+
oneTime = _ref0$oneTime === void 0 ? [] : _ref0$oneTime,
|
|
2172
|
+
_ref0$recurringColor = _ref0.recurringColor,
|
|
2173
|
+
recurringColor = _ref0$recurringColor === void 0 ? "#6366F1" : _ref0$recurringColor,
|
|
2174
|
+
_ref0$oneTimeColor = _ref0.oneTimeColor,
|
|
2175
|
+
oneTimeColor = _ref0$oneTimeColor === void 0 ? "#10B981" : _ref0$oneTimeColor;
|
|
2111
2176
|
var width = 158;
|
|
2112
2177
|
var height = 96;
|
|
2113
2178
|
var padL = 30;
|
|
@@ -2228,12 +2293,12 @@ var DonationTypeBarSvg = function DonationTypeBarSvg(_ref9) {
|
|
|
2228
2293
|
})]
|
|
2229
2294
|
});
|
|
2230
2295
|
};
|
|
2231
|
-
var DonationTypePanel = function DonationTypePanel(
|
|
2232
|
-
var donationTypeData =
|
|
2233
|
-
|
|
2234
|
-
recurringColor =
|
|
2235
|
-
|
|
2236
|
-
oneTimeColor =
|
|
2296
|
+
var DonationTypePanel = function DonationTypePanel(_ref1) {
|
|
2297
|
+
var donationTypeData = _ref1.donationTypeData,
|
|
2298
|
+
_ref1$recurringColor = _ref1.recurringColor,
|
|
2299
|
+
recurringColor = _ref1$recurringColor === void 0 ? "#6366F1" : _ref1$recurringColor,
|
|
2300
|
+
_ref1$oneTimeColor = _ref1.oneTimeColor,
|
|
2301
|
+
oneTimeColor = _ref1$oneTimeColor === void 0 ? "#10B981" : _ref1$oneTimeColor;
|
|
2237
2302
|
var _parseDonationTypeCha = parseDonationTypeChartData(donationTypeData),
|
|
2238
2303
|
categories = _parseDonationTypeCha.categories,
|
|
2239
2304
|
recurring = _parseDonationTypeCha.recurring,
|
|
@@ -2298,21 +2363,21 @@ var DonationTypePanel = function DonationTypePanel(_ref0) {
|
|
|
2298
2363
|
})]
|
|
2299
2364
|
});
|
|
2300
2365
|
};
|
|
2301
|
-
var AcceptanceRaisedPanel = function AcceptanceRaisedPanel(
|
|
2302
|
-
var title =
|
|
2303
|
-
subtitle =
|
|
2304
|
-
|
|
2305
|
-
acceptanceRate =
|
|
2306
|
-
|
|
2307
|
-
acceptanceGrowth =
|
|
2308
|
-
|
|
2309
|
-
raised =
|
|
2310
|
-
|
|
2311
|
-
raisedGrowth =
|
|
2312
|
-
|
|
2313
|
-
primaryColor =
|
|
2314
|
-
|
|
2315
|
-
secondaryColor =
|
|
2366
|
+
var AcceptanceRaisedPanel = function AcceptanceRaisedPanel(_ref10) {
|
|
2367
|
+
var title = _ref10.title,
|
|
2368
|
+
subtitle = _ref10.subtitle,
|
|
2369
|
+
_ref10$acceptanceRate = _ref10.acceptanceRate,
|
|
2370
|
+
acceptanceRate = _ref10$acceptanceRate === void 0 ? 0 : _ref10$acceptanceRate,
|
|
2371
|
+
_ref10$acceptanceGrow = _ref10.acceptanceGrowth,
|
|
2372
|
+
acceptanceGrowth = _ref10$acceptanceGrow === void 0 ? 0 : _ref10$acceptanceGrow,
|
|
2373
|
+
_ref10$raised = _ref10.raised,
|
|
2374
|
+
raised = _ref10$raised === void 0 ? 0 : _ref10$raised,
|
|
2375
|
+
_ref10$raisedGrowth = _ref10.raisedGrowth,
|
|
2376
|
+
raisedGrowth = _ref10$raisedGrowth === void 0 ? 0 : _ref10$raisedGrowth,
|
|
2377
|
+
_ref10$primaryColor = _ref10.primaryColor,
|
|
2378
|
+
primaryColor = _ref10$primaryColor === void 0 ? "#6366F1" : _ref10$primaryColor,
|
|
2379
|
+
_ref10$secondaryColor = _ref10.secondaryColor,
|
|
2380
|
+
secondaryColor = _ref10$secondaryColor === void 0 ? "#88bfd290" : _ref10$secondaryColor;
|
|
2316
2381
|
return /*#__PURE__*/jsxRuntime.jsx(Panel, {
|
|
2317
2382
|
title: title,
|
|
2318
2383
|
subtitle: subtitle,
|
|
@@ -2438,15 +2503,15 @@ var AcceptanceRaisedPanel = function AcceptanceRaisedPanel(_ref1) {
|
|
|
2438
2503
|
})
|
|
2439
2504
|
});
|
|
2440
2505
|
};
|
|
2441
|
-
var KpiCard = function KpiCard(
|
|
2442
|
-
var title =
|
|
2443
|
-
value =
|
|
2444
|
-
trend =
|
|
2445
|
-
detail =
|
|
2446
|
-
|
|
2447
|
-
variant =
|
|
2448
|
-
|
|
2449
|
-
trendPositiveWhenNegative =
|
|
2506
|
+
var KpiCard = function KpiCard(_ref11) {
|
|
2507
|
+
var title = _ref11.title,
|
|
2508
|
+
value = _ref11.value,
|
|
2509
|
+
trend = _ref11.trend,
|
|
2510
|
+
detail = _ref11.detail,
|
|
2511
|
+
_ref11$variant = _ref11.variant,
|
|
2512
|
+
variant = _ref11$variant === void 0 ? "secondary" : _ref11$variant,
|
|
2513
|
+
_ref11$trendPositiveW = _ref11.trendPositiveWhenNegative,
|
|
2514
|
+
trendPositiveWhenNegative = _ref11$trendPositiveW === void 0 ? false : _ref11$trendPositiveW;
|
|
2450
2515
|
var displayTrend = withTrendArrow(trend);
|
|
2451
2516
|
var isPrimary = variant === "primary";
|
|
2452
2517
|
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
@@ -2497,12 +2562,12 @@ var KpiCard = function KpiCard(_ref10) {
|
|
|
2497
2562
|
})]
|
|
2498
2563
|
});
|
|
2499
2564
|
};
|
|
2500
|
-
var PageHeader = function PageHeader(
|
|
2501
|
-
var dateLabel =
|
|
2502
|
-
generatedLabel =
|
|
2503
|
-
activeFilters =
|
|
2504
|
-
page =
|
|
2505
|
-
windowLabel =
|
|
2565
|
+
var PageHeader = function PageHeader(_ref12) {
|
|
2566
|
+
var dateLabel = _ref12.dateLabel,
|
|
2567
|
+
generatedLabel = _ref12.generatedLabel,
|
|
2568
|
+
activeFilters = _ref12.activeFilters,
|
|
2569
|
+
page = _ref12.page,
|
|
2570
|
+
windowLabel = _ref12.windowLabel;
|
|
2506
2571
|
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
2507
2572
|
style: {
|
|
2508
2573
|
padding: "22px ".concat(MX, "px 12px"),
|
|
@@ -2608,9 +2673,9 @@ var PageHeader = function PageHeader(_ref11) {
|
|
|
2608
2673
|
})]
|
|
2609
2674
|
});
|
|
2610
2675
|
};
|
|
2611
|
-
var PageFooter = function PageFooter(
|
|
2612
|
-
var generatedLabel =
|
|
2613
|
-
page =
|
|
2676
|
+
var PageFooter = function PageFooter(_ref13) {
|
|
2677
|
+
var generatedLabel = _ref13.generatedLabel,
|
|
2678
|
+
page = _ref13.page;
|
|
2614
2679
|
return /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
2615
2680
|
style: {
|
|
2616
2681
|
padding: "7px ".concat(MX, "px"),
|
|
@@ -2630,16 +2695,16 @@ var PageFooter = function PageFooter(_ref12) {
|
|
|
2630
2695
|
};
|
|
2631
2696
|
|
|
2632
2697
|
// ─── Main component ───────────────────────────────────────────────────────────
|
|
2633
|
-
var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (
|
|
2698
|
+
var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref14, ref) {
|
|
2634
2699
|
var _apiData$overviewStat, _overview$totalRevenu, _overview$netRevenue, _overview$overallAVGD, _overview$conversionR, _apiData$totalVisits, _refundsRaw$refundRat, _refundsRaw$chargebac, _apiData$trafficSourc, _apiData$trafficSourc2, _apiData$trafficSourc3, _metricByTitle$NetRa, _metricByTitle$Total, _metricByTitle$Total2, _metricByTitle$Total3, _metricByTitle$AvgDo, _metricByTitle$AvgDo2, _apiData$medianGift, _apiData$topDecileGif, _apiData$roasCard, _metricByTitle$ROAS, _apiData$roasCardPrev, _metricByTitle$ROAS2, _apiData$adSpend, _apiData$attributedRe, _metricByTitle$Conver, _metricByTitle$Conver2, _metricByTitle$Refund, _metricByTitle$Refund2, _refundsRaw$refundCou, _metricByTitle$Refund3, _mainChart$stacked, _refundsRaw$refundRat2, _ob$growthPercentage, _ob$peakDay, _up$acceptanceGrowth, _up$raisedGrowth, _dn$acceptanceGrowth, _dn$raisedGrowth, _refCard$growthPercen;
|
|
2635
|
-
var
|
|
2636
|
-
apiData =
|
|
2637
|
-
|
|
2638
|
-
dateName =
|
|
2639
|
-
|
|
2640
|
-
numberOfDays =
|
|
2641
|
-
|
|
2642
|
-
activeFilters =
|
|
2700
|
+
var _ref14$apiData = _ref14.apiData,
|
|
2701
|
+
apiData = _ref14$apiData === void 0 ? {} : _ref14$apiData,
|
|
2702
|
+
_ref14$dateName = _ref14.dateName,
|
|
2703
|
+
dateName = _ref14$dateName === void 0 ? "Last Period" : _ref14$dateName,
|
|
2704
|
+
_ref14$numberOfDays = _ref14.numberOfDays,
|
|
2705
|
+
numberOfDays = _ref14$numberOfDays === void 0 ? 30 : _ref14$numberOfDays,
|
|
2706
|
+
_ref14$activeFilters = _ref14.activeFilters,
|
|
2707
|
+
activeFilters = _ref14$activeFilters === void 0 ? [] : _ref14$activeFilters;
|
|
2643
2708
|
var now = new Date();
|
|
2644
2709
|
var daysLabel = "".concat(numberOfDays, " day").concat(numberOfDays === 1 ? "" : "s");
|
|
2645
2710
|
var windowLabel = "".concat(numberOfDays, "-day window");
|
|
@@ -2925,10 +2990,10 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref13, ref) {
|
|
|
2925
2990
|
gap: 14,
|
|
2926
2991
|
marginBottom: 6
|
|
2927
2992
|
},
|
|
2928
|
-
children: [["Email", C.cyan], ["Organic", C.emerald], ["Paid Ads", C.indigo]].map(function (
|
|
2929
|
-
var
|
|
2930
|
-
name =
|
|
2931
|
-
color =
|
|
2993
|
+
children: [["Email", C.cyan], ["Organic", C.emerald], ["Paid Ads", C.indigo]].map(function (_ref15) {
|
|
2994
|
+
var _ref16 = _slicedToArray(_ref15, 2),
|
|
2995
|
+
name = _ref16[0],
|
|
2996
|
+
color = _ref16[1];
|
|
2932
2997
|
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
2933
2998
|
style: {
|
|
2934
2999
|
display: "flex",
|
|
@@ -3152,32 +3217,10 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref13, ref) {
|
|
|
3152
3217
|
donationTypeData: report.donationTypeData,
|
|
3153
3218
|
recurringColor: C.indigo,
|
|
3154
3219
|
oneTimeColor: C.emerald
|
|
3155
|
-
}), /*#__PURE__*/jsxRuntime.jsx(
|
|
3156
|
-
|
|
3157
|
-
|
|
3158
|
-
|
|
3159
|
-
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
3160
|
-
style: {
|
|
3161
|
-
display: "flex",
|
|
3162
|
-
justifyContent: "space-between",
|
|
3163
|
-
padding: "3.5px 0",
|
|
3164
|
-
borderBottom: i < 5 ? "1px solid #F3F4F6" : "none"
|
|
3165
|
-
},
|
|
3166
|
-
children: [/*#__PURE__*/jsxRuntime.jsx("span", {
|
|
3167
|
-
style: {
|
|
3168
|
-
fontSize: 9,
|
|
3169
|
-
color: "#374151"
|
|
3170
|
-
},
|
|
3171
|
-
children: g.country
|
|
3172
|
-
}), /*#__PURE__*/jsxRuntime.jsxs("span", {
|
|
3173
|
-
style: {
|
|
3174
|
-
fontSize: 9,
|
|
3175
|
-
color: "#6B7280"
|
|
3176
|
-
},
|
|
3177
|
-
children: [formatNumber(g.value), " \xB7 ", formatNumber(g.percentage), "%"]
|
|
3178
|
-
})]
|
|
3179
|
-
}, i);
|
|
3180
|
-
})
|
|
3220
|
+
}), /*#__PURE__*/jsxRuntime.jsx(DonorGeographyPanel, {
|
|
3221
|
+
geoList: geoList,
|
|
3222
|
+
totalDonors: totalDonors,
|
|
3223
|
+
barColor: C.indigo
|
|
3181
3224
|
}), /*#__PURE__*/jsxRuntime.jsxs(Panel, {
|
|
3182
3225
|
title: "Refunds & chargebacks",
|
|
3183
3226
|
subtitle: "Trust health \xB7 ".concat(numberOfDays, "-day window"),
|
|
@@ -3307,10 +3350,10 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref13, ref) {
|
|
|
3307
3350
|
display: "flex",
|
|
3308
3351
|
gap: 12
|
|
3309
3352
|
},
|
|
3310
|
-
children: [["Avg/day", d$((ob === null || ob === void 0 ? void 0 : ob.averagePerDay) || 0)], ["Peak day", d$((ob === null || ob === void 0 || (_ob$peakDay = ob.peakDay) === null || _ob$peakDay === void 0 ? void 0 : _ob$peakDay.amount) || 0)], ["Orders", formatNumber((ob === null || ob === void 0 ? void 0 : ob.totalOrders) || 0)]].map(function (
|
|
3311
|
-
var
|
|
3312
|
-
l =
|
|
3313
|
-
v =
|
|
3353
|
+
children: [["Avg/day", d$((ob === null || ob === void 0 ? void 0 : ob.averagePerDay) || 0)], ["Peak day", d$((ob === null || ob === void 0 || (_ob$peakDay = ob.peakDay) === null || _ob$peakDay === void 0 ? void 0 : _ob$peakDay.amount) || 0)], ["Orders", formatNumber((ob === null || ob === void 0 ? void 0 : ob.totalOrders) || 0)]].map(function (_ref17) {
|
|
3354
|
+
var _ref18 = _slicedToArray(_ref17, 2),
|
|
3355
|
+
l = _ref18[0],
|
|
3356
|
+
v = _ref18[1];
|
|
3314
3357
|
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
3315
3358
|
children: [/*#__PURE__*/jsxRuntime.jsx("div", {
|
|
3316
3359
|
style: {
|
|
@@ -3383,10 +3426,10 @@ var ExportPdfLayout = /*#__PURE__*/React.forwardRef(function (_ref13, ref) {
|
|
|
3383
3426
|
display: "flex",
|
|
3384
3427
|
gap: 12
|
|
3385
3428
|
},
|
|
3386
|
-
children: [["Referrers", formatNumber((refCard === null || refCard === void 0 ? void 0 : refCard.totalReferrers) || 0)], ["Avg gift", d$((refCard === null || refCard === void 0 ? void 0 : refCard.averageGift) || 0)], ["Conv. rate", pct((refCard === null || refCard === void 0 ? void 0 : refCard.conversionRate) || 0, 1)]].map(function (
|
|
3387
|
-
var
|
|
3388
|
-
l =
|
|
3389
|
-
v =
|
|
3429
|
+
children: [["Referrers", formatNumber((refCard === null || refCard === void 0 ? void 0 : refCard.totalReferrers) || 0)], ["Avg gift", d$((refCard === null || refCard === void 0 ? void 0 : refCard.averageGift) || 0)], ["Conv. rate", pct((refCard === null || refCard === void 0 ? void 0 : refCard.conversionRate) || 0, 1)]].map(function (_ref19) {
|
|
3430
|
+
var _ref20 = _slicedToArray(_ref19, 2),
|
|
3431
|
+
l = _ref20[0],
|
|
3432
|
+
v = _ref20[1];
|
|
3390
3433
|
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
3391
3434
|
children: [/*#__PURE__*/jsxRuntime.jsx("div", {
|
|
3392
3435
|
style: {
|