@topconsultnpm/sdkui-react 6.22.0-dev2.9 → 6.22.0-dev3.11

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

@@ -12,5 +12,5 @@ interface TMSearchResultFloatingActionButtonProps {
     selectedDcmtsOrFocused: Array<DcmtInfo>;
     config: TMSearchResultFloatingActionConfig;
 }
-export declare const TMSearchResultFloatingActionButton: (props: TMSearchResultFloatingActionButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TMSearchResultFloatingActionButton: (props: TMSearchResultFloatingActionButtonProps) => React.JSX.Element;
 export default TMSearchResultFloatingActionButton;

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

@@ -1,8 +1,9 @@
+import React from "react";
 import { DcmtInfo, IGraphometricManagerProp } from "../../../ts";
 interface TMSignatureInfoContentProps {
     inputDcmt: DcmtInfo;
     graphometricManager?: IGraphometricManagerProp;
     onClose?: () => void;
 }
-declare const TMSignatureInfoContent: (props: TMSignatureInfoContentProps) => import("react/jsx-runtime").JSX.Element;
+declare const TMSignatureInfoContent: (props: TMSignatureInfoContentProps) => React.JSX.Element;
 export default TMSignatureInfoContent;

package/lib/components/features/search/TMSignatureInfoContent.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 { SDK_Globals, RetrieveFileOptions, DcmtOpers, GeneralRetrieveFormats } from "@topconsultnpm/sdk-ts";
 import { IconCopy, IconDownload, IconWarning, IconCheck, getExceptionMessage, SDKUI_Localizator, IconCircleInfo, IconRefresh } from "../../../helper";

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

@@ -1,5 +1,5 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useState } from 'react';
+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, SDK_Localizator, TreeCacheService, TreeItemTypes } from '@topconsultnpm/sdk-ts';
 import { TreeList, Column, Scrolling, Selection } from 'devextreme-react/tree-list';
 import { DropDownBox } from 'devextreme-react';
@@ -13,89 +13,98 @@ import { TMColors } from '../../../utils/theme';
 import styled from 'styled-components';
 import { useOutsideClick } from '../../../hooks/useOutsideClick';
 import { DeviceType, useDeviceType } from '../../base/TMDeviceProvider';
