@steroidsjs/core 3.0.0-beta.76 → 3.0.0-beta.77

package/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@steroidsjs/core",
- "version": "3.0.0-beta.76",
+ "version": "3.0.0-beta.77",
  "description": "",
  "author": "Vladimir Kozhin <hello@kozhindev.com>",
  "repository": {

package/ui/form/PasswordField/PasswordField.d.ts

@@ -1,6 +1,10 @@
 import { ChangeEvent } from 'react';
 import { IBaseFieldProps } from '../InputField/InputField';
 import { IFieldWrapperOutputProps } from '../Field/fieldWrapper';
+export declare enum InputType {
+    TEXT = "text",
+    PASSWORD = "password"
+}
 /**
  * PasswordField
  *
@@ -27,10 +31,9 @@ export interface IPasswordFieldViewProps extends IPasswordFieldProps, IFieldWrap
         placeholder: string;
         disabled: boolean;
     };
+    onShowButtonClick: () => void;
     onClear?: () => void;
     securityLevel?: 'success' | 'warning' | 'danger';
-    onShowPassword: () => void;
-    onHidePassword: () => void;
 }
 export declare const checkPassword: (password: any) => "success" | "warning" | "danger";
 declare const _default: import("../Field/fieldWrapper").FieldWrapperComponent<IPasswordFieldProps>;

package/ui/form/PasswordField/PasswordField.js

@@ -14,10 +14,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-exports.checkPassword = void 0;
+exports.checkPassword = exports.InputType = void 0;
+/* eslint-disable no-unused-expressions */
 var react_1 = require("react");
 var hooks_1 = require("../../../hooks");
 var fieldWrapper_1 = __importDefault(require("../Field/fieldWrapper"));
+var InputType;
+(function (InputType) {
+    InputType["TEXT"] = "text";
+    InputType["PASSWORD"] = "password";
+})(InputType = exports.InputType || (exports.InputType = {}));
 var checkPassword = function (password) {
     if (!password) {
         return null;
@@ -47,18 +53,17 @@ var checkPassword = function (password) {
 };
 exports.checkPassword = checkPassword;
 function PasswordField(props) {
-    var _a = (0, react_1.useState)('password'), type = _a[0], setType = _a[1];
+    var _a = (0, react_1.useState)(InputType.PASSWORD), type = _a[0], setType = _a[1];
     var components = (0, hooks_1.useComponents)();
     var onClear = (0, react_1.useCallback)(function () { return props.input.onChange(''); }, [props.input]);
-    props.inputProps = (0, react_1.useMemo)(function () {
+    var onShowButtonClick = (0, react_1.useCallback)(function () {
+        type === InputType.PASSWORD ? setType(InputType.TEXT) : setType(InputType.PASSWORD);
+    }, [type]);
+    var inputProps = (0, react_1.useMemo)(function () {
         var _a;
         return (__assign({ name: props.input.name, defaultValue: (_a = props.input.value) !== null && _a !== void 0 ? _a : '', onChange: function (value) { return props.input.onChange(value); }, type: type, placeholder: props.placeholder, disabled: props.disabled }, props.inputProps));
     }, [props.disabled, props.input, props.inputProps, props.placeholder, type]);
-    props.securityLevel = props.showSecurityBar ? (0, exports.checkPassword)(props.input.value) : null;
-    props.onShowPassword = function () { return setType('text'); };
-    props.onHidePassword = function () { return setType('password'); };
-    props.onClear = onClear;
-    return components.ui.renderView(props.view || 'form.PasswordFieldView' || 'form.InputFieldView', props);
+    return components.ui.renderView(props.view || 'form.PasswordFieldView' || 'form.InputFieldView', __assign(__assign({}, props), { inputProps: inputProps, securityLevel: props.showSecurityBar ? (0, exports.checkPassword)(props.input.value) : null, onClear: onClear, onShowButtonClick: onShowButtonClick }));
 }
 PasswordField.defaultProps = {
     disabled: false,