@valar1/formik-wizard-form - npm Package Compare versions

Comparing version 3.5.0 to 3.6.0

dist/formik-wizard-form.cjs.development.js

@@ -854,8 +854,10 @@ 'use strict';
   var isLastStep = currentStep >= total - 1;
+  var prevStepIndex = Math.max(currentStep + 1, total - 1);
+  var nextStepIndex = Math.min(currentStep + 1, total - 1);
   var goToPrev = React.useCallback(function () {
-    return setCurrentStep(Math.max(0, currentStep - 1));
-  }, [setCurrentStep, currentStep]);
+    return setCurrentStep(prevStepIndex);
+  }, [setCurrentStep, prevStepIndex]);
   var goToNext = React.useCallback(function () {
-    return setCurrentStep(Math.min(currentStep + 1, total - 1));
-  }, [setCurrentStep, currentStep, total]);
+    return setCurrentStep(nextStepIndex);
+  }, [setCurrentStep, nextStepIndex]);
   var goToStep = React.useCallback(function (index) {
@@ -875,7 +877,6 @@ return setCurrentStep(index);
   var beforePrev = stepObj.beforePrev,
-      beforeNext = stepObj.beforeNext,
-      canSkipStep = stepObj.canSkipStep;
+      beforeNext = stepObj.beforeNext;
   var handlePrev = React.useCallback(function (formikBag) {
     return /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
-      var isValid, _yield$canSkipStep, name, index;
+      var isValid, targetStep, _yield$targetStep$can, name, index;
 
@@ -907,38 +908,47 @@ return runtime_1.wrap(function _callee$(_context) {
             case 10:
-              if (!isFunction(canSkipStep)) {
-                _context.next = 24;
+              if (!isValid) {
+                _context.next = 28;
                 break;
               }
 
-              _context.prev = 11;
-              _context.next = 14;
-              return canSkipStep(formikBag.values, formikBag, currentStep);
+              targetStep = steps[prevStepIndex];
 
-            case 14:
-              _yield$canSkipStep = _context.sent;
-              name = _yield$canSkipStep.name;
-              index = _yield$canSkipStep.index;
+              if (!isFunction(targetStep.canShowStep)) {
+                _context.next = 27;
+                break;
+              }
 
+              _context.prev = 13;
+              _context.next = 16;
+              return targetStep.canShowStep(formikBag.values, formikBag, currentStep, 'prev');
+
+            case 16:
+              _yield$targetStep$can = _context.sent;
+              name = _yield$targetStep$can.name;
+              index = _yield$targetStep$can.index;
+
               if (name) {
                 goToStepName(name);
-              }
-
-              if (index) {
+              } else if (index) {
                 goToStep(index);
+              } else {
+                goToPrev();
               }
 
-              _context.next = 24;
+              _context.next = 25;
               break;
 
-            case 21:
-              _context.prev = 21;
-              _context.t1 = _context["catch"](11);
-              isValid = false;
+            case 22:
+              _context.prev = 22;
+              _context.t1 = _context["catch"](13);
+              goToPrev();
 
-            case 24:
-              if (isValid) {
-                goToPrev();
-              }
+            case 25:
+              _context.next = 28;
+              break;
 
-            case 25:
+            case 27:
+              goToPrev();
+
+            case 28:
             case "end":
@@ -948,8 +958,8 @@ return _context.stop();
         }
-      }, _callee, null, [[2, 7], [11, 21]]);
+      }, _callee, null, [[2, 7], [13, 22]]);
     }));
-  }, [goToPrev, currentStep, beforePrev, canSkipStep, goToStepName, goToStep]);
+  }, [goToPrev, currentStep, beforePrev, goToStepName, goToStep, prevStepIndex, steps]);
   var handleNext = React.useCallback(function (formikBag) {
     return /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2() {
-      var isValid, errors, _yield$canSkipStep2, name, index;
+      var isValid, errors, completeTransition, targetStep, _yield$targetStep$can2, name, index;
 
@@ -995,38 +1005,51 @@ return runtime_1.wrap(function _callee2$(_context2) {
             case 16:
-              if (!((validateOnNext && isValid || !validateOnNext) && isFunction(canSkipStep))) {
-                _context2.next = 30;
+              if (!isValid) {
+                _context2.next = 35;
                 break;
               }
 
-              _context2.prev = 17;
-              _context2.next = 20;
-              return canSkipStep(formikBag.values, formikBag, currentStep);
+              completeTransition = function completeTransition() {
+                return isLastStep ? formikBag.submitForm() : goToNext();
+              };
 
-            case 20:
-              _yield$canSkipStep2 = _context2.sent;
-              name = _yield$canSkipStep2.name;
-              index = _yield$canSkipStep2.index;
+              targetStep = steps[nextStepIndex];
 
+              if (!isFunction(targetStep.canShowStep)) {
+                _context2.next = 34;
+                break;
+              }
+
+              _context2.prev = 20;
+              _context2.next = 23;
+              return targetStep.canShowStep(formikBag.values, formikBag, currentStep, 'next');
+
+            case 23:
+              _yield$targetStep$can2 = _context2.sent;
+              name = _yield$targetStep$can2.name;
+              index = _yield$targetStep$can2.index;
+
               if (name) {
                 goToStepName(name);
-              }
-
-              if (index) {
+              } else if (index) {
                 goToStep(index);
+              } else {
+                completeTransition();
               }
 
-              _context2.next = 30;
+              _context2.next = 32;
               break;
 
-            case 27:
-              _context2.prev = 27;
-              _context2.t1 = _context2["catch"](17);
-              isValid = false;
+            case 29:
+              _context2.prev = 29;
+              _context2.t1 = _context2["catch"](20);
+              completeTransition();
 
-            case 30:
-              if (isValid) {
-                isLastStep ? formikBag.submitForm() : goToNext();
-              }
+            case 32:
+              _context2.next = 35;
+              break;
 
-            case 31:
+            case 34:
+              completeTransition();
+
+            case 35:
             case "end":
@@ -1036,5 +1059,5 @@ return _context2.stop();
         }
-      }, _callee2, null, [[7, 13], [17, 27]]);
+      }, _callee2, null, [[7, 13], [20, 29]]);
     }));
