@typeolymp/ui-components 1.16.3 → 1.16.5
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.
- package/build/components/organisms/Form/index.d.ts +2 -2
- package/build/index.es.js +86 -31
- package/build/index.es.js.map +1 -1
- package/build/index.js +86 -31
- package/build/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -10,14 +10,14 @@ import { PropsType as CheckboxesPropsType } from "../../molecules/Checkboxes";
|
|
|
10
10
|
import { PropsType as SelectFieldPropsType } from "../../molecules/SelectField";
|
|
11
11
|
import { PropsType as ToggleFieldPropsType } from "../../molecules/ToggleField";
|
|
12
12
|
import { PropsType as RangeFieldPropsType } from "../../molecules/RangeField";
|
|
13
|
-
declare type ValueType = string |
|
|
13
|
+
declare type ValueType = string | string[] | number | boolean;
|
|
14
14
|
export declare type FeedbackType = {
|
|
15
15
|
message: string;
|
|
16
16
|
status: "error" | "success" | "";
|
|
17
17
|
};
|
|
18
18
|
declare type ValidationType = {
|
|
19
19
|
validateTrigger?: Array<"onBlur" | "onChange">;
|
|
20
|
-
validator
|
|
20
|
+
validator?: ((value: ValueType) => FeedbackType) | ((value: ValueType) => Promise<FeedbackType>);
|
|
21
21
|
feedback?: FeedbackType;
|
|
22
22
|
};
|
|
23
23
|
declare type InputFieldType = {
|
package/build/index.es.js
CHANGED
|
@@ -185,6 +185,44 @@ function __rest(s, e) {
|
|
|
185
185
|
return t;
|
|
186
186
|
}
|
|
187
187
|
|
|
188
|
+
function __awaiter(thisArg, _arguments, P, generator) {
|
|
189
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
190
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
191
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
192
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
193
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
194
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
195
|
+
});
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
function __generator(thisArg, body) {
|
|
199
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
200
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
201
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
202
|
+
function step(op) {
|
|
203
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
204
|
+
while (_) try {
|
|
205
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
206
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
207
|
+
switch (op[0]) {
|
|
208
|
+
case 0: case 1: t = op; break;
|
|
209
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
210
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
211
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
212
|
+
default:
|
|
213
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
214
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
215
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
216
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
217
|
+
if (t[2]) _.ops.pop();
|
|
218
|
+
_.trys.pop(); continue;
|
|
219
|
+
}
|
|
220
|
+
op = body.call(thisArg, _);
|
|
221
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
222
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
223
|
+
}
|
|
224
|
+
}
|
|
225
|
+
|
|
188
226
|
function __spreadArray(to, from, pack) {
|
|
189
227
|
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
190
228
|
if (ar || !(i in from)) {
|
|
@@ -12066,29 +12104,46 @@ var Form = forwardRef(function (props, ref) {
|
|
|
12066
12104
|
_loop_1(field);
|
|
12067
12105
|
}
|
|
12068
12106
|
};
|
|
12069
|
-
var onChangeFormField = function (fieldName, value) {
|
|
12107
|
+
var onChangeFormField = function (fieldName, value) { return __awaiter(void 0, void 0, void 0, function () {
|
|
12108
|
+
var feedbackForField, field, newValues;
|
|
12070
12109
|
var _a, _b, _c;
|
|
12071
|
-
|
|
12072
|
-
|
|
12073
|
-
|
|
12074
|
-
|
|
12075
|
-
|
|
12076
|
-
|
|
12077
|
-
|
|
12078
|
-
|
|
12079
|
-
|
|
12080
|
-
|
|
12081
|
-
|
|
12082
|
-
|
|
12110
|
+
return __generator(this, function (_d) {
|
|
12111
|
+
switch (_d.label) {
|
|
12112
|
+
case 0:
|
|
12113
|
+
feedbackForField = { status: undefined, message: undefined };
|
|
12114
|
+
field = props.fields.find(function (field) { return field.name === fieldName; });
|
|
12115
|
+
if (!(field.validateTrigger && field.validateTrigger.includes("onChange"))) return [3 /*break*/, 2];
|
|
12116
|
+
return [4 /*yield*/, field.validator(values[fieldName])];
|
|
12117
|
+
case 1:
|
|
12118
|
+
feedbackForField = _d.sent();
|
|
12119
|
+
_d.label = 2;
|
|
12120
|
+
case 2:
|
|
12121
|
+
setFeedback(__assign$2(__assign$2({}, feedback), (_a = {}, _a[fieldName] = feedbackForField, _a)));
|
|
12122
|
+
newValues = __assign$2(__assign$2({}, values), (_b = {}, _b[fieldName] = value, _b));
|
|
12123
|
+
setValues(newValues);
|
|
12124
|
+
if (props.onChangeFields)
|
|
12125
|
+
props.onChangeFields(newValues, __assign$2(__assign$2({}, values), (_c = {}, _c[fieldName] = value, _c)));
|
|
12126
|
+
return [2 /*return*/];
|
|
12127
|
+
}
|
|
12128
|
+
});
|
|
12129
|
+
}); };
|
|
12130
|
+
var onBlurFormField = function (fieldName) { return __awaiter(void 0, void 0, void 0, function () {
|
|
12131
|
+
var field, feedbackForField;
|
|
12083
12132
|
var _a;
|
|
12084
|
-
|
|
12085
|
-
|
|
12086
|
-
|
|
12087
|
-
|
|
12088
|
-
|
|
12089
|
-
|
|
12090
|
-
|
|
12091
|
-
|
|
12133
|
+
return __generator(this, function (_b) {
|
|
12134
|
+
switch (_b.label) {
|
|
12135
|
+
case 0:
|
|
12136
|
+
field = props.fields.find(function (field) { return field.name === fieldName; });
|
|
12137
|
+
if (!(field.validateTrigger && field.validateTrigger.includes("onBlur"))) return [3 /*break*/, 2];
|
|
12138
|
+
return [4 /*yield*/, field.validator(values[fieldName])];
|
|
12139
|
+
case 1:
|
|
12140
|
+
feedbackForField = _b.sent();
|
|
12141
|
+
setFeedback(__assign$2(__assign$2({}, feedback), (_a = {}, _a[fieldName] = feedbackForField, _a)));
|
|
12142
|
+
_b.label = 2;
|
|
12143
|
+
case 2: return [2 /*return*/];
|
|
12144
|
+
}
|
|
12145
|
+
});
|
|
12146
|
+
}); };
|
|
12092
12147
|
var onSubmit = function () {
|
|
12093
12148
|
var isValid = true;
|
|
12094
12149
|
var feedback = {};
|
|
@@ -12112,34 +12167,34 @@ var Form = forwardRef(function (props, ref) {
|
|
|
12112
12167
|
switch (field.type) {
|
|
12113
12168
|
case "text":
|
|
12114
12169
|
return (createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
12115
|
-
jsx$1(InputField, __assign$2({}, field, { onChange: onChangeFormField, onBlur:
|
|
12170
|
+
jsx$1(InputField, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField }))));
|
|
12116
12171
|
case "password":
|
|
12117
12172
|
return (createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
12118
|
-
jsx$1(PasswordInputField, __assign$2({}, field, { onChange: onChangeFormField, onBlur:
|
|
12173
|
+
jsx$1(PasswordInputField, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField, onKeyPress: field.submitOnEnter && onSubmit }))));
|
|
12119
12174
|
case "date":
|
|
12120
12175
|
return (createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
12121
|
-
jsx$1(DateInputField, __assign$2({}, field, { onChange: onChangeFormField, onBlur:
|
|
12176
|
+
jsx$1(DateInputField, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField }))));
|
|
12122
12177
|
case "textarea":
|
|
12123
12178
|
return (createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
12124
|
-
jsx$1(TextareaField, __assign$2({}, field, { onChange: onChangeFormField, onBlur:
|
|
12179
|
+
jsx$1(TextareaField, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField }))));
|
|
12125
12180
|
case "radio":
|
|
12126
12181
|
return (createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
12127
|
-
jsx$1(RadioGroup, __assign$2({}, field, { onChange: onChangeFormField, onBlur:
|
|
12182
|
+
jsx$1(RadioGroup, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField }))));
|
|
12128
12183
|
case "number":
|
|
12129
12184
|
return (createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
12130
|
-
jsx$1(NumberField, __assign$2({}, field, { onChange: onChangeFormField, onBlur:
|
|
12185
|
+
jsx$1(NumberField, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField }))));
|
|
12131
12186
|
case "checkbox":
|
|
12132
12187
|
return (createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
12133
|
-
jsx$1(Checkboxes, __assign$2({}, field, { onChange: onChangeFormField, onBlur:
|
|
12188
|
+
jsx$1(Checkboxes, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField }))));
|
|
12134
12189
|
case "select":
|
|
12135
12190
|
return (createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
12136
|
-
jsx$1(SelectField, __assign$2({}, field, { onChange: onChangeFormField, onBlur:
|
|
12191
|
+
jsx$1(SelectField, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField }))));
|
|
12137
12192
|
case "toggle":
|
|
12138
12193
|
return (createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
12139
|
-
jsx$1(ToggleField, __assign$2({}, field, { onChange: onChangeFormField, onBlur:
|
|
12194
|
+
jsx$1(ToggleField, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField }))));
|
|
12140
12195
|
case "range":
|
|
12141
12196
|
return (createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
12142
|
-
jsx$1(RangeField, __assign$2({}, field, { onChange: onChangeFormField, onBlur:
|
|
12197
|
+
jsx$1(RangeField, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField }))));
|
|
12143
12198
|
}
|
|
12144
12199
|
}) }), props.button && (jsx$1(ButtonWrapper, { children: jsx$1(Button, __assign$2({}, props.button, { onClick: onSubmit, type: "button" })) }))] }));
|
|
12145
12200
|
});
|