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

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

@@ -1,10 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useCallback, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { LayoutModes } from "@topconsultnpm/sdk-ts";
 import { LoadIndicator } from "devextreme-react/load-indicator";
 import { SearchResultContext } from "../../../ts";
-import { getFullFileExtension, getMultiDetailPanelStates, hasMultiDetailPanelStates, hoverStyle, IconArchive, IconDelete, IconDuplicate, IconEdit, IconEraser, IconMenuVertical, IconRefresh, IconSearch, IconSearchCheck, saveMultiDetailPanelStates, SDKUI_Localizator } from "../../../helper";
+import { getFullFileExtension, getMultiDetailPanelStates, hasMultiDetailPanelStates, hoverStyle, IconArchive, IconDelete, IconDuplicate, IconEdit, IconEraser, IconInfo, IconMenuVertical, IconRefresh, IconSearch, IconSearchCheck, saveMultiDetailPanelStates, SDKUI_Localizator } from "../../../helper";
 import { TMColors } from "../../../utils/theme";
+import { DeviceType, useDeviceType } from "../../base/TMDeviceProvider";
 import { TMLayoutWaitingContainer } from "../../base/TMWaitPanel";
 import TMModal from "../../base/TMModal";
 import TMDataGrid from "../../base/TMDataGrid";
@@ -41,9 +42,20 @@ const styles = {
     archiveButton: { display: 'inline-flex', alignItems: 'center', justifyContent: 'center', gap: '8px', height: '38px', padding: '0 22px', border: 'none', borderRadius: '10px', fontSize: '14px', fontWeight: 600, letterSpacing: '0.2px', color: '#ffffff', cursor: 'pointer', transition: 'transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease' },
     checkbox: { width: '16px', height: '16px', accentColor: TMColors.primary, cursor: 'pointer', margin: 0 },
 };
