dp-widgets-framework 1.1.0 → 1.1.2
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 +22 -7
- package/dist/index.js +22 -7
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -36324,10 +36324,10 @@ function SeriesBarChartComponent({ orientation, seriesBarChartState, styles, app
|
|
|
36324
36324
|
function SeriesLineChartComponent({ orientation, seriesLineChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36325
36325
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
36326
36326
|
const hasCalledRef = useRef(false);
|
|
36327
|
-
const labels = ((_b = (_a = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.
|
|
36328
|
-
const series = ((_g = (_f = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.
|
|
36329
|
-
const chartTitle = ((_l = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.
|
|
36330
|
-
const units = ((_p = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.
|
|
36327
|
+
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) || [];
|
|
36328
|
+
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) || [];
|
|
36329
|
+
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) || "";
|
|
36330
|
+
const units = ((_p = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.series_bar_chart_data) === null || _p === void 0 ? void 0 : _p.units) || ((_r = (_q = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.state) === null || _q === void 0 ? void 0 : _q.series_bar_chart_data) === null || _r === void 0 ? void 0 : _r.units) || "";
|
|
36331
36331
|
const isEmpty = labels.length === 0 || series.length === 0;
|
|
36332
36332
|
const handleRefresh = async () => {
|
|
36333
36333
|
if (query) {
|
|
@@ -36585,6 +36585,8 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36585
36585
|
const { threadId, setThreadId } = useCopilotContext();
|
|
36586
36586
|
const timeoutRef = useRef(null);
|
|
36587
36587
|
const [isTimeoutTriggered, setIsTimeoutTriggered] = useState(false);
|
|
36588
|
+
const [apiCallCount, setApiCallCount] = useState(0);
|
|
36589
|
+
const [hasTimeoutError, setHasTimeoutError] = useState(false);
|
|
36588
36590
|
useEffect(() => {
|
|
36589
36591
|
setThreadId(widget.id);
|
|
36590
36592
|
}, [widget.id, setThreadId]);
|
|
@@ -36595,16 +36597,25 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36595
36597
|
// Function to handle timeout and call loadAgentState API
|
|
36596
36598
|
const handleLoadingTimeout = useCallback(async () => {
|
|
36597
36599
|
var _a;
|
|
36598
|
-
if (!widgetBackendUrl || !widget.id || isTimeoutTriggered || (chartState === null || chartState === void 0 ? void 0 : chartState.agent_message))
|
|
36600
|
+
if (!widgetBackendUrl || !widget.id || isTimeoutTriggered || (chartState === null || chartState === void 0 ? void 0 : chartState.agent_message) || hasTimeoutError)
|
|
36599
36601
|
return;
|
|
36600
36602
|
console.log('Loading timeout triggered for widget:', widget.id);
|
|
36601
36603
|
setIsTimeoutTriggered(true);
|
|
36604
|
+
// Check if we've reached the 10 call limit
|
|
36605
|
+
if (apiCallCount >= 10) {
|
|
36606
|
+
console.log('API call limit reached for widget:', widget.id);
|
|
36607
|
+
setHasTimeoutError(true);
|
|
36608
|
+
setChartState(prevState => (Object.assign(Object.assign({}, prevState), { agent_message: "Timeout: Unable to load data after multiple attempts. Please try refreshing the widget." })));
|
|
36609
|
+
return;
|
|
36610
|
+
}
|
|
36611
|
+
// Increment the API call counter
|
|
36612
|
+
setApiCallCount(prev => prev + 1);
|
|
36602
36613
|
const agentName = ((_a = widget.config) === null || _a === void 0 ? void 0 : _a.agentName) || "adk-construction-project-agent";
|
|
36603
36614
|
const apiResponse = await loadAgentState(widgetBackendUrl, widget.id, agentName);
|
|
36604
36615
|
if (apiResponse && !(chartState === null || chartState === void 0 ? void 0 : chartState.agent_message)) {
|
|
36605
36616
|
parseAndUpdateChartState(apiResponse, setChartState);
|
|
36606
36617
|
}
|
|
36607
|
-
}, [widgetBackendUrl, widget.id, isTimeoutTriggered, setChartState, (_e = widget.config) === null || _e === void 0 ? void 0 : _e.agentName, chartState]);
|
|
36618
|
+
}, [widgetBackendUrl, widget.id, isTimeoutTriggered, setChartState, (_e = widget.config) === null || _e === void 0 ? void 0 : _e.agentName, chartState, apiCallCount, hasTimeoutError]);
|
|
36608
36619
|
// Function to start timeout
|
|
36609
36620
|
const startLoadingTimeout = useCallback(() => {
|
|
36610
36621
|
if (timeoutRef.current) {
|
|
@@ -36638,6 +36649,8 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36638
36649
|
}),
|
|
36639
36650
|
});
|
|
36640
36651
|
setChartState(createInitialChartState(agentType || '', widgetIds, datasetId));
|
|
36652
|
+
setApiCallCount(0);
|
|
36653
|
+
setHasTimeoutError(false);
|
|
36641
36654
|
}
|
|
36642
36655
|
catch (error) {
|
|
36643
36656
|
console.error('Failed to clear chat and state:', error);
|
|
@@ -36700,6 +36713,8 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36700
36713
|
const { widgetId } = event.detail;
|
|
36701
36714
|
if (widgetId === widget.id) {
|
|
36702
36715
|
setChartState(createInitialChartState(agentType || '', widgetIds, datasetId));
|
|
36716
|
+
setApiCallCount(0);
|
|
36717
|
+
setHasTimeoutError(false);
|
|
36703
36718
|
}
|
|
36704
36719
|
};
|
|
36705
36720
|
window.addEventListener('triggerAgent', handleTriggerAgent);
|
|
@@ -37467,7 +37482,7 @@ function WidgetDashboard({ pageId, isEditing, selectedWidget = null, onWidgetSel
|
|
|
37467
37482
|
return (jsxRuntimeExports.jsxs("div", { className: "w-full max-w-full p-4 bg-accent/5", children: [jsxRuntimeExports.jsx(AddWidgetDialog, { isOpen: openWidgetPallete, onClose: onCloseWidgetPallete, addWidgetFn: (widgetType, config) => {
|
|
37468
37483
|
addWidget(widgetType, config);
|
|
37469
37484
|
onCloseWidgetPallete === null || onCloseWidgetPallete === void 0 ? void 0 : onCloseWidgetPallete();
|
|
37470
|
-
}, 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", {
|
|
37485
|
+
}, 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", { className: `border border-primary-300 rounded-xl p-4 shadow-lg overflow-hidden ${isEditing ? 'pb-20' : 'pb-14'}`, children: [isEditing &&
|
|
37471
37486
|
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" &&
|
|
37472
37487
|
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))) })) })] }));
|
|
37473
37488
|
}
|
package/dist/index.js
CHANGED
|
@@ -36351,10 +36351,10 @@ function SeriesBarChartComponent({ orientation, seriesBarChartState, styles, app
|
|
|
36351
36351
|
function SeriesLineChartComponent({ orientation, seriesLineChartState, styles, appendMessage, query, isFirstLoad, widgetBackendUrl, widgetId, startLoadingTimeout, clearLoadingTimeout }) {
|
|
36352
36352
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
36353
36353
|
const hasCalledRef = React.useRef(false);
|
|
36354
|
-
const labels = ((_b = (_a = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.
|
|
36355
|
-
const series = ((_g = (_f = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.
|
|
36356
|
-
const chartTitle = ((_l = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.
|
|
36357
|
-
const units = ((_p = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.
|
|
36354
|
+
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) || [];
|
|
36355
|
+
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) || [];
|
|
36356
|
+
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) || "";
|
|
36357
|
+
const units = ((_p = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.series_bar_chart_data) === null || _p === void 0 ? void 0 : _p.units) || ((_r = (_q = seriesLineChartState === null || seriesLineChartState === void 0 ? void 0 : seriesLineChartState.state) === null || _q === void 0 ? void 0 : _q.series_bar_chart_data) === null || _r === void 0 ? void 0 : _r.units) || "";
|
|
36358
36358
|
const isEmpty = labels.length === 0 || series.length === 0;
|
|
36359
36359
|
const handleRefresh = async () => {
|
|
36360
36360
|
if (query) {
|
|
@@ -36612,6 +36612,8 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36612
36612
|
const { threadId, setThreadId } = reactCore.useCopilotContext();
|
|
36613
36613
|
const timeoutRef = React.useRef(null);
|
|
36614
36614
|
const [isTimeoutTriggered, setIsTimeoutTriggered] = React.useState(false);
|
|
36615
|
+
const [apiCallCount, setApiCallCount] = React.useState(0);
|
|
36616
|
+
const [hasTimeoutError, setHasTimeoutError] = React.useState(false);
|
|
36615
36617
|
React.useEffect(() => {
|
|
36616
36618
|
setThreadId(widget.id);
|
|
36617
36619
|
}, [widget.id, setThreadId]);
|
|
@@ -36622,16 +36624,25 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36622
36624
|
// Function to handle timeout and call loadAgentState API
|
|
36623
36625
|
const handleLoadingTimeout = React.useCallback(async () => {
|
|
36624
36626
|
var _a;
|
|
36625
|
-
if (!widgetBackendUrl || !widget.id || isTimeoutTriggered || (chartState === null || chartState === void 0 ? void 0 : chartState.agent_message))
|
|
36627
|
+
if (!widgetBackendUrl || !widget.id || isTimeoutTriggered || (chartState === null || chartState === void 0 ? void 0 : chartState.agent_message) || hasTimeoutError)
|
|
36626
36628
|
return;
|
|
36627
36629
|
console.log('Loading timeout triggered for widget:', widget.id);
|
|
36628
36630
|
setIsTimeoutTriggered(true);
|
|
36631
|
+
// Check if we've reached the 10 call limit
|
|
36632
|
+
if (apiCallCount >= 10) {
|
|
36633
|
+
console.log('API call limit reached for widget:', widget.id);
|
|
36634
|
+
setHasTimeoutError(true);
|
|
36635
|
+
setChartState(prevState => (Object.assign(Object.assign({}, prevState), { agent_message: "Timeout: Unable to load data after multiple attempts. Please try refreshing the widget." })));
|
|
36636
|
+
return;
|
|
36637
|
+
}
|
|
36638
|
+
// Increment the API call counter
|
|
36639
|
+
setApiCallCount(prev => prev + 1);
|
|
36629
36640
|
const agentName = ((_a = widget.config) === null || _a === void 0 ? void 0 : _a.agentName) || "adk-construction-project-agent";
|
|
36630
36641
|
const apiResponse = await loadAgentState(widgetBackendUrl, widget.id, agentName);
|
|
36631
36642
|
if (apiResponse && !(chartState === null || chartState === void 0 ? void 0 : chartState.agent_message)) {
|
|
36632
36643
|
parseAndUpdateChartState(apiResponse, setChartState);
|
|
36633
36644
|
}
|
|
36634
|
-
}, [widgetBackendUrl, widget.id, isTimeoutTriggered, setChartState, (_e = widget.config) === null || _e === void 0 ? void 0 : _e.agentName, chartState]);
|
|
36645
|
+
}, [widgetBackendUrl, widget.id, isTimeoutTriggered, setChartState, (_e = widget.config) === null || _e === void 0 ? void 0 : _e.agentName, chartState, apiCallCount, hasTimeoutError]);
|
|
36635
36646
|
// Function to start timeout
|
|
36636
36647
|
const startLoadingTimeout = React.useCallback(() => {
|
|
36637
36648
|
if (timeoutRef.current) {
|
|
@@ -36665,6 +36676,8 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36665
36676
|
}),
|
|
36666
36677
|
});
|
|
36667
36678
|
setChartState(createInitialChartState(agentType || '', widgetIds, datasetId));
|
|
36679
|
+
setApiCallCount(0);
|
|
36680
|
+
setHasTimeoutError(false);
|
|
36668
36681
|
}
|
|
36669
36682
|
catch (error) {
|
|
36670
36683
|
console.error('Failed to clear chat and state:', error);
|
|
@@ -36727,6 +36740,8 @@ function CopilotKitAgent({ widget, showHeader, styles, onResetReady, widgetIds,
|
|
|
36727
36740
|
const { widgetId } = event.detail;
|
|
36728
36741
|
if (widgetId === widget.id) {
|
|
36729
36742
|
setChartState(createInitialChartState(agentType || '', widgetIds, datasetId));
|
|
36743
|
+
setApiCallCount(0);
|
|
36744
|
+
setHasTimeoutError(false);
|
|
36730
36745
|
}
|
|
36731
36746
|
};
|
|
36732
36747
|
window.addEventListener('triggerAgent', handleTriggerAgent);
|
|
@@ -37494,7 +37509,7 @@ function WidgetDashboard({ pageId, isEditing, selectedWidget = null, onWidgetSel
|
|
|
37494
37509
|
return (jsxRuntimeExports.jsxs("div", { className: "w-full max-w-full p-4 bg-accent/5", children: [jsxRuntimeExports.jsx(AddWidgetDialog, { isOpen: openWidgetPallete, onClose: onCloseWidgetPallete, addWidgetFn: (widgetType, config) => {
|
|
37495
37510
|
addWidget(widgetType, config);
|
|
37496
37511
|
onCloseWidgetPallete === null || onCloseWidgetPallete === void 0 ? void 0 : onCloseWidgetPallete();
|
|
37497
|
-
}, 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(lucideReact.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", {
|
|
37512
|
+
}, 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(lucideReact.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", { className: `border border-primary-300 rounded-xl p-4 shadow-lg overflow-hidden ${isEditing ? 'pb-20' : 'pb-14'}`, children: [isEditing &&
|
|
37498
37513
|
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(lucideReact.GripHorizontal, { className: "" }), jsxRuntimeExports.jsx(lucideReact.GripHorizontal, { className: "-ml-[3px]" }), jsxRuntimeExports.jsx(lucideReact.GripHorizontal, { className: "-ml-[3px]" })] }), jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 cursor-pointer justify-end", children: [jsxRuntimeExports.jsx(lucideReact.Trash2, { onClick: () => removeWidget(w.id), className: "w-5 h-5 text-red-700" }), jsxRuntimeExports.jsx(lucideReact.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" &&
|
|
37499
37514
|
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(lucideReact.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))) })) })] }));
|
|
37500
37515
|
}
|