@stemy/ngx-dynamic-form 19.8.1 → 19.8.3
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/fesm2022/stemy-ngx-dynamic-form.mjs +187 -65
- package/fesm2022/stemy-ngx-dynamic-form.mjs.map +1 -1
- package/ngx-dynamic-form/common-types.d.ts +7 -6
- package/ngx-dynamic-form/components/dynamic-form-array/dynamic-form-array.component.d.ts +1 -1
- package/ngx-dynamic-form/components/dynamic-form-translation/dynamic-form-translation.component.d.ts +16 -0
- package/ngx-dynamic-form/models/rich-translation.model.d.ts +5 -0
- package/ngx-dynamic-form/models/translation.model.d.ts +5 -0
- package/ngx-dynamic-form/models/utils.d.ts +5 -0
- package/ngx-dynamic-form/ngx-dynamic-form.imports.d.ts +2 -1
- package/ngx-dynamic-form/ngx-dynamic-form.module.d.ts +14 -13
- package/ngx-dynamic-form/services/dynamic-form-builder.service.d.ts +2 -1
- package/ngx-dynamic-form/utils/decorators.d.ts +2 -2
- package/package.json +2 -2
- package/public_api.d.ts +4 -1
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import * as i2 from '@stemy/ngx-utils';
|
|
2
|
-
import { cachedFactory, ReflectUtils, ObjectUtils, LANGUAGE_SERVICE, ForbiddenZone, API_SERVICE, StringUtils, AsyncMethodBase, EventsService, NgxUtilsModule } from '@stemy/ngx-utils';
|
|
2
|
+
import { cachedFactory, ReflectUtils, ObjectUtils, LANGUAGE_SERVICE, FactoryDependencies, ForbiddenZone, API_SERVICE, StringUtils, AsyncMethodBase, EventsService, NgxUtilsModule } from '@stemy/ngx-utils';
|
|
3
3
|
import { of, merge, Observable, firstValueFrom, BehaviorSubject, combineLatestWith, switchMap, distinctUntilChanged, first, Subject } from 'rxjs';
|
|
4
4
|
import { debounceTime } from 'rxjs/operators';
|
|
5
|
+
import { __decorate } from 'tslib';
|
|
5
6
|
import * as i0 from '@angular/core';
|
|
6
7
|
import { Inject, Injectable, untracked, input, inject, Renderer2, ElementRef, computed, signal, effect, HostBinding, Directive, Type, Component, output, Injector, ChangeDetectionStrategy, ViewEncapsulation, makeEnvironmentProviders, NgModule } from '@angular/core';
|
|
7
8
|
import * as i1 from '@angular/forms';
|
|
@@ -47,13 +48,9 @@ function defineFormControl(target, propertyKey, cb) {
|
|
|
47
48
|
ReflectUtils.defineMetadata("dynamicFormField", builder, target, propertyKey);
|
|
48
49
|
ReflectUtils.defineMetadata("dynamicFormFields", fields, target);
|
|
49
50
|
}
|
|
50
|
-
function FormSerializable(
|
|
51
|
+
function FormSerializable(data) {
|
|
51
52
|
return (target, key) => {
|
|
52
|
-
defineFormControl(target, key, () => (
|
|
53
|
-
key,
|
|
54
|
-
serializer,
|
|
55
|
-
serialize: true
|
|
56
|
-
}));
|
|
53
|
+
defineFormControl(target, key, (fb) => fb.createFormSerializer(data));
|
|
57
54
|
};
|
|
58
55
|
}
|
|
59
56
|
function FormInput(data) {
|
|
@@ -409,6 +406,65 @@ const MIN_INPUT_NUM = -1999999999;
|
|
|
409
406
|
const MAX_INPUT_NUM = 1999999999;
|
|
410
407
|
const EDITOR_FORMATS = ["php", "json", "html", "css", "scss"];
|
|
411
408
|
|
|
409
|
+
class ModelUtils {
|
|
410
|
+
static getLanguages(language) {
|
|
411
|
+
return async () => {
|
|
412
|
+
return language.languages.map(id => {
|
|
413
|
+
return { id, label: id };
|
|
414
|
+
});
|
|
415
|
+
};
|
|
416
|
+
}
|
|
417
|
+
}
|
|
418
|
+
__decorate([
|
|
419
|
+
FactoryDependencies(LANGUAGE_SERVICE)
|
|
420
|
+
], ModelUtils, "getLanguages", null);
|
|
421
|
+
|
|
422
|
+
class RichTranslationModel {
|
|
423
|
+
lang = "";
|
|
424
|
+
translation = "";
|
|
425
|
+
constructor(data) {
|
|
426
|
+
if (data)
|
|
427
|
+
Object.assign(this, data);
|
|
428
|
+
}
|
|
429
|
+
}
|
|
430
|
+
__decorate([
|
|
431
|
+
FormSelect({
|
|
432
|
+
options: {
|
|
433
|
+
type: ModelUtils,
|
|
434
|
+
func: ModelUtils.getLanguages
|
|
435
|
+
}
|
|
436
|
+
}),
|
|
437
|
+
FormSerializable()
|
|
438
|
+
], RichTranslationModel.prototype, "lang", void 0);
|
|
439
|
+
__decorate([
|
|
440
|
+
FormInput({
|
|
441
|
+
type: "wysiwyg"
|
|
442
|
+
}),
|
|
443
|
+
FormSerializable()
|
|
444
|
+
], RichTranslationModel.prototype, "translation", void 0);
|
|
445
|
+
|
|
446
|
+
class TranslationModel {
|
|
447
|
+
lang = "";
|
|
448
|
+
translation = "";
|
|
449
|
+
constructor(data) {
|
|
450
|
+
if (data)
|
|
451
|
+
Object.assign(this, data);
|
|
452
|
+
}
|
|
453
|
+
}
|
|
454
|
+
__decorate([
|
|
455
|
+
FormSelect({
|
|
456
|
+
options: {
|
|
457
|
+
type: ModelUtils,
|
|
458
|
+
func: ModelUtils.getLanguages
|
|
459
|
+
}
|
|
460
|
+
}),
|
|
461
|
+
FormSerializable()
|
|
462
|
+
], TranslationModel.prototype, "lang", void 0);
|
|
463
|
+
__decorate([
|
|
464
|
+
FormInput(),
|
|
465
|
+
FormSerializable()
|
|
466
|
+
], TranslationModel.prototype, "translation", void 0);
|
|
467
|
+
|
|
412
468
|
class ConfigForSchemaWrap {
|
|
413
469
|
opts;
|
|
414
470
|
mode;
|
|
@@ -732,6 +788,14 @@ class DynamicFormBuilderService {
|
|
|
732
788
|
hooks: {},
|
|
733
789
|
expressions
|
|
734
790
|
};
|
|
791
|
+
const lang = items.find(i => i.key === "lang");
|
|
792
|
+
const translation = items.find(i => i.key === "translation");
|
|
793
|
+
if (lang && translation) {
|
|
794
|
+
// Use translation component if the sub items are correct
|
|
795
|
+
array.type = "translation";
|
|
796
|
+
setFieldHidden(lang);
|
|
797
|
+
setFieldProp(translation, "label", "");
|
|
798
|
+
}
|
|
735
799
|
this.setExpressions(array.fieldArray, options);
|
|
736
800
|
return array;
|
|
737
801
|
}
|
|
@@ -762,6 +826,16 @@ class DynamicFormBuilderService {
|
|
|
762
826
|
? result.then(handleItems)
|
|
763
827
|
: handleItems(result);
|
|
764
828
|
}
|
|
829
|
+
createFormSerializer(data) {
|
|
830
|
+
const options = ObjectUtils.isFunction(data) ? {
|
|
831
|
+
serializer: data,
|
|
832
|
+
} : data || { serialize: true };
|
|
833
|
+
const serialize = ReflectUtils.resolve(options.serialize, this.injector);
|
|
834
|
+
return {
|
|
835
|
+
serialize: ObjectUtils.isFunction(serialize) ? serialize : () => serialize,
|
|
836
|
+
serializer: options.serializer
|
|
837
|
+
};
|
|
838
|
+
}
|
|
765
839
|
async fixSelectOptions(field, options) {
|
|
766
840
|
if (!Array.isArray(options))
|
|
767
841
|
return [];
|
|
@@ -798,8 +872,7 @@ class DynamicFormBuilderService {
|
|
|
798
872
|
const disabled = ReflectUtils.resolve(data.disabled, this.injector);
|
|
799
873
|
const hidden = ReflectUtils.resolve(data.hidden, this.injector);
|
|
800
874
|
const field = {
|
|
801
|
-
|
|
802
|
-
serialize: data.serialize || false,
|
|
875
|
+
...this.createFormSerializer(data),
|
|
803
876
|
fieldSet: String(data.fieldSet || ""),
|
|
804
877
|
priority: isNaN(data.priority) ? Number.MAX_SAFE_INTEGER : Number(data.priority),
|
|
805
878
|
type: data.componentType || type,
|
|
@@ -903,10 +976,10 @@ class DynamicFormBuilderService {
|
|
|
903
976
|
}
|
|
904
977
|
});
|
|
905
978
|
}
|
|
906
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
907
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
979
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormBuilderService, deps: [{ token: i0.Injector }, { token: i2.EventsService }, { token: API_SERVICE }, { token: LANGUAGE_SERVICE }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
980
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormBuilderService });
|
|
908
981
|
}
|
|
909
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
982
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormBuilderService, decorators: [{
|
|
910
983
|
type: Injectable
|
|
911
984
|
}], ctorParameters: () => [{ type: i0.Injector }, { type: i2.EventsService }, { type: undefined, decorators: [{
|
|
912
985
|
type: Inject,
|
|
@@ -935,6 +1008,8 @@ class DynamicFormSchemaService {
|
|
|
935
1008
|
return this.openApi.getSchema(name);
|
|
936
1009
|
}
|
|
937
1010
|
async getFormFieldsForSchema(schema, parent, customizeOrOptions) {
|
|
1011
|
+
if (!schema)
|
|
1012
|
+
return [];
|
|
938
1013
|
const options = await toWrapOptions(customizeOrOptions, this.injector, schema);
|
|
939
1014
|
const keys = Object.keys(schema.properties || {});
|
|
940
1015
|
const fields = [];
|
|
@@ -1275,10 +1350,10 @@ class DynamicFormSchemaService {
|
|
|
1275
1350
|
validators.itemsMaxValue = maxValueValidation(items.maximum, true);
|
|
1276
1351
|
}
|
|
1277
1352
|
}
|
|
1278
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1279
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
1353
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormSchemaService, deps: [{ token: i2.OpenApiService }, { token: i0.Injector }, { token: DynamicFormBuilderService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1354
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormSchemaService });
|
|
1280
1355
|
}
|
|
1281
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1356
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormSchemaService, decorators: [{
|
|
1282
1357
|
type: Injectable
|
|
1283
1358
|
}], ctorParameters: () => [{ type: i2.OpenApiService }, { type: i0.Injector }, { type: DynamicFormBuilderService }] });
|
|
1284
1359
|
|
|
@@ -1308,6 +1383,10 @@ class DynamicFormService {
|
|
|
1308
1383
|
props: {}
|
|
1309
1384
|
};
|
|
1310
1385
|
const schema = await this.fs.getSchema(name);
|
|
1386
|
+
if (!schema) {
|
|
1387
|
+
console.warn(`Schema with name "${name}" not found.`);
|
|
1388
|
+
return config;
|
|
1389
|
+
}
|
|
1311
1390
|
const wrapOptions = await toWrapOptions(customizeOrOptions, this.injector, schema, `"DynamicFormService.${restrictedMethod}" is called from a customizer, which is not allowed. Please use DynamicFormSchemaService instead!`);
|
|
1312
1391
|
const fields = await this.fs.getFormFieldsForSchema(schema, config, wrapOptions);
|
|
1313
1392
|
const fieldGroup = [...fields];
|
|
@@ -1378,11 +1457,12 @@ class DynamicFormService {
|
|
|
1378
1457
|
for (const field of fields) {
|
|
1379
1458
|
const serializer = field.serializer;
|
|
1380
1459
|
const key = `${field.key}`;
|
|
1381
|
-
|
|
1382
|
-
|
|
1460
|
+
const shouldSerialize = field.serialize(field, this.injector) ?? !!field.hide;
|
|
1461
|
+
if (!shouldSerialize) {
|
|
1383
1462
|
continue;
|
|
1384
1463
|
}
|
|
1385
|
-
if (
|
|
1464
|
+
if (ObjectUtils.isFunction(serializer)) {
|
|
1465
|
+
result[key] = await serializer(field, this.injector);
|
|
1386
1466
|
continue;
|
|
1387
1467
|
}
|
|
1388
1468
|
const control = field.formControl;
|
|
@@ -1418,10 +1498,10 @@ class DynamicFormService {
|
|
|
1418
1498
|
}
|
|
1419
1499
|
});
|
|
1420
1500
|
}
|
|
1421
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1422
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
1501
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormService, deps: [{ token: DynamicFormSchemaService }, { token: DynamicFormBuilderService }, { token: i0.Injector }, { token: API_SERVICE }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1502
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormService });
|
|
1423
1503
|
}
|
|
1424
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1504
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormService, decorators: [{
|
|
1425
1505
|
type: Injectable
|
|
1426
1506
|
}], ctorParameters: () => [{ type: DynamicFormSchemaService }, { type: DynamicFormBuilderService }, { type: i0.Injector }, { type: undefined, decorators: [{
|
|
1427
1507
|
type: Inject,
|
|
@@ -1493,12 +1573,12 @@ class AsyncSubmitDirective extends AsyncMethodBase {
|
|
|
1493
1573
|
getArgs(ev) {
|
|
1494
1574
|
return untracked(() => [this.form(), this.context(), ev]);
|
|
1495
1575
|
}
|
|
1496
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1497
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.
|
|
1576
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: AsyncSubmitDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
1577
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.19", 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 } }, host: { properties: { "class.disabled": "this.isDisabled", "class.loading": "this.isLoading" } }, providers: [
|
|
1498
1578
|
{ provide: AsyncMethodBase, useExisting: AsyncSubmitDirective }
|
|
1499
1579
|
], exportAs: ["async-submit"], usesInheritance: true, ngImport: i0 });
|
|
1500
1580
|
}
|
|
1501
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1581
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: AsyncSubmitDirective, decorators: [{
|
|
1502
1582
|
type: Directive,
|
|
1503
1583
|
args: [{
|
|
1504
1584
|
standalone: false,
|
|
@@ -1606,10 +1686,10 @@ class DynamicFieldType extends FieldType {
|
|
|
1606
1686
|
};
|
|
1607
1687
|
}
|
|
1608
1688
|
}
|
|
1609
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1610
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1689
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFieldType, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1690
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DynamicFieldType, isStandalone: false, selector: "dynamic-field-type", usesInheritance: true, ngImport: i0, template: "", isInline: true });
|
|
1611
1691
|
}
|
|
1612
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1692
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFieldType, decorators: [{
|
|
1613
1693
|
type: Component,
|
|
1614
1694
|
args: [{
|
|
1615
1695
|
standalone: false,
|
|
@@ -1699,10 +1779,10 @@ class DynamicFormComponent {
|
|
|
1699
1779
|
const field = this.getField(path);
|
|
1700
1780
|
return field?.formControl ?? null;
|
|
1701
1781
|
}
|
|
1702
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1703
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
1782
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormComponent, deps: [{ token: DynamicFormService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1783
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", 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", onChanges: "onChanges" }, 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 });
|
|
1704
1784
|
}
|
|
1705
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1785
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormComponent, decorators: [{
|
|
1706
1786
|
type: Component,
|
|
1707
1787
|
args: [{ standalone: false, selector: "dynamic-form", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, 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"] }]
|
|
1708
1788
|
}], ctorParameters: () => [{ type: DynamicFormService }] });
|
|
@@ -1716,9 +1796,9 @@ class DynamicFormArrayComponent extends FieldArrayType {
|
|
|
1716
1796
|
}
|
|
1717
1797
|
this.currentTab.set(0);
|
|
1718
1798
|
}
|
|
1719
|
-
addItem(i) {
|
|
1799
|
+
addItem(i, initialModel) {
|
|
1720
1800
|
i = i == null ? this.field.fieldGroup.length : i;
|
|
1721
|
-
this.add(i);
|
|
1801
|
+
this.add(i, initialModel);
|
|
1722
1802
|
this.currentTab.set(i);
|
|
1723
1803
|
}
|
|
1724
1804
|
removeItem(i) {
|
|
@@ -1726,46 +1806,86 @@ class DynamicFormArrayComponent extends FieldArrayType {
|
|
|
1726
1806
|
const length = this.field.fieldGroup.length;
|
|
1727
1807
|
this.currentTab.set(Math.min(this.currentTab(), length - 1));
|
|
1728
1808
|
}
|
|
1729
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1730
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
1809
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormArrayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1810
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", 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 @if (props.markRequired) {\n <span class=\"field-required\" aria-hidden=\"true\">*</span>\n }\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\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}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}.field-errors.invalid-feedback{display:block}\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", "testId", "tabsClass"], outputs: ["valueChange", "selectedChange"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.GetValuePipe, name: "getValue" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
|
|
1731
1811
|
}
|
|
1732
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1812
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormArrayComponent, decorators: [{
|
|
1733
1813
|
type: Component,
|
|
1734
1814
|
args: [{ standalone: false, selector: "dynamic-form-array", encapsulation: ViewEncapsulation.None, 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 @if (props.markRequired) {\n <span class=\"field-required\" aria-hidden=\"true\">*</span>\n }\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\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}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}.field-errors.invalid-feedback{display:block}\n"] }]
|
|
1735
1815
|
}] });
|
|
1736
1816
|
|
|
1737
1817
|
class DynamicFormChipsComponent extends DynamicFieldType {
|
|
1738
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1739
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1818
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormChipsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1819
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", 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 [strict]=\"props.strict\"\n [options]=\"props.options | formlySelectOptions | async\"\n [testId]=\"field.testId\"\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: ["testId", "value", "multiple", "disabled", "type", "min", "max", "minLength", "maxLength", "step", "placeholder", "unique", "strict", "options"], outputs: ["valueChange"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.LegacyFormlySelectOptionsPipe, name: "formlySelectOptions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1740
1820
|
}
|
|
1741
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1821
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormChipsComponent, decorators: [{
|
|
1742
1822
|
type: Component,
|
|
1743
1823
|
args: [{ standalone: false, selector: "dynamic-form-chips", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, 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 [strict]=\"props.strict\"\n [options]=\"props.options | formlySelectOptions | async\"\n [testId]=\"field.testId\"\n [formlyAttributes]=\"field\">\n</chips>\n" }]
|
|
1744
1824
|
}] });
|
|
1745
1825
|
|
|
1746
1826
|
class DynamicFormStaticComponent extends DynamicFieldType {
|
|
1747
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1748
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1827
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormStaticComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1828
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DynamicFormStaticComponent, isStandalone: false, selector: "dynamic-form-chips", usesInheritance: true, ngImport: i0, template: "<unordered-list [listStyle]=\"props.style\" [ngClass]=\"{disabled: props.disabled}\"\n [data]=\"!props.properties ? {value: value} : props.properties | remap: value\">\n <ng-template [type]=\"!props.properties ? 'key' : null\" selector=\"level == 0\" let-item=\"item\"></ng-template>\n <ng-template type=\"value\" selector=\"valueType == 'date'\" let-item=\"item\">\n {{ item.value | date }}\n </ng-template>\n</unordered-list>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.UnorderedListTemplateDirective, selector: "ng-template[type][selector]", inputs: ["type", "selector"] }, { kind: "component", type: i2.UnorderedListComponent, selector: "unordered-list", inputs: ["data", "keyPrefix", "listStyle", "path", "level", "templates"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i2.RemapPipe, name: "remap" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1749
1829
|
}
|
|
1750
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1830
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormStaticComponent, decorators: [{
|
|
1751
1831
|
type: Component,
|
|
1752
1832
|
args: [{ standalone: false, selector: "dynamic-form-chips", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<unordered-list [listStyle]=\"props.style\" [ngClass]=\"{disabled: props.disabled}\"\n [data]=\"!props.properties ? {value: value} : props.properties | remap: value\">\n <ng-template [type]=\"!props.properties ? 'key' : null\" selector=\"level == 0\" let-item=\"item\"></ng-template>\n <ng-template type=\"value\" selector=\"valueType == 'date'\" let-item=\"item\">\n {{ item.value | date }}\n </ng-template>\n</unordered-list>\n" }]
|
|
1753
1833
|
}] });
|
|
1754
1834
|
|
|
1835
|
+
class DynamicFormTranslationComponent extends DynamicFormArrayComponent {
|
|
1836
|
+
events;
|
|
1837
|
+
language;
|
|
1838
|
+
subscription;
|
|
1839
|
+
constructor(events, language) {
|
|
1840
|
+
super();
|
|
1841
|
+
this.events = events;
|
|
1842
|
+
this.language = language;
|
|
1843
|
+
}
|
|
1844
|
+
ngOnInit() {
|
|
1845
|
+
this.subscription = this.events.editLanguageChanged.subscribe(lang => this.setLanguage(lang));
|
|
1846
|
+
this.setLanguage(this.language.editLanguage);
|
|
1847
|
+
}
|
|
1848
|
+
ngOnDestroy() {
|
|
1849
|
+
this.subscription?.unsubscribe();
|
|
1850
|
+
}
|
|
1851
|
+
setLanguage(lang) {
|
|
1852
|
+
if (!this.formControl)
|
|
1853
|
+
return;
|
|
1854
|
+
const value = this.formControl.value || [];
|
|
1855
|
+
const index = value.findIndex(i => i.lang === lang);
|
|
1856
|
+
if (index < 0) {
|
|
1857
|
+
this.addItem(value.length, {
|
|
1858
|
+
lang, translation: ""
|
|
1859
|
+
});
|
|
1860
|
+
return;
|
|
1861
|
+
}
|
|
1862
|
+
this.currentTab.set(index);
|
|
1863
|
+
}
|
|
1864
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTranslationComponent, deps: [{ token: i2.EventsService }, { token: LANGUAGE_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
|
|
1865
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormTranslationComponent, isStandalone: false, selector: "dynamic-form-translation", 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 @if (props.markRequired) {\n <span class=\"field-required\" aria-hidden=\"true\">*</span>\n }\n </label>\n }\n <div class=\"field-container\">\n @for (itemField of field.fieldGroup; track itemField.key; let ix = $index) {\n @if (ix === currentTab()) {\n <formly-field [field]=\"itemField\"></formly-field>\n }\n }\n\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}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}.field-errors.invalid-feedback{display:block}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
|
|
1866
|
+
}
|
|
1867
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTranslationComponent, decorators: [{
|
|
1868
|
+
type: Component,
|
|
1869
|
+
args: [{ standalone: false, selector: "dynamic-form-translation", encapsulation: ViewEncapsulation.None, 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 @if (props.markRequired) {\n <span class=\"field-required\" aria-hidden=\"true\">*</span>\n }\n </label>\n }\n <div class=\"field-container\">\n @for (itemField of field.fieldGroup; track itemField.key; let ix = $index) {\n @if (ix === currentTab()) {\n <formly-field [field]=\"itemField\"></formly-field>\n }\n }\n\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}\n", styles: [".form-array-item.hidden-tab{display:none}.form-array-buttons{display:flex;gap:5px;margin-bottom:5px}.field-errors.invalid-feedback{display:block}\n"] }]
|
|
1870
|
+
}], ctorParameters: () => [{ type: i2.EventsService }, { type: undefined, decorators: [{
|
|
1871
|
+
type: Inject,
|
|
1872
|
+
args: [LANGUAGE_SERVICE]
|
|
1873
|
+
}] }] });
|
|
1874
|
+
|
|
1755
1875
|
class DynamicFormUploadComponent extends DynamicFieldType {
|
|
1756
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1757
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1876
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormUploadComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1877
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", 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 });
|
|
1758
1878
|
}
|
|
1759
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1879
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormUploadComponent, decorators: [{
|
|
1760
1880
|
type: Component,
|
|
1761
1881
|
args: [{ standalone: false, selector: "dynamic-form-upload", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, 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" }]
|
|
1762
1882
|
}] });
|
|
1763
1883
|
|
|
1764
1884
|
class DynamicFormWysiwygComponent extends DynamicFieldType {
|
|
1765
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1766
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1885
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormWysiwygComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1886
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DynamicFormWysiwygComponent, isStandalone: false, selector: "dynamic-form-wysiwyg", usesInheritance: true, ngImport: i0, template: "<wysiwyg [formControl]=\"formControl\"\n [formlyAttributes]=\"field\">\n</wysiwyg>\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.WysiwygComponent, selector: "wysiwyg", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "directive", type: i3.LegacyFormlyAttributes, selector: "[formlyAttributes]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1767
1887
|
}
|
|
1768
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1888
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormWysiwygComponent, decorators: [{
|
|
1769
1889
|
type: Component,
|
|
1770
1890
|
args: [{ standalone: false, selector: "dynamic-form-wysiwyg", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<wysiwyg [formControl]=\"formControl\"\n [formlyAttributes]=\"field\">\n</wysiwyg>\n" }]
|
|
1771
1891
|
}] });
|
|
@@ -1774,37 +1894,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
1774
1894
|
* This is just a test wrapper component
|
|
1775
1895
|
*/
|
|
1776
1896
|
class DynamicFormAlertComponent extends FieldWrapper {
|
|
1777
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1778
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1897
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormAlertComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1898
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DynamicFormAlertComponent, isStandalone: false, selector: "dynamic-form-alert", usesInheritance: true, ngImport: i0, template: "<div class=\"dynamic-form-alert\">\n <ng-container #fieldComponent></ng-container>\n</div>\n", styles: [".dynamic-form-alert{border:2px dashed red;width:100%}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
1779
1899
|
}
|
|
1780
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1900
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormAlertComponent, decorators: [{
|
|
1781
1901
|
type: Component,
|
|
1782
1902
|
args: [{ standalone: false, selector: "dynamic-form-alert", encapsulation: ViewEncapsulation.None, template: "<div class=\"dynamic-form-alert\">\n <ng-container #fieldComponent></ng-container>\n</div>\n", styles: [".dynamic-form-alert{border:2px dashed red;width:100%}\n"] }]
|
|
1783
1903
|
}] });
|
|
1784
1904
|
|
|
1785
1905
|
class DynamicFormFieldComponent extends FieldWrapper {
|
|
1786
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1787
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
1906
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1907
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormFieldComponent, isStandalone: false, selector: "dynamic-form-field", usesInheritance: true, ngImport: i0, template: "<ng-template #labelTemplate>\n @if (props.label && props.hideLabel !== true) {\n <label class=\"field-label\" [for]=\"id\">\n <span [innerHTML]=\"props.label | translate | safe: 'html'\"></span>\n <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n @if (props.markRequired) {\n <span class=\"field-required\" aria-hidden=\"true\">*</span>\n }\n </label>\n }\n</ng-template>\n@if (props.labelAlign === \"before\") {\n <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\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@if (props.labelAlign === \"after\") {\n <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\n}\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: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
|
|
1788
1908
|
}
|
|
1789
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1909
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldComponent, decorators: [{
|
|
1790
1910
|
type: Component,
|
|
1791
1911
|
args: [{ standalone: false, selector: "dynamic-form-field", encapsulation: ViewEncapsulation.None, template: "<ng-template #labelTemplate>\n @if (props.label && props.hideLabel !== true) {\n <label class=\"field-label\" [for]=\"id\">\n <span [innerHTML]=\"props.label | translate | safe: 'html'\"></span>\n <p class=\"field-description\" *ngIf=\"props.description\">{{ props.description | translate }}</p>\n @if (props.markRequired) {\n <span class=\"field-required\" aria-hidden=\"true\">*</span>\n }\n </label>\n }\n</ng-template>\n@if (props.labelAlign === \"before\") {\n <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\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@if (props.labelAlign === \"after\") {\n <ng-container [ngTemplateOutlet]=\"labelTemplate\"></ng-container>\n}\n" }]
|
|
1792
1912
|
}] });
|
|
1793
1913
|
|
|
1794
1914
|
class DynamicFormFieldsetComponent extends FieldWrapper {
|
|
1795
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1796
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
1915
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldsetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1916
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", 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 });
|
|
1797
1917
|
}
|
|
1798
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1918
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldsetComponent, decorators: [{
|
|
1799
1919
|
type: Component,
|
|
1800
1920
|
args: [{ standalone: false, selector: "dynamic-form-fieldset", encapsulation: ViewEncapsulation.None, 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" }]
|
|
1801
1921
|
}] });
|
|
1802
1922
|
|
|
1803
1923
|
class DynamicFormGroupComponent extends FieldWrapper {
|
|
1804
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1805
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
1924
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1925
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", 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 @if (props.markRequired) {\n <span class=\"field-required\" aria-hidden=\"true\">*</span>\n }\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 === false ? 'invalid' : 'valid']\"\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 <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 </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", "testId", "tabsClass"], outputs: ["valueChange", "selectedChange"] }, { kind: "component", type: i3.LegacyFormlyField, selector: "formly-field" }, { kind: "component", type: i3.LegacyFormlyValidationMessage, selector: "formly-validation-message" }, { kind: "pipe", type: i2.IncludesPipe, name: "includes" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
|
|
1806
1926
|
}
|
|
1807
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1927
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormGroupComponent, decorators: [{
|
|
1808
1928
|
type: Component,
|
|
1809
1929
|
args: [{ standalone: false, selector: "dynamic-form-group", encapsulation: ViewEncapsulation.None, 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 @if (props.markRequired) {\n <span class=\"field-required\" aria-hidden=\"true\">*</span>\n }\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 === false ? 'invalid' : 'valid']\"\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 <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 </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"] }]
|
|
1810
1930
|
}] });
|
|
@@ -1816,6 +1936,7 @@ const components = [
|
|
|
1816
1936
|
DynamicFormArrayComponent,
|
|
1817
1937
|
DynamicFormChipsComponent,
|
|
1818
1938
|
DynamicFormStaticComponent,
|
|
1939
|
+
DynamicFormTranslationComponent,
|
|
1819
1940
|
DynamicFormUploadComponent,
|
|
1820
1941
|
DynamicFormWysiwygComponent,
|
|
1821
1942
|
DynamicFormAlertComponent,
|
|
@@ -1839,6 +1960,7 @@ class NgxDynamicFormModule {
|
|
|
1839
1960
|
{ name: "array", component: DynamicFormArrayComponent },
|
|
1840
1961
|
{ name: "chips", component: DynamicFormChipsComponent },
|
|
1841
1962
|
{ name: "static", component: DynamicFormStaticComponent },
|
|
1963
|
+
{ name: "translation", component: DynamicFormTranslationComponent },
|
|
1842
1964
|
{ name: "upload", component: DynamicFormUploadComponent },
|
|
1843
1965
|
{ name: "wysiwyg", component: DynamicFormWysiwygComponent },
|
|
1844
1966
|
],
|
|
@@ -1868,18 +1990,18 @@ class NgxDynamicFormModule {
|
|
|
1868
1990
|
static provideForms(config) {
|
|
1869
1991
|
return makeEnvironmentProviders(NgxDynamicFormModule.getProviders(config));
|
|
1870
1992
|
}
|
|
1871
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1872
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
1993
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1994
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, declarations: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormStaticComponent, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective], imports: [CommonModule,
|
|
1873
1995
|
FormsModule,
|
|
1874
1996
|
ReactiveFormsModule,
|
|
1875
1997
|
NgxUtilsModule,
|
|
1876
1998
|
FormlyModule,
|
|
1877
|
-
FormlySelectModule], exports: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormStaticComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective, FormsModule,
|
|
1999
|
+
FormlySelectModule], exports: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormStaticComponent, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective, FormsModule,
|
|
1878
2000
|
ReactiveFormsModule,
|
|
1879
2001
|
NgxUtilsModule,
|
|
1880
2002
|
FormlyModule,
|
|
1881
2003
|
FormlySelectModule] });
|
|
1882
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
2004
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, providers: [
|
|
1883
2005
|
...pipes
|
|
1884
2006
|
], imports: [CommonModule,
|
|
1885
2007
|
FormsModule,
|
|
@@ -1892,7 +2014,7 @@ class NgxDynamicFormModule {
|
|
|
1892
2014
|
FormlyModule,
|
|
1893
2015
|
FormlySelectModule] });
|
|
1894
2016
|
}
|
|
1895
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2017
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, decorators: [{
|
|
1896
2018
|
type: NgModule,
|
|
1897
2019
|
args: [{
|
|
1898
2020
|
declarations: [
|
|
@@ -1928,5 +2050,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
1928
2050
|
* Generated bundle index. Do not edit.
|
|
1929
2051
|
*/
|
|
1930
2052
|
|
|
1931
|
-
export { AsyncSubmitDirective, DynamicFieldType, DynamicFormAlertComponent, DynamicFormArrayComponent, DynamicFormBuilderService, DynamicFormChipsComponent, DynamicFormComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, DynamicFormSchemaService, DynamicFormService, DynamicFormStaticComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, EDITOR_FORMATS, FORM_ROOT_ID, FormArray, FormFile, FormGroup, FormInput, FormModel, FormSelect, FormSerializable, FormStatic, FormUpload, MAX_INPUT_NUM, MIN_INPUT_NUM, NgxDynamicFormModule, addFieldValidators, arrayLengthValidation, clearFieldArray, controlStatus, controlValues, convertToDate, convertToDateFormat, convertToNumber, customizeFormField, emailValidation, getFieldByPath, getFieldsByKey, getFieldsByPredicate, getSelectOptions, insertToFieldArray, jsonValidation, maxLengthValidation, maxValueValidation, minLengthValidation, minValueValidation, phoneValidation, removeFieldValidators, removeFromFieldArray, replaceFieldArray, replaceSpecialChars, requiredValidation, setFieldDefault, setFieldDisabled, setFieldHidden, setFieldHooks, setFieldProp, setFieldProps, setFieldValue, translationValidation };
|
|
2053
|
+
export { AsyncSubmitDirective, DynamicFieldType, DynamicFormAlertComponent, DynamicFormArrayComponent, DynamicFormBuilderService, DynamicFormChipsComponent, DynamicFormComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, DynamicFormSchemaService, DynamicFormService, DynamicFormStaticComponent, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, EDITOR_FORMATS, FORM_ROOT_ID, FormArray, FormFile, FormGroup, FormInput, FormModel, FormSelect, FormSerializable, FormStatic, FormUpload, MAX_INPUT_NUM, MIN_INPUT_NUM, NgxDynamicFormModule, RichTranslationModel, TranslationModel, addFieldValidators, arrayLengthValidation, clearFieldArray, controlStatus, controlValues, convertToDate, convertToDateFormat, convertToNumber, customizeFormField, emailValidation, getFieldByPath, getFieldsByKey, getFieldsByPredicate, getSelectOptions, insertToFieldArray, jsonValidation, maxLengthValidation, maxValueValidation, minLengthValidation, minValueValidation, phoneValidation, removeFieldValidators, removeFromFieldArray, replaceFieldArray, replaceSpecialChars, requiredValidation, setFieldDefault, setFieldDisabled, setFieldHidden, setFieldHooks, setFieldProp, setFieldProps, setFieldValue, translationValidation };
|
|
1932
2054
|
//# sourceMappingURL=stemy-ngx-dynamic-form.mjs.map
|