@strictly/react-form 0.0.11 → 0.0.12
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/.out/core/mobx/{form_presenter.d.ts → form_model.d.ts} +15 -21
- package/.out/core/mobx/form_model.js +513 -0
- package/.out/core/mobx/hooks.d.ts +6 -25
- package/.out/core/mobx/hooks.js +14 -50
- package/.out/core/mobx/specs/{form_presenter.tests.js → form_model.tests.js} +46 -40
- package/.out/core/mobx/types.d.ts +4 -4
- package/.out/index.d.ts +1 -1
- package/.out/index.js +1 -1
- package/.out/tsconfig.tsbuildinfo +1 -1
- package/.turbo/turbo-build.log +8 -8
- package/.turbo/turbo-check-types.log +1 -1
- package/core/mobx/{form_presenter.ts → form_model.ts} +287 -329
- package/core/mobx/hooks.tsx +26 -124
- package/core/mobx/specs/{form_presenter.tests.ts → form_model.tests.ts} +101 -94
- package/core/mobx/types.ts +12 -12
- package/dist/index.cjs +484 -527
- package/dist/index.d.cts +51 -73
- package/dist/index.d.ts +51 -73
- package/dist/index.js +484 -527
- package/index.ts +1 -1
- package/mantine/hooks.tsx +2 -0
- package/package.json +1 -1
- package/.out/core/mobx/form_presenter.js +0 -525
- /package/.out/core/mobx/specs/{form_presenter.tests.d.ts → form_model.tests.d.ts} +0 -0
package/dist/index.js
CHANGED
|
@@ -302,7 +302,7 @@ function listAdapter() {
|
|
|
302
302
|
);
|
|
303
303
|
}
|
|
304
304
|
|
|
305
|
-
// core/mobx/
|
|
305
|
+
// core/mobx/form_model.ts
|
|
306
306
|
import {
|
|
307
307
|
assertExists,
|
|
308
308
|
assertExistsAndReturn,
|
|
@@ -326,10 +326,136 @@ import {
|
|
|
326
326
|
observable,
|
|
327
327
|
runInAction
|
|
328
328
|
} from "mobx";
|
|
329
|
-
var
|
|
330
|
-
|
|
329
|
+
var _accessors_dec, _knownFields_dec, _fields_dec, _errors_dec, _fieldOverrides_dec, _value_dec, _init, _value, _fieldOverrides, _errors;
|
|
330
|
+
_value_dec = [observable.ref], _fieldOverrides_dec = [observable.shallow], _errors_dec = [observable.shallow], _fields_dec = [computed], _knownFields_dec = [computed], _accessors_dec = [computed];
|
|
331
|
+
var FormModel = class {
|
|
332
|
+
constructor(type, value, adapters) {
|
|
331
333
|
this.type = type;
|
|
332
334
|
this.adapters = adapters;
|
|
335
|
+
__runInitializers(_init, 5, this);
|
|
336
|
+
__privateAdd(this, _value, __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
|
|
337
|
+
__privateAdd(this, _fieldOverrides, __runInitializers(_init, 12, this)), __runInitializers(_init, 15, this);
|
|
338
|
+
__privateAdd(this, _errors, __runInitializers(_init, 16, this, {})), __runInitializers(_init, 19, this);
|
|
339
|
+
__publicField(this, "flattenedTypeDefs");
|
|
340
|
+
this.value = mobxCopy(type, value);
|
|
341
|
+
this.flattenedTypeDefs = flattenTypesOfType(type);
|
|
342
|
+
const conversions = flattenValueTo(
|
|
343
|
+
type,
|
|
344
|
+
this.value,
|
|
345
|
+
() => {
|
|
346
|
+
},
|
|
347
|
+
(_t, value2, _setter, typePath, valuePath) => {
|
|
348
|
+
const adapter2 = this.adapters[typePath];
|
|
349
|
+
if (adapter2 == null) {
|
|
350
|
+
return;
|
|
351
|
+
}
|
|
352
|
+
const {
|
|
353
|
+
convert,
|
|
354
|
+
revert
|
|
355
|
+
} = adapter2;
|
|
356
|
+
if (revert == null) {
|
|
357
|
+
return;
|
|
358
|
+
}
|
|
359
|
+
return convert(value2, valuePath, this.value);
|
|
360
|
+
}
|
|
361
|
+
);
|
|
362
|
+
this.fieldOverrides = map(conversions, function(_k, v) {
|
|
363
|
+
return v && [v.value];
|
|
364
|
+
});
|
|
365
|
+
}
|
|
366
|
+
get fields() {
|
|
367
|
+
return new Proxy(
|
|
368
|
+
this.knownFields,
|
|
369
|
+
{
|
|
370
|
+
get: (target, prop) => {
|
|
371
|
+
const field = target[prop];
|
|
372
|
+
if (field != null) {
|
|
373
|
+
return field;
|
|
374
|
+
}
|
|
375
|
+
if (typeof prop === "string") {
|
|
376
|
+
return this.maybeSynthesizeFieldByValuePath(prop);
|
|
377
|
+
}
|
|
378
|
+
}
|
|
379
|
+
}
|
|
380
|
+
);
|
|
381
|
+
}
|
|
382
|
+
get knownFields() {
|
|
383
|
+
return flattenValueTo(
|
|
384
|
+
this.type,
|
|
385
|
+
this.value,
|
|
386
|
+
() => {
|
|
387
|
+
},
|
|
388
|
+
// TODO swap these to valuePath, typePath in flatten
|
|
389
|
+
(_t, _v, _setter, typePath, valuePath) => {
|
|
390
|
+
return this.synthesizeFieldByPaths(
|
|
391
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
392
|
+
valuePath,
|
|
393
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
394
|
+
typePath
|
|
395
|
+
);
|
|
396
|
+
}
|
|
397
|
+
);
|
|
398
|
+
}
|
|
399
|
+
maybeSynthesizeFieldByValuePath(valuePath) {
|
|
400
|
+
let typePath;
|
|
401
|
+
try {
|
|
402
|
+
typePath = valuePathToTypePath(
|
|
403
|
+
this.type,
|
|
404
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
405
|
+
valuePath,
|
|
406
|
+
true
|
|
407
|
+
);
|
|
408
|
+
} catch (e) {
|
|
409
|
+
return;
|
|
410
|
+
}
|
|
411
|
+
return this.synthesizeFieldByPaths(valuePath, typePath);
|
|
412
|
+
}
|
|
413
|
+
synthesizeFieldByPaths(valuePath, typePath) {
|
|
414
|
+
const adapter2 = this.adapters[typePath];
|
|
415
|
+
if (adapter2 == null) {
|
|
416
|
+
return;
|
|
417
|
+
}
|
|
418
|
+
const {
|
|
419
|
+
convert,
|
|
420
|
+
create
|
|
421
|
+
} = adapter2;
|
|
422
|
+
const fieldOverride = this.fieldOverrides[valuePath];
|
|
423
|
+
const accessor = this.getAccessorForValuePath(valuePath);
|
|
424
|
+
const fieldTypeDef = this.flattenedTypeDefs[typePath];
|
|
425
|
+
const {
|
|
426
|
+
value,
|
|
427
|
+
required,
|
|
428
|
+
readonly
|
|
429
|
+
} = convert(
|
|
430
|
+
accessor != null ? accessor.value : fieldTypeDef != null ? mobxCopy(
|
|
431
|
+
fieldTypeDef,
|
|
432
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
433
|
+
create(valuePath, this.value)
|
|
434
|
+
) : create(valuePath, this.value),
|
|
435
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
436
|
+
valuePath,
|
|
437
|
+
this.value
|
|
438
|
+
);
|
|
439
|
+
const error = this.errors[valuePath];
|
|
440
|
+
return {
|
|
441
|
+
value: fieldOverride != null ? fieldOverride[0] : value,
|
|
442
|
+
error,
|
|
443
|
+
readonly,
|
|
444
|
+
required
|
|
445
|
+
};
|
|
446
|
+
}
|
|
447
|
+
getAccessorForValuePath(valuePath) {
|
|
448
|
+
return this.accessors[valuePath];
|
|
449
|
+
}
|
|
450
|
+
// should only be referenced internally, so loosely typed
|
|
451
|
+
get accessors() {
|
|
452
|
+
return flattenAccessorsOfType(
|
|
453
|
+
this.type,
|
|
454
|
+
this.value,
|
|
455
|
+
(value) => {
|
|
456
|
+
this.value = mobxCopy(this.type, value);
|
|
457
|
+
}
|
|
458
|
+
);
|
|
333
459
|
}
|
|
334
460
|
maybeGetAdapterForValuePath(valuePath) {
|
|
335
461
|
const typePath = valuePathToTypePath(this.type, valuePath, true);
|
|
@@ -345,15 +471,15 @@ var FormPresenter = class {
|
|
|
345
471
|
typePath(valuePath) {
|
|
346
472
|
return valuePathToTypePath(this.type, valuePath, true);
|
|
347
473
|
}
|
|
348
|
-
setFieldValueAndValidate(
|
|
349
|
-
return this.internalSetFieldValue(
|
|
474
|
+
setFieldValueAndValidate(valuePath, value) {
|
|
475
|
+
return this.internalSetFieldValue(valuePath, value, true);
|
|
350
476
|
}
|
|
351
|
-
setFieldValue(
|
|
352
|
-
return this.internalSetFieldValue(
|
|
477
|
+
setFieldValue(valuePath, value) {
|
|
478
|
+
return this.internalSetFieldValue(valuePath, value, false);
|
|
353
479
|
}
|
|
354
|
-
addListItem(
|
|
480
|
+
addListItem(valuePath, elementValue = null, index) {
|
|
355
481
|
const listValuePath = valuePath;
|
|
356
|
-
const accessor =
|
|
482
|
+
const accessor = this.accessors[valuePath];
|
|
357
483
|
const listTypePath = this.typePath(valuePath);
|
|
358
484
|
const definedIndex = index != null ? index : accessor.value.length;
|
|
359
485
|
const elementTypePath = `${listTypePath}.*`;
|
|
@@ -366,7 +492,7 @@ var FormPresenter = class {
|
|
|
366
492
|
const element = elementValue != null ? elementValue[0] : elementAdapter.create(
|
|
367
493
|
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
368
494
|
elementTypePath,
|
|
369
|
-
|
|
495
|
+
this.value
|
|
370
496
|
);
|
|
371
497
|
const originalList = accessor.value;
|
|
372
498
|
const newList = [
|
|
@@ -374,7 +500,7 @@ var FormPresenter = class {
|
|
|
374
500
|
element,
|
|
375
501
|
...originalList.slice(definedIndex)
|
|
376
502
|
];
|
|
377
|
-
const targetPaths = Object.keys(
|
|
503
|
+
const targetPaths = Object.keys(this.fieldOverrides).filter(function(v) {
|
|
378
504
|
return v.startsWith(`${listValuePath}.`);
|
|
379
505
|
}).map(function(v) {
|
|
380
506
|
const parts = v.substring(listValuePath.length + 1).split(".");
|
|
@@ -388,11 +514,11 @@ var FormPresenter = class {
|
|
|
388
514
|
}).sort(function([a], [b]) {
|
|
389
515
|
return b - a;
|
|
390
516
|
});
|
|
391
|
-
runInAction(
|
|
392
|
-
targetPaths.forEach(
|
|
517
|
+
runInAction(() => {
|
|
518
|
+
targetPaths.forEach(([
|
|
393
519
|
index2,
|
|
394
520
|
postfix
|
|
395
|
-
]) {
|
|
521
|
+
]) => {
|
|
396
522
|
const fromJsonPath = [
|
|
397
523
|
listValuePath,
|
|
398
524
|
`${index2}`,
|
|
@@ -403,99 +529,102 @@ var FormPresenter = class {
|
|
|
403
529
|
`${index2 + 1}`,
|
|
404
530
|
...postfix
|
|
405
531
|
].join(".");
|
|
406
|
-
const fieldOverride =
|
|
407
|
-
delete
|
|
408
|
-
|
|
409
|
-
const error =
|
|
410
|
-
delete
|
|
411
|
-
|
|
532
|
+
const fieldOverride = this.fieldOverrides[fromJsonPath];
|
|
533
|
+
delete this.fieldOverrides[fromJsonPath];
|
|
534
|
+
this.fieldOverrides[toJsonPath] = fieldOverride;
|
|
535
|
+
const error = this.errors[fromJsonPath];
|
|
536
|
+
delete this.errors[fromJsonPath];
|
|
537
|
+
this.errors[toJsonPath] = error;
|
|
412
538
|
});
|
|
413
539
|
accessor.set(newList);
|
|
414
|
-
delete
|
|
540
|
+
delete this.fieldOverrides[listValuePath];
|
|
415
541
|
});
|
|
416
542
|
}
|
|
417
|
-
removeListItem(
|
|
418
|
-
const
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
jsonPathPop(elementValuePath),
|
|
423
|
-
"expected a path with two or more segments {}",
|
|
424
|
-
elementValuePath
|
|
425
|
-
);
|
|
426
|
-
const accessor = model.accessors[listValuePath];
|
|
427
|
-
const elementIndex = checkValidNumber(
|
|
428
|
-
parseInt(elementIndexString),
|
|
429
|
-
"unexpected index {} ({})",
|
|
430
|
-
elementIndexString,
|
|
431
|
-
elementValuePath
|
|
432
|
-
);
|
|
433
|
-
const newList = [...accessor.value];
|
|
434
|
-
assertState(
|
|
435
|
-
elementIndex >= 0 && elementIndex < newList.length,
|
|
436
|
-
"invalid index from path {} ({})",
|
|
437
|
-
elementIndex,
|
|
438
|
-
elementValuePath
|
|
439
|
-
);
|
|
440
|
-
newList.splice(elementIndex, 1);
|
|
441
|
-
const targetPaths = Object.keys(model.fieldOverrides).filter(function(v) {
|
|
442
|
-
return v.startsWith(`${listValuePath}.`);
|
|
443
|
-
}).map(function(v) {
|
|
444
|
-
const parts = v.substring(listValuePath.length + 1).split(".");
|
|
445
|
-
const index = parseInt(parts[0]);
|
|
446
|
-
return [
|
|
447
|
-
index,
|
|
448
|
-
parts.slice(1)
|
|
449
|
-
];
|
|
450
|
-
}).filter(function([index]) {
|
|
451
|
-
return index > elementIndex;
|
|
452
|
-
}).sort(function([a], [b]) {
|
|
453
|
-
return a - b;
|
|
454
|
-
});
|
|
455
|
-
runInAction(function() {
|
|
456
|
-
targetPaths.forEach(function([
|
|
457
|
-
index,
|
|
458
|
-
postfix
|
|
459
|
-
]) {
|
|
460
|
-
const fromJsonPath = [
|
|
461
|
-
listValuePath,
|
|
462
|
-
`${index}`,
|
|
463
|
-
...postfix
|
|
464
|
-
].join(".");
|
|
465
|
-
const toJsonPath = [
|
|
543
|
+
removeListItem(...elementValuePaths) {
|
|
544
|
+
const orderedElementValuePaths = elementValuePaths.toSorted().reverse();
|
|
545
|
+
runInAction(() => {
|
|
546
|
+
orderedElementValuePaths.forEach((elementValuePath) => {
|
|
547
|
+
const [
|
|
466
548
|
listValuePath,
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
const
|
|
474
|
-
|
|
475
|
-
|
|
549
|
+
elementIndexString
|
|
550
|
+
] = assertExistsAndReturn(
|
|
551
|
+
jsonPathPop(elementValuePath),
|
|
552
|
+
"expected a path with two or more segments {}",
|
|
553
|
+
elementValuePath
|
|
554
|
+
);
|
|
555
|
+
const accessor = this.accessors[listValuePath];
|
|
556
|
+
const elementIndex = checkValidNumber(
|
|
557
|
+
parseInt(elementIndexString),
|
|
558
|
+
"unexpected index {} ({})",
|
|
559
|
+
elementIndexString,
|
|
560
|
+
elementValuePath
|
|
561
|
+
);
|
|
562
|
+
const newList = [...accessor.value];
|
|
563
|
+
assertState(
|
|
564
|
+
elementIndex >= 0 && elementIndex < newList.length,
|
|
565
|
+
"invalid index from path {} ({})",
|
|
566
|
+
elementIndex,
|
|
567
|
+
elementValuePath
|
|
568
|
+
);
|
|
569
|
+
newList.splice(elementIndex, 1);
|
|
570
|
+
const targetPaths = Object.keys(this.fieldOverrides).filter(function(v) {
|
|
571
|
+
return v.startsWith(`${listValuePath}.`);
|
|
572
|
+
}).map(function(v) {
|
|
573
|
+
const parts = v.substring(listValuePath.length + 1).split(".");
|
|
574
|
+
const index = parseInt(parts[0]);
|
|
575
|
+
return [
|
|
576
|
+
index,
|
|
577
|
+
parts.slice(1)
|
|
578
|
+
];
|
|
579
|
+
}).filter(function([index]) {
|
|
580
|
+
return index > elementIndex;
|
|
581
|
+
}).sort(function([a], [b]) {
|
|
582
|
+
return a - b;
|
|
583
|
+
});
|
|
584
|
+
targetPaths.forEach(([
|
|
585
|
+
index,
|
|
586
|
+
postfix
|
|
587
|
+
]) => {
|
|
588
|
+
const fromJsonPath = [
|
|
589
|
+
listValuePath,
|
|
590
|
+
`${index}`,
|
|
591
|
+
...postfix
|
|
592
|
+
].join(".");
|
|
593
|
+
const toJsonPath = [
|
|
594
|
+
listValuePath,
|
|
595
|
+
`${index - 1}`,
|
|
596
|
+
...postfix
|
|
597
|
+
].join(".");
|
|
598
|
+
const fieldOverride = this.fieldOverrides[fromJsonPath];
|
|
599
|
+
delete this.fieldOverrides[fromJsonPath];
|
|
600
|
+
this.fieldOverrides[toJsonPath] = fieldOverride;
|
|
601
|
+
const error = this.errors[fromJsonPath];
|
|
602
|
+
delete this.errors[fromJsonPath];
|
|
603
|
+
this.errors[toJsonPath] = error;
|
|
604
|
+
});
|
|
605
|
+
accessor.set(newList);
|
|
606
|
+
delete this.fieldOverrides[listValuePath];
|
|
476
607
|
});
|
|
477
|
-
accessor.set(newList);
|
|
478
|
-
delete model.fieldOverrides[listValuePath];
|
|
479
608
|
});
|
|
480
609
|
}
|
|
481
|
-
internalSetFieldValue(
|
|
610
|
+
internalSetFieldValue(valuePath, value, displayValidation) {
|
|
482
611
|
const { revert } = this.getAdapterForValuePath(valuePath);
|
|
483
612
|
assertExists(revert, "setting value not supported {}", valuePath);
|
|
484
|
-
const conversion = revert(value, valuePath,
|
|
485
|
-
const accessor =
|
|
613
|
+
const conversion = revert(value, valuePath, this.value);
|
|
614
|
+
const accessor = this.getAccessorForValuePath(valuePath);
|
|
486
615
|
return runInAction(() => {
|
|
487
|
-
|
|
616
|
+
this.fieldOverrides[valuePath] = [value];
|
|
488
617
|
switch (conversion.type) {
|
|
489
618
|
case 1 /* Failure */:
|
|
490
619
|
if (displayValidation) {
|
|
491
|
-
|
|
620
|
+
this.errors[valuePath] = conversion.error;
|
|
492
621
|
}
|
|
493
622
|
if (conversion.value != null && accessor != null) {
|
|
494
623
|
accessor.set(conversion.value[0]);
|
|
495
624
|
}
|
|
496
625
|
return false;
|
|
497
626
|
case 0 /* Success */:
|
|
498
|
-
delete
|
|
627
|
+
delete this.errors[valuePath];
|
|
499
628
|
accessor == null ? void 0 : accessor.set(conversion.value);
|
|
500
629
|
return true;
|
|
501
630
|
default:
|
|
@@ -503,15 +632,15 @@ var FormPresenter = class {
|
|
|
503
632
|
}
|
|
504
633
|
});
|
|
505
634
|
}
|
|
506
|
-
clearFieldError(
|
|
507
|
-
const fieldOverride =
|
|
635
|
+
clearFieldError(valuePath) {
|
|
636
|
+
const fieldOverride = this.fieldOverrides[valuePath];
|
|
508
637
|
if (fieldOverride != null) {
|
|
509
|
-
runInAction(
|
|
510
|
-
delete
|
|
638
|
+
runInAction(() => {
|
|
639
|
+
delete this.errors[valuePath];
|
|
511
640
|
});
|
|
512
641
|
}
|
|
513
642
|
}
|
|
514
|
-
clearFieldValue(
|
|
643
|
+
clearFieldValue(valuePath) {
|
|
515
644
|
const typePath = this.typePath(valuePath);
|
|
516
645
|
const adapter2 = this.adapters[typePath];
|
|
517
646
|
if (adapter2 == null) {
|
|
@@ -521,42 +650,42 @@ var FormPresenter = class {
|
|
|
521
650
|
convert,
|
|
522
651
|
create
|
|
523
652
|
} = adapter2;
|
|
524
|
-
const value = create(valuePath,
|
|
653
|
+
const value = create(valuePath, this.value);
|
|
525
654
|
const {
|
|
526
655
|
value: displayValue
|
|
527
|
-
} = convert(value, valuePath,
|
|
656
|
+
} = convert(value, valuePath, this.value);
|
|
528
657
|
const key = valuePath;
|
|
529
|
-
runInAction(
|
|
530
|
-
|
|
658
|
+
runInAction(() => {
|
|
659
|
+
this.fieldOverrides[key] = [displayValue];
|
|
531
660
|
});
|
|
532
661
|
}
|
|
533
|
-
clearAll(
|
|
662
|
+
clearAll(value) {
|
|
534
663
|
runInAction(() => {
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
664
|
+
this.errors = {};
|
|
665
|
+
this.fieldOverrides = {};
|
|
666
|
+
this.value = mobxCopy(this.type, value);
|
|
538
667
|
});
|
|
539
668
|
}
|
|
540
|
-
isValuePathActive(
|
|
541
|
-
const values = flattenValuesOfType(this.type,
|
|
669
|
+
isValuePathActive(valuePath) {
|
|
670
|
+
const values = flattenValuesOfType(this.type, this.value);
|
|
542
671
|
const keys = new Set(Object.keys(values));
|
|
543
672
|
return keys.has(valuePath);
|
|
544
673
|
}
|
|
545
|
-
validateField(
|
|
674
|
+
validateField(valuePath, ignoreDefaultValue = false) {
|
|
546
675
|
const {
|
|
547
676
|
convert,
|
|
548
677
|
revert,
|
|
549
678
|
create
|
|
550
679
|
} = this.getAdapterForValuePath(valuePath);
|
|
551
|
-
const fieldOverride =
|
|
552
|
-
const accessor =
|
|
680
|
+
const fieldOverride = this.fieldOverrides[valuePath];
|
|
681
|
+
const accessor = this.getAccessorForValuePath(valuePath);
|
|
553
682
|
const {
|
|
554
683
|
value: storedValue
|
|
555
684
|
} = convert(
|
|
556
|
-
accessor != null ? accessor.value : create(valuePath,
|
|
685
|
+
accessor != null ? accessor.value : create(valuePath, this.value),
|
|
557
686
|
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
558
687
|
valuePath,
|
|
559
|
-
|
|
688
|
+
this.value
|
|
560
689
|
);
|
|
561
690
|
const value = fieldOverride != null ? fieldOverride[0] : storedValue;
|
|
562
691
|
const dirty = storedValue !== value;
|
|
@@ -564,411 +693,117 @@ var FormPresenter = class {
|
|
|
564
693
|
if (ignoreDefaultValue) {
|
|
565
694
|
const {
|
|
566
695
|
value: defaultDisplayValue
|
|
567
|
-
} = convert(create(valuePath,
|
|
696
|
+
} = convert(create(valuePath, this.value), valuePath, this.value);
|
|
568
697
|
if (defaultDisplayValue === value) {
|
|
569
698
|
return true;
|
|
570
699
|
}
|
|
571
700
|
}
|
|
572
|
-
const conversion = revert(value, valuePath,
|
|
573
|
-
return runInAction(function() {
|
|
574
|
-
switch (conversion.type) {
|
|
575
|
-
case 1 /* Failure */:
|
|
576
|
-
model.errors[valuePath] = conversion.error;
|
|
577
|
-
if (conversion.value != null && accessor != null && dirty) {
|
|
578
|
-
accessor.set(conversion.value[0]);
|
|
579
|
-
}
|
|
580
|
-
return false;
|
|
581
|
-
case 0 /* Success */:
|
|
582
|
-
delete model.errors[valuePath];
|
|
583
|
-
if (accessor != null && dirty) {
|
|
584
|
-
accessor.set(conversion.value);
|
|
585
|
-
}
|
|
586
|
-
return true;
|
|
587
|
-
default:
|
|
588
|
-
throw new UnreachableError2(conversion);
|
|
589
|
-
}
|
|
590
|
-
});
|
|
591
|
-
}
|
|
592
|
-
validateAll(model) {
|
|
593
|
-
const accessors = toArray(model.accessors).toSorted(function([a], [b]) {
|
|
594
|
-
return a.length - b.length;
|
|
595
|
-
});
|
|
701
|
+
const conversion = revert(value, valuePath, this.value);
|
|
596
702
|
return runInAction(() => {
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
valuePath
|
|
600
|
-
accessor
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
return success;
|
|
613
|
-
}
|
|
614
|
-
const fieldOverride = model.fieldOverrides[adapterPath];
|
|
615
|
-
const {
|
|
616
|
-
value: storedValue
|
|
617
|
-
} = convert(accessor.value, valuePath, model.value);
|
|
618
|
-
const value = fieldOverride != null ? fieldOverride[0] : storedValue;
|
|
619
|
-
const dirty = fieldOverride != null && fieldOverride[0] !== storedValue;
|
|
620
|
-
const conversion = revert(value, valuePath, model.value);
|
|
621
|
-
switch (conversion.type) {
|
|
622
|
-
case 1 /* Failure */:
|
|
623
|
-
model.errors[adapterPath] = conversion.error;
|
|
624
|
-
if (conversion.value != null && dirty) {
|
|
625
|
-
accessor.set(conversion.value[0]);
|
|
626
|
-
}
|
|
627
|
-
return false;
|
|
628
|
-
case 0 /* Success */:
|
|
629
|
-
if (dirty) {
|
|
630
|
-
accessor.set(conversion.value);
|
|
631
|
-
}
|
|
632
|
-
delete model.errors[adapterPath];
|
|
633
|
-
return success;
|
|
634
|
-
default:
|
|
635
|
-
throw new UnreachableError2(conversion);
|
|
636
|
-
}
|
|
637
|
-
},
|
|
638
|
-
true
|
|
639
|
-
);
|
|
640
|
-
});
|
|
641
|
-
}
|
|
642
|
-
};
|
|
643
|
-
var _accessors_dec, _knownFields_dec, _fields_dec, _errors_dec, _fieldOverrides_dec, _value_dec, _init, _value, _fieldOverrides, _errors;
|
|
644
|
-
_value_dec = [observable.ref], _fieldOverrides_dec = [observable.shallow], _errors_dec = [observable.shallow], _fields_dec = [computed], _knownFields_dec = [computed], _accessors_dec = [computed];
|
|
645
|
-
var FormModel = class {
|
|
646
|
-
constructor(type, value, adapters) {
|
|
647
|
-
this.type = type;
|
|
648
|
-
this.adapters = adapters;
|
|
649
|
-
__runInitializers(_init, 5, this);
|
|
650
|
-
__privateAdd(this, _value, __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
|
|
651
|
-
__privateAdd(this, _fieldOverrides, __runInitializers(_init, 12, this)), __runInitializers(_init, 15, this);
|
|
652
|
-
__privateAdd(this, _errors, __runInitializers(_init, 16, this, {})), __runInitializers(_init, 19, this);
|
|
653
|
-
__publicField(this, "flattenedTypeDefs");
|
|
654
|
-
this.value = mobxCopy(type, value);
|
|
655
|
-
this.flattenedTypeDefs = flattenTypesOfType(type);
|
|
656
|
-
const conversions = flattenValueTo(
|
|
657
|
-
type,
|
|
658
|
-
this.value,
|
|
659
|
-
() => {
|
|
660
|
-
},
|
|
661
|
-
(_t, value2, _setter, typePath, valuePath) => {
|
|
662
|
-
const adapter2 = this.adapters[typePath];
|
|
663
|
-
if (adapter2 == null) {
|
|
664
|
-
return;
|
|
665
|
-
}
|
|
666
|
-
const {
|
|
667
|
-
convert,
|
|
668
|
-
revert
|
|
669
|
-
} = adapter2;
|
|
670
|
-
if (revert == null) {
|
|
671
|
-
return;
|
|
672
|
-
}
|
|
673
|
-
return convert(value2, valuePath, this.value);
|
|
674
|
-
}
|
|
675
|
-
);
|
|
676
|
-
this.fieldOverrides = map(conversions, function(_k, v) {
|
|
677
|
-
return v && [v.value];
|
|
678
|
-
});
|
|
679
|
-
}
|
|
680
|
-
get fields() {
|
|
681
|
-
return new Proxy(
|
|
682
|
-
this.knownFields,
|
|
683
|
-
{
|
|
684
|
-
get: (target, prop) => {
|
|
685
|
-
const field = target[prop];
|
|
686
|
-
if (field != null) {
|
|
687
|
-
return field;
|
|
688
|
-
}
|
|
689
|
-
if (typeof prop === "string") {
|
|
690
|
-
return this.maybeSynthesizeFieldByValuePath(prop);
|
|
691
|
-
}
|
|
692
|
-
}
|
|
693
|
-
}
|
|
694
|
-
);
|
|
695
|
-
}
|
|
696
|
-
get knownFields() {
|
|
697
|
-
return flattenValueTo(
|
|
698
|
-
this.type,
|
|
699
|
-
this.value,
|
|
700
|
-
() => {
|
|
701
|
-
},
|
|
702
|
-
// TODO swap these to valuePath, typePath in flatten
|
|
703
|
-
(_t, _v, _setter, typePath, valuePath) => {
|
|
704
|
-
return this.synthesizeFieldByPaths(
|
|
705
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
706
|
-
valuePath,
|
|
707
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
708
|
-
typePath
|
|
709
|
-
);
|
|
710
|
-
}
|
|
711
|
-
);
|
|
712
|
-
}
|
|
713
|
-
maybeSynthesizeFieldByValuePath(valuePath) {
|
|
714
|
-
let typePath;
|
|
715
|
-
try {
|
|
716
|
-
typePath = valuePathToTypePath(
|
|
717
|
-
this.type,
|
|
718
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
719
|
-
valuePath,
|
|
720
|
-
true
|
|
721
|
-
);
|
|
722
|
-
} catch (e) {
|
|
723
|
-
return;
|
|
724
|
-
}
|
|
725
|
-
return this.synthesizeFieldByPaths(valuePath, typePath);
|
|
726
|
-
}
|
|
727
|
-
synthesizeFieldByPaths(valuePath, typePath) {
|
|
728
|
-
const adapter2 = this.adapters[typePath];
|
|
729
|
-
if (adapter2 == null) {
|
|
730
|
-
return;
|
|
731
|
-
}
|
|
732
|
-
const {
|
|
733
|
-
convert,
|
|
734
|
-
create
|
|
735
|
-
} = adapter2;
|
|
736
|
-
const fieldOverride = this.fieldOverrides[valuePath];
|
|
737
|
-
const accessor = this.getAccessorForValuePath(valuePath);
|
|
738
|
-
const fieldTypeDef = this.flattenedTypeDefs[typePath];
|
|
739
|
-
const {
|
|
740
|
-
value,
|
|
741
|
-
required,
|
|
742
|
-
readonly
|
|
743
|
-
} = convert(
|
|
744
|
-
accessor != null ? accessor.value : fieldTypeDef != null ? mobxCopy(
|
|
745
|
-
fieldTypeDef,
|
|
746
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
747
|
-
create(valuePath, this.value)
|
|
748
|
-
) : create(valuePath, this.value),
|
|
749
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
750
|
-
valuePath,
|
|
751
|
-
this.value
|
|
752
|
-
);
|
|
753
|
-
const error = this.errors[valuePath];
|
|
754
|
-
return {
|
|
755
|
-
value: fieldOverride != null ? fieldOverride[0] : value,
|
|
756
|
-
error,
|
|
757
|
-
readonly,
|
|
758
|
-
required
|
|
759
|
-
};
|
|
760
|
-
}
|
|
761
|
-
getAccessorForValuePath(valuePath) {
|
|
762
|
-
return this.accessors[valuePath];
|
|
763
|
-
}
|
|
764
|
-
// should only be referenced internally, so loosely typed
|
|
765
|
-
get accessors() {
|
|
766
|
-
return flattenAccessorsOfType(
|
|
767
|
-
this.type,
|
|
768
|
-
this.value,
|
|
769
|
-
(value) => {
|
|
770
|
-
this.value = mobxCopy(this.type, value);
|
|
771
|
-
}
|
|
772
|
-
);
|
|
773
|
-
}
|
|
774
|
-
};
|
|
775
|
-
_init = __decoratorStart(null);
|
|
776
|
-
_value = new WeakMap();
|
|
777
|
-
_fieldOverrides = new WeakMap();
|
|
778
|
-
_errors = new WeakMap();
|
|
779
|
-
__decorateElement(_init, 4, "value", _value_dec, FormModel, _value);
|
|
780
|
-
__decorateElement(_init, 4, "fieldOverrides", _fieldOverrides_dec, FormModel, _fieldOverrides);
|
|
781
|
-
__decorateElement(_init, 4, "errors", _errors_dec, FormModel, _errors);
|
|
782
|
-
__decorateElement(_init, 2, "fields", _fields_dec, FormModel);
|
|
783
|
-
__decorateElement(_init, 2, "knownFields", _knownFields_dec, FormModel);
|
|
784
|
-
__decorateElement(_init, 2, "accessors", _accessors_dec, FormModel);
|
|
785
|
-
__decoratorMetadata(_init, FormModel);
|
|
786
|
-
|
|
787
|
-
// core/mobx/hooks.tsx
|
|
788
|
-
import {
|
|
789
|
-
useCallback,
|
|
790
|
-
useMemo as useMemo2
|
|
791
|
-
} from "react";
|
|
792
|
-
|
|
793
|
-
// util/partial.tsx
|
|
794
|
-
import { observer } from "mobx-react";
|
|
795
|
-
import {
|
|
796
|
-
forwardRef,
|
|
797
|
-
useMemo
|
|
798
|
-
} from "react";
|
|
799
|
-
import { jsx } from "react/jsx-runtime";
|
|
800
|
-
function createSimplePartialComponent(Component, curriedProps) {
|
|
801
|
-
return forwardRef(
|
|
802
|
-
function(exposedProps, ref) {
|
|
803
|
-
const C = Component;
|
|
804
|
-
return /* @__PURE__ */ jsx(
|
|
805
|
-
C,
|
|
806
|
-
__spreadValues(__spreadValues({
|
|
807
|
-
ref
|
|
808
|
-
}, curriedProps), exposedProps)
|
|
809
|
-
);
|
|
810
|
-
}
|
|
811
|
-
);
|
|
812
|
-
}
|
|
813
|
-
function createPartialComponent(Component, curriedPropsSource, additionalPropKeys = []) {
|
|
814
|
-
return forwardRef(
|
|
815
|
-
function(props, ref) {
|
|
816
|
-
const C = Component;
|
|
817
|
-
const [
|
|
818
|
-
additionalProps,
|
|
819
|
-
exposedProps
|
|
820
|
-
] = additionalPropKeys.reduce(
|
|
821
|
-
function([
|
|
822
|
-
additionalProps2,
|
|
823
|
-
exposedProps2
|
|
824
|
-
], key) {
|
|
825
|
-
const value = props[
|
|
826
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
827
|
-
key
|
|
828
|
-
];
|
|
829
|
-
delete exposedProps2[key];
|
|
830
|
-
additionalProps2[key] = value;
|
|
831
|
-
return [
|
|
832
|
-
additionalProps2,
|
|
833
|
-
exposedProps2
|
|
834
|
-
];
|
|
835
|
-
},
|
|
836
|
-
[
|
|
837
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
838
|
-
{},
|
|
839
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
840
|
-
__spreadValues({}, props)
|
|
841
|
-
]
|
|
842
|
-
);
|
|
843
|
-
const curriedProps = curriedPropsSource(additionalProps);
|
|
844
|
-
return /* @__PURE__ */ jsx(
|
|
845
|
-
C,
|
|
846
|
-
__spreadValues(__spreadValues({
|
|
847
|
-
ref
|
|
848
|
-
}, curriedProps), exposedProps)
|
|
849
|
-
);
|
|
850
|
-
}
|
|
851
|
-
);
|
|
852
|
-
}
|
|
853
|
-
function usePartialComponent(curriedPropsSource, deps, Component, additionalPropKeys = []) {
|
|
854
|
-
return useMemo(
|
|
855
|
-
function() {
|
|
856
|
-
return createPartialComponent(
|
|
857
|
-
Component,
|
|
858
|
-
curriedPropsSource,
|
|
859
|
-
additionalPropKeys
|
|
860
|
-
);
|
|
861
|
-
},
|
|
862
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
863
|
-
[
|
|
864
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
865
|
-
...deps,
|
|
866
|
-
Component,
|
|
867
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
868
|
-
...additionalPropKeys
|
|
869
|
-
]
|
|
870
|
-
);
|
|
871
|
-
}
|
|
872
|
-
function createPartialObserverComponent(Component, curriedPropsSource, additionalPropKeys = []) {
|
|
873
|
-
return createUnsafePartialObserverComponent(
|
|
874
|
-
Component,
|
|
875
|
-
curriedPropsSource,
|
|
876
|
-
additionalPropKeys
|
|
877
|
-
);
|
|
878
|
-
}
|
|
879
|
-
function createUnsafePartialObserverComponent(Component, curriedPropsSource, additionalPropKeys = []) {
|
|
880
|
-
return observer(
|
|
881
|
-
forwardRef(
|
|
882
|
-
function(props, ref) {
|
|
883
|
-
const C = Component;
|
|
884
|
-
const [
|
|
885
|
-
additionalProps,
|
|
886
|
-
exposedProps
|
|
887
|
-
] = additionalPropKeys.reduce(
|
|
888
|
-
function([
|
|
889
|
-
additionalProps2,
|
|
890
|
-
exposedProps2
|
|
891
|
-
], key) {
|
|
892
|
-
const value = props[
|
|
893
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
894
|
-
key
|
|
895
|
-
];
|
|
896
|
-
delete exposedProps2[key];
|
|
897
|
-
additionalProps2[key] = value;
|
|
898
|
-
return [
|
|
899
|
-
additionalProps2,
|
|
900
|
-
exposedProps2
|
|
901
|
-
];
|
|
902
|
-
},
|
|
903
|
-
[
|
|
904
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
905
|
-
{},
|
|
906
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
907
|
-
__spreadValues({}, props)
|
|
908
|
-
]
|
|
909
|
-
);
|
|
910
|
-
const curriedProps = curriedPropsSource(additionalProps);
|
|
911
|
-
return /* @__PURE__ */ jsx(
|
|
912
|
-
C,
|
|
913
|
-
__spreadValues(__spreadValues({
|
|
914
|
-
ref
|
|
915
|
-
}, curriedProps), exposedProps)
|
|
916
|
-
);
|
|
703
|
+
switch (conversion.type) {
|
|
704
|
+
case 1 /* Failure */:
|
|
705
|
+
this.errors[valuePath] = conversion.error;
|
|
706
|
+
if (conversion.value != null && accessor != null && dirty) {
|
|
707
|
+
accessor.set(conversion.value[0]);
|
|
708
|
+
}
|
|
709
|
+
return false;
|
|
710
|
+
case 0 /* Success */:
|
|
711
|
+
delete this.errors[valuePath];
|
|
712
|
+
if (accessor != null && dirty) {
|
|
713
|
+
accessor.set(conversion.value);
|
|
714
|
+
}
|
|
715
|
+
return true;
|
|
716
|
+
default:
|
|
717
|
+
throw new UnreachableError2(conversion);
|
|
917
718
|
}
|
|
918
|
-
)
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
719
|
+
});
|
|
720
|
+
}
|
|
721
|
+
validateAll() {
|
|
722
|
+
const accessors = toArray(this.accessors).toSorted(function([a], [b]) {
|
|
723
|
+
return a.length - b.length;
|
|
724
|
+
});
|
|
725
|
+
return runInAction(() => {
|
|
726
|
+
return accessors.reduce(
|
|
727
|
+
(success, [
|
|
728
|
+
valuePath,
|
|
729
|
+
accessor
|
|
730
|
+
]) => {
|
|
731
|
+
const adapterPath = valuePath;
|
|
732
|
+
const adapter2 = this.maybeGetAdapterForValuePath(adapterPath);
|
|
733
|
+
if (adapter2 == null) {
|
|
734
|
+
return success;
|
|
735
|
+
}
|
|
736
|
+
const {
|
|
737
|
+
convert,
|
|
738
|
+
revert
|
|
739
|
+
} = adapter2;
|
|
740
|
+
if (revert == null) {
|
|
741
|
+
return success;
|
|
742
|
+
}
|
|
743
|
+
const fieldOverride = this.fieldOverrides[adapterPath];
|
|
744
|
+
const {
|
|
745
|
+
value: storedValue
|
|
746
|
+
} = convert(accessor.value, valuePath, this.value);
|
|
747
|
+
const value = fieldOverride != null ? fieldOverride[0] : storedValue;
|
|
748
|
+
const dirty = fieldOverride != null && fieldOverride[0] !== storedValue;
|
|
749
|
+
const conversion = revert(value, valuePath, this.value);
|
|
750
|
+
switch (conversion.type) {
|
|
751
|
+
case 1 /* Failure */:
|
|
752
|
+
this.errors[adapterPath] = conversion.error;
|
|
753
|
+
if (conversion.value != null && dirty) {
|
|
754
|
+
accessor.set(conversion.value[0]);
|
|
755
|
+
}
|
|
756
|
+
return false;
|
|
757
|
+
case 0 /* Success */:
|
|
758
|
+
if (dirty) {
|
|
759
|
+
accessor.set(conversion.value);
|
|
760
|
+
}
|
|
761
|
+
delete this.errors[adapterPath];
|
|
762
|
+
return success;
|
|
763
|
+
default:
|
|
764
|
+
throw new UnreachableError2(conversion);
|
|
765
|
+
}
|
|
766
|
+
},
|
|
767
|
+
true
|
|
928
768
|
);
|
|
929
|
-
}
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
769
|
+
});
|
|
770
|
+
}
|
|
771
|
+
};
|
|
772
|
+
_init = __decoratorStart(null);
|
|
773
|
+
_value = new WeakMap();
|
|
774
|
+
_fieldOverrides = new WeakMap();
|
|
775
|
+
_errors = new WeakMap();
|
|
776
|
+
__decorateElement(_init, 4, "value", _value_dec, FormModel, _value);
|
|
777
|
+
__decorateElement(_init, 4, "fieldOverrides", _fieldOverrides_dec, FormModel, _fieldOverrides);
|
|
778
|
+
__decorateElement(_init, 4, "errors", _errors_dec, FormModel, _errors);
|
|
779
|
+
__decorateElement(_init, 2, "fields", _fields_dec, FormModel);
|
|
780
|
+
__decorateElement(_init, 2, "knownFields", _knownFields_dec, FormModel);
|
|
781
|
+
__decorateElement(_init, 2, "accessors", _accessors_dec, FormModel);
|
|
782
|
+
__decoratorMetadata(_init, FormModel);
|
|
940
783
|
|
|
941
784
|
// core/mobx/hooks.tsx
|
|
942
|
-
|
|
785
|
+
import {
|
|
786
|
+
useCallback
|
|
787
|
+
} from "react";
|
|
788
|
+
function useDefaultMobxFormHooks(model, {
|
|
943
789
|
onValidFieldSubmit,
|
|
944
|
-
onValidFormSubmit
|
|
945
|
-
FormFieldsView
|
|
790
|
+
onValidFormSubmit
|
|
946
791
|
} = {}) {
|
|
947
|
-
const model = useMemo2(function() {
|
|
948
|
-
return presenter.createModel(value);
|
|
949
|
-
}, [
|
|
950
|
-
presenter,
|
|
951
|
-
value
|
|
952
|
-
]);
|
|
953
792
|
const onFieldValueChange = useCallback(
|
|
954
|
-
function(path,
|
|
955
|
-
|
|
956
|
-
|
|
793
|
+
function(path, value) {
|
|
794
|
+
model.clearFieldError(path);
|
|
795
|
+
model.setFieldValue(path, value);
|
|
957
796
|
},
|
|
958
|
-
[
|
|
959
|
-
presenter,
|
|
960
|
-
model
|
|
961
|
-
]
|
|
797
|
+
[model]
|
|
962
798
|
);
|
|
963
799
|
const onFieldSubmit = useCallback(
|
|
964
800
|
function(valuePath) {
|
|
965
|
-
if (
|
|
966
|
-
onValidFieldSubmit == null ? void 0 : onValidFieldSubmit(
|
|
801
|
+
if (model.validateField(valuePath)) {
|
|
802
|
+
onValidFieldSubmit == null ? void 0 : onValidFieldSubmit(valuePath);
|
|
967
803
|
}
|
|
968
804
|
return false;
|
|
969
805
|
},
|
|
970
806
|
[
|
|
971
|
-
presenter,
|
|
972
807
|
model,
|
|
973
808
|
onValidFieldSubmit
|
|
974
809
|
]
|
|
@@ -976,55 +811,29 @@ function useDefaultMobxFormHooks(presenter, value, {
|
|
|
976
811
|
const onFieldBlur = useCallback(
|
|
977
812
|
function(path) {
|
|
978
813
|
setTimeout(function() {
|
|
979
|
-
if (
|
|
980
|
-
|
|
814
|
+
if (model.isValuePathActive(path)) {
|
|
815
|
+
model.validateField(path, true);
|
|
981
816
|
}
|
|
982
817
|
}, 100);
|
|
983
818
|
},
|
|
984
|
-
[
|
|
985
|
-
presenter,
|
|
986
|
-
model
|
|
987
|
-
]
|
|
819
|
+
[model]
|
|
988
820
|
);
|
|
989
821
|
const onFormSubmit = useCallback(
|
|
990
822
|
function() {
|
|
991
|
-
if (
|
|
992
|
-
onValidFormSubmit == null ? void 0 : onValidFormSubmit(model
|
|
823
|
+
if (model.validateAll()) {
|
|
824
|
+
onValidFormSubmit == null ? void 0 : onValidFormSubmit(model.value);
|
|
993
825
|
}
|
|
994
826
|
},
|
|
995
827
|
[
|
|
996
|
-
presenter,
|
|
997
828
|
model,
|
|
998
829
|
onValidFormSubmit
|
|
999
830
|
]
|
|
1000
831
|
);
|
|
1001
|
-
const FormFields = useMemo2(() => {
|
|
1002
|
-
if (FormFieldsView == null) {
|
|
1003
|
-
return void 0;
|
|
1004
|
-
}
|
|
1005
|
-
return createUnsafePartialObserverComponent(FormFieldsView, () => {
|
|
1006
|
-
return {
|
|
1007
|
-
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
1008
|
-
fields: model.fields,
|
|
1009
|
-
onFieldBlur,
|
|
1010
|
-
onFieldSubmit,
|
|
1011
|
-
onFieldValueChange
|
|
1012
|
-
};
|
|
1013
|
-
});
|
|
1014
|
-
}, [
|
|
1015
|
-
model,
|
|
1016
|
-
FormFieldsView,
|
|
1017
|
-
onFieldBlur,
|
|
1018
|
-
onFieldSubmit,
|
|
1019
|
-
onFieldValueChange
|
|
1020
|
-
]);
|
|
1021
832
|
return {
|
|
1022
|
-
model,
|
|
1023
833
|
onFieldValueChange,
|
|
1024
834
|
onFieldSubmit,
|
|
1025
835
|
onFieldBlur,
|
|
1026
|
-
onFormSubmit
|
|
1027
|
-
FormFields
|
|
836
|
+
onFormSubmit
|
|
1028
837
|
};
|
|
1029
838
|
}
|
|
1030
839
|
|
|
@@ -1359,8 +1168,156 @@ import {
|
|
|
1359
1168
|
} from "mobx";
|
|
1360
1169
|
import {
|
|
1361
1170
|
useEffect,
|
|
1362
|
-
useMemo as
|
|
1171
|
+
useMemo as useMemo2
|
|
1172
|
+
} from "react";
|
|
1173
|
+
|
|
1174
|
+
// util/partial.tsx
|
|
1175
|
+
import { observer } from "mobx-react";
|
|
1176
|
+
import {
|
|
1177
|
+
forwardRef,
|
|
1178
|
+
useMemo
|
|
1363
1179
|
} from "react";
|
|
1180
|
+
import { jsx } from "react/jsx-runtime";
|
|
1181
|
+
function createSimplePartialComponent(Component, curriedProps) {
|
|
1182
|
+
return forwardRef(
|
|
1183
|
+
function(exposedProps, ref) {
|
|
1184
|
+
const C = Component;
|
|
1185
|
+
return /* @__PURE__ */ jsx(
|
|
1186
|
+
C,
|
|
1187
|
+
__spreadValues(__spreadValues({
|
|
1188
|
+
ref
|
|
1189
|
+
}, curriedProps), exposedProps)
|
|
1190
|
+
);
|
|
1191
|
+
}
|
|
1192
|
+
);
|
|
1193
|
+
}
|
|
1194
|
+
function createPartialComponent(Component, curriedPropsSource, additionalPropKeys = []) {
|
|
1195
|
+
return forwardRef(
|
|
1196
|
+
function(props, ref) {
|
|
1197
|
+
const C = Component;
|
|
1198
|
+
const [
|
|
1199
|
+
additionalProps,
|
|
1200
|
+
exposedProps
|
|
1201
|
+
] = additionalPropKeys.reduce(
|
|
1202
|
+
function([
|
|
1203
|
+
additionalProps2,
|
|
1204
|
+
exposedProps2
|
|
1205
|
+
], key) {
|
|
1206
|
+
const value = props[
|
|
1207
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
1208
|
+
key
|
|
1209
|
+
];
|
|
1210
|
+
delete exposedProps2[key];
|
|
1211
|
+
additionalProps2[key] = value;
|
|
1212
|
+
return [
|
|
1213
|
+
additionalProps2,
|
|
1214
|
+
exposedProps2
|
|
1215
|
+
];
|
|
1216
|
+
},
|
|
1217
|
+
[
|
|
1218
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
1219
|
+
{},
|
|
1220
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
1221
|
+
__spreadValues({}, props)
|
|
1222
|
+
]
|
|
1223
|
+
);
|
|
1224
|
+
const curriedProps = curriedPropsSource(additionalProps);
|
|
1225
|
+
return /* @__PURE__ */ jsx(
|
|
1226
|
+
C,
|
|
1227
|
+
__spreadValues(__spreadValues({
|
|
1228
|
+
ref
|
|
1229
|
+
}, curriedProps), exposedProps)
|
|
1230
|
+
);
|
|
1231
|
+
}
|
|
1232
|
+
);
|
|
1233
|
+
}
|
|
1234
|
+
function usePartialComponent(curriedPropsSource, deps, Component, additionalPropKeys = []) {
|
|
1235
|
+
return useMemo(
|
|
1236
|
+
function() {
|
|
1237
|
+
return createPartialComponent(
|
|
1238
|
+
Component,
|
|
1239
|
+
curriedPropsSource,
|
|
1240
|
+
additionalPropKeys
|
|
1241
|
+
);
|
|
1242
|
+
},
|
|
1243
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1244
|
+
[
|
|
1245
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1246
|
+
...deps,
|
|
1247
|
+
Component,
|
|
1248
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1249
|
+
...additionalPropKeys
|
|
1250
|
+
]
|
|
1251
|
+
);
|
|
1252
|
+
}
|
|
1253
|
+
function createPartialObserverComponent(Component, curriedPropsSource, additionalPropKeys = []) {
|
|
1254
|
+
return createUnsafePartialObserverComponent(
|
|
1255
|
+
Component,
|
|
1256
|
+
curriedPropsSource,
|
|
1257
|
+
additionalPropKeys
|
|
1258
|
+
);
|
|
1259
|
+
}
|
|
1260
|
+
function createUnsafePartialObserverComponent(Component, curriedPropsSource, additionalPropKeys = []) {
|
|
1261
|
+
return observer(
|
|
1262
|
+
forwardRef(
|
|
1263
|
+
function(props, ref) {
|
|
1264
|
+
const C = Component;
|
|
1265
|
+
const [
|
|
1266
|
+
additionalProps,
|
|
1267
|
+
exposedProps
|
|
1268
|
+
] = additionalPropKeys.reduce(
|
|
1269
|
+
function([
|
|
1270
|
+
additionalProps2,
|
|
1271
|
+
exposedProps2
|
|
1272
|
+
], key) {
|
|
1273
|
+
const value = props[
|
|
1274
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
1275
|
+
key
|
|
1276
|
+
];
|
|
1277
|
+
delete exposedProps2[key];
|
|
1278
|
+
additionalProps2[key] = value;
|
|
1279
|
+
return [
|
|
1280
|
+
additionalProps2,
|
|
1281
|
+
exposedProps2
|
|
1282
|
+
];
|
|
1283
|
+
},
|
|
1284
|
+
[
|
|
1285
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
1286
|
+
{},
|
|
1287
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
1288
|
+
__spreadValues({}, props)
|
|
1289
|
+
]
|
|
1290
|
+
);
|
|
1291
|
+
const curriedProps = curriedPropsSource(additionalProps);
|
|
1292
|
+
return /* @__PURE__ */ jsx(
|
|
1293
|
+
C,
|
|
1294
|
+
__spreadValues(__spreadValues({
|
|
1295
|
+
ref
|
|
1296
|
+
}, curriedProps), exposedProps)
|
|
1297
|
+
);
|
|
1298
|
+
}
|
|
1299
|
+
)
|
|
1300
|
+
);
|
|
1301
|
+
}
|
|
1302
|
+
function usePartialObserverComponent(curriedPropsSource, deps, Component, additionalPropKeys = []) {
|
|
1303
|
+
return useMemo(
|
|
1304
|
+
function() {
|
|
1305
|
+
return createPartialObserverComponent(
|
|
1306
|
+
Component,
|
|
1307
|
+
curriedPropsSource,
|
|
1308
|
+
additionalPropKeys
|
|
1309
|
+
);
|
|
1310
|
+
},
|
|
1311
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1312
|
+
[
|
|
1313
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1314
|
+
...deps,
|
|
1315
|
+
Component,
|
|
1316
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1317
|
+
...additionalPropKeys
|
|
1318
|
+
]
|
|
1319
|
+
);
|
|
1320
|
+
}
|
|
1364
1321
|
|
|
1365
1322
|
// mantine/create_checkbox.tsx
|
|
1366
1323
|
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
@@ -1719,7 +1676,7 @@ function useMantineFormFields({
|
|
|
1719
1676
|
onFieldSubmit,
|
|
1720
1677
|
fields
|
|
1721
1678
|
}) {
|
|
1722
|
-
const form =
|
|
1679
|
+
const form = useMemo2(
|
|
1723
1680
|
function() {
|
|
1724
1681
|
return new MantineFormImpl(fields);
|
|
1725
1682
|
},
|
|
@@ -1871,6 +1828,7 @@ var MantineFormImpl = class {
|
|
|
1871
1828
|
this
|
|
1872
1829
|
);
|
|
1873
1830
|
}
|
|
1831
|
+
// TODO have an option to bind to a Text/(value: T) => JSX.Element for viewing form fields
|
|
1874
1832
|
};
|
|
1875
1833
|
_init2 = __decoratorStart(null);
|
|
1876
1834
|
_fields = new WeakMap();
|
|
@@ -1919,7 +1877,6 @@ export {
|
|
|
1919
1877
|
AbstractSelectValueTypeConverter,
|
|
1920
1878
|
DefaultErrorRenderer,
|
|
1921
1879
|
FormModel,
|
|
1922
|
-
FormPresenter,
|
|
1923
1880
|
IntegerToStringConverter,
|
|
1924
1881
|
NullableToBooleanConverter,
|
|
1925
1882
|
SelectDiscriminatedUnionConverter,
|