1 | import { __rest } from "tslib";
|
2 | import * as React from 'react';
|
3 | import { Form, FormGroup, ActionGroup, FormHelperText } from '../Form';
|
4 | import { TextInput } from '../TextInput';
|
5 | import { Button } from '../Button';
|
6 | import { Checkbox } from '../Checkbox';
|
7 | import { ValidatedOptions } from '../../helpers/constants';
|
8 | import { InputGroup } from '../InputGroup';
|
9 | import EyeSlashIcon from '@patternfly/react-icons/dist/esm/icons/eye-slash-icon';
|
10 | import EyeIcon from '@patternfly/react-icons/dist/esm/icons/eye-icon';
|
11 | export const LoginForm = (_a) => {
|
12 | var { noAutoFocus = false, className = '', showHelperText = false, helperText = null, helperTextIcon = null, usernameLabel = 'Username', usernameValue = '', onChangeUsername = () => undefined, isValidUsername = true, passwordLabel = 'Password', passwordValue = '', onChangePassword = () => undefined, isShowPasswordEnabled = false, hidePasswordAriaLabel = 'Hide password', showPasswordAriaLabel = 'Show password', isValidPassword = true, loginButtonLabel = 'Log In', isLoginButtonDisabled = false, onLoginButtonClick = () => undefined, rememberMeLabel = '', isRememberMeChecked = false, onChangeRememberMe = () => undefined } = _a, props = __rest(_a, ["noAutoFocus", "className", "showHelperText", "helperText", "helperTextIcon", "usernameLabel", "usernameValue", "onChangeUsername", "isValidUsername", "passwordLabel", "passwordValue", "onChangePassword", "isShowPasswordEnabled", "hidePasswordAriaLabel", "showPasswordAriaLabel", "isValidPassword", "loginButtonLabel", "isLoginButtonDisabled", "onLoginButtonClick", "rememberMeLabel", "isRememberMeChecked", "onChangeRememberMe"]);
|
13 | const [passwordHidden, setPasswordHidden] = React.useState(true);
|
14 | const passwordInput = (React.createElement(TextInput, { isRequired: true, type: passwordHidden ? 'password' : 'text', id: "pf-login-password-id", name: "pf-login-password-id", validated: isValidPassword ? ValidatedOptions.default : ValidatedOptions.error, value: passwordValue, onChange: onChangePassword }));
|
15 | return (React.createElement(Form, Object.assign({ className: className }, props),
|
16 | React.createElement(FormHelperText, { isError: !isValidUsername || !isValidPassword, isHidden: !showHelperText, icon: helperTextIcon }, helperText),
|
17 | React.createElement(FormGroup, { label: usernameLabel, isRequired: true, validated: isValidUsername ? ValidatedOptions.default : ValidatedOptions.error, fieldId: "pf-login-username-id" },
|
18 | React.createElement(TextInput, { autoFocus: !noAutoFocus, id: "pf-login-username-id", isRequired: true, validated: isValidUsername ? ValidatedOptions.default : ValidatedOptions.error, type: "text", name: "pf-login-username-id", value: usernameValue, onChange: onChangeUsername })),
|
19 | React.createElement(FormGroup, { label: passwordLabel, isRequired: true, validated: isValidPassword ? ValidatedOptions.default : ValidatedOptions.error, fieldId: "pf-login-password-id" },
|
20 | isShowPasswordEnabled && (React.createElement(InputGroup, null,
|
21 | passwordInput,
|
22 | React.createElement(Button, { variant: "control", onClick: () => setPasswordHidden(!passwordHidden), "aria-label": passwordHidden ? showPasswordAriaLabel : hidePasswordAriaLabel }, passwordHidden ? React.createElement(EyeIcon, null) : React.createElement(EyeSlashIcon, null)))),
|
23 | !isShowPasswordEnabled && passwordInput),
|
24 | rememberMeLabel.length > 0 && (React.createElement(FormGroup, { fieldId: "pf-login-remember-me-id" },
|
25 | React.createElement(Checkbox, { id: "pf-login-remember-me-id", label: rememberMeLabel, isChecked: isRememberMeChecked, onChange: onChangeRememberMe }))),
|
26 | React.createElement(ActionGroup, null,
|
27 | React.createElement(Button, { variant: "primary", type: "submit", onClick: onLoginButtonClick, isBlock: true, isDisabled: isLoginButtonDisabled }, loginButtonLabel))));
|
28 | };
|
29 | LoginForm.displayName = 'LoginForm';
|
30 |
|
\ | No newline at end of file |