dp-widgets-framework 1.0.6 → 1.0.7
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.esm.js +149 -646
- package/dist/index.js +149 -646
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -35939,7 +35939,87 @@ function SummaryWidget({ title, data, metadata, className }) {
|
|
|
35939
35939
|
}, children: title }) })), jsxRuntimeExports.jsx("div", { className: "flex-1 overflow-auto space-y-4", children: jsxRuntimeExports.jsx("div", { className: "prose prose-sm max-w-none", children: jsxRuntimeExports.jsx(Markdown, { className: "text-gray-800 dark:text-gray-200", children: data.content }) }) })] }));
|
|
35940
35940
|
}
|
|
35941
35941
|
|
|
35942
|
-
const CHART_REFRESH_TIMEOUT =
|
|
35942
|
+
const CHART_REFRESH_TIMEOUT = 3000;
|
|
35943
|
+
const DEFAULT_COLORS = ["#E4DCB8", "#DAC46C", "#808080", "#582809", "#A3ADD0", "#398E6F", "#AF123D", "#8C99C4", "#5290AC", "#601B07", "#50649D", "#B4A8A0", "#6F2587"];
|
|
35944
|
+
const LINE_COLORS = ["#243D84", "#69238B", "#4A959F", "#D0A677", "#B31E47", "#396431"];
|
|
35945
|
+
const clearChat = async (widgetBackendUrl, widgetId) => {
|
|
35946
|
+
if (!widgetBackendUrl || !widgetId)
|
|
35947
|
+
return;
|
|
35948
|
+
console.log('clearChat called for widgetId:', widgetId);
|
|
35949
|
+
try {
|
|
35950
|
+
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
35951
|
+
method: 'POST',
|
|
35952
|
+
headers: {
|
|
35953
|
+
'Content-Type': 'application/json',
|
|
35954
|
+
},
|
|
35955
|
+
body: JSON.stringify({
|
|
35956
|
+
session_id: widgetId,
|
|
35957
|
+
delete_state: true
|
|
35958
|
+
}),
|
|
35959
|
+
});
|
|
35960
|
+
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
35961
|
+
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
35962
|
+
}
|
|
35963
|
+
catch (error) {
|
|
35964
|
+
console.error('Failed to clear chat:', error);
|
|
35965
|
+
}
|
|
35966
|
+
};
|
|
35967
|
+
const createLoadingComponent = (message = "Loading chart data...") => (jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-2", children: [jsxRuntimeExports.jsx(RefreshCw, { className: "h-6 w-6 animate-spin text-blue-500" }), jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-500", children: message })] }) }));
|
|
35968
|
+
const createInitialChartState = (agentType, widgetIds, datasetId) => {
|
|
35969
|
+
const baseState = { dataset_id: datasetId || "home_generation_dataset" };
|
|
35970
|
+
switch (agentType) {
|
|
35971
|
+
case "Pie Chart Agent":
|
|
35972
|
+
return {
|
|
35973
|
+
pie_chart_data: {
|
|
35974
|
+
title: "",
|
|
35975
|
+
type: "pie",
|
|
35976
|
+
chart_type: "financial",
|
|
35977
|
+
data: { labels: [], values: [], percentages: [], total: 0 },
|
|
35978
|
+
metadata: { categories: 0, largest_category: "", largest_value: 0, largest_percentage: 0 }
|
|
35979
|
+
}
|
|
35980
|
+
};
|
|
35981
|
+
case "Line Chart Agent":
|
|
35982
|
+
case "Bar Chart Agent":
|
|
35983
|
+
return Object.assign({ bar_chart_data: {
|
|
35984
|
+
title: "",
|
|
35985
|
+
type: agentType === "Line Chart Agent" ? "line" : "bar",
|
|
35986
|
+
chart_type: "financial",
|
|
35987
|
+
orientation: agentType === "Line Chart Agent" ? "horizontal" : "vertical",
|
|
35988
|
+
data: { labels: [], values: [], total: 0, average: 0 },
|
|
35989
|
+
metadata: { categories: 0, highest_category: "", highest_value: 0, lowest_category: "", lowest_value: 0, range: 0 }
|
|
35990
|
+
} }, baseState);
|
|
35991
|
+
case "Series Bar Chart Agent":
|
|
35992
|
+
case "Series Line Chart Agent":
|
|
35993
|
+
return Object.assign({ series_bar_chart_data: {
|
|
35994
|
+
title: "",
|
|
35995
|
+
type: "series_bar",
|
|
35996
|
+
chart_type: "financial",
|
|
35997
|
+
orientation: "vertical",
|
|
35998
|
+
data: { labels: [], series: [], total: 0, average: 0 },
|
|
35999
|
+
metadata: {
|
|
36000
|
+
categories: 0, series_count: 0, highest_category: "", highest_value: 0, highest_series: "",
|
|
36001
|
+
lowest_category: "", lowest_value: 0, lowest_series: "", range: 0, series_totals: {}, series_averages: {}
|
|
36002
|
+
}
|
|
36003
|
+
} }, baseState);
|
|
36004
|
+
case "Data Grid Agent":
|
|
36005
|
+
return Object.assign({ matrix_grid_data: {
|
|
36006
|
+
title: "",
|
|
36007
|
+
type: "data_grid",
|
|
36008
|
+
grid_type: "",
|
|
36009
|
+
data: { headers: [], rows: [], row_count: 0, column_count: 0 },
|
|
36010
|
+
metadata: { total_rows: 0, total_columns: 0, numeric_columns: [] }
|
|
36011
|
+
} }, baseState);
|
|
36012
|
+
case "Summary Agent":
|
|
36013
|
+
return Object.assign({ summary_data: {
|
|
36014
|
+
title: "",
|
|
36015
|
+
type: "summary",
|
|
36016
|
+
data: { content: "", word_count: 0, character_count: 0, character_count_no_spaces: 0, line_count: 0 },
|
|
36017
|
+
metadata: { created_at: "", content_type: "text", is_multiline: false }
|
|
36018
|
+
} }, baseState);
|
|
36019
|
+
default:
|
|
36020
|
+
return { widget_ids: widgetIds };
|
|
36021
|
+
}
|
|
36022
|
+
};
|
|
35943
36023
|
const loadAgentState = async (widgetBackendUrl, threadId, agentName) => {
|
|
35944
36024
|
try {
|
|
35945
36025
|
const response = await fetch(`${widgetBackendUrl}/api/copilot/${agentName}`, {
|
|
@@ -36003,7 +36083,6 @@ const parseAndUpdateChartState = (apiResponse, setChartState) => {
|
|
|
36003
36083
|
if (chartData.agent_message) {
|
|
36004
36084
|
newChartState.agent_message = chartData.agent_message;
|
|
36005
36085
|
}
|
|
36006
|
-
console.log('Chart state updated from API response:', newChartState);
|
|
36007
36086
|
return newChartState;
|
|
36008
36087
|
});
|
|
36009
36088
|
}
|
|
@@ -36038,40 +36117,15 @@ const getStyleValues = (styles = {}) => {
|
|
|
36038
36117
|
};
|
|
36039
36118
|
function BarChartComponent({ orientation, barChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36040
36119
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
36120
|
+
const hasCalledRef = useRef(false);
|
|
36041
36121
|
const labels = ((_b = (_a = barChartState === null || barChartState === void 0 ? void 0 : barChartState.bar_chart_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.labels) || ((_e = (_d = (_c = barChartState === null || barChartState === void 0 ? void 0 : barChartState.state) === null || _c === void 0 ? void 0 : _c.bar_chart_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.labels) || [];
|
|
36042
36122
|
const values = ((_g = (_f = barChartState === null || barChartState === void 0 ? void 0 : barChartState.bar_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.values) || ((_k = (_j = (_h = barChartState === null || barChartState === void 0 ? void 0 : barChartState.state) === null || _h === void 0 ? void 0 : _h.bar_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.values) || [];
|
|
36043
36123
|
const chartTitle = ((_l = barChartState === null || barChartState === void 0 ? void 0 : barChartState.bar_chart_data) === null || _l === void 0 ? void 0 : _l.title) || ((_o = (_m = barChartState === null || barChartState === void 0 ? void 0 : barChartState.state) === null || _m === void 0 ? void 0 : _m.bar_chart_data) === null || _o === void 0 ? void 0 : _o.title) || "";
|
|
36044
36124
|
values.length > 0 ? Math.max(...values) : 0;
|
|
36045
36125
|
const isEmpty = labels.length === 0 || values.length === 0;
|
|
36046
|
-
const clearChat = async () => {
|
|
36047
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36048
|
-
return;
|
|
36049
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36050
|
-
try {
|
|
36051
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36052
|
-
method: 'POST',
|
|
36053
|
-
headers: {
|
|
36054
|
-
'Content-Type': 'application/json',
|
|
36055
|
-
},
|
|
36056
|
-
body: JSON.stringify({
|
|
36057
|
-
session_id: widgetId,
|
|
36058
|
-
delete_state: true
|
|
36059
|
-
}),
|
|
36060
|
-
});
|
|
36061
|
-
// Clear chart state directly after clearing chat
|
|
36062
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36063
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36064
|
-
}
|
|
36065
|
-
catch (error) {
|
|
36066
|
-
console.error('Failed to clear chat:', error);
|
|
36067
|
-
}
|
|
36068
|
-
};
|
|
36069
36126
|
const handleRefresh = async () => {
|
|
36070
|
-
if (query) {
|
|
36071
|
-
await clearChat();
|
|
36072
|
-
// Send trigger event to clear chart state
|
|
36073
|
-
console.log('Dispatching clearChartState event for widgetId:', widgetId);
|
|
36074
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36127
|
+
if (query && widgetBackendUrl && widgetId) {
|
|
36128
|
+
await clearChat(widgetBackendUrl, widgetId);
|
|
36075
36129
|
appendMessage(new TextMessage({
|
|
36076
36130
|
content: `${query} and render data on a bar chart`,
|
|
36077
36131
|
role: Role.User,
|
|
@@ -36079,10 +36133,12 @@ function BarChartComponent({ orientation, barChartState, styles, appendMessage,
|
|
|
36079
36133
|
}
|
|
36080
36134
|
};
|
|
36081
36135
|
useEffect(() => {
|
|
36082
|
-
if (isEmpty && query && isFirstLoad && !(barChartState === null || barChartState === void 0 ? void 0 : barChartState.agent_message)) {
|
|
36136
|
+
if (isEmpty && query && isFirstLoad && !(barChartState === null || barChartState === void 0 ? void 0 : barChartState.agent_message) && !hasCalledRef.current) {
|
|
36137
|
+
// console.log('calling append message')
|
|
36138
|
+
hasCalledRef.current = true;
|
|
36083
36139
|
handleRefresh();
|
|
36084
36140
|
}
|
|
36085
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36141
|
+
}, [isEmpty, query, isFirstLoad, barChartState]);
|
|
36086
36142
|
// Start timeout when chart is empty and loading
|
|
36087
36143
|
useEffect(() => {
|
|
36088
36144
|
if (isEmpty && startLoadingTimeout && !(barChartState === null || barChartState === void 0 ? void 0 : barChartState.agent_message)) {
|
|
@@ -36092,12 +36148,11 @@ function BarChartComponent({ orientation, barChartState, styles, appendMessage,
|
|
|
36092
36148
|
clearLoadingTimeout();
|
|
36093
36149
|
}
|
|
36094
36150
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36095
|
-
const colors = ["#E4DCB8", "#DAC46C", "#808080", "#582809", "#A3ADD0", "#398E6F", "#AF123D", "#8C99C4", "#5290AC", "#8C99C4", "#601B07", "#50649D", "#B4A8A0", "#808080", "#6F2587"];
|
|
36096
36151
|
const finalColors = useMemo(() => {
|
|
36097
|
-
return shuffleColors(
|
|
36152
|
+
return shuffleColors(DEFAULT_COLORS, labels === null || labels === void 0 ? void 0 : labels.length);
|
|
36098
36153
|
}, [labels.length]);
|
|
36099
36154
|
if (isEmpty) {
|
|
36100
|
-
return (
|
|
36155
|
+
return createLoadingComponent();
|
|
36101
36156
|
}
|
|
36102
36157
|
const transformedData = {
|
|
36103
36158
|
labels: labels,
|
|
@@ -36106,10 +36161,6 @@ function BarChartComponent({ orientation, barChartState, styles, appendMessage,
|
|
|
36106
36161
|
label: chartTitle || "Data",
|
|
36107
36162
|
data: values,
|
|
36108
36163
|
backgroundColor: finalColors,
|
|
36109
|
-
// backgroundColor: labels.map((_, index) => {
|
|
36110
|
-
// const colors = ["#60a5fa", "#34d399", "#fbbf24", "#f87171", "#a78bfa", "#fb7185", "#4ade80", "#facc15"];
|
|
36111
|
-
// return colors[index % colors.length];
|
|
36112
|
-
// }),
|
|
36113
36164
|
},
|
|
36114
36165
|
],
|
|
36115
36166
|
};
|
|
@@ -36117,33 +36168,11 @@ function BarChartComponent({ orientation, barChartState, styles, appendMessage,
|
|
|
36117
36168
|
}
|
|
36118
36169
|
function SeriesBarChartComponent({ orientation, seriesBarChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36119
36170
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
36171
|
+
const hasCalledRef = useRef(false);
|
|
36120
36172
|
const labels = ((_b = (_a = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.series_bar_chart_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.labels) || ((_e = (_d = (_c = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.state) === null || _c === void 0 ? void 0 : _c.series_bar_chart_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.labels) || [];
|
|
36121
36173
|
const series = ((_g = (_f = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.series_bar_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.series) || ((_k = (_j = (_h = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.state) === null || _h === void 0 ? void 0 : _h.series_bar_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.series) || [];
|
|
36122
36174
|
const chartTitle = ((_l = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.series_bar_chart_data) === null || _l === void 0 ? void 0 : _l.title) || ((_o = (_m = seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.state) === null || _m === void 0 ? void 0 : _m.series_bar_chart_data) === null || _o === void 0 ? void 0 : _o.title) || "";
|
|
36123
36175
|
const isEmpty = labels.length === 0 || series.length === 0;
|
|
36124
|
-
const clearChat = async () => {
|
|
36125
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36126
|
-
return;
|
|
36127
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36128
|
-
try {
|
|
36129
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36130
|
-
method: 'POST',
|
|
36131
|
-
headers: {
|
|
36132
|
-
'Content-Type': 'application/json',
|
|
36133
|
-
},
|
|
36134
|
-
body: JSON.stringify({
|
|
36135
|
-
session_id: widgetId,
|
|
36136
|
-
delete_state: true
|
|
36137
|
-
}),
|
|
36138
|
-
});
|
|
36139
|
-
// Clear chart state directly after clearing chat
|
|
36140
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36141
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36142
|
-
}
|
|
36143
|
-
catch (error) {
|
|
36144
|
-
console.error('Failed to clear chat:', error);
|
|
36145
|
-
}
|
|
36146
|
-
};
|
|
36147
36176
|
const handleRefresh = async () => {
|
|
36148
36177
|
if (query) {
|
|
36149
36178
|
await clearChat();
|
|
@@ -36157,10 +36186,11 @@ function SeriesBarChartComponent({ orientation, seriesBarChartState, styles, app
|
|
|
36157
36186
|
}
|
|
36158
36187
|
};
|
|
36159
36188
|
useEffect(() => {
|
|
36160
|
-
if (isEmpty && query && isFirstLoad && !(seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.agent_message)) {
|
|
36189
|
+
if (isEmpty && query && isFirstLoad && !(seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.agent_message) && !hasCalledRef.current) {
|
|
36190
|
+
hasCalledRef.current = true;
|
|
36161
36191
|
handleRefresh();
|
|
36162
36192
|
}
|
|
36163
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36193
|
+
}, [isEmpty, query, isFirstLoad, seriesBarChartState]);
|
|
36164
36194
|
// Start timeout when chart is empty and loading
|
|
36165
36195
|
useEffect(() => {
|
|
36166
36196
|
if (isEmpty && startLoadingTimeout && !(seriesBarChartState === null || seriesBarChartState === void 0 ? void 0 : seriesBarChartState.agent_message)) {
|
|
@@ -36170,12 +36200,11 @@ function SeriesBarChartComponent({ orientation, seriesBarChartState, styles, app
|
|
|
36170
36200
|
clearLoadingTimeout();
|
|
36171
36201
|
}
|
|
36172
36202
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36173
|
-
const colors = ["#E4DCB8", "#DAC46C", "#808080", "#582809", "#A3ADD0", "#398E6F", "#AF123D", "#8C99C4", "#5290AC", "#8C99C4", "#601B07", "#50649D", "#B4A8A0", "#808080", "#6F2587"];
|
|
36174
36203
|
const finalColors = useMemo(() => {
|
|
36175
|
-
return shuffleColors(
|
|
36204
|
+
return shuffleColors(DEFAULT_COLORS, series === null || series === void 0 ? void 0 : series.length);
|
|
36176
36205
|
}, [series.length]);
|
|
36177
36206
|
if (isEmpty) {
|
|
36178
|
-
return (
|
|
36207
|
+
return createLoadingComponent();
|
|
36179
36208
|
}
|
|
36180
36209
|
const transformedData = {
|
|
36181
36210
|
labels: labels,
|
|
@@ -36189,33 +36218,11 @@ function SeriesBarChartComponent({ orientation, seriesBarChartState, styles, app
|
|
|
36189
36218
|
}
|
|
36190
36219
|
function SeriesLineChartComponent({ orientation, seriesLineChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36191
36220
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
36221
|
+
const hasCalledRef = useRef(false);
|
|
36192
36222
|
const labels = ((_b = (_a = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.series_bar_chart_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.labels) || ((_e = (_d = (_c = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.state) === null || _c === void 0 ? void 0 : _c.series_bar_chart_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.labels) || [];
|
|
36193
36223
|
const series = ((_g = (_f = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.series_bar_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.series) || ((_k = (_j = (_h = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.state) === null || _h === void 0 ? void 0 : _h.series_bar_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.series) || [];
|
|
36194
36224
|
const chartTitle = ((_l = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.series_bar_chart_data) === null || _l === void 0 ? void 0 : _l.title) || ((_o = (_m = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.state) === null || _m === void 0 ? void 0 : _m.series_bar_chart_data) === null || _o === void 0 ? void 0 : _o.title) || "";
|
|
36195
36225
|
const isEmpty = labels.length === 0 || series.length === 0;
|
|
36196
|
-
const clearChat = async () => {
|
|
36197
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36198
|
-
return;
|
|
36199
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36200
|
-
try {
|
|
36201
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36202
|
-
method: 'POST',
|
|
36203
|
-
headers: {
|
|
36204
|
-
'Content-Type': 'application/json',
|
|
36205
|
-
},
|
|
36206
|
-
body: JSON.stringify({
|
|
36207
|
-
session_id: widgetId,
|
|
36208
|
-
delete_state: true
|
|
36209
|
-
}),
|
|
36210
|
-
});
|
|
36211
|
-
// Clear chart state directly after clearing chat
|
|
36212
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36213
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36214
|
-
}
|
|
36215
|
-
catch (error) {
|
|
36216
|
-
console.error('Failed to clear chat:', error);
|
|
36217
|
-
}
|
|
36218
|
-
};
|
|
36219
36226
|
const handleRefresh = async () => {
|
|
36220
36227
|
if (query) {
|
|
36221
36228
|
await clearChat();
|
|
@@ -36229,10 +36236,11 @@ function SeriesLineChartComponent({ orientation, seriesLineChartState, styles, a
|
|
|
36229
36236
|
}
|
|
36230
36237
|
};
|
|
36231
36238
|
useEffect(() => {
|
|
36232
|
-
if (isEmpty && query && isFirstLoad && !(seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.agent_message)) {
|
|
36239
|
+
if (isEmpty && query && isFirstLoad && !(seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.agent_message) && !hasCalledRef.current) {
|
|
36240
|
+
hasCalledRef.current = true;
|
|
36233
36241
|
handleRefresh();
|
|
36234
36242
|
}
|
|
36235
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36243
|
+
}, [isEmpty, query, isFirstLoad, seriesLineChartState]);
|
|
36236
36244
|
// Start timeout when chart is empty and loading
|
|
36237
36245
|
useEffect(() => {
|
|
36238
36246
|
if (isEmpty && startLoadingTimeout && !(seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.agent_message)) {
|
|
@@ -36242,12 +36250,11 @@ function SeriesLineChartComponent({ orientation, seriesLineChartState, styles, a
|
|
|
36242
36250
|
clearLoadingTimeout();
|
|
36243
36251
|
}
|
|
36244
36252
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36245
|
-
const colors = ["#243D84", "#69238B", "#4A959F", "#D0A677", "#B31E47", "#396431", "#E4DCB8", "#DAC46C", "#808080", "#582809", "#A3ADD0", "#398E6F", "#AF123D", "#8C99C4", "#5290AC"];
|
|
36246
36253
|
const finalColors = useMemo(() => {
|
|
36247
|
-
return shuffleColors(
|
|
36254
|
+
return shuffleColors([...LINE_COLORS, ...DEFAULT_COLORS], series === null || series === void 0 ? void 0 : series.length);
|
|
36248
36255
|
}, [series.length]);
|
|
36249
36256
|
if (isEmpty) {
|
|
36250
|
-
return (
|
|
36257
|
+
return createLoadingComponent();
|
|
36251
36258
|
}
|
|
36252
36259
|
const transformedData = {
|
|
36253
36260
|
labels: labels,
|
|
@@ -36268,34 +36275,12 @@ function SeriesLineChartComponent({ orientation, seriesLineChartState, styles, a
|
|
|
36268
36275
|
}
|
|
36269
36276
|
function PieChartComponent({ pieChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36270
36277
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
36278
|
+
const hasCalledRef = useRef(false);
|
|
36271
36279
|
const labels = ((_b = (_a = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.pie_chart_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.labels) || ((_e = (_d = (_c = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.state) === null || _c === void 0 ? void 0 : _c.pie_chart_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.labels) || [];
|
|
36272
36280
|
const values = ((_g = (_f = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.pie_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.values) || ((_k = (_j = (_h = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.state) === null || _h === void 0 ? void 0 : _h.pie_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.values) || [];
|
|
36273
36281
|
((_m = (_l = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.pie_chart_data) === null || _l === void 0 ? void 0 : _l.data) === null || _m === void 0 ? void 0 : _m.percentages) || ((_q = (_p = (_o = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.state) === null || _o === void 0 ? void 0 : _o.pie_chart_data) === null || _p === void 0 ? void 0 : _p.data) === null || _q === void 0 ? void 0 : _q.percentages) || [];
|
|
36274
36282
|
const chartTitle = ((_r = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.pie_chart_data) === null || _r === void 0 ? void 0 : _r.title) || ((_t = (_s = pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.state) === null || _s === void 0 ? void 0 : _s.pie_chart_data) === null || _t === void 0 ? void 0 : _t.title) || "";
|
|
36275
36283
|
const isEmpty = labels.length === 0 || values.length === 0;
|
|
36276
|
-
const clearChat = async () => {
|
|
36277
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36278
|
-
return;
|
|
36279
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36280
|
-
try {
|
|
36281
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36282
|
-
method: 'POST',
|
|
36283
|
-
headers: {
|
|
36284
|
-
'Content-Type': 'application/json',
|
|
36285
|
-
},
|
|
36286
|
-
body: JSON.stringify({
|
|
36287
|
-
session_id: widgetId,
|
|
36288
|
-
delete_state: true
|
|
36289
|
-
}),
|
|
36290
|
-
});
|
|
36291
|
-
// Clear chart state directly after clearing chat
|
|
36292
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36293
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36294
|
-
}
|
|
36295
|
-
catch (error) {
|
|
36296
|
-
console.error('Failed to clear chat:', error);
|
|
36297
|
-
}
|
|
36298
|
-
};
|
|
36299
36284
|
const handleRefresh = async () => {
|
|
36300
36285
|
if (query) {
|
|
36301
36286
|
await clearChat();
|
|
@@ -36309,10 +36294,11 @@ function PieChartComponent({ pieChartState, styles, appendMessage, query, isFirs
|
|
|
36309
36294
|
}
|
|
36310
36295
|
};
|
|
36311
36296
|
useEffect(() => {
|
|
36312
|
-
if (isEmpty && query && isFirstLoad && !(pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.agent_message)) {
|
|
36297
|
+
if (isEmpty && query && isFirstLoad && !(pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.agent_message) && !hasCalledRef.current) {
|
|
36298
|
+
hasCalledRef.current = true;
|
|
36313
36299
|
handleRefresh();
|
|
36314
36300
|
}
|
|
36315
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36301
|
+
}, [isEmpty, query, isFirstLoad, pieChartState]);
|
|
36316
36302
|
// Start timeout when chart is empty and loading
|
|
36317
36303
|
useEffect(() => {
|
|
36318
36304
|
if (isEmpty && startLoadingTimeout && !(pieChartState === null || pieChartState === void 0 ? void 0 : pieChartState.agent_message)) {
|
|
@@ -36322,23 +36308,12 @@ function PieChartComponent({ pieChartState, styles, appendMessage, query, isFirs
|
|
|
36322
36308
|
clearLoadingTimeout();
|
|
36323
36309
|
}
|
|
36324
36310
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36325
|
-
const palette = ["#E4DCB8", "#DAC46C", "#808080", "#A3ADD0", "#398E6F", "#AF123D", "#8C99C4", "#5290AC", "#601B07", "#50649D", "#B4A8A0", "#808080", "#6F2587"];
|
|
36326
36311
|
const backgroundColors = useMemo(() => {
|
|
36327
|
-
return shuffleColorsWithPriority(
|
|
36312
|
+
return shuffleColorsWithPriority(DEFAULT_COLORS, labels.length, ["#7B0D3F"]);
|
|
36328
36313
|
}, [labels.length]);
|
|
36329
36314
|
if (isEmpty) {
|
|
36330
|
-
return (
|
|
36331
|
-
}
|
|
36332
|
-
// const borderColors = [
|
|
36333
|
-
// "rgba(255, 99, 132, 1)",
|
|
36334
|
-
// "rgba(54, 162, 235, 1)",
|
|
36335
|
-
// "rgba(255, 206, 86, 1)",
|
|
36336
|
-
// "rgba(75, 192, 192, 1)",
|
|
36337
|
-
// "rgba(153, 102, 255, 1)",
|
|
36338
|
-
// "rgba(255, 159, 64, 1)",
|
|
36339
|
-
// "rgba(199, 199, 199, 1)",
|
|
36340
|
-
// "rgba(83, 102, 255, 1)",
|
|
36341
|
-
// ];
|
|
36315
|
+
return createLoadingComponent();
|
|
36316
|
+
}
|
|
36342
36317
|
const transformedData = {
|
|
36343
36318
|
labels: labels,
|
|
36344
36319
|
datasets: [
|
|
@@ -36346,7 +36321,6 @@ function PieChartComponent({ pieChartState, styles, appendMessage, query, isFirs
|
|
|
36346
36321
|
label: chartTitle || "Data",
|
|
36347
36322
|
data: values,
|
|
36348
36323
|
backgroundColor: labels.map((_, index) => backgroundColors[index % backgroundColors.length]),
|
|
36349
|
-
// borderColor: labels.map((_, index) => borderColors[index % borderColors.length]),
|
|
36350
36324
|
borderWidth: 0,
|
|
36351
36325
|
},
|
|
36352
36326
|
],
|
|
@@ -36355,40 +36329,15 @@ function PieChartComponent({ pieChartState, styles, appendMessage, query, isFirs
|
|
|
36355
36329
|
}
|
|
36356
36330
|
function LineChartComponent({ lineChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36357
36331
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
36332
|
+
const hasCalledRef = useRef(false);
|
|
36358
36333
|
const labels = ((_b = (_a = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.bar_chart_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.labels) || ((_e = (_d = (_c = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.state) === null || _c === void 0 ? void 0 : _c.bar_chart_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.labels) || [];
|
|
36359
36334
|
const values = ((_g = (_f = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.bar_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.values) || ((_k = (_j = (_h = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.state) === null || _h === void 0 ? void 0 : _h.bar_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.values) || [];
|
|
36360
36335
|
const chartTitle = ((_l = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.bar_chart_data) === null || _l === void 0 ? void 0 : _l.title) || ((_o = (_m = lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.state) === null || _m === void 0 ? void 0 : _m.bar_chart_data) === null || _o === void 0 ? void 0 : _o.title) || "";
|
|
36361
36336
|
values.length > 0 ? Math.max(...values) : 0;
|
|
36362
36337
|
const isEmpty = labels.length === 0 || values.length === 0;
|
|
36363
|
-
const clearChat = async () => {
|
|
36364
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36365
|
-
return;
|
|
36366
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36367
|
-
try {
|
|
36368
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36369
|
-
method: 'POST',
|
|
36370
|
-
headers: {
|
|
36371
|
-
'Content-Type': 'application/json',
|
|
36372
|
-
},
|
|
36373
|
-
body: JSON.stringify({
|
|
36374
|
-
session_id: widgetId,
|
|
36375
|
-
delete_state: true
|
|
36376
|
-
}),
|
|
36377
|
-
});
|
|
36378
|
-
// Clear chart state directly after clearing chat
|
|
36379
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36380
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36381
|
-
}
|
|
36382
|
-
catch (error) {
|
|
36383
|
-
console.error('Failed to clear chat:', error);
|
|
36384
|
-
}
|
|
36385
|
-
};
|
|
36386
36338
|
const handleRefresh = async () => {
|
|
36387
|
-
if (query) {
|
|
36388
|
-
await clearChat();
|
|
36389
|
-
// Send trigger event to clear chart state
|
|
36390
|
-
console.log('Dispatching clearChartState event for widgetId:', widgetId);
|
|
36391
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36339
|
+
if (query && widgetBackendUrl && widgetId) {
|
|
36340
|
+
await clearChat(widgetBackendUrl, widgetId);
|
|
36392
36341
|
appendMessage(new TextMessage({
|
|
36393
36342
|
content: `${query} and render data on a bar chart`,
|
|
36394
36343
|
role: Role.User,
|
|
@@ -36396,10 +36345,11 @@ function LineChartComponent({ lineChartState, styles, appendMessage, query, isFi
|
|
|
36396
36345
|
}
|
|
36397
36346
|
};
|
|
36398
36347
|
useEffect(() => {
|
|
36399
|
-
if (isEmpty && query && isFirstLoad && !(lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.agent_message)) {
|
|
36348
|
+
if (isEmpty && query && isFirstLoad && !(lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.agent_message) && !hasCalledRef.current) {
|
|
36349
|
+
hasCalledRef.current = true;
|
|
36400
36350
|
handleRefresh();
|
|
36401
36351
|
}
|
|
36402
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36352
|
+
}, [isEmpty, query, isFirstLoad, lineChartState]);
|
|
36403
36353
|
// Start timeout when chart is empty and loading
|
|
36404
36354
|
useEffect(() => {
|
|
36405
36355
|
if (isEmpty && startLoadingTimeout && !(lineChartState === null || lineChartState === void 0 ? void 0 : lineChartState.agent_message)) {
|
|
@@ -36409,19 +36359,11 @@ function LineChartComponent({ lineChartState, styles, appendMessage, query, isFi
|
|
|
36409
36359
|
clearLoadingTimeout();
|
|
36410
36360
|
}
|
|
36411
36361
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36412
|
-
const colors = [
|
|
36413
|
-
"#243D84",
|
|
36414
|
-
"#69238B",
|
|
36415
|
-
"#4A959F",
|
|
36416
|
-
"#D0A677",
|
|
36417
|
-
"#B31E47",
|
|
36418
|
-
"#396431",
|
|
36419
|
-
];
|
|
36420
36362
|
const lineColor = useMemo(() => {
|
|
36421
|
-
return
|
|
36363
|
+
return LINE_COLORS[Math.floor(Math.random() * LINE_COLORS.length)];
|
|
36422
36364
|
}, [labels.length]);
|
|
36423
36365
|
if (isEmpty) {
|
|
36424
|
-
return (
|
|
36366
|
+
return createLoadingComponent();
|
|
36425
36367
|
}
|
|
36426
36368
|
const transformedData = {
|
|
36427
36369
|
labels: labels,
|
|
@@ -36443,33 +36385,11 @@ function LineChartComponent({ lineChartState, styles, appendMessage, query, isFi
|
|
|
36443
36385
|
}
|
|
36444
36386
|
function DataGridComponent({ dataGridState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36445
36387
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
36388
|
+
const hasCalledRef = useRef(false);
|
|
36446
36389
|
const columns = ((_b = (_a = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.matrix_grid_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.headers) || ((_e = (_d = (_c = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.state) === null || _c === void 0 ? void 0 : _c.matrix_grid_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.headers) || [];
|
|
36447
36390
|
const rows = ((_g = (_f = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.matrix_grid_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.rows) || ((_k = (_j = (_h = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.state) === null || _h === void 0 ? void 0 : _h.matrix_grid_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.rows) || [];
|
|
36448
36391
|
const gridTitle = ((_l = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.matrix_grid_data) === null || _l === void 0 ? void 0 : _l.title) || ((_o = (_m = dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.state) === null || _m === void 0 ? void 0 : _m.matrix_grid_data) === null || _o === void 0 ? void 0 : _o.title) || "";
|
|
36449
36392
|
const isEmpty = columns.length === 0 || rows.length === 0;
|
|
36450
|
-
const clearChat = async () => {
|
|
36451
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36452
|
-
return;
|
|
36453
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36454
|
-
try {
|
|
36455
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36456
|
-
method: 'POST',
|
|
36457
|
-
headers: {
|
|
36458
|
-
'Content-Type': 'application/json',
|
|
36459
|
-
},
|
|
36460
|
-
body: JSON.stringify({
|
|
36461
|
-
session_id: widgetId,
|
|
36462
|
-
delete_state: true
|
|
36463
|
-
}),
|
|
36464
|
-
});
|
|
36465
|
-
// Clear chart state directly after clearing chat
|
|
36466
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36467
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36468
|
-
}
|
|
36469
|
-
catch (error) {
|
|
36470
|
-
console.error('Failed to clear chat:', error);
|
|
36471
|
-
}
|
|
36472
|
-
};
|
|
36473
36393
|
const handleRefresh = async () => {
|
|
36474
36394
|
if (query) {
|
|
36475
36395
|
await clearChat();
|
|
@@ -36483,10 +36403,11 @@ function DataGridComponent({ dataGridState, styles, appendMessage, query, isFirs
|
|
|
36483
36403
|
}
|
|
36484
36404
|
};
|
|
36485
36405
|
useEffect(() => {
|
|
36486
|
-
if (isEmpty && query && isFirstLoad && !(dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.agent_message)) {
|
|
36406
|
+
if (isEmpty && query && isFirstLoad && !(dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.agent_message) && !hasCalledRef.current) {
|
|
36407
|
+
hasCalledRef.current = true;
|
|
36487
36408
|
handleRefresh();
|
|
36488
36409
|
}
|
|
36489
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36410
|
+
}, [isEmpty, query, isFirstLoad, dataGridState]);
|
|
36490
36411
|
// Start timeout when chart is empty and loading
|
|
36491
36412
|
useEffect(() => {
|
|
36492
36413
|
if (isEmpty && startLoadingTimeout && !(dataGridState === null || dataGridState === void 0 ? void 0 : dataGridState.agent_message)) {
|
|
@@ -36497,7 +36418,7 @@ function DataGridComponent({ dataGridState, styles, appendMessage, query, isFirs
|
|
|
36497
36418
|
}
|
|
36498
36419
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36499
36420
|
if (isEmpty) {
|
|
36500
|
-
return (
|
|
36421
|
+
return createLoadingComponent("Loading table data...");
|
|
36501
36422
|
}
|
|
36502
36423
|
const transformedData = {
|
|
36503
36424
|
columns: columns,
|
|
@@ -36507,34 +36428,12 @@ function DataGridComponent({ dataGridState, styles, appendMessage, query, isFirs
|
|
|
36507
36428
|
}
|
|
36508
36429
|
function SummaryComponent({ summaryState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout, setChartState, widget_ids }) {
|
|
36509
36430
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
36431
|
+
const hasCalledRef = useRef(false);
|
|
36510
36432
|
const content = ((_b = (_a = summaryState === null || summaryState === void 0 ? void 0 : summaryState.summary_data) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.content) || ((_e = (_d = (_c = summaryState === null || summaryState === void 0 ? void 0 : summaryState.state) === null || _c === void 0 ? void 0 : _c.summary_data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.content) || "";
|
|
36511
36433
|
const title = ((_f = summaryState === null || summaryState === void 0 ? void 0 : summaryState.summary_data) === null || _f === void 0 ? void 0 : _f.title) || ((_h = (_g = summaryState === null || summaryState === void 0 ? void 0 : summaryState.state) === null || _g === void 0 ? void 0 : _g.summary_data) === null || _h === void 0 ? void 0 : _h.title) || "";
|
|
36512
36434
|
const data = ((_j = summaryState === null || summaryState === void 0 ? void 0 : summaryState.summary_data) === null || _j === void 0 ? void 0 : _j.data) || ((_l = (_k = summaryState === null || summaryState === void 0 ? void 0 : summaryState.state) === null || _k === void 0 ? void 0 : _k.summary_data) === null || _l === void 0 ? void 0 : _l.data) || null;
|
|
36513
36435
|
const metadata = ((_m = summaryState === null || summaryState === void 0 ? void 0 : summaryState.summary_data) === null || _m === void 0 ? void 0 : _m.metadata) || ((_p = (_o = summaryState === null || summaryState === void 0 ? void 0 : summaryState.state) === null || _o === void 0 ? void 0 : _o.summary_data) === null || _p === void 0 ? void 0 : _p.metadata) || null;
|
|
36514
36436
|
const isEmpty = !content || content.trim() === "";
|
|
36515
|
-
const clearChat = async () => {
|
|
36516
|
-
if (!widgetBackendUrl || !widgetId)
|
|
36517
|
-
return;
|
|
36518
|
-
console.log('clearChat called for widgetId:', widgetId);
|
|
36519
|
-
try {
|
|
36520
|
-
await fetch(`${widgetBackendUrl}/api/clear-chat`, {
|
|
36521
|
-
method: 'POST',
|
|
36522
|
-
headers: {
|
|
36523
|
-
'Content-Type': 'application/json',
|
|
36524
|
-
},
|
|
36525
|
-
body: JSON.stringify({
|
|
36526
|
-
session_id: widgetId,
|
|
36527
|
-
delete_state: true
|
|
36528
|
-
}),
|
|
36529
|
-
});
|
|
36530
|
-
// Clear chart state directly after clearing chat
|
|
36531
|
-
console.log('Dispatching clearChartState event from clearChat for widgetId:', widgetId);
|
|
36532
|
-
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId } }));
|
|
36533
|
-
}
|
|
36534
|
-
catch (error) {
|
|
36535
|
-
console.error('Failed to clear chat:', error);
|
|
36536
|
-
}
|
|
36537
|
-
};
|
|
36538
36437
|
const handleRefresh = async () => {
|
|
36539
36438
|
if (query) {
|
|
36540
36439
|
await clearChat();
|
|
@@ -36548,13 +36447,14 @@ function SummaryComponent({ summaryState, styles, appendMessage, query, isFirstL
|
|
|
36548
36447
|
}
|
|
36549
36448
|
};
|
|
36550
36449
|
useEffect(() => {
|
|
36551
|
-
if (isEmpty && query && isFirstLoad && !(summaryState === null || summaryState === void 0 ? void 0 : summaryState.agent_message)) {
|
|
36450
|
+
if (isEmpty && query && isFirstLoad && !(summaryState === null || summaryState === void 0 ? void 0 : summaryState.agent_message) && !hasCalledRef.current) {
|
|
36451
|
+
hasCalledRef.current = true;
|
|
36552
36452
|
setChartState(prevState => (Object.assign(Object.assign({}, prevState), { widget_ids: widget_ids })));
|
|
36553
36453
|
setTimeout(() => {
|
|
36554
36454
|
handleRefresh();
|
|
36555
36455
|
}, 500);
|
|
36556
36456
|
}
|
|
36557
|
-
}, [isEmpty, query, isFirstLoad]);
|
|
36457
|
+
}, [isEmpty, query, isFirstLoad, summaryState]);
|
|
36558
36458
|
// Start timeout when summary is empty and loading
|
|
36559
36459
|
useEffect(() => {
|
|
36560
36460
|
if (isEmpty && startLoadingTimeout && !(summaryState === null || summaryState === void 0 ? void 0 : summaryState.agent_message)) {
|
|
@@ -36565,202 +36465,24 @@ function SummaryComponent({ summaryState, styles, appendMessage, query, isFirstL
|
|
|
36565
36465
|
}
|
|
36566
36466
|
}, [isEmpty, startLoadingTimeout, clearLoadingTimeout]);
|
|
36567
36467
|
if (isEmpty) {
|
|
36568
|
-
return (
|
|
36468
|
+
return createLoadingComponent("Loading summary...");
|
|
36569
36469
|
}
|
|
36570
36470
|
return (jsxRuntimeExports.jsx(SummaryWidget, { title: title, data: data, metadata: metadata, className: "" }));
|
|
36571
36471
|
}
|
|
36572
|
-
function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds, widgetBackendUrl }) {
|
|
36573
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31
|
|
36472
|
+
function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds, widgetBackendUrl, datasetId }) {
|
|
36473
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31;
|
|
36574
36474
|
const agentType = (_a = widget.config) === null || _a === void 0 ? void 0 : _a.agentType;
|
|
36575
36475
|
const orientation = (_b = widget.config) === null || _b === void 0 ? void 0 : _b.orientation;
|
|
36576
36476
|
const isFirstLoad = (_c = widget.config) === null || _c === void 0 ? void 0 : _c.isFirstLoad;
|
|
36577
36477
|
const { threadId, setThreadId } = useCopilotContext();
|
|
36578
36478
|
const timeoutRef = useRef(null);
|
|
36579
36479
|
const [isTimeoutTriggered, setIsTimeoutTriggered] = useState(false);
|
|
36580
|
-
const [timeoutCount, setTimeoutCount] = useState(0);
|
|
36581
36480
|
useEffect(() => {
|
|
36582
36481
|
setThreadId(widget.id);
|
|
36583
36482
|
}, [widget.id, setThreadId]);
|
|
36584
|
-
const getInitialState = () => {
|
|
36585
|
-
if (agentType === "Pie Chart Agent") {
|
|
36586
|
-
return {
|
|
36587
|
-
pie_chart_data: {
|
|
36588
|
-
title: "",
|
|
36589
|
-
type: "pie",
|
|
36590
|
-
chart_type: "financial",
|
|
36591
|
-
data: {
|
|
36592
|
-
labels: [],
|
|
36593
|
-
values: [],
|
|
36594
|
-
percentages: [],
|
|
36595
|
-
total: 0
|
|
36596
|
-
},
|
|
36597
|
-
metadata: {
|
|
36598
|
-
categories: 0,
|
|
36599
|
-
largest_category: "",
|
|
36600
|
-
largest_value: 0,
|
|
36601
|
-
largest_percentage: 0
|
|
36602
|
-
}
|
|
36603
|
-
}
|
|
36604
|
-
};
|
|
36605
|
-
}
|
|
36606
|
-
else if (agentType === "Line Chart Agent") {
|
|
36607
|
-
return {
|
|
36608
|
-
bar_chart_data: {
|
|
36609
|
-
title: "",
|
|
36610
|
-
type: "line",
|
|
36611
|
-
chart_type: "financial",
|
|
36612
|
-
orientation: "horizontal",
|
|
36613
|
-
data: {
|
|
36614
|
-
labels: [],
|
|
36615
|
-
values: [],
|
|
36616
|
-
total: 0,
|
|
36617
|
-
average: 0
|
|
36618
|
-
},
|
|
36619
|
-
metadata: {
|
|
36620
|
-
categories: 0,
|
|
36621
|
-
highest_category: "",
|
|
36622
|
-
highest_value: 0,
|
|
36623
|
-
lowest_category: "",
|
|
36624
|
-
lowest_value: 0,
|
|
36625
|
-
range: 0
|
|
36626
|
-
}
|
|
36627
|
-
},
|
|
36628
|
-
dataset_id: "home_generation_dataset"
|
|
36629
|
-
};
|
|
36630
|
-
}
|
|
36631
|
-
else if (agentType === "Data Grid Agent") {
|
|
36632
|
-
return {
|
|
36633
|
-
matrix_grid_data: {
|
|
36634
|
-
title: "",
|
|
36635
|
-
type: "data_grid",
|
|
36636
|
-
data: {
|
|
36637
|
-
headers: [],
|
|
36638
|
-
rows: [],
|
|
36639
|
-
"row_count": 0,
|
|
36640
|
-
"column_count": 0
|
|
36641
|
-
},
|
|
36642
|
-
metadata: {
|
|
36643
|
-
total_rows: 0,
|
|
36644
|
-
total_columns: 0,
|
|
36645
|
-
numeric_columns: []
|
|
36646
|
-
}
|
|
36647
|
-
},
|
|
36648
|
-
dataset_id: "home_generation_dataset"
|
|
36649
|
-
};
|
|
36650
|
-
}
|
|
36651
|
-
else if (agentType === "Bar Chart Agent") {
|
|
36652
|
-
return {
|
|
36653
|
-
bar_chart_data: {
|
|
36654
|
-
title: "",
|
|
36655
|
-
type: "bar",
|
|
36656
|
-
chart_type: "financial",
|
|
36657
|
-
orientation: "vertical",
|
|
36658
|
-
data: {
|
|
36659
|
-
labels: [],
|
|
36660
|
-
values: [],
|
|
36661
|
-
total: 0,
|
|
36662
|
-
average: 0
|
|
36663
|
-
},
|
|
36664
|
-
metadata: {
|
|
36665
|
-
categories: 0,
|
|
36666
|
-
highest_category: "",
|
|
36667
|
-
highest_value: 0,
|
|
36668
|
-
lowest_category: "",
|
|
36669
|
-
lowest_value: 0,
|
|
36670
|
-
range: 0
|
|
36671
|
-
}
|
|
36672
|
-
},
|
|
36673
|
-
dataset_id: "home_generation_dataset"
|
|
36674
|
-
};
|
|
36675
|
-
}
|
|
36676
|
-
else if (agentType === "Series Bar Chart Agent") {
|
|
36677
|
-
return {
|
|
36678
|
-
series_bar_chart_data: {
|
|
36679
|
-
title: "",
|
|
36680
|
-
type: "series_bar",
|
|
36681
|
-
chart_type: "financial",
|
|
36682
|
-
orientation: "vertical",
|
|
36683
|
-
data: {
|
|
36684
|
-
labels: [],
|
|
36685
|
-
series: [],
|
|
36686
|
-
total: 0,
|
|
36687
|
-
average: 0
|
|
36688
|
-
},
|
|
36689
|
-
metadata: {
|
|
36690
|
-
categories: 0,
|
|
36691
|
-
series_count: 0,
|
|
36692
|
-
highest_category: "",
|
|
36693
|
-
highest_value: 0,
|
|
36694
|
-
highest_series: "",
|
|
36695
|
-
lowest_category: "",
|
|
36696
|
-
lowest_value: 0,
|
|
36697
|
-
lowest_series: "",
|
|
36698
|
-
range: 0,
|
|
36699
|
-
series_totals: {},
|
|
36700
|
-
series_averages: {}
|
|
36701
|
-
}
|
|
36702
|
-
},
|
|
36703
|
-
dataset_id: "home_generation_dataset"
|
|
36704
|
-
};
|
|
36705
|
-
}
|
|
36706
|
-
else if (agentType === "Series Line Chart Agent") {
|
|
36707
|
-
return {
|
|
36708
|
-
series_bar_chart_data: {
|
|
36709
|
-
title: "",
|
|
36710
|
-
type: "series_bar",
|
|
36711
|
-
chart_type: "financial",
|
|
36712
|
-
orientation: "vertical",
|
|
36713
|
-
data: {
|
|
36714
|
-
labels: [],
|
|
36715
|
-
series: [],
|
|
36716
|
-
total: 0,
|
|
36717
|
-
average: 0
|
|
36718
|
-
},
|
|
36719
|
-
metadata: {
|
|
36720
|
-
categories: 0,
|
|
36721
|
-
series_count: 0,
|
|
36722
|
-
highest_category: "",
|
|
36723
|
-
highest_value: 0,
|
|
36724
|
-
highest_series: "",
|
|
36725
|
-
lowest_category: "",
|
|
36726
|
-
lowest_value: 0,
|
|
36727
|
-
lowest_series: "",
|
|
36728
|
-
range: 0,
|
|
36729
|
-
series_totals: {},
|
|
36730
|
-
series_averages: {},
|
|
36731
|
-
}
|
|
36732
|
-
},
|
|
36733
|
-
dataset_id: "home_generation_dataset"
|
|
36734
|
-
};
|
|
36735
|
-
}
|
|
36736
|
-
else if (agentType === "Summary Agent") {
|
|
36737
|
-
return {
|
|
36738
|
-
summary_data: {
|
|
36739
|
-
title: "",
|
|
36740
|
-
type: "summary",
|
|
36741
|
-
data: {
|
|
36742
|
-
content: "",
|
|
36743
|
-
word_count: 0,
|
|
36744
|
-
character_count: 0,
|
|
36745
|
-
character_count_no_spaces: 0,
|
|
36746
|
-
line_count: 0
|
|
36747
|
-
},
|
|
36748
|
-
metadata: {
|
|
36749
|
-
created_at: "",
|
|
36750
|
-
content_type: "text",
|
|
36751
|
-
is_multiline: false
|
|
36752
|
-
}
|
|
36753
|
-
},
|
|
36754
|
-
dataset_id: "home_generation_dataset"
|
|
36755
|
-
};
|
|
36756
|
-
}
|
|
36757
|
-
else {
|
|
36758
|
-
return { widget_ids: widgetIds };
|
|
36759
|
-
}
|
|
36760
|
-
};
|
|
36761
36483
|
const { state: chartState, setState: setChartState } = useCoAgent({
|
|
36762
36484
|
name: (_d = widget.config) === null || _d === void 0 ? void 0 : _d.agentName,
|
|
36763
|
-
initialState:
|
|
36485
|
+
initialState: createInitialChartState(agentType || '', widgetIds, datasetId),
|
|
36764
36486
|
});
|
|
36765
36487
|
// Function to handle timeout and call loadAgentState API
|
|
36766
36488
|
const handleLoadingTimeout = useCallback(async () => {
|
|
@@ -36769,7 +36491,6 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36769
36491
|
return;
|
|
36770
36492
|
console.log('Loading timeout triggered for widget:', widget.id);
|
|
36771
36493
|
setIsTimeoutTriggered(true);
|
|
36772
|
-
setTimeoutCount(prev => prev + 1);
|
|
36773
36494
|
const agentName = ((_a = widget.config) === null || _a === void 0 ? void 0 : _a.agentName) || "adk-construction-project-agent";
|
|
36774
36495
|
const apiResponse = await loadAgentState(widgetBackendUrl, widget.id, agentName);
|
|
36775
36496
|
if (apiResponse && !(chartState === null || chartState === void 0 ? void 0 : chartState.agent_message)) {
|
|
@@ -36808,8 +36529,7 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36808
36529
|
delete_state: true
|
|
36809
36530
|
}),
|
|
36810
36531
|
});
|
|
36811
|
-
|
|
36812
|
-
setChartState(getInitialState());
|
|
36532
|
+
setChartState(createInitialChartState(agentType || '', widgetIds, datasetId));
|
|
36813
36533
|
}
|
|
36814
36534
|
catch (error) {
|
|
36815
36535
|
console.error('Failed to clear chat and state:', error);
|
|
@@ -36823,25 +36543,16 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36823
36543
|
}
|
|
36824
36544
|
};
|
|
36825
36545
|
}, []);
|
|
36826
|
-
const { appendMessage, reset
|
|
36546
|
+
const { appendMessage, reset } = useCopilotChat();
|
|
36827
36547
|
// Register the reset function with the parent component
|
|
36828
36548
|
useEffect(() => {
|
|
36829
|
-
console.log('onResetReady available:', !!onResetReady, 'reset available:', !!reset, 'widget.id:', widget.id);
|
|
36830
36549
|
if (onResetReady && reset && widget.id) {
|
|
36831
|
-
console.log('Registering reset function for widget:', widget.id);
|
|
36832
|
-
// Create a wrapped reset function that also clears chart state
|
|
36833
36550
|
const wrappedReset = () => {
|
|
36834
|
-
console.log('Reset called for widget:', widget.id);
|
|
36835
36551
|
reset();
|
|
36836
|
-
// Clear chart state after reset
|
|
36837
|
-
console.log('Dispatching clearChartState event from reset for widgetId:', widget.id);
|
|
36838
36552
|
window.dispatchEvent(new CustomEvent('clearChartState', { detail: { widgetId: widget.id } }));
|
|
36839
36553
|
};
|
|
36840
36554
|
onResetReady(widget.id, wrappedReset);
|
|
36841
36555
|
}
|
|
36842
|
-
else {
|
|
36843
|
-
console.log('Not registering reset - missing dependencies');
|
|
36844
|
-
}
|
|
36845
36556
|
}, [reset, widget.id, onResetReady]); // Removed onResetReady from deps to avoid the error
|
|
36846
36557
|
// Listen for triggerAgent events for this widget
|
|
36847
36558
|
useEffect(() => {
|
|
@@ -36879,183 +36590,10 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36879
36590
|
};
|
|
36880
36591
|
const handleClearChartState = (event) => {
|
|
36881
36592
|
const { widgetId } = event.detail;
|
|
36882
|
-
console.log('Received clearChartState event - widgetId:', widgetId, 'current widget.id:', widget.id);
|
|
36883
36593
|
if (widgetId === widget.id) {
|
|
36884
|
-
|
|
36885
|
-
// Reset chart state based on agent type with explicit initial state
|
|
36886
|
-
if (agentType === "Pie Chart Agent") {
|
|
36887
|
-
setChartState({
|
|
36888
|
-
pie_chart_data: {
|
|
36889
|
-
title: "",
|
|
36890
|
-
type: "pie",
|
|
36891
|
-
chart_type: "financial",
|
|
36892
|
-
data: {
|
|
36893
|
-
labels: [],
|
|
36894
|
-
values: [],
|
|
36895
|
-
percentages: [],
|
|
36896
|
-
total: 0
|
|
36897
|
-
},
|
|
36898
|
-
metadata: {
|
|
36899
|
-
categories: 0,
|
|
36900
|
-
largest_category: "",
|
|
36901
|
-
largest_value: 0,
|
|
36902
|
-
largest_percentage: 0
|
|
36903
|
-
}
|
|
36904
|
-
}
|
|
36905
|
-
});
|
|
36906
|
-
}
|
|
36907
|
-
else if (agentType === "Bar Chart Agent") {
|
|
36908
|
-
setChartState({
|
|
36909
|
-
bar_chart_data: {
|
|
36910
|
-
title: "",
|
|
36911
|
-
type: "bar",
|
|
36912
|
-
chart_type: "financial",
|
|
36913
|
-
orientation: "vertical",
|
|
36914
|
-
data: {
|
|
36915
|
-
labels: [],
|
|
36916
|
-
values: [],
|
|
36917
|
-
total: 0,
|
|
36918
|
-
average: 0
|
|
36919
|
-
},
|
|
36920
|
-
metadata: {
|
|
36921
|
-
categories: 0,
|
|
36922
|
-
highest_category: "",
|
|
36923
|
-
highest_value: 0,
|
|
36924
|
-
lowest_category: "",
|
|
36925
|
-
lowest_value: 0,
|
|
36926
|
-
range: 0
|
|
36927
|
-
}
|
|
36928
|
-
}
|
|
36929
|
-
});
|
|
36930
|
-
}
|
|
36931
|
-
else if (agentType === "Series Bar Chart Agent") {
|
|
36932
|
-
setChartState({
|
|
36933
|
-
series_bar_chart_data: {
|
|
36934
|
-
title: "",
|
|
36935
|
-
type: "series_bar",
|
|
36936
|
-
chart_type: "financial",
|
|
36937
|
-
orientation: "vertical",
|
|
36938
|
-
data: {
|
|
36939
|
-
labels: [],
|
|
36940
|
-
series: [],
|
|
36941
|
-
total: 0,
|
|
36942
|
-
average: 0
|
|
36943
|
-
},
|
|
36944
|
-
metadata: {
|
|
36945
|
-
categories: 0,
|
|
36946
|
-
series_count: 0,
|
|
36947
|
-
highest_category: "",
|
|
36948
|
-
highest_value: 0,
|
|
36949
|
-
highest_series: "",
|
|
36950
|
-
lowest_category: "",
|
|
36951
|
-
lowest_value: 0,
|
|
36952
|
-
lowest_series: "",
|
|
36953
|
-
range: 0,
|
|
36954
|
-
series_totals: {},
|
|
36955
|
-
series_averages: {}
|
|
36956
|
-
}
|
|
36957
|
-
}
|
|
36958
|
-
});
|
|
36959
|
-
}
|
|
36960
|
-
else if (agentType === "Series Line Chart Agent") {
|
|
36961
|
-
setChartState({
|
|
36962
|
-
series_bar_chart_data: {
|
|
36963
|
-
title: "",
|
|
36964
|
-
type: "series_bar",
|
|
36965
|
-
chart_type: "financial",
|
|
36966
|
-
orientation: "vertical",
|
|
36967
|
-
data: {
|
|
36968
|
-
labels: [],
|
|
36969
|
-
series: [],
|
|
36970
|
-
total: 0,
|
|
36971
|
-
average: 0
|
|
36972
|
-
},
|
|
36973
|
-
metadata: {
|
|
36974
|
-
categories: 0,
|
|
36975
|
-
series_count: 0,
|
|
36976
|
-
highest_category: "",
|
|
36977
|
-
highest_value: 0,
|
|
36978
|
-
highest_series: "",
|
|
36979
|
-
lowest_category: "",
|
|
36980
|
-
lowest_value: 0,
|
|
36981
|
-
lowest_series: "",
|
|
36982
|
-
range: 0,
|
|
36983
|
-
series_totals: {},
|
|
36984
|
-
series_averages: {}
|
|
36985
|
-
}
|
|
36986
|
-
}
|
|
36987
|
-
});
|
|
36988
|
-
}
|
|
36989
|
-
else if (agentType === "Line Chart Agent") {
|
|
36990
|
-
setChartState({
|
|
36991
|
-
bar_chart_data: {
|
|
36992
|
-
title: "",
|
|
36993
|
-
type: "line",
|
|
36994
|
-
chart_type: "financial",
|
|
36995
|
-
orientation: "horizontal",
|
|
36996
|
-
data: {
|
|
36997
|
-
labels: [],
|
|
36998
|
-
values: [],
|
|
36999
|
-
total: 0,
|
|
37000
|
-
average: 0
|
|
37001
|
-
},
|
|
37002
|
-
metadata: {
|
|
37003
|
-
categories: 0,
|
|
37004
|
-
highest_category: "",
|
|
37005
|
-
highest_value: 0,
|
|
37006
|
-
lowest_category: "",
|
|
37007
|
-
lowest_value: 0,
|
|
37008
|
-
range: 0
|
|
37009
|
-
}
|
|
37010
|
-
}
|
|
37011
|
-
});
|
|
37012
|
-
}
|
|
37013
|
-
else if (agentType === "Data Grid Agent") {
|
|
37014
|
-
setChartState({
|
|
37015
|
-
matrix_grid_data: {
|
|
37016
|
-
title: "",
|
|
37017
|
-
type: "data_grid",
|
|
37018
|
-
grid_type: "",
|
|
37019
|
-
data: {
|
|
37020
|
-
headers: [],
|
|
37021
|
-
rows: [],
|
|
37022
|
-
row_count: 0,
|
|
37023
|
-
column_count: 0
|
|
37024
|
-
},
|
|
37025
|
-
metadata: {
|
|
37026
|
-
total_rows: 0,
|
|
37027
|
-
total_columns: 0,
|
|
37028
|
-
numeric_columns: []
|
|
37029
|
-
}
|
|
37030
|
-
}
|
|
37031
|
-
});
|
|
37032
|
-
}
|
|
37033
|
-
else if (agentType === "Summary Agent") {
|
|
37034
|
-
setChartState({
|
|
37035
|
-
summary_data: {
|
|
37036
|
-
title: "",
|
|
37037
|
-
type: "summary",
|
|
37038
|
-
data: {
|
|
37039
|
-
content: "",
|
|
37040
|
-
word_count: 0,
|
|
37041
|
-
character_count: 0,
|
|
37042
|
-
character_count_no_spaces: 0,
|
|
37043
|
-
line_count: 0
|
|
37044
|
-
},
|
|
37045
|
-
metadata: {
|
|
37046
|
-
created_at: "",
|
|
37047
|
-
content_type: "text",
|
|
37048
|
-
is_multiline: false
|
|
37049
|
-
}
|
|
37050
|
-
}
|
|
37051
|
-
});
|
|
37052
|
-
}
|
|
37053
|
-
else {
|
|
37054
|
-
setChartState({ widget_ids: widgetIds });
|
|
37055
|
-
}
|
|
36594
|
+
setChartState(createInitialChartState(agentType || '', widgetIds, datasetId));
|
|
37056
36595
|
}
|
|
37057
36596
|
};
|
|
37058
|
-
console.log('Setting up event listeners for widget:', widget.id);
|
|
37059
36597
|
window.addEventListener('triggerAgent', handleTriggerAgent);
|
|
37060
36598
|
window.addEventListener('clearChartState', handleClearChartState);
|
|
37061
36599
|
return () => {
|
|
@@ -37063,59 +36601,22 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
37063
36601
|
window.removeEventListener('clearChartState', handleClearChartState);
|
|
37064
36602
|
};
|
|
37065
36603
|
}, [widget.id, appendMessage, agentType, setChartState]);
|
|
37066
|
-
// Monitor chartState and add manual clear functionality
|
|
37067
|
-
useEffect(() => {
|
|
37068
|
-
// Add a global function to manually clear this widget's state
|
|
37069
|
-
const clearThisWidget = () => {
|
|
37070
|
-
console.log('Manual clear triggered for widget:', widget.id);
|
|
37071
|
-
if (agentType === "Pie Chart Agent") {
|
|
37072
|
-
setChartState({
|
|
37073
|
-
pie_chart_data: {
|
|
37074
|
-
title: "",
|
|
37075
|
-
type: "pie",
|
|
37076
|
-
chart_type: "financial",
|
|
37077
|
-
data: {
|
|
37078
|
-
labels: [],
|
|
37079
|
-
values: [],
|
|
37080
|
-
percentages: [],
|
|
37081
|
-
total: 0
|
|
37082
|
-
},
|
|
37083
|
-
metadata: {
|
|
37084
|
-
categories: 0,
|
|
37085
|
-
largest_category: "",
|
|
37086
|
-
largest_value: 0,
|
|
37087
|
-
largest_percentage: 0
|
|
37088
|
-
}
|
|
37089
|
-
}
|
|
37090
|
-
});
|
|
37091
|
-
}
|
|
37092
|
-
// Add other agent types as needed
|
|
37093
|
-
};
|
|
37094
|
-
// Make it globally accessible for testing
|
|
37095
|
-
window[`clearWidget_${widget.id}`] = clearThisWidget;
|
|
37096
|
-
return () => {
|
|
37097
|
-
delete window[`clearWidget_${widget.id}`];
|
|
37098
|
-
};
|
|
37099
|
-
}, [widget.id, agentType, setChartState]);
|
|
37100
|
-
console.log('agent_message==>', chartState === null || chartState === void 0 ? void 0 : chartState.agent_message);
|
|
37101
|
-
console.log('Pie Chart Agent==>', (agentType === "Pie Chart Agent" && (!((_h = (_g = (_f = chartState.pie_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.labels) === null || _h === void 0 ? void 0 : _h.length) || !((_l = (_k = (_j = chartState.pie_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.values) === null || _l === void 0 ? void 0 : _l.length))));
|
|
37102
|
-
console.log('chartState.pie_chart_data?.data?.labels?.length==>', (_o = (_m = chartState.pie_chart_data) === null || _m === void 0 ? void 0 : _m.data) === null || _o === void 0 ? void 0 : _o.labels);
|
|
37103
36604
|
return (jsxRuntimeExports.jsxs("div", { className: cn("flex flex-col h-full"), children: [showHeader && (jsxRuntimeExports.jsx("div", { className: "flex items-center justify-between pb-2 border-b", children: jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntimeExports.jsx(Bot, { className: "h-4 w-4" }), jsxRuntimeExports.jsx("h3", { className: "text-sm font-medium", children: widget.title })] }) })), jsxRuntimeExports.jsx("div", { className: "flex-1 h-full", children: (chartState === null || chartState === void 0 ? void 0 : chartState.agent_message) && agentType !== "chatbot" && (
|
|
37104
36605
|
// Check if data is empty based on agent type
|
|
37105
|
-
(agentType === "Bar Chart Agent" && (!((
|
|
37106
|
-
(agentType === "Series Bar Chart Agent" && (!((
|
|
37107
|
-
(agentType === "Series Line Chart Agent" && (!((
|
|
37108
|
-
(agentType === "Pie Chart Agent" && (!((
|
|
37109
|
-
(agentType === "Line Chart Agent" && (!((
|
|
37110
|
-
(agentType === "Data Grid Agent" && (!((
|
|
37111
|
-
(agentType === "Summary Agent" && (!((
|
|
37112
|
-
title: ((
|
|
37113
|
-
initial: ((
|
|
36606
|
+
(agentType === "Bar Chart Agent" && (!((_h = (_g = (_f = chartState.bar_chart_data) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.labels) === null || _h === void 0 ? void 0 : _h.length) || !((_l = (_k = (_j = chartState.bar_chart_data) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.values) === null || _l === void 0 ? void 0 : _l.length))) ||
|
|
36607
|
+
(agentType === "Series Bar Chart Agent" && (!((_p = (_o = (_m = chartState.series_bar_chart_data) === null || _m === void 0 ? void 0 : _m.data) === null || _o === void 0 ? void 0 : _o.labels) === null || _p === void 0 ? void 0 : _p.length) || !((_s = (_r = (_q = chartState.series_bar_chart_data) === null || _q === void 0 ? void 0 : _q.data) === null || _r === void 0 ? void 0 : _r.series) === null || _s === void 0 ? void 0 : _s.length))) ||
|
|
36608
|
+
(agentType === "Series Line Chart Agent" && (!((_v = (_u = (_t = chartState.series_bar_chart_data) === null || _t === void 0 ? void 0 : _t.data) === null || _u === void 0 ? void 0 : _u.labels) === null || _v === void 0 ? void 0 : _v.length) || !((_y = (_x = (_w = chartState.series_bar_chart_data) === null || _w === void 0 ? void 0 : _w.data) === null || _x === void 0 ? void 0 : _x.series) === null || _y === void 0 ? void 0 : _y.length))) ||
|
|
36609
|
+
(agentType === "Pie Chart Agent" && (!((_1 = (_0 = (_z = chartState.pie_chart_data) === null || _z === void 0 ? void 0 : _z.data) === null || _0 === void 0 ? void 0 : _0.labels) === null || _1 === void 0 ? void 0 : _1.length) || !((_4 = (_3 = (_2 = chartState.pie_chart_data) === null || _2 === void 0 ? void 0 : _2.data) === null || _3 === void 0 ? void 0 : _3.values) === null || _4 === void 0 ? void 0 : _4.length))) ||
|
|
36610
|
+
(agentType === "Line Chart Agent" && (!((_7 = (_6 = (_5 = chartState.bar_chart_data) === null || _5 === void 0 ? void 0 : _5.data) === null || _6 === void 0 ? void 0 : _6.labels) === null || _7 === void 0 ? void 0 : _7.length) || !((_10 = (_9 = (_8 = chartState.bar_chart_data) === null || _8 === void 0 ? void 0 : _8.data) === null || _9 === void 0 ? void 0 : _9.values) === null || _10 === void 0 ? void 0 : _10.length))) ||
|
|
36611
|
+
(agentType === "Data Grid Agent" && (!((_13 = (_12 = (_11 = chartState.matrix_grid_data) === null || _11 === void 0 ? void 0 : _11.data) === null || _12 === void 0 ? void 0 : _12.headers) === null || _13 === void 0 ? void 0 : _13.length) || !((_16 = (_15 = (_14 = chartState.matrix_grid_data) === null || _14 === void 0 ? void 0 : _14.data) === null || _15 === void 0 ? void 0 : _15.rows) === null || _16 === void 0 ? void 0 : _16.length))) ||
|
|
36612
|
+
(agentType === "Summary Agent" && (!((_18 = (_17 = chartState.summary_data) === null || _17 === void 0 ? void 0 : _17.data) === null || _18 === void 0 ? void 0 : _18.content) || ((_21 = (_20 = (_19 = chartState.summary_data) === null || _19 === void 0 ? void 0 : _19.data) === null || _20 === void 0 ? void 0 : _20.content) === null || _21 === void 0 ? void 0 : _21.trim()) === ""))) ? (jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full p-4", children: jsxRuntimeExports.jsx("div", { className: "text-center max-w-md", children: jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-700", children: chartState.agent_message }) }) })) : agentType === "Bar Chart Agent" ? (jsxRuntimeExports.jsx(BarChartComponent, { barChartState: chartState, styles: styles, orientation: orientation, appendMessage: appendMessage, query: (_22 = widget.config) === null || _22 === void 0 ? void 0 : _22.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Series Bar Chart Agent" ? (jsxRuntimeExports.jsx(SeriesBarChartComponent, { seriesBarChartState: chartState, styles: styles, orientation: orientation, appendMessage: appendMessage, query: (_23 = widget.config) === null || _23 === void 0 ? void 0 : _23.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Series Line Chart Agent" ? (jsxRuntimeExports.jsx(SeriesLineChartComponent, { seriesLineChartState: chartState, styles: styles, orientation: orientation, appendMessage: appendMessage, query: (_24 = widget.config) === null || _24 === void 0 ? void 0 : _24.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Pie Chart Agent" ? (jsxRuntimeExports.jsx(PieChartComponent, { pieChartState: chartState, styles: styles, appendMessage: appendMessage, query: (_25 = widget.config) === null || _25 === void 0 ? void 0 : _25.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Line Chart Agent" ? (jsxRuntimeExports.jsx(LineChartComponent, { lineChartState: chartState, styles: styles, appendMessage: appendMessage, query: (_26 = widget.config) === null || _26 === void 0 ? void 0 : _26.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Data Grid Agent" ? (jsxRuntimeExports.jsx(DataGridComponent, { dataGridState: chartState, styles: styles, appendMessage: appendMessage, query: (_27 = widget.config) === null || _27 === void 0 ? void 0 : _27.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout })) : agentType === "Summary Agent" ? (jsxRuntimeExports.jsx(SummaryComponent, { summaryState: chartState, styles: styles, appendMessage: appendMessage, query: (_28 = widget.config) === null || _28 === void 0 ? void 0 : _28.query, isFirstLoad: isFirstLoad, widgetBackendUrl: widgetBackendUrl, widgetId: widget.id, widget_ids: widgetIds, startLoadingTimeout: startLoadingTimeout, clearLoadingTimeout: clearLoadingTimeout, setChartState: setChartState })) : (jsxRuntimeExports.jsx(CopilotChat, { className: "h-full text-xs [&_.copilot-chat-message]:text-xs [&_.copilot-chat-input]:text-xs", labels: {
|
|
36613
|
+
title: ((_29 = widget.config) === null || _29 === void 0 ? void 0 : _29.copilotTitle) || widget.title,
|
|
36614
|
+
initial: ((_30 = widget.config) === null || _30 === void 0 ? void 0 : _30.copilotInitialMessage) || ((_31 = widget.config) === null || _31 === void 0 ? void 0 : _31.placeholder) || "How can I help you today?"
|
|
37114
36615
|
}, onSubmitMessage: () => {
|
|
37115
36616
|
setChartState(prevState => (Object.assign(Object.assign({}, prevState), { widget_ids: widgetIds })));
|
|
37116
36617
|
} })) })] }));
|
|
37117
36618
|
}
|
|
37118
|
-
function AgentWidget({ widget, showHeader = true, widgetBackendUrl, onResetReady, widgetIds, }) {
|
|
36619
|
+
function AgentWidget({ widget, showHeader = true, widgetBackendUrl, onResetReady, widgetIds, datasetId, }) {
|
|
37119
36620
|
var _a, _b;
|
|
37120
36621
|
const styles = getStyleValues((_a = widget.config) === null || _a === void 0 ? void 0 : _a.styles);
|
|
37121
36622
|
// Construct the runtime URL using the configurable backend URL
|
|
@@ -37125,10 +36626,10 @@ function AgentWidget({ widget, showHeader = true, widgetBackendUrl, onResetReady
|
|
|
37125
36626
|
const agentName = ((_a = widget.config) === null || _a === void 0 ? void 0 : _a.agentName) || 'default-agent';
|
|
37126
36627
|
return `${baseUrl}/api/copilot/${agentName}`;
|
|
37127
36628
|
};
|
|
37128
|
-
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(CopilotKit, { runtimeUrl: getRuntimeUrl(), showDevConsole: false, agent: ((_b = widget.config) === null || _b === void 0 ? void 0 : _b.agentName) || "widget_assistant", children: jsxRuntimeExports.jsx(CopilotKitAgent, { widget: widget, showHeader: showHeader, styles: styles, onResetReady: onResetReady, widgetIds: widgetIds, widgetBackendUrl: widgetBackendUrl }) }) }));
|
|
36629
|
+
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(CopilotKit, { runtimeUrl: getRuntimeUrl(), showDevConsole: false, agent: ((_b = widget.config) === null || _b === void 0 ? void 0 : _b.agentName) || "widget_assistant", children: jsxRuntimeExports.jsx(CopilotKitAgent, { widget: widget, showHeader: showHeader, styles: styles, onResetReady: onResetReady, widgetIds: widgetIds, widgetBackendUrl: widgetBackendUrl, datasetId: datasetId }) }) }));
|
|
37129
36630
|
}
|
|
37130
36631
|
|
|
37131
|
-
function WidgetRenderer({ widget, isTemplate = false, onConfigUpdate, widgetBackendUrl, onResetReady, widgetIds, }) {
|
|
36632
|
+
function WidgetRenderer({ widget, isTemplate = false, onConfigUpdate, widgetBackendUrl, onResetReady, widgetIds, datasetId, }) {
|
|
37132
36633
|
const handleConfigUpdate = (config) => {
|
|
37133
36634
|
if (onConfigUpdate) {
|
|
37134
36635
|
onConfigUpdate(widget.id, config);
|
|
@@ -37151,7 +36652,7 @@ function WidgetRenderer({ widget, isTemplate = false, onConfigUpdate, widgetBack
|
|
|
37151
36652
|
return (jsxRuntimeExports.jsx(FacetWidget, { widget: widget, showHeader: false, onConfigUpdate: handleConfigUpdate }));
|
|
37152
36653
|
case "agent":
|
|
37153
36654
|
case "chatbot":
|
|
37154
|
-
return jsxRuntimeExports.jsx(AgentWidget, { widget: widget, showHeader: false, widgetBackendUrl: widgetBackendUrl, onResetReady: onResetReady, widgetIds: widgetIds });
|
|
36655
|
+
return jsxRuntimeExports.jsx(AgentWidget, { widget: widget, showHeader: false, widgetBackendUrl: widgetBackendUrl, onResetReady: onResetReady, widgetIds: widgetIds, datasetId: datasetId });
|
|
37155
36656
|
default:
|
|
37156
36657
|
return (jsxRuntimeExports.jsxs("div", { className: "text-muted-foreground", children: ["Unknown widget type: ", widget.type] }));
|
|
37157
36658
|
}
|
|
@@ -37391,6 +36892,7 @@ const IconMap = {
|
|
|
37391
36892
|
};
|
|
37392
36893
|
function WidgetDashboard({ pageId, isEditing, selectedWidget = null, onWidgetSelect, refreshKey, widgetBackendUrl, onSaveLayoutReady, openWidgetPallete = false, onCloseWidgetPallete, defaultAgentName = "adk-construction-project-agent", userId }) {
|
|
37393
36894
|
const [widgets, setWidgets] = useState([]);
|
|
36895
|
+
const [datasetId, setDatasetId] = useState('');
|
|
37394
36896
|
const [availableWidgets, setAvailableWidgets] = useState([]);
|
|
37395
36897
|
const [isLoading, setIsLoading] = useState(true);
|
|
37396
36898
|
const [pageData, setPageData] = useState(null);
|
|
@@ -37524,6 +37026,7 @@ function WidgetDashboard({ pageId, isEditing, selectedWidget = null, onWidgetSel
|
|
|
37524
37026
|
console.log(data);
|
|
37525
37027
|
setPageData(data);
|
|
37526
37028
|
setWidgets(data.widgets || []);
|
|
37029
|
+
setDatasetId(data === null || data === void 0 ? void 0 : data.dataset_id);
|
|
37527
37030
|
}
|
|
37528
37031
|
catch (err) {
|
|
37529
37032
|
console.error("Error loading page data:", err);
|
|
@@ -37858,7 +37361,7 @@ function WidgetDashboard({ pageId, isEditing, selectedWidget = null, onWidgetSel
|
|
|
37858
37361
|
onCloseWidgetPallete === null || onCloseWidgetPallete === void 0 ? void 0 : onCloseWidgetPallete();
|
|
37859
37362
|
}, defaultAgentName: defaultAgentName }), jsxRuntimeExports.jsx(EditWidgetDialog, { initialText: editInitialQuery, isOpen: showEditModal, onClose: () => setShowEditModal(false), onSubmit: handleEditSubmit }), jsxRuntimeExports.jsx("div", { className: "min-h-full", onDragOver: (e) => e.preventDefault(), onDrop: handleDrop, onClick: () => setSelectedWidget(null), children: isLoading ? (jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full", children: jsxRuntimeExports.jsx(Loader2, { className: "h-8 w-8 animate-spin" }) })) : (jsxRuntimeExports.jsx(RGL, { className: "layout m-0 p-0", layouts: { lg: getLayoutFromWidgets() }, breakpoints: { lg: 1200, md: 996, sm: 768, xs: 480 }, cols: { lg: 12, md: 8, sm: 6, xs: 2 }, rowHeight: 100, isDraggable: isEditing, isResizable: isEditing, draggableHandle: ".drag-icon", onLayoutChange: handleLayoutChange, compactType: "vertical", containerPadding: [0, 0], resizeHandles: ["sw", "nw", "se", "ne"], children: widgets.map((w) => (jsxRuntimeExports.jsxs("div", { style: { borderColor: "rgb(147 197 253 / 1)" }, className: `border border-blue-300 rounded-xl p-4 shadow-lg overflow-hidden ${isEditing ? 'pb-20' : 'pb-14'}`, children: [isEditing &&
|
|
37860
37363
|
jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-end mb-4 relative", children: [jsxRuntimeExports.jsxs("div", { className: "flex items-center drag-icon cursor-grab absolute left-1/2 -translate-x-1/2", children: [jsxRuntimeExports.jsx(GripHorizontal, { className: "" }), jsxRuntimeExports.jsx(GripHorizontal, { className: "-ml-[3px]" }), jsxRuntimeExports.jsx(GripHorizontal, { className: "-ml-[3px]" })] }), jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 cursor-pointer justify-end", children: [jsxRuntimeExports.jsx(Trash2, { onClick: () => removeWidget(w.id), className: "w-5 h-5 text-red-700" }), jsxRuntimeExports.jsx(Edit, { onClick: () => onClickSettings && onClickSettings(w), className: "w-5 h-5 text-gray-600" })] })] }), jsxRuntimeExports.jsxs("div", { className: "w-full h-full relative", children: [(w === null || w === void 0 ? void 0 : w.type) === "chatbot" &&
|
|
37861
|
-
jsxRuntimeExports.jsxs("div", { className: "relative z-50", children: [jsxRuntimeExports.jsx("div", { onClick: () => handleClearChat(w.id), onMouseOver: () => setVisibleClearButton(true), onMouseLeave: () => setVisibleClearButton(false), className: "absolute z-40 flex align-middle justify-center gap-2 text-sm px-4 py-2 border-blue-300 rounded-sm dark:bg-white w-fit bg-gray-900 text-white dark:text-gray-900 cursor-pointer shadow-md transition-all", style: { top: "12px", right: "0", borderTopLeftRadius: "4px", borderBottomLeftRadius: "4px" }, children: jsxRuntimeExports.jsx(MessageCircleX, { className: "w-5 h-5" }) }), jsxRuntimeExports.jsx("span", { className: `absolute z-50 w-max py-1 text-xs px-2 rounded-sm dark:text-gray-900 dark:bg-white text-white bg-gray-900 ${visibleClearButton ? "block" : "hidden"}`, style: { top: "56px", right: "16px", borderRadius: "3px" }, children: "Clear Chat" })] }), jsxRuntimeExports.jsx(WidgetRenderer, { widget: w, widgetBackendUrl: widgetBackendUrl, onResetReady: handleResetReady, widgetIds: widgets.filter(widget => widget.type !== 'chatbot').map(widget => widget.id) })] })] }, w.id))) })) })] }));
|
|
37364
|
+
jsxRuntimeExports.jsxs("div", { className: "relative z-50", children: [jsxRuntimeExports.jsx("div", { onClick: () => handleClearChat(w.id), onMouseOver: () => setVisibleClearButton(true), onMouseLeave: () => setVisibleClearButton(false), className: "absolute z-40 flex align-middle justify-center gap-2 text-sm px-4 py-2 border-blue-300 rounded-sm dark:bg-white w-fit bg-gray-900 text-white dark:text-gray-900 cursor-pointer shadow-md transition-all", style: { top: "12px", right: "0", borderTopLeftRadius: "4px", borderBottomLeftRadius: "4px" }, children: jsxRuntimeExports.jsx(MessageCircleX, { className: "w-5 h-5" }) }), jsxRuntimeExports.jsx("span", { className: `absolute z-50 w-max py-1 text-xs px-2 rounded-sm dark:text-gray-900 dark:bg-white text-white bg-gray-900 ${visibleClearButton ? "block" : "hidden"}`, style: { top: "56px", right: "16px", borderRadius: "3px" }, children: "Clear Chat" })] }), jsxRuntimeExports.jsx(WidgetRenderer, { widget: w, widgetBackendUrl: widgetBackendUrl, onResetReady: handleResetReady, widgetIds: widgets.filter(widget => widget.type !== 'chatbot').map(widget => widget.id), datasetId: datasetId })] })] }, w.id))) })) })] }));
|
|
37862
37365
|
}
|
|
37863
37366
|
|
|
37864
37367
|
const Checkbox = React.forwardRef((_a, ref) => {
|