@topconsultnpm/sdkui-react 6.22.0-dev2.2 → 6.22.0-dev2.21

package/lib/components/features/documents/TMMultiMasterDetailDcmtsUtils.js

@@ -0,0 +1,234 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { useEffect, useRef } from 'react';
+import { AccessLevelsEx, DataListViewModes, DcmtTypeListCacheService, MetadataDataDomains, MetadataDataTypes, SDK_Globals } from '@topconsultnpm/sdk-ts';
+import { hoverStyle, IconChevronRight, IconWindowMaximize, IconWindowMinimize, SDKUI_Localizator } from '../../../helper';
+import { formatScalarValue, getUserMetadataSorted } from '../../../helper/dcmtsHelper';
+import { TMColors } from '../../../utils/theme';
+import { TMDcmtTypeIcon } from '../../viewers/TMTidViewer';
+import TMTooltip from '../../base/TMTooltip';
+import { DeviceType, useDeviceType } from '../../base/TMDeviceProvider';
+import { useTMPanelManagerContext } from '../../layout/panelManager/TMPanelManagerContext';
+// l'elenco da archiviare è l'informazione più importante, quindi prende la fetta maggiore
+export const SECTION_WEIGHTS = { masterInfo: 25, archivedDetails: 30, archiveList: 45 };
+export const SECTION_HEADER_HEIGHT_PX = 30;
+// Spessore dei separatori fra i pannelli
+export const PANEL_GUTTER_PX = 10;
+// =================================================================================================
+// HELPER
+// =================================================================================================
+/** Il master è modificabile solo se il tipo documento lo consente */
+export const canUpdateMasterCallback = (dtd, masterDcmt) => (dtd?.perm?.canUpdate === AccessLevelsEx.Yes || dtd?.perm?.canUpdate === AccessLevelsEx.Mixed)
+    && masterDcmt?.TID !== undefined && masterDcmt?.DID !== undefined;
+/** Permesso di archiviazione sul tipo documento di dettaglio */
+export const canArchive = (dtd) => dtd?.perm?.canArchive === AccessLevelsEx.Yes || dtd?.perm?.canArchive === AccessLevelsEx.Mixed;
+/**
+ * Marcatore delle celle modificabili direttamente in griglia: il doppio clic le porta in modifica,
+ * quindi non deve aprire anche il form della riga
+ */
+export const INLINE_EDITABLE_CELL_CLASS = 'tm-cell-inline-editable';
+/**
+ * Modifica diretta in griglia: solo il testo libero. Liste dati, calcolati, numeratori e speciali
+ * hanno editor e vincoli propri, date e numeri una formattazione dedicata: restano al form
+ */
+export const isInlineEditableMetadata = (md) => md.dataType === MetadataDataTypes.Varchar
+    && (md.dataDomain === undefined || md.dataDomain === MetadataDataDomains.None)
+    && md.isSystem !== 1 && md.isSystemDerived !== 1;
+/** Colonne della griglia di riepilogo dai metadati (utente) del tipo documento */
+export const buildColumnsFromDtd = (dtd, renderDataListCell) => getUserMetadataSorted(dtd).map(md => {
+    const dataListID = md.dataListID ?? 0;
+    const isDataList = md.dataDomain === MetadataDataDomains.DataList && dataListID > 0;
+    const viewMode = md.dataListViewMode ?? DataListViewModes.None;
+    const dataType = md.dataType;
+    const format = md.format?.format;
+    const formatCulture = md.format?.formatCulture;
+    // Date e numeri usano la formattazione scalare; le liste dati il render comune
+    const needsScalarFormat = !isDataList && (dataType === MetadataDataTypes.DateTime || dataType === MetadataDataTypes.Number);
+    const isInlineEditable = isInlineEditableMetadata(md);
+    return {
+        dataField: String(md.id),
+        caption: (SDK_Globals.useLocalizedName ? md.nameLoc : md.name) ?? md.name ?? '',
+        // La colonna modificabile dichiara il tipo: senza valori DevExtreme non saprebbe che editor usare
+        ...(isInlineEditable
+            ? {
+                dataType: 'string',
+                allowEditing: true,
+                showEditorAlways: true,
+                cssClass: INLINE_EDITABLE_CELL_CLASS,
+                // Lunghezza e obbligatorietà del metadato valgono anche in griglia
+                editorOptions: md.length ? { maxLength: md.length } : undefined,
+                validationRules: String(md.isRequired) === '1' ? [{ type: 'required', message: SDKUI_Localizator.RequiredField }] : undefined,
+            }
+            : { allowEditing: false }),
+        cellRender: isDataList
+            ? (cellData) => renderDataListCell(cellData.value, dataListID, viewMode)
+            : (needsScalarFormat ? (cellData) => formatScalarValue(cellData.value, dataType, format, formatCulture) : undefined),
+    };
+});
+// Accesso al descrittore del tipo documento di dettaglio
+export const getDetailDtdAsync = (detailTID) => detailTID === undefined ? Promise.resolve(undefined) : DcmtTypeListCacheService.GetWithNotGrantedAsync(detailTID, undefined);
+/** Nome visualizzato del tipo documento (localizzato se richiesto) */
+export const getDtdDisplayName = (dtd) => {
+    if (!dtd)
+        return '';
+    return (SDK_Globals.useLocalizedName ? dtd.nameLoc : dtd.name) ?? dtd.name ?? '';
+};
+/** Messaggio del blocco: con righe inserite il tipo documento non è più modificabile */
+export const getBackLockedTitle = () => SDKUI_Localizator.DeleteAllRowsToChangeDcmtType;
+/**
+ * Altezze dei pannelli impilati a partire dalle sezioni aperte:
+ * una sezione chiusa vale 0% e resta a schermo con la sola testata
+ * le aperte si spartiscono tutto lo spazio
+ */
+export const sectionPanelHeights = (sections, sectionsOpen, currentDimensions) => {
+    const weightOf = (section) => {
+        if (!sectionsOpen[section])
+            return 0;
+        const current = parseFloat(currentDimensions?.[section]?.height ?? '');
+        // Sezione che si apre ora (era a 0%) o prima apertura: si riparte dalla quota nominale
+        return Number.isFinite(current) && current > 0 ? current : SECTION_WEIGHTS[section];
+    };
+    const total = sections.reduce((sum, section) => sum + weightOf(section), 0);
+    return sections.reduce((acc, section) => {
+        acc[section] = { width: '100%', height: total > 0 ? `${(weightOf(section) / total) * 100}%` : '0%' };
+        return acc;
+    }, {});
+};
+// =================================================================================================
+// STILI
+// =================================================================================================
+export const multiDetailStyles = {
+    // Stepper
+    stepper: { display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '4px' },
+    backArrow: { display: 'flex', alignItems: 'center', justifyContent: 'center', width: '26px', height: '26px', borderRadius: '50%', border: `1.5px solid ${TMColors.primary}`, color: TMColors.primary, cursor: 'pointer', marginRight: '8px', transition: 'all 0.18s ease' },
+    stepPill: { display: 'flex', alignItems: 'center', gap: '7px', padding: '3px 10px 3px 4px', borderRadius: '16px', transition: 'all 0.18s ease' },
+    stepCircle: { width: '22px', height: '22px', borderRadius: '50%', color: '#ffffff', display: 'flex', alignItems: 'center', justifyContent: 'center', fontSize: '12px', fontWeight: 600, flexShrink: 0, transition: 'all 0.18s ease' },
+    stepLabel: { fontSize: '12px', whiteSpace: 'nowrap', display: 'flex', alignItems: 'center' },
+    stepConnector: { width: '18px', height: '2px', margin: '0 5px', borderRadius: '1px', flexShrink: 0 },
+    stepTypeLabel: { display: 'flex', alignItems: 'center', gap: '6px', maxWidth: '260px' },
+    stepTypeLabelText: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' },
+    // Fase 1 - Selezione tipo documento
+    selectContainer: { display: 'flex', flexDirection: 'column', alignItems: 'center', flex: 1, gap: '8px', overflow: 'auto', padding: '8px 16px 24px' },
+    selectTitle: { fontSize: '18px', fontWeight: 700, color: TMColors.text_normal, textAlign: 'center', marginBottom: '16px' },
+    selectList: { display: 'flex', flexDirection: 'column', gap: '8px', width: '100%', maxWidth: '640px' },
+    typeCard: { display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 14px', borderRadius: '9px', cursor: 'pointer', boxShadow: '0 1px 3px rgba(0, 0, 0, 0.06)', transition: 'all 0.15s ease' },
+    typeCardIcon: { width: '34px', height: '34px', borderRadius: '9px', background: TMColors.primary_container, display: 'flex', alignItems: 'center', justifyContent: 'center', flexShrink: 0 },
+    typeCardName: { flex: 1, fontSize: '14px', fontWeight: 500, color: TMColors.text_normal, whiteSpace: 'normal', wordBreak: 'break-word', lineHeight: 1.3 },
+};
+/** Stili delle sezioni collassabili: qui perché la testata comune (renderAccordionHeader) vive in questo file */
+export const accordionStyles = {
+    accordion: { display: 'flex', flexDirection: 'column', minHeight: 0, borderRadius: '8px', border: `1px solid ${TMColors.card_background}`, background: TMColors.default_background, overflow: 'hidden' },
+    // Sezione dentro un pannello: l'altezza è quella del pannello, che la sezione riempie. Serve `flex`
+    // e non `height: 100%`, perché il pannello chiuso ha altezza 0 e vive del suo ingombro minimo
+    accordionInPanel: { flex: 1 },
+    accordionHeader: { display: 'flex', alignItems: 'center', gap: '8px', padding: '4px 8px', cursor: 'pointer', userSelect: 'none', transition: 'background 0.15s ease', outline: 'none', flexShrink: 0, minHeight: '28px' },
+    accordionTitle: { flex: 1, fontSize: '12px', fontWeight: 600, color: TMColors.text_normal, display: 'flex', alignItems: 'center', gap: '6px', minWidth: 0 },
+    accordionBadge: { display: 'inline-flex', alignItems: 'center', justifyContent: 'center', minWidth: '18px', height: '16px', padding: '0 5px', borderRadius: '8px', background: TMColors.primary_container, color: TMColors.primary, fontSize: '10px', fontWeight: 700, flexShrink: 0 },
+    accordionListBody: { position: 'relative', flex: 1, minHeight: 0, display: 'flex', flexDirection: 'column', borderTop: `1px solid ${TMColors.card_background}` },
+    accordionListPlaceholder: { display: 'flex', flex: 1, alignItems: 'center', justifyContent: 'center', gap: '10px', padding: '16px', color: TMColors.label_normal, fontSize: '13px' },
+    accordionExpandBtn: { display: 'inline-flex', alignItems: 'center', justifyContent: 'center', width: '20px', height: '20px', padding: 0, borderRadius: '6px', border: 'none', background: 'transparent', color: TMColors.label_normal, cursor: 'pointer', flexShrink: 0, transition: 'background 0.15s ease, color 0.15s ease' },
+};
+export const renderStepper = ({ steps, phase, hasMultipleTypes, isBackLocked, showBackArrow, onBack, onStepClick }) => (_jsxs("div", { style: multiDetailStyles.stepper, children: [showBackArrow && (_jsx(TMTooltip, { content: isBackLocked ? getBackLockedTitle() : SDKUI_Localizator.Back, parentStyle: { marginRight: '10px' }, children: _jsx("div", { onClick: isBackLocked ? undefined : onBack, style: {
+                    ...multiDetailStyles.backArrow,
+                    marginRight: 0,
+                    ...(isBackLocked ? { borderColor: TMColors.disabled, color: TMColors.disabled, background: TMColors.card_background, opacity: 0.55, cursor: 'default' } : {}),
+                }, ...(isBackLocked ? {} : hoverStyle({ background: TMColors.primary, color: '#ffffff', transform: 'translateX(-2px)' }, { background: 'transparent', color: TMColors.primary, transform: 'translateX(0)' })), children: _jsx("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", style: { display: 'block' }, children: _jsx("path", { d: "M15 5l-7 7 7 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) }) })), steps.map((step, index) => {
+            const isActive = step.phase === phase;
+            const isCompleted = step.phase < phase;
+            // Completato: verde con spunta. Corrente: blu. Da fare: grigio disabilitato
+            const accentColor = isCompleted ? TMColors.success : (isActive ? TMColors.primary : TMColors.disabled);
+            // Step completato cliccabile per tornare indietro, salvo il lock per righe presenti
+            const isClickable = isCompleted && !isBackLocked;
+            // Tooltip esplicativo solo sullo step completato quando il ritorno è bloccato dalle righe
+            const showLockTooltip = isCompleted && isBackLocked;
+            const stepPill = (_jsxs("div", { onClick: isClickable ? () => onStepClick(step.phase) : undefined, style: {
+                    ...multiDetailStyles.stepPill,
+                    background: isActive ? TMColors.primary_container : 'transparent',
+                    boxShadow: isActive ? `inset 0 0 0 1.5px ${TMColors.primary}` : 'none',
+                    cursor: isClickable ? 'pointer' : 'default',
+                    ...(showLockTooltip ? { opacity: 0.5, filter: 'grayscale(0.6)' } : {}),
+                }, ...(isClickable && !isActive
+                    ? hoverStyle({ background: TMColors.primary_container, transform: 'translateY(-1px)' }, { background: 'transparent', transform: 'translateY(0)' })
+                    : {}), children: [hasMultipleTypes && (_jsx("div", { style: { ...multiDetailStyles.stepCircle, background: accentColor, boxShadow: isActive ? `0 2px 6px ${TMColors.primary}55` : 'none' }, children: isCompleted
+                            ? (_jsx("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", style: { display: 'block' }, children: _jsx("path", { d: "M5 13l4 4L19 7", stroke: "#ffffff", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" }) }))
+                            : step.phase + 1 })), _jsx("span", { style: { ...multiDetailStyles.stepLabel, fontWeight: isActive ? 700 : 500, color: accentColor }, children: step.label })] }));
+            return (_jsxs(React.Fragment, { children: [showLockTooltip
+                        ? _jsx(TMTooltip, { content: getBackLockedTitle(), children: stepPill })
+                        : stepPill, index < steps.length - 1 && (_jsx("div", { style: { ...multiDetailStyles.stepConnector, background: isCompleted ? TMColors.success : TMColors.disabled } }))] }, step.phase));
+        })] }));
+export const renderSelectDcmtType = ({ detailRelationItems, selectedRelation, onSelectRelation }) => (_jsxs("div", { style: multiDetailStyles.selectContainer, children: [_jsx("div", { style: multiDetailStyles.selectTitle, children: SDKUI_Localizator.SelectDcmtTypeForDetailArchiving }), _jsx("div", { style: multiDetailStyles.selectList, children: detailRelationItems.map((item) => {
+                const isSelected = item.relation === selectedRelation;
+                return (_jsxs("div", { onClick: () => onSelectRelation(item), style: {
+                        ...multiDetailStyles.typeCard,
+                        border: `1.5px solid ${isSelected ? TMColors.primary : TMColors.card_background}`,
+                        background: isSelected ? TMColors.primary_container : TMColors.default_background,
+                    }, ...hoverStyle({ borderColor: TMColors.primary, boxShadow: '0 4px 12px rgba(37, 89, 165, 0.18)' }, { borderColor: isSelected ? TMColors.primary : TMColors.card_background, boxShadow: '0 1px 3px rgba(0, 0, 0, 0.06)' }), children: [_jsx("div", { style: multiDetailStyles.typeCardIcon, children: _jsx(TMDcmtTypeIcon, { dtd: item.detailDtd }) }), _jsx("span", { style: multiDetailStyles.typeCardName, children: getDtdDisplayName(item.detailDtd) }), _jsx(IconChevronRight, { fontSize: 18, color: TMColors.label_normal })] }, item.relation.id ?? item.relation.detailTID));
+            }) })] }));
+export const renderAccordionHeader = ({ section, isOpen, tooltip, count, title, actions, panel, onToggleOpen }) => {
+    const restBackground = isOpen ? TMColors.toolbar_background : 'transparent';
+    // Un pannello ingrandito non si collassa: resterebbe la sola testata al posto di tutto il riepilogo.
+    // Dove i pannelli si vedono uno alla volta (mobile) il collasso è precluso per lo stesso motivo
+    const canToggle = panel.canCollapse && !panel.isMaximized;
+    // Con un pannello alla volta l'ingrandimento non ha nulla da nascondere
+    const canMaximize = panel.canMaximize;
+    const onToggle = () => onToggleOpen(section, !isOpen);
+    const expandTooltip = panel.isMaximized ? SDKUI_Localizator.Minimize : SDKUI_Localizator.ZoomIn;
+    return (_jsxs("div", { role: canToggle ? 'button' : undefined, tabIndex: canToggle ? 0 : undefined, "aria-expanded": canToggle ? isOpen : undefined, style: { ...accordionStyles.accordionHeader, background: restBackground, ...(canToggle ? {} : { cursor: 'default' }) }, onClick: canToggle ? onToggle : undefined, 
+        // Doppio click sulla testata: ingrandisce e riduce, come nei pannelli del prodotto
+        onDoubleClick: canMaximize ? () => panel.toggleMaximize() : undefined, onKeyDown: canToggle ? (e) => { if (e.key === 'Enter' || e.key === ' ') {
+            e.preventDefault();
+            onToggle();
+        } } : undefined, title: canToggle ? tooltip : undefined, ...(canToggle ? hoverStyle({ background: TMColors.primary_container }, { background: restBackground }) : {}), children: [_jsxs("span", { style: accordionStyles.accordionTitle, children: [title, _jsx("span", { style: accordionStyles.accordionBadge, children: count })] }), actions, canMaximize && (_jsx("button", { type: 'button', onClick: (e) => { e.stopPropagation(); panel.toggleMaximize(); }, style: accordionStyles.accordionExpandBtn, title: expandTooltip, "aria-label": expandTooltip, ...hoverStyle({ background: TMColors.primary_container, color: TMColors.primary }, { background: 'transparent', color: TMColors.label_normal }), children: panel.isMaximized ? _jsx(IconWindowMinimize, { fontSize: 14 }) : _jsx(IconWindowMaximize, { fontSize: 14 }) })), canToggle && (_jsx(IconChevronRight, { fontSize: 16, color: TMColors.label_normal, style: { transform: isOpen ? 'rotate(90deg)' : 'none', transition: 'transform 0.2s ease', flexShrink: 0 } }))] }));
+};
+/**
+ * Contenuto di un pannello: il contesto del panel manager è leggibile solo dentro l'albero del
+ * provider, quindi è qui che si prende lo stato di ingrandimento da passare alla sezione
+ */
+export const TMSummarySectionSlot = ({ section, render, onBeforeMaximize }) => {
+    const { maximizedPanels, toggleMaximize } = useTMPanelManagerContext();
+    const isMaximized = maximizedPanels.includes(section);
+    // Su mobile il panel manager mostra un pannello alla volta: la sezione è già a tutto schermo, e
+    // ingrandirla nasconderebbe la barra con cui si passa da una sezione all'altra; chiuderla lascerebbe
+    // a schermo la sola testata, perché non ci sono altre sezioni a cui cedere lo spazio
+    const isMobile = useDeviceType() === DeviceType.MOBILE;
+    // Una sezione collassata non ha corpo: ingrandirla mostrerebbe un pannello vuoto, senza
+    // nemmeno poterla riaprire (da ingrandita il collasso è bloccato), quindi la si apre prima
+    const toggleMaximizeSection = () => {
+        if (!isMaximized)
+            onBeforeMaximize?.(section);
+        toggleMaximize(section);
+    };
+    return _jsx(_Fragment, { children: render({ isMaximized, canMaximize: !isMobile, canCollapse: !isMobile, toggleMaximize: toggleMaximizeSection }) });
+};
+/**
+ * Tiene allineate le altezze dei pannelli al collasso delle sezioni: il panel manager non
+ * conosce il collasso, quindi è qui che l'apertura di una sezione si traduce nelle nuove quote.
+ * Vive dentro il provider perché il contesto è leggibile solo lì
+ */
+export const TMSectionPanelsHeights = ({ sections, sectionsOpen }) => {
+    const { panelDimensions, panelVisibility, setPanelDimensionsById, maximizedPanels } = useTMPanelManagerContext();
+    // Con un pannello ingrandito le quote sono quelle dell'ingrandimento (100% e 0%): riallinearle al
+    // collasso lo svuoterebbe, quindi si aspetta il ritorno alla vista normale per rifare i conti
+    const hasMaximizedPanel = maximizedPanels.length > 0;
+    // Le altezze correnti si leggono da un ref: fra le dipendenze rientrerebbero a ogni ridimensionamento,
+    // mentre qui interessa solo il collasso
+    const dimensionsRef = useRef(panelDimensions);
+    dimensionsRef.current = panelDimensions;
+    // Le prime altezze le imposta il provider da initialDimensions, già calcolate sul collasso corrente
+    const isFirstRun = useRef(true);
+    useEffect(() => {
+        if (isFirstRun.current) {
+            isFirstRun.current = false;
+            return;
+        }
+        if (hasMaximizedPanel)
+            return;
+        // Solo i pannelli a schermo si spartiscono l'altezza: contando anche i nascosti (su mobile ne
+        // resta visibile uno solo) al pannello a schermo toccherebbe la sua sola quota nominale,
+        // lasciando vuoto lo spazio dei pannelli che non ci sono. Chi è fuori schermo resta alle proprie
+        // quote, che sono quelle da cui il panel manager riparte quando lo si torna a mostrare
+        const visibleSections = sections.filter(section => panelVisibility[section] !== false);
+        const heights = sectionPanelHeights(visibleSections, sectionsOpen, dimensionsRef.current);
+        visibleSections.forEach(section => setPanelDimensionsById(section, heights[section].width, heights[section].height));
+    }, [sectionsOpen, hasMaximizedPanel, panelVisibility]);
+    return null;
+};

package/lib/components/features/documents/TMRelationViewer.d.ts

@@ -132,6 +132,19 @@ export interface TMRelationViewerProps {
      * Useful to disable interactions (like context menu) during loading.
      */
     onLoadingStateChanged?: (isLoading: boolean) => void;
+    /**
+     * Invoked on mount to hand over a function that stops the ongoing correlations
+     * calculation: no further GetMetadata calls are performed and only the
+     * correlations already calculated are kept.
+     * The function is synchronous, so it can be safely called right before
+     * unmounting the viewer (e.g. when navigating back).
+     */
+    onStopCalculationReady?: (stopCalculation: () => void) => void;
+    /**
+     * Callback invoked when the calculation has actually been stopped
+     * (loadData terminated after an abort request).
+     */
+    onCalculationStopped?: () => void;
 }
 /**
  * Check if document type has detail relations
@@ -150,7 +163,7 @@ export declare const getDisplayValueByColumn: (col: DataColumnDescriptor | undef
  * For each document, fetches complete metadata using GetMetadataAsync to ensure
  * all metadata properties (isSpecialSearchOutput, permissions, etc.) are available
  */
-export declare const searchResultToDataSource: (searchResult: SearchResultDescriptor | undefined, hideSysMetadata?: boolean) => Promise<any[]>;
+export declare const searchResultToDataSource: (searchResult: SearchResultDescriptor | undefined, hideSysMetadata?: boolean, signal?: AbortSignal) => Promise<any[]>;
 export declare const DEFAULT_RELATION_EXPAND_LEVEL = 4;
 declare const TMRelationViewer: React.FC<TMRelationViewerProps>;
 export default TMRelationViewer;

package/lib/components/features/documents/TMRelationViewer.js

@@ -70,7 +70,7 @@ export const getDisplayValueByColumn = (col, value) => {
  * For each document, fetches complete metadata using GetMetadataAsync to ensure
  * all metadata properties (isSpecialSearchOutput, permissions, etc.) are available
  */
-export const searchResultToDataSource = async (searchResult, hideSysMetadata) => {
+export const searchResultToDataSource = async (searchResult, hideSysMetadata, signal) => {
     const rows = searchResult?.dtdResult?.rows ?? [];
     const output = [];
     // Find TID and DID column indices
@@ -78,6 +78,9 @@ export const searchResultToDataSource = async (searchResult, hideSysMetadata) =>
     const tidColIndex = columns.findIndex(col => col.caption?.toUpperCase() === 'TID');
     const didColIndex = columns.findIndex(col => col.caption?.toUpperCase() === 'DID');
     for (let index = 0; index < rows.length; index++) {
+        // Interruzione richiesta dall'utente: restituisce i documenti già elaborati
+        if (signal?.aborted)
+            break;
         const row = rows[index];
         // Extract TID and DID from row
         const tid = tidColIndex >= 0 ? Number(row[tidColIndex]) : searchResult?.fromTID;
@@ -144,7 +147,7 @@ export const searchResultToDataSource = async (searchResult, hideSysMetadata) =>
     return output;
 };
 export const DEFAULT_RELATION_EXPAND_LEVEL = 4; // Default maximum depth level for expansion (can be adjusted)
-const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndicator = true, allowShowZeroDcmts = true, initialShowZeroDcmts = false, allowedTIDs, allowMultipleSelection = false, focusedItem, selectedItems, onFocusedItemChanged, onSelectedItemsChanged, onAllItemsChanged, onDocumentDoubleClick, customItemRender, customDocumentStyle, customMainContainerContent, customDocumentContent, showMetadataNames = false, maxDepthLevel = 2, invertMasterNavigation = true, additionalStaticItems, showMainDocument = true, labelMainContainer, onNoRelationsFound, onItemContextMenu, focusedItemFormData = [], showExpandAllButton = false, defaultExpandAll = false, onLoadingStateChanged }) => {
+const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndicator = true, allowShowZeroDcmts = true, initialShowZeroDcmts = false, allowedTIDs, allowMultipleSelection = false, focusedItem, selectedItems, onFocusedItemChanged, onSelectedItemsChanged, onAllItemsChanged, onDocumentDoubleClick, customItemRender, customDocumentStyle, customMainContainerContent, customDocumentContent, showMetadataNames = false, maxDepthLevel = 2, invertMasterNavigation = true, additionalStaticItems, showMainDocument = true, labelMainContainer, onNoRelationsFound, onItemContextMenu, focusedItemFormData = [], showExpandAllButton = false, defaultExpandAll = false, onLoadingStateChanged, onStopCalculationReady, onCalculationStopped }) => {
     // State
     const [dcmtTypes, setDcmtTypes] = useState([]);
     const [treeData, setTreeData] = useState([]);
@@ -159,6 +162,8 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
     const [waitPanelValuePrimary, setWaitPanelValuePrimary] = useState(0);
     const [waitPanelMaxValuePrimary, setWaitPanelMaxValuePrimary] = useState(0);
     const [abortController] = useState(new AbortController());
+    // True quando l'utente ha interrotto il calcolo delle correlazioni (pulsante "Interrompi")
+    const [loadStoppedByUser, setLoadStoppedByUser] = useState(false);
     const [showExpansionWaitPanel, setShowExpansionWaitPanel] = useState(false);
     const [expansionWaitPanelText, setExpansionWaitPanelText] = useState('');
     const [expansionWaitPanelValue, setExpansionWaitPanelValue] = useState(0);
@@ -191,6 +196,27 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
         const isLoading = showWaitPanel || showExpansionWaitPanel;
         onLoadingStateChanged?.(isLoading);
     }, [showWaitPanel, showExpansionWaitPanel, onLoadingStateChanged]);
+    // Mantiene l'AbortController dell'espansione in corso accessibile da callback stabili
+    const expansionAbortControllerRef = React.useRef(undefined);
+    useEffect(() => {
+        expansionAbortControllerRef.current = expansionAbortController;
+    }, [expansionAbortController]);
+    /**
+     * Interrompe il calcolo delle correlazioni (iniziale e/o espansione in corso):
+     * non vengono eseguite ulteriori chiamate GetMetadata e vengono mantenute
+     * solo le correlazioni già calcolate.
+     * È sincrona: può essere invocata immediatamente prima di smontare il viewer
+     * (es. pulsante "Indietro"), quando un effect non farebbe in tempo.
+     */
+    const stopCalculation = useCallback(() => {
+        if (!abortController.signal.aborted)
+            abortController.abort();
+        expansionAbortControllerRef.current?.abort();
+    }, [abortController]);
+    // Espone la funzione di interruzione al componente padre
+    useEffect(() => {
+        onStopCalculationReady?.(stopCalculation);
+    }, [onStopCalculationReady, stopCalculation]);
     // Sincronizza expandLevel quando userSettings.searchSettings.relationExpandLevel cambia
     useEffect(() => {
         const globalExpandLevel = SDKUI_Globals.userSettings?.searchSettings?.relationExpandLevel;
@@ -220,7 +246,7 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
     /**
      * Recursively retrieve detail documents (adapted from TMMasterDetailDcmts.tsx)
      */
-    const getDetailDcmtsAsync = useCallback(async (mTID, mDID, maxLevel) => {
+    const getDetailDcmtsAsync = useCallback(async (mTID, mDID, maxLevel, signal) => {
         const items = [];
         if (!mTID)
             return [];
@@ -240,6 +266,9 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                 return items;
             const results = await searchEngine.GetAllDetailDcmtsAsync(mTID, mDID) ?? [];
             for (const searchResult of results) {
+                // Interruzione richiesta dall'utente: restituisce le correlazioni già calcolate
+                if (signal?.aborted)
+                    break;
                 // Skip if allowedTIDs is set and this TID is not allowed
                 if (allowedTIDs && searchResult.fromTID && !allowedTIDs.includes(searchResult.fromTID)) {
                     continue;
@@ -261,7 +290,7 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                     expanded: false,
                     hidden: false
                 };
-                const source = await searchResultToDataSource(searchResult);
+                const source = await searchResultToDataSource(searchResult, undefined, signal);
                 if (source && source.length > 0) {
                     const dcmtDetails = [];
                     // Check once if this document type can have detail relations
@@ -307,7 +336,7 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
     /**
      * Recursively retrieve master documents
      */
-    const getMasterDcmtsAsync = useCallback(async (dTID, dDID, maxLevel) => {
+    const getMasterDcmtsAsync = useCallback(async (dTID, dDID, maxLevel, signal) => {
         const items = [];
         if (!dTID)
             return [];
@@ -327,6 +356,9 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                 return items;
             const results = await searchEngine.GetAllMasterDcmtsAsync(dTID, dDID) ?? [];
             for (const searchResult of results) {
+                // Interruzione richiesta dall'utente: restituisce le correlazioni già calcolate
+                if (signal?.aborted)
+                    break;
                 // Skip if allowedTIDs is set and this TID is not allowed
                 if (allowedTIDs && searchResult.fromTID && !allowedTIDs.includes(searchResult.fromTID)) {
                     continue;
@@ -348,7 +380,7 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                     expanded: false,
                     hidden: false
                 };
-                const source = await searchResultToDataSource(searchResult);
+                const source = await searchResultToDataSource(searchResult, undefined, signal);
                 if (source && source.length > 0) {
                     const dcmtMasters = [];
                     // Check once if this document type can have master relations (for inverted mode)
@@ -576,7 +608,7 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
             }
             const dtd = await DcmtTypeListCacheService.GetAsync(dcmt.TID);
             // Parse document values
-            const docValues = await searchResultToDataSource(result);
+            const docValues = await searchResultToDataSource(result, undefined, abortController.signal);
             const docRow = docValues.length > 0 ? docValues[0] : undefined;
             // Generate unique GUID for this container
             const containerGUID = genUniqueId();
@@ -585,16 +617,21 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
             // ========================================================================
             if (isForMaster && !invertMasterNavigation) {
                 // Carica i master documents
-                const masterDocs = await getMasterDcmtsAsync(dcmt.TID, dcmt.DID, maxDepthLevel);
+                const masterDocs = await getMasterDcmtsAsync(dcmt.TID, dcmt.DID, maxDepthLevel, abortController.signal);
                 // Per ogni master, carica i suoi detail (incluso il documento corrente)
                 for (const masterContainer of masterDocs) {
+                    if (abortController.signal.aborted)
+                        break;
                     if (!masterContainer.items)
                         continue;
                     // Per ogni master document nel container, carica i detail
                     for (const masterDoc of masterContainer.items) {
+                        // Interruzione richiesta dall'utente: mantiene i dati già calcolati
+                        if (abortController.signal.aborted)
+                            break;
                         if (masterDoc.tid && masterDoc.did) {
                             // Carica i detail del master (incluso il documento di partenza)
-                            const detailDocs = await getDetailDcmtsAsync(masterDoc.tid, masterDoc.did, 1);
+                            const detailDocs = await getDetailDcmtsAsync(masterDoc.tid, masterDoc.did, 1, abortController.signal);
                             masterDoc.items = detailDocs;
                             masterDoc.itemsCount = detailDocs.length;
                             masterDoc.isLoaded = true;
@@ -627,8 +664,8 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
             else {
                 // Load related documents (detail or master based on isForMaster flag)
                 const relatedDocs = isForMaster
-                    ? await getMasterDcmtsAsync(dcmt.TID, dcmt.DID, maxDepthLevel)
-                    : await getDetailDcmtsAsync(dcmt.TID, dcmt.DID, maxDepthLevel);
+                    ? await getMasterDcmtsAsync(dcmt.TID, dcmt.DID, maxDepthLevel, abortController.signal)
+                    : await getDetailDcmtsAsync(dcmt.TID, dcmt.DID, maxDepthLevel, abortController.signal);
                 // Se showMainDocument è false, mostra i container dei dettagli direttamente sotto il container principale
                 if (!showMainDocument) {
                     // Check if a container for this TID already exists in the tree
@@ -775,8 +812,15 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
             // Check recursively if there are any actual documents
             return hasNoActualDocuments(container.items);
         });
+        // Calcolo interrotto dall'utente: mostra solo ciò che è stato calcolato,
+        // senza notificare l'assenza di correlazioni (il risultato è parziale, non definitivo)
+        const wasStopped = abortController.signal.aborted;
+        if (wasStopped) {
+            setLoadStoppedByUser(true);
+            onCalculationStopped?.();
+        }
         // If no relations found, notify parent
-        if (hasNoRelations && onNoRelationsFound) {
+        if (!wasStopped && hasNoRelations && onNoRelationsFound) {
             onNoRelationsFound();
         }
         // Update metadata error count state
@@ -804,7 +848,7 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
         // Now it will correctly detect expanded nodes and add infoMessage if all children are hidden
         const processedTree = updateHiddenProperty(expandedTree);
         setTreeData(processedTree);
-    }, [inputDcmts, dcmtTypes, maxDepthLevel, isForMaster, invertMasterNavigation, getDetailDcmtsAsync, getMasterDcmtsAsync, abortController, updateHiddenProperty, showMainDocument, labelMainContainer, onNoRelationsFound]);
+    }, [inputDcmts, dcmtTypes, maxDepthLevel, isForMaster, invertMasterNavigation, getDetailDcmtsAsync, getMasterDcmtsAsync, abortController, updateHiddenProperty, showMainDocument, labelMainContainer, onNoRelationsFound, onCalculationStopped]);
     /**
      * Merge main tree data with additional static items
      */
@@ -1047,15 +1091,15 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                 let loadedItems = [];
                 if (isForMaster && !invertMasterNavigation) {
                     // Original mode: detail documents load detail documents (natural detail→detail navigation)
-                    loadedItems = await getDetailDcmtsAsync(node.tid, node.did, 1);
+                    loadedItems = await getDetailDcmtsAsync(node.tid, node.did, 1, newAbortController.signal);
                 }
                 else if (isForMaster) {
                     // Inverted master mode: load master documents
-                    loadedItems = await getMasterDcmtsAsync(node.tid, node.did, 1);
+                    loadedItems = await getMasterDcmtsAsync(node.tid, node.did, 1, newAbortController.signal);
                 }
                 else {
                     // Standard mode: load detail documents
-                    loadedItems = await getDetailDcmtsAsync(node.tid, node.did, 1);
+                    loadedItems = await getDetailDcmtsAsync(node.tid, node.did, 1, newAbortController.signal);
                 }
                 // Espandi automaticamente il primo container se ci sono documenti correlati
                 if (loadedItems.length > 0 && loadedItems[0].isContainer) {
@@ -1417,13 +1461,13 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                             let loadedItems = [];
                             // Carica i documenti correlati (detail o master in base alla modalità)
                             if (isForMaster && !invertMasterNavigation) {
-                                loadedItems = await getDetailDcmtsAsync(node.tid, node.did, 1);
+                                loadedItems = await getDetailDcmtsAsync(node.tid, node.did, 1, newAbortController.signal);
                             }
                             else if (isForMaster) {
-                                loadedItems = await getMasterDcmtsAsync(node.tid, node.did, 1);
+                                loadedItems = await getMasterDcmtsAsync(node.tid, node.did, 1, newAbortController.signal);
                             }
                             else {
-                                loadedItems = await getDetailDcmtsAsync(node.tid, node.did, 1);
+                                loadedItems = await getDetailDcmtsAsync(node.tid, node.did, 1, newAbortController.signal);
                             }
                             // Applica le regole di visibilità (showZeroDcmts)
                             expandedNode.items = updateHiddenProperty(loadedItems);
@@ -1524,6 +1568,10 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
         return _jsx("div", { style: { padding: '20px', textAlign: 'center' }, children: _jsx(TMWaitPanel, { title: SDKUI_Localizator.LoadingDetailDocuments, showPrimary: true, textPrimary: waitPanelTextPrimary, valuePrimary: waitPanelValuePrimary, maxValuePrimary: waitPanelMaxValuePrimary, isCancelable: true, abortController: abortController, onAbortClick: () => { setTimeout(() => { abortController.abort(); }, 1000); } }) });
     }
     if (mergedTreeData.length === 0) {
+        // Calcolo interrotto dall'utente prima di aver calcolato qualsiasi correlazione
+        if (loadStoppedByUser) {
+            return _jsx(TMToppyMessage, { message: SDKUI_Localizator.RelationsCalculationStopped });
+        }
         // Se NON isForMaster e tutti i GetMetadataAsync sono falliti
         if (!isForMaster && metadataErrorCount === inputDcmts.length) {
             return _jsx(TMToppyMessage, { message: SDKUI_Localizator.DocumentsNotAvailableOrNoCorrelations });
@@ -1534,7 +1582,8 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
         return _jsx("div", { style: { padding: '20px', textAlign: 'center', color: '#666' }, children: SDKUI_Localizator.NoRelationsAvailable });
     }
     // Se isForMaster e non ci sono master documents disponibili
-    if (isForMaster && totalMasterDocuments === 0) {
+    // (se il calcolo è stato interrotto l'albero parziale viene comunque mostrato)
+    if (isForMaster && totalMasterDocuments === 0 && !loadStoppedByUser) {
         return _jsx(TMToppyMessage, { message: SDKUI_Localizator.NoMasterDocumentsAvailable });
     }
     return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', height: '100%', minHeight: 0, width: '100%' }, children: [showExpandAllButton && (_jsxs("div", { style: { flexShrink: 0, display: 'flex', alignItems: 'center', gap: '6px', height: '40px', paddingLeft: '10px', backgroundColor: TMColors.toolbar_background }, children: [_jsx(TMTooltip, { content: expandLevel === 0

package/lib/components/features/search/TMSearch.js

@@ -5,7 +5,7 @@ import TMSavedQuerySelector from './TMSavedQuerySelector';
 import TMTreeSelector from './TMTreeSelector';
 import { TabPanel, Item } from 'devextreme-react/tab-panel';
 import TMSearchQueryPanel, { refreshLastSearch } from './TMSearchQueryPanel';
-import { getSysAllDcmtsSQD, IconFilter, IconRecentlyViewed, IconSavedQuery, IconTree, removeMruTid, SDKUI_Globals, SDKUI_Localizator, updateMruTids } from '../../../helper';
+import { getSysAllDcmtsSQD, IconFilter, IconRecentlyViewed, IconSavedQuery, IconTree, mergeSearchResultsAppend, removeMruTid, SDKUI_Globals, SDKUI_Localizator, updateMruTids } from '../../../helper';
 import TMSearchResult from './TMSearchResult';
 import TMRecentsManager from '../../grids/TMRecentsManager';
 import { SearchResultContext } from '../../../ts';
@@ -164,6 +164,32 @@ const TMSearch = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTask
             console.error("Error refreshing search:", error);
         }
     };
+    const handleSearchCompleted = useCallback((searchResult, qd, append) => {
+        if (searchResult.length <= 0) {
+            // In ricerca normale un array vuoto resetta i risultati; in accoda si mantiene il set accumulato
+            if (!append)
+                setSearchResult(searchResult);
+            return;
+        }
+        const newResult = searchResult[0];
+        // In modalità accoda unisce il nuovo risultato a quello precedente (più recenti in cima).
+        setSearchResult(prev => {
+            if (append && prev.length > 0 && prev[0]?.fromTID === newResult?.fromTID) {
+                const merged = mergeSearchResultsAppend(prev[0], newResult);
+                return merged ? [merged] : searchResult;
+            }
+            return searchResult;
+        });
+        setLastQdSearched(qd);
+        setCurrentSearchView(TMSearchViews.Result);
+        // Salvataggio ultimi 10 TIDs
+        let fromTID = searchResult?.[0].fromTID;
+        let newMruTIDS = updateMruTids(SDKUI_Globals.userSettings.searchSettings.mruTIDs, fromTID);
+        SDKUI_Globals.userSettings.searchSettings.mruTIDs = newMruTIDS;
+        setMruTIDs(newMruTIDS);
+        setCurrentMruTID(fromTID);
+        setShowSearchResults(true);
+    }, []);
     const isMobile = deviceType === DeviceType.MOBILE;
     const isTabletOrMobile = deviceType === DeviceType.TABLET || deviceType === DeviceType.MOBILE;
     // --- JSX WRAPPERS ---
@@ -182,23 +208,10 @@ const TMSearch = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTask
             SDKUI_Globals.userSettings.searchSettings.mruTIDs = newMruTIDS;
             setMruTIDs(newMruTIDS);
         } }), [mruTIDs, currentMruTID, deviceType]);
-    const tmSearchQueryPanelElement = useMemo(() => _jsx(TMSearchQueryPanelWrapper, { passToArchiveCallback: passToArchiveCallback, isExpertMode: isExpertMode, showBackToResultButton: searchResult.length > 0, fromDTD: fromDTD, SQD: currentSQD, inputMids: inputMids, maxDcmtsToBeReturned: maxDcmtsToBeReturned, onBackToResult: () => { setCurrentSearchView(TMSearchViews.Result); }, onSearchCompleted: (searchResult, qd) => {
-            setSearchResult(searchResult);
-            if (searchResult.length <= 0)
-                return;
-            setLastQdSearched(qd);
-            setCurrentSearchView(TMSearchViews.Result);
-            // Salvataggio ultimi 10 TIDs 
-            let fromTID = searchResult?.[0].fromTID;
-            let newMruTIDS = updateMruTids(SDKUI_Globals.userSettings.searchSettings.mruTIDs, fromTID);
-            SDKUI_Globals.userSettings.searchSettings.mruTIDs = newMruTIDS;
-            setMruTIDs(newMruTIDS);
-            setCurrentMruTID(fromTID);
-            setShowSearchResults(true);
-        }, onSqdSaved: async (newSqd) => {
+    const tmSearchQueryPanelElement = useMemo(() => _jsx(TMSearchQueryPanelWrapper, { passToArchiveCallback: passToArchiveCallback, isExpertMode: isExpertMode, showBackToResultButton: searchResult.length > 0, fromDTD: fromDTD, SQD: currentSQD, inputMids: inputMids, maxDcmtsToBeReturned: maxDcmtsToBeReturned, onBackToResult: () => { setCurrentSearchView(TMSearchViews.Result); }, onSearchCompleted: handleSearchCompleted, onSqdSaved: async (newSqd) => {
             await loadDataSQDsAsync(true, newSqd.masterTID);
             await setSQDAsync(newSqd);
-        } }), [fromDTD, showSearchResults, setShowSearchResults, currentSQD, isExpertMode, mruTIDs, searchResult, passToArchiveCallback, inputMids, maxDcmtsToBeReturned]);
+        } }), [fromDTD, showSearchResults, setShowSearchResults, currentSQD, isExpertMode, mruTIDs, searchResult, passToArchiveCallback, inputMids, maxDcmtsToBeReturned, handleSearchCompleted]);
     const tmSavedQuerySelectorElement = useMemo(() => _jsxs(TabPanel, { width: "100%", height: "100%", showNavButtons: true, repaintChangesOnly: true, selectedIndex: currentSQDMode, onSelectedIndexChange: (index) => setCurrentSQDMode(index), children: [(currentTID || currentSQD) ? _jsx(Item, { title: fromDTD?.nameLoc, children: _jsx(TMSavedQuerySelectorWrapper, { allowShowSearch: false, items: filteredByTIDSQDs, selectedId: currentSQD?.id, onRefreshData: () => { loadDataSQDsAsync(true); }, onItemClick: (sqd) => {
                         onSQDItemClick(sqd, setSQDAsync);
                     }, onDeleted: (sqd) => onSQDDeleted(sqd, sqd.id == currentSQD?.id ? filteredByTIDSQDs.find(o => o.id == 1) : currentSQD, setSQDAsync), refreshFavoriteSavedQueries: refreshFavoriteSavedQueries }) }) : _jsx(_Fragment, {}), _jsx(Item, { title: SDKUI_Localizator.AllFemale, children: _jsx(TMSavedQuerySelectorWrapper, { allowShowSearch: true, items: allSQDs, manageDefault: false, onItemClick: (sqd) => {

package/lib/components/features/search/TMSearchQueryEditor.js

@@ -58,10 +58,12 @@ const TMSearchQueryEditor = ({ qd, dcmtTypesList = [], isExpertMode = SDKUI_Glob
     const handleItemSelect = useCallback((tid, mid) => {
         if (currentEditingMID !== mid)
             setCurrentEditingMID(mid);
-        if (!focusedTidMid || mid !== focusedTidMid.mid) {
-            setFocusedTidMid({ tid: tid, mid: mid });
+        if (!focusedTidMid || mid !== focusedTidMid.mid || tid !== focusedTidMid.tid) {
+            const newFocusedTidMid = { tid: tid, mid: mid };
+            setFocusedTidMid(newFocusedTidMid);
+            onFocusedMetadataChanged?.(newFocusedTidMid);
         }
-    }, [currentEditingMID, focusedTidMid]);
+    }, [currentEditingMID, focusedTidMid, onFocusedMetadataChanged]);
     const handleAdvancedMenuClick = useCallback((e) => {
         if (e.button === AdvancedMenuButtons.MakeEditable && e.mid) {
             addOrRemoveEditableList(e.mid);

package/lib/components/features/search/TMSearchQueryPanel.d.ts

@@ -12,7 +12,7 @@ interface ITMSearchQueryPanelProps {
     onBack?: () => void;
     onBackToResult?: () => void;
     onSqdSaved?: (newSqd: SavedQueryDescriptor) => void;
-    onSearchCompleted?: (searchResult: SearchResultDescriptor[], qd: QueryDescriptor | undefined) => void;
+    onSearchCompleted?: (searchResult: SearchResultDescriptor[], qd: QueryDescriptor | undefined, append?: boolean) => void;
     onClosePanel?: () => void;
     allowMaximize?: boolean;
     onMaximizePanel?: () => void;