@ammarkhalidfarooq/dashboard-package 0.6.10 → 0.6.12
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/MetricCard.cjs.js +10 -2
- package/dist/MetricCard.cjs.js.map +1 -1
- package/dist/MetricCard.es.js +10 -2
- package/dist/MetricCard.es.js.map +1 -1
- package/dist/index.cjs.js +12 -4
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.es.js +12 -4
- package/dist/index.es.js.map +1 -1
- package/package.json +1 -1
package/dist/MetricCard.cjs.js
CHANGED
|
@@ -66,6 +66,14 @@ var MetricCard = function MetricCard(_ref) {
|
|
|
66
66
|
captionSx = _ref$captionSx === void 0 ? {} : _ref$captionSx,
|
|
67
67
|
_ref$avatarSx = _ref.avatarSx,
|
|
68
68
|
avatarSx = _ref$avatarSx === void 0 ? {} : _ref$avatarSx;
|
|
69
|
+
var captionText = String(caption !== null && caption !== void 0 ? caption : "");
|
|
70
|
+
var isPercentCaption = captionText.includes("%");
|
|
71
|
+
var firstNumberMatch = captionText.match(/-?\d+(\.\d+)?/);
|
|
72
|
+
var trendValue = firstNumberMatch ? Number(firstNumberMatch[0]) : null;
|
|
73
|
+
var isNegativeTrend = isPercentCaption && trendValue !== null && trendValue < 0;
|
|
74
|
+
var isPositiveTrend = isPercentCaption && trendValue !== null && trendValue > 0;
|
|
75
|
+
var trendPrefix = isNegativeTrend ? "▼ " : isPositiveTrend ? "▲ " : "";
|
|
76
|
+
var captionColor = captionText.includes("failed") ? "#4F46E5" : error || isNegativeTrend ? "#ef4444" : "#0B8F61";
|
|
69
77
|
return /*#__PURE__*/jsxRuntime.jsxs(material.Box, {
|
|
70
78
|
sx: _objectSpread2({
|
|
71
79
|
bgcolor: "#fff",
|
|
@@ -114,9 +122,9 @@ var MetricCard = function MetricCard(_ref) {
|
|
|
114
122
|
sx: _objectSpread2({
|
|
115
123
|
fontSize: 12,
|
|
116
124
|
fontWeight: 500,
|
|
117
|
-
color:
|
|
125
|
+
color: captionColor
|
|
118
126
|
}, captionSx),
|
|
119
|
-
children:
|
|
127
|
+
children: "".concat(trendPrefix).concat(captionText)
|
|
120
128
|
})]
|
|
121
129
|
});
|
|
122
130
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetricCard.cjs.js","sources":["../src/components/advanced/MetricCard/index.jsx"],"sourcesContent":["import { Avatar, Box, Stack, Typography } from \"@mui/material\";\r\n\r\n\r\nconst MetricCard = ({\r\n title,\r\n value,\r\n caption,\r\n icon,\r\n active,\r\n warning,\r\n error,\r\n onClick,\r\n sx = {},\r\n titleSx = {},\r\n valueSx = {},\r\n captionSx = {},\r\n avatarSx = {},\r\n}) => (\r\n <Box\r\n sx={{\r\n bgcolor: \"#fff\",\r\n border: `1.5px solid ${active ? \"#4F46E5\" : warning ? \"#F3B33D\" : error ? \"#ef4444\" : \"#F1F1F5\"}`,\r\n borderRadius: \"16px\",\r\n p: { xs: 1.75, md: 2 },\r\n paddingTop: \"10px !important\", paddingBottom: \"10px !important\",\r\n height: 92,\r\n boxShadow: \"0 14px 30px rgba(21, 26, 45, 0.06)\",\r\n ...sx,\r\n }}\r\n onClick={onClick}\r\n >\r\n <Stack\r\n direction=\"row\"\r\n justifyContent=\"space-between\"\r\n alignItems=\"center\"\r\n >\r\n <Typography\r\n sx={{\r\n color: active ? \"#818CF8\" : \"#999EAA\",\r\n fontSize: 13,\r\n fontWeight: 500,\r\n letterSpacing: 0,\r\n ...titleSx,\r\n }}\r\n >\r\n {title}\r\n </Typography>\r\n <Avatar\r\n sx={{\r\n width: 30,\r\n height: 30,\r\n bgcolor: warning ? \"#FFF3CF\" : error ? \"#fee2e2\" : \"#EEF2FF\",\r\n color: warning ? \"#B45309\" : error ? \"#ef4444\" : \"#4F46E5\",\r\n ...avatarSx,\r\n }}\r\n >\r\n {icon}\r\n </Avatar>\r\n </Stack>\r\n <Typography\r\n sx={{\r\n fontSize: 22,\r\n fontWeight: 700,\r\n color: active ? \"#4F46E5\" : \"#050509\",\r\n lineHeight: 1.15,\r\n ...valueSx,\r\n }}\r\n >\r\n {value}\r\n </Typography>\r\n
|
|
1
|
+
{"version":3,"file":"MetricCard.cjs.js","sources":["../src/components/advanced/MetricCard/index.jsx"],"sourcesContent":["import { Avatar, Box, Stack, Typography } from \"@mui/material\";\r\n\r\n\r\nconst MetricCard = ({\r\n title,\r\n value,\r\n caption,\r\n icon,\r\n active,\r\n warning,\r\n error,\r\n onClick,\r\n sx = {},\r\n titleSx = {},\r\n valueSx = {},\r\n captionSx = {},\r\n avatarSx = {},\r\n}) => {\r\n const captionText = String(caption ?? \"\");\r\n const isPercentCaption = captionText.includes(\"%\");\r\n const firstNumberMatch = captionText.match(/-?\\d+(\\.\\d+)?/);\r\n const trendValue = firstNumberMatch ? Number(firstNumberMatch[0]) : null;\r\n const isNegativeTrend = isPercentCaption && trendValue !== null && trendValue < 0;\r\n const isPositiveTrend = isPercentCaption && trendValue !== null && trendValue > 0;\r\n\r\n const trendPrefix = isNegativeTrend ? \"▼ \" : isPositiveTrend ? \"▲ \" : \"\";\r\n const captionColor = captionText.includes(\"failed\")\r\n ? \"#4F46E5\"\r\n : error || isNegativeTrend\r\n ? \"#ef4444\"\r\n : \"#0B8F61\";\r\n\r\n return (\r\n <Box\r\n sx={{\r\n bgcolor: \"#fff\",\r\n border: `1.5px solid ${active ? \"#4F46E5\" : warning ? \"#F3B33D\" : error ? \"#ef4444\" : \"#F1F1F5\"}`,\r\n borderRadius: \"16px\",\r\n p: { xs: 1.75, md: 2 },\r\n paddingTop: \"10px !important\", paddingBottom: \"10px !important\",\r\n height: 92,\r\n boxShadow: \"0 14px 30px rgba(21, 26, 45, 0.06)\",\r\n ...sx,\r\n }}\r\n onClick={onClick}\r\n >\r\n <Stack\r\n direction=\"row\"\r\n justifyContent=\"space-between\"\r\n alignItems=\"center\"\r\n >\r\n <Typography\r\n sx={{\r\n color: active ? \"#818CF8\" : \"#999EAA\",\r\n fontSize: 13,\r\n fontWeight: 500,\r\n letterSpacing: 0,\r\n ...titleSx,\r\n }}\r\n >\r\n {title}\r\n </Typography>\r\n <Avatar\r\n sx={{\r\n width: 30,\r\n height: 30,\r\n bgcolor: warning ? \"#FFF3CF\" : error ? \"#fee2e2\" : \"#EEF2FF\",\r\n color: warning ? \"#B45309\" : error ? \"#ef4444\" : \"#4F46E5\",\r\n ...avatarSx,\r\n }}\r\n >\r\n {icon}\r\n </Avatar>\r\n </Stack>\r\n <Typography\r\n sx={{\r\n fontSize: 22,\r\n fontWeight: 700,\r\n color: active ? \"#4F46E5\" : \"#050509\",\r\n lineHeight: 1.15,\r\n ...valueSx,\r\n }}\r\n >\r\n {value}\r\n </Typography>\r\n <Typography\r\n sx={{\r\n fontSize: 12,\r\n fontWeight: 500,\r\n color: captionColor,\r\n ...captionSx,\r\n }}\r\n >\r\n {`${trendPrefix}${captionText}`}\r\n </Typography>\r\n </Box>\r\n );\r\n};\r\n\r\nexport default MetricCard;\r\n"],"names":["MetricCard","_ref","title","value","caption","icon","active","warning","error","onClick","_ref$sx","sx","_ref$titleSx","titleSx","_ref$valueSx","valueSx","_ref$captionSx","captionSx","_ref$avatarSx","avatarSx","captionText","String","isPercentCaption","includes","firstNumberMatch","match","trendValue","Number","isNegativeTrend","isPositiveTrend","trendPrefix","captionColor","_jsxs","Box","_objectSpread","bgcolor","border","concat","borderRadius","p","xs","md","paddingTop","paddingBottom","height","boxShadow","children","Stack","direction","justifyContent","alignItems","_jsx","Typography","color","fontSize","fontWeight","letterSpacing","Avatar","width","lineHeight"],"mappings":"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"}
|
package/dist/MetricCard.es.js
CHANGED
|
@@ -64,6 +64,14 @@ var MetricCard = function MetricCard(_ref) {
|
|
|
64
64
|
captionSx = _ref$captionSx === void 0 ? {} : _ref$captionSx,
|
|
65
65
|
_ref$avatarSx = _ref.avatarSx,
|
|
66
66
|
avatarSx = _ref$avatarSx === void 0 ? {} : _ref$avatarSx;
|
|
67
|
+
var captionText = String(caption !== null && caption !== void 0 ? caption : "");
|
|
68
|
+
var isPercentCaption = captionText.includes("%");
|
|
69
|
+
var firstNumberMatch = captionText.match(/-?\d+(\.\d+)?/);
|
|
70
|
+
var trendValue = firstNumberMatch ? Number(firstNumberMatch[0]) : null;
|
|
71
|
+
var isNegativeTrend = isPercentCaption && trendValue !== null && trendValue < 0;
|
|
72
|
+
var isPositiveTrend = isPercentCaption && trendValue !== null && trendValue > 0;
|
|
73
|
+
var trendPrefix = isNegativeTrend ? "▼ " : isPositiveTrend ? "▲ " : "";
|
|
74
|
+
var captionColor = captionText.includes("failed") ? "#4F46E5" : error || isNegativeTrend ? "#ef4444" : "#0B8F61";
|
|
67
75
|
return /*#__PURE__*/jsxs(Box, {
|
|
68
76
|
sx: _objectSpread2({
|
|
69
77
|
bgcolor: "#fff",
|
|
@@ -112,9 +120,9 @@ var MetricCard = function MetricCard(_ref) {
|
|
|
112
120
|
sx: _objectSpread2({
|
|
113
121
|
fontSize: 12,
|
|
114
122
|
fontWeight: 500,
|
|
115
|
-
color:
|
|
123
|
+
color: captionColor
|
|
116
124
|
}, captionSx),
|
|
117
|
-
children:
|
|
125
|
+
children: "".concat(trendPrefix).concat(captionText)
|
|
118
126
|
})]
|
|
119
127
|
});
|
|
120
128
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetricCard.es.js","sources":["../src/components/advanced/MetricCard/index.jsx"],"sourcesContent":["import { Avatar, Box, Stack, Typography } from \"@mui/material\";\r\n\r\n\r\nconst MetricCard = ({\r\n title,\r\n value,\r\n caption,\r\n icon,\r\n active,\r\n warning,\r\n error,\r\n onClick,\r\n sx = {},\r\n titleSx = {},\r\n valueSx = {},\r\n captionSx = {},\r\n avatarSx = {},\r\n}) => (\r\n <Box\r\n sx={{\r\n bgcolor: \"#fff\",\r\n border: `1.5px solid ${active ? \"#4F46E5\" : warning ? \"#F3B33D\" : error ? \"#ef4444\" : \"#F1F1F5\"}`,\r\n borderRadius: \"16px\",\r\n p: { xs: 1.75, md: 2 },\r\n paddingTop: \"10px !important\", paddingBottom: \"10px !important\",\r\n height: 92,\r\n boxShadow: \"0 14px 30px rgba(21, 26, 45, 0.06)\",\r\n ...sx,\r\n }}\r\n onClick={onClick}\r\n >\r\n <Stack\r\n direction=\"row\"\r\n justifyContent=\"space-between\"\r\n alignItems=\"center\"\r\n >\r\n <Typography\r\n sx={{\r\n color: active ? \"#818CF8\" : \"#999EAA\",\r\n fontSize: 13,\r\n fontWeight: 500,\r\n letterSpacing: 0,\r\n ...titleSx,\r\n }}\r\n >\r\n {title}\r\n </Typography>\r\n <Avatar\r\n sx={{\r\n width: 30,\r\n height: 30,\r\n bgcolor: warning ? \"#FFF3CF\" : error ? \"#fee2e2\" : \"#EEF2FF\",\r\n color: warning ? \"#B45309\" : error ? \"#ef4444\" : \"#4F46E5\",\r\n ...avatarSx,\r\n }}\r\n >\r\n {icon}\r\n </Avatar>\r\n </Stack>\r\n <Typography\r\n sx={{\r\n fontSize: 22,\r\n fontWeight: 700,\r\n color: active ? \"#4F46E5\" : \"#050509\",\r\n lineHeight: 1.15,\r\n ...valueSx,\r\n }}\r\n >\r\n {value}\r\n </Typography>\r\n
|
|
1
|
+
{"version":3,"file":"MetricCard.es.js","sources":["../src/components/advanced/MetricCard/index.jsx"],"sourcesContent":["import { Avatar, Box, Stack, Typography } from \"@mui/material\";\r\n\r\n\r\nconst MetricCard = ({\r\n title,\r\n value,\r\n caption,\r\n icon,\r\n active,\r\n warning,\r\n error,\r\n onClick,\r\n sx = {},\r\n titleSx = {},\r\n valueSx = {},\r\n captionSx = {},\r\n avatarSx = {},\r\n}) => {\r\n const captionText = String(caption ?? \"\");\r\n const isPercentCaption = captionText.includes(\"%\");\r\n const firstNumberMatch = captionText.match(/-?\\d+(\\.\\d+)?/);\r\n const trendValue = firstNumberMatch ? Number(firstNumberMatch[0]) : null;\r\n const isNegativeTrend = isPercentCaption && trendValue !== null && trendValue < 0;\r\n const isPositiveTrend = isPercentCaption && trendValue !== null && trendValue > 0;\r\n\r\n const trendPrefix = isNegativeTrend ? \"▼ \" : isPositiveTrend ? \"▲ \" : \"\";\r\n const captionColor = captionText.includes(\"failed\")\r\n ? \"#4F46E5\"\r\n : error || isNegativeTrend\r\n ? \"#ef4444\"\r\n : \"#0B8F61\";\r\n\r\n return (\r\n <Box\r\n sx={{\r\n bgcolor: \"#fff\",\r\n border: `1.5px solid ${active ? \"#4F46E5\" : warning ? \"#F3B33D\" : error ? \"#ef4444\" : \"#F1F1F5\"}`,\r\n borderRadius: \"16px\",\r\n p: { xs: 1.75, md: 2 },\r\n paddingTop: \"10px !important\", paddingBottom: \"10px !important\",\r\n height: 92,\r\n boxShadow: \"0 14px 30px rgba(21, 26, 45, 0.06)\",\r\n ...sx,\r\n }}\r\n onClick={onClick}\r\n >\r\n <Stack\r\n direction=\"row\"\r\n justifyContent=\"space-between\"\r\n alignItems=\"center\"\r\n >\r\n <Typography\r\n sx={{\r\n color: active ? \"#818CF8\" : \"#999EAA\",\r\n fontSize: 13,\r\n fontWeight: 500,\r\n letterSpacing: 0,\r\n ...titleSx,\r\n }}\r\n >\r\n {title}\r\n </Typography>\r\n <Avatar\r\n sx={{\r\n width: 30,\r\n height: 30,\r\n bgcolor: warning ? \"#FFF3CF\" : error ? \"#fee2e2\" : \"#EEF2FF\",\r\n color: warning ? \"#B45309\" : error ? \"#ef4444\" : \"#4F46E5\",\r\n ...avatarSx,\r\n }}\r\n >\r\n {icon}\r\n </Avatar>\r\n </Stack>\r\n <Typography\r\n sx={{\r\n fontSize: 22,\r\n fontWeight: 700,\r\n color: active ? \"#4F46E5\" : \"#050509\",\r\n lineHeight: 1.15,\r\n ...valueSx,\r\n }}\r\n >\r\n {value}\r\n </Typography>\r\n <Typography\r\n sx={{\r\n fontSize: 12,\r\n fontWeight: 500,\r\n color: captionColor,\r\n ...captionSx,\r\n }}\r\n >\r\n {`${trendPrefix}${captionText}`}\r\n </Typography>\r\n </Box>\r\n );\r\n};\r\n\r\nexport default MetricCard;\r\n"],"names":["MetricCard","_ref","title","value","caption","icon","active","warning","error","onClick","_ref$sx","sx","_ref$titleSx","titleSx","_ref$valueSx","valueSx","_ref$captionSx","captionSx","_ref$avatarSx","avatarSx","captionText","String","isPercentCaption","includes","firstNumberMatch","match","trendValue","Number","isNegativeTrend","isPositiveTrend","trendPrefix","captionColor","_jsxs","Box","_objectSpread","bgcolor","border","concat","borderRadius","p","xs","md","paddingTop","paddingBottom","height","boxShadow","children","Stack","direction","justifyContent","alignItems","_jsx","Typography","color","fontSize","fontWeight","letterSpacing","Avatar","width","lineHeight"],"mappings":"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"}
|
package/dist/index.cjs.js
CHANGED
|
@@ -1183,6 +1183,14 @@ var MetricCard$1 = function MetricCard(_ref) {
|
|
|
1183
1183
|
captionSx = _ref$captionSx === void 0 ? {} : _ref$captionSx,
|
|
1184
1184
|
_ref$avatarSx = _ref.avatarSx,
|
|
1185
1185
|
avatarSx = _ref$avatarSx === void 0 ? {} : _ref$avatarSx;
|
|
1186
|
+
var captionText = String(caption !== null && caption !== void 0 ? caption : "");
|
|
1187
|
+
var isPercentCaption = captionText.includes("%");
|
|
1188
|
+
var firstNumberMatch = captionText.match(/-?\d+(\.\d+)?/);
|
|
1189
|
+
var trendValue = firstNumberMatch ? Number(firstNumberMatch[0]) : null;
|
|
1190
|
+
var isNegativeTrend = isPercentCaption && trendValue !== null && trendValue < 0;
|
|
1191
|
+
var isPositiveTrend = isPercentCaption && trendValue !== null && trendValue > 0;
|
|
1192
|
+
var trendPrefix = isNegativeTrend ? "▼ " : isPositiveTrend ? "▲ " : "";
|
|
1193
|
+
var captionColor = captionText.includes("failed") ? "#4F46E5" : error || isNegativeTrend ? "#ef4444" : "#0B8F61";
|
|
1186
1194
|
return /*#__PURE__*/jsxRuntime.jsxs(material.Box, {
|
|
1187
1195
|
sx: _objectSpread2({
|
|
1188
1196
|
bgcolor: "#fff",
|
|
@@ -1231,9 +1239,9 @@ var MetricCard$1 = function MetricCard(_ref) {
|
|
|
1231
1239
|
sx: _objectSpread2({
|
|
1232
1240
|
fontSize: 12,
|
|
1233
1241
|
fontWeight: 500,
|
|
1234
|
-
color:
|
|
1242
|
+
color: captionColor
|
|
1235
1243
|
}, captionSx),
|
|
1236
|
-
children:
|
|
1244
|
+
children: "".concat(trendPrefix).concat(captionText)
|
|
1237
1245
|
})]
|
|
1238
1246
|
});
|
|
1239
1247
|
};
|
|
@@ -15644,9 +15652,9 @@ var OverallSection = function OverallSection(_ref) {
|
|
|
15644
15652
|
}), /*#__PURE__*/jsxRuntime.jsx(OverallDetailsGrid, {
|
|
15645
15653
|
activeCampaignsRows: activeCampaignsData.map(function (campaign) {
|
|
15646
15654
|
return {
|
|
15647
|
-
id: campaign.
|
|
15655
|
+
id: campaign.title ? campaign.title.trim().split(/\s+/).slice(0, 2).filter(Boolean).map(function (word) {
|
|
15648
15656
|
return word[0];
|
|
15649
|
-
}).join("").toUpperCase()
|
|
15657
|
+
}).join("").toUpperCase() : "??",
|
|
15650
15658
|
name: campaign.title || "Untitled Campaign",
|
|
15651
15659
|
val1: "$".concat(formatNumber(campaign.collectedAmount || 0)),
|
|
15652
15660
|
type: "progress",
|