@topconsultnpm/sdkui-react 6.22.0-t1 → 6.22.0-t3

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

@@ -1,9 +1,9 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { DcmtTypeListCacheService, LayoutModes, ObjectClasses, SDK_Globals, SDK_Localizator } from '@topconsultnpm/sdk-ts';
 import TMRelationViewer from './TMRelationViewer';
 import TMContextMenu from '../../NewComponents/ContextMenu/TMContextMenu';
-import { IconMultipleSelection, IconCheckFile, IconDetailDcmts, SDKUI_Localizator, IconMenuVertical, IconDataList, IconPreview, IconSearchCheck, IconBoard, IconDcmtTypeSys, IconShow, getMoreInfoTasksForDocument, isApprovalWorkflowView, searchResultToMetadataValues, IconRefresh } from '../../../helper';
+import { IconMultipleSelection, IconCheckFile, IconDetailDcmts, SDKUI_Localizator, IconMenuVertical, IconDataList, IconPreview, IconSearchCheck, IconBoard, IconDcmtTypeSys, IconShow, getMoreInfoTasksForDocument, isApprovalWorkflowView, searchResultToMetadataValues, IconRefresh, SDKUI_Globals } from '../../../helper';
 import { FormModes, SearchResultContext } from '../../../ts';
 import { TMColors } from '../../../utils/theme';
 import ShowAlert from '../../base/TMAlert';
@@ -14,16 +14,17 @@ import { TMPanelManagerProvider, useTMPanelManagerContext } from '../../layout/p
 import TMSearchResult from '../search/TMSearchResult';
 import TMDcmtForm from './TMDcmtForm';
 import { TMNothingToShow } from './TMDcmtPreview';
-import { TMButton, TMLayoutWaitingContainer } from '../..';
+import { TMButton } from '../..';
+import TMLayoutContainer from '../../base/TMLayout';
 import { useDocumentOperations } from '../../../hooks/useDocumentOperations';
 import TMToppyMessage from '../../../helper/TMToppyMessage';
 import TMPanel from '../../base/TMPanel';
-import sixLogo from '../../../assets/six.png';
-const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, deviceType, inputDcmts, isForMaster, showCurrentDcmtIndicator = true, allowNavigation, canNext, canPrev, onNext, onPrev, onBack, appendMasterDcmts, onTaskCreateRequest, onRefreshAfterAddDcmtToFavs, editPdfForm, openS4TViewer, onOpenS4TViewerRequest, onOpenPdfEditorRequest, datagridUtility, dcmtUtility, fetchRemoteCertificates }) => {
+import TMSpinner from '../../base/TMSpinner';
+const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, deviceType, inputDcmts, isForMaster, showCurrentDcmtIndicator = true, allowNavigation, canNext, canPrev, onNext, onPrev, onBack, onFirstLoadCompleted, appendMasterDcmts, onTaskCreateRequest, onRefreshAfterAddDcmtToFavs, editPdfForm, openS4TViewer, onOpenS4TViewerRequest, onOpenPdfEditorRequest, datagridUtility, dcmtUtility, fetchRemoteCertificates }) => {
     const floatingBarContainerRef = useRef(null);
     const [focusedItem, setFocusedItem] = useState();
     const [selectedItems, setSelectedItems] = useState([]);
-    const [showZeroDcmts, setShowZeroDcmts] = useState(false);
+    const [showZeroDcmts, setShowZeroDcmts] = useState(() => SDKUI_Globals.userSettings?.searchSettings?.relationShowZeroDcmts ?? false);
     const [allowMultipleSelection, setAllowMultipleSelection] = useState(false);
     const [dtdMaster, setDtdMaster] = useState();
     const [noRelationsOnFirstLoad, setNoRelationsOnFirstLoad] = useState(false);
@@ -32,6 +33,11 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
     const [contextMenuPosition, setContextMenuPosition] = useState({ x: 0, y: 0 });
     // Track if TMRelationViewer is loading (used to disable context menu during loading)
     const [isRelationViewerLoading, setIsRelationViewerLoading] = useState(false);
+    // Funzione fornita da TMRelationViewer per interrompere il calcolo delle correlazioni
+    // (nessuna ulteriore chiamata GetMetadata). È sincrona: invocabile anche subito prima di uscire.
+    const stopRelationsCalculationRef = useRef(undefined);
+    // True quando si sta uscendo dalla maschera: evita l'alert sui risultati parziali
+    const isLeavingRef = useRef(false);
     // Track if loading has ever been TRUE (to distinguish initial false from post-load false)
     const hasLoadingBeenTrueRef = useRef(false);
     // Track the previous loading state to detect transitions
@@ -40,6 +46,13 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
     const [refreshKey, setRefreshKey] = useState(0);
     // Separate refresh key for TMFormOrResultWrapper only (doesn't affect tmTreeView)
     const [refreshKeyFormOrResult, setRefreshKeyFormOrResult] = useState(0);
+    // Stato dell'albero conservato qui perché il bump di refreshKey rimonta TMRelationViewer:
+    // una ref interna al viewer non sopravvivrebbe. Riletto dal useMemo di tmTreeView,
+    // che si ricalcola proprio al refresh.
+    const treeStateRef = useRef(undefined);
+    const handleTreeStateChange = useCallback((state) => {
+        treeStateRef.current = state;
+    }, []);
     /** State for transformed focusedItem metadata values (similar to formData in TMDcmtForm) */
     const [focusedItemFormData, setFocusedItemFormData] = useState([]);
     // Trigger operationItems refresh (after file substitution, etc.)
@@ -59,10 +72,67 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
             setIsCheckingFirstLoad(false);
         }
     }, [isRelationViewerLoading, isCheckingFirstLoad]);
