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

package/lib/components/base/TMTreeView.js

@@ -9,23 +9,28 @@ const TMTreeView = ({ dataSource = [], focusedItem, selectedItems = [], allowMul
             if (!focusedItem)
                 return;
             let newFocusedItem = null;
+            let handled = false;
             switch (event.key) {
                 case 'ArrowDown':
                     newFocusedItem = findNextItem(dataSource, focusedItem);
+                    handled = true;
                     break;
                 case 'ArrowUp':
                     newFocusedItem = findPreviousItem(dataSource, focusedItem);
+                    handled = true;
                     break;
                 case '+':
                     if (!focusedItem.expanded) {
                         handleNodeToggle(focusedItem.key, false);
                         newFocusedItem = { ...focusedItem, expanded: true };
+                        handled = true;
                     }
                     break;
                 case '-':
                     if (focusedItem.expanded) {
                         handleNodeToggle(focusedItem.key, false);
                         newFocusedItem = { ...focusedItem, expanded: false };
+                        handled = true;
                     }
                     break;
                 // case ' ':
@@ -40,12 +45,17 @@ const TMTreeView = ({ dataSource = [], focusedItem, selectedItems = [], allowMul
                 default:
                     break;
             }
+            if (handled) {
+                event.preventDefault();
+                event.stopPropagation();
+            }
             if (newFocusedItem)
                 onFocusedItemChanged?.(newFocusedItem);
         };
-        window.addEventListener('keydown', handleKeyDown);
+        // Usa capture: true per intercettare l'evento PRIMA che DevExtreme Popup lo gestisca
+        window.addEventListener('keydown', handleKeyDown, true);
         return () => {
-            window.removeEventListener('keydown', handleKeyDown);
+            window.removeEventListener('keydown', handleKeyDown, true);
         };
     }, [focusedItem, dataSource, onFocusedItemChanged]);
     const findNextItem = (nodes, currentItem) => {
@@ -128,22 +138,19 @@ const TMTreeView = ({ dataSource = [], focusedItem, selectedItems = [], allowMul
         }
         if (delayFocus) {
             // Logica per il ritardo del focus (es. click singolo su icona desktop, gestito dal padre)
-            if (clickTimeoutRef.current) {
-                // Questo è il secondo click di un potenziale doppio click.
-                // Annulla l'azione di focus dal click singolo precedente.
-                clearTimeout(clickTimeoutRef.current);
-                clickTimeoutRef.current = null;
-                lastClickedNodeKeyRef.current = undefined;
-                return; // Non attivare onFocusedItemChanged per il doppio click
+            // Il focus viene ritardato per permettere al doppio click di registrarsi sull'icona,
+            // ma il focus avviene comunque (sia con click singolo che doppio)
+            if (!clickTimeoutRef.current) {
+                // Primo click: imposta il timer per il focus
+                lastClickedNodeKeyRef.current = node.key;
+                clickTimeoutRef.current = setTimeout(() => {
+                    onFocusedItemChanged?.(node);
+                    clickTimeoutRef.current = null;
+                    lastClickedNodeKeyRef.current = undefined;
+                }, 200);
             }
-            // Primo click di un potenziale doppio click o un click singolo che necessita di ritardo
-            lastClickedNodeKeyRef.current = node.key;
-            clickTimeoutRef.current = setTimeout(() => {
-                // Se il timer scade, significa che è stato solo un click singolo.
-                onFocusedItemChanged?.(node);
-                clickTimeoutRef.current = null;
-                lastClickedNodeKeyRef.current = undefined;
-            }, 200);
+            // Se c'è già un timer attivo (secondo click di doppio click), non fare nulla
+            // Il focus avverrà comunque quando scade il timer del primo click
         }
         else {
             // Logica per il focus immediato (per tutti gli altri click, o se shouldDelayFocusOnEvent è false)

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

@@ -1,8 +1,9 @@
+import React from 'react';
 interface TMUserAvatarProps {
     displayName: string;
     nameForColorCalculation: string;
     tooltipName?: string;
     returnType?: 'jsx' | 'svg';
 }
-declare const TMUserAvatar: (props: TMUserAvatarProps) => string | import("react/jsx-runtime").JSX.Element;
+declare const TMUserAvatar: (props: TMUserAvatarProps) => string | React.JSX.Element;
 export default TMUserAvatar;

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

@@ -1,5 +1,6 @@
+import React from 'react';
 import { ValidationItem } from '@topconsultnpm/sdk-ts';
 declare const TMVilViewer: ({ vil }: {
     vil?: ValidationItem[];
-}) => import("react/jsx-runtime").JSX.Element | null;
+}) => React.JSX.Element | null;
 export default TMVilViewer;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import { ITMLayoutContainerProps } from './TMLayout';
 interface ITMWaitPanelProps {
     title?: string;
@@ -12,8 +13,9 @@ interface ITMWaitPanelProps {
     isCancelable?: boolean;
     abortController?: AbortController;
     onAbortClick?: (abortController: AbortController | undefined) => void;
+    useHighZIndex?: boolean;
 }
-export declare const TMWaitPanel: (props: ITMWaitPanelProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TMWaitPanel: (props: ITMWaitPanelProps) => React.JSX.Element;
 interface ITMLayoutWaitingContainerProps extends ITMLayoutContainerProps {
     showWaitPanel?: boolean;
     waitPanelTitle?: string;
@@ -27,6 +29,7 @@ interface ITMLayoutWaitingContainerProps extends ITMLayoutContainerProps {
     waitPanelMaxValueSecondary?: number;
     isCancelable?: boolean;
     abortController?: AbortController;
+    usePortal?: boolean;
 }
-export declare const TMLayoutWaitingContainer: ({ showWaitPanel, showWaitPanelPrimary, showWaitPanelSecondary, waitPanelTitle, waitPanelTextSecondary, waitPanelValueSecondary, waitPanelMaxValueSecondary, waitPanelTextPrimary, waitPanelValuePrimary, waitPanelMaxValuePrimary, isCancelable, abortController, gap, onClick, justifyContent, alignItems, children, direction }: ITMLayoutWaitingContainerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TMLayoutWaitingContainer: ({ showWaitPanel, showWaitPanelPrimary, showWaitPanelSecondary, waitPanelTitle, waitPanelTextSecondary, waitPanelValueSecondary, waitPanelMaxValueSecondary, waitPanelTextPrimary, waitPanelValuePrimary, waitPanelMaxValuePrimary, isCancelable, abortController, usePortal, gap, onClick, justifyContent, alignItems, children, direction }: ITMLayoutWaitingContainerProps) => React.JSX.Element;
 export {};

package/lib/components/base/TMWaitPanel.js

@@ -1,4 +1,5 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { createPortal } from 'react-dom';
 import styled from 'styled-components';
 import TMLayoutContainer from './TMLayout';
 import { SDKUI_Localizator } from '../../helper';
@@ -8,7 +9,7 @@ const StyledWaitPanelOverlay = styled.div `
     position: fixed;
     top: 0;
     left: 0;
-    z-index: 1501;
+    z-index: ${props => props.$useHighZIndex ? 2000000001 : 1501};
     transition: all; 
     overflow: visible; 
     background-color: rgba(0, 0, 0, 0.4);
@@ -18,13 +19,16 @@ const StyledWaitPanel = styled.div `
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
-    width: 300px; 
-    height: ${(props) => props.$height};
+    width: 300px;
+    max-width: calc(100% - 20px);
+    height: auto;
+    max-height: calc(100% - 20px);
     background: white; 
     border-radius: 8px; 
     padding: 10px; 
     text-align: center; 
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); 
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+    overflow: auto;
 `;
 const StyledTitle = styled.h2 ` margin: 0; font-size: 1.5em; color: #333; `;
 const StyledProgressBarContainer = styled.div ` width: 100%; height: 20px; background: #e0e0e0; border-radius: 10px; overflow: hidden; margin: 20px 0; `;
@@ -33,7 +37,7 @@ const StyledProgressText = styled.p ` font-weight: bold; color: #333; margin: 0;
 const StyledMessage = styled.p ` color: #666; font-size: 0.9em; margin-top: 10px; `;
 const StyledAbortButton = styled.button ` background: #ff4d4d; color: white; border: none; border-radius: 5px; padding: 10px 20px; font-size: 1em; cursor: pointer; margin-top: 20px; &:hover { background: #ff6666; } `;
 export const TMWaitPanel = (props) => {
-    const { title, showPrimary, textPrimary, valuePrimary, maxValuePrimary, showSecondary, textSecondary, valueSecondary, maxValueSecondary, isCancelable, abortController, onAbortClick } = props;
+    const { title, showPrimary, textPrimary, valuePrimary, maxValuePrimary, showSecondary, textSecondary, valueSecondary, maxValueSecondary, isCancelable, abortController, onAbortClick, useHighZIndex } = props;
     const calculateProgress = (value = 0, maxValue = 0) => {
         if (maxValue === 0)
             return 0;
@@ -42,10 +46,11 @@ export const TMWaitPanel = (props) => {
     };
     let progressValue1 = calculateProgress(valuePrimary, maxValuePrimary);
     let progressValue2 = calculateProgress(valueSecondary, maxValueSecondary);
-    return (_jsx(StyledWaitPanelOverlay, { children: _jsxs(StyledWaitPanel, { "$height": (showPrimary && showSecondary) ? '350px' : '250px', children: [_jsx(StyledTitle, { children: title }), showPrimary &&
+    return (_jsx(StyledWaitPanelOverlay, { "$useHighZIndex": useHighZIndex, children: _jsxs(StyledWaitPanel, { children: [_jsx(StyledTitle, { children: title }), showPrimary &&
                     _jsxs("div", { style: { width: '100%', height: '100px' }, children: [_jsx(StyledProgressBarContainer, { children: _jsx(StyledProgressBar, { style: { width: `${progressValue1.toFixed(2)}%` } }) }), _jsxs(StyledProgressText, { children: [progressValue1.toFixed(2), "%"] }), _jsx(StyledMessage, { children: textPrimary })] }), showSecondary &&
                     _jsxs("div", { style: { width: '100%', height: '100px' }, children: [_jsx(StyledProgressBarContainer, { children: _jsx(StyledProgressBar, { style: { width: `${progressValue2.toFixed(2)}%` } }) }), _jsxs(StyledProgressText, { children: [progressValue2.toFixed(2), "%"] }), _jsx(StyledMessage, { children: textSecondary })] }), isCancelable && _jsx(StyledAbortButton, { onClick: () => onAbortClick?.(abortController), children: SDKUI_Localizator.Abort })] }) }));
 };
-export const TMLayoutWaitingContainer = ({ showWaitPanel, showWaitPanelPrimary, showWaitPanelSecondary, waitPanelTitle, waitPanelTextSecondary, waitPanelValueSecondary, waitPanelMaxValueSecondary, waitPanelTextPrimary, waitPanelValuePrimary, waitPanelMaxValuePrimary, isCancelable, abortController, gap = 3, onClick, justifyContent = 'flex-start', alignItems = 'flex-start', children, direction = 'vertical' }) => {
-    return (_jsxs(TMLayoutContainer, { gap: gap, justifyContent: justifyContent, alignItems: alignItems, direction: direction, children: [children, showWaitPanel && (_jsx(TMWaitPanel, { title: waitPanelTitle, showPrimary: showWaitPanelPrimary, textPrimary: waitPanelTextPrimary, valuePrimary: waitPanelValuePrimary, maxValuePrimary: waitPanelMaxValuePrimary, showSecondary: showWaitPanelSecondary, textSecondary: waitPanelTextSecondary, valueSecondary: waitPanelValueSecondary, maxValueSecondary: waitPanelMaxValueSecondary, isCancelable: isCancelable, abortController: abortController, onAbortClick: (abortController) => { setTimeout(() => { abortController?.abort(); }, 1000); } }))] }));
+export const TMLayoutWaitingContainer = ({ showWaitPanel, showWaitPanelPrimary, showWaitPanelSecondary, waitPanelTitle, waitPanelTextSecondary, waitPanelValueSecondary, waitPanelMaxValueSecondary, waitPanelTextPrimary, waitPanelValuePrimary, waitPanelMaxValuePrimary, isCancelable, abortController, usePortal = false, gap = 3, onClick, justifyContent = 'flex-start', alignItems = 'flex-start', children, direction = 'vertical' }) => {
+    const waitPanelElement = showWaitPanel ? (_jsx(TMWaitPanel, { title: waitPanelTitle, showPrimary: showWaitPanelPrimary, textPrimary: waitPanelTextPrimary, valuePrimary: waitPanelValuePrimary, maxValuePrimary: waitPanelMaxValuePrimary, showSecondary: showWaitPanelSecondary, textSecondary: waitPanelTextSecondary, valueSecondary: waitPanelValueSecondary, maxValueSecondary: waitPanelMaxValueSecondary, isCancelable: isCancelable, abortController: abortController, onAbortClick: (abortController) => { setTimeout(() => { abortController?.abort(); }, 1000); }, useHighZIndex: usePortal })) : null;
+    return (_jsxs(_Fragment, { children: [usePortal && waitPanelElement && createPortal(waitPanelElement, document.body), _jsxs(TMLayoutContainer, { gap: gap, justifyContent: justifyContent, alignItems: alignItems, direction: direction, children: [children, !usePortal && waitPanelElement] })] }));
 };

package/lib/components/choosers/TMDistinctValues.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import { LayoutModes, MetadataDataDomains, AccessLevels, MetadataDataTypes, SDK_Globals, DcmtTypeListCacheService, DataColumnTypes } from '@topconsultnpm/sdk-ts';
+import { LayoutModes, MetadataDataDomains, AccessLevels, MetadataDataTypes, SDK_Globals, DcmtTypeListCacheService, DataColumnTypes, DataListViewModes } from '@topconsultnpm/sdk-ts';
 import styled from 'styled-components';
 import { SDKUI_Localizator, stringIsNullOrEmpty } from '../../helper';
 import TMDataGrid, { TMDataGridPageSize } from '../base/TMDataGrid';
@@ -9,14 +9,17 @@ import TMSpinner from '../base/TMSpinner';
 import TMCheckBox from '../editors/TMCheckBox';
 import TMPanel from '../base/TMPanel';
 import TMModal from '../base/TMModal';
+import { useDataListItem } from '../../hooks/useDataListItem';
+import { useDataUserIdItem } from '../../hooks/useDataUserIdItem';
 const StyledDistinctValues = styled.div `display: flex; flex-direction: column; height: 100%; overflow: hidden; gap: 10px;`;
-const StyledPanelContainer = styled.div ` width: 100%; height: 100%; padding: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; `;
 const TMDistinctValues = ({ tid, mid, layoutMode = LayoutModes.None, allowAppendMode = true, showHeader = true, isModal, separator = " ", onSelectionChanged, onClosePanelCallback }) => {
     const [focusedItem, setFocusedItem] = useState();
     const [dataSource, setDataSource] = useState([]);
     const [isAppendMode, setIsAppendMode] = useState(false);
     const [md, setMd] = useState();
     const [currentValue, setCurrentValue] = useState('');
+    const { loadDataListsAsync, renderDataListCell, dataListsCache } = useDataListItem();
+    const { loadUsersAsync, renderUserIdViewer, usersCache } = useDataUserIdItem();
     useEffect(() => {
         getDistictValuesAsync();
     }, [mid]);
@@ -57,8 +60,23 @@ const TMDistinctValues = ({ tid, mid, layoutMode = LayoutModes.None, allowAppend
         try {
             TMSpinner.show({ description: 'Caricamento dei valori distinti...' });
             let dtd = await DcmtTypeListCacheService.GetAsync(tid, true);
-            setMd(dtd?.metadata?.find(o => o.id === mid));
+            const currentMd = dtd?.metadata?.find(o => o.id === mid);
+            setMd(currentMd);
             let result = await SDK_Globals.tmSession?.NewSearchEngine().GetDistinctValuesAsync(tid, mid, 10000);
+            // Load DataList or UserID cache based on metadata domain
+            if (currentMd?.dataDomain === MetadataDataDomains.DataList && currentMd.dataListID) {
+                await loadDataListsAsync(new Set([currentMd.dataListID]));
+            }
+            if (currentMd?.dataDomain === MetadataDataDomains.UserID && result?.dtdResult?.rows) {
+                const userIDs = new Set();
+                result.dtdResult.rows.forEach((row) => {
+                    const userId = Number(row[0]);
+                    if (userId && userId > 0) {
+                        userIDs.add(userId);
+                    }
+                });
+                await loadUsersAsync(userIDs);
+            }
             setDataSource(convertDataTableToObject(result?.dtdResult));
         }
         catch (e) {
@@ -69,31 +87,27 @@ const TMDistinctValues = ({ tid, mid, layoutMode = LayoutModes.None, allowAppend
             TMSpinner.hide();
         }
     };
-    const getDcmtTypeAsync = async () => {
-        if (!tid)
-            return;
-        try {
-            TMSpinner.show({ description: 'Caricamento dei valori distinti...' });
-            let dtd = await DcmtTypeListCacheService.GetAsync(tid, true);
-            setMd(dtd?.metadata?.find(o => o.id === mid));
-        }
-        catch (e) {
-            let err = e;
-            TMExceptionBoxManager.show({ exception: err });
-        }
-        finally {
-            TMSpinner.hide();
-        }
-    };
     const onFocusedRowChanged = useCallback((e) => {
         setFocusedItem(e.row?.data);
     }, []);
+    const valueCellRender = useCallback((cellData) => {
+        if (!cellData || cellData.value === undefined)
+            return null;
+        if (md?.dataDomain === MetadataDataDomains.DataList && md.dataListID) {
+            return renderDataListCell(cellData.value, md.dataListID, md.dataListViewMode ?? DataListViewModes.None);
+        }
+        if (md?.dataDomain === MetadataDataDomains.UserID) {
+            return renderUserIdViewer(Number(cellData.value), true);
+        }
+        return _jsx("div", { children: cellData.text });
+    }, [md, renderDataListCell, renderUserIdViewer]);
     const customColumns = useMemo(() => {
+        const needsCellRender = md?.dataDomain === MetadataDataDomains.DataList || md?.dataDomain === MetadataDataDomains.UserID;
         return ([
-            { dataField: 'value', dataType: md?.dataType === MetadataDataTypes.DateTime ? 'date' : 'string', caption: md?.nameLoc, width: 'min-content' },
+            { dataField: 'value', dataType: md?.dataType === MetadataDataTypes.DateTime ? 'date' : 'string', caption: md?.nameLoc, width: 'min-content', ...(needsCellRender && { cellRender: valueCellRender }) },
             { dataField: 'Count', dataType: 'number', caption: 'N°' }
         ]);
-    }, [md]);
+    }, [md, valueCellRender]);
     const customSummary = useMemo(() => {
         return ({
             totalItems: [

package/lib/components/choosers/TMDynDataListItemChooser.d.ts

@@ -39,4 +39,4 @@ interface ITMDynDataListItemChooserFormProps extends ITMChooserFormProps<DataLis
     dynDL?: DynamicDataListDescriptor;
     searchResult?: SearchResultDescriptor;
 }
-export declare const TMDynDataListItemChooserForm: (props: ITMDynDataListItemChooserFormProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TMDynDataListItemChooserForm: (props: ITMDynDataListItemChooserFormProps) => React.JSX.Element;

package/lib/components/choosers/TMDynDataListItemChooser.js

@@ -84,10 +84,15 @@ const TMDynDataListItemChooser = ({ tid, md, width = '100%', titleForm, openChoo
             _jsx(TMTooltip, { content: SDKUI_Localizator.ValueNotPresent, children: _jsx(IconWarning, { color: TMColors.warning }) });
     };
     const renderTemplate = () => {
+        const isPlaceholder = values?.[0] === placeHolder;
+        // Selezione singola: mostra direttamente il primo valore
+        if (!allowMultipleSelection) {
+            const singleDescription = getValueDescription(values?.[0]);
+            return (_jsx(StyledDivHorizontal, { style: { width: '100%', color: isPlaceholder ? '#a9a9a9' : 'inherit', alignItems: 'center' }, children: dataSource && singleDescription && _jsxs(StyledDivHorizontal, { style: { alignItems: 'center', gap: '8px' }, children: [getIcon(), _jsx("p", { children: singleDescription })] }) }));
+        }
         const MIN_COUNT_FOR_BADGE = 1;
         const MAX_VISIBLE_ITEMS = 3;
         const MAX_TOOLTIP_ITEMS = 50;
-        const isPlaceholder = values?.[0] === placeHolder;
         const descriptions = getDescriptions(MAX_VISIBLE_ITEMS);
         const remainingCount = (values?.length ?? 0) - MAX_VISIBLE_ITEMS;
         const totalCount = values?.length ?? 0;

package/lib/components/choosers/TMGroupChooser.js

@@ -11,7 +11,7 @@ export const TMGroupChooserForm = (props) => {
         TMSpinner.hide();
         return items ?? [];
     };
-    return (_jsx(TMChooserForm, { title: SDK_Localizator.Groups, allowMultipleSelection: props.allowMultipleSelection, width: props.width, height: props.height, manageUseLocalizedName: true, hasShowOnlySelectedItems: true, selectedIDs: props.selectedIDs, startWithShowOnlySelectedItems: false, cellRenderIcon: () => _jsx(IconUserGroup, { color: '#767676' }), dataSource: props.dataSource, getItems: getItems, onClose: props.onClose, onChoose: (IDs) => { props.onChoose?.(IDs); } }));
+    return (_jsx(TMChooserForm, { title: SDK_Localizator.Groups, allowMultipleSelection: props.allowMultipleSelection, width: props.width, height: props.height, manageUseLocalizedName: props.manageUseLocalizedName ?? true, hasShowOnlySelectedItems: true, selectedIDs: props.selectedIDs, startWithShowOnlySelectedItems: false, cellRenderIcon: () => _jsx(IconUserGroup, { color: '#767676' }), dataSource: props.dataSource, getItems: getItems, onClose: props.onClose, onChoose: (IDs) => { props.onChoose?.(IDs); } }));
 };
 export const TMGroupIdViewer = (props) => {
     const [group, setGroup] = useState(null);

package/lib/components/choosers/TMInvoiceRetrieveFormats.d.ts

@@ -1,4 +1,5 @@
+import React from 'react';
 import { InvoiceRetrieveFormats } from '@topconsultnpm/sdk-ts';
 import { ITMEnumDataBinding } from '../../ts';
-declare const TMInvoiceRetrieveFormats: ({ value, valueOrig, onValueChanged, valuesToExclude, label, width }: ITMEnumDataBinding<InvoiceRetrieveFormats>) => import("react/jsx-runtime").JSX.Element;
+declare const TMInvoiceRetrieveFormats: ({ value, valueOrig, onValueChanged, valuesToExclude, label, width }: ITMEnumDataBinding<InvoiceRetrieveFormats>) => React.JSX.Element;
 export default TMInvoiceRetrieveFormats;

package/lib/components/choosers/TMOrderRetrieveFormats.d.ts

@@ -1,4 +1,5 @@
+import React from 'react';
 import { OrderRetrieveFormats } from '@topconsultnpm/sdk-ts';
 import { ITMEnumDataBinding } from '../../ts';
-declare const TMOrderRetrieveFormats: ({ value, valueOrig, onValueChanged, valuesToExclude, label, width }: ITMEnumDataBinding<OrderRetrieveFormats>) => import("react/jsx-runtime").JSX.Element;
+declare const TMOrderRetrieveFormats: ({ value, valueOrig, onValueChanged, valuesToExclude, label, width }: ITMEnumDataBinding<OrderRetrieveFormats>) => React.JSX.Element;
 export default TMOrderRetrieveFormats;

package/lib/components/choosers/TMRelationChooser.d.ts

@@ -19,13 +19,13 @@ export declare const TMRelationIdViewer: ({ relationType, relationId, showIcon,
     relationId?: number;
     showIcon?: boolean;
     noneSelectionText?: string;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => React.JSX.Element;
 export declare const TMRelationIcon: ({ rd, relationType }: {
     rd: RelationDescriptor | undefined;
     relationType?: RelationTypes;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => React.JSX.Element;
 export declare const TMRelationTooltip: ({ rd, relationType, children }: {
     rd?: RelationDescriptor;
     relationType: RelationTypes | undefined;
     children: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => React.JSX.Element;

package/lib/components/choosers/TMUserChooser.d.ts

@@ -16,6 +16,8 @@ interface ITMUserChooserProps extends ITMChooserProps {
     initialShowChooser?: boolean;
     /** Allow showing all users with toggle button */
     allowShowAllUsers?: boolean;
+    /** If true, uses UserListCacheService.GetAllAdminAsync() instead of GetAllAsync() */
+    adminMode?: boolean;
     /** Funzione per aggiornare lo stato di apertura della modale */
     updateIsModalOpen?: (isOpen: boolean) => void;
 }
@@ -30,12 +32,14 @@ interface ITMUserChooserFormProps extends ITMChooserFormProps<UserDescriptor> {
     hideShowId?: boolean;
     /** Allow showing all users with toggle button */
     allowShowAllUsers?: boolean;
+    /** If true, uses UserListCacheService.GetAllAdminAsync() instead of GetAllAsync() */
+    adminMode?: boolean;
 }
 export declare const TMUserChooserForm: React.FunctionComponent<ITMUserChooserFormProps>;
 export declare const TMUserIcon: ({ ud }: {
     ud?: UserDescriptor;
-}) => import("react/jsx-runtime").JSX.Element | null;
+}) => React.JSX.Element | null;
 export declare const TMUserTooltip: ({ ud, children }: {
     ud?: UserDescriptor;
     children: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => React.JSX.Element;

package/lib/components/choosers/TMUserChooser.js

@@ -8,7 +8,7 @@ import TMSummary from '../editors/TMSummary';
 import TMChooserForm from '../forms/TMChooserForm';
 import TMButton from '../base/TMButton';
 import TMDataUserIdItemViewer from '../viewers/TMDataUserIdItemViewer';
-const TMUserChooser = ({ labelColor, titleForm, filter, readOnly = false, icon, width, dataSource, backgroundColor, openChooserBySingleClick, buttons = [], disabled = false, showBorder = true, hideRefresh = false, hideShowId = false, elementStyle, allowMultipleSelection, values, isModifiedWhen, label, placeHolder, validationItems = [], onValueChanged, showClearButton, initialShowChooser = false, allowShowAllUsers = false, updateIsModalOpen }) => {
+const TMUserChooser = ({ labelColor, titleForm, filter, readOnly = false, icon, width, dataSource, backgroundColor, openChooserBySingleClick, buttons = [], disabled = false, showBorder = true, hideRefresh = false, hideShowId = false, elementStyle, allowMultipleSelection, values, isModifiedWhen, label, placeHolder, validationItems = [], onValueChanged, showClearButton, initialShowChooser = false, allowShowAllUsers = false, adminMode = false, updateIsModalOpen }) => {
     const [showChooser, setShowChooser] = useState(initialShowChooser);
     useEffect(() => {
         setShowChooser(initialShowChooser);
@@ -24,14 +24,14 @@ const TMUserChooser = ({ labelColor, titleForm, filter, readOnly = false, icon,
                         updateIsModalOpen?.(true);
                     }
                 }, elementStyle: elementStyle, isModifiedWhen: isModifiedWhen, openEditorOnSummaryClick: openChooserBySingleClick, label: label, template: renderTemplate(), onClearClick: showClearButton ? () => { onValueChanged?.([]); } : undefined, validationItems: validationItems }), showChooser &&
-                _jsx(TMUserChooserForm, { title: titleForm, allowMultipleSelection: allowMultipleSelection, hasShowOnlySelectedItems: true, dataSource: dataSource, filter: filter, selectedIDs: values, hideRefresh: hideRefresh, hideShowId: hideShowId, allowShowAllUsers: allowShowAllUsers, onClose: () => {
+                _jsx(TMUserChooserForm, { title: titleForm, allowMultipleSelection: allowMultipleSelection, hasShowOnlySelectedItems: true, dataSource: dataSource, filter: filter, selectedIDs: values, hideRefresh: hideRefresh, hideShowId: hideShowId, allowShowAllUsers: allowShowAllUsers, adminMode: adminMode, onClose: () => {
                         setShowChooser(false);
                         summaryInputRef.current?.focus();
                         updateIsModalOpen?.(false);
                     }, onChoose: (IDs) => { onValueChanged?.(IDs); } })] }));
 };
 export default TMUserChooser;
-export const TMUserChooserForm = ({ allowMultipleSelection, columns, hideRefresh = false, hideShowId = false, startWithShowOnlySelectedItems = true, filter, title, hasShowOnlySelectedItems, width, height, selectedIDs, dataSource, onClose, onChoose, allowShowAllUsers = false }) => {
+export const TMUserChooserForm = ({ allowMultipleSelection, columns, hideRefresh = false, hideShowId = false, startWithShowOnlySelectedItems = true, filter, title, hasShowOnlySelectedItems, width, height, selectedIDs, dataSource, onClose, onChoose, allowShowAllUsers = false, adminMode = false }) => {
     const [currentDataSource, setCurrentDataSource] = useState(dataSource);
     const [showingAllUsers, setShowingAllUsers] = useState(false);
     const dataColumns = useMemo(() => {
@@ -45,8 +45,10 @@ export const TMUserChooserForm = ({ allowMultipleSelection, columns, hideRefresh
     const getItems = async (refreshCache) => {
         TMSpinner.show({ description: `${SDKUI_Localizator.Loading} - ${SDK_Localizator.Users} ...` });
         if (refreshCache)
-            UserListCacheService.RemoveAll();
-        let allUsers = await UserListCacheService.GetAllAsync();
+            adminMode ? UserListCacheService.RemoveAllAdmin() : UserListCacheService.RemoveAll();
+        let allUsers = adminMode
+            ? await UserListCacheService.GetAllAdminAsync()
+            : await UserListCacheService.GetAllAsync();
         let users = filter ? allUsers?.filter(filter) : allUsers;
         TMSpinner.hide();
         return users;

package/lib/components/editors/TMDateBox.js

@@ -1,11 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useRef } from 'react';
+import { useEffect, useId, useRef } from 'react';
 import { DateBox } from 'devextreme-react';
 import { DateDisplayTypes, Globalization } from '../../helper';
 import { TMColors } from '../../utils/theme';
 import TMVilViewer from '../base/TMVilViewer';
 const TMDateBox = (props) => {
     const resetTimeToZero = props.resetTimeToZeroOnKeyPress ?? true;
+    const autoId = useId();
+    const effectiveInputAttr = { id: autoId, ...props.inputAttr };
     useEffect(() => {
         let htmlElement = dateBoxRef?.current?.instance().element();
         if (!htmlElement)
@@ -63,7 +65,7 @@ const TMDateBox = (props) => {
             return "datetime";
         return props.dateDisplayType == DateDisplayTypes.Date ? "date" : "time";
     };
-    return (_jsxs("div", { style: { display: 'flex', alignItems: 'center', width: '100%', padding: props.padding }, children: [props.icon && (_jsx("span", { style: { marginRight: '8px', marginTop: '8px', display: 'flex', alignItems: 'center' }, children: props.icon })), _jsxs("div", { onContextMenu: (e) => e.stopPropagation(), style: { display: 'flex', flexDirection: 'column', gap: '5px', width: '100%' }, children: [_jsx(DateBox, { readOnly: props.readOnly, ref: dateBoxRef, showClearButton: props.showClearButton, dateSerializationFormat: props.useDateSerializationFormat ? 'yyyy-MM-ddTHH:mm:ss' : undefined, disabled: props.disabled, displayFormat: props.displayFormat ?? Globalization.getDateDisplayFormat(props.dateDisplayType), dropDownOptions: dropDownOptions, label: props.label, labelMode: 'static', type: getType(), useMaskBehavior: true, height: '28px', value: props.value, width: props.width, valueChangeEvent: 'keyup input change', onValueChange: (e) => { props.onValueChange?.(e); }, onInitialized: (e) => { props.onInitialized?.(e); }, onContentReady: (e) => { props.onContentReady?.(e); }, placeholder: props.placeholder, onKeyUp: (e) => {
+    return (_jsxs("div", { style: { display: 'flex', alignItems: 'center', width: '100%', padding: props.padding }, children: [props.icon && (_jsx("span", { style: { marginRight: '8px', marginTop: '8px', display: 'flex', alignItems: 'center' }, children: props.icon })), _jsxs("div", { onContextMenu: (e) => e.stopPropagation(), style: { display: 'flex', flexDirection: 'column', gap: '5px', width: '100%' }, children: [_jsx(DateBox, { readOnly: props.readOnly, ref: dateBoxRef, showClearButton: props.showClearButton, dateSerializationFormat: props.useDateSerializationFormat ? 'yyyy-MM-ddTHH:mm:ss' : undefined, disabled: props.disabled, displayFormat: props.displayFormat ?? Globalization.getDateDisplayFormat(props.dateDisplayType), dropDownOptions: dropDownOptions, label: props.label, labelMode: 'static', type: getType(), useMaskBehavior: true, height: '28px', value: props.value, width: props.width, valueChangeEvent: 'keyup input change', onValueChange: (e) => { props.onValueChange?.(e); }, onInitialized: (e) => { props.onInitialized?.(e); }, onContentReady: (e) => { props.onContentReady?.(e); }, placeholder: props.placeholder, ...(props.name && { name: props.name }), inputAttr: effectiveInputAttr, onKeyUp: (e) => {
                             if (e.event?.code == "Space") {
                                 const currentDate = new Date();
                                 currentDate.setHours(0, 0, 0, 0);

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

@@ -7,7 +7,7 @@ export declare const StyledEditorContainer: import("styled-components/dist/types
 }, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$width"> & {
     $width: string;
 }, never>>> & string;
-export declare const StyledEditor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "$disabled" | "$isMobile" | "$width" | "$type" | "$borderRadius" | "$fontSize" | "$vil" | "$isModified" | "$maxValue"> & {
+export declare const StyledEditor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "$width" | "$borderRadius" | "$fontSize" | "$type" | "$disabled" | "$vil" | "$isModified" | "$maxValue" | "$isMobile"> & {
     $vil: ValidationItem[];
     $width: string;
     $type: string;
@@ -17,7 +17,7 @@ export declare const StyledEditor: import("styled-components/dist/types").IStyle
     $disabled: boolean;
     $isMobile?: boolean;
     $borderRadius?: string;
-}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "$disabled" | "$isMobile" | "$width" | "$type" | "$borderRadius" | "$fontSize" | "$vil" | "$isModified" | "$maxValue"> & {
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "$width" | "$borderRadius" | "$fontSize" | "$type" | "$disabled" | "$vil" | "$isModified" | "$maxValue" | "$isMobile"> & {
     $vil: ValidationItem[];
     $width: string;
     $type: string;
@@ -37,20 +37,20 @@ export declare const StyledEditorIcon: import("styled-components/dist/types").IS
     $disabled: boolean;
     $isModified: boolean;
 }, never>>> & string;
-export declare const StyledEditorLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$color" | "$disabled" | "$fontSize" | "$isFocused" | "$labelPosition"> & {
+export declare const StyledEditorLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$color" | "$fontSize" | "$disabled" | "$isFocused" | "$labelPosition"> & {
     $isFocused: boolean;
     $labelPosition: "right" | "left" | "top";
     $disabled: boolean;
     $fontSize?: string;
     $color?: string;
-}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$color" | "$disabled" | "$fontSize" | "$isFocused" | "$labelPosition"> & {
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$color" | "$fontSize" | "$disabled" | "$isFocused" | "$labelPosition"> & {
     $isFocused: boolean;
     $labelPosition: "right" | "left" | "top";
     $disabled: boolean;
     $fontSize?: string;
     $color?: string;
 }, never>>> & string;
-export declare const StyledTextareaEditor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "$maxHeight" | "$disabled" | "$isMobile" | "$width" | "$borderRadius" | "$fontSize" | "$vil" | "$isModified" | "$resize"> & {
+export declare const StyledTextareaEditor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "$width" | "$maxHeight" | "$borderRadius" | "$fontSize" | "$disabled" | "$vil" | "$isModified" | "$isMobile" | "$resize"> & {
     $vil: ValidationItem[];
     $width: string;
     $isModified: boolean;
@@ -60,7 +60,7 @@ export declare const StyledTextareaEditor: import("styled-components/dist/types"
     $maxHeight?: string;
     $borderRadius?: string;
     $resize?: boolean;
-}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "$maxHeight" | "$disabled" | "$isMobile" | "$width" | "$borderRadius" | "$fontSize" | "$vil" | "$isModified" | "$resize"> & {
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "$width" | "$maxHeight" | "$borderRadius" | "$fontSize" | "$disabled" | "$vil" | "$isModified" | "$isMobile" | "$resize"> & {
     $vil: ValidationItem[];
     $width: string;
     $isModified: boolean;

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

@@ -27,11 +27,14 @@ export declare class FormulaDescriptor {
     mid?: number;
     metadataDataTypeDest?: MetadataDataTypes;
     tid?: number;
+    description?: string;
+    syntax?: string;
 }
-export declare const renderFormulaIcon: (iconType: FormulaIconTypes, tid?: number, md?: MetadataDescriptor) => import("react/jsx-runtime").JSX.Element;
+export declare const renderFormulaIcon: (iconType: FormulaIconTypes, tid?: number, md?: MetadataDescriptor) => React.JSX.Element;
 declare const TMFormulaEditor: React.FunctionComponent<ITMApplyFormProps<FormulaDescriptor>>;
 export default TMFormulaEditor;
 export declare class FormulaHelper {
+    static translateDescInFormula: (text: string, returnType?: string) => string;
     static isFormula(value: string | undefined): boolean;
     static removeFormulaTag(value: string | undefined): string | undefined;
     static addFormulaTag(value: string | undefined): string | undefined;