@topconsultnpm/sdkui-react-beta 6.11.70 → 6.11.72

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

@@ -58,6 +58,19 @@ const ChangePasswordInputs = ({ changePassword = false, oldPassword, onOldPasswo
             TMSpinner.hide();
         }
     };
+    useEffect(() => {
+        const handleKeyDown = (e) => {
+            if (e.key === 'Enter') {
+                if (!saveBtnDisable) {
+                    onSavePasswordAsync();
+                }
+            }
+        };
+        window.addEventListener('keydown', handleKeyDown);
+        return () => {
+            window.removeEventListener('keydown', handleKeyDown);
+        };
+    }, [saveBtnDisable, onSavePasswordAsync]);
     return (_jsxs(StepContentContainer, { children: [_jsx(Title, { children: SDKUI_Localizator.ChangePassword + ` (${tmSession.SessionDescr?.userName})` }), _jsx(Divider, {}), changePassword && _jsx(TextBox, { ref: oldPasswordRef, showSuccess: true, type: 'password', value: oldPassword, onValueChanged: onOldPasswordChanged, label: SDKUI_Localizator.OldPassword, icon: _jsx(IconPassword, {}), validationItems: changePassword ? fieldValidations('oldPassword') : [] }), _jsx(TextBox, { ref: newPasswordRef, type: 'password', value: newPassword, showSuccess: isValid, onValueChanged: (e) => setNewPassword(e), label: SDKUI_Localizator.NewPassword, icon: _jsx(IconPassword, {}), validationItems: fieldValidations('newPassword'), disabled: oldPassword ? oldPassword.length === 0 : false }), _jsx(TextBox, { ref: confirmPasswordRef, type: 'password', value: confirmPassword, showSuccess: true, onValueChanged: (e) => setConfirmPassword(e), label: SDKUI_Localizator.ConfirmPassword, icon: _jsx(IconPassword, {}), validationItems: fieldValidations('confirmPassword') }), _jsx(TMButton, { fontSize: "1.2rem", caption: SDKUI_Localizator.Save, showTooltip: false, onClick: async () => await onSavePasswordAsync(), disabled: saveBtnDisable }), _jsx(StrengthWrapper, { children: _jsx(PasswordStrengthChecker, { password: newPassword, onValidationChange: (isValid) => { setIsValid(isValid); } }) })] }));
 };
 export default ChangePasswordInputs;

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

@@ -85,6 +85,22 @@ const RecoverPasswordFlow = ({ onClose, tmSession, windowHeight = 800, isMobile
             TMSpinner.hide();
         }
     };
+    useEffect(() => {
+        const handleKeyDown = (e) => {
+            if (e.key === 'Enter') {
+                if (step === 1 && email) {
+                    getOTPAsync();
+                }
+                else if (step === 2 && otpCode.join('').length === 6) {
+                    verifyOTPAsync();
+                }
+            }
+        };
+        window.addEventListener('keydown', handleKeyDown);
+        return () => {
+            window.removeEventListener('keydown', handleKeyDown);
+        };
+    }, [step, email, otpCode, getOTPAsync, verifyOTPAsync]);
     return (_jsxs(Wrapper, { "$windowHeight": windowHeight, children: [_jsx(Title, { children: SDKUI_Localizator.ForgetPassword + ` (${tmSession.SessionDescr?.userName})` }), _jsx(Divider, {}), (!isMobile || windowHeight === WindowHeight.LARGE) && _jsxs(StepIndicatorContainer, { "$windowHeight": windowHeight, children: [" ", _jsx(StepIndicator, { steps: steps, currentStep: step }), " "] }), step === 1 && (_jsxs(Card, { children: [_jsx(Title, { children: SDKUI_Localizator.InsertYourEmail }), _jsx(TextBox, { ref: emailRef, type: "email", showSuccess: true, value: email, onValueChanged: (e) => setEmail(e), placeHolder: 'Email...', validationItems: fieldValidations('email') }), _jsx(TMButton, { fontSize: "1.1rem", caption: LOGINLocalizator.SendOtp, showTooltip: false, disabled: !email, onClick: async () => await getOTPAsync() })] })), step === 2 && (_jsxs(_Fragment, { children: [_jsx(OTPReader, { digits: otpCode, onChange: handleDigitChange, onFullChange: handleFullChange }), _jsx(TMButton, { fontSize: "1.2rem", caption: LOGINLocalizator.Continue, disabled: otpCode.join('').length !== 6, showTooltip: false, onClick: async () => await verifyOTPAsync() })] })), step === 3 && (_jsx(ChangePasswordInputs, { tmSession: tmSession, cpd: cpd, otp: otpCode.join(''), onClose: onClose })), _jsx(BackButtonWrapper, { children: _jsx(TMButton, { onClick: onClose, btnStyle: "icon", icon: _jsx(IconArrowLeft, { fontSize: 20 }), caption: SDKUI_Localizator.Back }) })] }));
 };
 export default RecoverPasswordFlow;