+    useEffect(() => {
+        if (!isCheckingFirstLoad)
+            onFirstLoadCompleted?.();
+    }, [isCheckingFirstLoad, onFirstLoadCompleted]);
+    // Dal montaggio fino all'apertura del wait panel del viewer (il tempo di caricare i
+    // tipi documento) la pagina resta nascosta: senza spinner non si vedrebbe nulla.
+    const [waitingFirstLoad, setWaitingFirstLoad] = useState(true);
+    useEffect(() => {
+        if (!waitingFirstLoad)
+            return;
+        // Da qui in avanti e' il wait panel a dare riscontro
+        if (isRelationViewerLoading) {
+            setWaitingFirstLoad(false);
+            return;
+        }
+        TMSpinner.show({ description: SDKUI_Localizator.Loading });
+        return () => TMSpinner.hide();
+    }, [waitingFirstLoad, isRelationViewerLoading]);
     // Increments trigger counter to force operationItems to re-calculate
     const onRefreshOperationsDatagrid = useCallback(async () => {
         setRefreshOperationsTrigger(prev => prev + 1);
     }, []);
+    // Riceve da TMRelationViewer la funzione per interrompere il calcolo
+    const handleStopCalculationReady = useCallback((stopCalculation) => {
+        stopRelationsCalculationRef.current = stopCalculation;
+    }, []);
+    // Esce dalla maschera interrompendo anche le chiamate GetMetadata ancora in coda:
+    // l'interruzione è invocata in modo sincrono perché onBack può smontare il componente
+    // (un effect non farebbe in tempo a propagare l'interruzione)
+    const handleBack = useCallback(() => {
+        isLeavingRef.current = true;
+        stopRelationsCalculationRef.current?.();
+        onBack?.();
+    }, [onBack]);
+    // Letta da handleRelationsCalculationStopped, che deve restare stabile: arriva fino
+    // alle dipendenze di loadData nel viewer, dove un cambio farebbe ripartire il calcolo
+    const handleBackRef = useRef(handleBack);
+    handleBackRef.current = handleBack;
+    // Notifica all'utente che i dati mostrati sono parziali
+    const handleRelationsCalculationStopped = useCallback((loadedCount, totalCount) => {
+        if (isLeavingRef.current)
+            return;
+        // Interrotto prima di calcolare qualcosa: non c'è nulla da mostrare, si torna indietro
+        if (loadedCount === 0) {
+            ShowAlert({
+                message: SDKUI_Localizator.RelationsCalculationStoppedEmpty,
+                title: SDKUI_Localizator.Attention,
+                duration: 6000,
+                mode: 'warning',
+            });
+            handleBackRef.current();
+            return;
+        }
+        // Testo breve: il box di ShowAlert ha altezza fissa e taglia oltre le due righe
+        ShowAlert({
+            message: SDKUI_Localizator.RelationsCalculationStoppedProgress.replaceParams(loadedCount.toString(), totalCount.toString()),
+            title: SDKUI_Localizator.Attention,
+            duration: 6000,
+            mode: 'info',
+        });
+    }, []);
     // Refresh ALL panels (tree view + search results) with fade-out -> update -> fade-in transition
     const onRefreshAllPanels = async () => {
         await dcmtUtility?.onRefreshPreviewForm?.(); // Refresh preview form data
@@ -237,7 +307,12 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
             onRefreshAfterAddDcmtToFavs,
         },
     });
