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

package/lib/helper/TMAppUpdatedModal.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TMAppUpdatedModal: () => React.JSX.Element | null;

package/lib/helper/TMAppUpdatedModal.js

@@ -0,0 +1,134 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from 'react';
+import styled from 'styled-components';
+import { AppModules, SDK_Globals } from '@topconsultnpm/sdk-ts';
+import { useDeviceType, TMModal } from '../components';
+import { calcResponsiveSizes, WHATS_NEWS_LINK_URL } from './helpers';
+import { SDKUI_Globals } from './SDKUI_Globals';
+import { SDKUI_Localizator } from './SDKUI_Localizator';
+import { IconUpdate, IconOpenInNew } from './TMIcons';
+import { getAppModuleButtonColors } from './TMUtils';
+const Content = styled.div `
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    background-color: #ffffff;
+`;
+const Header = styled.div `
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 14px;
+    padding: 32px 30px 26px 30px;
+    background-color: ${({ $backgroundColor }) => $backgroundColor};
+    color: #ffffff;
+    text-align: center;
+`;
+const HeaderIcon = styled.div `
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 68px;
+    height: 68px;
+    border-radius: 50%;
+    background-color: rgba(255, 255, 255, 0.18);
+    border: 1px solid rgba(255, 255, 255, 0.35);
+    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
+`;
+const HeaderTitle = styled.h2 `
+    margin: 0;
+    font-size: 22px;
+    font-weight: 600;
+    letter-spacing: 0.2px;
+`;
+const VersionBadge = styled.span `
+    display: inline-block;
+    padding: 4px 12px;
+    border-radius: 999px;
+    background-color: rgba(255, 255, 255, 0.22);
+    border: 1px solid rgba(255, 255, 255, 0.4);
+    font-size: 13px;
+    font-weight: 600;
+    letter-spacing: 0.3px;
+`;
+const Body = styled.div `
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    padding: 26px 30px 22px 30px;
+    text-align: center;
+`;
+const Message = styled.p `
+    margin: 0;
+    font-size: 15px;
+    line-height: 1.6;
+    color: #242424;
+`;
+const SubMessage = styled.p `
+    margin: 0;
+    font-size: 13px;
+    line-height: 1.6;
+    color: #6b6b6b;
+`;
+const Footer = styled.div `
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 12px;
+    padding: 0 30px 28px 30px;
+`;
+const BaseButton = styled.button `
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    min-width: 150px;
+    padding: 10px 18px;
+    border-radius: 8px;
+    font-size: 14px;
+    font-weight: 600;
+    cursor: pointer;
+    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
+`;
+const PrimaryButton = styled(BaseButton) `
+    border: 1px solid ${({ $base }) => $base};
+    background-color: ${({ $base }) => $base};
+    color: #ffffff;
+
+    &:hover {
+        background-color: ${({ $hover }) => $hover};
+        border-color: ${({ $hover }) => $hover};
+        box-shadow: 0 2px 8px ${({ $shadow }) => $shadow};
+    }
+`;
+const SecondaryButton = styled(BaseButton) `
+    border: 1px solid #d5d5d5;
+    background-color: #ffffff;
+    color: #444444;
+
+    &:hover {
+        background-color: #f3f3f3;
+        border-color: #bdbdbd;
+    }
+`;
+export const TMAppUpdatedModal = () => {
+    const deviceType = useDeviceType();
+    const currentVersion = SDK_Globals.appVersion ?? '';
+    const appModuleID = SDK_Globals.tmSession?.SessionDescr?.appModuleID ?? AppModules.SURFER;
+    const appModuleColors = useMemo(() => getAppModuleButtonColors(appModuleID), [appModuleID]);
+    const [previousVersion] = useState(() => SDKUI_Globals.userSettings.lastSeenAppVersion ?? '');
+    const [isOpen, setIsOpen] = useState(() => currentVersion !== '' && previousVersion !== currentVersion);
+    useEffect(() => {
+        if (!isOpen)
+            return;
+        SDKUI_Globals.userSettings.lastSeenAppVersion = currentVersion;
+    }, [isOpen, currentVersion]);
+    const onClose = () => { setIsOpen(false); };
+    if (!isOpen)
+        return null;
+    return (_jsx(TMModal, { width: calcResponsiveSizes(deviceType, '520px', '520px', '95%'), height: 'auto', showHeader: false, resizable: false, onClose: onClose, children: _jsxs(Content, { children: [_jsxs(Header, { "$backgroundColor": appModuleColors.base, children: [_jsx(HeaderIcon, { children: _jsx(IconUpdate, { fontSize: 34 }) }), _jsx(HeaderTitle, { children: SDKUI_Localizator.AppUpdatedTitle }), _jsx(VersionBadge, { children: `${SDK_Globals.appModule} ${currentVersion}` })] }), _jsxs(Body, { children: [_jsx(Message, { children: previousVersion
+                                ? SDKUI_Localizator.AppUpdatedMessageFromTo.replaceParams(previousVersion, currentVersion)
+                                : SDKUI_Localizator.AppUpdatedMessage.replaceParams(currentVersion) }), _jsx(SubMessage, { children: SDKUI_Localizator.AppUpdatedSubMessage })] }), _jsxs(Footer, { children: [_jsxs(PrimaryButton, { "$base": appModuleColors.base, "$hover": appModuleColors.hover, "$shadow": appModuleColors.shadow, onClick: () => window.open(WHATS_NEWS_LINK_URL, '_blank', 'noopener,noreferrer'), children: [_jsx(IconOpenInNew, { fontSize: 18 }), SDKUI_Localizator.DiscoverWhatsNew] }), _jsx(SecondaryButton, { onClick: onClose, children: SDKUI_Localizator.Close })] })] }) }));
+};

