@stemy/ngx-dynamic-form 19.8.1 → 19.8.2
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 +164 -54
- package/fesm2022/stemy-ngx-dynamic-form.mjs.map +1 -1
- 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/package.json +1 -1
- package/public_api.d.ts +3 -0
|
@@ -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';
|
|
@@ -409,6 +410,65 @@ const MIN_INPUT_NUM = -1999999999;
|
|
|
409
410
|
const MAX_INPUT_NUM = 1999999999;
|
|
410
411
|
const EDITOR_FORMATS = ["php", "json", "html", "css", "scss"];
|
|
411
412
|
|
|
413
|
+
class ModelUtils {
|
|
414
|
+
static getLanguages(language) {
|
|
415
|
+
return async () => {
|
|
416
|
+
return language.languages.map(id => {
|
|
417
|
+
return { id, label: id };
|
|
418
|
+
});
|
|
419
|
+
};
|
|
420
|
+
}
|
|
421
|
+
}
|
|
422
|
+
__decorate([
|
|
423
|
+
FactoryDependencies(LANGUAGE_SERVICE)
|
|
424
|
+
], ModelUtils, "getLanguages", null);
|
|
425
|
+
|
|
426
|
+
class RichTranslationModel {
|
|
427
|
+
lang = "";
|
|
428
|
+
translation = "";
|
|
429
|
+
constructor(data) {
|
|
430
|
+
if (data)
|
|
431
|
+
Object.assign(this, data);
|
|
432
|
+
}
|
|
433
|
+
}
|
|
434
|
+
__decorate([
|
|
435
|
+
FormSelect({
|
|
436
|
+
options: {
|
|
437
|
+
type: ModelUtils,
|
|
438
|
+
func: ModelUtils.getLanguages
|
|
439
|
+
}
|
|
440
|
+
}),
|
|
441
|
+
FormSerializable()
|
|
442
|
+
], RichTranslationModel.prototype, "lang", void 0);
|
|
443
|
+
__decorate([
|
|
444
|
+
FormInput({
|
|
445
|
+
type: "wysiwyg"
|
|
446
|
+
}),
|
|
447
|
+
FormSerializable()
|
|
448
|
+
], RichTranslationModel.prototype, "translation", void 0);
|
|
449
|
+
|
|
450
|
+
class TranslationModel {
|
|
451
|
+
lang = "";
|
|
452
|
+
translation = "";
|
|
453
|
+
constructor(data) {
|
|
454
|
+
if (data)
|
|
455
|
+
Object.assign(this, data);
|
|
456
|
+
}
|
|
457
|
+
}
|
|
458
|
+
__decorate([
|
|
459
|
+
FormSelect({
|
|
460
|
+
options: {
|
|
461
|
+
type: ModelUtils,
|
|
462
|
+
func: ModelUtils.getLanguages
|
|
463
|
+
}
|
|
464
|
+
}),
|
|
465
|
+
FormSerializable()
|
|
466
|
+
], TranslationModel.prototype, "lang", void 0);
|
|
467
|
+
__decorate([
|
|
468
|
+
FormInput(),
|
|
469
|
+
FormSerializable()
|
|
470
|
+
], TranslationModel.prototype, "translation", void 0);
|
|
471
|
+
|
|
412
472
|
class ConfigForSchemaWrap {
|
|
413
473
|
opts;
|
|
414
474
|
mode;
|
|
@@ -732,6 +792,14 @@ class DynamicFormBuilderService {
|
|
|
732
792
|
hooks: {},
|
|
733
793
|
expressions
|
|
734
794
|
};
|
|
795
|
+
const lang = items.find(i => i.key === "lang");
|
|
796
|
+
const translation = items.find(i => i.key === "translation");
|
|
797
|
+
if (lang && translation) {
|
|
798
|
+
// Use translation component if the sub items are correct
|
|
799
|
+
array.type = "translation";
|
|
800
|
+
setFieldHidden(lang);
|
|
801
|
+
setFieldProp(translation, "label", "");
|
|
802
|
+
}
|
|
735
803
|
this.setExpressions(array.fieldArray, options);
|
|
736
804
|
return array;
|
|
737
805
|
}
|
|
@@ -903,10 +971,10 @@ class DynamicFormBuilderService {
|
|
|
903
971
|
}
|
|
904
972
|
});
|
|
905
973
|
}
|
|
906
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
907
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
974
|
+
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 });
|
|
975
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormBuilderService });
|
|
908
976
|
}
|
|
909
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
977
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormBuilderService, decorators: [{
|
|
910
978
|
type: Injectable
|
|
911
979
|
}], ctorParameters: () => [{ type: i0.Injector }, { type: i2.EventsService }, { type: undefined, decorators: [{
|
|
912
980
|
type: Inject,
|
|
@@ -1275,10 +1343,10 @@ class DynamicFormSchemaService {
|
|
|
1275
1343
|
validators.itemsMaxValue = maxValueValidation(items.maximum, true);
|
|
1276
1344
|
}
|
|
1277
1345
|
}
|
|
1278
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1279
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
1346
|
+
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 });
|
|
1347
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormSchemaService });
|
|
1280
1348
|
}
|
|
1281
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1349
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormSchemaService, decorators: [{
|
|
1282
1350
|
type: Injectable
|
|
1283
1351
|
}], ctorParameters: () => [{ type: i2.OpenApiService }, { type: i0.Injector }, { type: DynamicFormBuilderService }] });
|
|
1284
1352
|
|
|
@@ -1418,10 +1486,10 @@ class DynamicFormService {
|
|
|
1418
1486
|
}
|
|
1419
1487
|
});
|
|
1420
1488
|
}
|
|
1421
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1422
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
1489
|
+
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 });
|
|
1490
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormService });
|
|
1423
1491
|
}
|
|
1424
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1492
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormService, decorators: [{
|
|
1425
1493
|
type: Injectable
|
|
1426
1494
|
}], ctorParameters: () => [{ type: DynamicFormSchemaService }, { type: DynamicFormBuilderService }, { type: i0.Injector }, { type: undefined, decorators: [{
|
|
1427
1495
|
type: Inject,
|
|
@@ -1493,12 +1561,12 @@ class AsyncSubmitDirective extends AsyncMethodBase {
|
|
|
1493
1561
|
getArgs(ev) {
|
|
1494
1562
|
return untracked(() => [this.form(), this.context(), ev]);
|
|
1495
1563
|
}
|
|
1496
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1497
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.
|
|
1564
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: AsyncSubmitDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
1565
|
+
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
1566
|
{ provide: AsyncMethodBase, useExisting: AsyncSubmitDirective }
|
|
1499
1567
|
], exportAs: ["async-submit"], usesInheritance: true, ngImport: i0 });
|
|
1500
1568
|
}
|
|
1501
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1569
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: AsyncSubmitDirective, decorators: [{
|
|
1502
1570
|
type: Directive,
|
|
1503
1571
|
args: [{
|
|
1504
1572
|
standalone: false,
|
|
@@ -1606,10 +1674,10 @@ class DynamicFieldType extends FieldType {
|
|
|
1606
1674
|
};
|
|
1607
1675
|
}
|
|
1608
1676
|
}
|
|
1609
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1610
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1677
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFieldType, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1678
|
+
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
1679
|
}
|
|
1612
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1680
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFieldType, decorators: [{
|
|
1613
1681
|
type: Component,
|
|
1614
1682
|
args: [{
|
|
1615
1683
|
standalone: false,
|
|
@@ -1699,10 +1767,10 @@ class DynamicFormComponent {
|
|
|
1699
1767
|
const field = this.getField(path);
|
|
1700
1768
|
return field?.formControl ?? null;
|
|
1701
1769
|
}
|
|
1702
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1703
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
1770
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormComponent, deps: [{ token: DynamicFormService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1771
|
+
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
1772
|
}
|
|
1705
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1773
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormComponent, decorators: [{
|
|
1706
1774
|
type: Component,
|
|
1707
1775
|
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
1776
|
}], ctorParameters: () => [{ type: DynamicFormService }] });
|
|
@@ -1716,9 +1784,9 @@ class DynamicFormArrayComponent extends FieldArrayType {
|
|
|
1716
1784
|
}
|
|
1717
1785
|
this.currentTab.set(0);
|
|
1718
1786
|
}
|
|
1719
|
-
addItem(i) {
|
|
1787
|
+
addItem(i, initialModel) {
|
|
1720
1788
|
i = i == null ? this.field.fieldGroup.length : i;
|
|
1721
|
-
this.add(i);
|
|
1789
|
+
this.add(i, initialModel);
|
|
1722
1790
|
this.currentTab.set(i);
|
|
1723
1791
|
}
|
|
1724
1792
|
removeItem(i) {
|
|
@@ -1726,46 +1794,86 @@ class DynamicFormArrayComponent extends FieldArrayType {
|
|
|
1726
1794
|
const length = this.field.fieldGroup.length;
|
|
1727
1795
|
this.currentTab.set(Math.min(this.currentTab(), length - 1));
|
|
1728
1796
|
}
|
|
1729
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1730
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
1797
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormArrayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1798
|
+
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
1799
|
}
|
|
1732
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1800
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormArrayComponent, decorators: [{
|
|
1733
1801
|
type: Component,
|
|
1734
1802
|
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
1803
|
}] });
|
|
1736
1804
|
|
|
1737
1805
|
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.
|
|
1806
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormChipsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1807
|
+
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
1808
|
}
|
|
1741
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1809
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormChipsComponent, decorators: [{
|
|
1742
1810
|
type: Component,
|
|
1743
1811
|
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
1812
|
}] });
|
|
1745
1813
|
|
|
1746
1814
|
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.
|
|
1815
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormStaticComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1816
|
+
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
1817
|
}
|
|
1750
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1818
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormStaticComponent, decorators: [{
|
|
1751
1819
|
type: Component,
|
|
1752
1820
|
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
1821
|
}] });
|
|
1754
1822
|
|
|
1823
|
+
class DynamicFormTranslationComponent extends DynamicFormArrayComponent {
|
|
1824
|
+
events;
|
|
1825
|
+
language;
|
|
1826
|
+
subscription;
|
|
1827
|
+
constructor(events, language) {
|
|
1828
|
+
super();
|
|
1829
|
+
this.events = events;
|
|
1830
|
+
this.language = language;
|
|
1831
|
+
}
|
|
1832
|
+
ngOnInit() {
|
|
1833
|
+
this.subscription = this.events.editLanguageChanged.subscribe(lang => this.setLanguage(lang));
|
|
1834
|
+
this.setLanguage(this.language.editLanguage);
|
|
1835
|
+
}
|
|
1836
|
+
ngOnDestroy() {
|
|
1837
|
+
this.subscription?.unsubscribe();
|
|
1838
|
+
}
|
|
1839
|
+
setLanguage(lang) {
|
|
1840
|
+
if (!this.formControl)
|
|
1841
|
+
return;
|
|
1842
|
+
const value = this.formControl.value || [];
|
|
1843
|
+
const index = value.findIndex(i => i.lang === lang);
|
|
1844
|
+
if (index < 0) {
|
|
1845
|
+
this.addItem(value.length, {
|
|
1846
|
+
lang, translation: ""
|
|
1847
|
+
});
|
|
1848
|
+
return;
|
|
1849
|
+
}
|
|
1850
|
+
this.currentTab.set(index);
|
|
1851
|
+
}
|
|
1852
|
+
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 });
|
|
1853
|
+
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 });
|
|
1854
|
+
}
|
|
1855
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormTranslationComponent, decorators: [{
|
|
1856
|
+
type: Component,
|
|
1857
|
+
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"] }]
|
|
1858
|
+
}], ctorParameters: () => [{ type: i2.EventsService }, { type: undefined, decorators: [{
|
|
1859
|
+
type: Inject,
|
|
1860
|
+
args: [LANGUAGE_SERVICE]
|
|
1861
|
+
}] }] });
|
|
1862
|
+
|
|
1755
1863
|
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.
|
|
1864
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormUploadComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1865
|
+
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
1866
|
}
|
|
1759
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1867
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormUploadComponent, decorators: [{
|
|
1760
1868
|
type: Component,
|
|
1761
1869
|
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
1870
|
}] });
|
|
1763
1871
|
|
|
1764
1872
|
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.
|
|
1873
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormWysiwygComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1874
|
+
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
1875
|
}
|
|
1768
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1876
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormWysiwygComponent, decorators: [{
|
|
1769
1877
|
type: Component,
|
|
1770
1878
|
args: [{ standalone: false, selector: "dynamic-form-wysiwyg", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<wysiwyg [formControl]=\"formControl\"\n [formlyAttributes]=\"field\">\n</wysiwyg>\n" }]
|
|
1771
1879
|
}] });
|
|
@@ -1774,37 +1882,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
1774
1882
|
* This is just a test wrapper component
|
|
1775
1883
|
*/
|
|
1776
1884
|
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.
|
|
1885
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormAlertComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1886
|
+
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
1887
|
}
|
|
1780
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1888
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormAlertComponent, decorators: [{
|
|
1781
1889
|
type: Component,
|
|
1782
1890
|
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
1891
|
}] });
|
|
1784
1892
|
|
|
1785
1893
|
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.
|
|
1894
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1895
|
+
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
1896
|
}
|
|
1789
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1897
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldComponent, decorators: [{
|
|
1790
1898
|
type: Component,
|
|
1791
1899
|
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
1900
|
}] });
|
|
1793
1901
|
|
|
1794
1902
|
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.
|
|
1903
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldsetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1904
|
+
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
1905
|
}
|
|
1798
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1906
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormFieldsetComponent, decorators: [{
|
|
1799
1907
|
type: Component,
|
|
1800
1908
|
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
1909
|
}] });
|
|
1802
1910
|
|
|
1803
1911
|
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.
|
|
1912
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1913
|
+
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
1914
|
}
|
|
1807
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1915
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormGroupComponent, decorators: [{
|
|
1808
1916
|
type: Component,
|
|
1809
1917
|
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
1918
|
}] });
|
|
@@ -1816,6 +1924,7 @@ const components = [
|
|
|
1816
1924
|
DynamicFormArrayComponent,
|
|
1817
1925
|
DynamicFormChipsComponent,
|
|
1818
1926
|
DynamicFormStaticComponent,
|
|
1927
|
+
DynamicFormTranslationComponent,
|
|
1819
1928
|
DynamicFormUploadComponent,
|
|
1820
1929
|
DynamicFormWysiwygComponent,
|
|
1821
1930
|
DynamicFormAlertComponent,
|
|
@@ -1839,6 +1948,7 @@ class NgxDynamicFormModule {
|
|
|
1839
1948
|
{ name: "array", component: DynamicFormArrayComponent },
|
|
1840
1949
|
{ name: "chips", component: DynamicFormChipsComponent },
|
|
1841
1950
|
{ name: "static", component: DynamicFormStaticComponent },
|
|
1951
|
+
{ name: "translation", component: DynamicFormTranslationComponent },
|
|
1842
1952
|
{ name: "upload", component: DynamicFormUploadComponent },
|
|
1843
1953
|
{ name: "wysiwyg", component: DynamicFormWysiwygComponent },
|
|
1844
1954
|
],
|
|
@@ -1868,18 +1978,18 @@ class NgxDynamicFormModule {
|
|
|
1868
1978
|
static provideForms(config) {
|
|
1869
1979
|
return makeEnvironmentProviders(NgxDynamicFormModule.getProviders(config));
|
|
1870
1980
|
}
|
|
1871
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1872
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
1981
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1982
|
+
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
1983
|
FormsModule,
|
|
1874
1984
|
ReactiveFormsModule,
|
|
1875
1985
|
NgxUtilsModule,
|
|
1876
1986
|
FormlyModule,
|
|
1877
|
-
FormlySelectModule], exports: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormStaticComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective, FormsModule,
|
|
1987
|
+
FormlySelectModule], exports: [DynamicFieldType, DynamicFormComponent, DynamicFormArrayComponent, DynamicFormChipsComponent, DynamicFormStaticComponent, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, DynamicFormAlertComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, AsyncSubmitDirective, FormsModule,
|
|
1878
1988
|
ReactiveFormsModule,
|
|
1879
1989
|
NgxUtilsModule,
|
|
1880
1990
|
FormlyModule,
|
|
1881
1991
|
FormlySelectModule] });
|
|
1882
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
1992
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, providers: [
|
|
1883
1993
|
...pipes
|
|
1884
1994
|
], imports: [CommonModule,
|
|
1885
1995
|
FormsModule,
|
|
@@ -1892,7 +2002,7 @@ class NgxDynamicFormModule {
|
|
|
1892
2002
|
FormlyModule,
|
|
1893
2003
|
FormlySelectModule] });
|
|
1894
2004
|
}
|
|
1895
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2005
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NgxDynamicFormModule, decorators: [{
|
|
1896
2006
|
type: NgModule,
|
|
1897
2007
|
args: [{
|
|
1898
2008
|
declarations: [
|
|
@@ -1928,5 +2038,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
1928
2038
|
* Generated bundle index. Do not edit.
|
|
1929
2039
|
*/
|
|
1930
2040
|
|
|
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 };
|
|
2041
|
+
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
2042
|
//# sourceMappingURL=stemy-ngx-dynamic-form.mjs.map
|