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

package/lib/components/choosers/TMDataListItemPicker.js

@@ -1,4 +1,4 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from 'react';
 import styled, { keyframes } from 'styled-components';
 import { DataListCacheService, SDK_Localizator, ObjectClasses, JobTypes } from '@topconsultnpm/sdk-ts';
@@ -255,6 +255,6 @@ const TMDataListItemPicker = ({ dataListID, selectedValue, onItemSelect, onItemE
     if (!dataList || !items || items.length === 0) {
         return (_jsxs(PickerContainer, { children: [_jsx(Label, { children: dataList ? `${SDK_Localizator.DataList}: ${dataList.name}` : SDKUI_Localizator.NoDataToDisplay }), _jsx(ItemsContainer, { children: allowEdit && (_jsxs(AddButton, { onClick: handleCreateNew, children: ["+ ", SDKUI_Localizator.NewMale] })) }), !allowEdit && _jsx("p", { children: SDKUI_Localizator.NoDataToDisplay })] }));
     }
-    return (_jsxs(PickerContainer, { children: [_jsx(Label, { children: `${SDK_Localizator.DataList}: ${dataList.name}` }), _jsxs(ItemsContainer, { children: [items.map((item, index) => (_jsxs(ItemWrapper, { children: [_jsxs(StatusItem, { "$isSelected": item.value === selectedValue, "$index": index, onClick: () => onItemSelect(item), onDoubleClick: () => allowEdit && handleEdit(item), children: [item.imageID && _jsx(TMImageLibrary, { imageID: item.imageID }), _jsx("span", { children: item.name })] }), allowEdit && (_jsx(DeleteButton, { onClick: (e) => handleDelete(item, e), title: SDKUI_Localizator.Delete || 'Delete', "aria-label": "Delete item", children: _jsx(IconDelete, { fontSize: 16 }) }))] }, item.value))), allowEdit && (_jsxs(AddButton, { onClick: handleCreateNew, children: ["+ ", SDKUI_Localizator.NewMale] }))] }), _jsx(TMDataListItemEditor, { isOpen: showEditDialog, item: editingItem, isCreating: isCreating, onClose: handleCloseDialog, onSave: handleSave })] }));
+    return (_jsxs(PickerContainer, { children: [_jsx(Label, { children: `${SDK_Localizator.DataList}: ${dataList.name}` }), _jsxs(ItemsContainer, { children: [items.map((item, index) => (_jsxs(ItemWrapper, { children: [_jsxs(StatusItem, { $isSelected: item.value === selectedValue, $index: index, onClick: () => onItemSelect(item), onDoubleClick: () => allowEdit && handleEdit(item), children: [item.imageID && _jsx(TMImageLibrary, { imageID: item.imageID }), _jsx("span", { children: item.name })] }), allowEdit && (_jsx(DeleteButton, { onClick: (e) => handleDelete(item, e), title: SDKUI_Localizator.Delete || 'Delete', "aria-label": "Delete item", children: _jsx(IconDelete, { fontSize: 16 }) }))] }, item.value))), allowEdit && (_jsxs(AddButton, { onClick: handleCreateNew, children: ["+ ", SDKUI_Localizator.NewMale] }))] }), _jsx(TMDataListItemEditor, { isOpen: showEditDialog, item: editingItem, isCreating: isCreating, onClose: handleCloseDialog, onSave: handleSave })] }));
 };
 export default TMDataListItemPicker;

package/lib/components/choosers/TMDcmtTypeChooser.js

@@ -1,4 +1,4 @@
-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 { useEffect, useState } from 'react';
 import { AccessLevelsEx, DcmtTypeListCacheService, SDK_Globals, SDK_Localizator } from '@topconsultnpm/sdk-ts';
 import TMSpinner from '../base/TMSpinner';

package/lib/components/choosers/TMDiskChooser.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from 'react';
 import { SDK_Localizator, SDK_Globals } from '@topconsultnpm/sdk-ts';
 import { StyledDivHorizontal } from '../base/Styled';

package/lib/components/choosers/TMDistinctValues.js

@@ -1,8 +1,8 @@
-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 } from 'react';
 import { LayoutModes, SDK_Localizator } from '@topconsultnpm/sdk-ts';
 import styled from 'styled-components';
-import { calcResponsiveSizes, IconAll, IconDelete, IconPencil, IconRefresh, SDKUI_Localizator } from '../../helper';
+import { calcResponsiveSizes, IconAll, IconDelete, IconPencil, IconRefresh, IconSelected, SDKUI_Localizator } from '../../helper';
 import TMButton from '../base/TMButton';
 import TMDataGrid from '../base/TMDataGrid';
 import { CounterItemKey } from '../base/TMCounterContainer';
@@ -56,6 +56,7 @@ const StyledGridContainer = styled.div `
         font-weight: 600;
     }
 `;
+const NO_SELECTED_ROW_KEYS = [];
 /* Quota di larghezza attribuita a ciascuna colonna della griglia, oltre a una base fissa per la barra dei comandi.
    I limiti evitano i due estremi: sotto il 40% la barra dei comandi diventa illeggibile, oltre il 95% il modale esce dallo schermo */
 const QUICK_SEARCH_BASE_WIDTH_PERC = 16;
