@stemy/ngx-dynamic-form 19.5.7 → 19.5.8
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.
|
@@ -3,7 +3,7 @@ import { cachedFactory, ReflectUtils, ObjectUtils, LANGUAGE_SERVICE, ForbiddenZo
|
|
|
3
3
|
import { of, merge, Observable, firstValueFrom, BehaviorSubject, combineLatestWith, switchMap, distinctUntilChanged, first, Subject } from 'rxjs';
|
|
4
4
|
import { debounceTime } from 'rxjs/operators';
|
|
5
5
|
import * as i0 from '@angular/core';
|
|
6
|
-
import { Inject, Injectable, input, output, inject, Renderer2, ElementRef, computed, signal, effect,
|
|
6
|
+
import { Inject, Injectable, untracked, input, output, inject, Renderer2, ElementRef, computed, signal, effect, HostListener, HostBinding, Directive, Type, Component, Injector, ChangeDetectionStrategy, ViewEncapsulation, makeEnvironmentProviders, NgModule } from '@angular/core';
|
|
7
7
|
import * as i1 from '@angular/forms';
|
|
8
8
|
import { FormGroup as FormGroup$1, FormArray as FormArray$1, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
9
9
|
import { outputToObservable, toSignal, rxResource } from '@angular/core/rxjs-interop';
|
|
@@ -326,10 +326,6 @@ const MAX_INPUT_NUM = 1999999999;
|
|
|
326
326
|
const EDITOR_FORMATS = ["php", "json", "html", "css", "scss"];
|
|
327
327
|
|
|
328
328
|
class ConfigForSchemaWrap {
|
|
329
|
-
opts;
|
|
330
|
-
mode;
|
|
331
|
-
injector;
|
|
332
|
-
schema;
|
|
333
329
|
get labelPrefix() {
|
|
334
330
|
return this.opts.labelPrefix;
|
|
335
331
|
}
|
|
@@ -342,7 +338,6 @@ class ConfigForSchemaWrap {
|
|
|
342
338
|
get context() {
|
|
343
339
|
return this.opts.context;
|
|
344
340
|
}
|
|
345
|
-
fieldCustomizer;
|
|
346
341
|
constructor(opts, mode, injector, schema) {
|
|
347
342
|
this.opts = opts;
|
|
348
343
|
this.mode = mode;
|
|
@@ -449,11 +444,6 @@ function getFormValidationErrors(controls, parentPath = "") {
|
|
|
449
444
|
}
|
|
450
445
|
|
|
451
446
|
class DynamicFormBuilderService {
|
|
452
|
-
injector;
|
|
453
|
-
events;
|
|
454
|
-
api;
|
|
455
|
-
languages;
|
|
456
|
-
language;
|
|
457
447
|
constructor(injector, events, api, languages) {
|
|
458
448
|
this.injector = injector;
|
|
459
449
|
this.events = events;
|
|
@@ -729,9 +719,11 @@ class DynamicFormBuilderService {
|
|
|
729
719
|
label: options.labelCustomizer?.(key, data.label, parent, options.labelPrefix)
|
|
730
720
|
?? this.getLabel(key, data.label, parent, options),
|
|
731
721
|
hideLabel: data.hideLabel === true,
|
|
722
|
+
hideRequiredMarker: data.hideRequiredMarker === true,
|
|
732
723
|
formCheck: "nolabel",
|
|
733
724
|
labelPosition: "before",
|
|
734
725
|
additional: {
|
|
726
|
+
...(data.additional || {}),
|
|
735
727
|
classes: data.classes || []
|
|
736
728
|
}
|
|
737
729
|
},
|
|
@@ -811,8 +803,8 @@ class DynamicFormBuilderService {
|
|
|
811
803
|
}
|
|
812
804
|
});
|
|
813
805
|
}
|
|
814
|
-
static
|
|
815
|
-
static
|
|
806
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormBuilderService, deps: [{ token: i0.Injector }, { token: i2.EventsService }, { token: API_SERVICE }, { token: LANGUAGE_SERVICE }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
807
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormBuilderService }); }
|
|
816
808
|
}
|
|
817
809
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormBuilderService, decorators: [{
|
|
818
810
|
type: Injectable
|
|
@@ -825,9 +817,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
825
817
|
}] }] });
|
|
826
818
|
|
|
827
819
|
class DynamicFormSchemaService {
|
|
828
|
-
openApi;
|
|
829
|
-
injector;
|
|
830
|
-
builder;
|
|
831
820
|
get api() {
|
|
832
821
|
return this.openApi.api;
|
|
833
822
|
}
|
|
@@ -1180,18 +1169,14 @@ class DynamicFormSchemaService {
|
|
|
1180
1169
|
validators.itemsMaxValue = maxValueValidation(items.maximum, true);
|
|
1181
1170
|
}
|
|
1182
1171
|
}
|
|
1183
|
-
static
|
|
1184
|
-
static
|
|
1172
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormSchemaService, deps: [{ token: i2.OpenApiService }, { token: i0.Injector }, { token: DynamicFormBuilderService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1173
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormSchemaService }); }
|
|
1185
1174
|
}
|
|
1186
1175
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormSchemaService, decorators: [{
|
|
1187
1176
|
type: Injectable
|
|
1188
1177
|
}], ctorParameters: () => [{ type: i2.OpenApiService }, { type: i0.Injector }, { type: DynamicFormBuilderService }] });
|
|
1189
1178
|
|
|
1190
1179
|
class DynamicFormService {
|
|
1191
|
-
fs;
|
|
1192
|
-
fb;
|
|
1193
|
-
injector;
|
|
1194
|
-
api;
|
|
1195
1180
|
constructor(fs, fb, injector, api) {
|
|
1196
1181
|
this.fs = fs;
|
|
1197
1182
|
this.fb = fb;
|
|
@@ -1268,7 +1253,7 @@ class DynamicFormService {
|
|
|
1268
1253
|
});
|
|
1269
1254
|
}
|
|
1270
1255
|
async serializeForm(form, validate = true) {
|
|
1271
|
-
const fields = form.config();
|
|
1256
|
+
const fields = untracked(() => form.config());
|
|
1272
1257
|
if (!fields)
|
|
1273
1258
|
return null;
|
|
1274
1259
|
if (validate) {
|
|
@@ -1323,8 +1308,8 @@ class DynamicFormService {
|
|
|
1323
1308
|
}
|
|
1324
1309
|
});
|
|
1325
1310
|
}
|
|
1326
|
-
static
|
|
1327
|
-
static
|
|
1311
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormService, deps: [{ token: DynamicFormSchemaService }, { token: DynamicFormBuilderService }, { token: i0.Injector }, { token: API_SERVICE }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1312
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormService }); }
|
|
1328
1313
|
}
|
|
1329
1314
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormService, decorators: [{
|
|
1330
1315
|
type: Injectable
|
|
@@ -1334,25 +1319,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1334
1319
|
}] }] });
|
|
1335
1320
|
|
|
1336
1321
|
class AsyncSubmitDirective {
|
|
1337
|
-
method = input(null, { alias: "async-submit" });
|
|
1338
|
-
mode = input("click");
|
|
1339
|
-
form = input();
|
|
1340
|
-
context = input();
|
|
1341
|
-
onSuccess = output();
|
|
1342
|
-
onError = output();
|
|
1343
|
-
toaster = inject(TOASTER_SERVICE);
|
|
1344
|
-
renderer = inject(Renderer2);
|
|
1345
|
-
elem = inject(ElementRef);
|
|
1346
|
-
status = computed(() => {
|
|
1347
|
-
const form = this.form();
|
|
1348
|
-
return form?.status() || null;
|
|
1349
|
-
});
|
|
1350
|
-
group = computed(() => {
|
|
1351
|
-
const form = this.form();
|
|
1352
|
-
return form?.group() || null;
|
|
1353
|
-
});
|
|
1354
|
-
loading = signal(false);
|
|
1355
|
-
callback = signal(null);
|
|
1356
1322
|
get isDisabled() {
|
|
1357
1323
|
return this.status() !== "VALID";
|
|
1358
1324
|
}
|
|
@@ -1360,6 +1326,25 @@ class AsyncSubmitDirective {
|
|
|
1360
1326
|
return this.loading();
|
|
1361
1327
|
}
|
|
1362
1328
|
constructor() {
|
|
1329
|
+
this.method = input(null, { alias: "async-submit" });
|
|
1330
|
+
this.mode = input("click");
|
|
1331
|
+
this.form = input();
|
|
1332
|
+
this.context = input();
|
|
1333
|
+
this.onSuccess = output();
|
|
1334
|
+
this.onError = output();
|
|
1335
|
+
this.toaster = inject(TOASTER_SERVICE);
|
|
1336
|
+
this.renderer = inject(Renderer2);
|
|
1337
|
+
this.elem = inject(ElementRef);
|
|
1338
|
+
this.status = computed(() => {
|
|
1339
|
+
const form = this.form();
|
|
1340
|
+
return form?.status() || null;
|
|
1341
|
+
});
|
|
1342
|
+
this.group = computed(() => {
|
|
1343
|
+
const form = this.form();
|
|
1344
|
+
return form?.group() || null;
|
|
1345
|
+
});
|
|
1346
|
+
this.loading = signal(false);
|
|
1347
|
+
this.callback = signal(null);
|
|
1363
1348
|
if (this.elem.nativeElement.tagName === "BUTTON") {
|
|
1364
1349
|
this.renderer.setAttribute(this.elem.nativeElement, "type", "button");
|
|
1365
1350
|
}
|
|
@@ -1414,8 +1399,8 @@ class AsyncSubmitDirective {
|
|
|
1414
1399
|
this.toaster.error(reason.message, reason.context);
|
|
1415
1400
|
});
|
|
1416
1401
|
}
|
|
1417
|
-
static
|
|
1418
|
-
static
|
|
1402
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AsyncSubmitDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1403
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.14", type: AsyncSubmitDirective, isStandalone: false, selector: "[async-submit]", inputs: { method: { classPropertyName: "method", publicName: "async-submit", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSuccess: "onSuccess", onError: "onError" }, host: { listeners: { "click": "click()" }, properties: { "class.disabled": "this.isDisabled", "class.loading": "this.isLoading" } }, exportAs: ["async-submit"], ngImport: i0 }); }
|
|
1419
1404
|
}
|
|
1420
1405
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AsyncSubmitDirective, decorators: [{
|
|
1421
1406
|
type: Directive,
|
|
@@ -1436,9 +1421,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1436
1421
|
}] } });
|
|
1437
1422
|
|
|
1438
1423
|
class DynamicFieldType extends FieldType {
|
|
1439
|
-
|
|
1440
|
-
|
|
1441
|
-
|
|
1424
|
+
constructor() {
|
|
1425
|
+
super(...arguments);
|
|
1426
|
+
this.stateChanges = new Subject();
|
|
1427
|
+
this._errorState = false;
|
|
1428
|
+
this._focused = false;
|
|
1429
|
+
}
|
|
1442
1430
|
ngOnDestroy() {
|
|
1443
1431
|
delete this.formField?._control;
|
|
1444
1432
|
this.stateChanges.complete();
|
|
@@ -1525,8 +1513,8 @@ class DynamicFieldType extends FieldType {
|
|
|
1525
1513
|
};
|
|
1526
1514
|
}
|
|
1527
1515
|
}
|
|
1528
|
-
static
|
|
1529
|
-
static
|
|
1516
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFieldType, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1517
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFieldType, isStandalone: false, selector: "dynamic-field-type", usesInheritance: true, ngImport: i0, template: "", isInline: true }); }
|
|
1530
1518
|
}
|
|
1531
1519
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFieldType, decorators: [{
|
|
1532
1520
|
type: Component,
|
|
@@ -1538,55 +1526,58 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1538
1526
|
}] });
|
|
1539
1527
|
|
|
1540
1528
|
class DynamicFormComponent {
|
|
1541
|
-
builder = inject(DynamicFormBuilderService);
|
|
1542
|
-
events = inject(EventsService);
|
|
1543
|
-
languages = inject(LANGUAGE_SERVICE);
|
|
1544
|
-
labelPrefix = input("label");
|
|
1545
|
-
labelCustomizer = input(null);
|
|
1546
|
-
testId = input("");
|
|
1547
|
-
useTabs = input(false);
|
|
1548
|
-
data = input({});
|
|
1549
|
-
fields = input(null);
|
|
1550
|
-
fieldChanges = new Subject();
|
|
1551
|
-
language = toSignal(this.events.languageChanged, {
|
|
1552
|
-
initialValue: this.languages.currentLanguage
|
|
1553
|
-
});
|
|
1554
|
-
enableTranslations = toSignal(this.events.translationsEnabled, {
|
|
1555
|
-
initialValue: this.languages.enableTranslations
|
|
1556
|
-
});
|
|
1557
|
-
config = computed(() => {
|
|
1558
|
-
const options = {
|
|
1559
|
-
labelPrefix: this.labelPrefix(),
|
|
1560
|
-
labelCustomizer: this.labelCustomizer(),
|
|
1561
|
-
testId: this.testId(),
|
|
1562
|
-
};
|
|
1563
|
-
const fields = this.fields() || this.builder.resolveFormFields(this.data()?.constructor, null, options);
|
|
1564
|
-
return [
|
|
1565
|
-
this.builder.createFormGroup(null, () => fields, {
|
|
1566
|
-
label: "",
|
|
1567
|
-
useTabs: this.useTabs(),
|
|
1568
|
-
hidden: false
|
|
1569
|
-
}, null, options)
|
|
1570
|
-
];
|
|
1571
|
-
});
|
|
1572
|
-
group = computed(() => {
|
|
1573
|
-
this.config();
|
|
1574
|
-
return new FormGroup$1({});
|
|
1575
|
-
});
|
|
1576
|
-
status$ = rxResource({
|
|
1577
|
-
request: () => this.group(),
|
|
1578
|
-
loader: p => p.request.statusChanges,
|
|
1579
|
-
defaultValue: "PENDING"
|
|
1580
|
-
});
|
|
1581
|
-
status = computed(() => this.status$.value());
|
|
1582
|
-
onSubmit = output();
|
|
1583
|
-
options = {
|
|
1584
|
-
fieldChanges: this.fieldChanges,
|
|
1585
|
-
formState: {
|
|
1586
|
-
injector: inject(Injector)
|
|
1587
|
-
}
|
|
1588
|
-
};
|
|
1589
1529
|
constructor() {
|
|
1530
|
+
this.builder = inject(DynamicFormBuilderService);
|
|
1531
|
+
this.events = inject(EventsService);
|
|
1532
|
+
this.languages = inject(LANGUAGE_SERVICE);
|
|
1533
|
+
this.labelPrefix = input("label");
|
|
1534
|
+
this.labelCustomizer = input(null);
|
|
1535
|
+
this.testId = input("");
|
|
1536
|
+
this.useTabs = input(false);
|
|
1537
|
+
this.data = input({});
|
|
1538
|
+
this.fields = input(null);
|
|
1539
|
+
this.fieldChanges = new Subject();
|
|
1540
|
+
this.language = toSignal(this.events.languageChanged, {
|
|
1541
|
+
initialValue: this.languages.currentLanguage
|
|
1542
|
+
});
|
|
1543
|
+
this.enableTranslations = toSignal(this.events.translationsEnabled, {
|
|
1544
|
+
initialValue: this.languages.enableTranslations
|
|
1545
|
+
});
|
|
1546
|
+
this.config = computed(() => {
|
|
1547
|
+
const options = {
|
|
1548
|
+
labelPrefix: this.labelPrefix(),
|
|
1549
|
+
labelCustomizer: this.labelCustomizer(),
|
|
1550
|
+
testId: this.testId(),
|
|
1551
|
+
};
|
|
1552
|
+
const fields = this.fields() || this.builder.resolveFormFields(this.data()?.constructor, null, options);
|
|
1553
|
+
return [
|
|
1554
|
+
this.builder.createFormGroup(null, () => fields, {
|
|
1555
|
+
label: "",
|
|
1556
|
+
useTabs: this.useTabs(),
|
|
1557
|
+
hidden: false,
|
|
1558
|
+
additional: {
|
|
1559
|
+
className: "dynamic-form-root-group"
|
|
1560
|
+
}
|
|
1561
|
+
}, null, options)
|
|
1562
|
+
];
|
|
1563
|
+
});
|
|
1564
|
+
this.group = computed(() => {
|
|
1565
|
+
this.config();
|
|
1566
|
+
return new FormGroup$1({});
|
|
1567
|
+
});
|
|
1568
|
+
this.status$ = rxResource({
|
|
1569
|
+
request: () => this.group(),
|
|
1570
|
+
loader: p => p.request.statusChanges,
|
|
1571
|
+
defaultValue: "PENDING"
|
|
1572
|
+
});
|
|
1573
|
+
this.status = computed(() => this.status$.value());
|
|
1574
|
+
this.onSubmit = output();
|
|
1575
|
+
this.options = {
|
|
1576
|
+
fieldChanges: this.fieldChanges,
|
|
1577
|
+
formState: {
|
|
1578
|
+
injector: inject(Injector)
|
|
1579
|
+
}
|
|
1580
|
+
};
|
|
1590
1581
|
effect(() => {
|
|
1591
1582
|
this.language();
|
|
1592
1583
|
this.enableTranslations();
|
|
@@ -1603,8 +1594,8 @@ class DynamicFormComponent {
|
|
|
1603
1594
|
reset() {
|
|
1604
1595
|
this.options?.resetModel?.();
|
|
1605
1596
|
}
|
|
1606
|
-
static
|
|
1607
|
-
static
|
|
1597
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1598
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormComponent, isStandalone: false, selector: "dynamic-form", inputs: { labelPrefix: { classPropertyName: "labelPrefix", publicName: "labelPrefix", isSignal: true, isRequired: false, transformFunction: null }, labelCustomizer: { classPropertyName: "labelCustomizer", publicName: "labelCustomizer", isSignal: true, isRequired: false, transformFunction: null }, testId: { classPropertyName: "testId", publicName: "testId", isSignal: true, isRequired: false, transformFunction: null }, useTabs: { classPropertyName: "useTabs", publicName: "useTabs", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit" }, ngImport: i0, template: "@if (config() && group()) {\n <form [formGroup]=\"group()\" (ngSubmit)=\"submit()\" autocomplete=\"off\" role=\"presentation\">\n <input type=\"submit\" [hidden]=\"true\" />\n <formly-form [model]=\"data()\"\n [fields]=\"config()\"\n [form]=\"group()\"\n [options]=\"options\"></formly-form>\n <ng-content></ng-content>\n </form>\n}\n", styles: [".dynamic-form-field.dynamic-form-hidden{display:none}\n"], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.LegacyFormlyForm, selector: "formly-form" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1608
1599
|
}
|
|
1609
1600
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormComponent, decorators: [{
|
|
1610
1601
|
type: Component,
|
|
@@ -1612,7 +1603,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1612
1603
|
}], ctorParameters: () => [] });
|
|
1613
1604
|
|
|
1614
1605
|
class DynamicFormArrayComponent extends FieldArrayType {
|
|
1615
|
-
|
|
1606
|
+
constructor() {
|
|
1607
|
+
super(...arguments);
|
|
1608
|
+
this.currentTab = signal(0);
|
|
1609
|
+
}
|
|
1616
1610
|
clearItems() {
|
|
1617
1611
|
const control = this.formControl;
|
|
1618
1612
|
while (control.length > 0) {
|
|
@@ -1630,8 +1624,8 @@ class DynamicFormArrayComponent extends FieldArrayType {
|
|
|
1630
1624
|
const length = this.field.fieldGroup.length;
|
|
1631
1625
|
this.currentTab.set(Math.min(this.currentTab(), length - 1));
|
|
1632
1626
|
}
|
|
1633
|
-
static
|
|
1634
|
-
static
|
|
1627
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormArrayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1628
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormArrayComponent, isStandalone: false, selector: "dynamic-form-array", usesInheritance: true, ngImport: i0, template: "@if (field.display) {\n @if (props.label && props.hideLabel !== true) {\n <label class=\"field-label\">\n {{ props.label | translate }}\n <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n </label>\n }\n <div class=\"field-container\">\n <tabs class=\"form-array-items\" [(value)]=\"currentTab\">\n @for (itemField of field.fieldGroup; track itemField.key; let ix = $index) {\n <ng-template #fieldContent>\n <div class=\"form-array-buttons\">\n @if (itemField.removeItem) {\n <btn icon=\"trash\" (click)=\"removeItem(ix)\"></btn>\n }\n @if (itemField.insertItem) {\n <btn icon=\"plus\" (click)=\"addItem(ix)\"></btn>\n }\n </div>\n <formly-field [field]=\"itemField\"></formly-field>\n </ng-template>\n @if (props.useTabs) {\n <div class=\"form-array-item\"\n [tabsItem]=\"ix\"\n [label]=\"(itemField.formControl.value | getValue : props.tabsLabel) || ix + 1\">\n <ng-container [ngTemplateOutlet]=\"fieldContent\"></ng-container>\n </div>\n } @else {\n <div class=\"form-array-item\">\n <ng-container [ngTemplateOutlet]=\"fieldContent\"></ng-container>\n </div>\n }\n }\n </tabs>\n\n <div class=\"form-array-buttons\">\n @if (props.clearItems) {\n <btn icon=\"trash\" label=\"button.clear-items\" (click)=\"clearItems()\"></btn>\n }\n @if (props.addItem) {\n <btn icon=\"plus\" label=\"button.insert-item\" (click)=\"addItem()\"></btn>\n }\n </div>\n </div>\n}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.TabsItemDirective, selector: "[tabsItem]", inputs: ["tabsItem", "label", "tooltip", "icon", "disabled", "classes"] }, { kind: "component", type: i2.BtnComponent, selector: "btn", inputs: ["label", "tooltip", "icon", "disabled", "type", "size"] }, { kind: "component", type: i2.TabsComponent, selector: "tabs", inputs: ["value", "options", "type", "size"], outputs: ["valueChange"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.GetValuePipe, name: "getValue" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1635
1629
|
}
|
|
1636
1630
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormArrayComponent, decorators: [{
|
|
1637
1631
|
type: Component,
|
|
@@ -1639,8 +1633,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1639
1633
|
}] });
|
|
1640
1634
|
|
|
1641
1635
|
class DynamicFormChipsComponent extends DynamicFieldType {
|
|
1642
|
-
static
|
|
1643
|
-
static
|
|
1636
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormChipsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1637
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFormChipsComponent, isStandalone: false, selector: "dynamic-form-chips", usesInheritance: true, ngImport: i0, template: "<chips [formControl]=\"formControl\"\n [type]=\"props.type\"\n [step]=\"props.step\"\n [minLength]=\"props.minLength\"\n [maxLength]=\"props.maxLength\"\n [min]=\"props.min\"\n [max]=\"props.max\"\n [multiple]=\"props.multiple\"\n [formlyAttributes]=\"field\">\n</chips>\n", dependencies: [{ kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2.ChipsComponent, selector: "chips", inputs: ["value", "multiple", "disabled", "type", "min", "max", "minLength", "maxLength", "step", "placeholder", "unique", "options"], outputs: ["valueChange"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1644
1638
|
}
|
|
1645
1639
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormChipsComponent, decorators: [{
|
|
1646
1640
|
type: Component,
|
|
@@ -1648,8 +1642,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1648
1642
|
}] });
|
|
1649
1643
|
|
|
1650
1644
|
class DynamicFormFieldComponent extends FieldWrapper {
|
|
1651
|
-
static
|
|
1652
|
-
static
|
|
1645
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1646
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormFieldComponent, isStandalone: false, selector: "dynamic-form-field", usesInheritance: true, ngImport: i0, template: "@if (props.label && props.hideLabel !== true) {\n <label class=\"field-label\" [for]=\"id\">\n {{ props.label | translate }}\n <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n @if (props.required && props.hideRequiredMarker !== true) {\n <span class=\"field-required\" aria-hidden=\"true\">*</span>\n }\n </label>\n}\n<div class=\"field-container\">\n <ng-container #fieldComponent></ng-container>\n <div *ngIf=\"showError\" class=\"field-errors invalid-feedback\">\n <formly-validation-message\n [field]=\"field\"\n id=\"{{ id }}-formly-validation-error\"\n role=\"alert\"\n ></formly-validation-message>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1653
1647
|
}
|
|
1654
1648
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldComponent, decorators: [{
|
|
1655
1649
|
type: Component,
|
|
@@ -1657,8 +1651,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1657
1651
|
}] });
|
|
1658
1652
|
|
|
1659
1653
|
class DynamicFormFieldsetComponent extends FieldWrapper {
|
|
1660
|
-
static
|
|
1661
|
-
static
|
|
1654
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldsetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1655
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormFieldsetComponent, isStandalone: false, selector: "dynamic-form-fieldset", usesInheritance: true, ngImport: i0, template: "@if (field.display) {\n <legend class=\"field-legend\" *ngIf=\"props.label && !field.parent.props.useTabs\">\n {{ props.label | translate }}\n </legend>\n <div class=\"field-container\">\n @for (itemField of field.fieldGroup; track itemField) {\n @if (itemField.display) {\n <formly-field [field]=\"itemField\"></formly-field>\n }\n }\n </div>\n}\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1662
1656
|
}
|
|
1663
1657
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldsetComponent, decorators: [{
|
|
1664
1658
|
type: Component,
|
|
@@ -1666,8 +1660,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1666
1660
|
}] });
|
|
1667
1661
|
|
|
1668
1662
|
class DynamicFormGroupComponent extends FieldWrapper {
|
|
1669
|
-
static
|
|
1670
|
-
static
|
|
1663
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1664
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DynamicFormGroupComponent, isStandalone: false, selector: "dynamic-form-group", usesInheritance: true, ngImport: i0, template: "@if (field.display) {\n @if (props.label && props.hideLabel !== true) {\n <label class=\"field-label\">\n {{ props.label | translate }}\n <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n </label>\n }\n <tabs class=\"field-container\">\n @for (itemField of field.fieldGroup; track itemField; let ix = $index) {\n @if (itemField.display) {\n @if (props.useTabs && itemField.wrappers | includes: 'form-fieldset') {\n <div class=\"form-fieldset-item\"\n [tabsItem]=\"ix\"\n [classes]=\"['form-fieldset-tab', itemField.valid ? 'valid' : 'invalid']\"\n [label]=\"itemField.props.label\">\n <formly-field [field]=\"itemField\"></formly-field>\n </div>\n } @else {\n <formly-field [field]=\"itemField\"></formly-field>\n }\n }\n }\n </tabs>\n}\n", styles: [".form-fieldset-item.hidden-tab{display:none}.form-fieldset-tab{position:relative;--invalid-bg: rgba(184, 38, 38, 1);--invalid-border: rgba(184, 38, 38, .6);--invalid-color: #ececec;--invalid-box-size: 15px;--invalid-box-pull: -3px}.form-fieldset-tab.invalid>btn .async-target{border:1px solid var(--invalid-border)}.form-fieldset-tab.invalid:after{background:var(--invalid-bg);color:var(--invalid-color);font-size:10px;line-height:var(--invalid-box-size);width:var(--invalid-box-size);height:var(--invalid-box-size);text-align:center;border-radius:5px;content:\"!\";display:block;position:absolute;top:var(--invalid-box-pull);right:var(--invalid-box-pull)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.TabsItemDirective, selector: "[tabsItem]", inputs: ["tabsItem", "label", "tooltip", "icon", "disabled", "classes"] }, { kind: "component", type: i2.TabsComponent, selector: "tabs", inputs: ["value", "options", "type", "size"], outputs: ["valueChange"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "pipe", type: i2.IncludesPipe, name: "includes" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1671
1665
|
}
|
|
1672
1666
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormGroupComponent, decorators: [{
|
|
1673
1667
|
type: Component,
|
|
@@ -1675,8 +1669,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1675
1669
|
}] });
|
|
1676
1670
|
|
|
1677
1671
|
class DynamicFormUploadComponent extends DynamicFieldType {
|
|
1678
|
-
static
|
|
1679
|
-
static
|
|
1672
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormUploadComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1673
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DynamicFormUploadComponent, isStandalone: false, selector: "dynamic-form-upload", usesInheritance: true, ngImport: i0, template: "<upload [formControl]=\"formControl\"\n [multiple]=\"props.multiple\"\n [inline]=\"props.inline\"\n [accept]=\"props.accept\"\n [baseUrl]=\"props.url\"\n [makeUpload]=\"props.createUploadData\"\n [formlyAttributes]=\"field\">\n</upload>\n", dependencies: [{ kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2.UploadComponent, selector: "upload", inputs: ["value", "disabled", "inline", "accept", "baseUrl", "message", "multiple", "buttonText", "makeUpload", "preProcess"], outputs: ["onUploaded", "onRemove"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1680
1674
|
}
|
|
1681
1675
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormUploadComponent, decorators: [{
|
|
1682
1676
|
type: Component,
|
|
@@ -1736,16 +1730,16 @@ class NgxDynamicFormModule {
|
|
|
1736
1730
|
static provideForms(config) {
|
|
1737
1731
|
return makeEnvironmentProviders(NgxDynamicFormModule.getProviders(config));
|
|
1738
1732
|
}
|
|
1739
|
-
static
|
|
1740
|
-
static
|
|
1733
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1734
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, declarations: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, DynamicFormUploadComponent, AsyncSubmitDirective], imports: [CommonModule,
|
|
1741
1735
|
FormsModule,
|
|
1742
1736
|
ReactiveFormsModule,
|
|
1743
1737
|
NgxUtilsModule,
|
|
1744
1738
|
FormlyModule], exports: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, DynamicFormUploadComponent, AsyncSubmitDirective, FormsModule,
|
|
1745
1739
|
ReactiveFormsModule,
|
|
1746
1740
|
NgxUtilsModule,
|
|
1747
|
-
FormlyModule] });
|
|
1748
|
-
static
|
|
1741
|
+
FormlyModule] }); }
|
|
1742
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, providers: [
|
|
1749
1743
|
...pipes
|
|
1750
1744
|
], imports: [CommonModule,
|
|
1751
1745
|
FormsModule,
|
|
@@ -1754,7 +1748,7 @@ class NgxDynamicFormModule {
|
|
|
1754
1748
|
FormlyModule, FormsModule,
|
|
1755
1749
|
ReactiveFormsModule,
|
|
1756
1750
|
NgxUtilsModule,
|
|
1757
|
-
FormlyModule] });
|
|
1751
|
+
FormlyModule] }); }
|
|
1758
1752
|
}
|
|
1759
1753
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, decorators: [{
|
|
1760
1754
|
type: NgModule,
|