aport-tools 4.4.4 → 4.4.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/dist/forms/FormContext.d.ts +1 -0
- package/dist/index.esm.js +46 -5
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +46 -5
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
@@ -42,6 +42,7 @@ interface FormContextProps {
|
|
42
42
|
* Typically, this function would call `onSubmit` and handle errors by updating the `errors` state.
|
43
43
|
*/
|
44
44
|
handleSubmit: () => void;
|
45
|
+
handleFormSubmit: (formValues: Record<string, any>) => Promise<Record<string, string[]>>;
|
45
46
|
}
|
46
47
|
export declare const useFormContext: () => FormContextProps;
|
47
48
|
interface StepperProps {
|
package/dist/index.esm.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
/*! aport-tools v4.4.
|
1
|
+
/*! aport-tools v4.4.5 | ISC */
|
2
2
|
import React, { useContext, useState, createContext, useCallback, useMemo } from 'react';
|
3
3
|
import { StyleSheet, Text as Text$1, Animated, View, TouchableOpacity, Image, TextInput, Modal, Pressable, FlatList, Keyboard, Platform, Alert, ActivityIndicator } from 'react-native';
|
4
4
|
import { ThemeContext } from 'aport-themes';
|
@@ -175,7 +175,7 @@ var Stepper = function Stepper(_a) {
|
|
175
175
|
currentStep = _a.currentStep,
|
176
176
|
_b = _a.presseable,
|
177
177
|
presseable = _b === void 0 ? false : _b,
|
178
|
-
|
178
|
+
onPress = _a.onPress,
|
179
179
|
_c = _a.stepStyle,
|
180
180
|
stepStyle = _c === void 0 ? "circular" : _c,
|
181
181
|
totalSteps = _a.totalSteps,
|
@@ -185,6 +185,30 @@ var Stepper = function Stepper(_a) {
|
|
185
185
|
var progressAnim = React.useRef(new Animated.Value(0)).current;
|
186
186
|
var theme = useContext(ThemeContext).theme;
|
187
187
|
var colors = theme.colors;
|
188
|
+
var _e = useFormContext(),
|
189
|
+
formValues = _e.formValues,
|
190
|
+
handleFormSubmit = _e.handleFormSubmit;
|
191
|
+
var handleStepPress = function handleStepPress(stepIndex) {
|
192
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
193
|
+
var errors;
|
194
|
+
return __generator(this, function (_a) {
|
195
|
+
switch (_a.label) {
|
196
|
+
case 0:
|
197
|
+
if (!presseable || stepIndex === currentStep) return [2 /*return*/];
|
198
|
+
return [4 /*yield*/, handleFormSubmit(formValues)];
|
199
|
+
case 1:
|
200
|
+
errors = _a.sent();
|
201
|
+
if (Object.keys(errors).length > 0) {
|
202
|
+
console.log("Validation failed. Cannot proceed to step", stepIndex);
|
203
|
+
return [2 /*return*/]; // Prevent step change
|
204
|
+
}
|
205
|
+
// Proceed to change step
|
206
|
+
onPress === null || onPress === void 0 ? void 0 : onPress(stepIndex);
|
207
|
+
return [2 /*return*/];
|
208
|
+
}
|
209
|
+
});
|
210
|
+
});
|
211
|
+
};
|
188
212
|
React.useEffect(function () {
|
189
213
|
Animated.timing(progressAnim, {
|
190
214
|
toValue: currentStep,
|
@@ -271,7 +295,7 @@ var Stepper = function Stepper(_a) {
|
|
271
295
|
}],
|
272
296
|
disabled: !presseable,
|
273
297
|
onPress: function onPress() {
|
274
|
-
return
|
298
|
+
return handleStepPress(index);
|
275
299
|
}
|
276
300
|
}, /*#__PURE__*/React.createElement(View, {
|
277
301
|
style: [styles$9.step, stepStyle === "square" && styles$9.squareStep, {
|
@@ -388,13 +412,29 @@ var Form = function Form(_a) {
|
|
388
412
|
});
|
389
413
|
});
|
390
414
|
};
|
415
|
+
var handleFormSubmit = function handleFormSubmit(formValues) {
|
416
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
417
|
+
var validationErrors;
|
418
|
+
return __generator(this, function (_a) {
|
419
|
+
switch (_a.label) {
|
420
|
+
case 0:
|
421
|
+
return [4 /*yield*/, onSubmit(formValues)];
|
422
|
+
case 1:
|
423
|
+
validationErrors = _a.sent();
|
424
|
+
setErrors(validationErrors);
|
425
|
+
return [2 /*return*/, validationErrors];
|
426
|
+
}
|
427
|
+
});
|
428
|
+
});
|
429
|
+
};
|
391
430
|
return /*#__PURE__*/React.createElement(FormContext.Provider, {
|
392
431
|
value: {
|
393
432
|
formValues: formValues,
|
394
433
|
setFormValue: setFormValue,
|
395
434
|
errors: errors,
|
396
435
|
setErrors: setErrors,
|
397
|
-
handleSubmit: handleSubmit
|
436
|
+
handleSubmit: handleSubmit,
|
437
|
+
handleFormSubmit: handleFormSubmit
|
398
438
|
}
|
399
439
|
}, stepper && (/*#__PURE__*/React.createElement(Stepper, {
|
400
440
|
steps: stepper.steps,
|
@@ -403,7 +443,8 @@ var Form = function Form(_a) {
|
|
403
443
|
onPress: stepper.onPress,
|
404
444
|
totalSteps: stepper.totalSteps,
|
405
445
|
stepType: stepper.stepType,
|
406
|
-
icon: stepper.icon
|
446
|
+
icon: stepper.icon,
|
447
|
+
stepStyle: stepper.stepStyle
|
407
448
|
})), children);
|
408
449
|
};
|
409
450
|
|