-    const { dcmtOperations: { abortController, showWaitPanel, showPrimary, waitPanelTitle, waitPanelTextPrimary, waitPanelValuePrimary, waitPanelMaxValuePrimary, showSecondary, waitPanelTextSecondary, waitPanelValueSecondary, waitPanelMaxValueSecondary, }, } = features;
+    // Nuovi documenti in input: il componente non sta più uscendo dalla maschera
+    // (chiave stabile: l'array inputDcmts può essere ricreato a ogni render)
+    const inputDcmtsKey = useMemo(() => (inputDcmts ?? []).map(d => `${d.TID}-${d.DID}`).join('|'), [inputDcmts]);
+    useEffect(() => {
+        isLeavingRef.current = false;
+    }, [inputDcmtsKey]);
     // Load dtdMaster when inputDcmts changes
     useEffect(() => {
         const loadDtdMaster = async () => {
@@ -300,7 +375,11 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
             icon: _jsx(IconCheckFile, { color: showZeroDcmts ? TMColors.tertiary : TMColors.text_normal }),
             name: showZeroDcmts ? SDKUI_Localizator.HideDetailsWithZeroDocs : SDKUI_Localizator.ShowDetailsWithZeroDocs,
             onClick: () => {
-                setShowZeroDcmts(prev => !prev);
+                setShowZeroDcmts(prev => {
+                    const newValue = !prev;
+                    SDKUI_Globals.userSettings.searchSettings.relationShowZeroDcmts = newValue;
+                    return newValue;
+                });
             }
         },
         {
@@ -331,11 +410,11 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
                         setContextMenuVisible(true);
                     }, children: [_jsx(TMRelationViewerWrapper, { refreshKey: refreshKey, inputDcmts: inputDcmts, isForMaster: isForMaster, showCurrentDcmtIndicator: showCurrentDcmtIndicator, showZeroDcmts: showZeroDcmts, 
                             // customItemRender={customItemRender}
-                            allowMultipleSelection: allowMultipleSelection, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: handleFocusedItemChanged, onSelectedItemsChanged: handleSelectedItemsChanged, onNoRelationsFound: handleNoRelationsFound, onItemContextMenu: isRelationViewerLoading ? undefined : onItemContextMenu, focusedItemFormData: focusedItemFormData, onLoadingStateChanged: setIsRelationViewerLoading }), _jsx(TMContextMenu, { items: operationItems, externalControl: {
+                            allowMultipleSelection: allowMultipleSelection, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: handleFocusedItemChanged, onSelectedItemsChanged: handleSelectedItemsChanged, onNoRelationsFound: handleNoRelationsFound, onItemContextMenu: isRelationViewerLoading ? undefined : onItemContextMenu, onLoadingStateChanged: setIsRelationViewerLoading, onStopCalculationReady: handleStopCalculationReady, onCalculationStopped: handleRelationsCalculationStopped, initialTreeState: treeStateRef.current, onTreeStateChange: handleTreeStateChange }), _jsx(TMContextMenu, { items: operationItems, externalControl: {
                                 visible: contextMenuVisible,
                                 position: contextMenuPosition,
                                 onClose: () => setContextMenuVisible(false)
-                            } })] }) }), [inputDcmts, isForMaster, showCurrentDcmtIndicator, showZeroDcmts, allowMultipleSelection, focusedItem, selectedItems, handleFocusedItemChanged, handleSelectedItemsChanged, handleNoRelationsFound, onItemContextMenu, contextMenuVisible, contextMenuPosition, refreshKey, focusedItemFormData, isRelationViewerLoading]);
+                            } })] }) }), [inputDcmts, isForMaster, showCurrentDcmtIndicator, showZeroDcmts, allowMultipleSelection, focusedItem, selectedItems, handleFocusedItemChanged, handleSelectedItemsChanged, handleNoRelationsFound, onItemContextMenu, contextMenuVisible, contextMenuPosition, refreshKey, focusedItemFormData, isRelationViewerLoading, handleStopCalculationReady, handleRelationsCalculationStopped, handleTreeStateChange]);
     const tmFormOrResult = useMemo(() => _jsx(TMFormOrResultWrapper, { refreshKey: refreshKeyFormOrResult, deviceType: deviceType, focusedItem: focusedItem, onTaskCreateRequest: onTaskCreateRequest, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, handleNavigateToReference: handleNavigateToReference, onRefreshAfterAddDcmtToFavs: onRefreshAfterAddDcmtToFavs, editPdfForm: editPdfForm, openS4TViewer: openS4TViewer, onOpenS4TViewerRequest: onOpenS4TViewerRequest, onOpenPdfEditorRequest: onOpenPdfEditorRequest, onRefreshSearchResults: onRefreshAllPanels }), [focusedItem, deviceType, allTasks, handleNavigateToWGs, handleNavigateToDossiers, handleNavigateToReference, editPdfForm, openS4TViewer, onOpenS4TViewerRequest, onOpenPdfEditorRequest, onRefreshAfterAddDcmtToFavs, refreshKeyFormOrResult]);
     const initialPanelDimensions = {
         'tmTreeView': { width: '50%', height: '100%' },
@@ -366,7 +445,9 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
                     title: getTitle(),
                     toolbar: toolbar,
                     allowMaximize: !isMobile,
-                    onBack: onBack
+                    // handleBack interrompe il calcolo prima di uscire.
+                    // Resta undefined se il padre non ha passato onBack (nessun pulsante indietro)
+                    onBack: onBack ? handleBack : undefined
                 }
             },
             toolbarOptions: {
@@ -413,10 +494,7 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
             toolbarOptions: { icon: _jsx(IconSearchCheck, { fontSize: 24 }), visible: false, orderNumber: 2, isActive: allInitialPanelVisibility['tmFormOrResult'] }
         }
     ], [tmTreeView, tmFormOrResult, focusedItem?.isDcmt, dtdMaster]);
-    return (_jsxs("div", { style: { width: '100%', height: '100%', position: 'relative' }, children: [isCheckingFirstLoad && (_jsx(TMLoadingOverlay, { onCancel: () => {
-                    setIsCheckingFirstLoad(false);
-                    onBack?.();
-                } })), _jsxs("div", { style: isCheckingFirstLoad ? { position: 'absolute', width: 0, height: 0, overflow: 'hidden', opacity: 0, pointerEvents: 'none' } : { width: '100%', height: '100%' }, children: [_jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'tmTreeView', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }) }), renderDcmtOperations, renderFloatingBar] })] }));
+    return (_jsx("div", { style: { width: '100%', height: '100%', position: 'relative' }, children: _jsxs("div", { style: isCheckingFirstLoad ? { position: 'absolute', width: 0, height: 0, overflow: 'hidden', opacity: 0, pointerEvents: 'none' } : { width: '100%', height: '100%' }, children: [_jsx(TMLayoutContainer, { direction: 'vertical', children: _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'tmTreeView', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }) }), renderDcmtOperations, renderFloatingBar] }) }));
 };
 export default TMMasterDetailDcmts;
 /**
@@ -425,7 +503,7 @@ export default TMMasterDetailDcmts;
  * - Panel visibility toggling
  * - Focus delay handling
  */
-const TMRelationViewerWrapper = ({ refreshKey, inputDcmts, isForMaster, showCurrentDcmtIndicator, showZeroDcmts, customItemRender, allowMultipleSelection, focusedItem, selectedItems, onFocusedItemChanged, onSelectedItemsChanged, onNoRelationsFound, onItemContextMenu, focusedItemFormData, onLoadingStateChanged }) => {
+const TMRelationViewerWrapper = ({ refreshKey, inputDcmts, isForMaster, showCurrentDcmtIndicator, showZeroDcmts, customItemRender, allowMultipleSelection, focusedItem, selectedItems, onFocusedItemChanged, onSelectedItemsChanged, onNoRelationsFound, onItemContextMenu, onLoadingStateChanged, onStopCalculationReady, onCalculationStopped, initialTreeState, onTreeStateChange }) => {
     const { setPanelVisibilityById, setToolbarButtonVisibility } = useTMPanelManagerContext();
     // Monitor device type changes to restore panel visibility when switching from mobile to desktop
     const deviceType = useDeviceType();
@@ -485,7 +563,7 @@ const TMRelationViewerWrapper = ({ refreshKey, inputDcmts, isForMaster, showCurr
             onItemContextMenu?.(item, e);
         }, 100);
     }, [onItemContextMenu, handleFocusedItemChanged]);
