@topconsultnpm/sdkui-react 6.19.0-dev2.9 → 6.19.0-test2

package/lib/components/base/TMAccordionNew.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+export interface TMAccordionBadge {
+    badge: number;
+    tooltip?: string;
+}
+export interface TMAccordionGroup {
+    id: string;
+    title: string;
+    dataSource?: Array<any>;
+    color?: string;
+    icon?: React.ReactNode;
+    isExpanded?: boolean;
+    contextMenuItems?: Array<any> | ((item: any) => Array<any>);
+    onItemClick?: (item: any) => void;
+    onItemDoubleClick?: (item: any) => void;
+    renderItem?: (item: any, isSelected: boolean, isFocused: boolean, color: string) => React.ReactNode;
+    itemHeight?: number;
+    badges?: TMAccordionBadge[];
+    customComponent?: React.ReactNode;
+}
+export interface TMAccordionProps {
+    groups?: Array<TMAccordionGroup>;
+    localStorageKey?: string;
+    selectedItem?: any;
+    onSelectedItemChange?: (item: any) => void;
+}
+declare const TMAccordion: React.FC<TMAccordionProps>;
+export default TMAccordion;

package/lib/components/base/TMAccordionNew.js

@@ -0,0 +1,326 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useEffect, useCallback } from 'react';
+import styled from 'styled-components';
+import { ContextMenu, LoadIndicator } from 'devextreme-react';
+import { LocalStorageService } from '@topconsultnpm/sdk-ts';
+import TMTooltip from './TMTooltip';
+const Container = styled.div `
+    width: 100%;
+    height: 100%;
+    overflow-y: auto;
+    overflow-x: hidden;
+    padding: 5px;
+    
+    &::-webkit-scrollbar {
+        width: 8px;
+    }
+    
+    &::-webkit-scrollbar-track {
+        background: #f1f3f5;
+        border-radius: 4px;
+    }
+    
+    &::-webkit-scrollbar-thumb {
+        background: #adb5bd;
+        border-radius: 4px;
+        
+        &:hover {
+            background: #868e96;
+        }
+    }
+
+    &::before {
+        content: '';
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        z-index: -1;
+    }
+`;
+const AccordionItem = styled.div `
+    margin-bottom: 16px;
+    border-radius: 5px;
+    background: white;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+    overflow: hidden;
+    transition: box-shadow 0.3s ease;
+    
+    &:hover {
+        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
+    }
+`;
+const AccordionHeader = styled.div `
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 6px 12px;
+    background: ${props => `linear-gradient(135deg, ${props.$color}15 0%, ${props.$color}08 100%)`};
+    border-left: 4px solid ${props => props.$color};
+    cursor: pointer;
+    transition: all 0.3s ease;
+    
+    &:hover {
+        background: ${props => `linear-gradient(135deg, ${props.$color}25 0%, ${props.$color}15 100%)`};
+    }
+`;
+const AccordionTitle = styled.div `
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    flex: 1;
+`;
+const TitleText = styled.h3 `
+    margin: 0;
+    font-size: 14px;
+    font-weight: 600;
+    color: #212529;
+    display: flex;
+    align-items: center;
+    gap: 6px;
+`;
+const BadgeContainer = styled.div `
+    display: flex;
+    align-items: center;
+    gap: 6px;
+`;
+const Badge = styled.div `
+    min-width: 22px;
+    height: 22px;
+    padding: 0 8px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: ${props => props.$color};
+    color: white;
+    border-radius: 11px;
+    font-size: 11px;
+    font-weight: 700;
+    box-shadow: 0 2px 6px ${props => props.$color}40;
+`;
+const CustomComponentContainer = styled.div `
+    padding: 8px;
+`;
+const ErrorMessage = styled.div `
+    padding: 20px;
+    text-align: center;
+    color: #fa5252;
+    font-size: 14px;
+    font-weight: 500;
+`;
+const ToggleIcon = styled.div `
+    width: 24px;
+    height: 24px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: white;
+    border-radius: 6px;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    transform: ${props => props.$isOpen ? 'rotate(180deg)' : 'rotate(0deg)'};
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+`;
+const AccordionContent = styled.div `
+    max-height: ${props => props.$isOpen ? `${props.$maxHeight}px` : '0'};
+    overflow: hidden;
+    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+`;
+const ItemsList = styled.div `
+    padding: 4px;
+`;
+const ListItem = styled.div `
+    padding: 2px;
+    margin: 2px 0;
+    border-radius: 6px;
+    background: ${props => props.$isSelected ? `${props.$color}30` : 'transparent'};
+    border: none;
+    transition: background 0.2s ease;
+    cursor: pointer;
+    
+    &:hover {
+        background: ${props => props.$isSelected ? `${props.$color}40` : `${props.$color}08`};
+    }
+`;
+const LoadingContainer = styled.div `
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 200px;
+`;
+const DEFAULT_COLORS = ['#339af0', '#fa5252', '#40c057', '#f59f00', '#e64980', '#7950f2'];
+const TMAccordion = ({ groups, localStorageKey, selectedItem, onSelectedItemChange }) => {
+    const [openAccordions, setOpenAccordions] = useState({});
+    const [isInitialized, setIsInitialized] = useState(false);
+    const [anchorEl, setAnchorEl] = useState(null);
+    const [contextMenuItems, setContextMenuItems] = useState([]);
+    const [focusedItem, setFocusedItem] = useState(undefined);
+    const [headerContextGroupId, setHeaderContextGroupId] = useState(null);
+    const [headerContextVisible, setHeaderContextVisible] = useState(false);
+    const [headerContextPosition, setHeaderContextPosition] = useState(null);
+    useEffect(() => {
+        const initialState = {};
+        if (!groups || groups.length === 0) {
+            setIsInitialized(true);
+            return;
+        }
+        if (localStorageKey) {
+            const savedState = LocalStorageService.getItem(localStorageKey);
+            if (savedState && savedState.length === groups.length) {
+                groups.forEach((group, index) => {
+                    initialState[group.id] = savedState[index] === '1';
+                });
+            }
+            else {
+                groups.forEach(group => {
+                    initialState[group.id] = group.isExpanded !== false;
+                });
+            }
+        }
+        else {
+            groups.forEach(group => {
+                initialState[group.id] = group.isExpanded !== false;
+            });
+        }
+        setOpenAccordions(initialState);
+        setIsInitialized(true);
+    }, []);
+    useEffect(() => {
+        if (!isInitialized || !groups)
+            return;
+        setOpenAccordions(prev => {
+            const newState = { ...prev };
+            groups.forEach(group => {
+                if (!(group.id in newState)) {
+                    newState[group.id] = group.isExpanded !== false;
+                }
+            });
+            Object.keys(newState).forEach(groupId => {
+                if (!groups.some(g => g.id === groupId)) { //nosonar
+                    delete newState[groupId];
+                }
+            });
+            return newState;
+        });
+    }, [groups, isInitialized]);
+    useEffect(() => {
+        if (!isInitialized || !groups)
+            return;
+        if (localStorageKey && Object.keys(openAccordions).length === groups.length) {
+            const stateString = groups.map(group => openAccordions[group.id] ? '1' : '0').join('');
+            LocalStorageService.setItem(localStorageKey, stateString);
+        }
+    }, [openAccordions, groups, localStorageKey, isInitialized]);
+    const toggleAccordion = (groupId) => {
+        setOpenAccordions(prev => ({ ...prev, [groupId]: !prev[groupId] }));
+    };
+    const handleItemClick = (item, group) => {
+        if (onSelectedItemChange) {
+            onSelectedItemChange(item);
+        }
+        if (group.onItemClick) {
+            group.onItemClick(item);
+        }
+    };
+    const handleItemDoubleClick = (item, group) => {
+        if (group.onItemDoubleClick) {
+            group.onItemDoubleClick(item);
+        }
+    };
+    const handleContextMenu = (event, item, group) => {
+        event.preventDefault();
+        if (!group.contextMenuItems) {
+            return;
+        }
+        const menuItems = typeof group.contextMenuItems === 'function'
+            ? group.contextMenuItems(item)
+            : group.contextMenuItems;
+        if (menuItems.length === 0) {
+            return;
+        }
+        setAnchorEl(event.currentTarget);
+        setContextMenuItems(menuItems);
+    };
+    const closeContextMenu = useCallback(() => {
+        setAnchorEl(null);
+    }, []);
+    const handleHeaderContextMenu = (event, groupId) => {
+        event.preventDefault();
+        event.stopPropagation();
+        setHeaderContextPosition({ x: event.clientX, y: event.clientY });
+        setHeaderContextGroupId(groupId);
+        setHeaderContextVisible(true);
+    };
+    const handleHeaderClick = (event, groupId) => {
+        if (event.button !== 0)
+            return;
+        toggleAccordion(groupId);
+    };
+    const closeHeaderContextMenu = useCallback(() => {
+        setHeaderContextVisible(false);
+        setHeaderContextPosition(null);
+        setHeaderContextGroupId(null);
+    }, []);
+    const headerContextMenuItems = headerContextGroupId ? [
+        {
+            text: openAccordions[headerContextGroupId] ? 'Collassa' : 'Espandi',
+            onClick: () => {
+                toggleAccordion(headerContextGroupId);
+                closeHeaderContextMenu();
+            }
+        }
+    ] : [];
+    const getGroupColor = (group, index) => {
+        return group.color || DEFAULT_COLORS[index % DEFAULT_COLORS.length];
+    };
+    const renderBadges = (group, color) => {
+        if (group.badges && group.badges.length > 0) {
+            return (_jsx(BadgeContainer, { children: group.badges.map((badgeData, idx) => {
+                    const badgeKey = `${group.id}-badge-${badgeData.badge}-${idx}`;
+                    const badge = _jsx(Badge, { "$color": color, children: badgeData.badge });
+                    if (badgeData.tooltip) {
+                        return (_jsx(TMTooltip, { content: badgeData.tooltip, children: badge }, badgeKey));
+                    }
+                    return _jsx("span", { children: badge }, badgeKey);
+                }) }));
+        }
+        if (group.dataSource && group.dataSource.length > 0) {
+            return _jsx(Badge, { "$color": color, children: group.dataSource.length });
+        }
+        return null;
+    };
+    const renderAccordion = (group, index) => {
+        const color = getGroupColor(group, index);
+        const isOpen = openAccordions[group.id] ?? true;
+        if (group.customComponent) {
+            return (_jsxs(AccordionItem, { children: [_jsxs(AccordionHeader, { "$color": color, "$isOpen": isOpen, onClick: (e) => handleHeaderClick(e, group.id), onContextMenu: (e) => handleHeaderContextMenu(e, group.id), children: [_jsxs(AccordionTitle, { children: [group.icon, _jsx(TitleText, { children: group.title })] }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '10px' }, children: [renderBadges(group, color), _jsx(ToggleIcon, { "$isOpen": isOpen, children: _jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M4 6L8 10L12 6", stroke: "#495057", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] })] }), isOpen && (_jsx(CustomComponentContainer, { children: group.customComponent }))] }, group.id));
+        }
+        if (!group.dataSource || group.dataSource.length === 0)
+            return null;
+        if (!group.renderItem) {
+            return (_jsxs(AccordionItem, { children: [_jsxs(AccordionHeader, { "$color": color, "$isOpen": isOpen, onClick: (e) => handleHeaderClick(e, group.id), onContextMenu: (e) => handleHeaderContextMenu(e, group.id), children: [_jsxs(AccordionTitle, { children: [group.icon, _jsx(TitleText, { children: group.title })] }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '10px' }, children: [renderBadges(group, color), _jsx(ToggleIcon, { "$isOpen": isOpen, children: _jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M4 6L8 10L12 6", stroke: "#495057", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] })] }), _jsx(AccordionContent, { "$isOpen": isOpen, "$maxHeight": 100, children: _jsxs(ErrorMessage, { children: ["\u26A0\uFE0F renderItem function is required for \"", group.title, "\" group"] }) })] }, group.id));
+        }
+        const itemHeight = group.itemHeight || 80;
+        const maxHeight = group.dataSource.length * itemHeight + 20;
+        return (_jsxs(AccordionItem, { children: [_jsxs(AccordionHeader, { "$color": color, "$isOpen": isOpen, onClick: (e) => handleHeaderClick(e, group.id), onContextMenu: (e) => handleHeaderContextMenu(e, group.id), children: [_jsxs(AccordionTitle, { children: [group.icon, _jsx(TitleText, { children: group.title })] }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '10px' }, children: [renderBadges(group, color), _jsx(ToggleIcon, { "$isOpen": isOpen, children: _jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: _jsx("path", { d: "M4 6L8 10L12 6", stroke: "#495057", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] })] }), _jsx(AccordionContent, { "$isOpen": isOpen, "$maxHeight": maxHeight, children: _jsx(ItemsList, { children: group.dataSource.map((item, itemIndex) => {
+                            const isSelected = selectedItem === item;
+                            const isFocused = focusedItem === item;
+                            return (_jsx(ListItem, { "$isSelected": isSelected, "$color": color, onClick: () => handleItemClick(item, group), onDoubleClick: () => handleItemDoubleClick(item, group), onMouseEnter: () => setFocusedItem(item), onMouseLeave: () => setFocusedItem(undefined), onContextMenu: (e) => handleContextMenu(e, item, group), children: group.renderItem(item, isSelected, isFocused, color) }, itemIndex * 2));
+                        }) }) })] }, group.id));
+    };
+    if (!isInitialized) {
+        return (_jsx(LoadingContainer, { children: _jsx(LoadIndicator, { height: 40, width: 40 }) }));
+    }
+    if (!groups || groups.length === 0) {
+        return (_jsx(Container, { children: _jsx(ErrorMessage, { children: "\u26A0\uFE0F No accordion groups defined" }) }));
+    }
+    const handleContainerContextMenu = (event) => {
+        if (event.target === event.currentTarget) {
+            event.preventDefault();
+        }
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(Container, { onContextMenu: handleContainerContextMenu, children: groups.map((group, index) => renderAccordion(group, index)) }), anchorEl && contextMenuItems.length > 0 && (_jsx(ContextMenu, { dataSource: contextMenuItems, target: anchorEl, onHiding: closeContextMenu })), headerContextPosition && headerContextMenuItems.length > 0 && (_jsx(ContextMenu, { dataSource: headerContextMenuItems, visible: headerContextVisible, position: { my: 'left top', at: 'left top', offset: `${headerContextPosition.x} ${headerContextPosition.y}` }, onHiding: closeHeaderContextMenu }))] }));
+};
+export default TMAccordion;

package/lib/components/base/TMButton.d.ts

@@ -16,6 +16,7 @@ export interface ITMButton extends ITMEditorBase {
     padding?: string;
     showTooltip?: boolean;
     onClick?: VoidFunction;
+    onMouseDown?: (e: any) => any;
 }
 declare const TMButton: React.ForwardRefExoticComponent<ITMButton & React.RefAttributes<HTMLButtonElement>>;
 export default TMButton;

package/lib/components/base/TMButton.js

@@ -145,23 +145,23 @@ const StyledAdvancedButtonText = styled.div `
     padding: 5px;
 `;
 const TMButton = forwardRef((props, ref) => {
-    const { width, height, keyGesture, btnStyle = 'normal', advancedColor, advancedType = 'primary', color = 'primary', fontSize = FontSize.defaultFontSize, disabled = false, showTooltip = true, caption, icon, description, padding, elementStyle, onClick = () => { } } = props;
+    const { width, height, keyGesture, btnStyle = 'normal', advancedColor, advancedType = 'primary', color = 'primary', fontSize = FontSize.defaultFontSize, disabled = false, showTooltip = true, caption, icon, description, padding, elementStyle, onClick = () => { }, onMouseDown = () => { } } = props;
     const [isHovered, setIsHovered] = useState(false);
     const renderedButton = () => {
         if (btnStyle === 'normal') {
-            return (_jsx(StyledNormalButton, { ref: ref, width: width, height: height, color: color, caption: caption, disabled: disabled, fontSize: fontSize, onClick: onClick, children: caption }));
+            return (_jsx(StyledNormalButton, { ref: ref, width: width, height: height, color: color, caption: caption, disabled: disabled, fontSize: fontSize, onClick: onClick, onMouseDown: (e) => !disabled && onMouseDown?.(e), children: caption }));
         }
         else if (btnStyle === 'toolbar') {
-            return (_jsx(StyledToolbarButton, { ref: ref, color: color, caption: caption, disabled: disabled, fontSize: fontSize, onClick: onClick, children: icon }));
+            return (_jsx(StyledToolbarButton, { ref: ref, color: color, caption: caption, disabled: disabled, fontSize: fontSize, onClick: onClick, onMouseDown: (e) => !disabled && onMouseDown?.(e), children: icon }));
         }
         else if (btnStyle === 'icon') {
-            return (_jsx(StyledIconButton, { ref: ref, color: color, caption: caption, disabled: disabled, fontSize: fontSize, padding: padding, onClick: onClick, children: icon }));
+            return (_jsx(StyledIconButton, { ref: ref, color: color, caption: caption, disabled: disabled, fontSize: fontSize, padding: padding, onClick: onClick, onMouseDown: (e) => !disabled && onMouseDown?.(e), children: icon }));
         }
         else if (btnStyle === 'advanced') {
-            return (_jsxs(StyledAdvancedButton, { ref: ref, "$width": width ?? '90px', "$height": height ?? '30px', onMouseOver: () => !disabled && setIsHovered(true), onMouseOut: () => setIsHovered(false), "$isDisabled": disabled, "$isPrimaryOutline": advancedType === 'primary' && (advancedColor === 'primaryOutline' || color === 'primaryOutline'), onClick: () => !disabled && onClick?.(), children: [_jsx(StyledAdvancedButtonIcon, { "$color": advancedColor, "$isVisible": isHovered, "$isDisabled": disabled, "$type": advancedType, children: icon }), _jsx(StyledAdvancedButtonText, { "$color": advancedColor, "$isDisabled": disabled, "$type": advancedType, children: caption })] }));
+            return (_jsxs(StyledAdvancedButton, { ref: ref, "$width": width ?? '90px', "$height": height ?? '30px', onMouseOver: () => !disabled && setIsHovered(true), onMouseOut: () => setIsHovered(false), "$isDisabled": disabled, "$isPrimaryOutline": advancedType === 'primary' && (advancedColor === 'primaryOutline' || color === 'primaryOutline'), onClick: () => !disabled && onClick?.(), onMouseDown: (e) => !disabled && onMouseDown?.(e), children: [_jsx(StyledAdvancedButtonIcon, { "$color": advancedColor, "$isVisible": isHovered, "$isDisabled": disabled, "$type": advancedType, children: icon }), _jsx(StyledAdvancedButtonText, { "$color": advancedColor, "$isDisabled": disabled, "$type": advancedType, children: caption })] }));
         }
         else {
-            return (_jsx(StyledTextButton, { ref: ref, color: color, caption: caption, disabled: disabled, fontSize: fontSize, onClick: onClick, children: caption }));
+            return (_jsx(StyledTextButton, { ref: ref, color: color, caption: caption, disabled: disabled, fontSize: fontSize, onClick: onClick, onMouseDown: (e) => !disabled && onMouseDown?.(e), children: caption }));
         }
     };
     const renderTooltip = () => {

package/lib/components/base/TMCustomButton.d.ts

@@ -7,5 +7,5 @@ type TMCustomButtonProps = {
     selectedItems?: Array<any>;
     onClose?: () => void;
 };
-declare const TMCustomButton: (props: TMCustomButtonProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const TMCustomButton: (props: TMCustomButtonProps) => false | import("react/jsx-runtime").JSX.Element;
 export default TMCustomButton;

package/lib/components/base/TMCustomButton.js

@@ -1,13 +1,14 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { SDK_Globals } from '@topconsultnpm/sdk-ts';
-import { useEffect, useRef, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useRef, useState, useMemo } from 'react';
 import TMModal from './TMModal';
 import styled from 'styled-components';
-import { processButtonAttributes } from '../../helper/dcmtsHelper';
+import { SDKUI_Localizator, TMLayoutWaitingContainer } from '../..';
+import { getButtonAttributes, getSelectedItem } from '../../helper/dcmtsHelper';
 const IframeContainer = styled.div `
   display: flex;
   height: 100%;
   flex-direction: column;
+  padding-left: 15px;
 `;
 const StyledIframe = styled.iframe `
   border: none;
@@ -17,47 +18,101 @@ const TMCustomButton = (props) => {
     const { button, isModal = true, formData, selectedItems, onClose } = props;
     const { appName: scriptUrl, arguments: args } = button;
     const iframeRef = useRef(null);
-    const attributes = processButtonAttributes(args, formData);
+    const attributes = useMemo(() => getButtonAttributes(args, formData, selectedItems), [args, formData, selectedItems]);
+    const RunOnce = button.mode === "RunOnce";
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState(false);
-    const getTargetOrigin = (url) => {
-        if (!url)
+    const selectedItemsCount = selectedItems?.length || 0;
+    // Stati per il wait panel
+    const [showWaitPanel, setShowWaitPanel] = useState(selectedItemsCount > 0 && !RunOnce);
+    const [waitPanelText, setWaitPanelText] = useState(SDKUI_Localizator.CustomButtonActions.replaceParams(1, selectedItemsCount));
+    const [waitPanelValue, setWaitPanelValue] = useState(0);
+    const [waitPanelMaxValue, setWaitPanelMaxValue] = useState(selectedItemsCount);
+    const [abortController, setAbortController] = useState(undefined);
+    const targetOrigin = useMemo(() => {
+        if (!scriptUrl)
             return '*';
         try {
-            const urlObj = new URL(url);
+            const urlObj = new URL(scriptUrl);
             return urlObj.origin;
         }
         catch {
             return '*';
         }
-    };
-    useEffect(() => {
-        if (iframeRef.current?.contentWindow) {
-            const mergedAttributes = { ...attributes, selectedItems: selectedItems };
-            iframeRef.current.contentWindow.postMessage({
-                "options": mergedAttributes,
-                "selectedItems": selectedItems,
-                "session": SDK_Globals.tmSession
-            }, getTargetOrigin(scriptUrl));
-        }
-        clearTimeout(timeoutIframe);
-    }, [loading, error, scriptUrl, attributes]);
+    }, [scriptUrl]);
     const handleLoad = () => setLoading(false);
     const handleError = () => {
         setLoading(false);
         setError(true);
     };
-    // Timeout di sicurezza nel caso l'evento 'error' non venga chiamato
-    const timeoutIframe = setTimeout(() => {
-        if (loading)
-            handleError();
-    }, 5000); // 5 secondi
+    const executeSequentially = async (controller) => {
+        if (!selectedItems)
+            return;
+        for (const [index, item] of selectedItems.entries()) {
+            if (controller.signal.aborted)
+                break;
+            setWaitPanelText(SDKUI_Localizator.CustomButtonActions.replaceParams(index + 1, selectedItemsCount));
+            setWaitPanelValue(index);
+            // Attendi che l'iframe sia pronto e invia il messaggio
+            await new Promise((resolve) => {
+                const checkIframe = setInterval(() => {
+                    if (iframeRef.current?.contentWindow) {
+                        clearInterval(checkIframe);
+                        //devo convertire item in formData
+                        const processedItem = getSelectedItem(args, formData, item);
+                        postMessageIframe(processedItem);
+                        // Attendi prima di passare al prossimo
+                        setTimeout(() => {
+                            setWaitPanelValue(index + 1);
+                            resolve();
+                        }, 500);
+                    }
+                }, 100);
+            });
+        }
+        setShowWaitPanel(false);
+        onClose?.();
+    };
+    const postMessageIframe = (data) => {
+        console.log("TMCustomButton - postMessageIframe - data:", data);
+        if (iframeRef.current?.contentWindow) {
+            iframeRef.current.contentWindow.postMessage({ "options": data }, targetOrigin);
+        }
+    };
+    useEffect(() => {
+        if (loading || error)
+            return;
+        //if(error) clearTimeout(timeoutIframe);
+        if (!RunOnce && selectedItemsCount > 0) {
+            // esegui per ogni item selezionato
+            const controller = new AbortController();
+            controller.signal.addEventListener('abort', () => {
+                setShowWaitPanel(false);
+                onClose?.();
+            });
+            setAbortController(controller);
+            setWaitPanelMaxValue(selectedItemsCount);
+            executeSequentially(controller);
+        }
+        else {
+            // Modalità RunOnce: invia dati all'iframe quando è caricato
+            postMessageIframe(attributes);
+            if (!RunOnce) {
+                //chiudo l'iframe dopo 2 secondi
+                setTimeout(() => {
+                    onClose?.();
+                }, 2000);
+            }
+            //clearTimeout(timeoutIframe);
+        }
+    }, [loading, error, RunOnce]);
     useEffect(() => {
-        if (!isModal && scriptUrl) {
+        if (!isModal && RunOnce && scriptUrl) {
             window.open(scriptUrl, '_blank');
             onClose?.();
         }
-    }, [isModal, scriptUrl, onClose]);
-    return isModal ? (_jsx(TMModal, { title: button.title, width: '60%', height: '60%', resizable: true, onClose: onClose, children: _jsxs(IframeContainer, { children: [error && _jsx("div", { children: "Si \u00E8 verificato un errore nel caricamento del contenuto." }), !error && _jsx(StyledIframe, { ref: iframeRef, loading: 'lazy', onLoad: handleLoad, onError: handleError, src: scriptUrl })] }) })) : null;
+    }, []);
+    const iframeContent = (_jsxs(IframeContainer, { style: !RunOnce ? { visibility: 'hidden' } : {}, children: [error && _jsx("div", { children: "Si \u00E8 verificato un errore nel caricamento del contenuto." }), !error && _jsx(StyledIframe, { ref: iframeRef, loading: 'lazy', onLoad: handleLoad, onError: handleError, src: scriptUrl })] }));
+    return isModal && RunOnce ? (_jsx(TMModal, { title: button.title, width: '60%', height: '70%', resizable: true, expandable: true, onClose: onClose, children: iframeContent })) : !RunOnce && (_jsxs(_Fragment, { children: [_jsx(TMLayoutWaitingContainer, { showWaitPanel: showWaitPanel, waitPanelTitle: SDKUI_Localizator.CustomButtonAction, showWaitPanelPrimary: true, waitPanelTextPrimary: waitPanelText, waitPanelValuePrimary: waitPanelValue, waitPanelMaxValuePrimary: waitPanelMaxValue, showWaitPanelSecondary: false, isCancelable: true, abortController: abortController, children: undefined }), iframeContent] }));
 };
 export default TMCustomButton;

package/lib/components/base/TMDataGridExportForm.js

@@ -64,7 +64,7 @@ const TMDataGridExportForm = (props) => {
             // Retrieve columns from the search result, or use an empty array if not available
             const columns = searchResult?.dtdResult?.columns ?? [];
             // If exportDescriptionsForDataLists is true, build a map of values to labels for the columns; otherwise use an empty Map
-            const { valueToNameMap, captions } = exportDescriptionsForDataLists ? await buildValueToLabelMapFromDataColumns(columns) : { valueToNameMap: new Map(), captions: new Set() };
+            const valueToNameMap = exportDescriptionsForDataLists ? await buildValueToLabelMapFromDataColumns(columns) : new Map();
             // Create a Set from selectedRowKeys for efficient lookup
             const selectedSet = new Set(selectedRowKeys);
             // If exporting only selected rows, filter the dataSource accordingly; otherwise use the full dataSource
@@ -82,8 +82,14 @@ const TMDataGridExportForm = (props) => {
             const getValue = (col, value) => {
                 // Replace raw value with corresponding label from the map if applicable
                 let result = value;
-                if (exportDescriptionsForDataLists && col.caption && captions.has(col.caption.toString())) {
-                    result = valueToNameMap.get(value) ?? value;
+                if (exportDescriptionsForDataLists && col.dataField && valueToNameMap.size > 0) {
+                    const mapForField = valueToNameMap.get(col.dataField);
+                    if (mapForField) {
+                        result = mapForField.get(value) ?? value;
+                    }
+                    else {
+                        result = value;
+                    }
                 }
                 // If the column is a datetime type, attempt to format it as a locale date string
                 if (col.dataType === 'datetime' && result) {

package/lib/components/base/TMFileManager.js

@@ -13,6 +13,7 @@ import TMButton from "./TMButton";
 import { TMSearchBar } from "../sidebar/TMHeader";
 import TMFileManagerThumbnailsView from "./TMFileManagerThumbnailsView";
 import TMFileManagerDataGridView from "./TMFileManagerDataGridView";
+import { UserListCacheService } from "@topconsultnpm/sdk-ts";
 const TMFileManager = (props) => {
     // Destructure props
     const { 
@@ -44,6 +45,14 @@ const TMFileManager = (props) => {
     const [droppedFiles, setDroppedFiles] = useState([]);
     // State to track whether a file drag operation is in progress
     const [isDragging, setIsDragging] = useState(false);
+    const [allUsers, setAllUsers] = useState([]);
+    useEffect(() => {
+        const fetchAllUsers = async () => {
+            const users = await UserListCacheService.GetAllAsync();
+            setAllUsers(users ?? []);
+        };
+        fetchAllUsers();
+    }, []);
     // useEffect runs whenever `treeFs` changes
     useEffect(() => {
         // Initialize an empty array to hold tree view directory data
@@ -198,7 +207,7 @@ const TMFileManager = (props) => {
                             width: "100%",
                             height: "100%",
                             ...(isMobile && { display: openDraftList ? 'block' : 'none', transition: "opacity 0.3s ease-in-out" }),
-                        }, children: [_jsxs(Toolbar, { style: { backgroundColor: '#f4f4f4', height: "40px", paddingLeft: "5px", paddingRight: '5px' }, children: [!showPanel && _jsx(ToolbarItem, { location: "before", children: _jsx(TMButton, { caption: isLeftPanelCollapsed ? SDKUI_Localizator.ShowLeftPanel : SDKUI_Localizator.HideLeftPanel, btnStyle: 'toolbar', color: 'primaryOutline', icon: isLeftPanelCollapsed ? _jsx(IconHide, {}) : _jsx(IconShow, {}), onClick: () => setIsLeftPanelCollapsed(prev => !prev) }) }), _jsx(ToolbarItem, { location: "before", children: _jsx(TMButton, { caption: viewMode === 'details' ? SDKUI_Localizator.PreviewView : SDKUI_Localizator.DetailsView, btnStyle: 'toolbar', color: 'primaryOutline', icon: viewMode === 'details' ? _jsx(IconDashboard, {}) : _jsx(IconList, {}), onClick: toggleViewMode }) }), _jsx(ToolbarItem, { location: "before", children: _jsx(TMSearchBar, { marginLeft: '0px', maxWidth: '200px', searchValue: searchText, onSearchValueChanged: (e) => handleSearchChange(e) }) })] }), _jsxs("div", { onDrop: handleDrop, onDragOver: handleDragOver, onDragLeave: handleDragLeave, style: {
+                        }, children: [_jsxs(Toolbar, { style: { backgroundColor: '#f4f4f4', height: "40px", paddingLeft: "5px", paddingRight: '5px' }, children: [!showPanel && _jsx(ToolbarItem, { location: "before", children: _jsx(TMButton, { caption: isLeftPanelCollapsed ? SDKUI_Localizator.ShowLeftPanel : SDKUI_Localizator.HideLeftPanel, btnStyle: 'toolbar', color: 'primaryOutline', icon: isLeftPanelCollapsed ? _jsx(IconHide, {}) : _jsx(IconShow, {}), onClick: () => setIsLeftPanelCollapsed(prev => !prev) }) }), _jsx(ToolbarItem, { location: "before", children: _jsx(TMButton, { caption: viewMode === 'details' ? SDKUI_Localizator.CompactView : SDKUI_Localizator.DetailsView, btnStyle: 'toolbar', color: 'primaryOutline', icon: viewMode === 'details' ? _jsx(IconDashboard, {}) : _jsx(IconList, {}), onClick: toggleViewMode }) }), _jsx(ToolbarItem, { location: "before", children: _jsx(TMSearchBar, { marginLeft: '0px', maxWidth: '200px', searchValue: searchText, onSearchValueChanged: (e) => handleSearchChange(e) }) })] }), _jsxs("div", { onDrop: handleDrop, onDragOver: handleDragOver, onDragLeave: handleDragLeave, style: {
                                     width: "100%",
                                     height: "calc(100% - 40px)",
                                     position: "relative",
@@ -219,6 +228,6 @@ const TMFileManager = (props) => {
                                             pointerEvents: "none",
                                             backdropFilter: "blur(3px)",
                                             textShadow: "0 2px 4px rgba(0,0,0,0.5)"
-                                        }, children: SDKUI_Localizator.DropFileToShare }), viewMode === 'thumbnails' && _jsx(TMFileManagerThumbnailsView, { items: filteredFileItems ?? [], focusedFile: focusedFile, handleFocusedFile: handleFocusedFile, selectedFiles: selectedFiles, handleSelectedFiles: handleSelectedFiles, fileContextMenuItems: fileContextMenuItems, searchText: searchText, userID: userID, draftThumbViewAnchor: draftThumbViewAnchor, setDraftThumbViewAnchor: setDraftThumbViewAnchor, onDoubleClickHandler: onDoubleClickHandler }), viewMode === 'details' && _jsx(TMFileManagerDataGridView, { items: filteredFileItems ?? [], focusedFile: focusedFile, handleFocusedFile: handleFocusedFile, selectedFiles: selectedFiles, handleSelectedFiles: handleSelectedFiles, fileContextMenuItems: fileContextMenuItems, searchText: searchText, userID: userID, onDoubleClickHandler: onDoubleClickHandler })] })] })] }) }) });
+                                        }, children: SDKUI_Localizator.DropFileToShare }), viewMode === 'thumbnails' && _jsx(TMFileManagerThumbnailsView, { items: filteredFileItems ?? [], allUsers: allUsers, focusedFile: focusedFile, handleFocusedFile: handleFocusedFile, selectedFiles: selectedFiles, handleSelectedFiles: handleSelectedFiles, fileContextMenuItems: fileContextMenuItems, searchText: searchText, userID: userID, draftThumbViewAnchor: draftThumbViewAnchor, setDraftThumbViewAnchor: setDraftThumbViewAnchor, onDoubleClickHandler: onDoubleClickHandler }), viewMode === 'details' && _jsx(TMFileManagerDataGridView, { items: filteredFileItems ?? [], allUsers: allUsers, focusedFile: focusedFile, handleFocusedFile: handleFocusedFile, selectedFiles: selectedFiles, handleSelectedFiles: handleSelectedFiles, fileContextMenuItems: fileContextMenuItems, searchText: searchText, userID: userID, onDoubleClickHandler: onDoubleClickHandler })] })] })] }) }) });
 };
 export default TMFileManager;

package/lib/components/base/TMFileManagerDataGridView.d.ts

@@ -1,6 +1,8 @@
 import { FileItem, TMFileManagerContextMenuItem } from "./TMFileManagerUtils";
+import { UserDescriptor } from "@topconsultnpm/sdk-ts";
 interface TMFileManagerDataGridViewProps {
     items: Array<FileItem>;
+    allUsers: Array<UserDescriptor>;
     focusedFile: FileItem | undefined;
     handleFocusedFile: (fileItem: FileItem | undefined) => void;
     selectedFiles: Array<FileItem>;