@topconsultnpm/sdkui-react-beta 6.11.68 → 6.11.69
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -79,7 +79,7 @@ const OTPReader = ({ digits, onChange, onFullChange, onResendOTP, resendCooldown
|
|
|
79
79
|
}, 1000);
|
|
80
80
|
};
|
|
81
81
|
const safeDigits = digits.length === 6 ? digits : Array(6).fill('');
|
|
82
|
-
return (_jsxs(Container, { children: [_jsx(LargeTitle, { children: header ?? LOGINLocalizator.EnterOtpCode }), _jsx(Title, { children: text ??
|
|
82
|
+
return (_jsxs(Container, { children: [_jsx(LargeTitle, { children: header ?? LOGINLocalizator.EnterOtpCode }), _jsx(Title, { children: text ?? LOGINLocalizator.EnterOtpEmailOnly }), _jsx(InputsWrapper, { children: safeDigits.map((digit, i) => (_jsx(DigitBox, { "$isMobile": isMobile, "$filled": !!digit, maxLength: 1, value: digit, onChange: (e) => handleChange(e.target.value, i), onKeyDown: (e) => handleKeyDown(e, i), onPaste: handlePaste, ref: (el) => (inputRefs.current[i] = el), inputMode: "numeric" }, i * 2))) }), _jsxs(ControlsRow, { "$isMobile": isMobile, children: [_jsx(TMButton, { btnStyle: 'text', disabled: clearBtnDisabled, caption: SDKUI_Localizator.ClearOTP, showTooltip: false, onClick: handleClearOTP, color: 'tertiary' }), onResendOTP && (_jsx(TMButton, { btnStyle: 'text', disabled: resendTimer > 0, caption: resendTimer > 0 ? `${LOGINLocalizator.ResendIn + ' ' + resendTimer}s` : LOGINLocalizator.ResendOtp, showTooltip: false, onClick: handleResendOTP, color: 'success' })), additionalButtons.map((btn, index) => (_jsx("div", { children: btn }, index * 2)))] })] }));
|
|
83
83
|
};
|
|
84
84
|
export default OTPReader;
|
|
85
85
|
const Container = styled.div ` display: flex; flex-direction: column; align-items: center; gap: 2px; `;
|
|
@@ -94,6 +94,9 @@ const RapidAccessLogin = ({ isMobile = false, onClose, onSelect }) => {
|
|
|
94
94
|
LocalStorageService.setItem(LOCAL_STORAGE_KEY, deepCopy);
|
|
95
95
|
setRapidAccesses(deepCopy);
|
|
96
96
|
}, [rapidAccesses]);
|
|
97
|
+
const sortedArray = useMemo(() => {
|
|
98
|
+
return searchedRapidAccesses.sort((a, b) => a.name.localeCompare(b.name));
|
|
99
|
+
}, [searchedRapidAccesses]);
|
|
97
100
|
const onExportCallback = () => {
|
|
98
101
|
const exportToFile = (data, filenamePrefix) => {
|
|
99
102
|
const file = new Blob([JSON.stringify(data, null, 2)], { type: 'text/plain' });
|
|
@@ -181,7 +184,7 @@ const RapidAccessLogin = ({ isMobile = false, onClose, onSelect }) => {
|
|
|
181
184
|
}, () => alert(SDKUI_Localizator.ErrorParsingFileContent));
|
|
182
185
|
});
|
|
183
186
|
};
|
|
184
|
-
return (_jsxs(Wrapper, { children: [_jsx(BackButtonWrapper, { children: _jsx(TMButton, { onClick: onClose, btnStyle: "icon", icon: _jsx(IconArrowLeft, { fontSize: 20 }), caption: SDKUI_Localizator.Back }) }), _jsxs(ContentWrapper, { children: [_jsxs(ContentHeader, { children: [_jsx("h3", { style: { width: 'max-content' }, children: LOGINLocalizator.QuickAccess }), _jsx("div", { style: { width: '50%' }, children: _jsx(TextBox, { value: searchValue, onValueChanged: (value) => setSearchValue(value), type: 'text', placeHolder: 'Cerca...', additionalIcons: additionalClearBtn }) })] }), _jsx(Divider, {}), _jsx(List, { children:
|
|
187
|
+
return (_jsxs(Wrapper, { children: [_jsx(BackButtonWrapper, { children: _jsx(TMButton, { onClick: onClose, btnStyle: "icon", icon: _jsx(IconArrowLeft, { fontSize: 20 }), caption: SDKUI_Localizator.Back }) }), _jsxs(ContentWrapper, { children: [_jsxs(ContentHeader, { children: [_jsx("h3", { style: { width: 'max-content' }, children: LOGINLocalizator.QuickAccess }), _jsx("div", { style: { width: '50%' }, children: _jsx(TextBox, { value: searchValue, onValueChanged: (value) => setSearchValue(value), type: 'text', placeHolder: 'Cerca...', additionalIcons: additionalClearBtn }) })] }), _jsx(Divider, {}), _jsx(List, { children: sortedArray.map((rapidAccess, index) => (_jsx(RapidAccessItem, { index: index, onRemove: remove, onSelect: select, onDefault: setDefault, onChangeName: changeName, rapidAccess: rapidAccess, isMobile: isMobile, onChangeColor: setColor, onChangeIcon: setIcon }, index * 2))) })] }), _jsxs(ToolbarWrapper, { children: [_jsx(TMButton, { btnStyle: 'icon', icon: _jsx(IconImport, {}), caption: SDKUI_Localizator.Import, color: 'tertiary', onClick: onImportCallback }), _jsx(TMButton, { btnStyle: 'icon', icon: _jsx(IconExport, {}), caption: SDKUI_Localizator.Export, color: 'primary', onClick: onExportCallback })] })] }));
|
|
185
188
|
};
|
|
186
189
|
export default RapidAccessLogin;
|
|
187
190
|
const RapidAccessItem = ({ rapidAccess, isMobile = false, onRemove, onSelect, onDefault, onChangeName, onChangeColor, onChangeIcon, index = 0 }) => {
|
|
@@ -244,7 +247,7 @@ const RapidAccessItem = ({ rapidAccess, isMobile = false, onRemove, onSelect, on
|
|
|
244
247
|
const onRemovePopup = () => {
|
|
245
248
|
const msg = SDKUI_Localizator.Delete_ConfirmFor1.replaceParams(rapidAccess.name);
|
|
246
249
|
TMMessageBoxManager.show({
|
|
247
|
-
title:
|
|
250
|
+
title: LOGINLocalizator.QuickAccess, message: msg, buttons: [ButtonNames.YES, ButtonNames.NO],
|
|
248
251
|
onButtonClick: (e) => {
|
|
249
252
|
if (e !== ButtonNames.YES)
|
|
250
253
|
return;
|
|
@@ -269,7 +272,8 @@ const RapidAccessItem = ({ rapidAccess, isMobile = false, onRemove, onSelect, on
|
|
|
269
272
|
onChangeIcon(rapidAccess.id, iconKey);
|
|
270
273
|
handleClose();
|
|
271
274
|
};
|
|
272
|
-
|
|
275
|
+
const expandedAriaHandler = () => setIsExpanded(!isExpanded);
|
|
276
|
+
return (_jsxs(Container, { children: [_jsxs(ItemWrapper, { children: [_jsxs(ItemProfileWrapper, { style: { zIndex: 100 - index }, onDoubleClick: () => onSelect(rapidAccess.id), children: [_jsx(PreferredIconContainer, { onClick: () => onDefault(rapidAccess.id), children: _jsx(TMTooltip, { content: SDKUI_Localizator.Default, children: rapidAccess.preferred ? _jsx(IconStarSolid, { color: TMColors.tertiary, fontSize: 20 }) : _jsx(IconStarOutline, { fontSize: 20 }) }) }), _jsx(ProfileCircle, { "$color": rapidAccess.color ?? TMColors.primary, onClick: () => setIsMenuOpen(true), children: iconMap[rapidAccess.icon] ?? _jsx(IconUser, { fontSize: 20 }) }), _jsxs(RapidAccessName, { onClick: expandedAriaHandler, children: [" ", truncateText(rapidAccess.name, 50)] })] }), _jsxs(ItemOperationsWrapper, { children: [_jsx(ExpandButton, { onClick: expandedAriaHandler, children: isExpanded ? _jsx(IconCollapse, { fontSize: 16 }) : _jsx(IconExpand, { fontSize: 16 }) }), _jsx(TMButton, { color: 'primary', caption: SDKUI_Localizator.Select, showTooltip: false, onClick: () => onSelect(rapidAccess.id) }), _jsx(TMButton, { color: 'tertiary', caption: SDKUI_Localizator.Remove, showTooltip: false, onClick: onRemovePopup })] }), _jsx(Menu, { x: isMobile ? 0 : 80, y: isMobile ? -40 : 0, onClose: () => handleClose(), visible: isMenuOpen, children: _jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: '10px' }, children: [_jsxs(StyledMenuItemContainer, { style: { flexWrap: 'wrap' }, children: [colors.map((color, index) => (_jsx(ColorWrapper, { onClick: () => onColorPick(color), children: _jsx(ColorPicker, { "$color": color }) }, index * 2))), _jsx(ColorWrapper, { onClick: () => setShowIconMenu(!showIconMenu), children: icons.find(icon => icon[0] === rapidAccess.icon)?.[1] ?? _jsx(IconUser, {}) })] }), showIconMenu && _jsx(StyledMenuItemContainer, { style: { flexWrap: 'wrap' }, children: icons.map(([key, icon]) => (_jsx(ColorWrapper, { onClick: () => onIconPick(key), children: _jsx(ColorPicker, { "$color": "white", children: icon }) }, key))) })] }) })] }), isExpanded &&
|
|
273
277
|
_jsxs(ExpandedAria, { children: [_jsxs(InputContainer, { "$isMobile": isMobile, children: [_jsx(TextBox, { value: name, onValueChanged: (value) => setName(value), type: 'text', label: SDKUI_Localizator.NameForAccess, additionalIcons: additionalSaveBtn }), _jsx(TextBox, { value: rapidAccess.endpoint?.Description, type: 'text', label: SDKUI_Localizator.Endpoint, disabled: true })] }), _jsxs(InputContainer, { "$isMobile": isMobile, children: [_jsx(TextBox, { value: rapidAccess.archive?.description, type: 'text', label: SDKUI_Localizator.ArchiveID, disabled: true }), _jsx(TextBox, { value: rapidAccess.authenticationMode, type: 'text', label: SDKUI_Localizator.AuthMode, disabled: true })] }), _jsxs(InputContainer, { "$isMobile": isMobile, children: [_jsx(TextBox, { value: rapidAccess.username, type: 'text', label: SDKUI_Localizator.UserName, disabled: true }), _jsx(TextBox, { value: cultureIDsDataSource.find(cid => cid.value === rapidAccess.language)?.display, type: 'text', label: SDKUI_Localizator.CultureID, disabled: true })] }), hasAuthDomain && _jsxs(InputContainer, { "$isMobile": isMobile, children: [_jsx(TextBox, { value: domainValue, type: 'text', label: SDKUI_Localizator.Domain, disabled: true }), rapidAccess.authenticationMode === AuthenticationModes.TopMediaOnBehalfOf &&
|
|
274
278
|
_jsx(TextBox, { value: rapidAccess.onBehalfUsername, type: 'text', label: SDKUI_Localizator.UserName + ' ' + `(${SDKUI_Localizator.OnBehalfOf})`, disabled: true })] })] })] }));
|
|
275
279
|
};
|
|
@@ -291,6 +295,7 @@ const ContentWrapper = styled.div ` width: 100%; margin-top: 40px; padding: 40px
|
|
|
291
295
|
const ContentHeader = styled.div ` width: 100%; display: flex; align-items: center; justify-content: space-between; `;
|
|
292
296
|
const PreferredIconContainer = styled.div ` margin-right: 5px; cursor: pointer; `;
|
|
293
297
|
const StyledMenuItemContainer = styled.div `display:flex;align-items:center;gap:10px;padding:0;`;
|
|
298
|
+
const RapidAccessName = styled.p ``;
|
|
294
299
|
function IconCollapse(props) { return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "1em", height: "1em", ...props, children: [" ", _jsx("path", { fill: "currentColor", d: "M8.12 14.71L12 10.83l3.88 3.88a.996.996 0 1 0 1.41-1.41L12.7 8.71a.996.996 0 0 0-1.41 0L6.7 13.3a.996.996 0 0 0 0 1.41c.39.38 1.03.39 1.42 0" }), " "] })); } //NOSONAR
|
|
295
300
|
function IconExpand(props) { return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "1em", height: "1em", ...props, children: [" ", _jsx("path", { fill: "currentColor", d: "M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6l-6-6z" }), " "] })); } //NOSONAR
|
|
296
301
|
function IconStarOutline(props) { return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "1em", height: "1em", ...props, children: [" ", _jsx("path", { fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "m8.587 8.236l2.598-5.232a.911.911 0 0 1 1.63 0l2.598 5.232l5.808.844a.902.902 0 0 1 .503 1.542l-4.202 4.07l.992 5.75c.127.738-.653 1.3-1.32.952L12 18.678l-5.195 2.716c-.666.349-1.446-.214-1.319-.953l.992-5.75l-4.202-4.07a.902.902 0 0 1 .503-1.54z" }), " "] })); } //NOSONAR
|
|
@@ -332,6 +332,12 @@ const TMLoginForm = (props) => {
|
|
|
332
332
|
if (loginStep === 3)
|
|
333
333
|
return;
|
|
334
334
|
};
|
|
335
|
+
const loginHandler = async () => {
|
|
336
|
+
if (saveLoginEnable)
|
|
337
|
+
await handleRapidAccessCreate();
|
|
338
|
+
else
|
|
339
|
+
await loginAsync();
|
|
340
|
+
};
|
|
335
341
|
const previousStepHandler = useCallback(() => {
|
|
336
342
|
if (loginStep === 1)
|
|
337
343
|
return;
|
|
@@ -540,6 +546,22 @@ const TMLoginForm = (props) => {
|
|
|
540
546
|
const showVersionPopup = () => {
|
|
541
547
|
TMMessageBoxManager.show({ buttons: [ButtonNames.OK], title: `About. ${SDK_Globals.appModule}`, message: _jsx(TMAboutApp, { app: true, skdui: true, sdk: true, websdk: false }) });
|
|
542
548
|
};
|
|
549
|
+
useEffect(() => {
|
|
550
|
+
const handleKeyDown = (e) => {
|
|
551
|
+
if (e.key === 'Enter') {
|
|
552
|
+
if (showContinueBtn && !disableContinueBtn) {
|
|
553
|
+
nextStepHandler();
|
|
554
|
+
}
|
|
555
|
+
else if (showLoginBtn && !disableLoginBtn) {
|
|
556
|
+
loginHandler();
|
|
557
|
+
}
|
|
558
|
+
}
|
|
559
|
+
};
|
|
560
|
+
window.addEventListener('keydown', handleKeyDown);
|
|
561
|
+
return () => {
|
|
562
|
+
window.removeEventListener('keydown', handleKeyDown);
|
|
563
|
+
};
|
|
564
|
+
}, [showContinueBtn, disableContinueBtn, showLoginBtn, disableLoginBtn, nextStepHandler, loginHandler]);
|
|
543
565
|
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, children: [isMobile && _jsxs(StyledTopBar, { children: [_jsx(StyledTitle, { children: SDKUI_Localizator.WelcomeTo.replaceParams('') + ' ' + SDK_Globals.appModule }), _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('') }), _jsxs(StyledLogo, { children: [_jsx("img", { src: six, alt: "six", width: 40 }), _jsxs(StyledLogoTextContainer, { children: [_jsx("div", { style: { fontWeight: 'lighter', color: 'black', fontSize: '0.9rem' }, children: "TopMedia" }), _jsx("div", { style: { fontSize: '1.3rem', color: TMColors.secondary, fontStyle: 'italic', fontWeight: 'bolder', textTransform: 'uppercase', letterSpacing: '6px' }, children: SDK_Globals.appModule })] })] })] }), _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 &&
|
|
544
566
|
_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 &&
|
|
545
567
|
_jsxs(StyledStepContainer, { "$windowHeight": windowHeight, style: { marginTop: '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 &&
|
|
@@ -548,7 +570,7 @@ const TMLoginForm = (props) => {
|
|
|
548
570
|
_jsxs(StyledStepThreeContainer, { "$isMobile": isMobile, children: [_jsx(OTPReader, { isMobile: isMobile, digits: otpCode, onChange: handleDigitChange, onFullChange: handleFullChange, text: _jsxs("div", { children: [" ", LOGINLocalizator.EnterOtpInstructions, " "] }), header: '', additionalButtons: [
|
|
549
571
|
_jsx(TMButton, { btnStyle: 'text', caption: LOGINLocalizator.SetupAuthenticator, showTooltip: false, onClick: async () => await loginForMFAAsync(2), color: 'success' }, 0),
|
|
550
572
|
_jsx(TMButton, { btnStyle: 'text', disabled: isOTPSent, caption: LOGINLocalizator.SendOtpByEmail, showTooltip: false, onClick: async () => { await loginForMFAAsync(1); setIsOTPSent(true); }, color: 'primary' }, 1),
|
|
551
|
-
] }), _jsx(StyledRapidAccessWrapper, { "$isMobile": isMobile, children: _jsx(RapidAccessContainer, { isSaveEnable: saveLoginEnable, name: saveLoginName, nameValidationItems: fieldValidations('rapidAccessName'), onEnableSaveChange: () => setSaveLoginEnable(!saveLoginEnable), onNameChange: (name) => setSaveLoginName(name) }) })] }), _jsxs(StyledButtonContainer, { children: [showContinueBtn && _jsx(TMButton, { fontSize: "1.2rem", onClick: nextStepHandler, showTooltip: false, caption: LOGINLocalizator.Continue, disabled: disableContinueBtn }), showLoginBtn && _jsx(TMButton, { fontSize: "1.2rem", showTooltip: false, onClick:
|
|
573
|
+
] }), _jsx(StyledRapidAccessWrapper, { "$isMobile": isMobile, children: _jsx(RapidAccessContainer, { isSaveEnable: saveLoginEnable, name: saveLoginName, nameValidationItems: fieldValidations('rapidAccessName'), onEnableSaveChange: () => setSaveLoginEnable(!saveLoginEnable), onNameChange: (name) => setSaveLoginName(name) }) })] }), _jsxs(StyledButtonContainer, { children: [showContinueBtn && _jsx(TMButton, { fontSize: "1.2rem", onClick: nextStepHandler, showTooltip: false, caption: LOGINLocalizator.Continue, disabled: disableContinueBtn }), showLoginBtn && _jsx(TMButton, { fontSize: "1.2rem", showTooltip: false, onClick: loginHandler, caption: saveLoginEnable ? SDKUI_Localizator.SaveAndLogin : SDKUI_Localizator.Login, disabled: disableLoginBtn })] })] }), showPasswordOperations && _jsx(StyledForgetPassword, { "$isMobile": isMobile, children: _jsx(TMButton, { disabled: disablePasswordOperations, btnStyle: "text", caption: SDKUI_Localizator.ForgetPassword, showTooltip: false, onClick: () => setShowForgetPassword(true) }) }), showBackBtn && _jsx(StyledBackButton, { children: _jsx(TMButton, { onClick: previousStepHandler, btnStyle: "icon", icon: _jsx(IconArrowLeft, { fontSize: 20 }), caption: SDKUI_Localizator.Back }) }), showCultureIDs && _jsx(Menu, { onClose: () => setShowCultureIDs(false), x: 'calc(100% - 250px)', y: 50, visible: showCultureIDs, children: _jsxs(StyledMenuItemContainer, { children: [_jsx(StyledLangChooser, { onClick: () => cultureIDHandler(CultureIDs.It_IT), title: cultureIDsDataSource[0].display, src: it, alt: "it", width: BANNER_DIMENSION, height: BANNER_DIMENSION }), _jsx(StyledLangChooser, { onClick: () => cultureIDHandler(CultureIDs.En_US), title: cultureIDsDataSource[3].display, src: en, alt: "en", width: BANNER_DIMENSION, height: BANNER_DIMENSION }), _jsx(StyledLangChooser, { onClick: () => cultureIDHandler(CultureIDs.Fr_FR), title: cultureIDsDataSource[1].display, src: fr, alt: "fr", width: BANNER_DIMENSION, height: BANNER_DIMENSION }), _jsx(StyledLangChooser, { onClick: () => cultureIDHandler(CultureIDs.Es_ES), title: cultureIDsDataSource[4].display, src: es, alt: "es", width: BANNER_DIMENSION, height: BANNER_DIMENSION }), _jsx(StyledLangChooser, { onClick: () => cultureIDHandler(CultureIDs.Pt_PT), title: cultureIDsDataSource[2].display, src: pt, alt: "pt", width: BANNER_DIMENSION, height: BANNER_DIMENSION }), _jsx(StyledLangChooser, { onClick: () => cultureIDHandler(CultureIDs.De_DE), title: cultureIDsDataSource[5].display, src: de, alt: "de", width: BANNER_DIMENSION, height: BANNER_DIMENSION })] }) }), showChangePassword && _jsx(ChangePassword, { tmSession: changePswTmSession, onClose: () => setShowChangePassword(false) }), showForgetPassword && _jsx(RecoverPasswordFlow, { isMobile: isMobile, tmSession: changePswTmSession, onClose: () => setShowForgetPassword(false), windowHeight: windowHeight }), showRapidAccess && _jsx(RapidAccessLogin, { isMobile: isMobile, onClose: () => setShowRapidAccess(false), onSelect: handleRapidAccessSelection })] })] })] }));
|
|
552
574
|
};
|
|
553
575
|
export default TMLoginForm;
|
|
554
576
|
const CeredentialContainer = forwardRef(({ isMobile = false, authMode = AuthenticationModes.TopMedia, password = '', username = '', onPasswordChanged, onUsernameChanged, passwordValidator = [], usernameValidator = [], secondaryRef }, ref) => {
|