-    return (_jsx(TMRelationViewer, { inputDcmts: inputDcmts, isForMaster: isForMaster, showCurrentDcmtIndicator: showCurrentDcmtIndicator, initialShowZeroDcmts: showZeroDcmts, customItemRender: customItemRender, allowMultipleSelection: allowMultipleSelection, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: handleFocusedItemChanged, onSelectedItemsChanged: onSelectedItemsChanged, maxDepthLevel: 1, invertMasterNavigation: false, showExpandAllButton: true, onNoRelationsFound: onNoRelationsFound, onItemContextMenu: onContextMenu, focusedItemFormData: focusedItemFormData, onLoadingStateChanged: onLoadingStateChanged }, refreshKey));
+    return (_jsx(TMRelationViewer, { inputDcmts: inputDcmts, isForMaster: isForMaster, showCurrentDcmtIndicator: showCurrentDcmtIndicator, initialShowZeroDcmts: showZeroDcmts, customItemRender: customItemRender, allowMultipleSelection: allowMultipleSelection, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: handleFocusedItemChanged, onSelectedItemsChanged: onSelectedItemsChanged, maxDepthLevel: 1, invertMasterNavigation: false, showExpandAllButton: true, onNoRelationsFound: onNoRelationsFound, onItemContextMenu: onContextMenu, onLoadingStateChanged: onLoadingStateChanged, onStopCalculationReady: onStopCalculationReady, onCalculationStopped: onCalculationStopped, initialTreeState: initialTreeState, onTreeStateChange: onTreeStateChange }, refreshKey));
 };
 const TMFormOrResultWrapper = ({ refreshKey, deviceType, focusedItem, onTaskCreateRequest, allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, onRefreshAfterAddDcmtToFavs, editPdfForm, openS4TViewer, onOpenS4TViewerRequest, onOpenPdfEditorRequest, onRefreshSearchAsyncDatagrid, onRefreshSearchResults, handleNavigateToReference, fetchRemoteCertificates }) => {
     const { setPanelVisibilityById } = useTMPanelManagerContext();
@@ -495,94 +573,3 @@ const TMFormOrResultWrapper = ({ refreshKey, deviceType, focusedItem, onTaskCrea
                 }, fetchRemoteCertificates: fetchRemoteCertificates }, refreshKey) :
             focusedItem?.searchResult === undefined ? (_jsx(TMPanel, { title: SDKUI_Localizator.SearchResult, children: _jsx(TMToppyMessage, { message: SDKUI_Localizator.SelectDocumentToViewSearchResults }) })) : (_jsx(TMSearchResult, { groupId: 'tmFormOrResult', isClosable: deviceType !== DeviceType.MOBILE, context: SearchResultContext.METADATA_SEARCH, allowFloatingBar: false, allowRelations: false, openDcmtFormAsModal: true, searchResults: focusedItem?.searchResult ?? [], showSearchResultSidebar: false, showDcmtFormSidebar: false, autoFocusFirstRow: false, onTaskCreateRequest: onTaskCreateRequest, onClose: () => { setPanelVisibilityById('tmTreeView', true); }, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, editPdfForm: editPdfForm, onOpenPdfEditorRequest: onOpenPdfEditorRequest, openS4TViewer: openS4TViewer, onOpenS4TViewerRequest: onOpenS4TViewerRequest, enablePinIcons: false, onRefreshAfterAddDcmtToFavs: onRefreshAfterAddDcmtToFavs, showBackButton: false, onRefreshSearchAsyncDatagrid: onRefreshSearchResults, onReferenceClick: handleNavigateToReference, fetchRemoteCertificates: fetchRemoteCertificates }, refreshKey)) }));
 };
