@auth0/quantum-charts 1.3.11 → 1.3.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/chart-summary/index.d.ts
CHANGED
package/chart-summary/index.js
CHANGED
|
@@ -63,7 +63,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
|
63
63
|
return to.concat(ar || Array.prototype.slice.call(from));
|
|
64
64
|
};
|
|
65
65
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
66
|
-
exports.ChartSummary = void 0;
|
|
66
|
+
exports.ChartSummary = exports.titleToAnalyticName = void 0;
|
|
67
67
|
var React = __importStar(require("react"));
|
|
68
68
|
var quantum_product_1 = require("@auth0/quantum-product");
|
|
69
69
|
var downloadCsv_1 = require("../helpers/downloadCsv");
|
|
@@ -92,6 +92,12 @@ var TitleWrapper = (0, quantum_product_1.styled)(quantum_product_1.Text)(templat
|
|
|
92
92
|
var theme = _a.theme;
|
|
93
93
|
return theme.tokens.type_preset_section_subtitle.fontWeight;
|
|
94
94
|
});
|
|
95
|
+
var titleToAnalyticName = function (title) {
|
|
96
|
+
return title
|
|
97
|
+
.replace(/\s+/g, '-') // Replace spaces with underscores
|
|
98
|
+
.toLowerCase(); // Convert to lowercase
|
|
99
|
+
};
|
|
100
|
+
exports.titleToAnalyticName = titleToAnalyticName;
|
|
95
101
|
function ChartSummary(props) {
|
|
96
102
|
var title = props.title, chartStatus = props.chartStatus, value = props.value, helperText = props.helperText, label = props.label, dataTable = props.dataTable, headerAction = props.headerAction, additionalMenuItems = props.additionalMenuItems, showChartTable = props.showChartTable, allowDownload = props.allowDownload, customViewChartTable = props.customViewChartTable, _a = props.triggerButtonSize, triggerButtonSize = _a === void 0 ? 'small' : _a, titleIcon = props.titleIcon, finalMenuItem = props.finalMenuItem, isVertical = props.isVertical;
|
|
97
103
|
var _b = __read(React.useState(false), 2), isOpen = _b[0], setIsOpen = _b[1];
|
|
@@ -108,6 +114,7 @@ function ChartSummary(props) {
|
|
|
108
114
|
setIsOpen(true);
|
|
109
115
|
},
|
|
110
116
|
title: 'View table',
|
|
117
|
+
analyticsId: "security-center-menu-item-".concat((0, exports.titleToAnalyticName)(title || ''), "-view-table"),
|
|
111
118
|
},
|
|
112
119
|
];
|
|
113
120
|
if (showChartTable && allowDownload) {
|
|
@@ -119,6 +126,7 @@ function ChartSummary(props) {
|
|
|
119
126
|
(0, downloadCsv_1.downloadCSV)(dataTable, title);
|
|
120
127
|
},
|
|
121
128
|
title: 'Download CSV',
|
|
129
|
+
analyticsId: "security-center-menu-item-".concat((0, exports.titleToAnalyticName)(title || ''), "-download-csv"),
|
|
122
130
|
});
|
|
123
131
|
}
|
|
124
132
|
var aggregatedMenuItems = baseMenuItems;
|
|
@@ -66,6 +66,11 @@ var TitleWrapper = styled(Text)(templateObject_3 || (templateObject_3 = __makeTe
|
|
|
66
66
|
var theme = _a.theme;
|
|
67
67
|
return theme.tokens.type_preset_section_subtitle.fontWeight;
|
|
68
68
|
});
|
|
69
|
+
export var titleToAnalyticName = function (title) {
|
|
70
|
+
return title
|
|
71
|
+
.replace(/\s+/g, '-') // Replace spaces with underscores
|
|
72
|
+
.toLowerCase(); // Convert to lowercase
|
|
73
|
+
};
|
|
69
74
|
export function ChartSummary(props) {
|
|
70
75
|
var title = props.title, chartStatus = props.chartStatus, value = props.value, helperText = props.helperText, label = props.label, dataTable = props.dataTable, headerAction = props.headerAction, additionalMenuItems = props.additionalMenuItems, showChartTable = props.showChartTable, allowDownload = props.allowDownload, customViewChartTable = props.customViewChartTable, _a = props.triggerButtonSize, triggerButtonSize = _a === void 0 ? 'small' : _a, titleIcon = props.titleIcon, finalMenuItem = props.finalMenuItem, isVertical = props.isVertical;
|
|
71
76
|
var _b = __read(React.useState(false), 2), isOpen = _b[0], setIsOpen = _b[1];
|
|
@@ -82,6 +87,7 @@ export function ChartSummary(props) {
|
|
|
82
87
|
setIsOpen(true);
|
|
83
88
|
},
|
|
84
89
|
title: 'View table',
|
|
90
|
+
analyticsId: "security-center-menu-item-".concat(titleToAnalyticName(title || ''), "-view-table"),
|
|
85
91
|
},
|
|
86
92
|
];
|
|
87
93
|
if (showChartTable && allowDownload) {
|
|
@@ -93,6 +99,7 @@ export function ChartSummary(props) {
|
|
|
93
99
|
downloadCSV(dataTable, title);
|
|
94
100
|
},
|
|
95
101
|
title: 'Download CSV',
|
|
102
|
+
analyticsId: "security-center-menu-item-".concat(titleToAnalyticName(title || ''), "-download-csv"),
|
|
96
103
|
});
|
|
97
104
|
}
|
|
98
105
|
var aggregatedMenuItems = baseMenuItems;
|
package/esm/line-chart/index.js
CHANGED
|
@@ -43,6 +43,11 @@ export function LineChart(props) {
|
|
|
43
43
|
var _a = props, data = _a.data, leftAxis = _a.leftAxis, bottomAxis = _a.bottomAxis, _b = _a.height, height = _b === void 0 ? 300 : _b, title = _a.title, titleIcon = _a.titleIcon, chartStatus = _a.chartStatus, value = _a.value, label = _a.label, helperText = _a.helperText, _c = _a.legend, legend = _c === void 0 ? true : _c, syncId = _a.syncId, _d = _a.color, color = _d === void 0 ? 'categorical' : _d, statusColorMapping = _a.statusColorMapping, headerAction = _a.headerAction, additionalMenuItems = _a.additionalMenuItems, finalMenuItem = _a.finalMenuItem, thresholds = _a.thresholds, breaches = _a.breaches, disableThresholdMenu = _a.disableThresholdMenu, _e = _a.allowDownload, allowDownload = _e === void 0 ? true : _e, _f = _a.showChartTable, showChartTable = _f === void 0 ? true : _f, _g = _a.showChartTableButtonInHeader, showChartTableButtonInHeader = _g === void 0 ? true : _g, _h = _a.showDividerInHeader, showDividerInHeader = _h === void 0 ? true : _h, _j = _a.headerButtonsSize, headerButtonsSize = _j === void 0 ? 'medium' : _j, _k = _a.isVertical, isVertical = _k === void 0 ? false : _k;
|
|
44
44
|
var theme = useTheme();
|
|
45
45
|
var _l = useDropdownMenuState({ baseId: 'threshold-menu' }), triggerProps = _l.triggerProps, menuProps = _l.menuProps;
|
|
46
|
+
var titleToAnalyticName = function (title) {
|
|
47
|
+
return title
|
|
48
|
+
.replace(/\s+/g, '-') // Replace spaces with underscores
|
|
49
|
+
.toLowerCase(); // Convert to lowercase
|
|
50
|
+
};
|
|
46
51
|
// Function to know how many lines we need based of how much different group values are.
|
|
47
52
|
var groups = _.uniqBy(data, 'group').map(function (item) { return item.group; });
|
|
48
53
|
var initialState = __assign({ hover: null }, groups.reduce(function (acc, group) {
|
|
@@ -124,6 +129,7 @@ export function LineChart(props) {
|
|
|
124
129
|
menuItems = thresholds.map(function (threshold) { return ({
|
|
125
130
|
title: threshold.threshold_label,
|
|
126
131
|
description: threshold.evaluated_metric,
|
|
132
|
+
analyticsId: "security-center-button-".concat(titleToAnalyticName(threshold.evaluated_metric), "-threshold"),
|
|
127
133
|
onClick: function (event) {
|
|
128
134
|
setThreshold(threshold);
|
|
129
135
|
if (menuProps.onClose) {
|
package/line-chart/index.js
CHANGED
|
@@ -72,6 +72,11 @@ function LineChart(props) {
|
|
|
72
72
|
var _a = props, data = _a.data, leftAxis = _a.leftAxis, bottomAxis = _a.bottomAxis, _b = _a.height, height = _b === void 0 ? 300 : _b, title = _a.title, titleIcon = _a.titleIcon, chartStatus = _a.chartStatus, value = _a.value, label = _a.label, helperText = _a.helperText, _c = _a.legend, legend = _c === void 0 ? true : _c, syncId = _a.syncId, _d = _a.color, color = _d === void 0 ? 'categorical' : _d, statusColorMapping = _a.statusColorMapping, headerAction = _a.headerAction, additionalMenuItems = _a.additionalMenuItems, finalMenuItem = _a.finalMenuItem, thresholds = _a.thresholds, breaches = _a.breaches, disableThresholdMenu = _a.disableThresholdMenu, _e = _a.allowDownload, allowDownload = _e === void 0 ? true : _e, _f = _a.showChartTable, showChartTable = _f === void 0 ? true : _f, _g = _a.showChartTableButtonInHeader, showChartTableButtonInHeader = _g === void 0 ? true : _g, _h = _a.showDividerInHeader, showDividerInHeader = _h === void 0 ? true : _h, _j = _a.headerButtonsSize, headerButtonsSize = _j === void 0 ? 'medium' : _j, _k = _a.isVertical, isVertical = _k === void 0 ? false : _k;
|
|
73
73
|
var theme = (0, quantum_product_1.useTheme)();
|
|
74
74
|
var _l = (0, quantum_product_1.useDropdownMenuState)({ baseId: 'threshold-menu' }), triggerProps = _l.triggerProps, menuProps = _l.menuProps;
|
|
75
|
+
var titleToAnalyticName = function (title) {
|
|
76
|
+
return title
|
|
77
|
+
.replace(/\s+/g, '-') // Replace spaces with underscores
|
|
78
|
+
.toLowerCase(); // Convert to lowercase
|
|
79
|
+
};
|
|
75
80
|
// Function to know how many lines we need based of how much different group values are.
|
|
76
81
|
var groups = lodash_1.default.uniqBy(data, 'group').map(function (item) { return item.group; });
|
|
77
82
|
var initialState = __assign({ hover: null }, groups.reduce(function (acc, group) {
|
|
@@ -153,6 +158,7 @@ function LineChart(props) {
|
|
|
153
158
|
menuItems = thresholds.map(function (threshold) { return ({
|
|
154
159
|
title: threshold.threshold_label,
|
|
155
160
|
description: threshold.evaluated_metric,
|
|
161
|
+
analyticsId: "security-center-button-".concat(titleToAnalyticName(threshold.evaluated_metric), "-threshold"),
|
|
156
162
|
onClick: function (event) {
|
|
157
163
|
setThreshold(threshold);
|
|
158
164
|
if (menuProps.onClose) {
|