@topconsultnpm/sdkui-react-beta 6.11.49 → 6.11.51

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

@@ -78,6 +78,8 @@ export interface TMFileManagerProps {
     handleDropFileCallback?: (files: Array<File>) => void;
     /** JSX element representing the thumbnail view item for a file or folder */
     thumbnailsViewItemComponent?: (props: TMWGsDraftThumbViewItemProps) => JSX.Element;
+    /** Number of total founded */
+    dcmtsFound?: number;
 }
 declare const TMFileManager: (props: TMFileManagerProps) => import("react/jsx-runtime").JSX.Element;
 export default TMFileManager;

package/lib/components/base/TMFileManager.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import Toolbar, { Item as ToolbarItem } from 'devextreme-react/cjs/toolbar';
 import TreeView from 'devextreme-react/cjs/tree-view';
 import ScrollView from 'devextreme-react/cjs/scroll-view';
@@ -9,6 +9,8 @@ import { TMSearchBar } from '../sidebar/TMHeader';
 import TMButton from './TMButton';
 import TMDataGrid from './TMDataGrid';
 import { TMSplitterLayout } from './TMLayout';
+import { DeviceType, useDeviceType } from './TMDeviceProvider';
+import TMToolbarCard from './TMToolbarCard';
 export var TMFileManagerPageSize;
 (function (TMFileManagerPageSize) {
     TMFileManagerPageSize[TMFileManagerPageSize["Small"] = 30] = "Small";
@@ -17,7 +19,7 @@ export var TMFileManagerPageSize;
 })(TMFileManagerPageSize || (TMFileManagerPageSize = {}));
 const TMFileManager = (props) => {
     // Destructure the treeFs prop to get the root file system
-    const { treeFs, selectedFolder, selectedFiles, focusedFile, handleSelectedFiles, handleFocusedFile, handleSelectedFolder, viewMode: initialViewMode, contextMenuItems, onDoubleClickHandler, thumbnailsViewItemComponent, handleDropFileCallback } = props;
+    const { treeFs, selectedFolder, selectedFiles, focusedFile, handleSelectedFiles, handleFocusedFile, handleSelectedFolder, viewMode: initialViewMode, contextMenuItems, onDoubleClickHandler, thumbnailsViewItemComponent, handleDropFileCallback, dcmtsFound } = props;
     // State to manage the current view mode ('thumbnails' or 'details')
     const [viewMode, setViewMode] = useState(initialViewMode ?? 'thumbnails');
     // State to store the search text entered by the user
@@ -34,9 +36,15 @@ const TMFileManager = (props) => {
     const [isDragging, setIsDragging] = useState(false);
     // State to store context menu items for file manager actions
     const [menuItems, setMenuItems] = useState({ folder: [], file: [] });
-    // State to manage the anchor element for context menu positioning
+    // State to store the anchor element for the tree view context menu.
     const [treeViewAnchor, setTreeViewAnchor] = useState(null);
+    // State to store the anchor element for another view-related menu
     const [viewAnchor, setViewAnchor] = useState(null);
+    // Get the current device type (e.g., mobile, tablet, desktop) using a custom hook.
+    const deviceType = useDeviceType();
+    // This avoids unnecessary re-renders by only recalculating when deviceType changes.
+    let isMobile = useMemo(() => { return deviceType === DeviceType.MOBILE; }, [deviceType]);
+    const [openDraftList, setOpenDraftList] = useState(false);
     useEffect(() => {
         setMenuItems(contextMenuItems ?? { folder: [], file: [] });
     }, [contextMenuItems]);
@@ -158,6 +166,8 @@ const TMFileManager = (props) => {
             return;
         const clickedItemId = e.itemData.id;
         const item = clickedItemId === treeFs.id ? treeFs : findFileItems(treeFs.items, clickedItemId);
+        if (isMobile)
+            setOpenDraftList(true);
         handleSelectedFolder?.(item);
         handleFocusedFile?.(undefined);
         handleSelectedFiles?.([]);
@@ -186,12 +196,15 @@ const TMFileManager = (props) => {
         e.preventDefault();
         setIsDragging(false);
     };
+    const onBackCallback = () => {
+        setOpenDraftList(false);
+    };
     // Main render of the file manager component with a split layout
-    return _jsxs("div", { style: { display: "flex", flexDirection: "column", height: "100%", width: "100%" }, children: [_jsx(Toolbar, { style: { backgroundColor: '#f4f4f4', border: '2px solid #ccc', borderRadius: '8px', boxShadow: '0 4px 8px rgba(0,0,0,0.1)', height: "40px" }, children: _jsx(ToolbarItem, { location: "before", children: _jsx("div", { style: { paddingLeft: "5px", paddingRight: "5px" }, children: _jsx(TMButton, { caption: isLeftPanelCollapsed ? SDKUI_Localizator.ShowLeftPanel : SDKUI_Localizator.HideLeftPanel, btnStyle: 'toolbar', color: 'primaryOutline', icon: isLeftPanelCollapsed ? _jsx(IconHide, {}) : _jsx(IconShow, {}), onClick: () => setIsLeftPanelCollapsed(prev => !prev) }) }) }) }), _jsx("div", { style: {
-                    display: "flex",
-                    flexGrow: 1,
-                    height: "calc(100% - 40px)"
-                }, children: _jsxs(TMSplitterLayout, { direction: 'horizontal', showSeparator: true, separatorColor: 'transparent', separatorActiveColor: 'transparent', min: ['0', '0'], start: [isLeftPanelCollapsed ? '0%' : "50%", isLeftPanelCollapsed ? '100%' : "50%"], children: [_jsxs("div", { style: { height: "100%", width: "100%" }, onContextMenu: onTreeViewContextMenu, children: [_jsx(TreeView, { style: { marginTop: "10px" }, dataSource: treeViewData, displayExpr: "text", itemRender: renderTreeViewItem, onItemClick: handleTreeViewItemClick }), treeViewAnchor && _jsx(ContextMenu, { dataSource: menuItems.folder, target: treeViewAnchor, onHiding: closeTreeViewContextMenu })] }), _jsxs("div", { style: { backgroundColor: "#fff", width: "100%", height: "100%" }, children: [_jsxs(Toolbar, { style: { backgroundColor: '#f4f4f4', height: "40px", paddingLeft: "5px", paddingRight: '5px' }, children: [_jsx(ToolbarItem, { location: "before", children: _jsx(TMButton, { caption: viewMode === 'details' ? SDKUI_Localizator.PreviewView : SDKUI_Localizator.DetailsView, btnStyle: 'toolbar', color: 'primaryOutline', icon: viewMode === 'details' ? _jsx(IconDashboard, {}) : _jsx(IconList, {}), onClick: toggleViewMode }) }), _jsx(ToolbarItem, { location: "before", children: _jsx(TMSearchBar, { marginLeft: '0px', maxWidth: '160px', searchValue: searchText, onSearchValueChanged: (e) => handleSearchChange(e) }) })] }), _jsxs("div", { onDrop: handleDrop, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onContextMenu: onViewContextMenu, style: { width: "100%", height: "calc(100% - 40px)", border: isDragging ? '2px solid red' : '2px solid transparent' }, children: [viewMode === 'thumbnails' && _jsx(ThumbnailsView, { items: filteredFileItems, selectedFiles: selectedFiles, contextMenuItems: contextMenuItems?.file, handleSelectedFiles: handleSelectedFiles, handleFocusedFile: handleFocusedFile, onDoubleClickHandler: onDoubleClickHandler, thumbnailsViewItemComponent: thumbnailsViewItemComponent }), viewMode === 'details' && _jsx(DetailsView, { items: filteredFileItems, contextMenuItems: contextMenuItems?.file, selectedFiles: selectedFiles, focusedFile: focusedFile, handleSelectedFiles: handleSelectedFiles, handleFocusedFile: handleFocusedFile, onDoubleClickHandler: onDoubleClickHandler }), viewAnchor && _jsx(ContextMenu, { dataSource: menuItems.file, target: viewAnchor, onHiding: closeViewContextMenu })] })] })] }, "TMWGs-panels-treeView") })] });
+    return _jsxs("div", { style: { height: "100%", width: "100%" }, children: [!isMobile && _jsxs("div", { style: { flexDirection: "column", height: "100%", width: "100%", }, children: [_jsx(Toolbar, { style: { backgroundColor: '#f4f4f4', border: '2px solid #ccc', borderRadius: '8px', boxShadow: '0 4px 8px rgba(0,0,0,0.1)', height: "40px" }, children: _jsx(ToolbarItem, { location: "before", children: _jsx("div", { style: { paddingLeft: "5px", paddingRight: "5px" }, children: _jsx(TMButton, { caption: isLeftPanelCollapsed ? SDKUI_Localizator.ShowLeftPanel : SDKUI_Localizator.HideLeftPanel, btnStyle: 'toolbar', color: 'primaryOutline', icon: isLeftPanelCollapsed ? _jsx(IconHide, {}) : _jsx(IconShow, {}), onClick: () => setIsLeftPanelCollapsed(prev => !prev) }) }) }) }), _jsx("div", { style: {
+                            display: "flex",
+                            flexGrow: 1,
+                            height: "calc(100% - 40px)"
+                        }, children: _jsxs(TMSplitterLayout, { direction: 'horizontal', showSeparator: true, separatorColor: 'transparent', separatorActiveColor: 'transparent', min: ['0', '0'], start: [isLeftPanelCollapsed ? '0%' : "50%", isLeftPanelCollapsed ? '100%' : "50%"], children: [_jsxs("div", { style: { height: "100%", width: "100%" }, onContextMenu: onTreeViewContextMenu, children: [_jsx(TreeView, { style: { marginTop: "10px" }, dataSource: treeViewData, displayExpr: "text", itemRender: renderTreeViewItem, onItemClick: handleTreeViewItemClick }), treeViewAnchor && _jsx(ContextMenu, { id: 'treeViewContextMenuDesktop', dataSource: menuItems.folder, target: treeViewAnchor, onHiding: closeTreeViewContextMenu })] }), _jsxs("div", { style: { backgroundColor: "#fff", width: "100%", height: "100%" }, children: [_jsxs(Toolbar, { style: { backgroundColor: '#f4f4f4', height: "40px", paddingLeft: "5px", paddingRight: '5px' }, children: [_jsx(ToolbarItem, { location: "before", children: _jsx(TMButton, { caption: viewMode === 'details' ? SDKUI_Localizator.PreviewView : SDKUI_Localizator.DetailsView, btnStyle: 'toolbar', color: 'primaryOutline', icon: viewMode === 'details' ? _jsx(IconDashboard, {}) : _jsx(IconList, {}), onClick: toggleViewMode }) }), _jsx(ToolbarItem, { location: "before", children: _jsx(TMSearchBar, { marginLeft: '0px', maxWidth: '160px', searchValue: searchText, onSearchValueChanged: (e) => handleSearchChange(e) }) })] }), _jsxs("div", { onDrop: handleDrop, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onContextMenu: onViewContextMenu, style: { width: "100%", height: "calc(100% - 40px)", border: isDragging ? '2px solid red' : '2px solid transparent' }, children: [viewMode === 'thumbnails' && _jsx(ThumbnailsView, { items: filteredFileItems, selectedFiles: selectedFiles, contextMenuItems: menuItems.file, handleSelectedFiles: handleSelectedFiles, handleFocusedFile: handleFocusedFile, onDoubleClickHandler: onDoubleClickHandler, thumbnailsViewItemComponent: thumbnailsViewItemComponent }), viewMode === 'details' && _jsx(DetailsView, { items: filteredFileItems, contextMenuItems: menuItems.file, selectedFiles: selectedFiles, focusedFile: focusedFile, handleSelectedFiles: handleSelectedFiles, handleFocusedFile: handleFocusedFile, onDoubleClickHandler: onDoubleClickHandler }), viewAnchor && _jsx(ContextMenu, { id: 'fileContextMenuDesktop', dataSource: menuItems.file, target: viewAnchor, onHiding: closeViewContextMenu })] })] })] }, "TMWGs-panels-treeView") })] }), isMobile && _jsx("div", { style: { height: "100%", width: "100%" }, children: _jsxs(TMToolbarCard, { onBack: openDraftList ? onBackCallback : undefined, title: SDKUI_Localizator.Drafts, totalItems: dcmtsFound ?? 0, children: [_jsxs("div", { style: { display: openDraftList ? 'none' : 'block', transition: 'opacity 0.3s ease-in-out' }, children: [_jsx(TreeView, { style: { marginTop: "10px", }, dataSource: treeViewData, displayExpr: "text", itemRender: renderTreeViewItem, onItemClick: handleTreeViewItemClick }), treeViewAnchor && _jsx(ContextMenu, { id: 'treeViewContextMenuMobile', dataSource: menuItems.folder, target: treeViewAnchor, onHiding: closeTreeViewContextMenu })] }), _jsxs("div", { style: { backgroundColor: "#fff", width: "100%", height: "100%", display: openDraftList ? 'block' : 'none', transition: 'opacity 0.3s ease-in-out' }, children: [_jsxs(Toolbar, { style: { backgroundColor: '#f4f4f4', height: "40px", paddingLeft: "5px", paddingRight: '5px' }, children: [_jsx(ToolbarItem, { location: "before", children: _jsx(TMButton, { caption: viewMode === 'details' ? SDKUI_Localizator.PreviewView : SDKUI_Localizator.DetailsView, btnStyle: 'toolbar', color: 'primaryOutline', icon: viewMode === 'details' ? _jsx(IconDashboard, {}) : _jsx(IconList, {}), onClick: toggleViewMode }) }), _jsx(ToolbarItem, { location: "before", children: _jsx(TMSearchBar, { marginLeft: '0px', maxWidth: '160px', searchValue: searchText, onSearchValueChanged: (e) => handleSearchChange(e) }) })] }), _jsxs("div", { onDrop: handleDrop, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onContextMenu: onViewContextMenu, style: { width: "100%", height: "calc(100% - 40px)", border: isDragging ? '2px solid red' : '2px solid transparent' }, children: [viewMode === 'thumbnails' && _jsx(ThumbnailsView, { items: filteredFileItems, selectedFiles: selectedFiles, contextMenuItems: contextMenuItems?.file, handleSelectedFiles: handleSelectedFiles, handleFocusedFile: handleFocusedFile, onDoubleClickHandler: onDoubleClickHandler, thumbnailsViewItemComponent: thumbnailsViewItemComponent }), viewMode === 'details' && _jsx(DetailsView, { items: filteredFileItems, contextMenuItems: contextMenuItems?.file, selectedFiles: selectedFiles, focusedFile: focusedFile, handleSelectedFiles: handleSelectedFiles, handleFocusedFile: handleFocusedFile, onDoubleClickHandler: onDoubleClickHandler }), viewAnchor && _jsx(ContextMenu, { id: 'fileViewContextMenuMobile', dataSource: menuItems.file, target: viewAnchor, onHiding: closeViewContextMenu })] })] })] }) })] });
 };
 export default TMFileManager;
 const DetailsView = (props) => {
@@ -200,6 +213,23 @@ const DetailsView = (props) => {
         const data = cellData.data;
         return _jsx("div", { style: { display: 'flex', justifyContent: 'center', alignItems: 'center' }, children: getFileIcon(data.ext, data.version) });
     };
+    const cellDatetimeRender = useCallback((cellData) => {
+        const { value } = cellData;
+        const formattedDate = value ? new Date(value).toLocaleString('en-GB', { day: '2-digit', month: '2-digit', year: 'numeric', hour: '2-digit', minute: '2-digit' }) : '';
+        return _jsx("div", { children: formattedDate });
+    }, []);
+    const dataColumns = useMemo(() => {
+        return [
+            { dataField: "id", caption: "ID", dataType: 'string', visible: false },
+            { dataField: "ext", caption: SDKUI_Localizator.Extension, cellRender: cellExtRender },
+            { dataField: "name", caption: SDKUI_Localizator.Name },
+            { dataField: "version", caption: SDKUI_Localizator.Version },
+            { dataField: "size", caption: SDKUI_Localizator.Size, cellRender: (cellData) => formatBytes(cellData.data.size ?? 0) },
+            { dataField: "updaterName", caption: SDKUI_Localizator.Author },
+            { dataField: "lastUpdateTime", caption: SDKUI_Localizator.LastUpdateTime, dataType: 'datetime', format: 'dd/MM/yyyy HH:mm', cellRender: cellDatetimeRender },
+            { dataField: "creationTime", caption: SDKUI_Localizator.CreationTime, dataType: 'datetime', format: 'dd/MM/yyyy HH:mm', cellRender: cellDatetimeRender },
+        ];
+    }, []);
     // Handles selection change in the data grid
     const onSelectionChanged = useCallback((e) => {
         if (handleSelectedFiles) {
@@ -225,21 +255,7 @@ const DetailsView = (props) => {
             e.items = contextMenuItems ? [...contextMenuItems] : [];
         }
     };
-    const cellDatetimeRender = useCallback((cellData) => {
-        const { value } = cellData;
-        const formattedDate = value ? new Date(value).toLocaleString('en-GB', { day: '2-digit', month: '2-digit', year: 'numeric', hour: '2-digit', minute: '2-digit' }) : '';
-        return _jsx("div", { children: formattedDate });
-    }, []);
-    return (items && items.length > 0) ? (_jsx(TMDataGrid, { dataSource: items ?? [], dataColumns: [
-            { dataField: "id", caption: "ID", dataType: 'string', visible: false },
-            { dataField: "ext", caption: SDKUI_Localizator.Extension, cellRender: cellExtRender },
-            { dataField: "name", caption: SDKUI_Localizator.Name },
-            { dataField: "version", caption: SDKUI_Localizator.Version },
-            { dataField: "size", caption: SDKUI_Localizator.Size, cellRender: (cellData) => formatBytes(cellData.data.size ?? 0) },
-            { dataField: "updaterName", caption: SDKUI_Localizator.Author },
-            { dataField: "lastUpdateTime", caption: SDKUI_Localizator.LastUpdateTime, dataType: 'datetime', format: 'dd/MM/yyyy HH:mm', cellRender: cellDatetimeRender },
-            { dataField: "creationTime", caption: SDKUI_Localizator.CreationTime, dataType: 'datetime', format: 'dd/MM/yyyy HH:mm', cellRender: cellDatetimeRender },
-        ], focusedRowKey: focusedFile?.id, selectedRowKeys: selectedFiles?.map(file => file.id), onFocusedRowChanged: onFocusedRowChanged, onSelectionChanged: onSelectionChanged, onRowDblClick: onRowDblClick, onContextMenuPreparing: onContextMenuPreparing, showSearchPanel: false, showRowLines: SDKUI_Globals.dataGridShowRowLines, showColumnLines: SDKUI_Globals.dataGridShowColumnLines })) : _jsx("div", { style: { width: "100%", height: "100%", display: 'flex', justifyContent: 'center', alignItems: 'center', marginTop: '10px' }, children: SDKUI_Localizator.FolderIsEmpty });
+    return (items && items.length > 0) ? (_jsx(TMDataGrid, { dataSource: items, dataColumns: dataColumns, focusedRowKey: focusedFile?.id, selectedRowKeys: selectedFiles?.map(file => file.id), onFocusedRowChanged: onFocusedRowChanged, onSelectionChanged: onSelectionChanged, onRowDblClick: onRowDblClick, onContextMenuPreparing: onContextMenuPreparing, showSearchPanel: false, showRowLines: SDKUI_Globals.dataGridShowRowLines, showColumnLines: SDKUI_Globals.dataGridShowColumnLines })) : _jsx("div", { style: { width: "100%", height: "100%", display: 'flex', justifyContent: 'center', alignItems: 'center', marginTop: '10px' }, children: SDKUI_Localizator.FolderIsEmpty });
 };
 const ThumbnailsView = (props) => {
     const { items, selectedFiles, handleSelectedFiles, handleFocusedFile, onDoubleClickHandler, thumbnailsViewItemComponent } = props;

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

@@ -9,6 +9,17 @@ export declare enum FormulaTargets {
     PDFCommandAddText = 4,
     BatchUpdate = 5
 }
+export declare enum FormulaIconTypes {
+    "Instructions" = 0,
+    "Function" = 1,
+    "Variable" = 2,
+    "SystemVariables" = 3,
+    "Metadata" = 4,
+    "MetadataNumber" = 5,
+    "MetadataVarchar" = 6,
+    "MetadataSystem" = 7,
+    "MetadataGeneric" = 8
+}
 export declare class FormulaDescriptor {
     expression?: string;
     formulaTarget?: FormulaTargets;
@@ -17,6 +28,7 @@ export declare class FormulaDescriptor {
     metadataDataTypeDest?: MetadataDataTypes;
     tid?: number;
 }
+export declare const renderFormulaIcon: (iconType: FormulaIconTypes, tid?: number, md?: MetadataDescriptor) => import("react/jsx-runtime").JSX.Element;
 declare const TMFormulaEditor: React.FunctionComponent<ITMApplyFormProps<FormulaDescriptor>>;
 export default TMFormulaEditor;
 export declare class FormulaHelper {

package/lib/components/editors/TMFormulaEditor.js

@@ -25,7 +25,7 @@ export var FormulaTargets;
     FormulaTargets[FormulaTargets["PDFCommandAddText"] = 4] = "PDFCommandAddText";
     FormulaTargets[FormulaTargets["BatchUpdate"] = 5] = "BatchUpdate";
 })(FormulaTargets || (FormulaTargets = {}));
-var FormulaIconTypes;
+export var FormulaIconTypes;
 (function (FormulaIconTypes) {
     FormulaIconTypes[FormulaIconTypes["Instructions"] = 0] = "Instructions";
     FormulaIconTypes[FormulaIconTypes["Function"] = 1] = "Function";
@@ -42,7 +42,7 @@ export class FormulaDescriptor {
         this.items = [];
     }
 }
-const renderIcon = (iconType, tid, md) => {
+export const renderFormulaIcon = (iconType, tid, md) => {
     switch (iconType) {
         case FormulaIconTypes.Instructions: return _jsx(IconActivityLog, { fontSize: 14 });
         case FormulaIconTypes.Function: return _jsx(IconFunction, { fontSize: 20 });
@@ -120,7 +120,7 @@ const TMFormulaEditor = (props) => {
         }
     };
     const renderTreeViewItem = useCallback((item) => {
-        return (_jsxs(StyledDivHorizontal, { style: { display: 'flex', gap: '5px' }, children: [renderIcon(item.icon, item.tid, item.md), _jsx("span", { style: { verticalAlign: 'middle' }, children: item.text }), !item.hasItems && _jsx("span", { style: { verticalAlign: 'middle', color: TMColors.primary }, children: _jsx(IconPencil, { onClick: () => { insertText(item.text); } }) })] }));
+        return (_jsxs(StyledDivHorizontal, { style: { display: 'flex', gap: '5px' }, children: [renderFormulaIcon(item.icon, item.tid, item.md), _jsx("span", { style: { verticalAlign: 'middle' }, children: item.text }), !item.hasItems && _jsx("span", { style: { verticalAlign: 'middle', color: TMColors.primary }, children: _jsx(IconPencil, { onClick: () => { insertText(item.text); } }) })] }));
     }, []);
     return (_jsx(TMApplyForm, { isModal: props.isModal, formMode: props.formMode, isModified: formData.expression !== formDataOrig.expression, exception: exception, validationItems: validationItems, title: SDKUI_Localizator.Formula, hasNavigation: false, height: '600px', width: '800px', onApply: () => applyData(), onClose: props.onClose, onUndo: () => {
             setFormData(formDataOrig);

package/lib/helper/SDKUI_Localizator.d.ts

@@ -89,6 +89,7 @@ export declare class SDKUI_Localizator {
     static get Disabled(): "Deaktiviert" | "Disabled" | "Deshabilitado" | "Désactivé" | "Desabilitado" | "Disabilitato";
     static get Domain(): "Domäne" | "Domain" | "Dominio" | "Domaine";
     static get Download_in_Process(): "Download läuft" | "Download in progress" | "Descarga en curso" | "Téléchargement en cours" | "Download em progresso" | "Download in corso";
+    static get Drafts(): string;
     static get Duplicate(): "Duplikat" | "Duplicate" | "Duplicar" | "Dupliquer" | "Duplicado" | "Duplica";
     static get Duplicate_ConfirmFor1(): "Möchten Sie '{{0}}' duplizieren?" | "Are you sure you want to duplicate '{{0}}'?" | "¿Estás seguro de que deseas duplicar '{{0}}'?" | "Êtes-vous sûr de vouloir dupliquer '{{0}}'?" | "Você tem certeza que deseja duplicar '{{0}}'?" | "Sei sicuro di voler duplicare '{{0}}'?";
     static get Duplicate_ConfirmForN(): "{{0}} ausgewählte Objekte. Alle duplizieren?" | "{{0}} selected objects. Duplicate them all?" | "{{0}} objetos seleccionados. ¿Duplicar todos?" | "{{0}} objets sélectionnés. Voulez-vous tous les dupliquer?" | "{{0}} objetos selecionados. Duplicá-los todos?" | "{{0}} oggetti selezionati. Duplicare tutti?";

package/lib/helper/SDKUI_Localizator.js

@@ -839,6 +839,16 @@ export class SDKUI_Localizator {
             default: return "Download in corso";
         }
     }
+    static get Drafts() {
+        switch (this._cultureID) {
+            case CultureIDs.De_DE: return "Entwürfe";
+            case CultureIDs.En_US: return "Drafts";
+            case CultureIDs.Es_ES: return "Borradores";
+            case CultureIDs.Fr_FR: return "Brouillons";
+            case CultureIDs.Pt_PT: return "Rascunhos";
+            default: return "Bozze";
+        }
+    }
     static get Duplicate() {
         switch (this._cultureID) {
             case CultureIDs.De_DE: return "Duplikat";

package/lib/stories/TMFileManager.stories.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from 'react';
 import { action } from '@storybook/addon-actions';
 import TMFileManager from '../components/base/TMFileManager';
 import { TMDeviceProvider } from '../components/base/TMDeviceProvider';
@@ -11,54 +12,60 @@ export default {
 // Default Story
 export const DefaultTMFileManager = (args) => {
     // Sample file items to mock the data structure
-    const sampleFiles = [
-        {
-            id: 1,
-            name: 'Folder 1',
-            isDirectory: true,
-            items: [
-                {
-                    id: 3,
-                    name: 'File 1',
-                    isDirectory: false,
-                    items: [],
-                    size: 2048,
-                    ext: 'txt',
-                    creationTime: new Date(),
-                    lastUpdateTime: new Date(),
-                    version: 1
-                }
-            ],
-            size: 1024,
-            ext: 'txt',
-            creationTime: new Date(),
-            lastUpdateTime: new Date(),
-            version: 1
-        },
-        {
-            id: 2,
-            name: 'Folder 2',
-            isDirectory: true,
-            items: [
-                {
-                    id: 3,
-                    name: 'File 2',
-                    isDirectory: false,
-                    items: [],
-                    size: 2048,
-                    ext: 'pdf',
-                    creationTime: new Date(),
-                    lastUpdateTime: new Date(),
-                    version: 1
-                }
-            ],
-            size: 0,
-            ext: 'folder',
-            creationTime: new Date(),
-            lastUpdateTime: new Date(),
-            version: 1
-        }
-    ];
+    const sampleFiles = useMemo(() => {
+        return [{
+                id: 1,
+                name: 'Folder 1',
+                isDirectory: true,
+                items: [
+                    {
+                        id: 3,
+                        name: 'File 1',
+                        isDirectory: false,
+                        items: [],
+                        size: 2048,
+                        ext: 'txt',
+                        creationTime: new Date(),
+                        lastUpdateTime: new Date(),
+                        version: 1
+                    }
+                ],
+                size: 1024,
+                ext: 'txt',
+                creationTime: new Date(),
+                lastUpdateTime: new Date(),
+                version: 1
+            },
+            {
+                id: 2,
+                name: 'Folder 2',
+                isDirectory: true,
+                items: [
+                    {
+                        id: 3,
+                        name: 'File 2',
+                        isDirectory: false,
+                        items: [],
+                        size: 2048,
+                        ext: 'pdf',
+                        creationTime: new Date(),
+                        lastUpdateTime: new Date(),
+                        version: 1
+                    }
+                ],
+                size: 0,
+                ext: 'folder',
+                creationTime: new Date(),
+                lastUpdateTime: new Date(),
+                version: 1
+            }
+        ];
+    }, []);
+    const [selectedFolder, setSelectedFolder] = useState(undefined);
+    // Handle selected folder
+    const handleSelectedFolder = (folderItem) => {
+        setSelectedFolder(folderItem);
+    };
     // Example context menu items
     const contextMenuItems = {
         folder: [
@@ -86,5 +93,5 @@ export const DefaultTMFileManager = (args) => {
             name: 'Root Directory',
             isDirectory: true,
             items: sampleFiles,
-        }, contextMenuItems: contextMenuItems });
+        }, contextMenuItems: contextMenuItems, selectedFolder: selectedFolder, handleSelectedFolder: handleSelectedFolder });
 };

package/lib/stories/TMSDKUI_Localizator.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta } from "@storybook/react";
+declare const _default: Meta;
+export default _default;
+export declare const DefaultLocalizator: any;

package/lib/stories/TMSDKUI_Localizator.stories.js

@@ -0,0 +1,123 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { CultureIDs } from "@topconsultnpm/sdk-ts-beta";
+import { SDKUI_Localizator } from "../helper";
+// Default export for Storybook configuration
+export default {
+    title: "Localizator/SDKUI_Localizator",
+    component: () => _jsx("div", {}),
+    tags: ["autodocs"],
+};
+// Story component
+const Template = () => {
+    const [language, setLanguage] = useState(CultureIDs.En_US);
+    const [searchTerm, setSearchTerm] = useState("");
+    const localizedStrings = [
+        { key: "Abort", value: SDKUI_Localizator.Abort },
+        { key: "Abort_Confirm", value: SDKUI_Localizator.Abort_Confirm },
+        { key: "About", value: SDKUI_Localizator.About },
+        { key: "Add", value: SDKUI_Localizator.Add },
+        { key: "AddAbove", value: SDKUI_Localizator.AddAbove },
+        { key: "AddBelow", value: SDKUI_Localizator.AddBelow },
+        { key: "AddAlls", value: SDKUI_Localizator.AddAlls },
+        { key: "AddDefinition", value: SDKUI_Localizator.AddDefinition },
+        { key: "AddOrSubstFile", value: SDKUI_Localizator.AddOrSubstFile },
+        { key: "All", value: SDKUI_Localizator.All },
+        { key: "AllFilesAndFoldersInSupportArea", value: SDKUI_Localizator.AllFilesAndFoldersInSupportArea },
+        { key: "AllItems", value: SDKUI_Localizator.AllItems },
+        { key: "Alls2", value: SDKUI_Localizator.Alls2 },
+        { key: "Alphabetic", value: SDKUI_Localizator.Alphabetic },
+        { key: "Applied", value: SDKUI_Localizator.Applied },
+        { key: "Apply", value: SDKUI_Localizator.Apply },
+        { key: "ApplyAndClose", value: SDKUI_Localizator.ApplyAndClose },
+        { key: "Approve", value: SDKUI_Localizator.Approve },
+        { key: "Archive", value: SDKUI_Localizator.Archive },
+        { key: "ArchiveConstraint", value: SDKUI_Localizator.ArchiveConstraint },
+        { key: "ArchiveConstraints_ContentCompulsory", value: SDKUI_Localizator.ArchiveConstraints_ContentCompulsory },
+        { key: "ArchiveConstraints_None", value: SDKUI_Localizator.ArchiveConstraints_None },
+        { key: "ArchiveConstraints_OnlyMetadata", value: SDKUI_Localizator.ArchiveConstraints_OnlyMetadata },
+        { key: "ArchiveID", value: SDKUI_Localizator.ArchiveID },
+        { key: "Attention", value: SDKUI_Localizator.Attention },
+        { key: "AuthMode", value: SDKUI_Localizator.AuthMode },
+        { key: "AuthMode_OnBehalfOf", value: SDKUI_Localizator.AuthMode_OnBehalfOf },
+        { key: "AuthMode_WindowsViaTopMedia", value: SDKUI_Localizator.AuthMode_WindowsViaTopMedia },
+        { key: "Author", value: SDKUI_Localizator.Author },
+        { key: "Back", value: SDKUI_Localizator.Back },
+        { key: "BatchUpdate", value: SDKUI_Localizator.BatchUpdate },
+        { key: "BlogCase", value: SDKUI_Localizator.BlogCase },
+        { key: "Blog_Read", value: SDKUI_Localizator.Blog_Read },
+        { key: "Blog_Write", value: SDKUI_Localizator.Blog_Write },
+        { key: "Browser", value: SDKUI_Localizator.Browser },
+        { key: "BrowseAreaFile", value: SDKUI_Localizator.BrowseAreaFile },
+        { key: "BrowseAreaFolder", value: SDKUI_Localizator.BrowseAreaFolder },
+        { key: "CassettoDoganaleExportMRN", value: SDKUI_Localizator.CassettoDoganaleExportMRN },
+        { key: "CassettoDoganaleExportVU", value: SDKUI_Localizator.CassettoDoganaleExportVU },
+        { key: "CassettoDoganaleImportMRN", value: SDKUI_Localizator.CassettoDoganaleImportMRN },
+        { key: "CassettoDoganalePlus_UserName", value: SDKUI_Localizator.CassettoDoganalePlus_UserName },
+        { key: "Cancel", value: SDKUI_Localizator.Cancel },
+        { key: "ChangePassword", value: SDKUI_Localizator.ChangePassword },
+        { key: "CheckIn", value: SDKUI_Localizator.CheckIn },
+        { key: "CheckOut", value: SDKUI_Localizator.CheckOut },
+        { key: "ChronologyDelete", value: SDKUI_Localizator.ChronologyDelete },
+        { key: "Clear", value: SDKUI_Localizator.Clear },
+        { key: "ClearOTP", value: SDKUI_Localizator.ClearOTP },
+        { key: "Close", value: SDKUI_Localizator.Close },
+        { key: "Columns_All_Hide", value: SDKUI_Localizator.Columns_All_Hide },
+        { key: "Columns_All_Show", value: SDKUI_Localizator.Columns_All_Show },
+        { key: "CompleteError", value: SDKUI_Localizator.CompleteError },
+        { key: "Configure", value: SDKUI_Localizator.Configure },
+        { key: "ConfirmPassword", value: SDKUI_Localizator.ConfirmPassword },
+        { key: "ConfirmOnCancel", value: SDKUI_Localizator.ConfirmOnCancel },
+        { key: "ContinueOperation", value: SDKUI_Localizator.ContinueOperation },
+        { key: "CopiedSuccessfully", value: SDKUI_Localizator.CopiedSuccessfully },
+        { key: "CopyToClipboard", value: SDKUI_Localizator.CopyToClipboard },
+        { key: "Count", value: SDKUI_Localizator.Count },
+        { key: "Create", value: SDKUI_Localizator.Create },
+        { key: "CreationTime", value: SDKUI_Localizator.CreationTime },
+        { key: "CultureID", value: SDKUI_Localizator.CultureID },
+        { key: "Date", value: SDKUI_Localizator.Date },
+        { key: "Date_Modified", value: SDKUI_Localizator.Date_Modified },
+        { key: "DcmtCount", value: SDKUI_Localizator.DcmtCount },
+        { key: "DcmtsDetail", value: SDKUI_Localizator.DcmtsDetail },
+        { key: "DcmtsMaster", value: SDKUI_Localizator.DcmtsMaster },
+        { key: "DcmtType", value: SDKUI_Localizator.DcmtType },
+        { key: "DcmtTypesSelected", value: SDKUI_Localizator.DcmtTypesSelected },
+        { key: "DcmtTypeSelect", value: SDKUI_Localizator.DcmtTypeSelect },
+        { key: "Default", value: SDKUI_Localizator.Default },
+        { key: "Details", value: SDKUI_Localizator.Details },
+        { key: "Delete", value: SDKUI_Localizator.Delete },
+        { key: "Delete_ConfirmFor1", value: SDKUI_Localizator.Delete_ConfirmFor1 },
+        { key: "Delete_ConfirmForN", value: SDKUI_Localizator.Delete_ConfirmForN },
+        { key: "DeletionCompletedSuccessfully", value: SDKUI_Localizator.DeletionCompletedSuccessfully },
+        { key: "DeletionOperationInterrupted", value: SDKUI_Localizator.DeletionOperationInterrupted },
+        { key: "Description", value: SDKUI_Localizator.Description },
+        { key: "Destination", value: SDKUI_Localizator.Destination },
+        { key: "DetailsView", value: SDKUI_Localizator.DetailsView },
+        { key: "Disabled", value: SDKUI_Localizator.Disabled },
+        { key: "Domain", value: SDKUI_Localizator.Domain },
+        { key: "Download_in_Process", value: SDKUI_Localizator.Download_in_Process },
+        { key: "Drafts", value: SDKUI_Localizator.Drafts },
+        { key: "Duplicate", value: SDKUI_Localizator.Duplicate },
+        { key: "Duplicate_ConfirmFor1", value: SDKUI_Localizator.Duplicate_ConfirmFor1 },
+        { key: "Duplicate_ConfirmForN", value: SDKUI_Localizator.Duplicate_ConfirmForN },
+        { key: "Duplicate_Download", value: SDKUI_Localizator.Duplicate_Download },
+        { key: "DuplicationCompletedSuccessfully", value: SDKUI_Localizator.DuplicationCompletedSuccessfully },
+        { key: "DuplicateNameError", value: SDKUI_Localizator.DuplicateNameError },
+        { key: "DuplicationOperationInterrupted", value: SDKUI_Localizator.DuplicationOperationInterrupted }
+    ];
+    // Filter localized strings based on the search term (including digits)
+    const filteredStrings = localizedStrings.filter((entry) => entry.key.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        entry.value.toString().toLowerCase().includes(searchTerm.toLowerCase()));
+    SDKUI_Localizator.setLanguage(language);
+    return (_jsxs("div", { style: { padding: "16px", border: "1px solid #ccc", borderRadius: "8px" }, children: [_jsx("input", { type: "text", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), placeholder: "Search for a language...", style: {
+                    marginBottom: "16px",
+                    padding: "8px",
+                    border: "1px solid #ccc",
+                    borderRadius: "4px",
+                    width: "100%",
+                } }), _jsx("select", { value: language, onChange: (e) => {
+                    setLanguage(e.target.value);
+                    SDKUI_Localizator.setLanguage(e.target.value);
+                }, style: { marginBottom: "16px", padding: "8px", border: "1px solid #ccc", borderRadius: "4px" }, children: Object.values(CultureIDs).map((lang) => (_jsx("option", { value: lang, children: lang }, lang))) }), _jsx("div", { children: filteredStrings.length > 0 ? (filteredStrings.map((entry) => (_jsxs("p", { children: [_jsxs("strong", { children: [entry.key, ":"] }), " ", entry.value] }, entry.key)))) : (_jsx("p", { children: "No matching results" })) })] }));
+};
+export const DefaultLocalizator = Template.bind({});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@topconsultnpm/sdkui-react-beta",
-  "version": "6.11.49",
+  "version": "6.11.51",
   "description": "",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",