-  }, [goToNext, currentStep, beforeNext, isLastStep, validateOnNext, canSkipStep, goToStep, goToStepName]);
+  }, [goToNext, currentStep, beforeNext, isLastStep, validateOnNext, goToStep, goToStepName, nextStepIndex, steps]);
   return {
@@ -1041,0 +1064,0 @@ currentStepIndex: currentStep,

dist/formik-wizard-form.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t,e=require("formik"),r=require("react"),n=(t=r)&&"object"==typeof t&&"default"in t?t.default:t;function o(t,e,r,n,o,i,a){try{var c=t[i](a),u=c.value}catch(t){return void r(t)}c.done?e(u):Promise.resolve(u).then(n,o)}function i(t){return function(){var e=this,r=arguments;return new Promise((function(n,i){var a=t.apply(e,r);function c(t){o(a,n,i,c,u,"next",t)}function u(t){o(a,n,i,c,u,"throw",t)}c(void 0)}))}}function a(){return(a=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(t[n]=r[n])}return t}).apply(this,arguments)}function c(t,e){if(null==t)return{};var r,n,o={},i=Object.keys(t);for(n=0;n<i.length;n++)e.indexOf(r=i[n])>=0||(o[r]=t[r]);return o}var u,s=(function(t){var e=function(t){var e=Object.prototype,r=e.hasOwnProperty,n="function"==typeof Symbol?Symbol:{},o=n.iterator||"@@iterator",i=n.asyncIterator||"@@asyncIterator",a=n.toStringTag||"@@toStringTag";function c(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{c({},"")}catch(t){c=function(t,e,r){return t[e]=r}}function u(t,e,r,n){var o=Object.create((e&&e.prototype instanceof f?e:f).prototype),i=new k(n||[]);return o._invoke=function(t,e,r){var n="suspendedStart";return function(o,i){if("executing"===n)throw new Error("Generator is already running");if("completed"===n){if("throw"===o)throw i;return{value:void 0,done:!0}}for(r.method=o,r.arg=i;;){var a=r.delegate;if(a){var c=b(a,r);if(c){if(c===l)continue;return c}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if("suspendedStart"===n)throw n="completed",r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n="executing";var u=s(t,e,r);if("normal"===u.type){if(n=r.done?"completed":"suspendedYield",u.arg===l)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n="completed",r.method="throw",r.arg=u.arg)}}}(t,r,i),o}function s(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}t.wrap=u;var l={};function f(){}function h(){}function p(){}var v={};c(v,o,(function(){return this}));var d=Object.getPrototypeOf,y=d&&d(d(N([])));y&&y!==e&&r.call(y,o)&&(v=y);var m=p.prototype=f.prototype=Object.create(v);function x(t){["next","throw","return"].forEach((function(e){c(t,e,(function(t){return this._invoke(e,t)}))}))}function g(t,e){var n;this._invoke=function(o,i){function a(){return new e((function(n,a){!function n(o,i,a,c){var u=s(t[o],t,i);if("throw"!==u.type){var l=u.arg,f=l.value;return f&&"object"==typeof f&&r.call(f,"__await")?e.resolve(f.__await).then((function(t){n("next",t,a,c)}),(function(t){n("throw",t,a,c)})):e.resolve(f).then((function(t){l.value=t,a(l)}),(function(t){return n("throw",t,a,c)}))}c(u.arg)}(o,i,n,a)}))}return n=n?n.then(a,a):a()}}function b(t,e){var r=t.iterator[e.method];if(void 0===r){if(e.delegate=null,"throw"===e.method){if(t.iterator.return&&(e.method="return",e.arg=void 0,b(t,e),"throw"===e.method))return l;e.method="throw",e.arg=new TypeError("The iterator does not provide a 'throw' method")}return l}var n=s(r,t.iterator,e.arg);if("throw"===n.type)return e.method="throw",e.arg=n.arg,e.delegate=null,l;var o=n.arg;return o?o.done?(e[t.resultName]=o.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=void 0),e.delegate=null,l):o:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,l)}function w(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function S(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function k(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(w,this),this.reset(!0)}function N(t){if(t){var e=t[o];if(e)return e.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var n=-1,i=function e(){for(;++n<t.length;)if(r.call(t,n))return e.value=t[n],e.done=!1,e;return e.value=void 0,e.done=!0,e};return i.next=i}}return{next:L}}function L(){return{value:void 0,done:!0}}return h.prototype=p,c(m,"constructor",p),c(p,"constructor",h),h.displayName=c(p,a,"GeneratorFunction"),t.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===h||"GeneratorFunction"===(e.displayName||e.name))},t.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,p):(t.__proto__=p,c(t,a,"GeneratorFunction")),t.prototype=Object.create(m),t},t.awrap=function(t){return{__await:t}},x(g.prototype),c(g.prototype,i,(function(){return this})),t.AsyncIterator=g,t.async=function(e,r,n,o,i){void 0===i&&(i=Promise);var a=new g(u(e,r,n,o),i);return t.isGeneratorFunction(r)?a:a.next().then((function(t){return t.done?t.value:a.next()}))},x(m),c(m,a,"Generator"),c(m,o,(function(){return this})),c(m,"toString",(function(){return"[object Generator]"})),t.keys=function(t){var e=[];for(var r in t)e.push(r);return e.reverse(),function r(){for(;e.length;){var n=e.pop();if(n in t)return r.value=n,r.done=!1,r}return r.done=!0,r}},t.values=N,k.prototype={constructor:k,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(S),!t)for(var e in this)"t"===e.charAt(0)&&r.call(this,e)&&!isNaN(+e.slice(1))&&(this[e]=void 0)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var e=this;function n(r,n){return a.type="throw",a.arg=t,e.next=r,n&&(e.method="next",e.arg=void 0),!!n}for(var o=this.tryEntries.length-1;o>=0;--o){var i=this.tryEntries[o],a=i.completion;if("root"===i.tryLoc)return n("end");if(i.tryLoc<=this.prev){var c=r.call(i,"catchLoc"),u=r.call(i,"finallyLoc");if(c&&u){if(this.prev<i.catchLoc)return n(i.catchLoc,!0);if(this.prev<i.finallyLoc)return n(i.finallyLoc)}else if(c){if(this.prev<i.catchLoc)return n(i.catchLoc,!0)}else{if(!u)throw new Error("try statement without catch or finally");if(this.prev<i.finallyLoc)return n(i.finallyLoc)}}}},abrupt:function(t,e){for(var n=this.tryEntries.length-1;n>=0;--n){var o=this.tryEntries[n];if(o.tryLoc<=this.prev&&r.call(o,"finallyLoc")&&this.prev<o.finallyLoc){var i=o;break}}i&&("break"===t||"continue"===t)&&i.tryLoc<=e&&e<=i.finallyLoc&&(i=null);var a=i?i.completion:{};return a.type=t,a.arg=e,i?(this.method="next",this.next=i.finallyLoc,l):this.complete(a)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),l},finish:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),S(r),l}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;S(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:N(t),resultName:e,nextLoc:r},"next"===this.method&&(this.arg=void 0),l}},t}(t.exports);try{regeneratorRuntime=e}catch(t){"object"==typeof globalThis?globalThis.regeneratorRuntime=e:Function("r","regeneratorRuntime = r")(e)}}(u={exports:{}}),u.exports),l=function(t){return"function"==typeof t},f=function(t,e,n){var o=e.length,a=r.useState(t),c=a[0],u=a[1],f=0===c,h=0===c,p=c>=o-1,v=r.useCallback((function(){return u(Math.max(0,c-1))}),[u,c]),d=r.useCallback((function(){return u(Math.min(c+1,o-1))}),[u,c,o]),y=r.useCallback((function(t){return u(t)}),[u]),m=r.useCallback((function(t){var r=e.findIndex((function(e){return e.name===t}));-1!==r&&u(r)}),[u,e]),x=e[c],g=x.beforePrev,b=x.beforeNext,w=x.canSkipStep,S=r.useCallback((function(t){return i(s.mark((function e(){var r,n,o,i;return s.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(r=!0,!l(g)){e.next=10;break}return e.prev=2,e.next=5,g(t.values,t,c);case 5:e.next=10;break;case 7:e.prev=7,e.t0=e.catch(2),r=!1;case 10:if(!l(w)){e.next=24;break}return e.prev=11,e.next=14,w(t.values,t,c);case 14:i=(n=e.sent).index,(o=n.name)&&m(o),i&&y(i),e.next=24;break;case 21:e.prev=21,e.t1=e.catch(11),r=!1;case 24:r&&v();case 25:case"end":return e.stop()}}),e,null,[[2,7],[11,21]])})))}),[v,c,g,w,m,y]),k=r.useCallback((function(t){return i(s.mark((function e(){var r,o,i,a;return s.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(r=!1,!n){e.next=6;break}return e.next=4,t.validateForm();case 4:r=0===Object.keys(e.sent).length;case 6:if(!(n&&r||!n)||!l(b)){e.next=16;break}return e.prev=7,e.next=10,b(t.values,t,c);case 10:r=!0,e.next=16;break;case 13:e.prev=13,e.t0=e.catch(7),r=!1;case 16:if(!(n&&r||!n)||!l(w)){e.next=30;break}return e.prev=17,e.next=20,w(t.values,t,c);case 20:a=(o=e.sent).index,(i=o.name)&&m(i),a&&y(a),e.next=30;break;case 27:e.prev=27,e.t1=e.catch(17),r=!1;case 30:r&&(p?t.submitForm():d());case 31:case"end":return e.stop()}}),e,null,[[7,13],[17,27]])})))}),[d,c,b,p,n,w,y,m]);return{currentStepIndex:c,isPrevDisabled:f,isFirstStep:h,isLastStep:p,goToPrev:v,goToNext:d,handlePrev:S,handleNext:k,goToStep:y,goToStepName:m}},h=["activeStepIndex","validateOnNext","steps","children"],p=["activeStepIndex","validateOnNext","steps","children"];exports.FormikWizard=function(t){var r=t.activeStepIndex,o=void 0===r?0:r,u=t.validateOnNext,l=void 0===u||u,p=t.steps,v=t.children,d=c(t,h),y=f(o,p,l),m=y.currentStepIndex,x=y.isPrevDisabled,g=y.isFirstStep,b=y.isLastStep,w=y.handlePrev,S=y.handleNext,k=y.goToStep,N=y.goToStepName,L=y.goToNext,T=p[m],O=T.component;return n.createElement(e.Formik,Object.assign({},d,{validationSchema:T.validationSchema}),"function"==typeof v?function(t){var e,r={handlePrev:(e=i(s.mark((function e(){return s.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,w(t)();case 2:return e.next=4,t.validateForm();case 4:case"end":return e.stop()}}),e)}))),function(){return e.apply(this,arguments)}),handleNext:S(t),isFirstStep:g,isLastStep:b,currentStepIndex:m,goToStepName:N,goToStep:k,isPrevDisabled:x,isNextDisabled:l&&!t.isValid||!1,renderComponent:function(){return n.createElement(O,Object.assign({},t,{currentStepIndex:m,goToNext:L,handleNext:S(t),goToStep:k,goToStepName:N}))}};return v(a({},t,r,{goToStep:k,goToStepName:N}))}:v)},exports.useFormikWizard=function(t){var r,o=t.activeStepIndex,u=void 0===o?0:o,l=t.validateOnNext,h=void 0===l||l,v=t.steps,d=c(t,p),y=f(u,v,h),m=y.currentStepIndex,x=y.isPrevDisabled,g=y.isFirstStep,b=y.isLastStep,w=y.handlePrev,S=y.handleNext,k=y.goToNext,N=y.goToStep,L=y.goToStepName,T=v[m],O=T.component,E=e.useFormik(a({},d,{validationSchema:T.validationSchema}));return a({},E,{handlePrev:(r=i(s.mark((function t(){return s.wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return t.next=2,w(E)();case 2:return t.next=4,E.validateForm();case 4:case"end":return t.stop()}}),t)}))),function(){return r.apply(this,arguments)}),handleNext:S(E),isFirstStep:g,isLastStep:b,currentStepIndex:m,isPrevDisabled:x,isNextDisabled:h&&!E.isValid||!1,renderComponent:function(){return n.createElement(O,Object.assign({},E,{goToNext:k,currentStepIndex:m,handleNext:(t=i(s.mark((function t(){return s.wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return t.next=2,S(E)();case 2:return t.next=4,E.validateForm();case 4:case"end":return t.stop()}}),t)}))),function(){return t.apply(this,arguments)}),goToStep:N,goToStepName:L}));var t}})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t,e=require("formik"),r=require("react"),n=(t=r)&&"object"==typeof t&&"default"in t?t.default:t;function o(t,e,r,n,o,a,i){try{var c=t[a](i),u=c.value}catch(t){return void r(t)}c.done?e(u):Promise.resolve(u).then(n,o)}function a(t){return function(){var e=this,r=arguments;return new Promise((function(n,a){var i=t.apply(e,r);function c(t){o(i,n,a,c,u,"next",t)}function u(t){o(i,n,a,c,u,"throw",t)}c(void 0)}))}}function i(){return(i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(t[n]=r[n])}return t}).apply(this,arguments)}function c(t,e){if(null==t)return{};var r,n,o={},a=Object.keys(t);for(n=0;n<a.length;n++)e.indexOf(r=a[n])>=0||(o[r]=t[r]);return o}var u,s=(function(t){var e=function(t){var e=Object.prototype,r=e.hasOwnProperty,n="function"==typeof Symbol?Symbol:{},o=n.iterator||"@@iterator",a=n.asyncIterator||"@@asyncIterator",i=n.toStringTag||"@@toStringTag";function c(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{c({},"")}catch(t){c=function(t,e,r){return t[e]=r}}function u(t,e,r,n){var o=Object.create((e&&e.prototype instanceof f?e:f).prototype),a=new k(n||[]);return o._invoke=function(t,e,r){var n="suspendedStart";return function(o,a){if("executing"===n)throw new Error("Generator is already running");if("completed"===n){if("throw"===o)throw a;return{value:void 0,done:!0}}for(r.method=o,r.arg=a;;){var i=r.delegate;if(i){var c=b(i,r);if(c){if(c===l)continue;return c}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if("suspendedStart"===n)throw n="completed",r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n="executing";var u=s(t,e,r);if("normal"===u.type){if(n=r.done?"completed":"suspendedYield",u.arg===l)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n="completed",r.method="throw",r.arg=u.arg)}}}(t,r,a),o}function s(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}t.wrap=u;var l={};function f(){}function h(){}function p(){}var v={};c(v,o,(function(){return this}));var d=Object.getPrototypeOf,x=d&&d(d(N([])));x&&x!==e&&r.call(x,o)&&(v=x);var y=p.prototype=f.prototype=Object.create(v);function m(t){["next","throw","return"].forEach((function(e){c(t,e,(function(t){return this._invoke(e,t)}))}))}function g(t,e){var n;this._invoke=function(o,a){function i(){return new e((function(n,i){!function n(o,a,i,c){var u=s(t[o],t,a);if("throw"!==u.type){var l=u.arg,f=l.value;return f&&"object"==typeof f&&r.call(f,"__await")?e.resolve(f.__await).then((function(t){n("next",t,i,c)}),(function(t){n("throw",t,i,c)})):e.resolve(f).then((function(t){l.value=t,i(l)}),(function(t){return n("throw",t,i,c)}))}c(u.arg)}(o,a,n,i)}))}return n=n?n.then(i,i):i()}}function b(t,e){var r=t.iterator[e.method];if(void 0===r){if(e.delegate=null,"throw"===e.method){if(t.iterator.return&&(e.method="return",e.arg=void 0,b(t,e),"throw"===e.method))return l;e.method="throw",e.arg=new TypeError("The iterator does not provide a 'throw' method")}return l}var n=s(r,t.iterator,e.arg);if("throw"===n.type)return e.method="throw",e.arg=n.arg,e.delegate=null,l;var o=n.arg;return o?o.done?(e[t.resultName]=o.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=void 0),e.delegate=null,l):o:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,l)}function w(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function S(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function k(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(w,this),this.reset(!0)}function N(t){if(t){var e=t[o];if(e)return e.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var n=-1,a=function e(){for(;++n<t.length;)if(r.call(t,n))return e.value=t[n],e.done=!1,e;return e.value=void 0,e.done=!0,e};return a.next=a}}return{next:L}}function L(){return{value:void 0,done:!0}}return h.prototype=p,c(y,"constructor",p),c(p,"constructor",h),h.displayName=c(p,i,"GeneratorFunction"),t.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===h||"GeneratorFunction"===(e.displayName||e.name))},t.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,p):(t.__proto__=p,c(t,i,"GeneratorFunction")),t.prototype=Object.create(y),t},t.awrap=function(t){return{__await:t}},m(g.prototype),c(g.prototype,a,(function(){return this})),t.AsyncIterator=g,t.async=function(e,r,n,o,a){void 0===a&&(a=Promise);var i=new g(u(e,r,n,o),a);return t.isGeneratorFunction(r)?i:i.next().then((function(t){return t.done?t.value:i.next()}))},m(y),c(y,i,"Generator"),c(y,o,(function(){return this})),c(y,"toString",(function(){return"[object Generator]"})),t.keys=function(t){var e=[];for(var r in t)e.push(r);return e.reverse(),function r(){for(;e.length;){var n=e.pop();if(n in t)return r.value=n,r.done=!1,r}return r.done=!0,r}},t.values=N,k.prototype={constructor:k,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(S),!t)for(var e in this)"t"===e.charAt(0)&&r.call(this,e)&&!isNaN(+e.slice(1))&&(this[e]=void 0)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var e=this;function n(r,n){return i.type="throw",i.arg=t,e.next=r,n&&(e.method="next",e.arg=void 0),!!n}for(var o=this.tryEntries.length-1;o>=0;--o){var a=this.tryEntries[o],i=a.completion;if("root"===a.tryLoc)return n("end");if(a.tryLoc<=this.prev){var c=r.call(a,"catchLoc"),u=r.call(a,"finallyLoc");if(c&&u){if(this.prev<a.catchLoc)return n(a.catchLoc,!0);if(this.prev<a.finallyLoc)return n(a.finallyLoc)}else if(c){if(this.prev<a.catchLoc)return n(a.catchLoc,!0)}else{if(!u)throw new Error("try statement without catch or finally");if(this.prev<a.finallyLoc)return n(a.finallyLoc)}}}},abrupt:function(t,e){for(var n=this.tryEntries.length-1;n>=0;--n){var o=this.tryEntries[n];if(o.tryLoc<=this.prev&&r.call(o,"finallyLoc")&&this.prev<o.finallyLoc){var a=o;break}}a&&("break"===t||"continue"===t)&&a.tryLoc<=e&&e<=a.finallyLoc&&(a=null);var i=a?a.completion:{};return i.type=t,i.arg=e,a?(this.method="next",this.next=a.finallyLoc,l):this.complete(i)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),l},finish:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),S(r),l}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;S(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:N(t),resultName:e,nextLoc:r},"next"===this.method&&(this.arg=void 0),l}},t}(t.exports);try{regeneratorRuntime=e}catch(t){"object"==typeof globalThis?globalThis.regeneratorRuntime=e:Function("r","regeneratorRuntime = r")(e)}}(u={exports:{}}),u.exports),l=function(t){return"function"==typeof t},f=function(t,e,n){var o=e.length,i=r.useState(t),c=i[0],u=i[1],f=0===c,h=0===c,p=c>=o-1,v=Math.max(c+1,o-1),d=Math.min(c+1,o-1),x=r.useCallback((function(){return u(v)}),[u,v]),y=r.useCallback((function(){return u(d)}),[u,d]),m=r.useCallback((function(t){return u(t)}),[u]),g=r.useCallback((function(t){var r=e.findIndex((function(e){return e.name===t}));-1!==r&&u(r)}),[u,e]),b=e[c],w=b.beforePrev,S=b.beforeNext,k=r.useCallback((function(t){return a(s.mark((function r(){var n,o,a,i,u;return s.wrap((function(r){for(;;)switch(r.prev=r.next){case 0:if(n=!0,!l(w)){r.next=10;break}return r.prev=2,r.next=5,w(t.values,t,c);case 5:r.next=10;break;case 7:r.prev=7,r.t0=r.catch(2),n=!1;case 10:if(!n){r.next=28;break}if(!l((o=e[v]).canShowStep)){r.next=27;break}return r.prev=13,r.next=16,o.canShowStep(t.values,t,c,"prev");case 16:u=(a=r.sent).index,(i=a.name)?g(i):u?m(u):x(),r.next=25;break;case 22:r.prev=22,r.t1=r.catch(13),x();case 25:r.next=28;break;case 27:x();case 28:case"end":return r.stop()}}),r,null,[[2,7],[13,22]])})))}),[x,c,w,g,m,v,e]),N=r.useCallback((function(t){return a(s.mark((function r(){var o,a,i,u,f,h;return s.wrap((function(r){for(;;)switch(r.prev=r.next){case 0:if(o=!1,!n){r.next=6;break}return r.next=4,t.validateForm();case 4:o=0===Object.keys(r.sent).length;case 6:if(!(n&&o||!n)||!l(S)){r.next=16;break}return r.prev=7,r.next=10,S(t.values,t,c);case 10:o=!0,r.next=16;break;case 13:r.prev=13,r.t0=r.catch(7),o=!1;case 16:if(!o){r.next=35;break}if(a=function(){return p?t.submitForm():y()},!l((i=e[d]).canShowStep)){r.next=34;break}return r.prev=20,r.next=23,i.canShowStep(t.values,t,c,"next");case 23:h=(u=r.sent).index,(f=u.name)?g(f):h?m(h):a(),r.next=32;break;case 29:r.prev=29,r.t1=r.catch(20),a();case 32:r.next=35;break;case 34:a();case 35:case"end":return r.stop()}}),r,null,[[7,13],[20,29]])})))}),[y,c,S,p,n,m,g,d,e]);return{currentStepIndex:c,isPrevDisabled:f,isFirstStep:h,isLastStep:p,goToPrev:x,goToNext:y,handlePrev:k,handleNext:N,goToStep:m,goToStepName:g}},h=["activeStepIndex","validateOnNext","steps","children"],p=["activeStepIndex","validateOnNext","steps","children"];exports.FormikWizard=function(t){var r=t.activeStepIndex,o=void 0===r?0:r,u=t.validateOnNext,l=void 0===u||u,p=t.steps,v=t.children,d=c(t,h),x=f(o,p,l),y=x.currentStepIndex,m=x.isPrevDisabled,g=x.isFirstStep,b=x.isLastStep,w=x.handlePrev,S=x.handleNext,k=x.goToStep,N=x.goToStepName,L=x.goToNext,T=p[y],O=T.component;return n.createElement(e.Formik,Object.assign({},d,{validationSchema:T.validationSchema}),"function"==typeof v?function(t){var e,r={handlePrev:(e=a(s.mark((function e(){return s.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,w(t)();case 2:return e.next=4,t.validateForm();case 4:case"end":return e.stop()}}),e)}))),function(){return e.apply(this,arguments)}),handleNext:S(t),isFirstStep:g,isLastStep:b,currentStepIndex:y,goToStepName:N,goToStep:k,isPrevDisabled:m,isNextDisabled:l&&!t.isValid||!1,renderComponent:function(){return n.createElement(O,Object.assign({},t,{currentStepIndex:y,goToNext:L,handleNext:S(t),goToStep:k,goToStepName:N}))}};return v(i({},t,r,{goToStep:k,goToStepName:N}))}:v)},exports.useFormikWizard=function(t){var r,o=t.activeStepIndex,u=void 0===o?0:o,l=t.validateOnNext,h=void 0===l||l,v=t.steps,d=c(t,p),x=f(u,v,h),y=x.currentStepIndex,m=x.isPrevDisabled,g=x.isFirstStep,b=x.isLastStep,w=x.handlePrev,S=x.handleNext,k=x.goToNext,N=x.goToStep,L=x.goToStepName,T=v[y],O=T.component,E=e.useFormik(i({},d,{validationSchema:T.validationSchema}));return i({},E,{handlePrev:(r=a(s.mark((function t(){return s.wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return t.next=2,w(E)();case 2:return t.next=4,E.validateForm();case 4:case"end":return t.stop()}}),t)}))),function(){return r.apply(this,arguments)}),handleNext:S(E),isFirstStep:g,isLastStep:b,currentStepIndex:y,isPrevDisabled:m,isNextDisabled:h&&!E.isValid||!1,renderComponent:function(){return n.createElement(O,Object.assign({},E,{goToNext:k,currentStepIndex:y,handleNext:(t=a(s.mark((function t(){return s.wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return t.next=2,S(E)();case 2:return t.next=4,E.validateForm();case 4:case"end":return t.stop()}}),t)}))),function(){return t.apply(this,arguments)}),goToStep:N,goToStepName:L}));var t}})};
 //# sourceMappingURL=formik-wizard-form.cjs.production.min.js.map