+/** Sezione mostrata per prima su mobile, dove i pannelli si vedono uno alla volta */
+const MOBILE_SECTION = 'archiveList';
 const TMMultiMasterDetailDcmtsForm = (props) => {
     const { dtd, masterDcmt, onClose, allTasks, getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, showDcmtFormSidebar, showTodoDcmtForm, openFileUploaderPdfEditor, graphometricManager, editPdfForm, openS4TViewer, showToppyDraggableHelpCenter, toppyHelpCenterUsePortal, fetchRemoteCertificates, onOpenS4TViewerRequest, onOpenPdfEditorRequest, onReferenceClick, onTaskCreateRequest, onRefreshAfterAddDcmtToFavs, onFileOpened, passToArchiveCallback, openWGsCopyMoveForm } = props;
-    const { isLoading, isSummaryReady, phase, setPhase, detailRelationItems, selectedRelation, selectedItem, hasMultipleTypes, selectRelation, backToTypeSelection, isBackLocked, closeModal, sectionsOpen, setSectionOpen, clearLayout, layoutResetToken, canUpdateMaster, masterFieldsCount, getMasterMetadataAsync, masterInfoReloadToken, isOpenMasterForm, setIsOpenMasterForm, handleMasterSavedAsync, archivedDetailResults, archivedDetailsCount, isLoadingArchivedDetails, refreshArchivedDetailsAsync, detailColumns, detailSupportsFile, archiveRows, currentRows, focusedRowKey, setFocusedRowKey, selectedRowKeys, setSelectedRowKeys, isOpenAddForm, editingRowId, editingRow, formInputMids, openAddForm, openEditForm, closeAddForm, deleteRow, duplicateRow, upsertRow, updateRowValues, stopOnFirstError, setStopOnFirstError, isArchiving, archiveAllAsync, waitPanel, abortController, } = useMultiMasterDetailDcmts({ dtd, masterDcmt, onClose });
+    const { isLoading, isSummaryReady, phase, setPhase, detailRelationItems, selectedRelation, selectedItem, hasMultipleTypes, selectRelation, backToTypeSelection, isBackLocked, closeModal, sectionsOpen, setSectionOpen, openAllSections, clearLayout, layoutResetToken, canUpdateMaster, masterFieldsCount, getMasterMetadataAsync, masterInfoReloadToken, isOpenMasterForm, setIsOpenMasterForm, handleMasterSavedAsync, archivedDetailResults, archivedDetailsCount, isLoadingArchivedDetails, refreshArchivedDetailsAsync, detailColumns, detailSupportsFile, archiveRows, currentRows, focusedRowKey, setFocusedRowKey, selectedRowKeys, setSelectedRowKeys, isOpenAddForm, editingRowId, editingRow, formInputMids, openAddForm, openEditForm, closeAddForm, deleteRow, duplicateRow, upsertRow, updateRowValues, stopOnFirstError, setStopOnFirstError, isArchiving, archiveAllAsync, waitPanel, abortController, } = useMultiMasterDetailDcmts({ dtd, masterDcmt, onClose });
+    const deviceType = useDeviceType();
+    // Su mobile il panel manager mostra un pannello alla volta: le sezioni si raggiungono dalla sua barra
+    const isMobile = useMemo(() => deviceType === DeviceType.MOBILE, [deviceType]);
+    // Un pannello alla volta non lascia spazio da cedere: le sezioni chiuse nella vista impilata si
+    // aprono qui, altrimenti il pannello a schermo mostrerebbe la sola testata
+    useEffect(() => {
+        if (isMobile && isSummaryReady)
+            openAllSections();
+    }, [isMobile, isSummaryReady]);
     // Ricerca nella griglia dei dettagli da archiviare, come in TMSearch (vedi useDocumentOperations)
     const [showGridSearch, setShowGridSearch] = useState(false);
     const toggleGridSearchItem = {
@@ -131,9 +143,10 @@ const TMMultiMasterDetailDcmtsForm = (props) => {
     const optionsMenuItems = useMemo(() => [
         { name: 'Cancella layout', icon: _jsx(IconEraser, { fontSize: 18, color: TMColors.error }), onClick: clearLayout },
     ], [clearLayout]);
-    // Le opzioni riguardano i pannelli del riepilogo: fuori da quella fase non hanno effetto
+    // Le opzioni riguardano i pannelli del riepilogo: fuori da quella fase non hanno effetto, e su mobile
+    // non c'è un layout da cancellare (i pannelli si vedono uno alla volta, a tutta altezza)
     const renderOptionsMenu = () => {
-        if (!isSummaryPhase)
+        if (!isSummaryPhase || isMobile)
             return undefined;
         return (_jsx(ContextMenu, { trigger: 'left', items: optionsMenuItems, children: _jsx("span", { style: styles.titleMenuIcon, title: SDKUI_Localizator.Options, "aria-label": SDKUI_Localizator.Options, children: _jsx(IconMenuVertical, { fontSize: 16, color: "white" }) }) }));
     };
@@ -191,13 +204,13 @@ const TMMultiMasterDetailDcmtsForm = (props) => {
     // ----- Pannelli del riepilogo, uno per sezione ----------------------------------------------
     const renderSectionsInPanels = () => {
         const definitions = [
-            { section: 'masterInfo', name: `Master: ${getDtdDisplayName(dtd)}`, render: renderMasterInfo },
+            { section: 'masterInfo', name: `Master: ${getDtdDisplayName(dtd)}`, icon: _jsx(IconInfo, { fontSize: 22 }), count: masterFieldsCount, render: renderMasterInfo },
             ...(selectedRelation?.detailTID !== undefined
-                ? [{ section: 'archivedDetails', name: SDKUI_Localizator.ArchivedDetails, render: renderArchivedDetails }]
+                ? [{ section: 'archivedDetails', name: SDKUI_Localizator.ArchivedDetails, icon: _jsx(IconSearchCheck, { fontSize: 22 }), count: archivedDetailsCount, render: renderArchivedDetails }]
                 : []),
-            { section: 'archiveList', name: SDKUI_Localizator.DetailsToArchive, render: renderArchiveList },
+            { section: 'archiveList', name: SDKUI_Localizator.DetailsToArchive, icon: _jsx(IconArchive, { fontSize: 22 }), count: currentRows.length, render: renderArchiveList },
         ];
-        const panels = definitions.map(definition => ({
+        const panels = definitions.map((definition, index) => ({
             id: definition.section,
             name: definition.name,
             currentGroupDirection: 'vertical',
@@ -209,6 +222,8 @@ const TMMultiMasterDetailDcmtsForm = (props) => {
                 // La sezione collassata è alta quanto la sua testata: i separatori non la ingrandiscono
                 isCollapsed: !sectionsOpen[definition.section],
             },
+            // Barra dei pannelli: su mobile è l'unico modo per passare da una sezione all'altra
+            toolbarOptions: { icon: definition.icon, visible: true, isActive: true, orderNumber: index + 1, count: definition.count, tooltip: definition.name },
         }));
         const sections = panels.map(panel => panel.id);
         // Le altezze salvate sono il punto di partenza, ma è il collasso corrente a decidere le quote
@@ -220,13 +235,19 @@ const TMMultiMasterDetailDcmtsForm = (props) => {
                 return acc;
             }, {})
             : undefined;
-        const initialDimensions = sectionPanelHeights(sections, sectionsOpen, savedDimensions);
-        const initialVisibility = sections.reduce((acc, section) => { acc[section] = true; return acc; }, {});
+        // Con un pannello alla volta non ci sono quote da spartire: quello a schermo prende tutta l'altezza.
+        // Le quote proporzionali (e il layout salvato) valgono solo per i pannelli impilati
+        const fullHeights = sections.reduce((acc, section) => { acc[section] = { width: '100%', height: '100%' }; return acc; }, {});
+        const initialDimensions = isMobile ? fullHeights : sectionPanelHeights(sections, sectionsOpen, savedDimensions);
+        const initialVisibility = sections.reduce((acc, section) => { acc[section] = isMobile ? section === MOBILE_SECTION : true; return acc; }, {});
         return (_jsx("div", { style: styles.panelsHost, children: _jsx("div", { style: styles.panelsHostFill, children: _jsxs(TMPanelManagerWithPersistenceProvider
-                // Le dimensioni sono lette solo al montaggio: dopo la cancellazione del layout i pannelli vanno rimontati
-                , { panels: panels, initialVisibility: initialVisibility, defaultDimensions: initialDimensions, initialDimensions: initialDimensions, initialMobilePanelId: 'archiveList', isPersistenceEnabled: true, persistPanelStates: saveMultiDetailPanelStates, children: [_jsx(TMSectionPanelsHeights, { sections: sections, sectionsOpen: sectionsOpen }), _jsx(TMPanelManagerContainer, { panels: panels, direction: 'vertical', showToolbar: false, minPanelSizePx: SECTION_HEADER_HEIGHT_PX, gutterSizePx: PANEL_GUTTER_PX })] }, layoutResetToken) }) }));
+                // Le dimensioni sono lette solo al montaggio: dopo la cancellazione del layout, e al
+                // passaggio fra impilato e un pannello alla volta, i pannelli vanno rimontati
+                , { panels: panels, initialVisibility: initialVisibility, defaultDimensions: initialDimensions, initialDimensions: initialDimensions, initialMobilePanelId: MOBILE_SECTION, 
+                    // Su mobile il layout è imposto dal dispositivo: salvarlo sovrascriverebbe quello dell'utente
+                    isPersistenceEnabled: !isMobile, persistPanelStates: !isMobile ? saveMultiDetailPanelStates : undefined, children: [_jsx(TMSectionPanelsHeights, { sections: sections, sectionsOpen: sectionsOpen }), _jsx(TMPanelManagerContainer, { panels: panels, direction: 'vertical', showToolbar: isMobile, minPanelSizePx: SECTION_HEADER_HEIGHT_PX, gutterSizePx: isMobile ? undefined : PANEL_GUTTER_PX })] }, `${layoutResetToken}-${isMobile}`) }) }));
     };
