oolib 2.5.0 → 2.5.1
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.
|
@@ -73,6 +73,7 @@ var icons_1 = require("../../icons");
|
|
|
73
73
|
var Loader_1 = require("../Loader");
|
|
74
74
|
var BlockLabel_1 = require("../BlockLabel");
|
|
75
75
|
var Typo_1 = require("../Typo");
|
|
76
|
+
var Buttons_1 = require("../Buttons");
|
|
76
77
|
var uitls_1 = require("../uitls");
|
|
77
78
|
var DisplayIcon = function (_a) {
|
|
78
79
|
var icon = _a.icon, onClick = _a.onClick, size = _a.size;
|
|
@@ -80,10 +81,15 @@ var DisplayIcon = function (_a) {
|
|
|
80
81
|
return (react_1.default.createElement("div", { style: { cursor: onClick ? 'pointer' : '' }, onMouseDown: onClick || null }, IconComp && react_1.default.createElement(IconComp, { size: size, weight: "bold" })));
|
|
81
82
|
};
|
|
82
83
|
var TextInput = function (props) {
|
|
83
|
-
var id = props.id, invert = props.invert, disabled = props.disabled, icon = props.icon, type = props.type, maxNumLimiter = props.maxNumLimiter, _a = props.placeholder, placeholder = _a === void 0 ? 'Enter Text...' : _a, value = props.value, onChange = props.onChange, readOnly = props.readOnly, iconOnClick = props.iconOnClick, eyeIcon = props.eyeIcon, S = props.S, validateOnBlur = props.validateOnBlur
|
|
84
|
+
var id = props.id, invert = props.invert, disabled = props.disabled, icon = props.icon, type = props.type, maxNumLimiter = props.maxNumLimiter, _a = props.placeholder, placeholder = _a === void 0 ? 'Enter Text...' : _a, value = props.value, onChange = props.onChange, readOnly = props.readOnly, iconOnClick = props.iconOnClick, eyeIcon = props.eyeIcon, S = props.S, validateOnBlur = props.validateOnBlur, actionBtn = props.actionBtn
|
|
85
|
+
// button,
|
|
86
|
+
// onClick,
|
|
87
|
+
// theme
|
|
88
|
+
;
|
|
84
89
|
var _b = (0, react_1.useState)(''), inputStatus = _b[0], setInputStatus = _b[1];
|
|
85
90
|
var composition = icon && !eyeIcon ? 'icon+text' : 'textOnly';
|
|
86
91
|
var size = S ? 'S' : 'M';
|
|
92
|
+
var actionBtnEnabaled = !!value && (type !== 'url' ? true : inputStatus.type === 'success');
|
|
87
93
|
var handleValidateOnBlur = function (e) { return __awaiter(void 0, void 0, void 0, function () {
|
|
88
94
|
var value, res;
|
|
89
95
|
return __generator(this, function (_a) {
|
|
@@ -94,11 +100,13 @@ var TextInput = function (props) {
|
|
|
94
100
|
return [2 /*return*/];
|
|
95
101
|
if (type === 'url')
|
|
96
102
|
setInputStatus('loading');
|
|
103
|
+
if (!validateOnBlur) return [3 /*break*/, 2];
|
|
97
104
|
return [4 /*yield*/, validateOnBlur(value)];
|
|
98
105
|
case 1:
|
|
99
106
|
res = _a.sent();
|
|
100
107
|
setInputStatus(res);
|
|
101
|
-
|
|
108
|
+
_a.label = 2;
|
|
109
|
+
case 2: return [2 /*return*/];
|
|
102
110
|
}
|
|
103
111
|
});
|
|
104
112
|
}); };
|
|
@@ -111,7 +119,7 @@ var TextInput = function (props) {
|
|
|
111
119
|
}
|
|
112
120
|
};
|
|
113
121
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
114
|
-
react_1.default.createElement("div",
|
|
122
|
+
react_1.default.createElement("div", null,
|
|
115
123
|
react_1.default.createElement("div", { style: { marginBottom: '1rem' } },
|
|
116
124
|
react_1.default.createElement(BlockLabel_1.BlockLabel, __assign({}, (0, uitls_1.getBlockLabelProps)(props)))),
|
|
117
125
|
readOnly ? (react_1.default.createElement(Typo_1.SANS_3, { invert: invert }, type === 'password' ? '********' : value)) : (react_1.default.createElement(react_1.default.Fragment, null,
|
|
@@ -119,7 +127,8 @@ var TextInput = function (props) {
|
|
|
119
127
|
icon && (react_1.default.createElement(DisplayIcon, { icon: icon, size: S ? 15 : 20, onClick: iconOnClick || null })),
|
|
120
128
|
react_1.default.createElement(index_styled_1.InputStyled, { className: 'SANS_3', id: id, type: type, name: type, placeholder: placeholder, value: value, onChange: handleOnChange, maxLength: maxNumLimiter, onBlur: handleValidateOnBlur, size: size, autoComplete: 'off' }),
|
|
121
129
|
inputStatus === 'loading' && (react_1.default.createElement("div", { style: { padding: '1rem 0' } },
|
|
122
|
-
react_1.default.createElement(Loader_1.Loader, { invert: invert, inline: true })))
|
|
130
|
+
react_1.default.createElement(Loader_1.Loader, { invert: invert, inline: true }))),
|
|
131
|
+
actionBtn && (react_1.default.createElement(Buttons_1.ButtonPrimary, { value: actionBtn.text, invert: actionBtn.invert, onClick: actionBtnEnabaled && actionBtn.onClick(), disabled: !actionBtnEnabaled, theme: props.theme, style: { marginRight: '-2rem' } }))),
|
|
123
132
|
(inputStatus === null || inputStatus === void 0 ? void 0 : inputStatus.msg) && (react_1.default.createElement(index_styled_1.MsgContainer, { invert: invert, status: inputStatus === null || inputStatus === void 0 ? void 0 : inputStatus.type },
|
|
124
133
|
react_1.default.createElement(Typo_1.SANS_3, null, inputStatus.msg))))))));
|
|
125
134
|
};
|