-const TMLoadingOverlay = ({ onCancel, description, cancelText }) => {
-    return (_jsx("div", { style: {
-            position: 'absolute',
-            top: 0,
-            left: 0,
-            width: '100%',
-            height: '100%',
-            backgroundColor: 'rgba(248, 250, 252, 0.92)',
-            zIndex: 1000,
-            display: 'flex',
-            justifyContent: 'center',
-            alignItems: 'center',
-        }, children: _jsxs("div", { style: {
-                display: 'flex',
-                flexDirection: 'column',
-                alignItems: 'center',
-                gap: '16px',
-                padding: '24px 32px',
-                background: '#fcfcfc',
-                borderRadius: '8px',
-                boxShadow: '0 4px 16px rgba(0, 0, 0, 0.1)',
-            }, children: [_jsxs("div", { style: { position: 'relative', width: '80px', height: '80px' }, children: [_jsx("img", { style: {
-                                position: 'absolute',
-                                top: '50%',
-                                left: '50%',
-                                transform: 'translate(-54%, -54%)'
-                            }, src: sixLogo, width: 35, alt: "" }), _jsx("style", { children: `
-						@keyframes tmSpinnerRotate {
-							0% { transform: rotate(0deg); }
-							100% { transform: rotate(360deg); }
-						}
-						.tm-spinner-animation {
-							display: inline-block;
-							width: 80px;
-							height: 80px;
-							position: absolute;
-							top: 50%;
-							left: 50%;
-							transform: translate(-50%, -50%);
-						}
-						.tm-spinner-animation div {
-							animation: tmSpinnerRotate 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
-							transform-origin: 40px 40px;
-						}
-						.tm-spinner-animation div:after {
-							content: " ";
-							display: block;
-							position: absolute;
-							width: 7px;
-							height: 7px;
-							border-radius: 50%;
-							background: #0c448e;
-							margin: -4px 0 0 -4px;
-						}
-						.tm-spinner-animation div:nth-child(1) { animation-delay: -0.036s; }
-						.tm-spinner-animation div:nth-child(1):after { top: 63px; left: 63px; background: #f7a51f; }
-						.tm-spinner-animation div:nth-child(2) { animation-delay: -0.072s; }
-						.tm-spinner-animation div:nth-child(2):after { top: 68px; left: 56px; background: #f7a51f; }
-						.tm-spinner-animation div:nth-child(3) { animation-delay: -0.108s; }
-						.tm-spinner-animation div:nth-child(3):after { top: 71px; left: 48px; background: #d3237b; }
-						.tm-spinner-animation div:nth-child(4) { animation-delay: -0.144s; }
-						.tm-spinner-animation div:nth-child(4):after { top: 72px; left: 40px; background: #d3237b; }
-						.tm-spinner-animation div:nth-child(5) { animation-delay: -0.18s; }
-						.tm-spinner-animation div:nth-child(5):after { top: 71px; left: 32px; background: #d12a1c; }
-						.tm-spinner-animation div:nth-child(6) { animation-delay: -0.216s; }
-						.tm-spinner-animation div:nth-child(6):after { top: 68px; left: 24px; background: #d12a1c; }
-						.tm-spinner-animation div:nth-child(7) { animation-delay: -0.252s; }
-						.tm-spinner-animation div:nth-child(7):after { top: 63px; left: 17px; background: #782b7d; }
-						.tm-spinner-animation div:nth-child(8) { animation-delay: -0.288s; }
-						.tm-spinner-animation div:nth-child(8):after { top: 56px; left: 12px; background: #782b7d; }
-					` }), _jsxs("div", { className: "tm-spinner-animation", children: [_jsx("div", {}), _jsx("div", {}), _jsx("div", {}), _jsx("div", {}), _jsx("div", {}), _jsx("div", {}), _jsx("div", {}), _jsx("div", {})] })] }), _jsx("span", { style: { fontSize: '14px', color: '#334155', textAlign: 'center' }, children: description ?? SDKUI_Localizator.Loading }), onCancel && (_jsx("button", { onClick: onCancel, style: {
-                        marginTop: '4px',
-                        padding: '8px 24px',
-                        fontSize: '13px',
-                        fontWeight: 500,
-                        color: '#64748b',
-                        background: 'transparent',
-                        border: '1.5px solid #cbd5e1',
-                        borderRadius: '6px',
-                        cursor: 'pointer',
-                        transition: 'all 0.2s ease',
-                    }, onMouseEnter: (e) => {
-                        e.currentTarget.style.background = '#f1f5f9';
-                        e.currentTarget.style.borderColor = '#94a3b8';
-                        e.currentTarget.style.color = '#475569';
-                    }, onMouseLeave: (e) => {
-                        e.currentTarget.style.background = 'transparent';
-                        e.currentTarget.style.borderColor = '#cbd5e1';
-                        e.currentTarget.style.color = '#64748b';
-                    }, children: cancelText ?? SDKUI_Localizator.Cancel }))] }) }));
-};

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

@@ -0,0 +1,20 @@
+import React from 'react';
+import { DcmtTypeDescriptor } from '@topconsultnpm/sdk-ts';
+import { DcmtInfo } from '../../../ts';
+interface TMMasterInfoFieldsProps {
+    /** Tipo documento: definisce i metadati (utente) da mostrare e come formattarli */
+    dtd: DcmtTypeDescriptor | undefined;
+    /** Documento di cui mostrare i metadati: se cambia, i valori vengono riletti */
+    dcmt: DcmtInfo | undefined;
+    /** Legge i valori del documento indicizzati per mid (il chiamante li tiene in cache) */
+    getValuesByMidAsync: () => Promise<Map<number, any>>;
+    /** Incrementare per forzare la rilettura dei valori (es. dopo il salvataggio del documento) */
+    reloadToken?: number;
+    /**
+     * Vista a tutto schermo: c'è spazio per tutti i metadati, quindi niente limite dell'anteprima
+     * ed è qui che compare la ricerca per nome/valore.
+     */
+    isExpandedView?: boolean;
+}
+declare const TMMasterInfoFields: ({ dtd, dcmt, getValuesByMidAsync, reloadToken, isExpandedView }: TMMasterInfoFieldsProps) => React.JSX.Element;
+export default TMMasterInfoFields;

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

