@topconsultnpm/sdkui-react-beta 6.16.81 → 6.16.83

package/lib/components/features/workflow/diagram/DiagramItemSvgContent.js

@@ -45,7 +45,7 @@ const DiagramItemSvgContent = ({ itemType, width, height, isToolboxPreview = fal
                 svgContent = (_jsx("svg", { x: svgCenterX - ICON_SIZE / 2, y: svgCenterY - ICON_SIZE / 2, width: ICON_SIZE, height: ICON_SIZE, viewBox: "0 0 24 24", fill: "orange", children: _jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z" }) }));
             }
             else { // Altrimenti, mostra l'immagine personalizzata
-                svgContent = (_jsx("foreignObject", { x: (width - ICON_SIZE) / 2, y: (height - ICON_SIZE) / 2, width: ICON_SIZE, height: ICON_SIZE, children: _jsx("div", { style: {
+                svgContent = (_jsx("foreignObject", { x: (width - ICON_SIZE) / 2, y: (height - ICON_SIZE) / 2, width: ICON_SIZE, height: ICON_SIZE, children: _jsx("div", { onDragStart: (e) => e.preventDefault(), style: {
                             display: 'flex',
                             alignItems: 'center',
                             justifyContent: 'center',

package/lib/components/features/workflow/diagram/WFDiagram.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useState, useEffect, useCallback, useRef, useMemo } from 'react';
 import { DiagramItemTypes, ArrowSymbol } from './interfaces';
 import { parseWfDiagramXml, serializeWfDiagramToXml } from './xmlParser';
-import styled, { keyframes } from 'styled-components';
+import styled, { css, keyframes } from 'styled-components';
 import { CultureIDs, SearchEngine, WFAppTypes, WorkItemStatus } from "@topconsultnpm/sdk-ts-beta";
 import ConnectionComponent from './ConnectionComponent';
 import DiagramItemComponent from './DiagramItemComponent';
@@ -82,13 +82,17 @@ const CanvasContainer = styled.div `
 `;
 const pulse = keyframes `
     0% {
-        box-shadow: 0 0 0 0px rgba(0, 123, 255, 0.7); /* Colore #007bff */
+        transform: scale(1.0);
+        /* 💡 NUOVO: Ombra bianca/chiara per massimo contrasto contro il blu */
+        box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.9); 
     }
-    70% {
-        box-shadow: 0 0 0 10px rgba(0, 123, 255, 0);
+    50% {
+        transform: scale(1.3); /* Aumentato a 1.3 per maggiore impatto visivo */
+        box-shadow: 0 0 0 12px rgba(255, 255, 255, 0); /* Aumentato lo spread a 12px */
     }
     100% {
-        box-shadow: 0 0 0 0px rgba(0, 123, 255, 0);
+        transform: scale(1.0);
+        box-shadow: 0 0 0 0px rgba(255, 255, 255, 0);
     }
 `;
 const ToolbarContainer = styled.div `
@@ -119,8 +123,6 @@ const ToolbarContainer = styled.div `
   overflow-y: auto;
 
   button {
-
-    
     background: none;
     border: none;
     cursor: pointer;
@@ -129,8 +131,28 @@ const ToolbarContainer = styled.div `
     align-items: center;
     justify-content: ${props => props.$isCollapsed || props.$isFloating ? 'center' : 'flex-start'}; // Centra icone in entrambe le modalità
     white-space: nowrap;
-    position: relative;
-    transition: background-color 0.3s, box-shadow 0.3s;
+
+    position: relative; 
+    overflow: visible; 
+    transition: background-color 0.3s; /* Aggiunto transform per l'animazione */
+    &[title="Progettazione"] {
+            ${props => props.$isReadOnly && css `
+                svg {
+                    /* Applicazione animazione */
+                    animation: ${pulse} 2s infinite; 
+                    
+                    /* Assicura che l'animazione sia sopra */
+                    z-index: 2; 
+                    
+                    /* FIX: box-shadow e transform necessitano di spazio visibile */
+                    overflow: visible; /* Assicurati che l'SVG non tagli l'ombra */
+                    position: relative; /* Necessario per z-index in alcuni contesti */
+                    
+                    /* Assicura una transizione base per trasformazione */
+                    transition: transform 0.2s; 
+                }
+            `}
+        }
 
     svg {
       color: white;

package/lib/components/forms/Login/TMLoginForm.js

@@ -595,7 +595,14 @@ const TMLoginForm = (props) => {
     }, [SDK_Globals.appModule]);
     return (_jsxs(StyledWrapper, { children: [!isMobile && _jsxs(StyledVersionContainer, { children: [_jsxs(StyledVersion, { children: [_jsxs(StyledVersionName, { children: [_jsx("span", { style: { color: TMColors.primary }, children: "\u25CF" }), SDK_Globals.appModule] }), _jsxs("p", { children: ["v.", SDK_Globals.appVersion] })] }), _jsxs(StyledVersion, { children: [_jsxs(StyledVersionName, { children: [_jsx("span", { style: { color: TMColors.tertiary }, children: "\u25CF" }), "SDKUI"] }), _jsxs("p", { children: ["v.", SDK_Globals.sdkuiVersion] })] }), _jsxs(StyledVersion, { children: [_jsxs(StyledVersionName, { children: [_jsx("span", { style: { color: TMColors.error }, children: "\u25CF" }), "SDK"] }), _jsxs("p", { children: ["v.", SDK_Globals.sdkVersion] })] })] }), _jsxs(StyledLoginContainer, { "$isMobile": isMobile, children: [_jsxs(StyledLeftSection, { "$isMobile": isMobile, "$isConnector": props.isConnector ?? false, children: [isMobile && _jsxs(StyledTopBar, { children: [_jsx(StyledTitle, { children: SDKUI_Localizator.WelcomeTo.replaceParams('') + ' ' + welcomeAppNameHeader + ' ' + 'v.' + SDK_Globals.appVersion }), _jsx(StyledMobileVersionIcon, { onClick: showVersionPopup, children: _jsx(IconInfo, { fontSize: 20, color: TMColors.primary }) })] }), _jsx(StyledOverlay, { "$isMobile": isMobile, children: _jsx(StyledCustomLogo, { style: { backgroundImage: `url(${showDefaultLogo ? 'logo-default.svg' : 'logo-custom.svg'})` } }) }), (windowHeight === WindowHeight.LARGE || !isMobile) && _jsxs(StyledPoweredByContainer, { "$isMobile": isMobile, children: [" ", showDefaultLogo ? 'Powered by TopConsult' : _jsx("img", { src: "/logo-default.svg", alt: "Logo", width: isMobile ? 50 : 100 }), " "] })] }), _jsxs(StyledRightSection, { "$isMobile": isMobile, children: [((((getDeviceType() === 'desktop' || isDesktop || isTablet) && windowHeight !== WindowHeight.SMALL)) && !isMobile) && _jsxs(StyledLogoContainer, { "$isMobile": isMobile, children: [_jsx(StyledWelcomeText, { children: SDKUI_Localizator.WelcomeTo.replaceParams('') }), _jsx(StyledLogo, { children: _jsx("img", { src: six, alt: "six", height: 50 }) }), _jsx(StyledWelcomeText, { children: welcomeAppName })] }), _jsxs(StyledToolbarContainer, { children: [_jsx(StyledLanguageChooser, { onClick: () => setShowCultureIDs(true), children: _jsx(TMTooltip, { content: SDKUI_Localizator.CultureID, children: _jsx("img", { src: getCultureIDImg(), alt: "Lang", width: 25, height: 25 }) }) }), loginStep !== 3 && _jsx(TMButton, { btnStyle: "icon", onClick: () => setShowRapidAccess(true), icon: _jsx(IconFastAccess, { fontSize: 20 }), caption: LOGINLocalizator.QuickAccess }), showPasswordOperations && _jsx(TMButton, { disabled: disablePasswordOperations, btnStyle: "icon", onClick: () => setShowChangePassword(true), icon: _jsx(IconPasswordOutline, { fontSize: 19 }), caption: SDKUI_Localizator.ChangePassword })] }), _jsxs(StyledFormContainer, { "$isMobile": isMobile, "$windowHeight": windowHeight, children: [loginStep === 1 &&
                                         _jsxs(StyledStepContainer, { children: [_jsx(Chooser, { isDropDown: isDesktop, dataSource: props.endpoints, value: 'Description', columns: accessPointChooserColumns, additionalIcons: accessPointAdditionalIcons, icon: _jsx(IconAccessPoint, {}), label: SDKUI_Localizator.Endpoint, onSelectionChanged: (ep) => { setEndpoint(ep); setDcmtArchive(undefined); }, validationItems: fieldValidations('endpoint'), selectedRow: endpoint ?? undefined }), _jsx(Chooser, { isDropDown: isDesktop, dataSource: dcmtArchives, value: 'description', columns: dcmtArchiveChooserColumns, icon: _jsx(IconArchiveDoc, {}), label: SDKUI_Localizator.ArchiveID, onSelectionChanged: (arch) => setDcmtArchive(arch), validationItems: fieldValidations('dcmtArchive'), disabled: !endpoint, selectedRow: dcmtArchive ?? undefined })] }), loginStep === 2 &&
-                                        _jsxs(StyledStepContainer, { "$windowHeight": windowHeight, style: { marginTop: windowHeight === WindowHeight.SMALL ? '0' : '20px' }, children: [_jsxs(StyledSummaryContainer, { style: { position: 'absolute', top: getTopOffset(windowHeight, isMobile, isTablet), left: '50%', transform: 'translateX(-50%)', width: 'max-content' }, children: [_jsxs(StyledDescription, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.Endpoint, children: _jsx(IconAccessPoint, { color: TMColors.primary, fontSize: 16 }) }), _jsx("p", { children: endpoint?.Description })] }), _jsxs(StyledDescription, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.ArchiveID, children: _jsx(IconArchiveDoc, { color: TMColors.primary, fontSize: 16 }) }), _jsx("p", { children: dcmtArchive?.description })] })] }), _jsx(SelectBox, { value: authMode, options: authModeOptions, onValueChanged: (value) => setAuthMode(value), validationItems: fieldValidations('authenticationMode'), icon: _jsx(IconLogin, {}), label: SDKUI_Localizator.AuthMode }), _jsxs(StyledCredentialWrapper, { children: [authMode === AuthenticationModes.WindowsThroughTopMedia && _jsx(TextBox, { ref: authDomainRef, value: authDomain, onValueChanged: (e) => setAuthDomain(e), validationItems: fieldValidations('authDomain'), type: "text", icon: _jsx(IconWeb, {}), label: SDKUI_Localizator.Domain }), authMode !== AuthenticationModes.MSAzure && _jsx(CeredentialContainer, { isMobile: isMobile, ref: usernameRef, secondaryRef: passwordRef, usernameValidator: fieldValidations('username'), passwordValidator: fieldValidations('password'), authMode: authMode, username: username, password: password, onUsernameChanged: (un) => setUsername(un), onPasswordChanged: (ps) => setPassword(ps) }), authMode === AuthenticationModes.TopMediaOnBehalfOf &&
+                                        _jsxs(StyledStepContainer, { "$windowHeight": windowHeight, style: { marginTop: windowHeight === WindowHeight.SMALL ? '0' : '20px' }, children: [_jsxs(StyledSummaryContainer, { style: {
+                                                        position: 'absolute',
+                                                        top: getTopOffset(windowHeight, isMobile, isTablet),
+                                                        left: '50%',
+                                                        transform: 'translateX(-50%)',
+                                                        minWidth: 'fit-content',
+                                                        whiteSpace: 'nowrap'
+                                                    }, children: [_jsxs(StyledDescription, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.Endpoint, children: _jsx(IconAccessPoint, { color: TMColors.primary, fontSize: 16 }) }), _jsx("p", { children: endpoint?.Description })] }), _jsxs(StyledDescription, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.ArchiveID, children: _jsx(IconArchiveDoc, { color: TMColors.primary, fontSize: 16 }) }), _jsx("p", { children: dcmtArchive?.description })] })] }), _jsx(SelectBox, { value: authMode, options: authModeOptions, onValueChanged: (value) => setAuthMode(value), validationItems: fieldValidations('authenticationMode'), icon: _jsx(IconLogin, {}), label: SDKUI_Localizator.AuthMode }), _jsxs(StyledCredentialWrapper, { children: [authMode === AuthenticationModes.WindowsThroughTopMedia && _jsx(TextBox, { ref: authDomainRef, value: authDomain, onValueChanged: (e) => setAuthDomain(e), validationItems: fieldValidations('authDomain'), type: "text", icon: _jsx(IconWeb, {}), label: SDKUI_Localizator.Domain }), authMode !== AuthenticationModes.MSAzure && _jsx(CeredentialContainer, { isMobile: isMobile, ref: usernameRef, secondaryRef: passwordRef, usernameValidator: fieldValidations('username'), passwordValidator: fieldValidations('password'), authMode: authMode, username: username, password: password, onUsernameChanged: (un) => setUsername(un), onPasswordChanged: (ps) => setPassword(ps) }), authMode === AuthenticationModes.TopMediaOnBehalfOf &&
                                                             _jsxs(StyledCredentialWrapper, { children: [_jsx(TextBox, { value: authDomain, ref: authDomainRef, onValueChanged: (e) => setAuthDomain(e), validationItems: fieldValidations('authDomain'), type: "text", icon: _jsx(IconWeb, {}), label: SDKUI_Localizator.Domain }), _jsx(CeredentialContainer, { isMobile: isMobile, ref: usernameOnBehalfOfRef, secondaryRef: passwordOnBehalfOfRRef, usernameValidator: fieldValidations('usernameOnBehalfOf'), passwordValidator: fieldValidations('passwordOnBehalfOf'), authMode: AuthenticationModes.TopMediaOnBehalfOf, username: usernameOnBehalf, password: passwordOnBehalf, onUsernameChanged: (un) => setUsernameOnBehalf(un), onPasswordChanged: (ps) => setPasswordOnBehalf(ps) })] })] }), authMode !== AuthenticationModes.TopMediaWithMFA &&
                                                     _jsx(RapidAccessContainer, { isSaveEnable: saveLoginEnable, name: saveLoginName, nameValidationItems: fieldValidations('rapidAccessName'), onEnableSaveChange: () => setSaveLoginEnable(!saveLoginEnable), onNameChange: (name) => setSaveLoginName(name) })] }), loginStep === 3 &&
                                         _jsxs(StyledStepThreeContainer, { "$isMobile": isMobile, children: [_jsx(OTPReader, { isMobile: isMobile, digits: otpCode, onChange: handleDigitChange, onFullChange: handleFullChange, text: _jsxs("div", { children: [" ", LOGINLocalizator.EnterOtpInstructions, " "] }), header: '', additionalButtons: [
@@ -698,7 +705,15 @@ const StyledForgetPassword = styled.div ` position: absolute; bottom: ${props =>
 const StyledBackButton = styled.div ` position: absolute; top: 20px; left: 20px; `;
 const StyledLanguageChooser = styled.button ` border: none; border-radius: 50px; background-color: transparent; cursor: pointer; `;
 const StyledLangChooser = styled.img ` cursor: pointer; border: 3px solid white; border-radius: 50px; `;
-const StyledSummaryContainer = styled.div ` display: flex; align-items: center; gap: 10px; `;
+const StyledSummaryContainer = styled.div ` 
+    display: flex; 
+    align-items: center; 
+    gap: 10px;
+    -ms-flex-align: center;
+    -ms-flex-pack: start;
+    box-sizing: border-box;
+    white-space: nowrap;
+`;
 const StyledCredentialContainer = styled.div ` width: '100%'; display: flex; flex-direction: ${props => getFlexDirection(props.$isMobile, props.$authMode)}; gap: 10px; `;
 const StyledCredentialWrapper = styled.div ` width: 100%; display: flex; flex-direction: column; gap: 10px; `;
 const StyledToolbarContainer = styled.div ` display: flex; gap: 10px; align-items: center; position: absolute; top: 20px; right: 20px; `;

package/package.json

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