@topconsultnpm/sdkui-react 6.19.0-dev1.9 → 6.19.0-dev2.2

package/lib/components/grids/{TMBlogsUtils.d.ts → TMBlogsPostUtils.d.ts}

@@ -1,8 +1,6 @@
-import React from 'react';
+import { ReactNode } from "react";
 import { BlogPost, BlogPostAttachment, DcmtTypeDescriptor, DossierDescriptor, HomeBlogPost, TID_DID, WorkingGroupDescriptor } from "@topconsultnpm/sdk-ts";
-import { DcmtInfo } from '../../ts';
-import { ContextMenuRef } from 'devextreme-react/cjs/context-menu';
-import { FileItem } from '../base/TMFileManagerUtils';
+import { FileItem } from "../base/TMFileManagerUtils";
 export declare const DRAFT_TYPE_TID = 6;
 export type TMBlogContextDescriptor = {
     engine: 'WorkingGroupEngine';
@@ -14,15 +12,28 @@ export type TMBlogContextDescriptor = {
     engine: 'DossierEngine';
     object?: DossierDescriptor;
 };
-export declare const colors: {
-    DARK_BLUE: string;
-    WHITE: string;
-    BLACK: string;
-    RED: string;
-    LIGHT_GRAY: string;
-    PRIMARY_BLUE: string;
-    PRIMARY_ORANGE: string;
-    PRIMARY_GREEN: string;
+export declare enum TMBlogsFilterCategoryId {
+    PublishedBlogs = 1,
+    SystemBlogs = 2,
+    DeletedBlogs = 3
+}
+export type TMBlogsFilterCategoryIdDataSource = {
+    id: number;
+    label: string;
+    value: string;
+    categoryId?: number;
+    expanded?: boolean;
+    tooltipContent?: ReactNode;
+};
+export type TMBlogsPostHeader = {
+    /** Flag to display the view mode toggle */
+    showViewMode: boolean;
+    /** Flag to display filter options */
+    showFilters: boolean;
+    /** Flag to display the search bar */
+    showSearchBar: boolean;
+    /** Flag to display a dropdown menu for selecting posts */
+    showPostsDropDown: boolean;
 };
 export interface TMBlogContextMenuItem {
     text: string;
@@ -36,26 +47,22 @@ export interface TMBlogContextMenuItem {
     tooltip?: string;
     visible?: boolean;
 }
-export declare enum TMBlogsFilterCategoryId {
-    PublishedBlogs = 1,
-    SystemBlogs = 2,
-    DeletedBlogs = 3
-}
-export interface BlogPostContainerProps {
-    $color?: string;
-    $textDecoration?: string;
-    $backgroundColor?: string;
-    $canNavigate?: boolean;
-    $paddingTop?: string;
-    $paddingRight?: string;
-    $paddingBottom?: string;
-    $paddingLeft?: string;
-}
-export declare const BlogPostContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, BlogPostContainerProps>> & string;
-export declare const getTooltipContent: (title: string | undefined, content: JSX.Element) => import("react/jsx-runtime").JSX.Element;
+export declare const getCompactEllipsisStyle: (layoutMode: "compact" | "extended") => {
+    whiteSpace?: undefined;
+    overflow?: undefined;
+    textOverflow?: undefined;
+    display?: undefined;
+} | {
+    whiteSpace: string;
+    overflow: string;
+    textOverflow: string;
+    display: string;
+};
+export declare const findFileItemByDraftID: (tree: FileItem | undefined, draftID: number | undefined) => FileItem | null;
 export declare const highlightText: (text: string, searchText: string, isSelected: boolean) => string | (string | import("react/jsx-runtime").JSX.Element)[];
 export declare const lightenColor: (hex: string, amount: number) => string;
-export declare const removeFileExtension: (filename: string) => string;
+export declare const OwnerInitialsBadge: (blogPost: BlogPost | HomeBlogPost) => import("react/jsx-runtime").JSX.Element;
+export declare const getTooltipContent: (title: string | undefined, content: JSX.Element) => import("react/jsx-runtime").JSX.Element;
 export declare const getAttachmentInfo: (attachment: BlogPostAttachment, treeFs: FileItem | undefined, draftLatestInfoMap: Map<number, {
     latestVersion: number;
     folderId: number;
@@ -67,7 +74,7 @@ export declare const getAttachmentInfo: (attachment: BlogPostAttachment, treeFs:
     did: number;
     fileExt: string;
     fileSize: string;
-}> | undefined, dcmtTypeDescriptors: Map<number, DcmtTypeDescriptor>, isSelected: boolean, searchText: string, color: string) => {
+}> | undefined, dcmtTypeDescriptors: Map<number, DcmtTypeDescriptor>, isSelected: boolean, searchText: string) => {
     name: string;
     nameElement: import("react/jsx-runtime").JSX.Element;
     tooltipContent: import("react/jsx-runtime").JSX.Element;
@@ -76,24 +83,31 @@ export declare const getAttachmentInfo: (attachment: BlogPostAttachment, treeFs:
     draftExist: boolean;
     archivedDocumentsExist: boolean;
 };
-export declare const AttachmentElement: (attachment: BlogPostAttachment, treeFs: FileItem | undefined, draftLatestInfoMap: Map<number, {
-    latestVersion: number;
-    folderId: number;
-    folderName: string;
-    fileExt: string;
-    fileSize: string;
-}> | undefined, archivedDocumentMap: Map<number, {
-    tid: number;
-    did: number;
-    fileExt: string;
-    fileSize: string;
-}> | undefined, dcmtTypeDescriptors: Map<number, DcmtTypeDescriptor>, isSelected: boolean, searchText: string, color: string, setShowDcmtForm: React.Dispatch<React.SetStateAction<boolean>>, handleFocusedAttachment: (attachment: DcmtInfo | undefined) => void, setAnchorEl: (value: React.SetStateAction<HTMLElement | null>) => void, contextMenuRef: React.MutableRefObject<ContextMenuRef<any> | null>) => import("react/jsx-runtime").JSX.Element;
-export declare const OwnerInitialsBadge: (blogPost: BlogPost | HomeBlogPost) => import("react/jsx-runtime").JSX.Element;
-export declare const IconAndHeaderElement: (blogPost: BlogPost | HomeBlogPost, iconColor: string, isSelected: boolean, headerClickCallback: () => void, searchText: string) => import("react/jsx-runtime").JSX.Element;
-export declare const findFileItemByDraftID: (tree: FileItem | undefined, draftID: number | undefined) => FileItem | null;
+export declare const getDcmtTypeDescriptor: (blogPosts: Array<BlogPost>) => Promise<Map<number, DcmtTypeDescriptor>>;
+export declare const BlogPostHomeHeader: (header: string | undefined, classId: string | undefined, isSelected: boolean, searchText: string, headerClickCallback: () => void) => import("react/jsx-runtime").JSX.Element;
 export declare const isHeaderFullyHidden: (header: {
     showViewMode: boolean;
     showFilters: boolean;
     showSearchBar: boolean;
     showPostsDropDown: boolean;
 } | undefined) => boolean;
+interface NewBadgeProps {
+    layoutMode: "compact" | "extended";
+}
+export declare const NewBadge: ({ layoutMode }: NewBadgeProps) => import("react/jsx-runtime").JSX.Element;
+export declare const removeFileExtension: (filename: string) => string;
+interface BlogPostTitleProps {
+    displayMode: "chat" | "stacked";
+    layoutMode: "compact" | "extended";
+    blogPost: BlogPost | HomeBlogPost;
+    isSelected: boolean;
+    isOwnComment: boolean;
+    searchText: string;
+    isSys: boolean;
+    isHomeBlogPost: boolean;
+    showId: boolean;
+    handleNavigateToWGs?: (blogPost: BlogPost | HomeBlogPost) => void;
+    handleNavigateToDossiers?: (blogPost: BlogPost | HomeBlogPost) => void;
+}
+export declare const BlogPostTitle: (props: BlogPostTitleProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/grids/{TMBlogsUtils.js → TMBlogsPostUtils.js}

@@ -1,60 +1,48 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import styled from "styled-components";
-import { SDK_Globals } from "@topconsultnpm/sdk-ts";
-import { extractInitialsFromName, formatBytes, getAvatarColor, IconAttachment, IconCADossier, IconMenuCAWorkingGroups, SDKUI_Localizator } from "../../helper";
+import { DcmtTypeListCacheService } from "@topconsultnpm/sdk-ts";
+import { getAvatarColor, extractInitialsFromName, SDKUI_Localizator, formatBytes, IconMenuCAWorkingGroups, IconCADossier, Globalization } from "../../helper";
+import { TMColors } from "../../utils/theme";
 import TMTooltip from "../base/TMTooltip";
-import { TMColors } from '../../utils/theme';
-import TMDcmtIcon from '../features/documents/TMDcmtIcon';
 export const DRAFT_TYPE_TID = 6;
-export const colors = {
-    DARK_BLUE: "#1a0dab",
-    WHITE: "#fff",
-    BLACK: "#000000",
-    RED: '#ff0000',
-    LIGHT_GRAY: "#f9f9f9",
-    PRIMARY_BLUE: "#135596",
-    PRIMARY_ORANGE: "#e65b00",
-    PRIMARY_GREEN: "#009700"
-};
 export var TMBlogsFilterCategoryId;
 (function (TMBlogsFilterCategoryId) {
     TMBlogsFilterCategoryId[TMBlogsFilterCategoryId["PublishedBlogs"] = 1] = "PublishedBlogs";
     TMBlogsFilterCategoryId[TMBlogsFilterCategoryId["SystemBlogs"] = 2] = "SystemBlogs";
     TMBlogsFilterCategoryId[TMBlogsFilterCategoryId["DeletedBlogs"] = 3] = "DeletedBlogs";
 })(TMBlogsFilterCategoryId || (TMBlogsFilterCategoryId = {}));
-export const BlogPostContainer = styled.div `
-    color: ${(props) => (props.$color ?? colors.BLACK)};
-    text-decoration: ${(props) => (props.$textDecoration ?? 'none')};
-    height: auto;
-    background-color: ${(props) => (props.$backgroundColor ?? colors.WHITE)};
-    display: inline-block;
-    width: 100%;
-    min-width: 100px;
-    max-width: 100%;
-    cursor: ${(props) => (props.$canNavigate ? "pointer" : "default")};
-    border-radius: 5px;
-    margin: 5px 0;
-    padding: ${(props) => `${props.$paddingTop ?? '10px'} ${props.$paddingRight ?? '10px'} ${props.$paddingBottom ?? '10px'} ${props.$paddingLeft ?? '10px'}`};
-    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
-    word-wrap: break-word;
-    white-space: pre-wrap;
-    &:hover {
-        box-shadow: 0 4px 12px rgba(19, 85, 150, 0.6);
-        transition: 
-            box-shadow 0.3s ease,
-            transform 0.3s ease;
-    };
-    &:focus {
-        outline: none;
-    }
-`;
-export const getTooltipContent = (title, content) => {
-    return (_jsxs("div", { style: { textAlign: 'left' }, children: [_jsx("div", { style: { fontWeight: 'bold' }, children: title }), _jsx("hr", {}), content] }));
+export const getCompactEllipsisStyle = (layoutMode) => {
+    if (layoutMode !== "compact")
+        return {};
+    return {
+        whiteSpace: "nowrap",
+        overflow: "hidden",
+        textOverflow: "ellipsis",
+        display: "block",
+    };
+};
+export const findFileItemByDraftID = (tree, draftID) => {
+    if (tree === undefined || draftID === undefined)
+        return null;
+    if (tree.id === draftID) {
+        return tree;
+    }
+    if (tree.items && tree.items.length > 0) {
+        for (const item of tree.items) {
+            const found = findFileItemByDraftID(item, draftID);
+            if (found) {
+                return found;
+            }
+        }
+    }
+    return null;
 };
 export const highlightText = (text, searchText, isSelected) => {
     if (!searchText)
         return text;
-    const regex = new RegExp(`(${searchText.trim()})`, 'gi');
+    if (searchText.trim() === '')
+        return text;
+    const escapedSearchText = searchText.trim().replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+    const regex = new RegExp(`(${escapedSearchText})`, 'gi');
     return text.split(regex).map((part, index) => regex.test(part) ? (_jsx("span", { style: { backgroundColor: isSelected ? '#6c9023' : 'yellow' }, children: part }, index)) : (part));
 };
 export const lightenColor = (hex, amount) => {
@@ -72,10 +60,25 @@ export const lightenColor = (hex, amount) => {
     b = Math.min(255, Math.max(0, b));
     return `#${(r << 16 | g << 8 | b).toString(16).padStart(6, '0')}`;
 };
-export const removeFileExtension = (filename) => {
-    return filename.includes('.') ? filename.substring(0, filename.lastIndexOf('.')) : filename;
+export const OwnerInitialsBadge = (blogPost) => {
+    return _jsx(TMTooltip, { content: blogPost.ownerName ?? '-', children: _jsx("div", { style: {
+                width: "40px",
+                height: "40px",
+                borderRadius: "50%",
+                backgroundColor: getAvatarColor(blogPost.ownerName ?? '-'),
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                marginRight: "10px",
+                fontWeight: "bold",
+                color: "#ffffff",
+                fontSize: "18px",
+            }, children: _jsx("span", { style: { fontSize: "12px" }, children: extractInitialsFromName(blogPost.ownerName ?? '-') }) }) });
+};
+export const getTooltipContent = (title, content) => {
+    return (_jsxs("div", { style: { textAlign: 'left' }, children: [_jsx("div", { style: { fontWeight: 'bold' }, children: title }), _jsx("hr", {}), content] }));
 };
-export const getAttachmentInfo = (attachment, treeFs, draftLatestInfoMap, archivedDocumentMap, dcmtTypeDescriptors, isSelected, searchText, color) => {
+export const getAttachmentInfo = (attachment, treeFs, draftLatestInfoMap, archivedDocumentMap, dcmtTypeDescriptors, isSelected, searchText) => {
     let nameElement = (_jsx("span", { children: `${SDKUI_Localizator.DocumentNotAvailable} (DID: ${attachment.did})` }));
     let folderId = -1;
     let fileExt = '';
@@ -111,7 +114,7 @@ export const getAttachmentInfo = (attachment, treeFs, draftLatestInfoMap, archiv
                             alignItems: 'center',
                             justifyContent: 'center',
                             backgroundColor: isSelected ? '#fff' : (latestVersion ? '#28a745' : '#cc7000'),
-                            color: isSelected ? color : '#fff',
+                            color: isSelected ? "#135596" : '#fff',
                             boxShadow: '1px 1px 2px #00000020',
                             borderRadius: '30px',
                             fontWeight: 'bold',
@@ -138,85 +141,37 @@ export const getAttachmentInfo = (attachment, treeFs, draftLatestInfoMap, archiv
     }
     return { name, nameElement, tooltipContent, folderId, fileExt, draftExist, archivedDocumentsExist };
 };
-export const AttachmentElement = (attachment, treeFs, draftLatestInfoMap, archivedDocumentMap, dcmtTypeDescriptors, isSelected, searchText, color, setShowDcmtForm, handleFocusedAttachment, setAnchorEl, contextMenuRef) => {
-    const { name, nameElement, tooltipContent, folderId, fileExt, draftExist } = getAttachmentInfo(attachment, treeFs, draftLatestInfoMap, archivedDocumentMap, dcmtTypeDescriptors, isSelected, searchText, color);
-    const onDoubleClick = (e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        const archiveID = SDK_Globals.tmSession?.SessionDescr?.archiveID;
-        const fileName = `${removeFileExtension(name)}_${archiveID}_${attachment.tid}_${attachment.did}.${fileExt}`;
-        handleFocusedAttachment({ TID: attachment.tid, DID: attachment.did, fileName });
-        setShowDcmtForm(true);
-    };
-    const onContextMenu = (e) => {
-        const archiveID = SDK_Globals.tmSession?.SessionDescr?.archiveID;
-        const fileName = `${removeFileExtension(name)}_${archiveID}_${attachment.tid}_${attachment.did}.${fileExt}`;
-        handleFocusedAttachment({ TID: attachment.tid, DID: attachment.did, fileName });
-        setAnchorEl(e.currentTarget);
-        e.preventDefault();
-        e.stopPropagation();
-        // Slight delay to ensure state update before showing context menu
-        setTimeout(() => {
-            contextMenuRef.current?.instance()?.show();
-        }, 0);
-    };
-    return _jsx("div", { onDoubleClick: onDoubleClick, onContextMenu: onContextMenu, style: {
-            display: 'inline-flex',
-            padding: '4px 8px',
-            margin: '4px',
-            border: '1px solid #ddd',
-            borderRadius: '8px',
-            boxShadow: '0 2px 4px rgba(0, 0, 0, 0.1)',
-            backgroundColor: isSelected ? color : colors.WHITE,
-            cursor: "pointer",
-            fontSize: '0.9rem'
-        }, onMouseEnter: (e) => {
-            e.currentTarget.style.boxShadow = '0 4px 8px rgba(0, 0, 0, 0.15)';
-            e.currentTarget.style.backgroundColor = isSelected ? lightenColor(color, 40) : '#cfcfcf';
-        }, onMouseLeave: (e) => {
-            e.currentTarget.style.boxShadow = '0 2px 4px rgba(0, 0, 0, 0.1)';
-            e.currentTarget.style.backgroundColor = isSelected ? color : colors.WHITE;
-        }, children: _jsxs("div", { style: { alignItems: 'center', display: 'flex' }, children: [fileExt ? _jsx("div", { style: { marginRight: "10px" }, children: _jsx(TMDcmtIcon, { tid: attachment.tid, did: attachment.did, fileExtension: fileExt, downloadMode: 'openInNewWindow', tooltipContent: tooltipContent }) }) : _jsx(IconAttachment, { style: { marginRight: "5px" } }), _jsx("span", { children: nameElement })] }) }, attachment.did);
-};
-export const OwnerInitialsBadge = (blogPost) => {
-    return _jsx(TMTooltip, { content: blogPost.ownerName ?? '-', children: _jsx("div", { style: {
-                width: "40px",
-                height: "40px",
-                borderRadius: "50%",
-                backgroundColor: getAvatarColor(blogPost.ownerName ?? '-'),
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center",
-                marginRight: "10px",
-                fontWeight: "bold",
-                color: colors.WHITE,
-                fontSize: "18px",
-            }, children: _jsx("span", { style: { fontSize: "12px" }, children: extractInitialsFromName(blogPost.ownerName ?? '-') }) }) });
-};
-export const IconAndHeaderElement = (blogPost, iconColor, isSelected, headerClickCallback, searchText) => {
-    return _jsxs("span", { style: { marginLeft: "5px", cursor: blogPost.classID === 'WG' ? "pointer" : "default", display: "inline-flex", alignItems: "center" }, onClick: headerClickCallback, children: [_jsx(TMTooltip, { content: blogPost.classID === 'DS' ? SDKUI_Localizator.Practice : SDKUI_Localizator.WorkGroup, children: blogPost.classID === "DS" ? (_jsx(IconCADossier, { color: iconColor, fontSize: 28 })) : (_jsx(IconMenuCAWorkingGroups, { color: iconColor, fontSize: 28 })) }), _jsx("span", { style: {
-                    marginLeft: "5px",
-                    // textDecoration: (blogPost as HomeBlogPost).classID === "WG" ? "underline" : "none",
-                    cursor: blogPost.classID === "WG" ? "pointer" : "default",
-                    color: isSelected ? "#fff" : TMColors.primary,
-                    display: "inline-block" // Ensure both elements are in a row
-                }, onClick: headerClickCallback, children: highlightText(blogPost.header ?? '', searchText, isSelected) })] });
-};
-export const findFileItemByDraftID = (tree, draftID) => {
-    if (tree === undefined || draftID === undefined)
-        return null;
-    if (tree.id === draftID) {
-        return tree;
-    }
-    if (tree.items && tree.items.length > 0) {
-        for (const item of tree.items) {
-            const found = findFileItemByDraftID(item, draftID);
-            if (found) {
-                return found;
+export const getDcmtTypeDescriptor = async (blogPosts) => {
+    // Create a Map to store tid as key and DcmtTypeDescriptor as value
+    const dcmtTypeMap = new Map();
+    for (const blogPost of blogPosts) {
+        if (blogPost.attachments) {
+            for (const attachment of blogPost.attachments) {
+                const dcmtTypeDescriptor = await DcmtTypeListCacheService.GetAsync(attachment.tid, true);
+                if (dcmtTypeDescriptor && attachment.tid) {
+                    dcmtTypeMap.set(attachment.tid, dcmtTypeDescriptor);
+                }
             }
         }
     }
-    return null;
+    return dcmtTypeMap;
+};
+export const BlogPostHomeHeader = (header, classId, isSelected, searchText, headerClickCallback) => {
+    const isWorkGroup = classId === 'WG';
+    const iconColor = isSelected ? '#ffffff' : isWorkGroup ? '#009700' : '#e65b00';
+    return (_jsxs("div", { onClick: headerClickCallback, style: {
+            display: "flex",
+            alignItems: "center",
+            cursor: "pointer",
+            fontWeight: "bold",
+            color: isSelected ? "#fff" : TMColors.primary,
+            gap: "4px",
+        }, children: [_jsx(TMTooltip, { content: isWorkGroup ? SDKUI_Localizator.WorkGroup : SDKUI_Localizator.Practice, children: isWorkGroup ? (_jsx(IconMenuCAWorkingGroups, { color: iconColor, fontSize: 28 })) : (_jsx(IconCADossier, { color: iconColor, fontSize: 28 })) }), _jsx("div", { style: {
+                    whiteSpace: "nowrap",
+                    overflow: "hidden",
+                    textOverflow: "ellipsis",
+                    flex: 1,
+                }, children: highlightText(header ?? "", searchText, isSelected) })] }));
 };
 export const isHeaderFullyHidden = (header) => {
     if (!header) {
@@ -224,3 +179,70 @@ export const isHeaderFullyHidden = (header) => {
     }
     return !header.showViewMode && !header.showFilters && !header.showSearchBar && !header.showPostsDropDown;
 };
+export const NewBadge = ({ layoutMode }) => {
+    const isCompact = layoutMode === "compact";
+    return (_jsxs("div", { style: {
+            position: "absolute",
+            top: isCompact ? "6px" : "8px",
+            right: isCompact ? "6px" : "8px",
+            background: "linear-gradient(270deg, #FFD76A 0%, #FFC940 50%, #FFB800 100%)",
+            color: TMColors.primary,
+            fontSize: isCompact ? "0" : "0.65rem",
+            fontWeight: "700",
+            letterSpacing: "0.5px",
+            padding: isCompact ? "0" : "3px 8px",
+            borderRadius: isCompact ? "50%" : "12px",
+            width: isCompact ? "10px" : "auto",
+            height: isCompact ? "10px" : "auto",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            boxShadow: "0 2px 10px rgba(255, 200, 50, 0.45)",
+            zIndex: 1,
+            animation: "softBlink 2s infinite",
+        }, title: SDKUI_Localizator.NewMale, children: [!isCompact && "NEW", _jsx("style", { children: `
+                @keyframes softBlink {
+                    0%, 100% { opacity: 1; }
+                    50% { opacity: 0.7; }
+                }
+                ` })] }));
+};
+export const removeFileExtension = (filename) => {
+    return filename.includes('.') ? filename.substring(0, filename.lastIndexOf('.')) : filename;
+};
+export const BlogPostTitle = (props) => {
+    const { displayMode, layoutMode, blogPost, isSelected, isOwnComment, searchText, isSys, isHomeBlogPost, showId, handleNavigateToWGs, handleNavigateToDossiers } = props;
+    const showOwnerBadge = (displayMode === "stacked" || !isOwnComment) && layoutMode === "extended";
+    let subtitle = "";
+    if (isHomeBlogPost) {
+        subtitle = blogPost.ownerName ? `${blogPost.ownerName} \u2014 ` : "";
+    }
+    if (blogPost.creationTime) {
+        subtitle += `${Globalization.getDateTimeDisplayValue(blogPost.creationTime)} ${new Date(blogPost.creationTime).toDateString() === new Date().toDateString()
+            ? `(${SDKUI_Localizator.Today})`
+            : ''}`;
+    }
+    if (showId && blogPost.id !== undefined) {
+        subtitle += ` \u2014 ID: ${blogPost.id}`;
+    }
+    const headerClickCallback = () => {
+        if (handleNavigateToWGs && blogPost.id && blogPost.classID === 'WG') {
+            handleNavigateToWGs(blogPost);
+        }
+        if (handleNavigateToDossiers && blogPost.id && blogPost.classID === 'DS') {
+            handleNavigateToDossiers(blogPost);
+        }
+    };
+    return _jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [showOwnerBadge && (_jsx("div", { style: { width: "40px", height: "40px", flexShrink: 0 }, children: OwnerInitialsBadge(blogPost) })), _jsxs("div", { style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    width: showOwnerBadge ? "calc(100% - 40px)" : "100%",
+                }, children: [(isHomeBlogPost && blogPost.classID) && BlogPostHomeHeader(blogPost.header, blogPost.classID, isSelected, searchText, headerClickCallback), (!isHomeBlogPost && !isOwnComment && blogPost.ownerName && blogPost.ownerName.trim().length > 0) && (_jsx("span", { style: {
+                            fontWeight: "bold",
+                            color: isSelected ? "#fff" : !isSys ? TMColors.primary : "#ff0000",
+                            ...getCompactEllipsisStyle(layoutMode),
+                        }, children: highlightText(blogPost.ownerName, searchText, isSelected) })), subtitle.length > 0 && (_jsx("div", { style: {
+                            color: isSelected ? "#fff" : !isSys ? TMColors.primary : "#ff0000",
+                            ...getCompactEllipsisStyle(layoutMode)
+                        }, children: highlightText(subtitle, searchText, isSelected) }))] })] });
+};

package/lib/components/index.d.ts

@@ -53,7 +53,9 @@ export * from './choosers/TMOrderRetrieveFormats';
 export * from './choosers/TMUserChooser';
 export * from './choosers/TMPathChooser';
 export { default as TMValidationItemsList } from './grids/TMValidationItemsList';
-export { default as TMBlogs } from './grids/TMBlogs';
+export { default as TMBlogsPost } from './grids/TMBlogsPost';
+export { default as TMBlogHeader } from './grids/TMBlogHeader';
+export { default as TMBlogAttachments } from './grids/TMBlogAttachments';
 export { default as TMBlogCommentForm } from './features/blog/TMBlogCommentForm';
 export * from './query/TMQueryEditor';
 export * from './query/TMQuerySummary';
@@ -65,6 +67,14 @@ export * from './features/documents/TMRelationViewer';
 export * from './features/archive/TMArchive';
 export * from './features/search/TMSearch';
 export * from './features/search/TMSearchResult';
+export { default as TMTaskForm } from './features/tasks/TMTaskForm';
+export { default as TMTasksAgenda } from './features/tasks/TMTasksAgenda';
+export { default as TMTasksCalendar } from './features/tasks/TMTasksCalendar';
+export { default as TMTasksHeader } from './features/tasks/TMTasksHeader';
+export { default as TMTasksPanelContent } from './features/tasks/TMTasksPanelContent';
+export { default as TMTasksView } from './features/tasks/TMTasksView';
+export * from './features/tasks/TMTasksUtils';
+export * from './features/tasks/TMTasksUtilsView';
 export { default as TMWGsCopyMoveForm } from './features/wg/TMWGsCopyMoveForm';
 export * from './base/TMTab';
 export { default as TMHeader } from "./sidebar/TMHeader";
@@ -84,6 +94,9 @@ export * from "./viewers/TMDataListItemViewer";
 export * from "./base/TMDeviceProvider";
 export { default as TMDataGrid } from "./base/TMDataGrid";
 export { default as TMFileManager } from "./base/TMFileManager";
+export { default as TMFileManagerDataGridView } from "./base/TMFileManagerDataGridView";
+export { default as TMFileManagerThumbnailsView } from "./base/TMFileManagerThumbnailsView";
+export * from "./base/TMFileManagerUtils";
 export * from "./base/TMFileManagerUtils";
 export { default as TMCounterContainer } from "./base/TMCounterContainer";
 export * from "./base/TMCounterContainer";

package/lib/components/index.js

@@ -58,7 +58,9 @@ export * from './choosers/TMPathChooser';
 //grids
 export { default as TMValidationItemsList } from './grids/TMValidationItemsList';
 // blogs
-export { default as TMBlogs } from './grids/TMBlogs';
+export { default as TMBlogsPost } from './grids/TMBlogsPost';
+export { default as TMBlogHeader } from './grids/TMBlogHeader';
+export { default as TMBlogAttachments } from './grids/TMBlogAttachments';
 export { default as TMBlogCommentForm } from './features/blog/TMBlogCommentForm';
 //query
 export * from './query/TMQueryEditor';
@@ -75,6 +77,15 @@ export * from './features/archive/TMArchive';
 //search
 export * from './features/search/TMSearch';
 export * from './features/search/TMSearchResult';
+// tasks
+export { default as TMTaskForm } from './features/tasks/TMTaskForm';
+export { default as TMTasksAgenda } from './features/tasks/TMTasksAgenda';
+export { default as TMTasksCalendar } from './features/tasks/TMTasksCalendar';
+export { default as TMTasksHeader } from './features/tasks/TMTasksHeader';
+export { default as TMTasksPanelContent } from './features/tasks/TMTasksPanelContent';
+export { default as TMTasksView } from './features/tasks/TMTasksView';
+export * from './features/tasks/TMTasksUtils';
+export * from './features/tasks/TMTasksUtilsView';
 // wg
 export { default as TMWGsCopyMoveForm } from './features/wg/TMWGsCopyMoveForm';
 //tab
@@ -102,6 +113,9 @@ export * from "./viewers/TMDataListItemViewer";
 export * from "./base/TMDeviceProvider";
 export { default as TMDataGrid } from "./base/TMDataGrid";
 export { default as TMFileManager } from "./base/TMFileManager";
+export { default as TMFileManagerDataGridView } from "./base/TMFileManagerDataGridView";
+export { default as TMFileManagerThumbnailsView } from "./base/TMFileManagerThumbnailsView";
+export * from "./base/TMFileManagerUtils";
 export * from "./base/TMFileManagerUtils";
 export { default as TMCounterContainer } from "./base/TMCounterContainer";
 export * from "./base/TMCounterContainer";

package/lib/components/layout/panelManager/TMPanelManagerContext.js

@@ -106,6 +106,13 @@ export const TMPanelManagerProvider = (props) => {
                 return adjustPanelVisibilityAndSize(initialMobilePanelId, true, prev);
             });
         }
+        else {
+            let updated = { ...initialVisibility };
+            Object.entries(initialVisibility).forEach(([id, isVisible]) => {
+                updated = adjustPanelVisibilityAndSize(id, isVisible, updated);
+            });
+            setPanelVisibility(updated);
+        }
     }, [isMobile]);
     // Function to maximize a panel (and its parent panels)
     const maximizePanel = useCallback((id) => {

package/lib/components/settings/SettingsAppearance.js

@@ -18,6 +18,10 @@ const fontSizes = [
     { value: "19px", display: "19px" },
     { value: "20px", display: "20px" }
 ];
+const fontFamilies = [
+    { value: "Inter", display: "Inter" },
+    { value: "Roboto", display: "Roboto" }
+];
 const SettingsAppearance = ({ landingPagesOptions, permissions = { canArchive: true, canSearch: true, dossiersLicense: true, wgGroupLicense: true, workFlowLicense: true } }) => {
     const [, setForceUpdate] = useState(0); // Dummy state to force re-renders
     const triggerUIUpdate = () => setForceUpdate((prev) => prev + 1); // Increment dummy state to re-render
@@ -47,6 +51,10 @@ const SettingsAppearance = ({ landingPagesOptions, permissions = { canArchive: t
                     let newpx = e.target.value;
                     SDKUI_Globals.userSettings.themeSettings.fontSize = newpx;
                     triggerUIUpdate();
+                } }), _jsx(TMDropDown, { label: 'Family', dataSource: fontFamilies, width: '230px', value: SDKUI_Globals.userSettings.themeSettings.fontFamily, onValueChanged: (e) => {
+                    let newFamily = e.target.value;
+                    SDKUI_Globals.userSettings.themeSettings.fontFamily = newFamily;
+                    triggerUIUpdate();
                 } }), _jsx("p", { style: { fontSize: '1rem', fontWeight: 'bold', marginTop: '10px', marginBottom: '5px' }, children: SDKUI_Localizator.Grids }), _jsx(TMCheckBox, { label: SDKUI_Localizator.ShowRowSeparatingLines, value: SDKUI_Globals.userSettings.themeSettings.gridSettings.showRowLines, onValueChanged: (newValue) => {
                     SDKUI_Globals.userSettings.themeSettings.gridSettings.showRowLines = newValue;
                     triggerUIUpdate();

package/lib/components/viewers/TMTidViewer.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useState } from 'react';
 import { IconDcmtType, IconDcmtTypeOnlyMetadata, IconLocked, IconView, isCreateCertificateEnabled, isPdfEditorEnabled, isSign4TopEnabled, LocalizeArchiveConstraints, LocalizeParametricFilterTypes, SDKUI_Localizator, TMImageLibrary } from '../../helper';
-import { ArchiveConstraints, DcmtTypeListCacheService, OwnershipLevels, ParametricFilterTypes, SDK_Globals, SDK_Localizator, TemplateTIDs } from '@topconsultnpm/sdk-ts';
+import { AccessLevels, AccessLevelsEx, ArchiveConstraints, DcmtTypeListCacheService, OwnershipLevels, ParametricFilterTypes, SDK_Globals, SDK_Localizator, TemplateTIDs } from '@topconsultnpm/sdk-ts';
 import TMSpinner from '../base/TMSpinner';
 import { StyledDivHorizontal, StyledTooltipContainer, StyledTooltipItem, StyledTooltipSeparatorItem } from '../base/Styled';
 import TMTooltip from '../base/TMTooltip';
@@ -306,12 +306,30 @@ export const cellRenderTID = (data, noneSelectionText) => {
     return (_jsx(TMTidViewer, { tid: data.value, noneSelectionText: noneSelectionText }));
 };
 export const renderDTDTooltipContent = (dtd) => {
+    const mapAccessLevelToLocalizedString = (level) => {
+        if (level === undefined || level === null)
+            return SDKUI_Localizator.No;
+        switch (level) {
+            case AccessLevelsEx.Yes || AccessLevels.Yes:
+                return SDKUI_Localizator.Yes;
+            case AccessLevelsEx.No || AccessLevels.No:
+                return SDKUI_Localizator.No;
+            case AccessLevelsEx.Deny || AccessLevels.Deny:
+                return SDKUI_Localizator.Deny;
+            case AccessLevelsEx.Mixed:
+                return SDKUI_Localizator.Mixed;
+            case AccessLevelsEx.None || AccessLevels.None:
+                return SDK_Localizator.None;
+            default:
+                return level.toString();
+        }
+    };
     return (!dtd ? null
         : _jsxs(StyledTooltipContainer, { children: [_jsx(StyledTooltipItem, { children: `${SDK_Globals.useLocalizedName ? dtd.nameLoc : dtd.name} (${dtd.isView ? 'VID' : 'TID'}: ${dtd.id}, RootTID: ${dtd.rootTID ?? 0})` }), dtd.description && _jsx(StyledTooltipItem, { children: dtd.description }), _jsx(StyledTooltipSeparatorItem, {}), dtd.customData2 === "NOTGRANTED"
                     ? _jsx(StyledTooltipItem, { style: { fontWeight: 600 }, children: 'Tipo documento NON autorizzato' })
                     :
                         _jsxs(_Fragment, { children: [_jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.ArchiveConstraint}: ${LocalizeArchiveConstraints(dtd.archiveConstraint)}` }), dtd.isView && dtd.parametricFilterType != ParametricFilterTypes.None && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.ParametricFilter}: ${LocalizeParametricFilterTypes(dtd.parametricFilterType)}` }), dtd.isView && dtd.withCheckOption && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.ViewWithCheckOption}: ${SDKUI_Localizator.Yes}` }), dtd.isLexProt && dtd.isLexProt > 0 && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.LexProt}: ${SDKUI_Localizator.Yes}` }), dtd.isFreeSearchable && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Search_Free}: ${SDKUI_Localizator.Yes}` }), dtd.templateTID && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Template}: ${dtd.templateTID}` }), dtd.traceTID && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Tracing}: ${SDKUI_Localizator.Yes} - ${dtd.templateTID == TemplateTIDs.Trace_DcmtType ? SDKUI_Localizator.Destination : SDKUI_Localizator.Source} ${dtd.traceTID < 0 ? SDKUI_Localizator.Disabled : ''}` }), dtd.wfAppr && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.WorkflowApproval}: ${SDKUI_Localizator.Yes}` }), dtd.hasBlog && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.BlogCase}: ${SDKUI_Localizator.Yes}` }), dtd.cico && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.CheckIn}: ${SDKUI_Localizator.Yes}` }), dtd.perm ?
-                                    _jsxs(_Fragment, { children: [_jsx(StyledTooltipItem, { "$color": 'primary', "$marginTop": '5px', children: SDKUI_Localizator.Perms }), _jsx(StyledTooltipSeparatorItem, {}), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Archive}: ${dtd.perm.canArchive}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.View_Metadato}: ${dtd.perm.canView}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Search}: ${dtd.perm.canSearch}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Update}: ${dtd.perm.canUpdate}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.RetrieveFile}: ${dtd.perm.canRetrieveFile}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.AddOrSubstFile}: ${dtd.perm.canSubstFile}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.LogDelete}: ${dtd.perm.canLogicalDelete}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.PhysDelete}: ${dtd.perm.canPhysicalDelete}` }), dtd.hasBlog && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Blog_Read}: ${dtd.perm.canReadBlog}` }), dtd.hasBlog && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Blog_Write}: ${dtd.perm.canWriteBlog}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.CheckIn}: ${dtd.perm.canCICO}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.ChronologyDelete}: ${dtd.perm.canDelChron}` })] })
+                                    _jsxs(_Fragment, { children: [_jsx(StyledTooltipItem, { "$color": 'primary', "$marginTop": '5px', children: SDKUI_Localizator.Perms }), _jsx(StyledTooltipSeparatorItem, {}), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Archive}: ${mapAccessLevelToLocalizedString(dtd.perm.canArchive)}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.View_Metadato}: ${mapAccessLevelToLocalizedString(dtd.perm.canView)}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Search}: ${mapAccessLevelToLocalizedString(dtd.perm.canSearch)}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Update}: ${mapAccessLevelToLocalizedString(dtd.perm.canUpdate)}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.RetrieveFile}: ${mapAccessLevelToLocalizedString(dtd.perm.canRetrieveFile)}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.AddOrSubstFile}: ${mapAccessLevelToLocalizedString(dtd.perm.canSubstFile)}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.LogDelete}: ${mapAccessLevelToLocalizedString(dtd.perm.canLogicalDelete)}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.PhysDelete}: ${mapAccessLevelToLocalizedString(dtd.perm.canPhysicalDelete)}` }), dtd.hasBlog && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Blog_Read}: ${mapAccessLevelToLocalizedString(dtd.perm.canReadBlog)}` }), dtd.hasBlog && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Blog_Write}: ${mapAccessLevelToLocalizedString(dtd.perm.canWriteBlog)}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.CheckIn}: ${mapAccessLevelToLocalizedString(dtd.perm.canCICO)}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.ChronologyDelete}: ${mapAccessLevelToLocalizedString(dtd.perm.canDelChron)}` })] })
                                     : dtd.ownershipLevel == OwnershipLevels.DirectOwner || dtd.ownershipLevel == OwnershipLevels.IndirectOwner ?
                                         _jsxs(_Fragment, { children: [_jsx(StyledTooltipItem, { "$color": 'primary', "$marginTop": '5px', children: SDKUI_Localizator.Perms }), _jsx(StyledTooltipSeparatorItem, {}), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Archive}: ${SDKUI_Localizator.Yes}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.View_Metadato}: ${SDKUI_Localizator.Yes}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Search}: ${SDKUI_Localizator.Yes}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Update}: ${SDKUI_Localizator.Yes}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.RetrieveFile}: ${SDKUI_Localizator.Yes}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.AddOrSubstFile}: ${SDKUI_Localizator.Yes}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.LogDelete}: ${SDKUI_Localizator.Yes}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.PhysDelete}: ${SDKUI_Localizator.Yes}` }), dtd.hasBlog && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Blog_Read}: ${SDKUI_Localizator.Yes}` }), dtd.hasBlog && _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.Blog_Write}: ${SDKUI_Localizator.Yes}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.CheckIn}: ${SDKUI_Localizator.Yes}` }), _jsx(StyledTooltipItem, { children: `${SDKUI_Localizator.ChronologyDelete}: ${SDKUI_Localizator.Yes}` })] })
                                         : _jsx(_Fragment, {}), (dtd.widgets && dtd.widgets.length > 0) ? (() => {