@@ -110,23 +111,31 @@ const TMDistinctValues = ({ tid, mid, layoutMode = LayoutModes.None, allowAppend
     const isGridReady = !isQuickSearchGridVisible || quickSearch.columns.length > 0;
     const counterConfig = useMemo(() => {
         const counts = isQuickSearchGridVisible ? quickSearch.counts : distinctValues.counts;
+        const items = new Map([
+            [CounterItemKey.selectedItems, {
+                    key: CounterItemKey.selectedItems,
+                    show: true,
+                    caption: SDKUI_Localizator.SelectedItems,
+                    value: selection.selectedValues.length,
+                    icon: _jsx(IconSelected, {}),
+                    order: 1
+                }]
+        ]);
         // Senza il totale resta il conteggio predefinito della griglia: un rapporto con totale a zero sarebbe fuorviante
-        if (!counts?.found)
-            return { show: true };
-        return {
-            show: true,
-            items: new Map([
-                [CounterItemKey.allItems, {
-                        key: CounterItemKey.allItems,
-                        show: true,
-                        caption: `${counts.returned} restituiti su ${counts.found} trovati`,
-                        value: `${counts.returned}/${counts.found}`,
-                        icon: _jsx(IconAll, {}),
-                        order: -1
-                    }]
-            ])
-        };
-    }, [isQuickSearchGridVisible, quickSearch.counts, distinctValues.counts]);
+        if (counts?.found) {
+            items.set(CounterItemKey.allItems, {
+                key: CounterItemKey.allItems,
+                show: true,
+                caption: `${counts.returned} restituiti su ${counts.found} trovati`,
+                value: `${counts.returned}/${counts.found}`,
+                icon: _jsx(IconAll, {}),
+                order: -1
+            });
+        }
+        return { show: true, items: items };
+    }, [isQuickSearchGridVisible, quickSearch.counts, distinctValues.counts, selection.selectedValues]);
+    // Configurazione fissa: dal pannello si preleva un valore per volta, le caselle di selezione non servono
+    const gridSelection = useMemo(() => ({ showCheckBoxesMode: 'none' }), []);
     const modeDataSource = useMemo(() => ([
         { value: DistinctValuesModes.DistinctValues, display: SDKUI_Localizator.DistinctValues },
         { value: DistinctValuesModes.QuickSearch, display: SDK_Localizator.SavedQuery },
@@ -151,7 +160,7 @@ const TMDistinctValues = ({ tid, mid, layoutMode = LayoutModes.None, allowAppend
                                 _jsx(TMButton, { btnStyle: 'toolbar', color: 'error', caption: SDKUI_Localizator.Delete, icon: _jsx(IconDelete, {}), onClick: quickSearch.onDeleteSettingsClick }), _jsx(TMButton, { btnStyle: 'toolbar', caption: SDKUI_Localizator.Refresh, icon: _jsx(IconRefresh, {}), onClick: () => refreshAsync() }), selection.isAppendVisible && _jsxs(StyledAppendBar, { children: [_jsx(TMCheckBox, { label: 'Accoda e separa con', value: selection.isAppendMode, onValueChanged: selection.onAppendModeChanged }), _jsx(TMTextBox, { width: '30px', readOnly: true, disabled: !selection.isAppendMode, value: separator })] })] }) }), _jsx(TMSelectedValuesSummary, { items: selection.selectedValues, onRemove: selection.onRemoveSelectedValue, onClear: selection.onClearSelectedValues }), _jsx(StyledGridContainer, { children: isGridReady && _jsx(TMDataGrid
                     /* Le due modalità hanno colonne del tutto diverse: ognuna ha la propria istanza di griglia.
                        Nei valori distinti l'intestazione è il nome del metadato, che arriva insieme al primo caricamento */
-                    , { focusedRowKey: selection.focusedItem ? selection.focusedItem.rowIndex : undefined, selection: { showCheckBoxesMode: 'none' }, searchPanel: { highlightCaseSensitive: true, visible: true }, dataColumns: isQuickSearchGridVisible ? quickSearch.columns : distinctValues.columns, dataSource: isQuickSearchGridVisible ? quickSearch.dataSource : distinctValues.dataSource, customizeColumns: isQuickSearchGridVisible ? quickSearch.customizeColumns : distinctValues.customizeColumns, keyExpr: 'rowIndex', height: 'calc(100%)', showHeaderColumnChooser: true, onFocusedRowChanged: selection.onFocusedRowChanged, onRowDblClick: () => onClosePanelCallback?.(), counterConfig: counterConfig }, isQuickSearchGridVisible ? 'quickSearch' : `distinctValues_${distinctValues.md?.id ?? 0}`) })] }));
+                    , { focusedRowKey: selection.focusedItem ? selection.focusedItem.rowIndex : undefined, selection: gridSelection, selectedRowKeys: NO_SELECTED_ROW_KEYS, searchPanel: { highlightCaseSensitive: true, visible: true }, searchPanelFocusTrigger: 1, dataColumns: isQuickSearchGridVisible ? quickSearch.columns : distinctValues.columns, dataSource: isQuickSearchGridVisible ? quickSearch.dataSource : distinctValues.dataSource, customizeColumns: isQuickSearchGridVisible ? quickSearch.customizeColumns : distinctValues.customizeColumns, keyExpr: 'rowIndex', height: 'calc(100%)', showHeaderColumnChooser: true, onFocusedRowChanged: selection.onFocusedRowChanged, onRowDblClick: () => onClosePanelCallback?.(), counterConfig: counterConfig }, isQuickSearchGridVisible ? 'quickSearch' : `distinctValues_${distinctValues.md?.id ?? 0}`) })] }));
     };
     return (_jsxs(_Fragment, { children: [isModal
                 ? isModalReady && _jsx(TMModal, { title: panelTitle, width: isQuickSearchGridVisible ? calcResponsiveSizes(deviceType, quickSearchModalWidth ?? calcQuickSearchModalWidth(0), '95%', '95%') : calcResponsiveSizes(deviceType, '700px', '95%', '95%'), height: isQuickSearchGridVisible ? '95%' : calcResponsiveSizes(deviceType, '600px', '95%', '95%'), resizable: true, expandable: true, onClose: onClosePanelCallback, children: renderContent() }, isQuickSearchGridVisible ? 'quickSearch' : 'distinctValues')

package/lib/components/choosers/TMDynDataListItemChooser.js

@@ -1,4 +1,4 @@
-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 { useEffect, useRef, useState } from 'react';
 import { DataColumnTypes, SDK_Localizator, DataListCacheService, SDK_Globals, LayoutModes } from '@topconsultnpm/sdk-ts';
 import { IconDetails, IconSearch, generateUniqueColumnKeys, Globalization, SDKUI_Localizator, searchResultDescriptorToSimpleArray, IsParametricQuery, IconWarning } from '../../helper';

package/lib/components/choosers/TMImageIDChooser.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from 'react';
 import { TMImageLibrary, IconSearch } from '../../helper';
 import { StyledDivHorizontal } from '../base/Styled';

package/lib/components/choosers/TMMetadataChooser.js

@@ -1,4 +1,4 @@
-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, useMemo, useState } from 'react';
 import { DcmtTypeDescriptor, DcmtTypeListCacheService, SDK_Globals, SDK_Localizator } from '@topconsultnpm/sdk-ts';
 import { TMMetadataIcon, TMMidViewer, getDisplayAlias } from '../viewers/TMMidViewer';
@@ -142,7 +142,7 @@ export const TMMetadataChooserForm = ({ tmSession, tids, qd, filterMetadata, qdS
     const groupCellRender = useCallback((data) => {
         let tid_alias = JSON.parse(data.value);
         let dtd = dcmtTypes?.find(o => o.id == tid_alias.tid);
-        return _jsxs(StyledDxGridGroupHeader, { "$backgroundColor": getColorIndex?.(tid_alias), children: [_jsx(TMDcmtTypeIcon, { dtd: dtd }), _jsx("p", { children: getDisplayAlias(SDK_Globals.useLocalizedName ? dtd?.nameLoc : dtd?.name, tid_alias.alias) }), data.summaryItems && data.summaryItems.length > 0 && _jsx(StyledBadge, { "$backgroundColor": TMColors.info, children: data.summaryItems[0].value })] });
+        return _jsxs(StyledDxGridGroupHeader, { $backgroundColor: getColorIndex?.(tid_alias), children: [_jsx(TMDcmtTypeIcon, { dtd: dtd }), _jsx("p", { children: getDisplayAlias(SDK_Globals.useLocalizedName ? dtd?.nameLoc : dtd?.name, tid_alias.alias) }), data.summaryItems && data.summaryItems.length > 0 && _jsx(StyledBadge, { $backgroundColor: TMColors.info, children: data.summaryItems[0].value })] });
     }, [dcmtTypes, getColorIndex]);
     const dataColumns = useMemo(() => {
         return [

package/lib/components/choosers/TMPathChooser.js

@@ -6,12 +6,11 @@ import { TMColors } from '../../utils/theme';
 import ShowAlert from '../base/TMAlert';
 import TMAreaManager from '../base/TMAreaManager';
 import TMButton from '../base/TMButton';
-import { TMLayoutItem } from '../base/TMLayout';
+import TMLayoutContainer, { TMLayoutItem } from '../base/TMLayout';
 import TMModal from '../base/TMModal';
 import { TMExceptionBoxManager } from '../base/TMPopUp';
-import { TMLayoutWaitingContainer } from '../base/TMWaitPanel';
+import TMWaitPanelManager from '../base/waitPanel/TMWaitPanelManager';
 import TMTextBox from '../editors/TMTextBox';
-let abortController = new AbortController();
 const TMPathChooser = (props) => {
     //const [path, setPath] = useState<string>(props.value)
     const [elementStyle, setElementStyle] = useState(props.elementStyle);
@@ -22,12 +21,6 @@ const TMPathChooser = (props) => {
     const [showAreaManager, setShowAreaManager] = useState(false);
     const [downloadLink, setDownloadLink] = useState(null);
     const [file, setFile] = useState(null);
-    const [showWaitPanel, setShowWaitPanel] = useState(false);
-    const [waitPanelTitle, setWaitPanelTitle] = useState('');
-    const [showSecondary, setShowSecondary] = useState(false);
-    const [waitPanelTextSecondary, setWaitPanelTextSecondary] = useState('');
-    const [waitPanelValueSecondary, setWaitPanelValueSecondary] = useState(0);
-    const [waitPanelMaxValueSecondary, setWaitPanelMaxValueSecondary] = useState(0);
     const formulaItems = ['{@JobName}', '{@JobStartDate}', '{@JobStartDate_DDMMYYYY}', '{@JobStartDateTime}', '{@ProcessRunID}', '{@ProcessName}', '{@ProcessStartDate}', '{@ProcessStartDateTime}'];
     //useEffect(() => { setPath(props.value) }, [props.value])
     useEffect(() => {
@@ -98,30 +91,23 @@ const TMPathChooser = (props) => {
         return buttons;
     };
     const onFileDownloadHandler = async () => {
+        // Un solo file: la barra del pannello segue i byte scaricati
+        const waitPanel = TMWaitPanelManager.show({
+            title: "Download",
+            cancelable: true,
+            showCounters: false,
+        });
         try {
             let av = AreaHelper.ExtractAreaInfo_2(props.value, true);
             let doc;
             let tms = props.tmSession ?? SDK_Globals.tmSession;
-            setShowWaitPanel(true);
-            setShowSecondary(true);
-            setWaitPanelTitle("Download");
-            abortController = new AbortController();
-            let firstBlock = true;
-            let maxFileSize = 0;
-            doc = await tms?.NewAreaEngine().RetrieveFileAsync(av.aid, av.subFolder, av.fileName, FileFormats.None, abortController.signal, (pd) => {
-                if (firstBlock) {
-                    maxFileSize = pd.ProgressBarMaximum ?? 0;
-                    setWaitPanelMaxValueSecondary(maxFileSize);
-                    firstBlock = false;
-                }
-                setWaitPanelValueSecondary(pd.ProgressBarValue);
-                setWaitPanelTextSecondary(`Downloading... ${Globalization.getNumberDisplayValue(pd.ProgressBarValue, true)} / ${Globalization.getNumberDisplayValue(maxFileSize, true)}`);
-                if (pd.ProgressBarValue === pd.ProgressBarMaximum) {
-                    setWaitPanelMaxValueSecondary(0);
-                    setWaitPanelValueSecondary(0);
-                    setWaitPanelTextSecondary('');
-                    firstBlock = true;
-                }
+            doc = await tms?.NewAreaEngine().RetrieveFileAsync(av.aid, av.subFolder, av.fileName, FileFormats.None, waitPanel.signal, (pd) => {
+                const total = pd.ProgressBarMaximum ?? 0;
+                waitPanel.update({
+                    value: pd.ProgressBarValue,
+                    max: total,
+                    subtitle: `Downloading... ${Globalization.getNumberDisplayValue(pd.ProgressBarValue, true)} / ${Globalization.getNumberDisplayValue(total, true)}`
+                });
             });
             setFile(doc);
         }
@@ -135,13 +121,10 @@ const TMPathChooser = (props) => {
             setFile(null);
         }
         finally {
-            setWaitPanelTextSecondary('');
-            setWaitPanelMaxValueSecondary(0);
-            setWaitPanelValueSecondary(0);
-            setShowWaitPanel(false);
+            waitPanel.close();
         }
     };
-    return (_jsxs(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: [_jsx(TMLayoutItem, { children: _jsx(TMTextBox, { buttons: renderButtons(), elementStyle: elementStyle, formulaItems: props.allowParametricPath ? formulaItems : [], isModifiedWhen: props.isModifiedWhen, label: props.label, value: props.value || '', onValueChanged: (e) => { /*setPath(e.target.value);*/ props.onValueChanged?.(e.target.value); }, validationItems: props.validationItems }) }), showAreaManager &&
+    return (_jsxs(TMLayoutContainer, { direction: 'vertical', children: [_jsx(TMLayoutItem, { children: _jsx(TMTextBox, { buttons: renderButtons(), elementStyle: elementStyle, formulaItems: props.allowParametricPath ? formulaItems : [], isModifiedWhen: props.isModifiedWhen, label: props.label, value: props.value || '', onValueChanged: (e) => { /*setPath(e.target.value);*/ props.onValueChanged?.(e.target.value); }, validationItems: props.validationItems }) }), showAreaManager &&
                 _jsxs(TMModal, { resizable: true, width: '80%', onClose: () => setShowAreaManager(false), children: [_jsx(TMAreaManager, { showOnlyFolders: props.allowBrowseFolder_Area && !props.allowBrowseFile_Area, initialPath: props.value, onFolderChanged: (folder) => setAreaFolderPath(folder), onFileChanged: (file) => setAreaFilePath(file), isPathChooser: true, areaChoose: areaChoose, width: '98%', height: props.allowBrowseFile_Area ? '70vh' : '90%', tmSession: props.tmSession, selectionMode: 'single' }), _jsx("div", { style: { position: 'absolute', right: '22px', bottom: '8px' }, children: _jsx(TMButton, { caption: 'OK', onClick: () => areaChoose() }) })] })] }));
 };
 export default TMPathChooser;

package/lib/components/choosers/TMQuickSearchInfo.js

@@ -1,4 +1,4 @@
-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 { useEffect, useMemo, useRef, useState } from 'react';
 import { DcmtTypeListCacheService, PlatformObjectValidator, SavedQueryCacheService, SDK_Globals, SDK_Localizator, SearchEngine } from '@topconsultnpm/sdk-ts';
 import styled from 'styled-components';
@@ -207,16 +207,16 @@ const TMQuickSearchCondition = ({ condition }) => (_jsxs(StyledCondition, { chil
 /** Riepilogo mostrato nel tooltip e nel dettaglio: nel dettaglio il nome della ricerca è già nel titolo del modale */
 const TMQuickSearchSummary = ({ summary, isDetail = false }) => {
     if (!summary) {
-        return (_jsx(StyledSummary, { "$isDetail": isDetail, children: _jsxs(StyledNote, { children: [SDKUI_Localizator.Loading, " ..."] }) }));
+        return (_jsx(StyledSummary, { $isDetail: isDetail, children: _jsxs(StyledNote, { children: [SDKUI_Localizator.Loading, " ..."] }) }));
     }
     if (summary.isUnavailable) {
-        return (_jsxs(StyledSummary, { "$isDetail": isDetail, children: [!isDetail && _jsxs(StyledSummaryTitle, { children: [_jsx(IconSavedQuery, { fontSize: 19 }), summary.name] }), _jsxs(StyledNote, { children: [_jsx(IconInfo, { fontSize: 17 }), "La ricerca rapida configurata non \u00E8 pi\u00F9 disponibile"] })] }));
+        return (_jsxs(StyledSummary, { $isDetail: isDetail, children: [!isDetail && _jsxs(StyledSummaryTitle, { children: [_jsx(IconSavedQuery, { fontSize: 19 }), summary.name] }), _jsxs(StyledNote, { children: [_jsx(IconInfo, { fontSize: 17 }), "La ricerca rapida configurata non \u00E8 pi\u00F9 disponibile"] })] }));
     }
     // Nel tooltip le condizioni oltre il limite vengono troncate: il tooltip non è scorribile
     const shownConditions = isDetail ? summary.conditions : summary.conditions.slice(0, TOOLTIP_MAX_CONDITIONS);
     const hiddenConditionsCount = summary.conditions.length - shownConditions.length;
     const hasParameters = shownConditions.some(o => o.isParameter);
-    return (_jsxs(StyledSummary, { "$isDetail": isDetail, children: [!isDetail && _jsxs(StyledSummaryTitle, { children: [_jsx(IconSavedQuery, { fontSize: 19 }), summary.name] }), summary.conditions.length <= 0
+    return (_jsxs(StyledSummary, { $isDetail: isDetail, children: [!isDetail && _jsxs(StyledSummaryTitle, { children: [_jsx(IconSavedQuery, { fontSize: 19 }), summary.name] }), summary.conditions.length <= 0
                 ? _jsxs(StyledNote, { children: [_jsx(IconInfo, { fontSize: 17 }), "Nessun filtro: la ricerca restituisce tutti i documenti"] })
                 : _jsxs(_Fragment, { children: [_jsxs(StyledSectionTitle, { children: [SDK_Localizator.QueryWhere, _jsx(StyledCounter, { children: summary.conditions.length })] }), _jsx(StyledConditions, { children: shownConditions.map((condition, index) => _jsx(TMQuickSearchCondition, { condition: condition }, index)) }), hiddenConditionsCount > 0 &&
                             _jsxs(StyledNote, { children: [_jsx(IconInfo, { fontSize: 17 }), "Altre ", hiddenConditionsCount, " condizioni non mostrate"] })] }), hasParameters && _jsxs(StyledNote, { children: [_jsx(IconInfo, { fontSize: 17 }), "I valori tratteggiati vengono chiesti a ogni esecuzione della ricerca"] }), !isDetail && _jsxs(StyledHint, { children: [_jsx(IconInfo, { fontSize: 17 }), "Fare clic per aprire il dettaglio e leggerlo meglio"] })] }));

package/lib/components/choosers/TMQuickSearchSettingsForm.js

@@ -1,4 +1,4 @@
-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 { useEffect, useMemo, useState } from 'react';
 import { ResultTypes, SavedQueryCacheService, SDK_Localizator, ValidationItem } from '@topconsultnpm/sdk-ts';
 import styled from 'styled-components';

package/lib/components/choosers/TMRelationChooser.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from 'react';
 import { SDK_Globals, RelationTypes, RelationCacheService, DcmtTypeListCacheService, SDK_Localizator } from '@topconsultnpm/sdk-ts';
 import { IconSearch, IconRelationManyToMany, IconRelationOneToMany, SDKUI_Localizator } from '../../helper';

package/lib/components/choosers/TMSelectedValuesSummary.js

@@ -84,8 +84,6 @@ const StyledSelectionActions = styled.div `display: flex; flex-shrink: 0; align-
 const TMSelectedValuesSummary = ({ items, onRemove, onClear }) => {
     if (items.length <= 0)
         return null;
-    return (_jsxs(StyledSelectionSummary, { children: [_jsxs(StyledSelectionTitle, { children: [_jsx(IconSelected, { fontSize: 17, color: TMColors.primary }), _jsx("span", { children: SDKUI_Localizator.Selected }), _jsx(StyledSelectionCounter, { children: items.length })] }), _jsx(StyledSelectionChips, { children: items.map((item) => 
-                /* Il valore lungo viene troncato nel chip: il tooltip è l'unico modo per leggerlo per intero */
-                _jsx(TMTooltip, { content: item.display, children: _jsxs(StyledChip, { children: [_jsx(StyledChipLabel, { children: item.display }), _jsx(StyledChipRemove, { type: 'button', title: SDKUI_Localizator.Remove, onClick: () => onRemove(item.value), children: _jsx(IconCloseOutline, { fontSize: 13 }) })] }) }, item.value)) }), _jsx(StyledSelectionActions, { children: _jsx(TMButton, { btnStyle: 'toolbar', caption: SDKUI_Localizator.Clear, icon: _jsx(IconEraser, {}), onClick: onClear }) })] }));
+    return (_jsxs(StyledSelectionSummary, { children: [_jsxs(StyledSelectionTitle, { children: [_jsx(IconSelected, { fontSize: 17, color: TMColors.primary }), _jsx("span", { children: SDKUI_Localizator.Selected }), _jsx(StyledSelectionCounter, { children: items.length })] }), _jsx(StyledSelectionChips, { children: items.map((item) => _jsx(TMTooltip, { content: item.display, children: _jsxs(StyledChip, { children: [_jsx(StyledChipLabel, { children: item.display }), _jsx(StyledChipRemove, { type: 'button', title: SDKUI_Localizator.Remove, onClick: () => onRemove(item.value), children: _jsx(IconCloseOutline, { fontSize: 13 }) })] }) }, item.value)) }), _jsx(StyledSelectionActions, { children: _jsx(TMButton, { btnStyle: 'toolbar', caption: SDKUI_Localizator.Clear, icon: _jsx(IconEraser, {}), onClick: onClear }) })] }));
 };
 export default TMSelectedValuesSummary;

package/lib/components/choosers/TMUserChooser.js

@@ -1,4 +1,4 @@
-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 { useEffect, useMemo, useRef, useState } from 'react';
 import { OwnershipLevels, SDK_Localizator, UserLevels, UserListCacheService } from '@topconsultnpm/sdk-ts';
 import { SDKUI_Localizator, IconSearch, IconUserLevelMember, IconUserLevelAdministrator, IconUserLevelSystemAdministrator, IconUserLevelAutonomousAdministrator, LocalizeOwnershipLevels, LocalizeUserLevels, IconShowAllUsersOff, IconShowAllUsers } from '../../helper';

package/lib/components/editors/TMCheckBox.js

@@ -85,7 +85,7 @@ const TMCheckBox = ({ labelColor, isModifiedWhen, elementStyle, disabled = false
         return myBool;
     };
     const renderedCheckbox = () => {
-        return (_jsxs(StyledCheckBoxContainer, { "$disabled": disabled, "$labelPosition": labelPosition, onKeyDown: (e) => e.code === 'Space' && !disabled && onValueChanged && onValueChanged(currentValue), onClick: () => { !disabled && onValueChanged && onValueChanged(currentValue); }, children: [label && _jsx(StyledCheckBoxLabel, { "$labelColor": labelColor, tabIndex: 0, "$isModifiedWhen": isModifiedWhen, "$disabled": disabled, "$labelPosition": labelPosition, "$fontSize": fontSize, children: label }), _jsx(StyledCheckbox, { tabIndex: -1, "$isModifiedWhen": isModifiedWhen, "$disabled": disabled, type: 'checkbox', checked: !isChecked(), onChange: () => { } })] }));
+        return (_jsxs(StyledCheckBoxContainer, { $disabled: disabled, $labelPosition: labelPosition, onKeyDown: (e) => e.code === 'Space' && !disabled && onValueChanged && onValueChanged(currentValue), onClick: () => { !disabled && onValueChanged && onValueChanged(currentValue); }, children: [label && _jsx(StyledCheckBoxLabel, { $labelColor: labelColor, tabIndex: 0, $isModifiedWhen: isModifiedWhen, $disabled: disabled, $labelPosition: labelPosition, $fontSize: fontSize, children: label }), _jsx(StyledCheckbox, { tabIndex: -1, $isModifiedWhen: isModifiedWhen, $disabled: disabled, type: 'checkbox', checked: !isChecked(), onChange: () => { } })] }));
     };
     return (_jsx("div", { style: elementStyle, children: renderedCheckbox() }));
 };

package/lib/components/editors/TMDropDown.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from "react";
 import { createPortal } from "react-dom";
 import styled, { css } from "styled-components";
@@ -232,8 +232,8 @@ const TMDropDown = ({ validationItems = [], disabled = false, elementStyle, isMo
         }
     };
     const renderOptions = () => (filteredDataSource.length > 0
-        ? filteredDataSource.map((data, index) => (_jsx(StyledOption, { "$fontSize": fontSize, "$isSelected": String(data.value) === String(value), "$isHighlighted": index === highlightedIndex, onMouseEnter: () => setHighlightedIndex(index), onClick: () => selectItem(data), children: itemRender ? itemRender(data) : data.display }, index)))
-        : _jsx(StyledNoOptions, { "$fontSize": fontSize, children: SDKUI_Localizator.NoDataToDisplay }));
+        ? filteredDataSource.map((data, index) => (_jsx(StyledOption, { $fontSize: fontSize, $isSelected: String(data.value) === String(value), $isHighlighted: index === highlightedIndex, onMouseEnter: () => setHighlightedIndex(index), onClick: () => selectItem(data), children: itemRender ? itemRender(data) : data.display }, index)))
+        : _jsx(StyledNoOptions, { $fontSize: fontSize, children: SDKUI_Localizator.NoDataToDisplay }));
     // onMouseDown va bloccato: senza preventDefault il blur dell'input chiuderebbe l'elenco prima del click
     const renderOptionsPanel = () => {
         if (!isOpen)
@@ -243,12 +243,12 @@ const TMDropDown = ({ validationItems = [], disabled = false, elementStyle, isMo
         }
         if (!optionsPanelPosition)
             return null;
-        return createPortal(_jsx(StyledPortalOptionsPanel, { ref: optionsPanelRef, "$left": optionsPanelPosition.left, "$top": optionsPanelPosition.top, "$bottom": optionsPanelPosition.bottom, "$width": optionsPanelPosition.width, "$maxHeight": optionsPanelPosition.maxHeight, onMouseDown: (e) => e.preventDefault(), children: renderOptions() }), document.body);
+        return createPortal(_jsx(StyledPortalOptionsPanel, { ref: optionsPanelRef, $left: optionsPanelPosition.left, $top: optionsPanelPosition.top, $bottom: optionsPanelPosition.bottom, $width: optionsPanelPosition.width, $maxHeight: optionsPanelPosition.maxHeight, onMouseDown: (e) => e.preventDefault(), children: renderOptions() }), document.body);
     };
-    const renderSearchableDropDown = () => (_jsxs(_Fragment, { children: [_jsx(StyledSearchInput, { value: isOpen ? searchText : (selectedItem?.display ?? ''), placeholder: isOpen ? SDKUI_Localizator.Search : placeHolder, readOnly: disabled, disabled: disabled, "$disabled": disabled, "$fontSize": fontSize, "$isModified": isModifiedWhen, "$vil": validationItems, onFocus: () => { setIsFocused(true); openOptions(); }, onBlur: () => { setIsFocused(false); closeOptions(); }, onClick: () => { if (!isOpen)
+    const renderSearchableDropDown = () => (_jsxs(_Fragment, { children: [_jsx(StyledSearchInput, { value: isOpen ? searchText : (selectedItem?.display ?? ''), placeholder: isOpen ? SDKUI_Localizator.Search : placeHolder, readOnly: disabled, disabled: disabled, $disabled: disabled, $fontSize: fontSize, $isModified: isModifiedWhen, $vil: validationItems, onFocus: () => { setIsFocused(true); openOptions(); }, onBlur: () => { setIsFocused(false); closeOptions(); }, onClick: () => { if (!isOpen)
                     openOptions(); }, onChange: (e) => { setSearchText(e.target.value); setIsOpen(true); setHighlightedIndex(0); }, onKeyDown: onSearchKeyDown }), renderOptionsPanel()] }));
-    const renderNativeDropDown = () => (_jsxs(StyledDropDown, { value: value, onFocus: () => setIsFocused(true), onBlur: () => setIsFocused(false), "$disabled": disabled, disabled: disabled, "$fontSize": fontSize, "$isModified": isModifiedWhen, "$vil": validationItems, onChange: onValueChanged, children: [placeHolder && _jsx("option", { value: "", disabled: true, hidden: true, children: placeHolder }), dataSource?.map((data, index) => (_jsx("option", { value: data.value, children: data.display }, index)))] }));
-    const renderedLeftLabelTextBox = () => (_jsxs(TMLayoutContainer, { direction: 'horizontal', children: [icon && _jsx(TMLayoutItem, { width: '20px', children: _jsx(StyledEditorIcon, { "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, children: icon }) }), _jsx(TMLayoutItem, { children: _jsxs(StyledEditorContainer, { "$width": width, children: [label && _jsx(StyledEditorLabel, { "$isFocused": isFocused, "$labelPosition": labelPosition, "$disabled": disabled, children: label }), _jsxs(StyledDropDownWrapper, { ref: dropDownWrapperRef, "$width": width, children: [searchEnabled ? renderSearchableDropDown() : renderNativeDropDown(), buttons.length > 0 && (_jsx(ButtonsContainer, { children: buttons.map((buttonItem) => (_jsx(StyledDropDownEditorButton, { onClick: buttonItem.onClick, children: _jsx(TMTooltip, { content: buttonItem.tooltipContent ?? buttonItem.text, children: buttonItem.icon }) }, buttonItem.text))) })), _jsx(CustomArrow, {})] }), _jsx(TMVilViewer, { vil: validationItems })] }) })] }));
+    const renderNativeDropDown = () => (_jsxs(StyledDropDown, { value: value, onFocus: () => setIsFocused(true), onBlur: () => setIsFocused(false), $disabled: disabled, disabled: disabled, $fontSize: fontSize, $isModified: isModifiedWhen, $vil: validationItems, onChange: onValueChanged, children: [placeHolder && _jsx("option", { value: "", disabled: true, hidden: true, children: placeHolder }), dataSource?.map((data, index) => (_jsx("option", { value: data.value, children: data.display }, index)))] }));
+    const renderedLeftLabelTextBox = () => (_jsxs(TMLayoutContainer, { direction: 'horizontal', children: [icon && _jsx(TMLayoutItem, { width: '20px', children: _jsx(StyledEditorIcon, { $disabled: disabled, $vil: validationItems, $isModified: isModifiedWhen, children: icon }) }), _jsx(TMLayoutItem, { children: _jsxs(StyledEditorContainer, { $width: width, children: [label && _jsx(StyledEditorLabel, { $isFocused: isFocused, $labelPosition: labelPosition, $disabled: disabled, children: label }), _jsxs(StyledDropDownWrapper, { ref: dropDownWrapperRef, $width: width, children: [searchEnabled ? renderSearchableDropDown() : renderNativeDropDown(), buttons.length > 0 && (_jsx(ButtonsContainer, { children: buttons.map((buttonItem) => (_jsx(StyledDropDownEditorButton, { onClick: buttonItem.onClick, children: _jsx(TMTooltip, { content: buttonItem.tooltipContent ?? buttonItem.text, children: buttonItem.icon }) }, buttonItem.text))) })), _jsx(CustomArrow, {})] }), _jsx(TMVilViewer, { vil: validationItems })] }) })] }));
     return _jsx("div", { style: elementStyle, children: renderedLeftLabelTextBox() });
 };
 export default TMDropDown;

package/lib/components/editors/TMEditorStyled.d.ts

@@ -31,7 +31,7 @@ export declare const StyledEditorLabel: import("styled-components/dist/types").I
     style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
 }, {
     $isFocused: boolean;
-    $labelPosition: "right" | "left" | "top";
+    $labelPosition: 'right' | 'left' | 'top';
     $disabled: boolean;
     $fontSize?: string;
     $color?: string;

package/lib/components/editors/TMFormulaEditor.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { ValidationItem, SDK_Globals, MetadataDataTypes, DBBrands, ResultTypes } from '@topconsultnpm/sdk-ts';
 import { TreeView } from 'devextreme-react';

package/lib/components/editors/TMHtmlContentDisplay.js

@@ -73,6 +73,6 @@ const TMHtmlContentDisplay = (props) => {
     updatedMarkup = convertLinksToAnchors(updatedMarkup);
     updatedMarkup = addMentionStyling(updatedMarkup, usersName);
     updatedMarkup = highlightText(updatedMarkup, searchText);
-    return (_jsx(Wrapper, { "$isSelected": isSelected, children: _jsx("div", { dangerouslySetInnerHTML: { __html: updatedMarkup } }) }));
+    return (_jsx(Wrapper, { $isSelected: isSelected, children: _jsx("div", { dangerouslySetInnerHTML: { __html: updatedMarkup } }) }));
 };
 export default TMHtmlContentDisplay;

package/lib/components/editors/TMLocalizedTextBox.js

@@ -122,6 +122,6 @@ const TMLocalizedTextBox = ({ label, value, value_IT, value_EN, value_FR, value_
         icon: (_jsxs(IconContainer, { children: [_jsx(IconLanguage, {}), localizedCount > 0 && _jsx(Badge, { children: localizedCount })] })),
         onClick: handleTogglePopover,
     };
-    return (_jsxs(LocalizedContainer, { ref: containerRef, children: [(qd || tid) ? (_jsx(TMMetadataTextBox, { type: "text", label: label, value: value, isModifiedWhen: isModifiedWhen, buttons: [localizationButton], validationItems: validationItems, qd: qd, tid: tid, readOnly: readOnly, onValueChanged: (e) => onValueChanged(CultureIDs.None, e.target.value) })) : (_jsx(TMTextBox, { type: "text", label: label, value: value, isModifiedWhen: isModifiedWhen, buttons: [localizationButton], validationItems: validationItems, readOnly: readOnly, onValueChanged: (e) => onValueChanged(CultureIDs.None, e.target.value) })), isPopoverVisible && (_jsx(Portal, { popoverRef: popoverRef, children: _jsx(Popover, { ref: popoverRef, "$isVisible": isPopoverVisible, "$top": popoverPosition.top, "$left": popoverPosition.left, "$width": popoverPosition.width, onMouseDown: (e) => e.stopPropagation(), children: languages.map((lang) => ((qd || tid) ? (_jsx(TMMetadataTextBox, { label: `${lang.label}`, showClearButton: true, icon: _jsx("img", { src: getCultureIDImg(lang.code), alt: "Lang", width: 18, height: 18 }), value: lang.value || '', qd: qd, tid: tid, readOnly: readOnly, onValueChanged: (e) => onValueChanged(lang.code, e.target.value) }, lang.code)) : (_jsx(TMTextBox, { label: `${lang.label}`, showClearButton: true, icon: _jsx("img", { src: getCultureIDImg(lang.code), alt: "Lang", width: 18, height: 18 }), value: lang.value || '', readOnly: readOnly, onValueChanged: (e) => onValueChanged(lang.code, e.target.value) }, lang.code)))) }) }))] }));
+    return (_jsxs(LocalizedContainer, { ref: containerRef, children: [(qd || tid) ? (_jsx(TMMetadataTextBox, { type: "text", label: label, value: value, isModifiedWhen: isModifiedWhen, buttons: [localizationButton], validationItems: validationItems, qd: qd, tid: tid, readOnly: readOnly, onValueChanged: (e) => onValueChanged(CultureIDs.None, e.target.value) })) : (_jsx(TMTextBox, { type: "text", label: label, value: value, isModifiedWhen: isModifiedWhen, buttons: [localizationButton], validationItems: validationItems, readOnly: readOnly, onValueChanged: (e) => onValueChanged(CultureIDs.None, e.target.value) })), isPopoverVisible && (_jsx(Portal, { popoverRef: popoverRef, children: _jsx(Popover, { ref: popoverRef, $isVisible: isPopoverVisible, $top: popoverPosition.top, $left: popoverPosition.left, $width: popoverPosition.width, onMouseDown: (e) => e.stopPropagation(), children: languages.map((lang) => ((qd || tid) ? (_jsx(TMMetadataTextBox, { label: `${lang.label}`, showClearButton: true, icon: _jsx("img", { src: getCultureIDImg(lang.code), alt: "Lang", width: 18, height: 18 }), value: lang.value || '', qd: qd, tid: tid, readOnly: readOnly, onValueChanged: (e) => onValueChanged(lang.code, e.target.value) }, lang.code)) : (_jsx(TMTextBox, { label: `${lang.label}`, showClearButton: true, icon: _jsx("img", { src: getCultureIDImg(lang.code), alt: "Lang", width: 18, height: 18 }), value: lang.value || '', readOnly: readOnly, onValueChanged: (e) => onValueChanged(lang.code, e.target.value) }, lang.code)))) }) }))] }));
 };
 export default TMLocalizedTextBox;

package/lib/components/editors/TMMetadataValues.js

@@ -1,8 +1,8 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import styled from "styled-components";
-import { AccessLevels, AppModules, DcmtTypeListCacheService, LayoutGroupBorderStyles, LayoutGroupOrientations, LayoutItemTypes, LayoutModes, MetadataDataDomains, MetadataDataTypes, SDK_Globals, SystemMIDsAsNumber, SystemTIDs, WorkItemMetadataNames } from '@topconsultnpm/sdk-ts';
-import { IconUndo, IconPencil, IconFunction, IconMenuVertical, IconDataList, SDKUI_Localizator, IconNull, stringIsNullOrEmpty, deepCompare, SDKUI_Globals, IconDcmtTypeSys, isApprovalWorkflowView, StyledTabItem, getAppModuleGradient } from "../../helper";
+import { AccessLevels, DcmtTypeListCacheService, LayoutGroupBorderStyles, LayoutGroupOrientations, LayoutItemTypes, LayoutModes, MetadataDataDomains, MetadataDataTypes, SDK_Globals, SystemMIDsAsNumber, SystemTIDs, WorkItemMetadataNames } from '@topconsultnpm/sdk-ts';
+import { IconUndo, IconPencil, IconFunction, IconMenuVertical, IconDataList, SDKUI_Localizator, IconNull, stringIsNullOrEmpty, deepCompare, SDKUI_Globals, IconDcmtTypeSys, isApprovalWorkflowView } from "../../helper";
 import { TMColors } from "../../utils/theme";
 import TMButton from "../base/TMButton";
 import TMDropDownMenu from "../base/TMDropDownMenu";
@@ -13,7 +13,7 @@ import { FormulaHelper } from "./TMFormulaEditor";
 import { ChronologyMIDs, DraftsMIDs, DSAttachsMIDs } from "../../ts";
 import { TMNothingToShow } from "../features/documents/TMDcmtPreview";
 import TMAccordion from "../base/TMAccordion";
-import TabPanel, { Item } from 'devextreme-react/tab-panel';
+import TMTabControl, { TMTabPanel } from "../base/TMTabControl";
 import { TMExceptionBoxManager } from "../base/TMPopUp";
 // Costante per la minWidth degli elementi - garantisce coerenza tra layout orizzontale e verticale
 const ITEM_MIN_WIDTH = 200;
@@ -754,7 +754,7 @@ const TMLayoutTabPanel = React.memo(({ tabItems }) => {
     const handleSelectedIndexChange = useCallback((index) => {
         setActiveTabIndex(index);
     }, []);
-    return (_jsx(TabPanel, { width: "100%", height: "100%", animationEnabled: false, swipeEnabled: false, loop: false, showNavButtons: true, repaintChangesOnly: true, stylingMode: "primary", iconPosition: 'start', tabsPosition: 'top', selectedIndex: activeTabIndex, onSelectedIndexChange: handleSelectedIndexChange, children: tabItems.map((tabItem, index) => (_jsx(Item, { title: tabItem.title, tabRender: () => (_jsxs(StyledTabItem, { "$isSelected": activeTabIndex === index, "$activeGradient": getAppModuleGradient(SDK_Globals.tmSession?.SessionDescr?.appModuleID ?? AppModules.SURFER), children: [_jsx("span", { children: tabItem.title }), tabItem.errorCount !== undefined && tabItem.errorCount > 0 && (_jsx(TMTooltip, { content: _jsxs("div", { style: {
+    return (_jsx(TMTabControl, { variant: 'moduleFilled', contentAnimation: 'none', swipeEnabled: false, selectedId: String(activeTabIndex), onSelectedIdChange: (id) => handleSelectedIndexChange(Number(id)), style: { width: '100%', height: '100%' }, children: tabItems.map((tabItem, index) => (_jsx(TMTabPanel, { id: String(index), label: _jsxs(_Fragment, { children: [_jsx("span", { children: tabItem.title }), tabItem.errorCount !== undefined && tabItem.errorCount > 0 && (_jsx(TMTooltip, { content: _jsxs("div", { style: {
                                 minWidth: '240px',
                                 padding: '14px',
                                 borderRadius: '10px',
@@ -787,5 +787,5 @@ const TMLayoutTabPanel = React.memo(({ tabItems }) => {
                                                     fontSize: '0.85em',
                                                     color: '#7f1d1d',
                                                     lineHeight: 1.4
-                                                }, children: error.message })] }, idx))) })] }), children: _jsx(StyledErrorBadge, { children: tabItem.errorCount > 99 ? '99+' : tabItem.errorCount }) }))] })), children: _jsx("div", { style: { width: '100%', overflowX: 'auto' }, children: _jsx("div", { style: { minWidth: 'max-content' }, children: tabItem.content }) }) }, `tab-${tabItem.layoutItemID}`))) }));
+                                                }, children: error.message })] }, idx))) })] }), children: _jsx(StyledErrorBadge, { children: tabItem.errorCount > 99 ? '99+' : tabItem.errorCount }) }))] }), children: _jsx("div", { style: { width: '100%', overflowX: 'auto' }, children: _jsx("div", { style: { minWidth: 'max-content' }, children: tabItem.content }) }) }, `tab-${tabItem.layoutItemID}`))) }));
 });

package/lib/components/editors/TMRadioButton.js

@@ -54,8 +54,8 @@ const StyledradioButtonLabel = styled.label `
 `;
 const TMRadioButton = ({ isModifiedWhen, flexBase = 1, elementStyle, label, value, fontSize = FontSize.defaultFontSize, dataSource = [], direction = 'row', onValueChanged, disabled = false }) => {
     const renderedRadioButtons = () => {
-        return (_jsx(StyledRadioButtonWrapper, { "$direction": direction, children: dataSource.map((data, index) => (_jsxs(StyledRadioButtoncontainer, { children: [_jsx(StyledRadioButton, { "$disabled": disabled, tabIndex: -1, name: makeID(8), checked: value === data.value ? true : false, onChange: () => onValueChanged(data.value), disabled: disabled, type: 'radio' }), _jsxs(StyledradioButtonLabel, { tabIndex: 0, onKeyDown: (e) => e.code === 'Space' && onValueChanged(data.value), onClick: () => onValueChanged(data.value), "$isModifiedWhen": isModifiedWhen, "$fontSize": fontSize, "$disabled": disabled, children: [" ", data.display, " "] })] }, index))) }));
+        return (_jsx(StyledRadioButtonWrapper, { $direction: direction, children: dataSource.map((data, index) => (_jsxs(StyledRadioButtoncontainer, { children: [_jsx(StyledRadioButton, { $disabled: disabled, tabIndex: -1, name: makeID(8), checked: value === data.value ? true : false, onChange: () => onValueChanged(data.value), disabled: disabled, type: 'radio' }), _jsxs(StyledradioButtonLabel, { tabIndex: 0, onKeyDown: (e) => e.code === 'Space' && onValueChanged(data.value), onClick: () => onValueChanged(data.value), $isModifiedWhen: isModifiedWhen, $fontSize: fontSize, $disabled: disabled, children: [" ", data.display, " "] })] }, index))) }));
     };
-    return (_jsx("div", { style: elementStyle, children: _jsxs(StyledWrapper, { "$isModifiedWhen": isModifiedWhen, "$direction": direction, "$disabled": disabled, "$fontSize": fontSize, style: { display: 'flex', flexDirection: direction, alignItems: direction === 'row' ? 'center' : 'flex-start', fontSize: fontSize, gap: direction === 'row' ? '20px' : "10px" }, children: [label && _jsx(StyledRadioGroupLabel, { "$flexBase": flexBase, children: label }), _jsx(StyledRadioGroupContainer, { "$flexBase": flexBase, children: renderedRadioButtons() })] }) }));
+    return (_jsx("div", { style: elementStyle, children: _jsxs(StyledWrapper, { $isModifiedWhen: isModifiedWhen, $direction: direction, $disabled: disabled, $fontSize: fontSize, style: { display: 'flex', flexDirection: direction, alignItems: direction === 'row' ? 'center' : 'flex-start', fontSize: fontSize, gap: direction === 'row' ? '20px' : "10px" }, children: [label && _jsx(StyledRadioGroupLabel, { $flexBase: flexBase, children: label }), _jsx(StyledRadioGroupContainer, { $flexBase: flexBase, children: renderedRadioButtons() })] }) }));
 };
 export default TMRadioButton;

package/lib/components/editors/TMSummary.js

@@ -61,7 +61,7 @@ const TMSummary = forwardRef(({ placeHolder, readOnly, labelColor, hasValue, bor
         onClearClick?.();
     };
     const renderTemplateField = () => {
-        return (_jsxs(StyledSummaryTemplateInput, { ref: summaryElementRef, "$readOnly": readOnly, tabIndex: 0, "$backgroundColor": backgroundColor, "$borderRadius": borderRadius, "$isModified": isModifiedWhen, "$vil": validationItems, "$disabled": disabled, "$showBorder": showBorder, "$fontSize": fontSize, "$width": width, "$height": height, onChange: onValueChanged, children: [_jsx("div", { onClick: () => { if (openEditorOnSummaryClick && !disabled)
+        return (_jsxs(StyledSummaryTemplateInput, { ref: summaryElementRef, $readOnly: readOnly, tabIndex: 0, $backgroundColor: backgroundColor, $borderRadius: borderRadius, $isModified: isModifiedWhen, $vil: validationItems, $disabled: disabled, $showBorder: showBorder, $fontSize: fontSize, $width: width, $height: height, onChange: onValueChanged, children: [_jsx("div", { onClick: () => { if (openEditorOnSummaryClick && !disabled)
                         onEditorClick?.(); }, onDoubleClick: () => { if (!openEditorOnSummaryClick && !disabled)
                         onEditorClick?.(); }, style: {
                         display: 'flex',
@@ -82,10 +82,10 @@ const TMSummary = forwardRef(({ placeHolder, readOnly, labelColor, hasValue, bor
                         })] })] }));
     };
     const renderLabel = () => {
-        return (_jsx(StyledEditorLabel, { "$color": labelColor, "$isFocused": false, "$labelPosition": labelPosition, "$disabled": disabled, children: _jsx("div", { style: { flexDirection: "row", display: "flex", alignItems: "start", justifyContent: "start" }, children: label }) }));
+        return (_jsx(StyledEditorLabel, { $color: labelColor, $isFocused: false, $labelPosition: labelPosition, $disabled: disabled, children: _jsx("div", { style: { flexDirection: "row", display: "flex", alignItems: "start", justifyContent: "start" }, children: label }) }));
     };
     const renderSummary = () => {
-        return (_jsxs(TMLayoutContainer, { direction: 'horizontal', children: [icon && _jsx(TMLayoutItem, { width: '20px', children: icon && _jsx(StyledEditorIcon, { "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, children: icon }) }), _jsx(TMLayoutItem, { children: _jsxs(StyledEditorContainer, { "$width": width, children: [label && renderLabel(), renderTemplateField(), _jsx(TMVilViewer, { vil: validationItems })] }) })] }));
+        return (_jsxs(TMLayoutContainer, { direction: 'horizontal', children: [icon && _jsx(TMLayoutItem, { width: '20px', children: icon && _jsx(StyledEditorIcon, { $disabled: disabled, $vil: validationItems, $isModified: isModifiedWhen, children: icon }) }), _jsx(TMLayoutItem, { children: _jsxs(StyledEditorContainer, { $width: width, children: [label && renderLabel(), renderTemplateField(), _jsx(TMVilViewer, { vil: validationItems })] }) })] }));
     };
     return (_jsx("div", { style: elementStyle, children: renderSummary() }));
 });

package/lib/components/editors/TMTextArea.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useRef, useId } from 'react';
 import { StyledEditorContainer, StyledEditorIcon, StyledEditorLabel, StyledTextareaEditor } from './TMEditorStyled';
 import { FontSize, TMColors } from '../../utils/theme';
@@ -160,7 +160,7 @@ const TMTextArea = (props) => {
                                     newValue = newValue.toUpperCase();
                                 setCurrentValue(newValue);
                                 onValueChanged?.({ ...e, target: { ...e.target, value: newValue } });
-                            }, "$isMobile": deviceType === DeviceType.MOBILE, "$maxHeight": maxHeight, "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, "$fontSize": fontSize, "$width": width, "$resize": resize, style: fillHeight ? { flex: 1, height: 0 } : undefined }), _jsxs("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'flex-start', alignItems: 'center', position: 'absolute', right: '6px', top: '50%', transform: 'translateY(-50%)', pointerEvents: disabled ? 'none' : 'auto', opacity: disabled ? 0.4 : 1 }, children: [formulaItems.length > 0 &&
+                            }, $isMobile: deviceType === DeviceType.MOBILE, $maxHeight: maxHeight, $disabled: disabled, $vil: validationItems, $isModified: isModifiedWhen, $fontSize: fontSize, $width: width, $resize: resize, style: fillHeight ? { flex: 1, height: 0 } : undefined }), _jsxs("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'flex-start', alignItems: 'center', position: 'absolute', right: '6px', top: '50%', transform: 'translateY(-50%)', pointerEvents: disabled ? 'none' : 'auto', opacity: disabled ? 0.4 : 1 }, children: [formulaItems.length > 0 &&
                                     _jsx(StyledTextAreaEditorButton, { onClick: () => {
                                             setShowFormulaItemsChooser(true);
                                         }, children: _jsx(IconDataList, {}) }), showClearButton && currentValue &&
@@ -181,7 +181,7 @@ const TMTextArea = (props) => {
     };
     // Layout for the textarea with a left-aligned label
     const renderedLeftLabelTextArea = () => {
-        return (_jsxs(TMLayoutContainer, { direction: 'horizontal', children: [icon && _jsx(TMLayoutItem, { width: '20px', children: _jsx(StyledEditorIcon, { "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, children: icon }) }), _jsx(TMLayoutItem, { children: _jsxs(StyledEditorContainer, { "$width": width, style: fillHeight ? { height: '100%', display: 'flex', flexDirection: 'column' } : {}, children: [label && _jsx(StyledEditorLabel, { "$isFocused": isFocused, "$labelPosition": labelPosition, "$disabled": disabled, children: label ?? '' }), renderTextArea()] }) })] }));
+        return (_jsxs(TMLayoutContainer, { direction: 'horizontal', children: [icon && _jsx(TMLayoutItem, { width: '20px', children: _jsx(StyledEditorIcon, { $disabled: disabled, $vil: validationItems, $isModified: isModifiedWhen, children: icon }) }), _jsx(TMLayoutItem, { children: _jsxs(StyledEditorContainer, { $width: width, style: fillHeight ? { height: '100%', display: 'flex', flexDirection: 'column' } : {}, children: [label && _jsx(StyledEditorLabel, { $isFocused: isFocused, $labelPosition: labelPosition, $disabled: disabled, children: label ?? '' }), renderTextArea()] }) })] }));
     };
     return (_jsx("div", { style: { ...elementStyle, ...(fillHeight ? { height: '100%' } : {}) }, children: renderedLeftLabelTextArea() }));
 };

package/lib/components/editors/TMTextBox.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useRef } from 'react';
 import styled from 'styled-components';
 import { StyledEditor, StyledEditorContainer, StyledEditorIcon, StyledEditorLabel, editorColorManager } from './TMEditorStyled';
@@ -303,7 +303,7 @@ const TMTextBox = ({ autoComplete = 'off', autoFocus, maxLength, labelColor, pre
                                             e.preventDefault();
                                     }
                                     onKeyDown?.(e);
-                                }, "$isMobile": deviceType === DeviceType.MOBILE, "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, "$fontSize": fontSize, "$maxValue": maxValue, "$width": width, "$type": currentType, "$borderRadius": borderRadius, style: { paddingLeft: `${calculateLeftPadding()}px`, paddingRight: `${calculateRightPadding()}px`, cursor: onClick ? 'pointer' : undefined } }), (initialType === 'password' || initialType === 'secureText') && _jsx(StyledShowPasswordIcon, { onClick: toggleShowPassword, "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, children: showPasswordIcon() }), (formulaItems.length > 0 || (showClearButton && currentValue) || buttons.length > 0) &&
+                                }, $isMobile: deviceType === DeviceType.MOBILE, $disabled: disabled, $vil: validationItems, $isModified: isModifiedWhen, $fontSize: fontSize, $maxValue: maxValue, $width: width, $type: currentType, $borderRadius: borderRadius, style: { paddingLeft: `${calculateLeftPadding()}px`, paddingRight: `${calculateRightPadding()}px`, cursor: onClick ? 'pointer' : undefined } }), (initialType === 'password' || initialType === 'secureText') && _jsx(StyledShowPasswordIcon, { onClick: toggleShowPassword, $disabled: disabled, $vil: validationItems, $isModified: isModifiedWhen, children: showPasswordIcon() }), (formulaItems.length > 0 || (showClearButton && currentValue) || buttons.length > 0) &&
                                 _jsxs("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'flex-start', alignItems: 'center', position: 'absolute', right: type === 'number' ? '25px' : (initialType === 'password' ? '34px' : '6px'), top: '50%', transform: 'translateY(-50%)', pointerEvents: disabled ? 'none' : 'auto', opacity: disabled ? 0.4 : 1 }, children: [formulaItems.length > 0 &&
                                             _jsx(StyledTextBoxEditorButton, { onClick: () => {
                                                     setShowFormulaItemsChooser(true);
@@ -313,7 +313,7 @@ const TMTextBox = ({ autoComplete = 'off', autoFocus, maxLength, labelColor, pre
                                         })] }), openFormulaItemsChooser(), formulaItems.length > 0 && (_jsx(TMContextMenu, { items: formulaMenuItems, target: `#text-${id}` }))] }), _jsx(TMVilViewer, { vil: validationItems })] }) }));
     };
     const renderedLeftLabelTextBox = () => {
-        return (_jsxs(TMLayoutContainer, { direction: 'horizontal', children: [icon && _jsx(TMLayoutItem, { width: '20px', children: _jsx(StyledEditorIcon, { "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, children: icon }) }), _jsx(TMLayoutItem, { children: _jsxs(StyledEditorContainer, { "$width": width, children: [label && _jsx(StyledEditorLabel, { "$color": labelColor, "$isFocused": isFocused, "$labelPosition": labelPosition, "$disabled": disabled, children: label }), renderInputField()] }) })] }));
+        return (_jsxs(TMLayoutContainer, { direction: 'horizontal', children: [icon && _jsx(TMLayoutItem, { width: '20px', children: _jsx(StyledEditorIcon, { $disabled: disabled, $vil: validationItems, $isModified: isModifiedWhen, children: icon }) }), _jsx(TMLayoutItem, { children: _jsxs(StyledEditorContainer, { $width: width, children: [label && _jsx(StyledEditorLabel, { $color: labelColor, $isFocused: isFocused, $labelPosition: labelPosition, $disabled: disabled, children: label }), renderInputField()] }) })] }));
     };
     return (_jsx("div", { style: elementStyle, children: renderedLeftLabelTextBox() }));
 };

package/lib/components/editors/TMTextExpression.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from 'react';
 import { IconClear, IconColumns, SDKUI_Localizator, stringIsNullOrEmpty } from '../../helper';
 import { TMMetadataChooserForm } from '../choosers/TMMetadataChooser';

package/lib/components/features/archive/TMArchive.js

@@ -22,12 +22,17 @@ const TMArchive = ({ onDcmtTypeSelect = undefined, inputTID, inputFile = null, c
     const pendingMidsRef = React.useRef(null);
     const deviceType = useDeviceType();
     useEffect(() => { setMruTIDs(SDKUI_Globals.userSettings.archivingSettings.mruTIDs); }, []);
+    // Applica inputTID solo quando cambia davvero: non deve sovrascrivere il tipo documento
+    // selezionato dall'utente.
     useEffect(() => {
         if (!inputTID)
             return;
         setCurrentTID(inputTID);
-        setCurrentMruTID(mruTIDs.includes(inputTID) ? inputTID : 0);
-    }, [inputTID, mruTIDs]);
+    }, [inputTID]);
+    // Evidenzia la scorciatoia del tipo documento corrente, anche quando mruTIDs cambia.
+    useEffect(() => {
+        setCurrentMruTID(currentTID && mruTIDs.includes(currentTID) ? currentTID : 0);
+    }, [currentTID, mruTIDs]);
     useEffect(() => {
         pendingMidsRef.current = inputMids;
         if (currentTID && currentTID > 0 && inputMids && inputMids.length > 0) {