@topconsultnpm/sdkui-react 6.20.0-dev1.3 → 6.20.0-dev1.30

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

@@ -8,13 +8,14 @@ import { FileExtensionHandler, FormModes } from '../../../ts';
 import { TMColors } from '../../../utils/theme';
 import ShowAlert from '../../base/TMAlert';
 import TMButton from '../../base/TMButton';
-import TMDropDownMenu from '../../base/TMDropDownMenu';
 import { TMExceptionBoxManager } from '../../base/TMPopUp';
 import { TMLayoutWaitingContainer } from '../../base/TMWaitPanel';
 import { TMSaveFormButtonPrevious, TMSaveFormButtonNext } from '../../forms/TMSaveForm';
 import { StyledAnimatedComponentOpacity } from '../../base/Styled';
 import TMPanel from '../../base/TMPanel';
 import TMTooltip from '../../base/TMTooltip';
+import { ContextMenu } from '../../NewComponents/ContextMenu';
+import TMPdfViewer from '../../../helper/TMPdfViewer';
 const ErrorContent = ({ error, isAbortError, onRetry }) => {
     if (isAbortError) {
         return (_jsx(StyledAnimatedComponentOpacity, { style: { width: '100%', height: '100%' }, children: _jsxs(StyledPanelStatusContainer, { children: [_jsx(IconCloseOutline, { fontSize: 92, color: TMColors.error }), _jsxs(StyledPreviewNotAvailable, { children: [_jsx("div", { children: error }), _jsx("div", { children: SDKUI_Localizator.PreviewNotAvailable })] }), _jsx(TMButton, { caption: SDKUI_Localizator.TryAgain, onClick: onRetry, showTooltip: false })] }) }));
@@ -124,10 +125,11 @@ const TMDcmtPreview = ({ dcmtData, isResizingActive, isVisible, canNext, canPrev
             console.error('Error reopening document:', error);
         }
     };
-    return (_jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: _jsx(TMPanel, { padding: '0', title: titleHandler(), onClose: onClosePanel, allowMaximize: allowMaximize, onMaximize: onMaximizePanel, onHeaderDoubleClick: onMaximizePanel, toolbar: _jsxs("div", { style: { width: 'max-content', display: 'flex', alignItems: 'center', gap: '10px' }, children: [onPrev && _jsx(TMSaveFormButtonPrevious, { btnStyle: 'icon', isModified: false, formMode: FormModes.ReadOnly, canPrev: canPrev, onPrev: onPrev }), onNext && _jsx(TMSaveFormButtonNext, { btnStyle: 'icon', isModified: false, formMode: FormModes.ReadOnly, canNext: canNext, onNext: onNext }), _jsx(StyledHeaderIcon, { "$color": TMColors.primaryColor, children: _jsx(TMDropDownMenu, { backgroundColor: 'white', borderRadius: '3px', content: _jsx(TMButton, { btnStyle: 'icon', caption: 'Altro', icon: _jsx(IconMenuVertical, {}), showTooltip: false }), items: [
-                                { icon: _jsx(IconCloseCircle, {}), text: SDKUI_Localizator.RemoveFromCache, onClick: () => { removeDcmtsFileCache(cacheKey); setIsFromCache(false); } },
-                                { icon: _jsx(IconClear, {}), text: SDKUI_Localizator.ClearCache, onClick: () => { clearDcmtsFileCache(); setIsFromCache(false); } },
-                            ] }, "btn13") }), _jsx(StyledHeaderIcon, { onClick: reOpenDcmt, "$color": TMColors.primaryColor, children: _jsx(TMTooltip, { content: SDKUI_Localizator.ReopenDocument, children: _jsx(IconRefresh, {}) }) })] }), children: error
+    const cacheMenuItems = useMemo(() => [
+        { icon: _jsx(IconCloseCircle, {}), name: SDKUI_Localizator.RemoveFromCache, onClick: () => { removeDcmtsFileCache(cacheKey); setIsFromCache(false); } },
+        { icon: _jsx(IconClear, {}), name: SDKUI_Localizator.ClearCache, onClick: () => { clearDcmtsFileCache(); setIsFromCache(false); } },
+    ], [cacheKey, removeDcmtsFileCache, clearDcmtsFileCache, setIsFromCache]);
+    return (_jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: _jsx(TMPanel, { padding: '0', title: titleHandler(), onClose: onClosePanel, allowMaximize: allowMaximize, onMaximize: onMaximizePanel, onHeaderDoubleClick: onMaximizePanel, toolbar: _jsxs("div", { style: { width: 'max-content', display: 'flex', alignItems: 'center', gap: '10px' }, children: [onPrev && _jsx(TMSaveFormButtonPrevious, { btnStyle: 'icon', isModified: false, formMode: FormModes.ReadOnly, canPrev: canPrev, onPrev: onPrev }), onNext && _jsx(TMSaveFormButtonNext, { btnStyle: 'icon', isModified: false, formMode: FormModes.ReadOnly, canNext: canNext, onNext: onNext }), _jsx(StyledHeaderIcon, { "$color": TMColors.primaryColor, children: _jsx(ContextMenu, { items: cacheMenuItems, trigger: "left", children: _jsx(IconMenuVertical, {}) }) }), _jsx(StyledHeaderIcon, { onClick: reOpenDcmt, "$color": TMColors.primaryColor, children: _jsx(TMTooltip, { content: SDKUI_Localizator.ReopenDocument, children: _jsx(IconRefresh, {}) }) })] }), children: error
                 ? _jsx(ErrorContent, { error: error, isAbortError: isAbortError, onRetry: reOpenDcmt })
                 : renderedPreview(dcmtData?.tid, dcmtData?.did, dcmtData?.fileExt, dcmtData?.fileSize, dcmtData?.fileCount, extensionHandler(dcmtData?.fileExt), showPreview, isResizingActive, () => { loadDocumentWithCache(); setShowPreview(true); }, dcmtBlob) }) }));
 };
@@ -136,35 +138,10 @@ export const TMFileViewer = ({ fileBlob, isResizingActive }) => {
     const [blobUrl, setBlobUrl] = useState(undefined);
     const [fileType, setFileType] = useState(undefined);
     const [formattedXml, setFormattedXml] = useState(undefined);
-    const [isMobile, setIsMobile] = useState(false);
-    useEffect(() => {
-        const checkIsMobile = () => {
-            const userAgent = navigator.userAgent || navigator.vendor || window.opera;
-            // Only detect actual mobile/tablet devices, NOT desktop browsers
-            const isMobileDevice = 
-            // Traditional mobile detection (phones and tablets)
-            /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(userAgent) ||
-                // Additional Android tablet detection (covers tablets in landscape)
-                /android.*tablet|android.*mobile/i.test(userAgent) ||
-                // Touch-only devices (excludes laptops with touchscreen)
-                (('ontouchstart' in window || navigator.maxTouchPoints > 0) &&
-                    !/Windows NT|Macintosh|Linux/.test(userAgent)) ||
-                // Small screen mobile devices only
-                (window.screen.width <= 768 && /Mobi|Android/i.test(userAgent));
-            setIsMobile(isMobileDevice);
-        };
-        checkIsMobile();
-        // Listen for orientation changes (important for tablets)
-        window.addEventListener('orientationchange', checkIsMobile);
-        window.addEventListener('resize', checkIsMobile);
-        return () => {
-            window.removeEventListener('orientationchange', checkIsMobile);
-            window.removeEventListener('resize', checkIsMobile);
-        };
-    }, []);
     useEffect(() => {
         if (fileBlob) {
-            setFileType(fileBlob.type);
+            const blobType = fileBlob.type;
+            setFileType(blobType);
             setFormattedXml(undefined);
             const fileName = fileBlob.name || '';
             const fileExtension = fileName.split('.').pop()?.toLowerCase() || '';
@@ -222,41 +199,10 @@ export const TMFileViewer = ({ fileBlob, isResizingActive }) => {
     if (fileBlob.type.includes('image')) {
         return (_jsx(ImageViewer, { fileBlob: fileBlob, alt: '' }));
     }
-    if (fileType === 'application/pdf' && isMobile) {
-        return (_jsx("object", { data: blobUrl, type: "application/pdf", width: "100%", height: "100%", style: {
-                border: 'none',
-                zIndex: 0,
-                pointerEvents: isResizingActive === true ? "none" : "auto"
-            }, children: _jsxs("div", { style: {
-                    padding: '40px',
-                    textAlign: 'center',
-                    display: 'flex',
-                    flexDirection: 'column',
-                    alignItems: 'center',
-                    justifyContent: 'center',
-                    height: '100%',
-                    gap: '20px'
-                }, children: [_jsx(IconPreview, { fontSize: 96 }), _jsxs("div", { children: [_jsx("h3", { children: SDKUI_Localizator.PDFDocument }), _jsx("p", { children: SDKUI_Localizator.PreviewNotAvailableOnDevice })] }), _jsxs("div", { style: { display: 'flex', gap: '10px', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center' }, children: [_jsx("a", { href: blobUrl, download: "document.pdf", style: {
-                                    minWidth: '180px',
-                                    padding: '12px 24px',
-                                    backgroundColor: TMColors.primaryColor,
-                                    color: 'white',
-                                    textDecoration: 'none',
-                                    borderRadius: '4px',
-                                    display: 'inline-block'
-                                }, children: SDKUI_Localizator.DownloadFile }), _jsx("a", { href: blobUrl, target: "_blank", rel: "noopener noreferrer", style: {
-                                    minWidth: '180px',
-                                    padding: '12px 24px',
-                                    backgroundColor: TMColors.primaryColor,
-                                    color: 'white',
-                                    textDecoration: 'none',
-                                    borderRadius: '4px',
-                                    display: 'inline-block'
-                                }, children: SDKUI_Localizator.OpenInNewTab })] })] }) }, blobUrl));
+    if (fileType === 'application/pdf') {
+        return _jsx(TMPdfViewer, { pdfBlob: fileBlob, isResizingActive: isResizingActive, enableFitToWidth: true });
     }
-    return (_jsx("iframe", { srcDoc: formattedXml ? `<html><body>${formattedXml}</body></html>` : undefined, src: !formattedXml
-            ? (fileType === 'application/pdf' ? `${blobUrl}#view=FitH&scrollbar=1` : blobUrl)
-            : undefined, title: "File Viewer", width: "100%", height: "100%", style: { border: 'none', zIndex: 0, pointerEvents: isResizingActive === true ? "none" : "auto" } }, blobUrl));
+    return (_jsx("iframe", { srcDoc: formattedXml ? `<html><body>${formattedXml}</body></html>` : undefined, src: !formattedXml ? blobUrl : undefined, title: "File Viewer", width: "100%", height: "100%", style: { border: 'none', zIndex: 0, pointerEvents: isResizingActive === true ? "none" : "auto" } }, blobUrl));
 };
 const ImageViewer = ({ fileBlob, alt = 'Image', className }) => {
     const containerRef = useRef(null);
@@ -475,3 +421,28 @@ const StyledImage = styled.img.attrs(props => ({
   pointer-events: none;
   position: absolute;
 `;
+const PDFViewerContainer = styled.div `
+  width: 100%;
+  height: 100%;
+  overflow-y: auto;
+  overflow-x: hidden;
+  background-color: #f5f5f5;
+  
+  .react-pdf__Document {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 10px;
+    padding: 10px 0;
+  }
+  
+  .react-pdf__Page {
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+    margin: 0 auto;
+  }
+  
+  .react-pdf__Page__canvas {
+    max-width: 100%;
+    height: auto !important;
+  }
+`;

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

@@ -0,0 +1,8 @@
+import { DcmtInfo } from "../../../ts";
+interface TMDcmtCheckoutInfoFormProps {
+    dtdName: string;
+    selectedDcmtOrFocused: DcmtInfo;
+    onClose: () => void;
+}
+declare const TMDcmtCheckoutInfoForm: (props: TMDcmtCheckoutInfoFormProps) => import("react/jsx-runtime").JSX.Element;
+export default TMDcmtCheckoutInfoForm;

package/lib/components/features/search/{TMSearchResultCheckoutInfoForm.js → TMDcmtCheckoutInfoForm.js}

@@ -5,14 +5,14 @@ import { IconBxInfo, IconFileDots, IconFolder, SDKUI_Globals, SDKUI_Localizator
 import { FormModes } from "../../../ts";
 import { ResultTypes, ValidationItem } from "@topconsultnpm/sdk-ts";
 import { SaveFormOptions, useSaveForm } from "../../../hooks/useForm";
-import { getCicoDownloadFileName, updateDcmtCheckoutItem } from "../../../helper/cicoHelper";
+import { getCicoDownloadFileName, updateCicoCheckoutStorageItem } from "../../../helper/checkinCheckoutManager";
 import { TMColors } from "../../../utils/theme";
 import TMLayoutContainer, { TMLayoutItem } from "../../base/TMLayout";
 import TMTooltip from "../../base/TMTooltip";
 import TMTextBox from "../../editors/TMTextBox";
 import ShowAlert from "../../base/TMAlert";
 import { TMExceptionBoxManager } from "../../base/TMPopUp";
-const TMSearchResultCheckoutInfoForm = (props) => {
+const TMDcmtCheckoutInfoForm = (props) => {
     const { dtdName, selectedDcmtOrFocused, onClose } = props;
     const [initialDcmtCheckoutFolder, setInitialDcmtCheckoutFolder] = useState("");
     const [initialDcmtCheckoutName, setInitialDcmtCheckoutName] = useState("");
@@ -31,7 +31,7 @@ const TMSearchResultCheckoutInfoForm = (props) => {
         const dcmtCheckoutInfoCurrentItems = [...SDKUI_Globals.userSettings.dcmtCheckoutInfo];
         const existingItem = dcmtCheckoutInfoCurrentItems.find((item) => item.TID === selectedDcmtOrFocused.TID.toString() && item.DID === selectedDcmtOrFocused.DID.toString());
         const folder = existingItem?.checkoutFolder ?? "";
-        const name = existingItem?.checkoutName ?? getCicoDownloadFileName(dtdName ?? SDKUI_Localizator.SearchResult, selectedDcmtOrFocused, true, false);
+        const name = existingItem?.checkoutName ?? getCicoDownloadFileName({ type: 'dcmtInfo', dcmtInfo: selectedDcmtOrFocused, originalFileName: dtdName ?? SDKUI_Localizator.SearchResult }, true, false);
         // Set form data
         setFormData({
             ...formData,
@@ -57,13 +57,8 @@ const TMSearchResultCheckoutInfoForm = (props) => {
             // Check: formData must exist, selectedDcmtOrFocused.TID and selectedDcmtOrFocused.DID must exist, and at least one of checkoutFolder or checkoutName must be filled
             if (formData && selectedDcmtOrFocused.TID && selectedDcmtOrFocused.DID) {
                 // Create a new draft checkout item with TID, DID, and folder/name values
-                const newItem = {
-                    TID: selectedDcmtOrFocused.TID.toString(),
-                    DID: selectedDcmtOrFocused.DID.toString(),
-                    checkoutFolder: formData.checkoutFolder ?? "",
-                    checkoutName: formData.checkoutName ?? ""
-                };
-                updateDcmtCheckoutItem(newItem, "addOrUpdate");
+                const newItem = { TID: selectedDcmtOrFocused.TID.toString(), DID: selectedDcmtOrFocused.DID.toString(), checkoutFolder: formData.checkoutFolder ?? "", checkoutName: formData.checkoutName ?? "" };
+                updateCicoCheckoutStorageItem(newItem, "dcmtInfo", "addOrUpdate");
                 onClose();
                 ShowAlert({ mode: 'success', title: SDKUI_Localizator.CheckoutInfo, message: SDKUI_Localizator.OperationSuccess, duration: 3000 });
             }
@@ -131,4 +126,4 @@ const TMSearchResultCheckoutInfoForm = (props) => {
                                             e.currentTarget.style.color = TMColors.primary;
                                         }, children: SDKUI_Localizator.Cancel })] })] }) }) }) }) });
 };
-export default TMSearchResultCheckoutInfoForm;
+export default TMDcmtCheckoutInfoForm;

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { PlatformObjectValidator, WhereItem, SDK_Localizator, OrderByItem, SelectItem, SelectItemVisibilities, SDK_Globals, SavedQueryCacheService, SearchEngine, QueryOperators } from '@topconsultnpm/sdk-ts';
 import styled from 'styled-components';
 import TMSearchQueryEditor from './TMSearchQueryEditor';
@@ -11,7 +11,6 @@ import { StyledModalContainer } from '../../base/Styled';
 import ShowAlert from '../../base/TMAlert';
 import TMButton from '../../base/TMButton';
 import { useDeviceType, DeviceType } from '../../base/TMDeviceProvider';
-import TMDropDownMenu from '../../base/TMDropDownMenu';
 import { TMExceptionBoxManager } from '../../base/TMPopUp';
 import TMSpinner from '../../base/TMSpinner';
 import TMPanel from '../../base/TMPanel';
@@ -19,6 +18,7 @@ import TMDistinctValues from '../../choosers/TMDistinctValues';
 import { TMMetadataChooserForm } from '../../choosers/TMMetadataChooser';
 import TMQueryEditor from '../../query/TMQueryEditor';
 import TMSavedQueryForm from './TMSavedQueryForm';
+import { ContextMenu } from '../../NewComponents/ContextMenu';
 import { AdvancedMenuButtons } from '../../editors/TMMetadataValues';
 import TMToppyMessage from '../../../helper/TMToppyMessage';
 const TMSearchQueryPanel = ({ fromDTD, showBackToResultButton, isExpertMode = SDKUI_Globals.userSettings.advancedSettings.expertMode === 1, SQD, inputMids, onSearchCompleted, onSqdSaved, onBack, onClosePanel, allowMaximize = true, onMaximizePanel, onBackToResult, passToArchiveCallback }) => {
@@ -299,20 +299,21 @@ const TMSearchQueryPanel = ({ fromDTD, showBackToResultButton, isExpertMode = SD
         }
         setQd({ ...qd, orderBy: newOrderBy });
     }, [qd, fromDTD?.metadata, SQD?.masterTID]);
+    const contextMenuItems = useMemo(() => [
+        ...(showBackToResultButton ? [{ icon: _jsx(IconArrowRight, {}), name: "Vai a risultato", onClick: () => { onBackToResult?.(); } }] : []),
+        { icon: _jsx(IconAddCircleOutline, {}), name: SDKUI_Localizator.SavedQueryNew, beginGroup: showBackToResultButton, onClick: () => { openSqdForm(FormModes.Create); } },
+        { icon: _jsx(IconEdit, {}), name: SDKUI_Localizator.SavedQueryUpdate, disabled: (SQD && SQD.id == 1), onClick: () => { openSqdForm(FormModes.Update); } },
+        { icon: showAdvancedSearch ? _jsx(IconEasy, {}) : _jsx(IconAdvanced, {}), beginGroup: true, name: showAdvancedSearch ? SDKUI_Localizator.Search_Easy : SDKUI_Localizator.Search_Advanced, onClick: () => { changeAdvancedSearchAsync(!showAdvancedSearch); } },
+        { icon: _jsx(IconEdit, {}), name: `${SDKUI_Localizator.Configure} - ${SDK_Localizator.QueryWhere}`, beginGroup: true, onClick: () => { setShowFiltersConfig(true); } },
+        { icon: _jsx(IconEdit, {}), name: `${SDKUI_Localizator.Configure} - ${SDK_Localizator.QuerySelect}`, onClick: () => { setShowOutputConfig(true); } },
+        { icon: _jsx(IconEdit, {}), name: `${SDKUI_Localizator.Configure} - ${SDK_Localizator.QueryOrderBy}`, onClick: () => { setShowOrderByConfig(true); } },
+        { icon: _jsx(IconMenuCAArchive, { viewBox: '11 11.5 26 27', fontSize: 16, strokeWidth: 2, color: 'black' }), beginGroup: true, name: SDKUI_Localizator.PassToArchive, onClick: handlePassToArchive }
+    ], [showBackToResultButton, showAdvancedSearch, SQD, onBackToResult, openSqdForm, changeAdvancedSearchAsync, setShowFiltersConfig, setShowOutputConfig, setShowOrderByConfig, handlePassToArchive]);
     const captionText = showAllMdWhere ? SDKUI_Localizator.ShowLess : SDKUI_Localizator.ShowAll;
     let maxItems = getListMaxItems(deviceType ?? DeviceType.DESKTOP);
     const diff = (qd?.where?.length ?? 0) - maxItems;
     return (_jsxs(_Fragment, { children: [_jsxs(TMPanel, { title: fromDTD?.nameLoc ?? SDKUI_Localizator.Search_Metadata, allowMaximize: allowMaximize, onMaximize: onMaximizePanel, onHeaderDoubleClick: onMaximizePanel, onBack: onBack, onActiveChanged: handlePanelActiveChanged, toolbar: _jsx(_Fragment, { children: (SQD && !showSqdForm) ?
-                        _jsx(TMDropDownMenu, { backgroundColor: 'white', borderRadius: '3px', content: _jsx(TMButton, { btnStyle: 'icon', caption: 'Altro', icon: _jsx(IconMenuVertical, { color: 'white' }), showTooltip: false, onClick: () => setIsQueryPanelActive(true) }), items: [
-                                ...(showBackToResultButton ? [{ icon: _jsx(IconArrowRight, {}), text: "Vai a risultato", onClick: () => { onBackToResult?.(); } }] : []),
-                                { icon: _jsx(IconAddCircleOutline, {}), beginGroup: true, text: SDKUI_Localizator.SavedQueryNew, onClick: () => { openSqdForm(FormModes.Create); } },
-                                { icon: _jsx(IconEdit, {}), text: SDKUI_Localizator.SavedQueryUpdate, disabled: (SQD && SQD.id == 1), onClick: () => { openSqdForm(FormModes.Update); } },
-                                { icon: showAdvancedSearch ? _jsx(IconEasy, {}) : _jsx(IconAdvanced, {}), beginGroup: true, text: showAdvancedSearch ? SDKUI_Localizator.Search_Easy : SDKUI_Localizator.Search_Advanced, onClick: () => { changeAdvancedSearchAsync(!showAdvancedSearch); } },
-                                { icon: _jsx(IconEdit, {}), beginGroup: true, text: `${SDKUI_Localizator.Configure} - ${SDK_Localizator.QueryWhere}`, onClick: () => { setShowFiltersConfig(true); } },
-                                { icon: _jsx(IconEdit, {}), text: `${SDKUI_Localizator.Configure} - ${SDK_Localizator.QuerySelect}`, onClick: () => { setShowOutputConfig(true); } },
-                                { icon: _jsx(IconEdit, {}), text: `${SDKUI_Localizator.Configure} - ${SDK_Localizator.QueryOrderBy}`, onClick: () => { setShowOrderByConfig(true); } },
-                                { icon: _jsx(IconMenuCAArchive, { viewBox: '11 11.5 26 27', fontSize: 16, strokeWidth: 2, color: 'black' }), beginGroup: true, text: SDKUI_Localizator.PassToArchive, onClick: handlePassToArchive }
-                            ], onMenuShown: () => setIsQueryPanelActive(true) })
+                        _jsx(ContextMenu, { items: contextMenuItems, trigger: "left", children: _jsx(TMButton, { btnStyle: 'icon', caption: 'Altro', icon: _jsx(IconMenuVertical, { color: 'white' }), showTooltip: false, onClick: () => setIsQueryPanelActive(true) }) })
                         : _jsx(_Fragment, {}) }), children: [_jsx(ConfirmQueryParamsDialog, {}), SQD
                         ? _jsxs("div", { onContextMenu: (e) => e.preventDefault(), style: { height: '100%', width: '100%', position: 'relative', display: 'flex', flexDirection: 'column', gap: 5 }, children: [showAdvancedSearch
                                     ? _jsx(TMQueryEditor, { formMode: FormModes.Update, showToolbar: false, inputData: qd, validateSelect: true, showApply: false, onQDChanged: handleQdChanged })