dist/formik-wizard-form.esm.js

@@ -847,8 +847,10 @@ import { Formik, useFormik } from 'formik';
   var isLastStep = currentStep >= total - 1;
+  var prevStepIndex = Math.max(currentStep + 1, total - 1);
+  var nextStepIndex = Math.min(currentStep + 1, total - 1);
   var goToPrev = useCallback(function () {
-    return setCurrentStep(Math.max(0, currentStep - 1));
-  }, [setCurrentStep, currentStep]);
+    return setCurrentStep(prevStepIndex);
+  }, [setCurrentStep, prevStepIndex]);
   var goToNext = useCallback(function () {
-    return setCurrentStep(Math.min(currentStep + 1, total - 1));
-  }, [setCurrentStep, currentStep, total]);
+    return setCurrentStep(nextStepIndex);
+  }, [setCurrentStep, nextStepIndex]);
   var goToStep = useCallback(function (index) {
@@ -868,7 +870,6 @@ return setCurrentStep(index);
   var beforePrev = stepObj.beforePrev,
-      beforeNext = stepObj.beforeNext,
-      canSkipStep = stepObj.canSkipStep;
+      beforeNext = stepObj.beforeNext;
   var handlePrev = useCallback(function (formikBag) {
     return /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
-      var isValid, _yield$canSkipStep, name, index;
+      var isValid, targetStep, _yield$targetStep$can, name, index;
 
@@ -900,38 +901,47 @@ return runtime_1.wrap(function _callee$(_context) {
             case 10:
-              if (!isFunction(canSkipStep)) {
-                _context.next = 24;
+              if (!isValid) {
+                _context.next = 28;
                 break;
               }
 
-              _context.prev = 11;
-              _context.next = 14;
-              return canSkipStep(formikBag.values, formikBag, currentStep);
+              targetStep = steps[prevStepIndex];
 
-            case 14:
-              _yield$canSkipStep = _context.sent;
-              name = _yield$canSkipStep.name;
-              index = _yield$canSkipStep.index;
+              if (!isFunction(targetStep.canShowStep)) {
+                _context.next = 27;
+                break;
+              }
 
+              _context.prev = 13;
+              _context.next = 16;
+              return targetStep.canShowStep(formikBag.values, formikBag, currentStep, 'prev');
+
+            case 16:
+              _yield$targetStep$can = _context.sent;
+              name = _yield$targetStep$can.name;
+              index = _yield$targetStep$can.index;
+
               if (name) {
                 goToStepName(name);
-              }
-
-              if (index) {
+              } else if (index) {
                 goToStep(index);
+              } else {
+                goToPrev();
               }
 
-              _context.next = 24;
+              _context.next = 25;
               break;
 
-            case 21:
-              _context.prev = 21;
-              _context.t1 = _context["catch"](11);
-              isValid = false;
+            case 22:
+              _context.prev = 22;
+              _context.t1 = _context["catch"](13);
+              goToPrev();
 
-            case 24:
-              if (isValid) {
-                goToPrev();
-              }
+            case 25:
+              _context.next = 28;
+              break;
 
-            case 25:
+            case 27:
+              goToPrev();
+
+            case 28:
             case "end":
@@ -941,8 +951,8 @@ return _context.stop();
         }
-      }, _callee, null, [[2, 7], [11, 21]]);
+      }, _callee, null, [[2, 7], [13, 22]]);
     }));
