@stemy/ngx-dynamic-form 19.5.8 → 19.5.9
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.
|
@@ -319,13 +319,17 @@ function additionalFieldValue(field, path) {
|
|
|
319
319
|
}
|
|
320
320
|
function additionalFieldValues(field, values) {
|
|
321
321
|
const additional = field.props?.additional || {};
|
|
322
|
-
setFieldProp(field, "additional", additional);
|
|
322
|
+
setFieldProp(field, "additional", ObjectUtils.assign(additional, values || {}));
|
|
323
323
|
}
|
|
324
324
|
const MIN_INPUT_NUM = -1999999999;
|
|
325
325
|
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;
|
|
329
333
|
get labelPrefix() {
|
|
330
334
|
return this.opts.labelPrefix;
|
|
331
335
|
}
|
|
@@ -338,6 +342,7 @@ class ConfigForSchemaWrap {
|
|
|
338
342
|
get context() {
|
|
339
343
|
return this.opts.context;
|
|
340
344
|
}
|
|
345
|
+
fieldCustomizer;
|
|
341
346
|
constructor(opts, mode, injector, schema) {
|
|
342
347
|
this.opts = opts;
|
|
343
348
|
this.mode = mode;
|
|
@@ -444,6 +449,11 @@ function getFormValidationErrors(controls, parentPath = "") {
|
|
|
444
449
|
}
|
|
445
450
|
|
|
446
451
|
class DynamicFormBuilderService {
|
|
452
|
+
injector;
|
|
453
|
+
events;
|
|
454
|
+
api;
|
|
455
|
+
languages;
|
|
456
|
+
language;
|
|
447
457
|
constructor(injector, events, api, languages) {
|
|
448
458
|
this.injector = injector;
|
|
449
459
|
this.events = events;
|
|
@@ -730,7 +740,6 @@ class DynamicFormBuilderService {
|
|
|
730
740
|
modelOptions: {
|
|
731
741
|
updateOn: "change"
|
|
732
742
|
},
|
|
733
|
-
fieldGroupClassName: "field-container",
|
|
734
743
|
hooks: {},
|
|
735
744
|
expressions: {
|
|
736
745
|
serializer: () => data.serializer,
|
|
@@ -803,8 +812,8 @@ class DynamicFormBuilderService {
|
|
|
803
812
|
}
|
|
804
813
|
});
|
|
805
814
|
}
|
|
806
|
-
static
|
|
807
|
-
static
|
|
815
|
+
static ɵ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 });
|
|
816
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormBuilderService });
|
|
808
817
|
}
|
|
809
818
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormBuilderService, decorators: [{
|
|
810
819
|
type: Injectable
|
|
@@ -817,6 +826,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
817
826
|
}] }] });
|
|
818
827
|
|
|
819
828
|
class DynamicFormSchemaService {
|
|
829
|
+
openApi;
|
|
830
|
+
injector;
|
|
831
|
+
builder;
|
|
820
832
|
get api() {
|
|
821
833
|
return this.openApi.api;
|
|
822
834
|
}
|
|
@@ -1169,14 +1181,18 @@ class DynamicFormSchemaService {
|
|
|
1169
1181
|
validators.itemsMaxValue = maxValueValidation(items.maximum, true);
|
|
1170
1182
|
}
|
|
1171
1183
|
}
|
|
1172
|
-
static
|
|
1173
|
-
static
|
|
1184
|
+
static ɵ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 });
|
|
1185
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormSchemaService });
|
|
1174
1186
|
}
|
|
1175
1187
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormSchemaService, decorators: [{
|
|
1176
1188
|
type: Injectable
|
|
1177
1189
|
}], ctorParameters: () => [{ type: i2.OpenApiService }, { type: i0.Injector }, { type: DynamicFormBuilderService }] });
|
|
1178
1190
|
|
|
1179
1191
|
class DynamicFormService {
|
|
1192
|
+
fs;
|
|
1193
|
+
fb;
|
|
1194
|
+
injector;
|
|
1195
|
+
api;
|
|
1180
1196
|
constructor(fs, fb, injector, api) {
|
|
1181
1197
|
this.fs = fs;
|
|
1182
1198
|
this.fb = fb;
|
|
@@ -1308,8 +1324,8 @@ class DynamicFormService {
|
|
|
1308
1324
|
}
|
|
1309
1325
|
});
|
|
1310
1326
|
}
|
|
1311
|
-
static
|
|
1312
|
-
static
|
|
1327
|
+
static ɵ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 });
|
|
1328
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormService });
|
|
1313
1329
|
}
|
|
1314
1330
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormService, decorators: [{
|
|
1315
1331
|
type: Injectable
|
|
@@ -1319,6 +1335,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1319
1335
|
}] }] });
|
|
1320
1336
|
|
|
1321
1337
|
class AsyncSubmitDirective {
|
|
1338
|
+
method = input(null, { alias: "async-submit" });
|
|
1339
|
+
mode = input("click");
|
|
1340
|
+
form = input();
|
|
1341
|
+
context = input();
|
|
1342
|
+
onSuccess = output();
|
|
1343
|
+
onError = output();
|
|
1344
|
+
toaster = inject(TOASTER_SERVICE);
|
|
1345
|
+
renderer = inject(Renderer2);
|
|
1346
|
+
elem = inject(ElementRef);
|
|
1347
|
+
status = computed(() => {
|
|
1348
|
+
const form = this.form();
|
|
1349
|
+
return form?.status() || null;
|
|
1350
|
+
});
|
|
1351
|
+
group = computed(() => {
|
|
1352
|
+
const form = this.form();
|
|
1353
|
+
return form?.group() || null;
|
|
1354
|
+
});
|
|
1355
|
+
loading = signal(false);
|
|
1356
|
+
callback = signal(null);
|
|
1322
1357
|
get isDisabled() {
|
|
1323
1358
|
return this.status() !== "VALID";
|
|
1324
1359
|
}
|
|
@@ -1326,25 +1361,6 @@ class AsyncSubmitDirective {
|
|
|
1326
1361
|
return this.loading();
|
|
1327
1362
|
}
|
|
1328
1363
|
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);
|
|
1348
1364
|
if (this.elem.nativeElement.tagName === "BUTTON") {
|
|
1349
1365
|
this.renderer.setAttribute(this.elem.nativeElement, "type", "button");
|
|
1350
1366
|
}
|
|
@@ -1399,8 +1415,8 @@ class AsyncSubmitDirective {
|
|
|
1399
1415
|
this.toaster.error(reason.message, reason.context);
|
|
1400
1416
|
});
|
|
1401
1417
|
}
|
|
1402
|
-
static
|
|
1403
|
-
static
|
|
1418
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AsyncSubmitDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
1419
|
+
static ɵ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 });
|
|
1404
1420
|
}
|
|
1405
1421
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AsyncSubmitDirective, decorators: [{
|
|
1406
1422
|
type: Directive,
|
|
@@ -1421,12 +1437,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1421
1437
|
}] } });
|
|
1422
1438
|
|
|
1423
1439
|
class DynamicFieldType extends FieldType {
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
this._errorState = false;
|
|
1428
|
-
this._focused = false;
|
|
1429
|
-
}
|
|
1440
|
+
stateChanges = new Subject();
|
|
1441
|
+
_errorState = false;
|
|
1442
|
+
_focused = false;
|
|
1430
1443
|
ngOnDestroy() {
|
|
1431
1444
|
delete this.formField?._control;
|
|
1432
1445
|
this.stateChanges.complete();
|
|
@@ -1513,8 +1526,8 @@ class DynamicFieldType extends FieldType {
|
|
|
1513
1526
|
};
|
|
1514
1527
|
}
|
|
1515
1528
|
}
|
|
1516
|
-
static
|
|
1517
|
-
static
|
|
1529
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFieldType, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1530
|
+
static ɵ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 });
|
|
1518
1531
|
}
|
|
1519
1532
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFieldType, decorators: [{
|
|
1520
1533
|
type: Component,
|
|
@@ -1526,58 +1539,58 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1526
1539
|
}] });
|
|
1527
1540
|
|
|
1528
1541
|
class DynamicFormComponent {
|
|
1529
|
-
|
|
1530
|
-
|
|
1531
|
-
|
|
1532
|
-
|
|
1533
|
-
|
|
1534
|
-
|
|
1535
|
-
|
|
1536
|
-
|
|
1537
|
-
|
|
1538
|
-
|
|
1539
|
-
|
|
1540
|
-
|
|
1541
|
-
|
|
1542
|
-
|
|
1543
|
-
|
|
1544
|
-
|
|
1545
|
-
|
|
1546
|
-
|
|
1547
|
-
|
|
1548
|
-
|
|
1549
|
-
|
|
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
|
-
}
|
|
1542
|
+
builder = inject(DynamicFormBuilderService);
|
|
1543
|
+
events = inject(EventsService);
|
|
1544
|
+
languages = inject(LANGUAGE_SERVICE);
|
|
1545
|
+
labelPrefix = input("label");
|
|
1546
|
+
labelCustomizer = input(null);
|
|
1547
|
+
testId = input("");
|
|
1548
|
+
useTabs = input(false);
|
|
1549
|
+
data = input({});
|
|
1550
|
+
fields = input(null);
|
|
1551
|
+
fieldChanges = new Subject();
|
|
1552
|
+
language = toSignal(this.events.languageChanged, {
|
|
1553
|
+
initialValue: this.languages.currentLanguage
|
|
1554
|
+
});
|
|
1555
|
+
enableTranslations = toSignal(this.events.translationsEnabled, {
|
|
1556
|
+
initialValue: this.languages.enableTranslations
|
|
1557
|
+
});
|
|
1558
|
+
config = computed(() => {
|
|
1559
|
+
const options = {
|
|
1560
|
+
labelPrefix: this.labelPrefix(),
|
|
1561
|
+
labelCustomizer: this.labelCustomizer(),
|
|
1562
|
+
testId: this.testId(),
|
|
1580
1563
|
};
|
|
1564
|
+
const fields = this.fields() || this.builder.resolveFormFields(this.data()?.constructor, null, options);
|
|
1565
|
+
return [
|
|
1566
|
+
this.builder.createFormGroup(null, () => fields, {
|
|
1567
|
+
label: "",
|
|
1568
|
+
useTabs: this.useTabs(),
|
|
1569
|
+
hidden: false,
|
|
1570
|
+
additional: {
|
|
1571
|
+
className: "dynamic-form-root-group"
|
|
1572
|
+
}
|
|
1573
|
+
}, null, options)
|
|
1574
|
+
];
|
|
1575
|
+
});
|
|
1576
|
+
group = computed(() => {
|
|
1577
|
+
this.config();
|
|
1578
|
+
return new FormGroup$1({});
|
|
1579
|
+
});
|
|
1580
|
+
status$ = rxResource({
|
|
1581
|
+
request: () => this.group(),
|
|
1582
|
+
loader: p => p.request.statusChanges,
|
|
1583
|
+
defaultValue: "PENDING"
|
|
1584
|
+
});
|
|
1585
|
+
status = computed(() => this.status$.value());
|
|
1586
|
+
onSubmit = output();
|
|
1587
|
+
options = {
|
|
1588
|
+
fieldChanges: this.fieldChanges,
|
|
1589
|
+
formState: {
|
|
1590
|
+
injector: inject(Injector)
|
|
1591
|
+
}
|
|
1592
|
+
};
|
|
1593
|
+
constructor() {
|
|
1581
1594
|
effect(() => {
|
|
1582
1595
|
this.language();
|
|
1583
1596
|
this.enableTranslations();
|
|
@@ -1594,8 +1607,8 @@ class DynamicFormComponent {
|
|
|
1594
1607
|
reset() {
|
|
1595
1608
|
this.options?.resetModel?.();
|
|
1596
1609
|
}
|
|
1597
|
-
static
|
|
1598
|
-
static
|
|
1610
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1611
|
+
static ɵ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 });
|
|
1599
1612
|
}
|
|
1600
1613
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormComponent, decorators: [{
|
|
1601
1614
|
type: Component,
|
|
@@ -1603,10 +1616,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1603
1616
|
}], ctorParameters: () => [] });
|
|
1604
1617
|
|
|
1605
1618
|
class DynamicFormArrayComponent extends FieldArrayType {
|
|
1606
|
-
|
|
1607
|
-
super(...arguments);
|
|
1608
|
-
this.currentTab = signal(0);
|
|
1609
|
-
}
|
|
1619
|
+
currentTab = signal(0);
|
|
1610
1620
|
clearItems() {
|
|
1611
1621
|
const control = this.formControl;
|
|
1612
1622
|
while (control.length > 0) {
|
|
@@ -1624,8 +1634,8 @@ class DynamicFormArrayComponent extends FieldArrayType {
|
|
|
1624
1634
|
const length = this.field.fieldGroup.length;
|
|
1625
1635
|
this.currentTab.set(Math.min(this.currentTab(), length - 1));
|
|
1626
1636
|
}
|
|
1627
|
-
static
|
|
1628
|
-
static
|
|
1637
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormArrayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1638
|
+
static ɵ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 });
|
|
1629
1639
|
}
|
|
1630
1640
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormArrayComponent, decorators: [{
|
|
1631
1641
|
type: Component,
|
|
@@ -1633,8 +1643,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1633
1643
|
}] });
|
|
1634
1644
|
|
|
1635
1645
|
class DynamicFormChipsComponent extends DynamicFieldType {
|
|
1636
|
-
static
|
|
1637
|
-
static
|
|
1646
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormChipsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1647
|
+
static ɵ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 });
|
|
1638
1648
|
}
|
|
1639
1649
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormChipsComponent, decorators: [{
|
|
1640
1650
|
type: Component,
|
|
@@ -1642,8 +1652,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1642
1652
|
}] });
|
|
1643
1653
|
|
|
1644
1654
|
class DynamicFormFieldComponent extends FieldWrapper {
|
|
1645
|
-
static
|
|
1646
|
-
static
|
|
1655
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1656
|
+
static ɵ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 });
|
|
1647
1657
|
}
|
|
1648
1658
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldComponent, decorators: [{
|
|
1649
1659
|
type: Component,
|
|
@@ -1651,8 +1661,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1651
1661
|
}] });
|
|
1652
1662
|
|
|
1653
1663
|
class DynamicFormFieldsetComponent extends FieldWrapper {
|
|
1654
|
-
static
|
|
1655
|
-
static
|
|
1664
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldsetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1665
|
+
static ɵ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 });
|
|
1656
1666
|
}
|
|
1657
1667
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormFieldsetComponent, decorators: [{
|
|
1658
1668
|
type: Component,
|
|
@@ -1660,8 +1670,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1660
1670
|
}] });
|
|
1661
1671
|
|
|
1662
1672
|
class DynamicFormGroupComponent extends FieldWrapper {
|
|
1663
|
-
static
|
|
1664
|
-
static
|
|
1673
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1674
|
+
static ɵ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 });
|
|
1665
1675
|
}
|
|
1666
1676
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormGroupComponent, decorators: [{
|
|
1667
1677
|
type: Component,
|
|
@@ -1669,8 +1679,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1669
1679
|
}] });
|
|
1670
1680
|
|
|
1671
1681
|
class DynamicFormUploadComponent extends DynamicFieldType {
|
|
1672
|
-
static
|
|
1673
|
-
static
|
|
1682
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormUploadComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1683
|
+
static ɵ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 });
|
|
1674
1684
|
}
|
|
1675
1685
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DynamicFormUploadComponent, decorators: [{
|
|
1676
1686
|
type: Component,
|
|
@@ -1730,16 +1740,16 @@ class NgxDynamicFormModule {
|
|
|
1730
1740
|
static provideForms(config) {
|
|
1731
1741
|
return makeEnvironmentProviders(NgxDynamicFormModule.getProviders(config));
|
|
1732
1742
|
}
|
|
1733
|
-
static
|
|
1734
|
-
static
|
|
1743
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1744
|
+
static ɵ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,
|
|
1735
1745
|
FormsModule,
|
|
1736
1746
|
ReactiveFormsModule,
|
|
1737
1747
|
NgxUtilsModule,
|
|
1738
1748
|
FormlyModule], exports: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, DynamicFormUploadComponent, AsyncSubmitDirective, FormsModule,
|
|
1739
1749
|
ReactiveFormsModule,
|
|
1740
1750
|
NgxUtilsModule,
|
|
1741
|
-
FormlyModule] });
|
|
1742
|
-
static
|
|
1751
|
+
FormlyModule] });
|
|
1752
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, providers: [
|
|
1743
1753
|
...pipes
|
|
1744
1754
|
], imports: [CommonModule,
|
|
1745
1755
|
FormsModule,
|
|
@@ -1748,7 +1758,7 @@ class NgxDynamicFormModule {
|
|
|
1748
1758
|
FormlyModule, FormsModule,
|
|
1749
1759
|
ReactiveFormsModule,
|
|
1750
1760
|
NgxUtilsModule,
|
|
1751
|
-
FormlyModule] });
|
|
1761
|
+
FormlyModule] });
|
|
1752
1762
|
}
|
|
1753
1763
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxDynamicFormModule, decorators: [{
|
|
1754
1764
|
type: NgModule,
|