mobx-react-hook-form 1.0.13 → 2.0.1

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.
Files changed (6) hide show
  1. package/mobx-form/mobx-form.d.ts +7 -6
  2. package/mobx-form/mobx-form.d.ts.map +1 -1
  3. package/mobx-form/mobx-form.js +35 -28
  4. package/mobx-form/mobx-form.types.d.ts +2 -2
  5. package/mobx-form/mobx-form.types.d.ts.map +1 -1
  6. package/package.json +1 -1
package/mobx-form/mobx-form.d.ts CHANGED
@@ -1,17 +1,18 @@
1
1
  import type { Disposable } from 'disposer-util';
2
- import { FormState, UseFormProps, UseFormReturn } from 'react-hook-form';
2
+ import { FormState, SubmitErrorHandler, SubmitHandler, UseFormProps, UseFormReturn } from 'react-hook-form';
3
3
  import type { AnyObject, Maybe } from 'yammies/utils/types';
4
4
  import { ConnectedMobxForm, MobxFormParams } from './mobx-form.types';
5
- export declare class MobxForm<TFieldValues extends AnyObject, TContext = any> implements Disposable {
5
+ export declare class MobxForm<TFieldValues extends AnyObject, TContext = any, TFieldOutputValues extends AnyObject = TFieldValues> implements Disposable {
6
+ private config;
6
7
  protected abortController: AbortController;
7
8
  /**
8
9
  * Real react-hook-form params
9
10
  * Needed to connect real react-hook-form to this mobx wrapper
10
11
  */
11
12
  params: UseFormProps<TFieldValues, TContext>;
12
- protected submitHandler?: MobxFormParams<TFieldValues, TContext>['onSubmit'];
13
- protected submitErrorHandler?: MobxFormParams<TFieldValues, TContext>['onSubmitFailed'];
14
- protected resetHandler?: MobxFormParams<TFieldValues, TContext>['onReset'];
13
+ protected handleSubmit(...args: Parameters<SubmitHandler<TFieldOutputValues>>): void | Promise<void>;
14
+ protected handleSubmitFailed(...args: Parameters<SubmitErrorHandler<TFieldValues>>): void | Promise<void>;
15
+ protected handleReset(): void;
15
16
  /**
16
17
  * Original react-hook-form form
17
18
  */
@@ -25,7 +26,7 @@ export declare class MobxForm<TFieldValues extends AnyObject, TContext = any> im
25
26
  */
26
27
  data: Maybe<TFieldValues>;
27
28
  protected isConnected: boolean;
28
- constructor({ disposer, abortSignal, onSubmit, onSubmitFailed, onReset, getParams, ...params }: MobxFormParams<TFieldValues, TContext>);
29
+ constructor(config: MobxFormParams<TFieldValues, TContext, TFieldOutputValues>);
29
30
  /**
30
31
  * Allows to modify real react-hook-form useForm() payload
31
32
  */
package/mobx-form/mobx-form.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"mobx-form.d.ts","sourceRoot":"","sources":["../../src/mobx-form/mobx-form.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAUhD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAE5D,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEtE,qBAAa,QAAQ,CAAC,YAAY,SAAS,SAAS,EAAE,QAAQ,GAAG,GAAG,CAClE,YAAW,UAAU;IAErB,SAAS,CAAC,eAAe,EAAE,eAAe,CAAC;IAE3C;;;OAGG;IACH,MAAM,EAAE,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;IAE7C,SAAS,CAAC,aAAa,CAAC,EAAE,cAAc,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC,UAAU,CAAC,CAAC;IAC7E,SAAS,CAAC,kBAAkB,CAAC,EAAE,cAAc,CAC3C,YAAY,EACZ,QAAQ,CACT,CAAC,gBAAgB,CAAC,CAAC;IACpB,SAAS,CAAC,YAAY,CAAC,EAAE,cAAc,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC,SAAS,CAAC,CAAC;IAE3E;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEnD;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IAE/B;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;IAE1B,SAAS,CAAC,WAAW,UAAS;gBAElB,EAEV,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,cAAc,EACd,OAAO,EACP,SAAS,EACT,GAAG,MAAM,EACV,EAAE,cAAc,CAAC,YAAY,EAAE,QAAQ,CAAC;IAsDzC;;OAEG;IACH,SAAS,CAAC,MAAM,EAAE,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC;IAItD;;OAEG;IACH,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;IAIlE;;;;OAIG;IACH,SAAS,CAAC,OAAO,CACf,UAAU,EAAE,aAAa,CAAC,YAAY,EAAE,QAAQ,CAAC,GAChD,iBAAiB,CAAC,YAAY,EAAE,QAAQ,CAAC;IAkD5C,OAAO,IAAI,IAAI;CAGhB"}
1
+ {"version":3,"file":"mobx-form.d.ts","sourceRoot":"","sources":["../../src/mobx-form/mobx-form.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAShD,OAAO,EACL,SAAS,EACT,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,aAAa,EACd,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAE5D,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEtE,qBAAa,QAAQ,CACnB,YAAY,SAAS,SAAS,EAC9B,QAAQ,GAAG,GAAG,EACd,kBAAkB,SAAS,SAAS,GAAG,YAAY,CACnD,YAAW,UAAU;IAiDnB,OAAO,CAAC,MAAM;IA/ChB,SAAS,CAAC,eAAe,EAAE,eAAe,CAAC;IAE3C;;;OAGG;IACH,MAAM,EAAE,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;IAE7C,SAAS,CAAC,YAAY,CAEpB,GAAG,IAAI,EAAE,UAAU,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC,GACrD,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAKvB,SAAS,CAAC,kBAAkB,CAE1B,GAAG,IAAI,EAAE,UAAU,CAAC,kBAAkB,CAAC,YAAY,CAAC,CAAC,GACpD,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAKvB,SAAS,CAAC,WAAW;IAKrB;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEnD;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IAE/B;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;IAE1B,SAAS,CAAC,WAAW,UAAS;gBAGpB,MAAM,EAAE,cAAc,CAAC,YAAY,EAAE,QAAQ,EAAE,kBAAkB,CAAC;IAuD5E;;OAEG;IACH,SAAS,CAAC,MAAM,EAAE,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC;IAItD;;OAEG;IACH,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;IAIlE;;;;OAIG;IACH,SAAS,CAAC,OAAO,CACf,UAAU,EAAE,aAAa,CAAC,YAAY,EAAE,QAAQ,CAAC,GAChD,iBAAiB,CAAC,YAAY,EAAE,QAAQ,CAAC;IAuD5C,OAAO,IAAI,IAAI;CAGhB"}
package/mobx-form/mobx-form.js CHANGED
@@ -1,16 +1,29 @@
1
1
  import { LinkedAbortController } from 'linked-abort-controller';
2
- import noop from 'lodash-es/noop';
3
2
  import { action, makeObservable, observable, reaction, runInAction, } from 'mobx';
4
3
  export class MobxForm {
4
+ config;
5
5
  abortController;
6
6
  /**
7
7
  * Real react-hook-form params
8
8
  * Needed to connect real react-hook-form to this mobx wrapper
9
9
  */
10
10
  params;
11
- submitHandler;
12
- submitErrorHandler;
13
- resetHandler;
11
+ handleSubmit(
12
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
13
+ ...args) {
14
+ this.config.onSubmit?.(...args);
15
+ // used to override
16
+ }
17
+ handleSubmitFailed(
18
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
19
+ ...args) {
20
+ this.config.onSubmitFailed?.(...args);
21
+ // used to override
22
+ }
23
+ handleReset() {
24
+ this.config.onReset?.();
25
+ // used to override
26
+ }
14
27
  /**
15
28
  * Original react-hook-form form
16
29
  */
@@ -24,12 +37,13 @@ export class MobxForm {
24
37
  */
25
38
  data;
26
39
  isConnected = false;
27
- constructor({
28
- // eslint-disable-next-line sonarjs/deprecation
29
- disposer, abortSignal, onSubmit, onSubmitFailed, onReset, getParams, ...params }) {
30
- this.abortController = new LinkedAbortController(abortSignal);
31
- if (disposer) {
32
- disposer.add(() => this.dispose());
40
+ constructor(config) {
41
+ this.config = config;
42
+ this.abortController = new LinkedAbortController(config.abortSignal);
43
+ // eslint-disable-next-line sonarjs/deprecation
44
+ if (config.disposer) {
45
+ // eslint-disable-next-line sonarjs/deprecation
46
+ config.disposer.add(() => this.dispose());
33
47
  }
34
48
  this.abortController.signal.addEventListener('abort', () => {
35
49
  this.form = null;
@@ -51,10 +65,7 @@ export class MobxForm {
51
65
  dirtyFields: {},
52
66
  validatingFields: {},
53
67
  };
54
- this.submitHandler = onSubmit;
55
- this.submitErrorHandler = onSubmitFailed;
56
- this.resetHandler = onReset;
57
- this.params = params;
68
+ this.params = config;
58
69
  makeObservable(this, {
59
70
  state: observable.deep,
60
71
  data: observable.deep,
@@ -62,8 +73,8 @@ export class MobxForm {
62
73
  setParams: action.bound,
63
74
  updateParams: action.bound,
64
75
  });
65
- if (getParams) {
66
- reaction(getParams, (params) => {
76
+ if (config.getParams) {
77
+ reaction(config.getParams, (params) => {
67
78
  this.updateParams(params);
68
79
  }, {
69
80
  signal: this.abortController.signal,
@@ -106,19 +117,15 @@ export class MobxForm {
106
117
  }
107
118
  return {
108
119
  ...formResult,
109
- onReset: this.resetHandler ?? noop,
110
- onSubmit: formResult.handleSubmit(this.submitHandler ?? noop, this.submitErrorHandler),
120
+ onReset: () => this.handleReset(),
121
+ onSubmit: formResult.handleSubmit((...args) => this.handleSubmit(...args), (...args) => this.handleSubmitFailed(...args)),
111
122
  handleSubmit: (onValid, onInvalid) => {
112
- return formResult.handleSubmit((...args) => {
113
- if (this.submitHandler) {
114
- this.submitHandler(...args);
115
- }
116
- onValid(...args);
117
- }, (...args) => {
118
- if (this.submitErrorHandler) {
119
- this.submitErrorHandler(...args);
120
- }
121
- onInvalid?.(...args);
123
+ return formResult.handleSubmit(async (...args) => {
124
+ await this.handleSubmit(...args);
125
+ await onValid(...args);
126
+ }, async (...args) => {
127
+ await this.handleSubmitFailed(...args);
128
+ await onInvalid?.(...args);
122
129
  });
123
130
  },
124
131
  };
package/mobx-form/mobx-form.types.d.ts CHANGED
@@ -4,7 +4,7 @@ import type { AnyObject } from 'yammies/utils/types';
4
4
  /**
5
5
  * Additional options for {@link MobxForm} constructor
6
6
  */
7
- export interface MobxFormParams<TFieldValues extends AnyObject, TContext = any> extends UseFormProps<TFieldValues, TContext> {
7
+ export interface MobxFormParams<TFieldValues extends AnyObject, TContext = any, TFieldOutputValues extends AnyObject = TFieldValues> extends UseFormProps<TFieldValues, TContext> {
8
8
  /**
9
9
  * Disposer for mobx form
10
10
  * @deprecated use {abortSignal} instead
@@ -17,7 +17,7 @@ export interface MobxFormParams<TFieldValues extends AnyObject, TContext = any>
17
17
  /**
18
18
  * Form submit handler
19
19
  */
20
- onSubmit?: SubmitHandler<TFieldValues>;
20
+ onSubmit?: SubmitHandler<TFieldOutputValues>;
21
21
  /**
22
22
  * Form submit failed handler
23
23
  */
package/mobx-form/mobx-form.types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"mobx-form.types.d.ts","sourceRoot":"","sources":["../../src/mobx-form/mobx-form.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EACL,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,aAAa,EACd,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,cAAc,CAAC,YAAY,SAAS,SAAS,EAAE,QAAQ,GAAG,GAAG,CAC5E,SAAQ,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC;IAC5C;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IACvC;;OAEG;IACH,cAAc,CAAC,EAAE,kBAAkB,CAAC,YAAY,CAAC,CAAC;IAClD;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC;CACjE;AAED;;;;GAIG;AACH,MAAM,WAAW,iBAAiB,CAChC,YAAY,SAAS,SAAS,EAC9B,QAAQ,GAAG,GAAG,CACd,SAAQ,aAAa,CAAC,YAAY,EAAE,QAAQ,CAAC;IAC7C;;OAEG;IACH,OAAO,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,YAAY,CAAC;CACxB"}
1
+ {"version":3,"file":"mobx-form.types.d.ts","sourceRoot":"","sources":["../../src/mobx-form/mobx-form.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EACL,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,aAAa,EACd,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,cAAc,CAC7B,YAAY,SAAS,SAAS,EAC9B,QAAQ,GAAG,GAAG,EACd,kBAAkB,SAAS,SAAS,GAAG,YAAY,CACnD,SAAQ,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC;IAC5C;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAC;IAC7C;;OAEG;IACH,cAAc,CAAC,EAAE,kBAAkB,CAAC,YAAY,CAAC,CAAC;IAClD;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC,YAAY,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC;CACjE;AAED;;;;GAIG;AACH,MAAM,WAAW,iBAAiB,CAChC,YAAY,SAAS,SAAS,EAC9B,QAAQ,GAAG,GAAG,CACd,SAAQ,aAAa,CAAC,YAAY,EAAE,QAAQ,CAAC;IAC7C;;OAEG;IACH,OAAO,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,YAAY,CAAC;CACxB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "mobx-react-hook-form",
3
- "version": "1.0.13",
3
+ "version": "2.0.1",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "author": "js2me",