+const TMTreeDcmtTypeCell = ({ tid, isMobile }) => {
+    const [dtd, setDtd] = useState();
+    const loadDTD = useCallback(async () => {
+        if (isMobile || dtd || !tid)
+            return;
+        setDtd(await DcmtTypeListCacheService.GetAsync(tid));
+    }, [isMobile, dtd, tid]);
+    return (_jsxs(StyledTreeDcmtTypeRow, { onMouseEnter: loadDTD, children: [_jsx("span", { style: { cursor: 'pointer', flex: 1, minWidth: 0 }, children: _jsx(TMTidViewer, { tid: tid, showIcon: false }) }), !isMobile && (_jsx("span", { className: 'info-icon', children: _jsx(TMDcmtTypeTooltip, { dtd: dtd, children: _jsx(IconInfo, { color: TMColors.info }) }) }))] }));
+};
 const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelectedTIDChanged, onClosePanel, allowMaximize = true, onMaximizePanel }) => {
     const [trees, setTrees] = useState([]);
-    const [treeItems, setTreeItems] = useState([]);
     const [selectedTreeId, setSelectedTreeId] = useState(0);
     const [infoDTD, setInfoDTD] = useState();
     // State to store selected row keys
     const [selectedRowKeys, setSelectedRowKeys] = useState([]);
     // State hook to store the currently focused row key, initially set to undefined
     const [focusedRowKey, setFocusedRowKey] = useState(undefined);
+    // Elemento selezionato nell'albero: dopo un refresh va riproposto se esiste ancora
+    const [selectedTreeItemKey, setSelectedTreeItemKey] = useState(undefined);
+    const selectedTreeItemKeys = useMemo(() => selectedTreeItemKey !== undefined ? [selectedTreeItemKey] : [], [selectedTreeItemKey]);
+    // Finche' gli alberi non sono arrivati il pannello mostra il loader invece della lista vuota
+    const [isLoadingTrees, setIsLoadingTrees] = useState(true);
     const [isGridBoxOpened, setIsGridBoxOpened] = useState(false);
     const [defaultTreeId, setDefaultTreeId] = useState(-1);
     const deviceType = useDeviceType();
     const isMobile = deviceType === DeviceType.MOBILE;
     const panelRef = useOutsideClick(() => setInfoDTD(undefined));
-    // useEffect(() => {
-    //     if (treeItems.length > 0 && treeItems[0].id) {
-    //         setSelectedRowKeys([treeItems[0].id])
-    //     }
-    // }, [treeItems])
-    useEffect(() => {
-        const setResultCache = (result) => {
-            if (result && result.length > 0) {
-                setTrees(result);
-                let defaultTree = SDKUI_Globals.userSettings.searchSettings.defaultTree;
-                let initialTreeId;
-                let treeToSelect;
-                if (defaultTree > 0) {
-                    initialTreeId = defaultTree;
-                    treeToSelect = result.find(o => o.id == defaultTree);
-                }
-                else {
-                    initialTreeId = result[0]?.id ?? 0;
-                    treeToSelect = result[0];
-                }
-                setSelectedTreeId(initialTreeId);
-                if (treeToSelect?.id) {
-                    setSelectedRowKeys([treeToSelect.id]);
-                }
+    // Tiene traccia dell'albero selezionato senza far dipendere loadTreesAsync da selectedTreeId:
+    // così il refresh può riproporre la selezione corrente senza ricaricare a ogni cambio di albero
+    const selectedTreeIdRef = useRef(selectedTreeId);
+    useEffect(() => { selectedTreeIdRef.current = selectedTreeId; }, [selectedTreeId]);
+    // Carica tutti gli alberi del contesto corrente (ricerca o archiviazione).
+    // Con forceRefresh la cache viene invalidata, altrimenti GetAll* restituirebbe gli alberi già in memoria.
+    const loadTreesAsync = useCallback(async (forceRefresh = false) => {
+        const isSearchContext = layoutMode == LayoutModes.Update;
+        if (forceRefresh) {
+            if (isSearchContext)
+                TreeCacheService.RemoveAllSearch();
+            else
+                TreeCacheService.RemoveAllArchive();
+        }
+        const result = isSearchContext
+            ? await TreeCacheService.GetAllSearchAsync()
+            : await TreeCacheService.GetAllArchiveAsync();
+        if (!result || result.length === 0) {
+            // Sul refresh gli alberi possono essere spariti lato server: allinea anche lo stato vuoto
+            if (forceRefresh) {
+                setTrees([]);
+                setSelectedTreeId(0);
+                setSelectedRowKeys([]);
             }
-        };
-        if (layoutMode == LayoutModes.Update) {
-            TreeCacheService.GetAllSearchAsync().then((result) => { setResultCache(result); });
+            return;
+        }
+        setTrees(result);
+        // Dopo un refresh mantiene l'albero corrente, se ancora presente
+        const currentTreeId = selectedTreeIdRef.current;
+        if (forceRefresh && result.some(o => o.id == currentTreeId)) {
+            setSelectedTreeId(currentTreeId);
+            setSelectedRowKeys([currentTreeId]);
+            return;
+        }
+        let defaultTree = SDKUI_Globals.userSettings.searchSettings.defaultTree;
+        let initialTreeId;
+        let treeToSelect;
+        if (defaultTree > 0) {
+            initialTreeId = defaultTree;
+            treeToSelect = result.find(o => o.id == defaultTree);
         }
         else {
-            TreeCacheService.GetAllArchiveAsync().then((result) => { setResultCache(result); });
+            initialTreeId = result[0]?.id ?? 0;
+            treeToSelect = result[0];
+        }
+        setSelectedTreeId(initialTreeId);
+        if (treeToSelect?.id) {
+            setSelectedRowKeys([treeToSelect.id]);
         }
     }, [layoutMode]);
     useEffect(() => {
-        let newTreeItems = trees.find(o => o.id == selectedTreeId)?.items ?? [];
-        setTreeItems(newTreeItems);
-    }, [selectedTreeId, trees]);
+        setIsLoadingTrees(true);
+        loadTreesAsync().finally(() => setIsLoadingTrees(false));
+    }, [loadTreesAsync]);
+    // Derivato nello stesso render degli alberi: con uno state la TreeList mostrerebbe "Nessun dato" per un frame
+    const treeItems = useMemo(() => trees.find(o => o.id == selectedTreeId)?.items ?? [], [trees, selectedTreeId]);
+    useEffect(() => {
+        // Mantiene la selezione dopo il refresh solo se l'elemento e' ancora presente (al cambio albero si azzera)
+        setSelectedTreeItemKey(prev => prev !== undefined && treeItems.some(o => o.id == prev) ? prev : undefined);
+    }, [treeItems]);
     const renderCell = useCallback((data) => {
         const treeItem = data.data;
-        const [showInfo, setShowInfo] = useState(false);
         // Documento (DcmtType)
         if (treeItem.type === TreeItemTypes.DcmtType) {
-            return (_jsxs(StyledDivHorizontal, { style: {
-                    alignItems: 'center',
-                    minWidth: 0,
-                    width: '100%',
-                    gap: 2,
-                    position: 'relative'
-                }, onMouseEnter: async () => {
-                    if (!isMobile) {
-                        setShowInfo(true);
-                        let dtd = await DcmtTypeListCacheService.GetAsync(treeItem.tid);
-                        setInfoDTD(dtd);
-                    }
-                }, onMouseLeave: () => {
-                    if (!isMobile) {
-                        setShowInfo(false);
-                        setInfoDTD(undefined);
-                    }
-                }, children: [_jsx("span", { style: { cursor: 'pointer', flex: 1, minWidth: 0 }, children: _jsx(TMTidViewer, { tid: treeItem.tid, showIcon: false }) }), !isMobile && (_jsx("span", { style: {
-                            opacity: showInfo ? 1 : 0,
-                            transition: 'opacity 0.2s',
-                            pointerEvents: showInfo ? 'auto' : 'none',
-                            cursor: 'pointer',
-                            display: 'flex',
-                            alignItems: 'center',
-                            marginLeft: 'auto',
-                            zIndex: 2
-                        }, children: _jsx(TMDcmtTypeTooltip, { dtd: infoDTD, children: _jsx(IconInfo, { color: TMColors.info }) }) }))] }));
+            return _jsx(TMTreeDcmtTypeCell, { tid: treeItem.tid, isMobile: isMobile });
         }
         // Folder (altri tipi)
         return (_jsxs(StyledDivHorizontal, { style: { gap: 5, alignItems: 'center', minWidth: 0 }, children: [_jsx("span", { style: {
@@ -113,7 +122,7 @@ const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelected
                         whiteSpace: 'nowrap',
                         flex: 1,
                     }, children: treeItem.nameLoc })] }));
-    }, [isMobile, infoDTD, setInfoDTD]);
+    }, [isMobile]);
     // Handles selection change in the data grid
     const onSelectionChanged = useCallback((e) => {
         const selectedKeys = e.component.getSelectedRowKeys() ?? [];
@@ -126,6 +135,16 @@ const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelected
         setSelectedRowKeys(selectedKeys);
         setIsGridBoxOpened(false);
     }, []);
+    // Handles click on a tree row in the trees data grid: clicking the already selected tree
+    // does not raise onSelectionChanged, so the drop down must be closed here as well
+    const onRowClickTrees = useCallback((e) => {
+        const tree = e.data;
+        if (tree?.id === undefined)
+            return;
+        setSelectedTreeId(tree.id);
+        setSelectedRowKeys([tree.id]);
+        setIsGridBoxOpened(false);
+    }, []);
     // Handles focus change in the data grid
     const onFocusedRowChanged = useCallback((e) => {
         setFocusedRowKey(e.row?.key);
@@ -161,7 +180,18 @@ const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelected
             }
         }
     }, []);