-    const renderArchiveSummary = () => (_jsxs("div", { style: styles.summaryContainer, children: [renderSectionsInPanels(), _jsxs("div", { style: styles.footer, children: [_jsxs("label", { style: styles.footerLabel, ...hoverStyle({ borderColor: TMColors.primary, color: TMColors.text_normal }, { borderColor: TMColors.card_background, color: TMColors.label_normal }), children: [_jsx("input", { type: "checkbox", checked: stopOnFirstError, onChange: (e) => setStopOnFirstError(e.target.checked), style: styles.checkbox }), "Ferma l'archiviazione al primo errore"] }), _jsxs("button", { type: "button", onClick: archiveAllAsync, disabled: isArchiveDisabled, style: {
+    const renderArchiveSummary = () => (_jsxs("div", { style: styles.summaryContainer, children: [renderSectionsInPanels(), _jsxs("div", { style: styles.footer, children: [_jsxs("label", { style: styles.footerLabel, ...hoverStyle({ borderColor: TMColors.primary, color: TMColors.text_normal }, { borderColor: TMColors.card_background, color: TMColors.label_normal }), children: [_jsx("input", { type: "checkbox", checked: stopOnFirstError, onChange: (e) => setStopOnFirstError(e.target.checked), style: styles.checkbox }), SDKUI_Localizator.StopOnFirstError] }), _jsxs("button", { type: "button", onClick: archiveAllAsync, disabled: isArchiveDisabled, style: {
                             ...styles.archiveButton,
                             background: isArchiveDisabled ? TMColors.disabled : TMColors.success,
                             boxShadow: isArchiveDisabled ? 'none' : `0 4px 14px ${TMColors.success}55`,

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

@@ -19,6 +19,8 @@ export type AccordionSection = 'masterInfo' | 'archivedDetails' | 'archiveList';
  */
 export type SectionPanelState = {
     isMaximized: boolean;
+    canMaximize: boolean;
+    canCollapse: boolean;
     toggleMaximize: () => void;
 };
 /** Valore di un metadato letto da un documento: una cella del risultato di ricerca */

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

@@ -6,6 +6,7 @@ import { formatScalarValue, getUserMetadataSorted } from '../../../helper/dcmtsH
 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 };
@@ -164,16 +165,19 @@ export const renderSelectDcmtType = ({ detailRelationItems, selectedRelation, on
             }) })] }));
 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
-    const canToggle = !panel.isMaximized;
+    // 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: () => panel.toggleMaximize(), onKeyDown: canToggle ? (e) => { if (e.key === 'Enter' || e.key === ' ') {
+        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, _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 } }))] }));
+        } } : 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
@@ -182,6 +186,10 @@ export const renderAccordionHeader = ({ section, isOpen, tooltip, count, title,
 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 = () => {
@@ -189,7 +197,7 @@ export const TMSummarySectionSlot = ({ section, render, onBeforeMaximize }) => {
             onBeforeMaximize?.(section);
         toggleMaximize(section);
     };
-    return _jsx(_Fragment, { children: render({ isMaximized, toggleMaximize: toggleMaximizeSection }) });
+    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
@@ -197,7 +205,7 @@ export const TMSummarySectionSlot = ({ section, render, onBeforeMaximize }) => {
  * Vive dentro il provider perché il contesto è leggibile solo lì
  */
 export const TMSectionPanelsHeights = ({ sections, sectionsOpen }) => {
-    const { panelDimensions, setPanelDimensionsById, maximizedPanels } = useTMPanelManagerContext();
+    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;
@@ -214,8 +222,13 @@ export const TMSectionPanelsHeights = ({ sections, sectionsOpen }) => {
         }
         if (hasMaximizedPanel)
             return;
-        const heights = sectionPanelHeights(sections, sectionsOpen, dimensionsRef.current);
-        sections.forEach(section => setPanelDimensionsById(section, heights[section].width, heights[section].height));
-    }, [sectionsOpen, hasMaximizedPanel]);
+        // 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/helper/SDKUI_Localizator.d.ts

@@ -820,6 +820,7 @@ export declare class SDKUI_Localizator {
     static get Statistics(): "Statistiken" | "Statistics" | "Estadística" | "Statistiques" | "Estatísticas" | "Statistiche";
     static get Status(): "Status" | "Estado" | "Statut" | "Stato";
     static get StatusAndAnswer(): "Status und Antwort" | "Status and answer" | "Estado y respuesta" | "Statut et réponse" | "Estado e resposta" | "Stato e risposta";
+    static get StopOnFirstError(): "Beim ersten Fehler abbrechen" | "Stop at the first error" | "Detener en el primer error" | "Arrêter à la première erreur" | "Parar no primeiro erro" | "Interrompi al primo errore";
     static get Subject(): "Betreff" | "Subject" | "Asunto" | "Objet" | "Assunto" | "Oggetto";
     static get Summary(): "Zusammenfassung" | "Summary" | "Resumen" | "Résumé" | "Resumo" | "Riepilogo";
     static get SwitchUser(): "Benutzer wechseln" | "Switch user" | "Cambiar usuario" | "Changer d'utilisateur" | "Mudar de usuário" | "Cambia utente";

package/lib/helper/SDKUI_Localizator.js

@@ -8180,6 +8180,16 @@ export class SDKUI_Localizator {
             default: return "Stato e risposta";
         }
     }
+    static get StopOnFirstError() {
+        switch (this._cultureID) {
+            case CultureIDs.De_DE: return "Beim ersten Fehler abbrechen";
+            case CultureIDs.En_US: return "Stop at the first error";
+            case CultureIDs.Es_ES: return "Detener en el primer error";
+            case CultureIDs.Fr_FR: return "Arrêter à la première erreur";
+            case CultureIDs.Pt_PT: return "Parar no primeiro erro";
+            default: return "Interrompi al primo errore";
+        }
+    }
     static get Subject() {
         switch (this._cultureID) {
             case CultureIDs.De_DE: return "Betreff";

package/lib/hooks/useMultiMasterDetailDcmts.d.ts

@@ -56,6 +56,7 @@ export declare const useMultiMasterDetailDcmts: ({ dtd, masterDcmt, onClose }: U
     closeModal: () => void;
     sectionsOpen: Record<AccordionSection, boolean>;
     setSectionOpen: (section: AccordionSection, isOpen: boolean) => void;
+    openAllSections: () => void;
     clearLayout: () => void;
     layoutResetToken: number;
     canUpdateMaster: boolean;

package/lib/hooks/useMultiMasterDetailDcmts.js

@@ -218,6 +218,18 @@ export const useMultiMasterDetailDcmts = ({ dtd, masterDcmt, onClose }) => {
         if (section === 'archivedDetails' && isOpen && !areArchivedDetailsLoadedRef.current && !isLoadingArchivedDetails)
             refreshArchivedDetailsAsync();
     };
+    /**
+     * Apre tutte le sezioni senza salvare: serve dove il collasso non è una scelta dell'utente ma una
+     * conseguenza del layout (su mobile si vede un pannello alla volta, e una sezione chiusa lascerebbe
+     * a schermo la sola testata). Non si persiste per non sovrascrivere le sezioni che l'utente ha
+     * chiuso nella vista a pannelli impilati.
+     */
+    const openAllSections = () => {
+        setSectionsOpen(prev => Object.values(prev).every(Boolean) ? prev : { masterInfo: true, archivedDetails: true, archiveList: true });
+        // I dettagli già archiviati si caricano come alla prima apertura della sezione
+        if (!areArchivedDetailsLoadedRef.current && !isLoadingArchivedDetails)
+            refreshArchivedDetailsAsync();
+    };
     /**
      * Cancella il layout configurato dall'utente (altezze dei pannelli e sezioni collassate), previa
      * conferma. Il token cambia per rimontare il panel manager, che legge le dimensioni solo all'avvio.
@@ -537,7 +549,7 @@ export const useMultiMasterDetailDcmts = ({ dtd, masterDcmt, onClose }) => {
         detailRelationItems, selectedRelation, selectedItem, hasMultipleTypes,
         selectRelation, backToTypeSelection, isBackLocked, closeModal,
         // Sezioni
-        sectionsOpen, setSectionOpen, clearLayout, layoutResetToken,
+        sectionsOpen, setSectionOpen, openAllSections, clearLayout, layoutResetToken,
         // Master
         canUpdateMaster, masterFieldsCount, getMasterMetadataAsync, masterInfoReloadToken,
         isOpenMasterForm, setIsOpenMasterForm, handleMasterSavedAsync,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@topconsultnpm/sdkui-react",
-    "version": "6.22.0-dev2.20",
+    "version": "6.22.0-dev2.21",
     "description": "",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",