package/lib/helper/TMIcons.d.ts

@@ -271,6 +271,7 @@ export declare function IconWizard4(props: React.SVGProps<SVGSVGElement>): React
 export declare function IconNew(props: React.SVGProps<SVGSVGElement>): React.JSX.Element;
 export declare function IconFileOpenOutline(props: Readonly<React.SVGProps<SVGSVGElement>>): React.JSX.Element;
 export declare function IconArchiveDetail(props: React.SVGProps<SVGSVGElement>): React.JSX.Element;
+export declare function IconArchiveMultipleDetailDocuments(props: React.SVGProps<SVGSVGElement>): React.JSX.Element;
 export declare function IconArchiveMaster(props: React.SVGProps<SVGSVGElement>): React.JSX.Element;
 export declare function IconPair(props: React.SVGProps<SVGSVGElement>): React.JSX.Element;
 export declare function IconUnpair(props: React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/helper/TMIcons.js

@@ -673,6 +673,9 @@ export function IconFileOpenOutline(props) {
 export function IconArchiveDetail(props) {
     return (_jsxs("svg", { fontSize: props.fontSize ?? FONTSIZE, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "1em", height: "1em", ...props, children: [" ", _jsx("path", { fill: "currentColor", d: "m20.54 5.23l-1.39-1.68C18.88 3.21 18.47 3 18 3H6c-.47 0-.88.21-1.16.55L3.46 5.23C3.17 5.57 3 6.02 3 6.5V19c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6.5c0-.48-.17-.93-.46-1.27M12 17.5L6.5 12H10v-2h4v2h3.5zM5.12 5l.81-1h12l.94 1z" }), " "] }));
 }
+export function IconArchiveMultipleDetailDocuments(props) {
+    return (_jsxs("svg", { fontSize: props.fontSize ?? FONTSIZE, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48", width: "1em", height: "1em", ...props, children: [_jsx("path", { fill: "currentColor", d: "M40,35v5H8v-5H4v5c0,2.2,1.8,4,4,4h32c2.2,0,4-1.8,4-4v-5H40z" }), _jsxs("g", { fill: "currentColor", children: [_jsx("polygon", { points: "24,23.4 17,15 31,15" }), _jsx("rect", { x: "22", y: "4", width: "4", height: "14" }), _jsx("path", { d: "M31.5,26.9L30.8,28l3.5,1.9l0.6-1.2c1.6-3,2.6-4.7,3.5-5.2C39.3,23,41,23,44,23v-4C36.3,19,35.6,19.4,31.5,26.9z" }), _jsx("polygon", { points: "38.4,31 29.4,35 28,25" }), _jsx("path", { d: "M16.5,26.9l0.6,1.2L13.6,30L13,28.8c-1.6-3-2.6-4.7-3.5-5.2C8.7,23,7,23,4,23v-4C11.7,19,12.4,19.4,16.5,26.9z" }), _jsx("polygon", { points: "20,25 18.6,35 9.6,31" })] })] }));
+}
 export function IconArchiveMaster(props) {
     return (_jsxs("svg", { fontSize: props.fontSize ?? FONTSIZE, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "1em", height: "1em", ...props, children: [" ", _jsx("path", { fill: "currentColor", d: "m20.55 5.22l-1.39-1.68A1.51 1.51 0 0 0 18 3H6c-.47 0-.88.21-1.15.55L3.46 5.22C3.17 5.57 3 6.01 3 6.5V19a2 2 0 0 0 2 2h14c1.1 0 2-.9 2-2V6.5c0-.49-.17-.93-.45-1.28M12 9.5l5.5 5.5H14v2h-4v-2H6.5zM5.12 5l.82-1h12l.93 1z" }), " "] }));
 }

package/lib/helper/TMUtils.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { FileItem } from '../components';
-import { AppModules, DataColumnDescriptor, DcmtTypeDescriptor, MetadataDescriptor, PdGs, SearchResultDescriptor } from '@topconsultnpm/sdk-ts';
+import { AppModules, DataColumnDescriptor, DcmtTypeDescriptor, MetadataDescriptor, MetadataFormats, PdGs, SearchResultDescriptor } from '@topconsultnpm/sdk-ts';
 /**
  * Estensioni di firma/marca temporale note che possono avvolgere altre estensioni.
  * Es: file.pdf.p7m, file.xml.p7m, file.docx.p7m, file.xml.p7m.ts
@@ -42,22 +42,41 @@ export declare const isCreateCertificateEnabled: (widgetsString: string) => bool
 export declare const isPdfEditorEnabled: (widgetsString: string) => boolean;
 /** Verifica se l'editor PDF è disponibile: richiede file PDF, licenza attiva e widget abilitato sul tipo documento. */
 export declare const isPdfEditorAvailable: (fromDTD: DcmtTypeDescriptor | undefined, ext: string | undefined) => boolean;
+/** Verifica se il tipo documento è quello delle bozze dei gruppi di lavoro. */
+export declare const isDraftsDTD: (dtd: DcmtTypeDescriptor | undefined) => boolean;
+/** Verifica se il tipo documento non è autorizzato per l'utente corrente. */
+export declare const isNotGrantedDTD: (dtd: DcmtTypeDescriptor | undefined) => boolean;
+/** Verifica se il tipo documento è quello delle bozze dei gruppi di lavoro non autorizzato, e quindi privo di permessi. */
+export declare const isNotGrantedDraftsDTD: (dtd: DcmtTypeDescriptor | undefined) => boolean;
 interface TabItemProps {
     $isSelected: boolean;
     $activeGradient?: string;
 }
-export declare const StyledTabItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof TabItemProps> & TabItemProps, never> & Partial<Pick<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof TabItemProps> & TabItemProps, never>>> & string;
-export declare const StyledTabIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, keyof TabItemProps> & TabItemProps, never> & Partial<Pick<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, keyof TabItemProps> & TabItemProps, never>>> & string;
-export declare const TMCountBadge: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const StyledTabItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
+    style?: React.CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
+}, TabItemProps>> & string;
+export declare const StyledTabIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "style"> & {
+    style?: React.CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
+}, TabItemProps>> & string;
+export declare const TMCountBadge: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
+    style?: React.CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
+}> & string;
 export declare const PDGS_COLORS: {
     DOSSIER: string;
     DOCUMENT: string;
     WORKING_GROUP: string;
+    /** Istanza di CaseFlow: viola, per non confonderla ne' con la pratica (arancio) ne' con il gruppo di lavoro (verde). */
+    CASEFLOW: string;
 };
 export declare const getPdgsIconMap: (fontSize?: number) => Map<PdGs, JSX.Element>;
 export declare const convertSearchResultDescriptorToFileItems: (documents: Array<SearchResultDescriptor>) => Array<FileItem>;
 export declare const getAppModuleGradient: (appModuleID: AppModules) => string;
 export declare const getPanelManagerToolbarColor: (appModuleID: AppModules) => string;
+export declare const getAppModuleButtonColors: (appModuleID: AppModules) => {
+    base: string;
+    hover: string;
+    shadow: string;
+};
 export declare const getFileManagerFolderColor: (appModuleID: AppModules) => string;
 type SearchToolbarVisibility = {
     tmSearchResult: boolean;
@@ -109,4 +128,32 @@ export declare enum DcmtDisplayNameMethod {
  * Se i metadati non sono presenti nel dtd, li recupera dalla cache.
  */
 export declare const getDTDDisplayNameInfo: (dtd: DcmtTypeDescriptor | undefined) => Promise<string>;
+export declare const getCurrencySymbol: (format: MetadataFormats | undefined) => string | undefined;
+/** Estrae Format e FormatCulture dalle proprietà estese di una colonna. */
+export declare const getColumnFormatInfo: (col: DataColumnDescriptor) => {
+    format: MetadataFormats;
+    formatCulture: string;
+};
+/**
+ * Restituisce il pattern di formato DevExtreme per DateBox basato su MetadataFormats e cultura.
+ * Usa la stessa logica di formatDateTimeByMetadataFormat per garantire coerenza.
+ * Supporta: IT (it-IT), GB (en-GB), US (en-US), JP (ja-JP)
+ */
+export declare const getDevExtremeDateDisplayFormat: (format: MetadataFormats | undefined, formatCulture?: string) => string;
+/** Formatta una data secondo MetadataFormats e cultura. */
+export declare const formatDateTimeByMetadataFormat: (value: Date, format: MetadataFormats | undefined, formatCulture: string | undefined | null) => string;
+/** Formatta un numero secondo MetadataFormats e cultura. Valute con simbolo e 2 decimali (0 per Yen). */
+export declare const formatNumberByMetadataFormat: (value: number | string, format: MetadataFormats | undefined, formatCulture: string) => string;
+/** Converte un valore in data locale. Restituisce il valore originale se il parsing fallisce. */
+export declare const safeParseDateToLocaleString: (value: any) => string;
+/**
+ * Trova un DataColumnDescriptor corrispondente a un dataField (formato TID_MID).
+ * Cerca prima per MID nelle extendedProperties, poi per caption.
+ */
+export declare const findDataColumnByField: (columns: DataColumnDescriptor[], dataField: string | undefined, caption?: string) => DataColumnDescriptor | undefined;
+/**
+ * Formatta un valore per l'export in base al tipo di colonna.
+ * Gestisce date, numeri e valute secondo il formato definito nella colonna.
+ */
+export declare const formatValueForExport: (value: any, dataCol: DataColumnDescriptor | undefined, fallbackDataType?: string) => string;
 export {};

package/lib/helper/TMUtils.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import styled from "styled-components";
 import { TMTooltip } from '../components';
 import { IconCADossier, IconKey, IconMenuCAWorkingGroups } from './TMIcons';
-import { AccessLevels, AppModules, DataListCacheService, DcmtTypeListCacheService, LicenseModuleStatus, MetadataDataDomains, PdGs, SDK_Globals, SystemMIDs } from '@topconsultnpm/sdk-ts';
+import { AccessLevels, AppModules, DataColumnTypes, DataListCacheService, DcmtTypeListCacheService, LicenseModuleStatus, MetadataDataDomains, MetadataFormats, PdGs, SDK_Globals, SystemMIDs, SystemTIDs } from '@topconsultnpm/sdk-ts';
 import { SDKUI_Localizator } from './SDKUI_Localizator';
 /**
  * Estensioni di firma/marca temporale note che possono avvolgere altre estensioni.
@@ -242,6 +242,14 @@ export const isPdfEditorAvailable = (fromDTD, ext) => {
     const isPdfEditorLicensed = SDK_Globals?.license?.dcmtArchiveLicenses?.[0]?.siX_60007?.status === LicenseModuleStatus.Licensed;
     return isPdfEditorLicensed && isPdfEditorEnabled(fromDTD.widgets);
 };
+/** Valore di customData2 con cui il server marca i tipi documento non autorizzati per l'utente corrente. */
+const NOT_GRANTED_DTD = 'NOTGRANTED';
+/** Verifica se il tipo documento è quello delle bozze dei gruppi di lavoro. */
+export const isDraftsDTD = (dtd) => dtd?.id === SystemTIDs.Drafts;
+/** Verifica se il tipo documento non è autorizzato per l'utente corrente. */
+export const isNotGrantedDTD = (dtd) => dtd?.customData2 === NOT_GRANTED_DTD;
+/** Verifica se il tipo documento è quello delle bozze dei gruppi di lavoro non autorizzato, e quindi privo di permessi. */
+export const isNotGrantedDraftsDTD = (dtd) => !!dtd && !dtd.perm && isDraftsDTD(dtd) && isNotGrantedDTD(dtd);
 export const StyledTabItem = styled.div `
   display: flex;
   align-items: center;
@@ -270,6 +278,8 @@ export const PDGS_COLORS = {
     DOSSIER: '#e65b00',
     DOCUMENT: '#b38600',
     WORKING_GROUP: '#009700',
+    /** Istanza di CaseFlow: viola, per non confonderla ne' con la pratica (arancio) ne' con il gruppo di lavoro (verde). */
+    CASEFLOW: '#6a3fb5',
 };
 export const getPdgsIconMap = (fontSize = 20) => {
     return new Map([
@@ -336,7 +346,7 @@ export const getAppModuleGradient = (appModuleID) => {
         case AppModules.SURFER:
             return 'linear-gradient(270deg, #46B5A2 16%, #3BAABC 34%, #3BAABC 34%, #3681AD 54%, #3368A5 72%, #2F549D 88%, #304F99 100%)';
         case AppModules.DESIGNER:
-            return 'linear-gradient(270deg, #A06A8E 16%, #885C77 34%, #6F4C5F 54%, #5A3446 72%, #482234 100%);';
+            return 'linear-gradient(270deg, #A06A8E 16%, #885C77 34%, #6F4C5F 54%, #5A3446 72%, #482234 100%)';
         case AppModules.ORCHESTRATOR:
             return 'linear-gradient(270deg, #46B5A2 16%, #3BAA8A 34%, #2F8F6F 54%, #277A5A 72%, #216948 88%, #1d6f42 100%)';
         default:
@@ -355,6 +365,18 @@ export const getPanelManagerToolbarColor = (appModuleID) => {
             return 'transparent linear-gradient(90deg, #CCE0F4 0%, #7EC1E7 14%, #39A6DB 28%, #1E9CD7 35%, #0075BE 78%, #005B97 99%) 0% 0% no-repeat padding-box';
     }
 };
+export const getAppModuleButtonColors = (appModuleID) => {
+    switch (appModuleID) {
+        case AppModules.SURFER:
+            return { base: '#2559a5', hover: '#1c4783', shadow: 'rgba(37, 89, 165, 0.35)' };
+        case AppModules.DESIGNER:
+            return { base: '#482234', hover: '#351826', shadow: 'rgba(72, 34, 52, 0.35)' };
+        case AppModules.ORCHESTRATOR:
+            return { base: '#1d6f42', hover: '#15532f', shadow: 'rgba(29, 111, 66, 0.35)' };
+        default:
+            return { base: '#2559a5', hover: '#1c4783', shadow: 'rgba(37, 89, 165, 0.35)' };
+    }
+};
 export const getFileManagerFolderColor = (appModuleID) => {
     switch (appModuleID) {
         case AppModules.SURFER:
@@ -439,16 +461,10 @@ export const buildDcmtDisplayName = (obj) => {
         if (!obj)
             return [];
         const sysAbstractKey = Object.keys(obj).find(k => k.toUpperCase() === 'SYS_ABSTRACT');
-        if (sysAbstractKey) {
-            if (obj[sysAbstractKey]?.value) {
-                return [sysAbstractKey];
-            }
-            // SYS_Abstract esiste ma è vuoto: usa DID se presente, altrimenti continua con la logica standard
-            const didKey = Object.keys(obj).find(k => k.toUpperCase() === 'DID');
-            if (didKey && obj[didKey]?.value) {
-                return [didKey];
-            }
+        if (sysAbstractKey && obj[sysAbstractKey]?.value) {
+            return [sysAbstractKey];
         }
+        // SYS_Abstract esiste ma è vuoto: continua con la logica standard
         const keys = Object.keys(obj);
         const sysMIDs = Object.values(SystemMIDs).map(o => o.toUpperCase());
         const viewableMetadataKeys = keys.filter(k => obj?.[k]?.value &&
@@ -461,6 +477,7 @@ export const buildDcmtDisplayName = (obj) => {
         if (specialOutputKeys.length > 0) {
             return specialOutputKeys;
         }
+        // Se non ci sono metadati speciali, restituisci i primi 5 metadati non di sistema con permesso canView
         if (viewableMetadataKeys.length > 0) {
             return viewableMetadataKeys.slice(0, 5);
         }
@@ -533,3 +550,247 @@ export const getDTDDisplayNameInfo = async (dtd) => {
         return SDKUI_Localizator.DisplayNameMethod_Top5;
     }
 };
+export const getCurrencySymbol = (format) => {
+    switch (format) {
+        case MetadataFormats.CurrencyEuro: return '€';
+        case MetadataFormats.CurrencyDollar: return '$';
+        case MetadataFormats.CurrencyPound: return '£';
+        case MetadataFormats.CurrencyYen: return '¥';
+        default: return undefined;
+    }
+};
+/** Estrae Format e FormatCulture dalle proprietà estese di una colonna. */
+export const getColumnFormatInfo = (col) => {
+    const format = MetadataFormats[(col.extendedProperties?.["Format"] ?? "None")];
+    const formatCulture = col.extendedProperties?.["FormatCulture"] ?? window.navigator.language;
+    return { format, formatCulture };
+};
+/**
+ * Restituisce il pattern di formato DevExtreme per DateBox basato su MetadataFormats e cultura.
+ * Usa la stessa logica di formatDateTimeByMetadataFormat per garantire coerenza.
+ * Supporta: IT (it-IT), GB (en-GB), US (en-US), JP (ja-JP)
+ */
+export const getDevExtremeDateDisplayFormat = (format, formatCulture) => {
+    try {
+        const culture = (formatCulture ?? window.navigator.language).toLowerCase();
+        const isItalian = culture === 'it-it' || culture.startsWith('it');
+        const isUS = culture === 'en-us';
+        const isGB = culture === 'en-gb';
+        const isJP = culture === 'ja-jp' || culture.startsWith('ja');
+        // Formati data base per cultura (coerenti con formatDateTimeByMetadataFormat)
+        const getShortDate = () => {
+            if (isItalian)
+                return 'dd/MM/yyyy'; // 17/07/2026
+            if (isUS)
+                return 'M/d/yyyy'; // 7/17/2026
+            if (isGB)
+                return 'dd/MM/yyyy'; // 17/07/2026
+            if (isJP)
+                return 'yyyy/MM/dd'; // 2026/07/17
+            return 'dd/MM/yyyy'; // default
+        };
+        const getLongDate = () => {
+            if (isItalian)
+                return 'EEEE d MMMM yyyy'; // lunedì 17 luglio 2026
+            if (isUS)
+                return 'EEEE, MMMM d, yyyy'; // Monday, July 17, 2026
+            if (isGB)
+                return 'd MMMM yyyy'; // 17 July 2026 (senza weekday)
+            if (isJP)
+                return 'yyyy年M月d日'; // 2026年7月17日 (senza weekday)
+            return 'd MMMM yyyy'; // default (senza weekday)
+        };
+        // Formati ora per cultura (US usa 12h con AM/PM, altri usano 24h)
+        const getShortTime = () => {
+            if (isUS)
+                return 'h:mm a'; // 3:30 PM
+            return 'HH:mm'; // 15:30
+        };
+        const getLongTime = () => {
+            if (isUS)
+                return 'h:mm:ss a'; // 3:30:45 PM
+            return 'HH:mm:ss'; // 15:30:45
+        };
+        const shortDate = getShortDate();
+        const longDate = getLongDate();
+        const shortTime = getShortTime();
+        const longTime = getLongTime();
+        switch (format) {
+            case MetadataFormats.ShortDate:
+                return shortDate;
+            case MetadataFormats.LongDate:
+                return longDate;
+            case MetadataFormats.ShortTime:
+                return shortTime;
+            case MetadataFormats.LongTime:
+                return longTime;
+            case MetadataFormats.ShortDateShortTime:
+                return `${shortDate} ${shortTime}`;
+            case MetadataFormats.ShortDateLongTime:
+                return `${shortDate} ${longTime}`;
+            case MetadataFormats.LongDateShortTime:
+                return `${longDate} ${shortTime}`;
+            case MetadataFormats.LongDateLongTime:
+                return `${longDate} ${longTime}`;
+            default:
+                return shortDate;
+        }
+    }
+    catch {
+        // Fallback: restituisce formato data breve di default
+        return 'dd/MM/yyyy';
+    }
+};
+/** Formatta una data secondo MetadataFormats e cultura. */
+export const formatDateTimeByMetadataFormat = (value, format, formatCulture) => {
+    try {
+        // Fallback sicuro per formatCulture
+        const safeCulture = (formatCulture && typeof formatCulture === 'string' && formatCulture.trim()) ? formatCulture.trim() : window.navigator.language;
+        const culture = safeCulture.toLowerCase();
+        // Culture che includono il giorno della settimana nei formati lunghi
+        const includeWeekday = culture === 'it-it' || culture === 'en-us';
+        // Opzioni per data lunga (con o senza giorno settimana)
+        const longDateOptions = includeWeekday
+            ? { weekday: "long", year: "numeric", month: "long", day: "numeric" }
+            : { year: "numeric", month: "long", day: "numeric" };
+        // Opzioni ShortDate: IT usa dd/MM/yyyy, US usa M/d/yyyy (anno a 4 cifre), altri usano dateStyle: 'short'
+        const getShortDateOptions = () => {
+            if (culture === "it-it")
+                return { year: "numeric", month: "2-digit", day: "2-digit" };
+            if (culture === "en-us")
+                return { year: "numeric", month: "numeric", day: "numeric" };
+            return { dateStyle: 'short' };
+        };
+        switch (format) {
+            case MetadataFormats.ShortDate:
+                return value.toLocaleString(safeCulture, getShortDateOptions());
+            case MetadataFormats.ShortTime:
+                return value.toLocaleString(safeCulture, { timeStyle: 'short' });
+            case MetadataFormats.ShortDateLongTime:
+                if (culture === "it-it")
+                    return value.toLocaleString(safeCulture, { year: "numeric", month: "2-digit", day: "2-digit", hour: '2-digit', minute: '2-digit', second: '2-digit' }).replace(',', '');
+                if (culture === "en-us")
+                    return value.toLocaleString(safeCulture, { year: "numeric", month: "numeric", day: "numeric", hour: 'numeric', minute: '2-digit', second: '2-digit' }).replace(',', '');
+                return value.toLocaleString(safeCulture, { dateStyle: 'short', timeStyle: 'medium' }).replace(',', '');
+            case MetadataFormats.ShortDateShortTime:
+                if (culture === "it-it")
+                    return value.toLocaleString(safeCulture, { year: "numeric", month: "2-digit", day: "2-digit", hour: '2-digit', minute: '2-digit' }).replace(',', '');
+                if (culture === "en-us")
+                    return value.toLocaleString(safeCulture, { year: "numeric", month: "numeric", day: "numeric", hour: 'numeric', minute: '2-digit' }).replace(',', '');
+                return value.toLocaleString(safeCulture, { dateStyle: 'short', timeStyle: 'short' }).replace(',', '');
+            case MetadataFormats.LongDate:
+                return value.toLocaleString(safeCulture, longDateOptions);
+            case MetadataFormats.LongTime:
+                return value.toLocaleString(safeCulture, { timeStyle: 'medium' });
+            case MetadataFormats.LongDateLongTime: {
+                const datePart = value.toLocaleString(safeCulture, longDateOptions);
+                const timePart = value.toLocaleString(safeCulture, culture === "en-us" ? { hour: 'numeric', minute: '2-digit', second: '2-digit' } : { hour: '2-digit', minute: '2-digit', second: '2-digit' });
+                return `${datePart} ${timePart}`;
+            }
+            case MetadataFormats.LongDateShortTime: {
+                const datePart = value.toLocaleString(safeCulture, longDateOptions);
+                const timePart = value.toLocaleString(safeCulture, culture === "en-us" ? { hour: 'numeric', minute: '2-digit' } : { hour: '2-digit', minute: '2-digit' });
+                return `${datePart} ${timePart}`;
+            }
+            default:
+                return value.toLocaleString(safeCulture, getShortDateOptions());
+        }
+    }
+    catch {
+        // Fallback: restituisce la data in formato ISO se la conversione fallisce
+        return value?.toISOString?.() ?? String(value);
+    }
+};
+/** Formatta un numero secondo MetadataFormats e cultura. Valute con simbolo e 2 decimali (0 per Yen). */
+export const formatNumberByMetadataFormat = (value, format, formatCulture) => {
+    try {
+        const numValue = typeof value === 'number' ? value : Number(value);
+        if (isNaN(numValue))
+            return String(value);
+        const currencySymbol = getCurrencySymbol(format);
+        if (currencySymbol) {
+            const decimals = format === MetadataFormats.CurrencyYen ? 0 : 2;
+            return `${currencySymbol} ${numValue.toLocaleString(formatCulture, { useGrouping: true, minimumFractionDigits: decimals, maximumFractionDigits: decimals })}`;
+        }
+        return numValue.toLocaleString(formatCulture, { useGrouping: format == MetadataFormats.NumberWithThousandsSeparator });
+    }
+    catch {
+        // Fallback: restituisce il valore come stringa se la conversione fallisce
+        return String(value);
+    }
+};
+/** Converte un valore in data locale. Restituisce il valore originale se il parsing fallisce. */
+export const safeParseDateToLocaleString = (value) => {
+    try {
+        if (!value)
+            return value ?? '';
+        const parsedDate = new Date(value);
+        if (!isNaN(parsedDate.getTime())) {
+            return parsedDate.toLocaleDateString();
+        }
+    }
+    catch {
+        // Keep original value if parsing fails
+    }
+    return String(value ?? '');
+};
+/**
+ * Trova un DataColumnDescriptor corrispondente a un dataField (formato TID_MID).
+ * Cerca prima per MID nelle extendedProperties, poi per caption.
+ */
+export const findDataColumnByField = (columns, dataField, caption) => {
+    // Se l'array di colonne è vuoto/null o il dataField non è definito, ritorna undefined (nessuna corrispondenza possibile)
+    if (!columns || !dataField)
+        return undefined;
+    // Itera sulle colonne cercando la prima che soddisfa i criteri di matching
+    return columns.find(c => {
+        // Estrae il MID (Metadata ID) dalle proprietà estese della colonna corrente
+        const colMid = c.extendedProperties?.["MID"];
+        // Se la colonna ha un MID definito, prova a matchare per MID
+        if (colMid) {
+            // Converte il MID in stringa per il confronto
+            const midStr = String(colMid);
+            // Verifica se dataField termina con "_MID" (es: "123_456" dove 456 è il MID)
+            // oppure se dataField è esattamente uguale al MID (caso in cui dataField contiene solo il MID)
+            if (dataField.endsWith(`_${midStr}`) || dataField === midStr)
+                return true;
+        }
+        // Fallback: se il match per MID fallisce, prova a matchare per caption
+        // Confronta la caption della colonna con dataField o con il parametro caption opzionale
+        return c.caption === dataField || c.caption === caption;
+    });
+};
+/**
+ * Formatta un valore per l'export in base al tipo di colonna.
+ * Gestisce date, numeri e valute secondo il formato definito nella colonna.
+ */
+export const formatValueForExport = (value, dataCol, fallbackDataType) => {
+    try {
+        let result = value;
+        if (dataCol) {
+            const { format, formatCulture } = getColumnFormatInfo(dataCol);
+            // Date: il valore arriva come stringa e va prima convertito in Date
+            if (dataCol.dataType === DataColumnTypes.DateTime && result) {
+                const parsedDate = new Date(result);
+                if (!isNaN(parsedDate.getTime())) {
+                    result = formatDateTimeByMetadataFormat(parsedDate, format, formatCulture);
+                }
+            }
+            // Numeri (incluse valute)
+            if (dataCol.dataType === DataColumnTypes.Number && result !== null && result !== undefined && result !== '') {
+                result = formatNumberByMetadataFormat(result, format, formatCulture);
+            }
+        }
+        else {
+            // Fallback: formattazione base per date
+            if (fallbackDataType === 'datetime' && result) {
+                result = safeParseDateToLocaleString(result);
+            }
+        }
+        // Pulisci il valore: rimuovi doppi apici per evitare problemi CSV
+        return (result ?? '').toString().replace(/"/g, '');
+    }
+    catch {
+        return String(value ?? '');
+    }
+};

package/lib/helper/dataGridSearchHelper.d.ts

@@ -0,0 +1,28 @@
+import { MetadataFormats } from '@topconsultnpm/sdk-ts';
+/** Testo mostrato in una colonna per una riga: è quello su cui va cercato ciò che l'utente digita */
+export type SearchTextGetter = (rowData: any) => string;
+/** Testo con cui una data viene mostrata nella griglia: è quello che l'utente vede e quindi quello che cerca */
+export declare const getDateDisplayText: (value: any, format: MetadataFormats | undefined, formatCulture: string | undefined | null) => string;
+/** Testo con cui un numero viene mostrato nella griglia (separatore delle migliaia, valuta, decimali) */
+export declare const getNumberDisplayText: (value: any, format: MetadataFormats | undefined, formatCulture: string) => string;
+/**
+ * Dirotta la ricerca della griglia sul testo mostrato, per le colonne indicate (chiave: il `dataField`).
+ *
+ * La ricerca di DevExtreme lavora sul valore archiviato, quindi non trova nulla dove il testo mostrato è
+ * diverso:
+ * - **date**, che nei dati sono stringhe ISO: DevExtreme prova a interpretare il testo digitato con il
+ *   formato della colonna, non riesce (il formato è un formatter personalizzato, non un pattern) e scarta
+ *   la colonna dalla ricerca — cercando `29/01/2023` non trova nulla;
+ * - **numeri formattati**, per lo stesso motivo (separatore delle migliaia, simbolo di valuta);
+ * - **liste dati e utenti**, dove viene confrontata la chiave archiviata invece della descrizione
+ *   visualizzata — cercando `FATTURA` non trova nulla, cercando `TD01` sì.
+ *
+ * Da passare a `customizeColumns` della griglia. Va fatto lì perché solo lì è disponibile la
+ * `calculateFilterExpression` predefinita di DevExtreme, che resta in uso per il filtro di intestazione e
+ * per il generatore di filtri: quelli funzionano già correttamente e vanno lasciati intatti.
+ *
+ * @example
+ * const searchTextGetters = useMemo(() => new Map([['TM_1_2', (row) => getDateDisplayText(row?.TM_1_2, format, culture)]]), [...]);
+ * const customizeColumns = useMemo(() => customizeSearchByDisplayText(searchTextGetters), [searchTextGetters]);
+ */
+export declare const customizeSearchByDisplayText: (searchTextGetters: Map<string, SearchTextGetter>) => (columns: Array<any>) => void;