package/lib/components/forms/TMSaveForm.js

@@ -11,7 +11,7 @@ import { TMColors } from '../../utils/theme';
 import TMValidationItemsList from '../grids/TMValidationItemsList';
 import TMModal from '../base/TMModal';
 import { DeviceType, useDeviceType } from '../base/TMDeviceProvider';
-const TMSaveForm = ({ id, formMode = FormModes.Update, showToolbar = true, skipIsModifiedCheck = false, title, children, isModal, exception, customToolbarElements, hasNavigation, showBackButton, onClose, onSaveAsync, onNext, onPrev, canNext, canPrev, isModified, onShowList, validationItems = [], onUndo, onCancel, width, height }) => {
+const TMSaveForm = ({ id, formMode = FormModes.Update, showToolbar = true, skipIsModifiedCheck = false, title, children, isModal, exception, customToolbarElements, hasNavigation, showBackButton, showWarningsCount = true, showErrorCount = true, onClose, onSaveAsync, onNext, onPrev, canNext, canPrev, isModified, onShowList, validationItems = [], onUndo, onCancel, width, height }) => {
     const [showList, setShowList] = useState(true);
     const [showErrorGrid, setShowErrorGrid] = useState(false);
     const deviceType = useDeviceType();
@@ -90,8 +90,8 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, showToolbar = true, skipI
     const warningsCount = validationItems.filter(o => o.ResultType == ResultTypes.WARNING).length;
     const errorsCount = validationItems.filter(o => o.ResultType == ResultTypes.ERROR).length;
     const renderSaveForm = () => {
-        return (_jsxs(TMLayoutContainer, { direction: 'vertical', children: [showToolbar && _jsx(TMLayoutItem, { height: 'max-content', children: _jsxs(StyledToolbarForm, { children: [showBackButton && _jsx(TMButton, { btnStyle: 'toolbar', color: 'tertiary', caption: SDKUI_Localizator.Back, icon: _jsx(IconArrowLeft, {}), elementStyle: { marginRight: '10px' }, onClick: () => { doClose(); } }), _jsx(TMButton, { caption: SDKUI_Localizator.Save, icon: _jsx(IconSave, {}), keyGesture: "alt+s", backgroundColor: errorsCount > 0 ? TMColors.error : isModified ? TMColors.success : TMColors.disabled, onClick: doSaveAsync, color: "success", btnStyle: "toolbar", disabled: !(isModified && errorsCount <= 0) }), hasNavigation && _jsx(TMButton, { caption: SDKUI_Localizator.Previous, icon: _jsx(IconArrowUp, {}), btnStyle: "toolbar", disabled: !canPrev || isModified || formMode == FormModes.Create || formMode == FormModes.Duplicate, onClick: doPrev }), hasNavigation && _jsx(TMButton, { caption: SDKUI_Localizator.Next, icon: _jsx(IconArrowDown, {}), btnStyle: "toolbar", disabled: !canNext || isModified || formMode == FormModes.Create || formMode == FormModes.Duplicate, onClick: doNext }), _jsx(TMButton, { caption: SDKUI_Localizator.Undo, icon: _jsx(IconUndo, {}), keyGesture: "alt+z", color: "tertiary", btnStyle: "toolbar", disabled: isModified ? false : true, onClick: onUndo }), customToolbarElements, warningsCount > 0 &&
-                                _jsx(TMLayoutItem, { width: 'fit-content', height: '90%', children: _jsxs(StyledResultTypeContainer, { style: { marginLeft: '10px' }, onClick: () => setShowErrorGrid(!showErrorGrid), "$resultType": ResultTypes.WARNING, children: [" ", _jsx(IconWarning, { fontSize: 16 }), " ", _jsx("span", { children: warningsCount })] }) }), errorsCount > 0 &&
+        return (_jsxs(TMLayoutContainer, { direction: 'vertical', children: [showToolbar && _jsx(TMLayoutItem, { height: 'max-content', children: _jsxs(StyledToolbarForm, { children: [showBackButton && _jsx(TMButton, { btnStyle: 'toolbar', color: 'tertiary', caption: SDKUI_Localizator.Back, icon: _jsx(IconArrowLeft, {}), elementStyle: { marginRight: '10px' }, onClick: () => { doClose(); } }), _jsx(TMButton, { caption: SDKUI_Localizator.Save, icon: _jsx(IconSave, {}), keyGesture: "alt+s", backgroundColor: errorsCount > 0 ? TMColors.error : isModified ? TMColors.success : TMColors.disabled, onClick: doSaveAsync, color: "success", btnStyle: "toolbar", disabled: !(isModified && errorsCount <= 0) }), hasNavigation && _jsx(TMButton, { caption: SDKUI_Localizator.Previous, icon: _jsx(IconArrowUp, {}), btnStyle: "toolbar", disabled: !canPrev || isModified || formMode == FormModes.Create || formMode == FormModes.Duplicate, onClick: doPrev }), hasNavigation && _jsx(TMButton, { caption: SDKUI_Localizator.Next, icon: _jsx(IconArrowDown, {}), btnStyle: "toolbar", disabled: !canNext || isModified || formMode == FormModes.Create || formMode == FormModes.Duplicate, onClick: doNext }), _jsx(TMButton, { caption: SDKUI_Localizator.Undo, icon: _jsx(IconUndo, {}), keyGesture: "alt+z", color: "tertiary", btnStyle: "toolbar", disabled: isModified ? false : true, onClick: onUndo }), customToolbarElements, Boolean(showWarningsCount && warningsCount > 0) &&
+                                _jsx(TMLayoutItem, { width: 'fit-content', height: '90%', children: _jsxs(StyledResultTypeContainer, { style: { marginLeft: '10px' }, onClick: () => setShowErrorGrid(!showErrorGrid), "$resultType": ResultTypes.WARNING, children: [" ", _jsx(IconWarning, { fontSize: 16 }), " ", _jsx("span", { children: warningsCount })] }) }), Boolean(showErrorCount && errorsCount > 0) &&
                                 _jsx(TMLayoutItem, { width: 'fit-content', height: '90%', children: _jsxs(StyledResultTypeContainer, { style: { marginLeft: warningsCount <= 0 ? '10px' : '0' }, onClick: () => setShowErrorGrid(!showErrorGrid), "$resultType": ResultTypes.ERROR, children: [" ", _jsx(IconCloseCircle, { fontSize: 16 }), " ", _jsx("span", { children: errorsCount })] }) }), onShowList &&
                                 _jsx("div", { style: { right: '10px', position: 'absolute' }, children: deviceType !== DeviceType.MOBILE && _jsx(TMButton, { caption: showList ? SDKUI_Localizator.List_Hide : SDKUI_Localizator.List_Show, icon: showList ? _jsx(IconHide, {}) : _jsx(IconShow, {}), keyGesture: "alt+h", onClick: () => { setShowList(!showList); onShowList?.(!showList); }, btnStyle: 'toolbar' }) }), (formMode == FormModes.Create || formMode == FormModes.Duplicate) &&
                                 _jsx("div", { style: { right: '50px', position: 'absolute' }, children: deviceType !== DeviceType.MOBILE && onCancel && _jsx(TMButton, { icon: _jsx(IconCloseCircle, {}), onClick: onCancel, btnStyle: 'toolbar', caption: SDKUI_Localizator.Cancel, color: 'tertiary' }) })] }) }), _jsx(TMLayoutItem, { height: showToolbar ? 'calc(100% - 35px)' : '100%', children: _jsxs(TMSplitterLayout, { separatorSize: 4, direction: 'vertical', start: showErrorGrid && validationItems.length > 0 ? ['80%', '20%'] : ['100%', '0'], min: ['0', '0'], children: [_jsx(TMCard, { showBorder: false, children: exception

package/lib/ts/types.d.ts

@@ -47,6 +47,8 @@ export interface ITMSaveFormBaseProps {
     height?: string;
     signal?: AbortSignal;
     showBackButton?: boolean;
+    showWarningsCount?: boolean;
+    showErrorCount?: boolean;
     hasNavigation?: boolean;
     onNext?: () => void;
     onPrev?: () => void;

package/package.json

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