-    return (_jsx(TMPanel, { title: SDK_Localizator.Trees, isVisible: isVisible, totalItems: trees.length, onClose: onClosePanel, allowMaximize: allowMaximize, onMaximize: onMaximizePanel, onHeaderDoubleClick: onMaximizePanel, toolbar: _jsx(TMButton, { btnStyle: 'icon', caption: defaultTreeId == selectedTreeId ? SDKUI_Localizator.TreeRemoveDefault : SDKUI_Localizator.SetAsDefault, icon: defaultTreeId == selectedTreeId ? _jsx(IconStarRemove, { color: 'rgb(243, 114, 92)' }) : _jsx(IconStar, { color: 'rgb(248, 215, 117)' }), onClick: () => {
+    // Callback function to handle click events on a tree view row.
+    const onRowClickTreeView = useCallback((e) => {
+        const treeItem = e.data;
+        if (treeItem?.type === TreeItemTypes.DcmtType) {
+            onSelectedTIDChanged?.(treeItem.tid, selectedTreeId);
+        }
+    }, [onSelectedTIDChanged, selectedTreeId]);
+    // La selezione la decide il widget (click, ctrl+click che deseleziona, barra spaziatrice): qui si allinea solo lo stato
+    const onSelectionChangedTreeView = useCallback((e) => {
+        setSelectedTreeItemKey(e.selectedRowKeys?.[0]);
+    }, []);
+    return (_jsx(TMPanel, { title: SDK_Localizator.Trees, isVisible: isVisible, totalItems: trees.length, onClose: onClosePanel, allowMaximize: allowMaximize, onMaximize: onMaximizePanel, onHeaderDoubleClick: onMaximizePanel, onRefresh: () => loadTreesAsync(true), isRefreshing: isLoadingTrees, toolbar: _jsx(TMButton, { btnStyle: 'icon', caption: defaultTreeId == selectedTreeId ? SDKUI_Localizator.TreeRemoveDefault : SDKUI_Localizator.SetAsDefault, icon: defaultTreeId == selectedTreeId ? _jsx(IconStarRemove, { color: 'rgb(243, 114, 92)' }) : _jsx(IconStar, { color: 'rgb(248, 215, 117)' }), onClick: () => {
                 if (defaultTreeId == selectedTreeId) {
                     if (layoutMode == LayoutModes.Update)
                         SDKUI_Globals.userSettings.searchSettings.defaultTree = -1;
@@ -193,14 +223,35 @@ const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelected
                                 }, value: selectedTreeId, opened: isGridBoxOpened, valueExpr: "id", displayExpr: "nameLoc", deferRendering: false, dataSource: trees, onValueChanged: syncDataGridSelection, onOptionChanged: onGridBoxOpened, style: { height: 30, padding: '5px' }, children: _jsx(TMDataGrid, { height: "100%", width: "100%", dataSource: trees, dataColumns: [
                                         { dataField: 'nameLoc', caption: SDKUI_Localizator.Name, width: 'auto' },
                                         { dataField: 'description', caption: SDKUI_Localizator.Description, width: 'auto' },
-                                    ], selection: { mode: 'single', showCheckBoxesMode: "none" }, showHeaderFilter: false, selectedRowKeys: selectedRowKeys, onSelectionChanged: onSelectionChanged, focusedRowKey: focusedRowKey, onFocusedRowChanged: onFocusedRowChanged }) }) }), _jsxs(StyledTreeListWrapper, { children: [_jsxs(TreeList, { height: "100%", dataSource: treeItems, showRowLines: false, showColumnLines: false, showBorders: false, columnAutoWidth: false, keyExpr: "id", parentIdExpr: "parentID", dataStructure: "plain", showColumnHeaders: false, onContentReady: (e) => e.component.clearSelection(), onCellDblClick: onCellDblClickTreeView, onSelectionChanged: (e) => {
-                                        if (e.selectedRowsData[0] && e.selectedRowsData[0].type == TreeItemTypes.DcmtType) {
-                                            onSelectedTIDChanged?.(e.selectedRowsData[0].tid, selectedTreeId);
-                                        }
-                                    }, children: [_jsx(Column, { dataField: "nameLoc", caption: SDKUI_Localizator.Name, cellRender: renderCell, width: "100%" }), _jsx(Scrolling, { mode: "virtual", useNative: Number(SDKUI_Globals.userSettings?.themeSettings.gridSettings.useNativeScrollbar) === 1 }), _jsx(Selection, { mode: "single" })] }), _jsxs(StyledOffCanvasPanel, { ref: panelRef, "$isOpen": isMobile && infoDTD !== undefined, children: [_jsxs(StyledDivHorizontal, { style: { gap: 10, padding: '10px 8px', width: '100%', alignItems: 'center' }, children: [_jsx("p", { style: { fontSize: '1.1rem', fontWeight: 'bold' }, children: `${SDKUI_Localizator.DcmtType} - ${SDKUI_Localizator.About}` }), _jsx(IconCloseOutline, { style: { marginLeft: 'auto', cursor: 'pointer' }, onClick: () => setInfoDTD(undefined) })] }), renderDTDTooltipContent(infoDTD)] })] })] })
-            : _jsx("div", { style: { display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', height: '100%', width: '100%', fontSize: '1.5rem' }, children: SDKUI_Localizator.TreesNoAvailable }) }));
+                                    ], selection: { mode: 'single', showCheckBoxesMode: "none" }, showHeaderFilter: false, selectedRowKeys: selectedRowKeys, onSelectionChanged: onSelectionChanged, onRowClick: onRowClickTrees, focusedRowKey: focusedRowKey, onFocusedRowChanged: onFocusedRowChanged }) }) }), _jsxs(StyledTreeListWrapper, { children: [_jsxs(TreeList, { height: "100%", dataSource: treeItems, showRowLines: false, showColumnLines: false, showBorders: false, columnAutoWidth: false, keyExpr: "id", parentIdExpr: "parentID", dataStructure: "plain", showColumnHeaders: false, selectedRowKeys: selectedTreeItemKeys, onSelectionChanged: onSelectionChangedTreeView, onCellDblClick: onCellDblClickTreeView, onRowClick: onRowClickTreeView, children: [_jsx(Column, { dataField: "nameLoc", caption: SDKUI_Localizator.Name, cellRender: renderCell, width: "100%" }), _jsx(Scrolling, { mode: "virtual", useNative: Number(SDKUI_Globals.userSettings?.themeSettings.gridSettings.useNativeScrollbar) === 1 }), _jsx(Selection, { mode: "single" })] }), _jsxs(StyledOffCanvasPanel, { ref: panelRef, $isOpen: isMobile && infoDTD !== undefined, children: [_jsxs(StyledDivHorizontal, { style: { gap: 10, padding: '10px 8px', width: '100%', alignItems: 'center' }, children: [_jsx("p", { style: { fontSize: '1.1rem', fontWeight: 'bold' }, children: `${SDKUI_Localizator.DcmtType} - ${SDKUI_Localizator.About}` }), _jsx(IconCloseOutline, { style: { marginLeft: 'auto', cursor: 'pointer' }, onClick: () => setInfoDTD(undefined) })] }), renderDTDTooltipContent(infoDTD)] })] })] })
+            : isLoadingTrees
+                ? _jsx(_Fragment, {})
+                : _jsx("div", { style: { display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', height: '100%', width: '100%', fontSize: '1.5rem' }, children: SDKUI_Localizator.TreesNoAvailable }) }));
 };
 export default TMTreeSelector;
+const StyledTreeDcmtTypeRow = styled(StyledDivHorizontal) `
+    align-items: center;
+    min-width: 0;
+    width: 100%;
+    gap: 2px;
+    position: relative;
+
+    .info-icon {
+        display: flex;
+        align-items: center;
+        margin-left: auto;
+        z-index: 2;
+        cursor: pointer;
+        opacity: 0;
+        pointer-events: none;
+        transition: opacity 0.2s;
+    }
+
+    &:hover .info-icon {
+        opacity: 1;
+        pointer-events: auto;
+    }
+`;
 const StyledTreeListWrapper = styled.div `
     width: 100%;
     height: 100%;

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

@@ -1,3 +1,4 @@
+import React from "react";
 import { DcmtInfo } from "../../../ts/types";
 import { DeviceType } from "../../base/TMDeviceProvider";
 import { DcmtTypeDescriptor, HomeBlogPost, TaskDescriptor } from "@topconsultnpm/sdk-ts";
@@ -14,5 +15,5 @@ interface TMViewHistoryDcmtProps {
     handleNavigateToWGs?: (value: HomeBlogPost | number) => Promise<void>;
     handleNavigateToDossiers?: (value: HomeBlogPost | number) => Promise<void>;
 }
-declare const TMViewHistoryDcmt: (props: TMViewHistoryDcmtProps) => import("react/jsx-runtime").JSX.Element;
+declare const TMViewHistoryDcmt: (props: TMViewHistoryDcmtProps) => React.JSX.Element;
 export default TMViewHistoryDcmt;

package/lib/components/features/tasks/TMTaskForm.d.ts

@@ -36,5 +36,5 @@ export interface TMTaskFormProps {
     onOpenPdfEditorRequest?: (dcmtInfo: Array<DcmtInfo>, refreshDocumentPreview?: () => Promise<void>) => void;
     s4TViewerDialogComponent?: React.ReactNode;
 }
-declare const TMTaskForm: (props: TMTaskFormProps) => import("react/jsx-runtime").JSX.Element;
+declare const TMTaskForm: (props: TMTaskFormProps) => React.JSX.Element;
 export default TMTaskForm;

package/lib/components/features/tasks/TMTaskForm.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 { ObjectClasses, TaskDescriptor, PdGs, UserListCacheService, SDK_Localizator } from '@topconsultnpm/sdk-ts';
 import { gotoPDGExtendedLabel, taskValidatorAsync } from './TMTasksUtils';

package/lib/components/features/tasks/TMTaskFormUtils.d.ts

@@ -8,7 +8,7 @@ interface TaskFormAssignmentNoticeSectionProps {
     users: Array<UserDescriptor>;
     requestMoreInfo?: boolean;
 }
-export declare const TaskFormAssignmentNoticeBadge: (props: TaskFormAssignmentNoticeSectionProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const TaskFormAssignmentNoticeBadge: (props: TaskFormAssignmentNoticeSectionProps) => React.JSX.Element | null;
 interface RenderContextBlockParams {
     condition: boolean;
     pdg: PdGs;
@@ -19,7 +19,7 @@ interface TaskFormContextualAttachmentsProps {
     currentTask: TaskDescriptor | undefined;
     taskContext: TaskContext | undefined;
 }
-export declare const TaskFormContextualAttachments: (props: TaskFormContextualAttachmentsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TaskFormContextualAttachments: (props: TaskFormContextualAttachmentsProps) => React.JSX.Element;
 interface TaskFormAssignedToProps {
     formMode: FormModes;
     formData: TaskDescriptor | undefined;
@@ -31,7 +31,7 @@ interface TaskFormAssignedToProps {
     label?: string;
     onValueChanged: (newValue: Array<number> | undefined) => void;
 }
-export declare const TaskAssigneeField: (props: TaskFormAssignedToProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TaskAssigneeField: (props: TaskFormAssignedToProps) => React.JSX.Element;
 interface RenderFieldBaseProps {
     fieldsReadOnly: IFieldsEditability;
     formDataOrig?: TaskDescriptor;
@@ -50,12 +50,12 @@ interface RenderDateFieldProps extends RenderFieldProps {
     label?: string;
     onContentReady?: () => void;
 }
-export declare const RenderNameField: ({ requestMoreInfo, validationItems, setFormData, formData, formDataOrig, fieldsReadOnly }: RenderFieldProps) => import("react/jsx-runtime").JSX.Element;
-export declare const RenderDescriptionField: ({ validationItems, setFormData, formData, formDataOrig, fieldsReadOnly }: RenderFieldProps) => import("react/jsx-runtime").JSX.Element;
-export declare const RenderPriorityField: ({ formData, formDataOrig, fieldsReadOnly, onPriorityValueChange }: RenderPriorityFieldProps) => import("react/jsx-runtime").JSX.Element;
-export declare const RenderStartDateField: ({ label, validationItems, setFormData, formData, formDataOrig, fieldsReadOnly, onContentReady }: RenderDateFieldProps) => import("react/jsx-runtime").JSX.Element;
-export declare const RenderEndDateField: ({ label, validationItems, setFormData, formData, formDataOrig, fieldsReadOnly, onContentReady }: RenderDateFieldProps) => import("react/jsx-runtime").JSX.Element;
-export declare const RenderRemindDateField: ({ validationItems, setFormData, formData, formDataOrig, fieldsReadOnly }: RenderFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const RenderNameField: ({ requestMoreInfo, validationItems, setFormData, formData, formDataOrig, fieldsReadOnly }: RenderFieldProps) => React.JSX.Element;
+export declare const RenderDescriptionField: ({ validationItems, setFormData, formData, formDataOrig, fieldsReadOnly }: RenderFieldProps) => React.JSX.Element;
+export declare const RenderPriorityField: ({ formData, formDataOrig, fieldsReadOnly, onPriorityValueChange }: RenderPriorityFieldProps) => React.JSX.Element;
+export declare const RenderStartDateField: ({ label, validationItems, setFormData, formData, formDataOrig, fieldsReadOnly, onContentReady }: RenderDateFieldProps) => React.JSX.Element;
+export declare const RenderEndDateField: ({ label, validationItems, setFormData, formData, formDataOrig, fieldsReadOnly, onContentReady }: RenderDateFieldProps) => React.JSX.Element;
+export declare const RenderRemindDateField: ({ validationItems, setFormData, formData, formDataOrig, fieldsReadOnly }: RenderFieldProps) => React.JSX.Element;
 interface RenderTaskFormStateFieldProps {
     formDataOrig: TaskDescriptor | undefined;
     formData: TaskDescriptor | undefined;
@@ -71,7 +71,7 @@ interface TMChangeStateFormProps {
     handleShowChangeStateForm: (value: boolean) => void;
     setFormData: React.Dispatch<React.SetStateAction<TaskDescriptor | undefined>>;
 }
-export declare const TMChangeStateForm: (props: TMChangeStateFormProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TMChangeStateForm: (props: TMChangeStateFormProps) => React.JSX.Element;
 type TaskRole = "personal" | "sender" | "receiver";
 type StatusTransitionMap = {
     [key in Task_States]?: Task_States[];

package/lib/components/features/tasks/TMTaskFormUtils.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 React, { useCallback, useEffect, useMemo, useState } from "react";
 import { PdGs, Priorities, SDK_Globals, Task_States } from "@topconsultnpm/sdk-ts";
 import { FormModes } from "../../../ts";
@@ -358,7 +358,7 @@ const TaskFormResponseComment = (props) => {
                             }, children: currentResponse && currentResponse.length > 0
                                 ? _jsx(TMHtmlContentDisplay, { markup: currentResponse ?? '-', isSelected: false })
                                 : _jsx("span", { style: { color: '#6c757d', fontStyle: 'italic' }, children: SDKUI_Localizator.NoAnswerProvided }) }) }))] })
-            : (_jsxs(ResponseCommentWrapper, { children: [_jsx(ResponseCommentTextArea, { id: "responseId", name: "response", "$isValid": true, value: currentResponse ?? '', onChange: onAnswerChange ? onAnswerChange : undefined }), _jsx(ResponseCommentLabel, { htmlFor: "responseId", children: SDKUI_Localizator.Answer }), _jsx(ResponseCommentCharacterCounter, { children: `${500 - (currentResponse ?? '').length} ${SDKUI_Localizator.CharactersRemaining}` })] })) }));
+            : (_jsxs(ResponseCommentWrapper, { children: [_jsx(ResponseCommentTextArea, { id: "responseId", name: "response", $isValid: true, value: currentResponse ?? '', onChange: onAnswerChange ? onAnswerChange : undefined }), _jsx(ResponseCommentLabel, { htmlFor: "responseId", children: SDKUI_Localizator.Answer }), _jsx(ResponseCommentCharacterCounter, { children: `${500 - (currentResponse ?? '').length} ${SDKUI_Localizator.CharactersRemaining}` })] })) }));
 };
 // Stile comune per i container dei campi
 const fieldContainerStyle = { width: '100%' };
@@ -423,7 +423,7 @@ export const RenderTaskFormStateField = (props) => {
     // Non renderizzare nulla finché i dati non sono pronti
     if (!formDataOrig)
         return null;
-    return (_jsx("div", { style: { width: '100%', marginTop: 15 }, children: _jsxs(FloatingLabelFieldCard, { "$isModifiedWhen": formDataOrig?.state !== formData?.state, style: { display: 'flex', flexDirection: 'column', gap: 10 }, children: [_jsx(FloatingFieldLabel, { "$isModifiedWhen": formDataOrig?.state !== formData?.state, children: SDKUI_Localizator.StatusAndAnswer }), _jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', width: '100%' }, children: [_jsx(StatusFieldLabel, { children: _jsxs(StatusValue, { "$isModifiedWhen": formDataOrig?.state !== formData?.state, children: [_jsx("span", { style: { display: 'flex', alignItems: 'center' }, children: taskStateIconMap(20).get(formData?.state ?? Task_States.None) }), getStatusLocalizatorValue(formData?.state ?? Task_States.None)] }) }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '8px' }, children: [showModifyButton && (_jsxs("div", { onClick: () => handleShowChangeStateForm(true), style: {
+    return (_jsx("div", { style: { width: '100%', marginTop: 15 }, children: _jsxs(FloatingLabelFieldCard, { $isModifiedWhen: formDataOrig?.state !== formData?.state, style: { display: 'flex', flexDirection: 'column', gap: 10 }, children: [_jsx(FloatingFieldLabel, { $isModifiedWhen: formDataOrig?.state !== formData?.state, children: SDKUI_Localizator.StatusAndAnswer }), _jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', width: '100%' }, children: [_jsx(StatusFieldLabel, { children: _jsxs(StatusValue, { $isModifiedWhen: formDataOrig?.state !== formData?.state, children: [_jsx("span", { style: { display: 'flex', alignItems: 'center' }, children: taskStateIconMap(20).get(formData?.state ?? Task_States.None) }), getStatusLocalizatorValue(formData?.state ?? Task_States.None)] }) }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '8px' }, children: [showModifyButton && (_jsxs("div", { onClick: () => handleShowChangeStateForm(true), style: {
                                         backgroundColor: "#d17800",
                                         color: "#fff",
                                         padding: "10px 16px",

package/lib/components/features/tasks/TMTasksAgenda.d.ts

@@ -15,5 +15,5 @@ interface TMTasksAgendaProps {
     handleFocusedRowChange: (row: TaskDescriptor | undefined) => void;
     menuItems: TMContextMenuItemProps[];
 }
-declare const TMTasksAgenda: (props: TMTasksAgendaProps) => import("react/jsx-runtime").JSX.Element;
+declare const TMTasksAgenda: (props: TMTasksAgendaProps) => React.JSX.Element;
 export default TMTasksAgenda;

package/lib/components/features/tasks/TMTasksAgenda.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 React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import ArrayStore from "devextreme/data/array_store";
 import Scheduler from "devextreme-react/scheduler";

package/lib/components/features/tasks/TMTasksCalendar.d.ts

@@ -19,5 +19,5 @@ interface TMTasksCalendarProps {
     handleFocusedRowChange: (row: TaskDescriptor | undefined) => void;
     menuItems: TMContextMenuItemProps[];
 }
-declare const TMTasksCalendar: (props: TMTasksCalendarProps) => import("react/jsx-runtime").JSX.Element;
+declare const TMTasksCalendar: (props: TMTasksCalendarProps) => React.JSX.Element;
 export default TMTasksCalendar;

package/lib/components/features/tasks/TMTasksCalendar.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 ArrayStore from 'devextreme/data/array_store';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { Priorities, Task_States } from "@topconsultnpm/sdk-ts";

package/lib/components/features/tasks/TMTasksHeader.d.ts

@@ -10,5 +10,5 @@ interface TMTasksHeaderProps {
     color?: string;
     height?: string;
 }
-declare const TMTasksHeader: (props: TMTasksHeaderProps) => import("react/jsx-runtime").JSX.Element;
+declare const TMTasksHeader: (props: TMTasksHeaderProps) => React.JSX.Element;
 export default TMTasksHeader;

package/lib/components/features/tasks/TMTasksHeader.js

@@ -28,7 +28,7 @@ const TMTasksHeader = (props) => {
     const isValidKey = (key) => {
         return key !== FilterCategoryId.AllStates && key !== FilterCategoryId.AllPriorities;
     };
-    return (_jsx(StyledListHeader, { ref: containerRef, "$color": color ?? 'black', "$height": height ?? '100%', onContextMenu: handleContextMenu, children: _jsx(ScrollView, { width: "100%", height: "100%", direction: "horizontal", useNative: true, children: _jsxs(StyledViewChangerContainer, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.SelectViewMode, showEvent: "mouseenter", hideEvent: "mouseleave", position: "top", children: _jsx(TMDropDown, { elementStyle: { minWidth: "120px", width: "120px", height: "29px" }, dataSource: [
+    return (_jsx(StyledListHeader, { ref: containerRef, $color: color ?? 'black', $height: height ?? '100%', onContextMenu: handleContextMenu, children: _jsx(ScrollView, { width: "100%", height: "100%", direction: "horizontal", useNative: true, children: _jsxs(StyledViewChangerContainer, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.SelectViewMode, showEvent: "mouseenter", hideEvent: "mouseleave", position: "top", children: _jsx(TMDropDown, { elementStyle: { minWidth: "120px", width: "120px", height: "29px" }, dataSource: [
                                 { value: TaskView.AGENDA_TASK, display: "Agenda", icon: 'clock' },
                                 { value: TaskView.CALENDAR_TASK, display: SDKUI_Localizator.Calendar, icon: 'event' },
                                 { value: TaskView.LIST_TASK, display: SDKUI_Localizator.List, icon: 'fields' },

package/lib/components/features/tasks/TMTasksPanelContent.d.ts

@@ -16,5 +16,5 @@ interface TMTasksPanelContentProps {
     s4TViewerDialogComponent?: React.ReactNode;
     afterTaskSaved?: (task: TaskDescriptor | undefined, formMode: FormModes | undefined, forceRefresh?: boolean) => Promise<void>;
 }
-declare const TMTasksPanelContent: (props: TMTasksPanelContentProps) => import("react/jsx-runtime").JSX.Element;
+declare const TMTasksPanelContent: (props: TMTasksPanelContentProps) => React.JSX.Element;
 export default TMTasksPanelContent;

package/lib/components/features/tasks/TMTasksUtilsView.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+import React, { ReactNode } from "react";
 import { PdGs, Task_States, TaskDescriptor } from '@topconsultnpm/sdk-ts';
 import { FormModes } from "../../../ts";
 export declare const taskStateIconMap: (fontSize?: number) => Map<Task_States, JSX.Element>;
@@ -12,15 +12,15 @@ export declare const renderTaskIcons: (taskData: {
     remTime: Date | undefined;
     isNew: boolean;
     numberOfDays: number;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => React.JSX.Element;
 interface TMActionCalendarProps {
     currentTask: TaskDescriptor;
     openTaskForm: (formMode: FormModes, task?: TaskDescriptor) => void;
     onDeleteCallback: (rowIds: Array<number>) => void;
 }
-export declare const TMActionCalendar: (props: TMActionCalendarProps) => import("react/jsx-runtime").JSX.Element;
-export declare const priorityLegend: () => import("react/jsx-runtime").JSX.Element;
-export declare const highlightTaskText: (text: string, search: string, taskId: number) => string | (string | import("react/jsx-runtime").JSX.Element)[];
+export declare const TMActionCalendar: (props: TMActionCalendarProps) => React.JSX.Element;
+export declare const priorityLegend: () => React.JSX.Element;
+export declare const highlightTaskText: (text: string, search: string, taskId: number) => string | (string | React.JSX.Element)[];
 export declare const treeFilterDataSource: (allTasks: Array<TaskDescriptor>) => Array<{
     id: number;
     label: string;

package/lib/components/features/tasks/TMTasksUtilsView.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 { useState } from "react";
 import { PdGs, Priorities, SDK_Globals, Task_States } from '@topconsultnpm/sdk-ts';
 import { Extended_Task_States, FilterCategoryId, filterTreeTask, gotoPDGExtendedLabel, prioritiesResourceData, taskIsExpiringSoon } from "./TMTasksUtils";

package/lib/components/features/tasks/TMTasksView.d.ts

@@ -36,5 +36,5 @@ interface TMTasksViewProps {
     s4TViewerDialogComponent?: React.ReactNode;
     afterTaskSaved?: (task: TaskDescriptor | undefined, formMode: FormModes | undefined, forceRefresh?: boolean) => Promise<void>;
 }
-declare const TMTasksView: (props: TMTasksViewProps) => import("react/jsx-runtime").JSX.Element;
+declare const TMTasksView: (props: TMTasksViewProps) => React.JSX.Element;
 export default TMTasksView;

package/lib/components/features/tasks/TMTasksView.js

@@ -1,16 +1,16 @@
-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, useState } from "react";
 import { AssignedTab, checkIfNew, createTasksMenuItems, getHeaderPriorityFilterConfig, getHeaderStatusFilterConfig, getMondayOfCurrentWeek, getNewTaskCount, getStatusLocalizatorValue, isTaskAssignedToAnotherUser, LIGTH_CYAN, LIGTH_RED_ORGANGE, TaskView, TEXT_NOT_SELECTED_COLOR } from "./TMTasksUtils";
-import { TabPanel, Item } from 'devextreme-react/tab-panel';
 import { Priorities, ResultTypes, SDK_Globals, Task_States } from "@topconsultnpm/sdk-ts";
 import { calculateNumberOfDays, renderTaskIcons } from "./TMTasksUtilsView";
 import { getPriorityLocalizatorValue } from "../tasks/TMTasksUtils";
-import { getExceptionMessage, SDKUI_Localizator, StyledTabItem, taskModalSizes, TMCountBadge } from "../../../helper";
+import { getExceptionMessage, SDKUI_Localizator, taskModalSizes, TMCountBadge } from "../../../helper";
 import { useDeviceType } from "../../base/TMDeviceProvider";
 import { FormModes } from "../../../ts";
 import TMDataGrid from "../../base/TMDataGrid";
 import { TMMessageBoxManager, ButtonNames } from "../../base/TMPopUp";
 import TMTooltip from "../../base/TMTooltip";
+import TMTabControl, { TMTabPanel } from "../../base/TMTabControl";
 import { TMLayoutWaitingContainer } from "../../base/TMWaitPanel";
 import { TMResultManager } from "../../forms/TMResultDialog";
 import TMTasksCalendar from "./TMTasksCalendar";
@@ -538,16 +538,10 @@ const TMTasksView = (props) => {
     const getFromOrToCalendarElement = (fromOrToDataSource, fromCell = false, toCell = false) => {
         return _jsx("div", { style: { width: '100%', height: '100%', display: 'flex', flexDirection: 'column', overflow: "auto" }, children: _jsx("div", { style: { width: "100%", height: "100%" }, children: _jsx(TMTasksCalendar, { id: id, visualizedTasks: fromOrToDataSource, showId: showId, fromCell: fromCell, toCell: toCell, showSearch: showSearch, currentCalendarDate: currentCalendarDate, setCurrentCalendarDate: setCurrentCalendarDate, openTaskForm: openTaskFormCallback, onDeleteCallback: onDeleteCallback, setCalendarStartDate: setCalendarStartDate, setCalendarEndDate: setCalendarEndDate, focusedRowKey: focusedRowKey, handleFocusedRowChange: handleFocusedRowChange, menuItems: menuItems }) }) });
     };
-    return _jsxs("div", { style: { width: '100%', height: '100%' }, onContextMenu: (e) => e.preventDefault(), children: [_jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, isCancelable: true, abortController: abortController, children: _jsxs(TabPanel, { width: "100%", height: "100%", animationEnabled: false, swipeEnabled: false, loop: false, showNavButtons: true, repaintChangesOnly: true, stylingMode: "primary", iconPosition: 'start', tabsPosition: 'top', selectedIndex: activeTabIndex, onSelectedIndexChange: onSelectedIndexChange, id: "task-centered-tab-title", children: [_jsx(Item, { title: SDKUI_Localizator.AssignedToMe, icon: "user", tabRender: (params) => {
-                                return _jsxs(StyledTabItem, { "$isSelected": activeTabIndex === AssignedTab.AssignedToMe, children: [_jsxs(TMTooltip, { content: SDKUI_Localizator.AssignedToMe, children: [_jsx("i", { className: `dx-icon-${params.icon}` }), "\u00A0", params.title, " ", (assignedToMeCount > 0) ? `(${assignedToMeCount})` : ''] }), newTaskCount > 0 && (_jsx(TMTooltip, { content: SDKUI_Localizator.NewAssignedActivitiesNumber + ": " + newTaskCount, children: _jsx(TMCountBadge, { children: newTaskCount }) }))] });
-                            }, render: () => activeTabIndex === AssignedTab.AssignedToMe ?
-                                _jsxs(_Fragment, { children: [activeComponent === TaskView.LIST_TASK && getFromOrToDatagridElement(visualizedTasks, true, false), activeComponent === TaskView.AGENDA_TASK && getFromOrToAgendaElement(visualizedTasks, true, false), activeComponent === TaskView.CALENDAR_TASK && getFromOrToCalendarElement(visualizedTasks, true, false)] }) : '' }), _jsx(Item, { title: SDKUI_Localizator.AssignedByMe, icon: "login", tabRender: (params) => {
-                                return _jsx(StyledTabItem, { "$isSelected": activeTabIndex === AssignedTab.AssignedByMe, children: _jsxs(TMTooltip, { content: SDKUI_Localizator.AssignedByMe, children: [_jsx("i", { className: `dx-icon-${params.icon}` }), "\u00A0", params.title, " ", (assignedByMeCount > 0) ? `(${assignedByMeCount})` : ''] }) });
-                            }, render: () => activeTabIndex === AssignedTab.AssignedByMe ?
-                                _jsxs(_Fragment, { children: [activeComponent === TaskView.CALENDAR_TASK && getFromOrToCalendarElement(visualizedTasks, false, true), activeComponent === TaskView.AGENDA_TASK && getFromOrToAgendaElement(visualizedTasks, false, true), activeComponent === TaskView.LIST_TASK && getFromOrToDatagridElement(visualizedTasks, false, true)] }) : '' }), _jsx(Item, { title: SDKUI_Localizator.AllFemale, icon: "fields", tabRender: (params) => {
-                                return _jsxs(StyledTabItem, { "$isSelected": activeTabIndex === AssignedTab.All, children: [_jsxs(TMTooltip, { content: SDKUI_Localizator.AllFemale, children: [_jsx("i", { className: `dx-icon-${params.icon}` }), "\u00A0", params.title, " ", (allTasksFilteredCount > 0) ? `(${allTasksFilteredCount})` : ''] }), newTaskCount > 0 && (_jsx(TMTooltip, { content: SDKUI_Localizator.NewAssignedActivitiesNumber + ": " + newTaskCount, children: _jsx(TMCountBadge, { children: newTaskCount }) }))] });
-                            }, render: () => activeTabIndex === AssignedTab.All ?
-                                _jsxs(_Fragment, { children: [activeComponent === TaskView.CALENDAR_TASK && getFromOrToCalendarElement(visualizedTasks, true, true), activeComponent === TaskView.AGENDA_TASK && getFromOrToAgendaElement(visualizedTasks, true, true), activeComponent === TaskView.LIST_TASK && getFromOrToDatagridElement(visualizedTasks, true, true)] }) : '' })] }) }), showTaskForm && _jsx(TMTaskForm, { id: currentTask?.id ?? -1, width: taskModalSizes(deviceType, formMode ?? FormModes.Create).width, height: taskModalSizes(deviceType, formMode ?? FormModes.Create).height, title: isContextualCreate ? SDKUI_Localizator.ContextualTask : SDKUI_Localizator.Widget_Activities, isModal: true, formMode: formMode ?? FormModes.Create, visualizedTasks: visualizedTasks, currentTask: currentTask, setCurrentTask: setCurrentTask, isContextualCreate: isContextualCreate, selectedRowKeys: selectedRowKeys, handleFocusedRowKeyChange: handleFocusedRowChange, taskContext: taskContext, usersList: usersList, onStatusChanged: () => { }, onClose: closeTaskFormCallback, onCancel: closeTaskFormCallback, showBackButton: false, onSaved: onSavedCallback, startDate: calendarStartDate, endDate: calendarEndDate, onOpenS4TViewerRequest: onOpenS4TViewerRequest, s4TViewerDialogComponent: s4TViewerDialogComponent, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGsWrapper, handleNavigateToDossiers: handleNavigateToDossiersWrapper }), _jsx("button", { style: {
+    return _jsxs("div", { style: { width: '100%', height: '100%' }, onContextMenu: (e) => e.preventDefault(), children: [_jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, isCancelable: true, abortController: abortController, children: _jsxs(TMTabControl, { variant: 'moduleFilled', contentAnimation: 'none', swipeEnabled: false, selectedId: String(activeTabIndex), onSelectedIdChange: (id) => onSelectedIndexChange(Number(id)), style: { width: '100%', height: '100%' }, contentStyle: { display: 'flex', flex: 1, minHeight: 0 }, children: [_jsx(TMTabPanel, { id: String(AssignedTab.AssignedToMe), label: _jsxs(_Fragment, { children: [_jsxs(TMTooltip, { content: SDKUI_Localizator.AssignedToMe, children: [_jsx("i", { className: 'dx-icon-user' }), "\u00A0", SDKUI_Localizator.AssignedToMe, " ", (assignedToMeCount > 0) ? `(${assignedToMeCount})` : ''] }), newTaskCount > 0 && (_jsx(TMTooltip, { content: SDKUI_Localizator.NewAssignedActivitiesNumber + ": " + newTaskCount, children: _jsx(TMCountBadge, { children: newTaskCount }) }))] }), children: activeTabIndex === AssignedTab.AssignedToMe &&
+                                _jsxs(_Fragment, { children: [activeComponent === TaskView.LIST_TASK && getFromOrToDatagridElement(visualizedTasks, true, false), activeComponent === TaskView.AGENDA_TASK && getFromOrToAgendaElement(visualizedTasks, true, false), activeComponent === TaskView.CALENDAR_TASK && getFromOrToCalendarElement(visualizedTasks, true, false)] }) }), _jsx(TMTabPanel, { id: String(AssignedTab.AssignedByMe), label: _jsxs(TMTooltip, { content: SDKUI_Localizator.AssignedByMe, children: [_jsx("i", { className: 'dx-icon-login' }), "\u00A0", SDKUI_Localizator.AssignedByMe, " ", (assignedByMeCount > 0) ? `(${assignedByMeCount})` : ''] }), children: activeTabIndex === AssignedTab.AssignedByMe &&
+                                _jsxs(_Fragment, { children: [activeComponent === TaskView.CALENDAR_TASK && getFromOrToCalendarElement(visualizedTasks, false, true), activeComponent === TaskView.AGENDA_TASK && getFromOrToAgendaElement(visualizedTasks, false, true), activeComponent === TaskView.LIST_TASK && getFromOrToDatagridElement(visualizedTasks, false, true)] }) }), _jsx(TMTabPanel, { id: String(AssignedTab.All), label: _jsxs(_Fragment, { children: [_jsxs(TMTooltip, { content: SDKUI_Localizator.AllFemale, children: [_jsx("i", { className: 'dx-icon-fields' }), "\u00A0", SDKUI_Localizator.AllFemale, " ", (allTasksFilteredCount > 0) ? `(${allTasksFilteredCount})` : ''] }), newTaskCount > 0 && (_jsx(TMTooltip, { content: SDKUI_Localizator.NewAssignedActivitiesNumber + ": " + newTaskCount, children: _jsx(TMCountBadge, { children: newTaskCount }) }))] }), children: activeTabIndex === AssignedTab.All &&
+                                _jsxs(_Fragment, { children: [activeComponent === TaskView.CALENDAR_TASK && getFromOrToCalendarElement(visualizedTasks, true, true), activeComponent === TaskView.AGENDA_TASK && getFromOrToAgendaElement(visualizedTasks, true, true), activeComponent === TaskView.LIST_TASK && getFromOrToDatagridElement(visualizedTasks, true, true)] }) })] }) }), showTaskForm && _jsx(TMTaskForm, { id: currentTask?.id ?? -1, width: taskModalSizes(deviceType, formMode ?? FormModes.Create).width, height: taskModalSizes(deviceType, formMode ?? FormModes.Create).height, title: isContextualCreate ? SDKUI_Localizator.ContextualTask : SDKUI_Localizator.Widget_Activities, isModal: true, formMode: formMode ?? FormModes.Create, visualizedTasks: visualizedTasks, currentTask: currentTask, setCurrentTask: setCurrentTask, isContextualCreate: isContextualCreate, selectedRowKeys: selectedRowKeys, handleFocusedRowKeyChange: handleFocusedRowChange, taskContext: taskContext, usersList: usersList, onStatusChanged: () => { }, onClose: closeTaskFormCallback, onCancel: closeTaskFormCallback, showBackButton: false, onSaved: onSavedCallback, startDate: calendarStartDate, endDate: calendarEndDate, onOpenS4TViewerRequest: onOpenS4TViewerRequest, s4TViewerDialogComponent: s4TViewerDialogComponent, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGsWrapper, handleNavigateToDossiers: handleNavigateToDossiersWrapper }), _jsx("button", { style: {
                     position: 'absolute',
                     bottom: hasFilters ? '90px' : '18px',
                     right: '20px',

package/lib/components/features/wg/TMWGsCopyMoveForm.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { DcmtTypeDescriptor, WorkingGroupDescriptor } from "@topconsultnpm/sdk-ts";
 import { FileItem } from '../../base/TMFileManagerUtils';
 /** Context descriptor for copy/move operations using different engines */
@@ -24,7 +25,7 @@ interface TMWGsCopyMoveFormProps {
     fetchTreeFileSystemForWorkingGroup?: (workingGroupId: number | undefined) => Promise<void>;
     fetchArchivedDocumentsForWorkingGroup?: (workingGroupId: number | undefined) => Promise<void>;
 }
-declare const TMWGsCopyMoveForm: (props: TMWGsCopyMoveFormProps) => import("react/jsx-runtime").JSX.Element;
+declare const TMWGsCopyMoveForm: (props: TMWGsCopyMoveFormProps) => React.JSX.Element;
 export default TMWGsCopyMoveForm;
 interface StepItem {
     id: number | string;
@@ -36,4 +37,4 @@ interface TMStepNavigatorProps {
     currentStep: number;
     onStepChange: (stepIndex: number) => void;
 }
-export declare const TMStepNavigator: (props: TMStepNavigatorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TMStepNavigator: (props: TMStepNavigatorProps) => React.JSX.Element;

package/lib/components/features/wg/TMWGsCopyMoveForm.js

@@ -434,6 +434,6 @@ export const TMStepNavigator = (props) => {
     return (_jsx("div", { style: { display: 'flex', justifyContent: 'center' }, children: _jsx("div", { style: { display: 'flex', alignItems: 'center', backgroundColor: '#f9f9f9', padding: '6px 16px', borderRadius: '999px', boxShadow: '0 1px 4px rgba(0, 0, 0, 0.05)' }, children: steps.map((step, index) => {
                 const isPastStep = index < currentStep;
                 const isCurrent = currentStep === index;
-                return _jsxs("div", { style: { display: 'flex', alignItems: 'center' }, children: [_jsx(StepSpan, { "$isCurrent": isCurrent, "$isPast": isPastStep, onClick: isPastStep ? () => onStepChange(index) : undefined, children: _jsxs("div", { style: { display: 'flex', flexDirection: 'column', alignItems: 'center' }, children: [_jsx("span", { children: step.title }), step.subtitle && _jsxs("span", { style: { fontSize: '0.90em', fontStyle: "italic" }, children: ["\"", step.subtitle, "\""] })] }) }), index < steps.length - 1 && (_jsx("span", { style: { margin: '0 8px', color: '#ddd' }, children: _jsx("i", { className: 'dx-icon-greater' }) }))] }, step.id);
+                return _jsxs("div", { style: { display: 'flex', alignItems: 'center' }, children: [_jsx(StepSpan, { $isCurrent: isCurrent, $isPast: isPastStep, onClick: isPastStep ? () => onStepChange(index) : undefined, children: _jsxs("div", { style: { display: 'flex', flexDirection: 'column', alignItems: 'center' }, children: [_jsx("span", { children: step.title }), step.subtitle && _jsxs("span", { style: { fontSize: '0.90em', fontStyle: "italic" }, children: ["\"", step.subtitle, "\""] })] }) }), index < steps.length - 1 && (_jsx("span", { style: { margin: '0 8px', color: '#ddd' }, children: _jsx("i", { className: 'dx-icon-greater' }) }))] }, step.id);
             }) }) }));
 };