intelicoreact 0.1.38 → 0.1.39
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.
|
@@ -76,12 +76,14 @@ function InputMask() {
|
|
|
76
76
|
blinkErrors = _ref$blinkErrors === void 0 ? true : _ref$blinkErrors,
|
|
77
77
|
_ref$blinkDuration = _ref.blinkDuration,
|
|
78
78
|
blinkDuration = _ref$blinkDuration === void 0 ? 100 : _ref$blinkDuration,
|
|
79
|
-
_ref$
|
|
80
|
-
|
|
79
|
+
_ref$showErrors = _ref.showErrors,
|
|
80
|
+
showErrors = _ref$showErrors === void 0 ? true : _ref$showErrors,
|
|
81
81
|
_ref$className = _ref.className,
|
|
82
82
|
className = _ref$className === void 0 ? '' : _ref$className,
|
|
83
83
|
_ref$errors = _ref.errors,
|
|
84
84
|
customErrors = _ref$errors === void 0 ? DEFAULT_ERRORS : _ref$errors,
|
|
85
|
+
_ref$error = _ref.error,
|
|
86
|
+
error = _ref$error === void 0 ? '' : _ref$error,
|
|
85
87
|
ref = _ref.ref,
|
|
86
88
|
_ref$onFocus = _ref.onFocus,
|
|
87
89
|
onFocusProp = _ref$onFocus === void 0 ? function () {} : _ref$onFocus,
|
|
@@ -749,7 +751,12 @@ function InputMask() {
|
|
|
749
751
|
return false;
|
|
750
752
|
});
|
|
751
753
|
});
|
|
752
|
-
}, []);
|
|
754
|
+
}, []);
|
|
755
|
+
(0, _react.useEffect)(function () {
|
|
756
|
+
if (isError) return;
|
|
757
|
+
setError(error !== '');
|
|
758
|
+
setErrorMessage(error === '' ? errors.default : error);
|
|
759
|
+
}, [error, isError]); ///--- RENDER ---///
|
|
753
760
|
|
|
754
761
|
var renderChar = function renderChar(obj, i) {
|
|
755
762
|
var className = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
|
|
@@ -842,7 +849,7 @@ function InputMask() {
|
|
|
842
849
|
|
|
843
850
|
var render = function render() {
|
|
844
851
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
845
|
-
className: "
|
|
852
|
+
className: "input__wrap ".concat(className),
|
|
846
853
|
onBlur: onBlur
|
|
847
854
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
848
855
|
className: "input-mask ".concat(isFocused ? 'input-mask_focus' : '', " ").concat(isError ? 'input-mask_error' : '', " ").concat(blinkError ? 'input-mask_blink-error' : ''),
|
|
@@ -887,7 +894,7 @@ function InputMask() {
|
|
|
887
894
|
hint: hintText,
|
|
888
895
|
className: hintClassName,
|
|
889
896
|
side: hintPosition
|
|
890
|
-
}))),
|
|
897
|
+
}))), showErrors && errorMessage && /*#__PURE__*/_react.default.createElement("div", {
|
|
891
898
|
className: "input-mask_error-text"
|
|
892
899
|
}, errorMessage));
|
|
893
900
|
};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
.
|
|
1
|
+
.input__wrap {
|
|
2
2
|
outline: none;
|
|
3
3
|
display: block;
|
|
4
4
|
// width: fit-content;
|
|
5
|
-
width:
|
|
5
|
+
width: 100%;
|
|
6
6
|
|
|
7
7
|
.input-mask{
|
|
8
8
|
display: inline-flex;
|
|
@@ -19,10 +19,6 @@
|
|
|
19
19
|
&_focus{
|
|
20
20
|
border-color: #6b81dd;
|
|
21
21
|
filter: drop-shadow(0px 0px 4px rgba(93, 120, 255, 0.5));
|
|
22
|
-
|
|
23
|
-
.input-mask_value {
|
|
24
|
-
opacity: 1;
|
|
25
|
-
}
|
|
26
22
|
}
|
|
27
23
|
|
|
28
24
|
&_error,
|
|
@@ -90,7 +86,6 @@
|
|
|
90
86
|
}
|
|
91
87
|
|
|
92
88
|
&_value{
|
|
93
|
-
opacity: 0.6;
|
|
94
89
|
display: flex;
|
|
95
90
|
align-items: center;
|
|
96
91
|
outline: none;
|
|
@@ -124,6 +119,7 @@
|
|
|
124
119
|
}
|
|
125
120
|
|
|
126
121
|
&:last-child{
|
|
122
|
+
color: #333333;
|
|
127
123
|
max-width: 1px;
|
|
128
124
|
}
|
|
129
125
|
}
|
|
@@ -108,15 +108,20 @@ var _default = {
|
|
|
108
108
|
description: 'Duration of <b>Error Blink</b> in <b>ms</b>.',
|
|
109
109
|
default: 100
|
|
110
110
|
},
|
|
111
|
-
|
|
111
|
+
showErrors: {
|
|
112
112
|
type: 'boolean',
|
|
113
113
|
default: true,
|
|
114
|
-
description: 'Turn <b>On/Off</b> Display of
|
|
114
|
+
description: 'Turn <b>On/Off</b> Display of Errors.'
|
|
115
115
|
},
|
|
116
116
|
errors: {
|
|
117
117
|
type: 'object',
|
|
118
118
|
description: "Errors Descriptions: <br/>\n\n {\n onlyLetter: 'Type letter',\n onlyDigit: 'Type digit',\n onlyUpperCase: 'Type letter in UpperCase',\n onlyLowerCase: 'Type letter in LowerCase',\n default: null\n }\n"
|
|
119
119
|
},
|
|
120
|
+
error: {
|
|
121
|
+
type: 'string',
|
|
122
|
+
default: '',
|
|
123
|
+
description: 'Custom Error Text. If is not empty, field would be hightlited'
|
|
124
|
+
},
|
|
120
125
|
onFocus: {
|
|
121
126
|
type: 'function',
|
|
122
127
|
description: 'Callback Function for Handle <b>Input Focus</b>'
|
|
@@ -230,8 +235,9 @@ InputMaskTemplate.args = {
|
|
|
230
235
|
onChange: function onChange() {},
|
|
231
236
|
blinkErrors: false,
|
|
232
237
|
blinkDuration: 100,
|
|
233
|
-
|
|
238
|
+
showErrors: true,
|
|
234
239
|
errors: {},
|
|
240
|
+
error: '',
|
|
235
241
|
onFocus: function onFocus() {},
|
|
236
242
|
onBlur: function onBlur() {},
|
|
237
243
|
className: '',
|