Skip to content

Commit 68cf435

Browse files
author
Claudio Savino
committed
1 parent 862e74b commit 68cf435

6 files changed

Lines changed: 64 additions & 26 deletions

File tree

‎CHANGELOG.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@
1313
* Introduced `onDrop` Field Event Handler.
1414
* Introduced `onDrop` Field Hook.
1515
* Introduced `files` Field prop.
16+
* Introduced `resetting` && `clearing` computed.
1617
* Dropzone support.
1718

1819
# 1.30

‎src/Field.js‎

Lines changed: 41 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,8 @@ export default class Field extends Base {
5959

6060
@observable $submitting = false;
6161
@observable $validating = false;
62+
@observable $clearing = false;
63+
@observable $resetting = false;
6264

6365
@observable autoFocus = false;
6466
@observable showError = false;
@@ -145,6 +147,10 @@ export default class Field extends Base {
145147
this.$default = parseFieldValue(this.$parser, { separated: val });
146148
}
147149

150+
@computed get actionRunning() {
151+
return (this.submitting || this.clearing || this.resetting);
152+
}
153+
148154
@computed get submitting() {
149155
return toJS(this.$submitting);
150156
}
@@ -222,6 +228,18 @@ export default class Field extends Base {
222228
: _.isEqual(this.$default, this.value);
223229
}
224230

231+
@computed get resetting() {
232+
return this.hasNestedFields
233+
? this.check('resetting', true)
234+
: this.$resetting;
235+
}
236+
237+
@computed get clearing() {
238+
return this.hasNestedFields
239+
? this.check('clearing', true)
240+
: this.$clearing;
241+
}
242+
225243
@computed get isEmpty() {
226244
if (this.hasNestedFields) return this.check('isEmpty', true);
227245
if (_.isBoolean(this.value)) return !!this.$value;
@@ -519,15 +537,19 @@ export const prototypes = {
519537

520538
@action
521539
clear(deep = true, call = true) {
540+
this.$clearing = true;
522541
this.$touched = false;
523542
this.$changed = false;
524543

525544
this.$value = defaultClearValue({ value: this.$value });
526545
this.files = undefined;
527546

528-
this.showErrors(this.state.options.get('showErrorsOnClear', this));
529547
if (deep) this.each(field => field.clear(true, false));
530548

549+
this.validate({
550+
showErrors: this.state.options.get('showErrorsOnClear', this),
551+
});
552+
531553
if (call) {
532554
this.$onClear.apply(this, [{
533555
form: this.state.form,
@@ -538,6 +560,7 @@ export const prototypes = {
538560

539561
@action
540562
reset(deep = true, call = true) {
563+
this.$resetting = true;
541564
this.$touched = false;
542565
this.$changed = false;
543566

@@ -546,9 +569,12 @@ export const prototypes = {
546569
if (!useDefaultValue) this.value = this.$initial;
547570
this.files = undefined;
548571

549-
this.showErrors(this.state.options.get('showErrorsOnReset', this));
550572
if (deep) this.each(field => field.reset(true, false));
551573

574+
this.validate({
575+
showErrors: this.state.options.get('showErrorsOnReset', this),
576+
});
577+
552578
if (call) {
553579
this.$onReset.apply(this, [{
554580
form: this.state.form,
@@ -581,19 +607,22 @@ export const prototypes = {
581607
},
582608

583609
observeValidation(type) {
584-
const validateOnChange = this.state.options.get('validateOnChange', this);
585-
const showErrorsOnChange = this.state.options.get('showErrorsOnChange', this);
586-
const validateOnBlur = this.state.options.get('validateOnBlur', this);
587-
const showErrorsOnBlur = this.state.options.get('showErrorsOnBlur', this);
588-
589-
if (type === 'onBlur' || (validateOnBlur)) {
590-
this.disposeValidationOnBlur = observe(this, '$focused', ({ newValue }) =>
591-
(newValue === false) && this.debouncedValidation({ showErrors: showErrorsOnBlur }));
610+
const opt = this.state.options;
611+
612+
if (type === 'onBlur' || opt.get('validateOnBlur', this)) {
613+
observe(this, '$focused', ({ newValue }) =>
614+
(newValue === false) &&
615+
this.debouncedValidation({
616+
showErrors: opt.get('showErrorsOnBlur', this),
617+
}));
592618
}
593619

594-
if (type === 'onChange' || validateOnChange) {
620+
if (type === 'onChange' || opt.get('validateOnChange', this)) {
595621
this.disposeValidationOnChange = observe(this, '$value', () =>
596-
this.debouncedValidation({ showErrors: showErrorsOnChange }));
622+
!this.actionRunning &&
623+
this.debouncedValidation({
624+
showErrors: opt.get('showErrorsOnChange', this),
625+
}));
597626
}
598627
},
599628

‎src/Form.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ export default class Form extends Base {
1818

1919
@observable $submitting = false;
2020
@observable $validating = false;
21+
2122
@observable fields = observable.map ? observable.map({}) : asMap({});
2223

2324
constructor(setup = {}, {
@@ -88,6 +89,14 @@ export default class Form extends Base {
8889
return this.$validating;
8990
}
9091

92+
@computed get clearing() {
93+
return this.check('clearing', true);
94+
}
95+
96+
@computed get resetting() {
97+
return this.check('resetting', true);
98+
}
99+
91100
@computed get error() {
92101
return this.validator.genericErrorMessage;
93102
}

‎src/State.js‎

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -39,14 +39,11 @@ export default class State {
3939
constructor({ form, initial, options, bindings }) {
4040
this.set('form', form);
4141
this.initProps(initial);
42-
this.initOptions(options);
43-
this.initBindings(bindings);
44-
this.observeOptions();
45-
}
46-
47-
initOptions(options) {
4842
this.options = new Options();
4943
this.options.set(options);
44+
this.bindings = new Bindings();
45+
this.bindings.register(bindings);
46+
this.observeOptions();
5047
}
5148

5249
initProps(initial) {
@@ -81,11 +78,6 @@ export default class State {
8178
this.mode = 'unified';
8279
}
8380

84-
initBindings(bindings) {
85-
this.bindings = new Bindings();
86-
this.bindings.register(bindings);
87-
}
88-
8981
/**
9082
Get/Set Fields Structure
9183
*/

‎src/Validator.js‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -89,10 +89,15 @@ export default class Validator {
8989

9090
// wait all promises then resolve
9191
return Promise.all(this.promises)
92-
.then(action(() => (instance.$validating = false))) // eslint-disable-line
92+
.then(action(() => {
93+
instance.$validating = false;
94+
instance.$clearing = false;
95+
instance.$resetting = false;
96+
}))
9397
.catch(action((err) => {
94-
// eslint-disable-next-line
9598
instance.$validating = false;
99+
instance.$clearing = false;
100+
instance.$resetting = false;
96101
throw err;
97102
}))
98103
.then(() => resolve(instance));

‎src/utils.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import _ from 'lodash';
22

33
const props = {
4-
booleans: ['hasError', 'isValid', 'isDirty', 'isPristine', 'isDefault', 'isEmpty', 'focused', 'touched', 'changed', 'disabled'],
4+
booleans: ['hasError', 'isValid', 'isDirty', 'isPristine', 'isDefault', 'isEmpty', 'focused', 'touched', 'changed', 'disabled', 'resetting', 'clearing'],
55
field: ['value', 'initial', 'default', 'label', 'placeholder', 'disabled', 'related', 'options', 'extra', 'bindings', 'type', 'error'],
66
separated: ['values', 'initials', 'defaults', 'labels', 'placeholders', 'disabled', 'related', 'options', 'extra', 'bindings', 'types'],
77
function: ['observers', 'interceptors', 'parse', 'format'],
@@ -18,6 +18,8 @@ const props = {
1818
touched: 'some',
1919
changed: 'some',
2020
disabled: 'every',
21+
clearing: 'every',
22+
resetting: 'every',
2123
},
2224
};
2325

0 commit comments

Comments
 (0)