-  }, [goToPrev, currentStep, beforePrev, canSkipStep, goToStepName, goToStep]);
+  }, [goToPrev, currentStep, beforePrev, goToStepName, goToStep, prevStepIndex, steps]);
   var handleNext = useCallback(function (formikBag) {
     return /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2() {
-      var isValid, errors, _yield$canSkipStep2, name, index;
+      var isValid, errors, completeTransition, targetStep, _yield$targetStep$can2, name, index;
 
@@ -988,38 +998,51 @@ return runtime_1.wrap(function _callee2$(_context2) {
             case 16:
-              if (!((validateOnNext && isValid || !validateOnNext) && isFunction(canSkipStep))) {
-                _context2.next = 30;
+              if (!isValid) {
+                _context2.next = 35;
                 break;
               }
 
-              _context2.prev = 17;
-              _context2.next = 20;
-              return canSkipStep(formikBag.values, formikBag, currentStep);
+              completeTransition = function completeTransition() {
+                return isLastStep ? formikBag.submitForm() : goToNext();
+              };
 
-            case 20:
-              _yield$canSkipStep2 = _context2.sent;
-              name = _yield$canSkipStep2.name;
-              index = _yield$canSkipStep2.index;
+              targetStep = steps[nextStepIndex];
 
+              if (!isFunction(targetStep.canShowStep)) {
+                _context2.next = 34;
+                break;
+              }
+
+              _context2.prev = 20;
+              _context2.next = 23;
+              return targetStep.canShowStep(formikBag.values, formikBag, currentStep, 'next');
+
+            case 23:
+              _yield$targetStep$can2 = _context2.sent;
+              name = _yield$targetStep$can2.name;
+              index = _yield$targetStep$can2.index;
+
               if (name) {
                 goToStepName(name);
-              }
-
-              if (index) {
+              } else if (index) {
                 goToStep(index);
+              } else {
+                completeTransition();
               }
 
-              _context2.next = 30;
+              _context2.next = 32;
               break;
 
-            case 27:
-              _context2.prev = 27;
-              _context2.t1 = _context2["catch"](17);
-              isValid = false;
+            case 29:
+              _context2.prev = 29;
+              _context2.t1 = _context2["catch"](20);
+              completeTransition();
 
-            case 30:
-              if (isValid) {
-                isLastStep ? formikBag.submitForm() : goToNext();
-              }
+            case 32:
+              _context2.next = 35;
+              break;
 
-            case 31:
+            case 34:
+              completeTransition();
+
+            case 35:
             case "end":
@@ -1029,5 +1052,5 @@ return _context2.stop();
         }
-      }, _callee2, null, [[7, 13], [17, 27]]);
+      }, _callee2, null, [[7, 13], [20, 29]]);
     }));