@@ -0,0 +1,185 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from 'react';
+import { DataListViewModes, MetadataDataDomains, SDK_Globals } from '@topconsultnpm/sdk-ts';
+import { hoverStyle, IconChevronDown, IconClearButton, IconCopy, IconSearch, IconSuccess, SDKUI_Localizator } from '../../../helper';
+import { canViewMetadata, formatScalarValue, getUserMetadataSorted } from '../../../helper/dcmtsHelper';
+import { useDataListItem } from '../../../hooks/useDataListItem';
+import { TMColors } from '../../../utils/theme';
+import ShowAlert from '../../base/TMAlert';
+import TMTooltip from '../../base/TMTooltip';
+// Metadati mostrati in linea prima del pulsante "mostra tutti".
+const PREVIEW_COUNT = 12;
+const styles = {
+    wrapper: { display: 'flex', flexDirection: 'column', flex: 1, minHeight: 0, borderTop: `1px solid ${TMColors.card_background}` },
+    body: { flex: 1, minHeight: 0, padding: '13px 10px 9px', display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(185px, 1fr))', gridAutoRows: 'max-content', alignContent: 'start', columnGap: '10px', rowGap: '13px', overflow: 'auto' },
+    item: { position: 'relative', display: 'flex', alignItems: 'center', minWidth: 0, minHeight: '30px', padding: '5px 10px 4px', borderRadius: '8px', border: `1px solid ${TMColors.card_background}`, background: TMColors.default_background, transition: 'border-color 0.15s ease, box-shadow 0.15s ease' },
+    // Come per il pulsante copia, la posizione sta sull'ancora del tooltip; il troncamento con i
+    // puntini deve invece stare sull'elemento che contiene il testo
+    label: { position: 'absolute', top: '-7px', left: '8px', maxWidth: 'calc(100% - 16px)', minWidth: 0, padding: '0 5px', background: TMColors.default_background },
+    labelText: { maxWidth: '100%', fontSize: '9px', fontWeight: 700, lineHeight: '13px', letterSpacing: '0.5px', textTransform: 'uppercase', color: TMColors.label_normal, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' },
+    value: { display: 'block', width: '100%', fontSize: '12.5px', fontWeight: 500, color: TMColors.text_normal, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', userSelect: 'text', cursor: 'text', minHeight: '17px', lineHeight: '17px' },
+    emptyValue: { color: TMColors.disabled, fontWeight: 400 },
+    // Pulsante di copia: pastiglia sul bordo superiore della card, come la caption
+    // La posizione sta sull'ancora e non sul pulsante: è il contenitore del tooltip, che deve stare
+    // dove si vede il pulsante, altrimenti il tooltip si aprirebbe altrove
+    copyBtnAnchor: { position: 'absolute', top: '-9px', right: '6px', transition: 'opacity 0.15s ease' },
+    copyBtn: { display: 'flex', alignItems: 'center', justifyContent: 'center', width: '18px', height: '18px', padding: 0, borderRadius: '50%', border: `1px solid ${TMColors.card_background}`, background: TMColors.default_background, color: TMColors.label_normal, cursor: 'pointer', transition: 'background 0.15s ease, color 0.15s ease, border-color 0.15s ease' },
+    placeholder: { gridColumn: '1 / -1', padding: '6px 2px', color: TMColors.label_normal, fontSize: '12px' },
+    // Barra di ricerca
+    searchBar: { display: 'flex', alignItems: 'center', gap: '8px', padding: '12px 14px 0', flexShrink: 0 },
+    searchBox: { position: 'relative', display: 'flex', alignItems: 'center', flex: 1, minWidth: 0, maxWidth: '300px', height: '26px', borderRadius: '13px', border: `1px solid ${TMColors.card_background}`, background: TMColors.toolbar_background, transition: 'border-color 0.15s ease, box-shadow 0.15s ease' },
+    searchIcon: { flexShrink: 0, margin: '0 3px 0 9px', color: TMColors.label_normal, display: 'flex' },
+    searchInput: { flex: 1, minWidth: 0, height: '100%', padding: '0 2px', margin: 0, border: 'none', outline: 'none', background: 'transparent', fontSize: '12px', color: TMColors.text_normal },
+    searchClear: { display: 'flex', alignItems: 'center', justifyContent: 'center', width: '18px', height: '18px', marginRight: '5px', padding: 0, border: 'none', borderRadius: '50%', background: 'transparent', color: TMColors.label_normal, cursor: 'pointer', flexShrink: 0, transition: 'background 0.15s ease, color 0.15s ease' },
+    searchCount: { fontSize: '11px', fontWeight: 600, color: TMColors.label_normal, whiteSpace: 'nowrap', flexShrink: 0 },
+    // Pulsante "mostra tutti / comprimi"
+    footer: { display: 'flex', alignItems: 'center', justifyContent: 'center', padding: '2px 10px 9px', flexShrink: 0 },
+    showAllBtn: { display: 'inline-flex', alignItems: 'center', gap: '6px', height: '24px', padding: '0 13px', borderRadius: '12px', border: `1px solid ${TMColors.primary_container}`, background: TMColors.primary_container, color: TMColors.primary, fontSize: '11.5px', fontWeight: 700, letterSpacing: '0.2px', cursor: 'pointer', transition: 'background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease' },
+};
+// Sui dispositivi touch l'hover non esiste: il pulsante di copia deve restare sempre visibile
+const SUPPORTS_HOVER = typeof window === 'undefined' || window.matchMedia?.('(hover: hover)')?.matches !== false;
+// Colori del pulsante di copia nei suoi tre stati
+const COPY_BTN_IDLE = { background: TMColors.default_background, borderColor: TMColors.card_background, color: TMColors.label_normal };
+const COPY_BTN_HOVER = { background: TMColors.primary_container, borderColor: TMColors.primary, color: TMColors.primary };
+const COPY_BTN_COPIED = { background: TMColors.default_background, borderColor: TMColors.success, color: TMColors.success };
+// Card di un singolo metadato: hover e feedback della copia sono locali, così non si ridisegna tutta la griglia
+const MetadataCard = ({ caption, copyText, children }) => {
+    const [isHovered, setIsHovered] = useState(false);
+    const [isCopied, setIsCopied] = useState(false);
+    // Il feedback "copiato" si spegne da solo: il timer va annullato se la card sparisce prima
+    useEffect(() => {
+        if (!isCopied)
+            return;
+        const timerID = setTimeout(() => setIsCopied(false), 1400);
+        return () => clearTimeout(timerID);
+    }, [isCopied]);
+    const copyAsync = async () => {
+        try {
+            await navigator.clipboard.writeText(copyText);
+            setIsCopied(true);
+        }
+        catch {
+            ShowAlert({ message: SDKUI_Localizator.FailedToCopyToClipboard, mode: 'error', title: SDKUI_Localizator.CopyToClipboard, duration: 3000 });
+        }
+    };
+    // Il pulsante resta visibile durante il feedback e quando ha il focus (accessibilità da tastiera)
+    const isCopyVisible = copyText !== '' && (!SUPPORTS_HOVER || isHovered || isCopied);
+    return (_jsxs("div", { style: styles.item, onMouseEnter: (e) => { setIsHovered(true); Object.assign(e.currentTarget.style, { borderColor: TMColors.primary, boxShadow: '0 2px 8px rgba(37, 89, 165, 0.14)' }); }, onMouseLeave: (e) => { setIsHovered(false); Object.assign(e.currentTarget.style, { borderColor: TMColors.card_background, boxShadow: 'none' }); }, children: [_jsx(TMTooltip, { content: caption, parentStyle: { ...styles.label, maxWidth: isCopyVisible ? 'calc(100% - 38px)' : 'calc(100% - 16px)' }, childStyle: { maxWidth: '100%', minWidth: 0 }, children: _jsx("span", { style: styles.labelText, children: caption }) }), children, copyText !== '' && (_jsx(TMTooltip, { content: isCopied ? SDKUI_Localizator.CopiedSuccessfully : SDKUI_Localizator.CopyToClipboard, parentStyle: { ...styles.copyBtnAnchor, opacity: isCopyVisible ? 1 : 0, pointerEvents: isCopyVisible ? 'auto' : 'none' }, children: _jsx("button", { type: 'button', style: { ...styles.copyBtn, ...(isCopied ? COPY_BTN_COPIED : COPY_BTN_IDLE) }, "aria-label": SDKUI_Localizator.CopyToClipboard, onClick: copyAsync, onFocus: () => setIsHovered(true), onBlur: () => setIsHovered(false), ...hoverStyle(isCopied ? COPY_BTN_COPIED : COPY_BTN_HOVER, isCopied ? COPY_BTN_COPIED : COPY_BTN_IDLE), children: isCopied ? _jsx(IconSuccess, { fontSize: 11 }) : _jsx(IconCopy, { fontSize: 11 }) }) }))] }));
+};
+// Riepilogo dei metadati di un documento in card compatte
+const TMMasterInfoFields = ({ dtd, dcmt, getValuesByMidAsync, reloadToken, isExpandedView = false }) => {
+    const { renderDataListCell, loadDataListsAsync, getDataListItem } = useDataListItem();
+    const [rows, setRows] = useState([]);
+    // Finché la prima lettura non è conclusa non si mostra "nessun dato" (evita il lampo al primo render)
+    const [isLoaded, setIsLoaded] = useState(false);
+    const [filter, setFilter] = useState('');
+    const [showAll, setShowAll] = useState(false);
+    // Carica i metadati del documento (valori + liste dati referenziate).
+    // getValuesByMidAsync è volutamente fuori dalle dipendenze: il chiamante la ricrea a ogni render
+    useEffect(() => {
+        let cancelled = false;
+        const loadAsync = async () => {
+            try {
+                if (!dcmt?.TID || !dcmt?.DID) {
+                    setRows([]);
+                    return;
+                }
+                // I metadati che l'utente non può vedere non si mostrano, come nel risultato di ricerca
+                const metadata = getUserMetadataSorted(dtd).filter(canViewMetadata);
+                // Precarica le liste dati referenziate dai metadati, così le card mostrano subito il valore leggibile
+                const dataListIDs = new Set();
+                metadata.forEach(md => { if (md.dataDomain === MetadataDataDomains.DataList && md.dataListID)
+                    dataListIDs.add(md.dataListID); });
+                await loadDataListsAsync(dataListIDs);
+                const valueByMid = await getValuesByMidAsync();
+                if (cancelled)
+                    return;
+                setRows(metadata.map(md => ({
+                    mid: md.id,
+                    caption: (SDK_Globals.useLocalizedName ? md.nameLoc : md.name) ?? md.name ?? '',
+                    value: valueByMid.get(md.id),
+                    dataListID: (md.dataDomain === MetadataDataDomains.DataList && md.dataListID) ? md.dataListID : 0,
+                    viewMode: md.dataListViewMode ?? DataListViewModes.None,
+                    dataType: md.dataType,
+                    format: md.format?.format,
+                    formatCulture: md.format?.formatCulture,
+                })));
+            }
+            catch {
+                if (!cancelled)
+                    setRows([]);
+            }
+            finally {
+                if (!cancelled)
+                    setIsLoaded(true);
+            }
+        };
+        // Cambiando documento/tipo documento il filtro non ha più senso: si riparte dall'anteprima
+        setFilter('');
+        setShowAll(false);
+        loadAsync();
+        return () => { cancelled = true; };
+    }, [dtd?.id, dcmt?.TID, dcmt?.DID, reloadToken]);
+    // La barra di ricerca esiste solo nella vista ingrandita: tornando in linea il filtro non è più
+    // visibile e resterebbe attivo, nascondendo i primi metadati dell'anteprima
+    useEffect(() => {
+        if (isExpandedView)
+            return;
+        setFilter('');
+        setShowAll(false);
+    }, [isExpandedView]);
+    // Testo su cui cerca il filtro: valore visualizzato del metadato (per le liste dati il nome dell'item)
+    const getSearchText = (item) => {
+        if (item.value === undefined || item.value === null || item.value === '')
+            return '';
+        if (item.dataListID > 0) {
+            const dataListItem = getDataListItem(item.dataListID, item.value);
+            return dataListItem ? `${dataListItem.name ?? ''} ${dataListItem.value ?? ''}` : String(item.value);
+        }
+        return formatScalarValue(item.value, item.dataType, item.format, item.formatCulture);
+    };
+    // Testo copiato negli appunti: quello che l'utente vede nella card (per le liste dati il nome dell'item)
+    const getCopyText = (item) => {
+        if (item.value === undefined || item.value === null || item.value === '')
+            return '';
+        if (item.dataListID > 0) {
+            const dataListItem = getDataListItem(item.dataListID, item.value);
+            return dataListItem?.name ?? String(item.value);
+        }
+        return formatScalarValue(item.value, item.dataType, item.format, item.formatCulture);
+    };
+    // Ricerca case insensitive su nome e valore del metadato
+    const query = filter.trim().toLowerCase();
+    const filteredRows = useMemo(() => {
+        if (!query)
+            return rows;
+        return rows.filter(item => item.caption.toLowerCase().includes(query) || getSearchText(item).toLowerCase().includes(query));
+    }, [rows, query]);
+    const renderCard = (item) => {
+        const hasValue = item.value !== undefined && item.value !== null && item.value !== '';
+        const displayNode = item.dataListID > 0 && hasValue ? renderDataListCell(item.value, item.dataListID, item.viewMode) : (hasValue ? formatScalarValue(item.value, item.dataType, item.format, item.formatCulture) : '');
+        return (_jsx(MetadataCard, { caption: item.caption, copyText: getCopyText(item), children: hasValue
+                ? (_jsx(TMTooltip, { content: displayNode, parentStyle: { flex: 1, minWidth: 0 }, childStyle: { maxWidth: '100%', minWidth: 0 }, children: _jsx("span", { style: { ...styles.value, minWidth: 0 }, children: displayNode }) }))
+                // Segnaposto per i metadati vuoti: la card mantiene la stessa altezza
+                : _jsx("span", { style: { ...styles.value, ...styles.emptyValue }, children: "\u2014" }) }, item.mid));
+    };
+    // Ricerca dei metadati: solo nella vista ingrandita e solo quando sono troppi per essere trovati a vista
+    const renderSearchBar = () => (_jsxs("div", { style: styles.searchBar, children: [_jsxs("div", { style: styles.searchBox, children: [_jsx(IconSearch, { fontSize: 13, style: styles.searchIcon }), _jsx("input", { type: 'text', value: filter, placeholder: `${SDKUI_Localizator.SearchAction}...`, style: styles.searchInput, onChange: (e) => setFilter(e.target.value), 
+                        // Esc svuota il filtro senza propagare la chiusura del modale
+                        onKeyDown: (e) => { if (e.key === 'Escape' && filter !== '') {
+                            e.preventDefault();
+                            e.stopPropagation();
+                            setFilter('');
+                        } }, onFocus: (e) => Object.assign(e.currentTarget.parentElement?.style ?? {}, { borderColor: TMColors.primary, boxShadow: '0 0 0 2px rgba(37, 89, 165, 0.14)' }), onBlur: (e) => Object.assign(e.currentTarget.parentElement?.style ?? {}, { borderColor: TMColors.card_background, boxShadow: 'none' }) }), filter !== '' && (_jsx(TMTooltip, { content: SDKUI_Localizator.Clear, parentStyle: { display: 'flex', flexShrink: 0 }, children: _jsx("button", { type: 'button', style: styles.searchClear, "aria-label": SDKUI_Localizator.Clear, onClick: () => setFilter(''), ...hoverStyle({ background: TMColors.primary_container, color: TMColors.primary }, { background: 'transparent', color: TMColors.label_normal }), children: _jsx(IconClearButton, { fontSize: 13 }) }) }))] }), _jsxs("span", { style: styles.searchCount, children: [filteredRows.length, "/", rows.length] })] }));
+    // La ricerca sta solo nella vista ingrandita: in linea lo spazio è poco e l'elenco è limitato
+    // all'anteprima, con il pulsante per aprirlo tutto
+    const hasSearch = isExpandedView && rows.length > PREVIEW_COUNT;
+    const isCapped = !isExpandedView && !showAll && filteredRows.length > PREVIEW_COUNT;
+    const canCollapse = !isExpandedView && showAll && filteredRows.length > PREVIEW_COUNT;
+    const visibleRows = isCapped ? filteredRows.slice(0, PREVIEW_COUNT) : filteredRows;
+    const hiddenCount = filteredRows.length - visibleRows.length;
+    return (_jsxs("div", { style: { ...styles.wrapper, ...(isExpandedView ? { borderTop: 'none' } : {}) }, children: [hasSearch && renderSearchBar(), _jsx("div", { style: { ...styles.body, ...(isExpandedView ? { padding: '18px 14px 14px' } : {}) }, children: visibleRows.length > 0
+                    ? visibleRows.map(renderCard)
+                    : (isLoaded && _jsx("span", { style: styles.placeholder, children: SDKUI_Localizator.NoDataToDisplay })) }), (isCapped || canCollapse) && (_jsx("div", { style: styles.footer, children: _jsxs("button", { type: 'button', style: styles.showAllBtn, onClick: () => setShowAll(!showAll), ...hoverStyle({ background: TMColors.primary, borderColor: TMColors.primary, color: '#ffffff', boxShadow: '0 2px 6px rgba(37, 89, 165, 0.25)' }, { background: TMColors.primary_container, borderColor: TMColors.primary_container, color: TMColors.primary, boxShadow: 'none' }), children: [isCapped ? `${SDKUI_Localizator.ShowAll} (+${hiddenCount})` : SDKUI_Localizator.Collapse, _jsx(IconChevronDown, { fontSize: 13, style: { transform: isCapped ? 'none' : 'rotate(180deg)', transition: 'transform 0.2s ease' } })] }) }))] }));
+};
+export default TMMasterInfoFields;

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

@@ -18,8 +18,7 @@ interface ITMMergeToPdfFormProps {
 }
 /**
  * Form per l'unione di più documenti PDF in un singolo file.
- * Condivide TMDownloadRelationViewerSection e gli helper in copyAndMergeDcmtsShared
- * con TMCopyToFolderForm.
+ * Condivide TMDownloadRelationViewerSection e gli helper in copyAndMergeDcmtsShared con TMCopyToFolderForm.
  */
 declare const TMMergeToPdfForm: (props: ITMMergeToPdfFormProps) => React.JSX.Element;
 export default TMMergeToPdfForm;