-  }, [goToNext, currentStep, beforeNext, isLastStep, validateOnNext, canSkipStep, goToStep, goToStepName]);
+  }, [goToNext, currentStep, beforeNext, isLastStep, validateOnNext, goToStep, goToStepName, nextStepIndex, steps]);
   return {
@@ -1034,0 +1057,0 @@ currentStepIndex: currentStep,

dist/types.d.ts

@@ -9,3 +9,3 @@ /// <reference types="react" />
     /** Handler to be called before loading the step, the form will jump to either name or index step */
-    canSkipStep?: (values: FormikValues, formikBag: FormikProps<FormikValues>, currentStepIndex: number) => Promise<{
+    canShowStep?: (values: FormikValues, formikBag: FormikProps<FormikValues>, currentStepIndex: number, action: 'next' | 'prev') => Promise<{
         name?: string;
@@ -12,0 +12,0 @@ index?: number;

package.json

 {
   "name": "@valar1/formik-wizard-form",
-  "version": "3.5.0",
-  "description": "Valari Fork - Create stepper forms over formik with ease",
+  "version": "3.6.0",
+  "description": "Create wizard stepper forms",
   "main": "dist/index.js",
@@ -6,0 +6,0 @@ "module": "dist/formik-wizard-form.esm.js",

No alert changes

Improved metrics

Total package byte prevSize

275387

increased by1.54%

Lines of code

2302

increased by1.59%

No dependency changes