@abp/ng.components 10.2.0-rc.4 → 10.3.0-rc.1

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.
@@ -6,13 +6,13 @@ class ChartComponent {
6
6
  constructor() {
7
7
  this.el = inject(ElementRef);
8
8
  this.cdr = inject(ChangeDetectorRef);
9
- this.type = input.required(...(ngDevMode ? [{ debugName: "type" }] : []));
10
- this.data = input({}, ...(ngDevMode ? [{ debugName: "data" }] : []));
11
- this.options = input({}, ...(ngDevMode ? [{ debugName: "options" }] : []));
12
- this.plugins = input([], ...(ngDevMode ? [{ debugName: "plugins" }] : []));
13
- this.width = input(...(ngDevMode ? [undefined, { debugName: "width" }] : []));
14
- this.height = input(...(ngDevMode ? [undefined, { debugName: "height" }] : []));
15
- this.responsive = input(true, ...(ngDevMode ? [{ debugName: "responsive" }] : []));
9
+ this.type = input.required(...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
10
+ this.data = input({}, ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
11
+ this.options = input({}, ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
12
+ this.plugins = input([], ...(ngDevMode ? [{ debugName: "plugins" }] : /* istanbul ignore next */ []));
13
+ this.width = input(...(ngDevMode ? [undefined, { debugName: "width" }] : /* istanbul ignore next */ []));
14
+ this.height = input(...(ngDevMode ? [undefined, { debugName: "height" }] : /* istanbul ignore next */ []));
15
+ this.responsive = input(true, ...(ngDevMode ? [{ debugName: "responsive" }] : /* istanbul ignore next */ []));
16
16
  this.dataSelect = output();
17
17
  this.initialized = output();
18
18
  this.initChart = (data, options) => {
@@ -85,8 +85,8 @@ class ChartComponent {
85
85
  this.chart = null;
86
86
  }
87
87
  }
88
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
89
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: ChartComponent, isStandalone: true, selector: "abp-chart", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, plugins: { classPropertyName: "plugins", publicName: "plugins", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dataSelect: "dataSelect", initialized: "initialized" }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], exportAs: ["abpChart"], ngImport: i0, template: `
88
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
89
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", type: ChartComponent, isStandalone: true, selector: "abp-chart", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, plugins: { classPropertyName: "plugins", publicName: "plugins", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dataSelect: "dataSelect", initialized: "initialized" }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], exportAs: ["abpChart"], ngImport: i0, template: `
90
90
  <div
91
91
  style="position:relative"
92
92
  [style.width]="responsive() && !width() ? null : width()"
@@ -101,7 +101,7 @@ class ChartComponent {
101
101
  </div>
102
102
  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
103
103
  }
104
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ChartComponent, decorators: [{
104
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ChartComponent, decorators: [{
105
105
  type: Component,
106
106
  args: [{
107
107
  selector: 'abp-chart',
@@ -128,11 +128,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
128
128
  }] } });
129
129
 
130
130
  class ChartModule {
131
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
132
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.9", ngImport: i0, type: ChartModule, imports: [ChartComponent], exports: [ChartComponent] }); }
133
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ChartModule }); }
131
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
132
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.6", ngImport: i0, type: ChartModule, imports: [ChartComponent], exports: [ChartComponent] }); }
133
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ChartModule }); }
134
134
  }
135
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ChartModule, decorators: [{
135
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ChartModule, decorators: [{
136
136
  type: NgModule,
137
137
  args: [{
138
138
  imports: [ChartComponent],
@@ -1 +1 @@
1
- {"version":3,"file":"abp-ng.components-chart.js.mjs","sources":["../../../../packages/components/chart.js/src/chart.component.ts","../../../../packages/components/chart.js/src/chart.module.ts","../../../../packages/components/chart.js/src/widget-utils.ts","../../../../packages/components/chart.js/src/abp-ng.components-chart.js.ts"],"sourcesContent":["import {\r\n AfterViewInit,\r\n ChangeDetectionStrategy,\r\n ChangeDetectorRef,\r\n Component,\r\n ElementRef,\r\n OnDestroy,\r\n ViewChild,\r\n effect,\r\n inject,\r\n input,\r\n output,\r\n untracked,\r\n} from '@angular/core';\r\n\r\nlet Chart: any;\r\n\r\n@Component({\r\n selector: 'abp-chart',\r\n template: `\r\n <div\r\n style=\"position:relative\"\r\n [style.width]=\"responsive() && !width() ? null : width()\"\r\n [style.height]=\"responsive() && !height() ? null : height()\"\r\n >\r\n <canvas\r\n #canvas\r\n [attr.width]=\"responsive() && !width() ? null : width()\"\r\n [attr.height]=\"responsive() && !height() ? null : height()\"\r\n (click)=\"onCanvasClick($event)\"\r\n ></canvas>\r\n </div>\r\n `,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n exportAs: 'abpChart',\r\n})\r\nexport class ChartComponent implements AfterViewInit, OnDestroy {\r\n el = inject(ElementRef);\r\n private cdr = inject(ChangeDetectorRef);\r\n\r\n readonly type = input.required<string>();\r\n readonly data = input<any>({});\r\n readonly options = input<any>({});\r\n readonly plugins = input<any[]>([]);\r\n readonly width = input<string>();\r\n readonly height = input<string>();\r\n readonly responsive = input<boolean>(true);\r\n\r\n readonly dataSelect = output<any>();\r\n readonly initialized = output<boolean>();\r\n\r\n @ViewChild('canvas') canvas!: ElementRef<HTMLCanvasElement>;\r\n\r\n chart: any;\r\n\r\n constructor() {\r\n effect(() => {\r\n const data = this.data();\r\n const options = this.options();\r\n\r\n untracked(() => {\r\n if (!this.chart) return;\r\n this.chart.destroy();\r\n this.initChart(data, options);\r\n });\r\n });\r\n }\r\n\r\n ngAfterViewInit() {\r\n import('chart.js/auto').then(module => {\r\n Chart = module.default;\r\n this.initChart(this.data(), this.options());\r\n this.initialized.emit(true);\r\n });\r\n }\r\n\r\n onCanvasClick(event: MouseEvent) {\r\n if (this.chart) {\r\n const element = this.chart.getElementsAtEventForMode(\r\n event,\r\n 'nearest',\r\n { intersect: true },\r\n false,\r\n );\r\n const dataset = this.chart.getElementsAtEventForMode(\r\n event,\r\n 'dataset',\r\n { intersect: true },\r\n false,\r\n );\r\n\r\n if (element && element[0] && dataset) {\r\n this.dataSelect.emit({ originalEvent: event, element: element[0], dataset: dataset });\r\n }\r\n }\r\n }\r\n\r\n private initChart = (data: any, options: any) => {\r\n const opts = options || {};\r\n opts.responsive = this.responsive();\r\n\r\n // allows chart to resize in responsive mode\r\n if (opts.responsive && (this.height() || this.width())) {\r\n opts.maintainAspectRatio = false;\r\n }\r\n\r\n this.chart = new Chart(this.canvas.nativeElement, {\r\n type: this.type() as any,\r\n data: data,\r\n options: opts,\r\n plugins: this.plugins(),\r\n });\r\n };\r\n\r\n getCanvas = () => {\r\n return this.canvas.nativeElement;\r\n };\r\n\r\n getBase64Image = () => {\r\n return this.chart.toBase64Image();\r\n };\r\n\r\n generateLegend = () => {\r\n if (this.chart) {\r\n return this.chart.generateLegend();\r\n }\r\n };\r\n\r\n refresh = () => {\r\n if (this.chart) {\r\n this.chart.update();\r\n this.cdr.detectChanges();\r\n }\r\n };\r\n\r\n reinit = () => {\r\n if (!this.chart) return;\r\n this.chart.destroy();\r\n this.initChart(this.data(), this.options());\r\n };\r\n\r\n ngOnDestroy() {\r\n if (this.chart) {\r\n this.chart.destroy();\r\n this.chart = null;\r\n }\r\n }\r\n}\r\n\r\n","import { NgModule } from '@angular/core';\r\nimport { ChartComponent } from './chart.component';\r\n\r\n@NgModule({\r\n imports: [ChartComponent],\r\n exports: [ChartComponent],\r\n declarations: [],\r\n providers: [],\r\n})\r\nexport class ChartModule {}\r\n","export function getRandomBackgroundColor(count: number) {\r\n const colors = [];\r\n\r\n for (let i = 0; i < count; i++) {\r\n const r = ((i + 5) * (i + 5) * 474) % 255;\r\n const g = ((i + 5) * (i + 5) * 1600) % 255;\r\n const b = ((i + 5) * (i + 5) * 84065) % 255;\r\n colors.push('rgba(' + r + ', ' + g + ', ' + b + ', 0.7)');\r\n }\r\n\r\n return colors;\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"abp-ng.components-chart.js.mjs","sources":["../../../../packages/components/chart.js/src/chart.component.ts","../../../../packages/components/chart.js/src/chart.module.ts","../../../../packages/components/chart.js/src/widget-utils.ts","../../../../packages/components/chart.js/src/abp-ng.components-chart.js.ts"],"sourcesContent":["import {\r\n AfterViewInit,\r\n ChangeDetectionStrategy,\r\n ChangeDetectorRef,\r\n Component,\r\n ElementRef,\r\n OnDestroy,\r\n ViewChild,\r\n effect,\r\n inject,\r\n input,\r\n output,\r\n untracked,\r\n} from '@angular/core';\r\n\r\nlet Chart: any;\r\n\r\n@Component({\r\n selector: 'abp-chart',\r\n template: `\r\n <div\r\n style=\"position:relative\"\r\n [style.width]=\"responsive() && !width() ? null : width()\"\r\n [style.height]=\"responsive() && !height() ? null : height()\"\r\n >\r\n <canvas\r\n #canvas\r\n [attr.width]=\"responsive() && !width() ? null : width()\"\r\n [attr.height]=\"responsive() && !height() ? null : height()\"\r\n (click)=\"onCanvasClick($event)\"\r\n ></canvas>\r\n </div>\r\n `,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n exportAs: 'abpChart',\r\n})\r\nexport class ChartComponent implements AfterViewInit, OnDestroy {\r\n el = inject(ElementRef);\r\n private cdr = inject(ChangeDetectorRef);\r\n\r\n readonly type = input.required<string>();\r\n readonly data = input<any>({});\r\n readonly options = input<any>({});\r\n readonly plugins = input<any[]>([]);\r\n readonly width = input<string>();\r\n readonly height = input<string>();\r\n readonly responsive = input<boolean>(true);\r\n\r\n readonly dataSelect = output<any>();\r\n readonly initialized = output<boolean>();\r\n\r\n @ViewChild('canvas') canvas!: ElementRef<HTMLCanvasElement>;\r\n\r\n chart: any;\r\n\r\n constructor() {\r\n effect(() => {\r\n const data = this.data();\r\n const options = this.options();\r\n\r\n untracked(() => {\r\n if (!this.chart) return;\r\n this.chart.destroy();\r\n this.initChart(data, options);\r\n });\r\n });\r\n }\r\n\r\n ngAfterViewInit() {\r\n import('chart.js/auto').then(module => {\r\n Chart = module.default;\r\n this.initChart(this.data(), this.options());\r\n this.initialized.emit(true);\r\n });\r\n }\r\n\r\n onCanvasClick(event: MouseEvent) {\r\n if (this.chart) {\r\n const element = this.chart.getElementsAtEventForMode(\r\n event,\r\n 'nearest',\r\n { intersect: true },\r\n false,\r\n );\r\n const dataset = this.chart.getElementsAtEventForMode(\r\n event,\r\n 'dataset',\r\n { intersect: true },\r\n false,\r\n );\r\n\r\n if (element && element[0] && dataset) {\r\n this.dataSelect.emit({ originalEvent: event, element: element[0], dataset: dataset });\r\n }\r\n }\r\n }\r\n\r\n private initChart = (data: any, options: any) => {\r\n const opts = options || {};\r\n opts.responsive = this.responsive();\r\n\r\n // allows chart to resize in responsive mode\r\n if (opts.responsive && (this.height() || this.width())) {\r\n opts.maintainAspectRatio = false;\r\n }\r\n\r\n this.chart = new Chart(this.canvas.nativeElement, {\r\n type: this.type() as any,\r\n data: data,\r\n options: opts,\r\n plugins: this.plugins(),\r\n });\r\n };\r\n\r\n getCanvas = () => {\r\n return this.canvas.nativeElement;\r\n };\r\n\r\n getBase64Image = () => {\r\n return this.chart.toBase64Image();\r\n };\r\n\r\n generateLegend = () => {\r\n if (this.chart) {\r\n return this.chart.generateLegend();\r\n }\r\n };\r\n\r\n refresh = () => {\r\n if (this.chart) {\r\n this.chart.update();\r\n this.cdr.detectChanges();\r\n }\r\n };\r\n\r\n reinit = () => {\r\n if (!this.chart) return;\r\n this.chart.destroy();\r\n this.initChart(this.data(), this.options());\r\n };\r\n\r\n ngOnDestroy() {\r\n if (this.chart) {\r\n this.chart.destroy();\r\n this.chart = null;\r\n }\r\n }\r\n}\r\n\r\n","import { NgModule } from '@angular/core';\r\nimport { ChartComponent } from './chart.component';\r\n\r\n@NgModule({\r\n imports: [ChartComponent],\r\n exports: [ChartComponent],\r\n declarations: [],\r\n providers: [],\r\n})\r\nexport class ChartModule {}\r\n","export function getRandomBackgroundColor(count: number) {\r\n const colors = [];\r\n\r\n for (let i = 0; i < count; i++) {\r\n const r = ((i + 5) * (i + 5) * 474) % 255;\r\n const g = ((i + 5) * (i + 5) * 1600) % 255;\r\n const b = ((i + 5) * (i + 5) * 84065) % 255;\r\n colors.push('rgba(' + r + ', ' + g + ', ' + b + ', 0.7)');\r\n }\r\n\r\n return colors;\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
@@ -109,10 +109,10 @@ class DynamicFormService {
109
109
  return '';
110
110
  }
111
111
  }
112
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
113
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormService, providedIn: 'root' }); }
112
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
113
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormService, providedIn: 'root' }); }
114
114
  }
115
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormService, decorators: [{
115
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormService, decorators: [{
116
116
  type: Injectable,
117
117
  args: [{
118
118
  providedIn: 'root'
@@ -145,8 +145,8 @@ class DynamicFormFieldComponent {
145
145
  return `${this.fieldId}-help`;
146
146
  }
147
147
  constructor() {
148
- this.field = input.required(...(ngDevMode ? [{ debugName: "field" }] : []));
149
- this.visible = input(true, ...(ngDevMode ? [{ debugName: "visible" }] : []));
148
+ this.field = input.required(...(ngDevMode ? [{ debugName: "field" }] : /* istanbul ignore next */ []));
149
+ this.visible = input(true, ...(ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []));
150
150
  this.changeDetectorRef = inject(ChangeDetectorRef);
151
151
  this.destroyRef = inject(DestroyRef);
152
152
  this.injector = inject(Injector);
@@ -245,13 +245,13 @@ class DynamicFormFieldComponent {
245
245
  this.onChange(value);
246
246
  }
247
247
  }
248
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
249
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: DynamicFormFieldComponent, isStandalone: true, selector: "abp-dynamic-form-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "abp-dynamic-form-field" }, providers: [
248
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
249
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: DynamicFormFieldComponent, isStandalone: true, selector: "abp-dynamic-form-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "abp-dynamic-form-field" }, providers: [
250
250
  { provide: ABP_DYNAMIC_FORM_FIELD, useExisting: DynamicFormFieldComponent },
251
251
  DYNAMIC_FORM_FIELD_CONTROL_VALUE_ACCESSOR,
252
252
  ], exportAs: ["abpDynamicFormField"], ngImport: i0, template: "@if (visible()) {\r\n<div [formGroup]=\"fieldFormGroup\" role=\"group\" [attr.aria-labelledby]=\"fieldId + '-label'\">\r\n \r\n <!-- NOTE: Group and Array types are NOT rendered here, they should be rendered at parent level -->\r\n <!-- This component only handles leaf/primitive field types -->\r\n \r\n @if (field().type === 'text') {\r\n <!-- Text Input -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <input \r\n [id]=\"fieldId\"\r\n [placeholder]=\"(field().placeholder || '') | abpLocalization\" \r\n formControlName=\"value\"\r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\">\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'select') {\r\n <!-- Select Dropdown -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <select \r\n [id]=\"fieldId\"\r\n formControlName=\"value\" \r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\">\r\n <option value=\"\">{{ '::Select' | abpLocalization }}</option>\r\n @for (option of options$ | async; track option.key) {\r\n <option [value]=\"option.key\">\r\n {{ option.value | abpLocalization }}\r\n </option>\r\n }\r\n </select>\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'checkbox') {\r\n <!-- Checkbox -->\r\n <div class=\"form-group form-check mb-3\" role=\"group\">\r\n <abp-checkbox \r\n [label]=\"field().label | abpLocalization\" \r\n formControlName=\"value\" \r\n [id]=\"fieldId\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\" />\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'email') {\r\n <!-- Email Input -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <input \r\n type=\"email\" \r\n [id]=\"fieldId\"\r\n formControlName=\"value\"\r\n [placeholder]=\"(field().placeholder || '') | abpLocalization\" \r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\"\r\n autocomplete=\"email\">\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'textarea') {\r\n <!-- Textarea -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <textarea \r\n [id]=\"fieldId\"\r\n formControlName=\"value\" \r\n [placeholder]=\"(field().placeholder || '') | abpLocalization\"\r\n [class.is-invalid]=\"isInvalid\" \r\n rows=\"4\" \r\n class=\"form-control\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\">\r\n </textarea>\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'number') {\r\n <!-- Number Input -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <input \r\n type=\"number\" \r\n [id]=\"fieldId\"\r\n formControlName=\"value\"\r\n [placeholder]=\"(field().placeholder || '') | abpLocalization\" \r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.min]=\"field().min || null\"\r\n [attr.max]=\"field().max || null\"\r\n [attr.step]=\"field().step || null\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\">\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'date') {\r\n <!-- Date Input -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <input \r\n type=\"date\" \r\n [id]=\"fieldId\"\r\n formControlName=\"value\"\r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.min]=\"field().min || null\"\r\n [attr.max]=\"field().max || null\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\">\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'datetime-local') {\r\n <!-- DateTime Local Input -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <input \r\n type=\"datetime-local\" \r\n [id]=\"fieldId\"\r\n formControlName=\"value\"\r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.min]=\"field().min || null\"\r\n [attr.max]=\"field().max || null\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\">\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'time') {\r\n <!-- Time Input -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <input \r\n type=\"time\" \r\n [id]=\"fieldId\"\r\n formControlName=\"value\"\r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.min]=\"field().min || null\"\r\n [attr.max]=\"field().max || null\"\r\n [attr.step]=\"field().step || null\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\">\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'password') {\r\n <!-- Password Input -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <input \r\n type=\"password\" \r\n [id]=\"fieldId\"\r\n formControlName=\"value\"\r\n [placeholder]=\"(field().placeholder || '') | abpLocalization\" \r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.minlength]=\"field().minLength || null\"\r\n [attr.maxlength]=\"field().maxLength || null\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\"\r\n autocomplete=\"new-password\">\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'tel') {\r\n <!-- Tel Input -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <input \r\n type=\"tel\" \r\n [id]=\"fieldId\"\r\n formControlName=\"value\"\r\n [placeholder]=\"(field().placeholder || '') | abpLocalization\" \r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.pattern]=\"field().pattern || null\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\"\r\n autocomplete=\"tel\">\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'url') {\r\n <!-- URL Input -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <input \r\n type=\"url\" \r\n [id]=\"fieldId\"\r\n formControlName=\"value\"\r\n [placeholder]=\"(field().placeholder || '') | abpLocalization\" \r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\"\r\n autocomplete=\"url\">\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'radio') {\r\n <!-- Radio Group -->\r\n <div class=\"form-group mb-3\" role=\"radiogroup\" [attr.aria-labelledby]=\"fieldId + '-label'\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <div class=\"radio-group\">\r\n @for (option of options$ | async; track option.key) {\r\n <div class=\"form-check\">\r\n <input \r\n type=\"radio\" \r\n [id]=\"fieldId + '-' + option.key\"\r\n [value]=\"option.key\"\r\n formControlName=\"value\"\r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-check-input\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\">\r\n <label [for]=\"fieldId + '-' + option.key\" class=\"form-check-label\">\r\n {{ option.value | abpLocalization }}\r\n </label>\r\n </div>\r\n }\r\n </div>\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'file') {\r\n <!-- File Input -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <input \r\n type=\"file\" \r\n [id]=\"fieldId\"\r\n (change)=\"onFileChange($event)\"\r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control\"\r\n [attr.accept]=\"field().accept || null\"\r\n [attr.multiple]=\"field().multiple || null\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\">\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'range') {\r\n <!-- Range Slider -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <input \r\n type=\"range\" \r\n [id]=\"fieldId\"\r\n formControlName=\"value\"\r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-range flex-grow-1\"\r\n [attr.min]=\"field().min || 0\"\r\n [attr.max]=\"field().max || 100\"\r\n [attr.step]=\"field().step || 1\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\"\r\n [attr.aria-valuenow]=\"value.value\"\r\n [attr.aria-valuemin]=\"field().min || 0\"\r\n [attr.aria-valuemax]=\"field().max || 100\">\r\n <output [for]=\"fieldId\" class=\"badge bg-primary\">{{ value.value }}</output>\r\n </div>\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n } @else if (field().type === 'color') {\r\n <!-- Color Picker -->\r\n <div class=\"form-group mb-3\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" />\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <input \r\n type=\"color\" \r\n [id]=\"fieldId\"\r\n formControlName=\"value\"\r\n [class.is-invalid]=\"isInvalid\" \r\n class=\"form-control form-control-color\"\r\n [attr.aria-required]=\"field().required || null\"\r\n [attr.aria-invalid]=\"isInvalid || null\"\r\n [attr.aria-describedby]=\"isInvalid ? errorId : null\"\r\n [attr.aria-label]=\"field().label | abpLocalization\">\r\n <code class=\"text-muted\">{{ value.value || '#000000' }}</code>\r\n </div>\r\n @if (isInvalid) {\r\n <ng-container [ngTemplateOutlet]=\"errorTemplate\" />\r\n }\r\n </div>\r\n }\r\n</div>\r\n}\r\n\r\n<ng-template #labelTemplate>\r\n <label \r\n [for]=\"fieldId\"\r\n [id]=\"fieldId + '-label'\"\r\n [class.required]=\"field().required\">\r\n {{ field().label | abpLocalization }}\r\n @if (field().required) {\r\n <span class=\"text-danger\" aria-label=\"required\">*</span>\r\n }\r\n </label>\r\n</ng-template>\r\n\r\n<ng-template #errorTemplate>\r\n <div \r\n class=\"invalid-feedback\" \r\n [id]=\"errorId\"\r\n role=\"alert\"\r\n aria-live=\"polite\"\r\n aria-atomic=\"true\">\r\n @for (error of errors; track error) {\r\n <div>{{ error | abpLocalization }}</div>\r\n }\r\n </div>\r\n</ng-template>", styles: [".form-group{display:flex;flex-direction:column}.form-group .radio-group{display:flex;flex-direction:column;gap:.5rem}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormCheckboxComponent, selector: "abp-checkbox", inputs: ["label", "labelClass", "checkboxId", "checkboxStyle", "checkboxClass", "checkboxReadonly"], outputs: ["checkboxBlur", "checkboxFocus"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
253
253
  }
254
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormFieldComponent, decorators: [{
254
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormFieldComponent, decorators: [{
255
255
  type: Component,
256
256
  args: [{ selector: 'abp-dynamic-form-field', providers: [
257
257
  { provide: ABP_DYNAMIC_FORM_FIELD, useExisting: DynamicFormFieldComponent },
@@ -261,8 +261,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
261
261
 
262
262
  class DynamicFieldHostComponent {
263
263
  constructor() {
264
- this.component = input(...(ngDevMode ? [undefined, { debugName: "component" }] : []));
265
- this.inputs = input({}, ...(ngDevMode ? [{ debugName: "inputs" }] : []));
264
+ this.component = input(...(ngDevMode ? [undefined, { debugName: "component" }] : /* istanbul ignore next */ []));
265
+ this.inputs = input({}, ...(ngDevMode ? [{ debugName: "inputs" }] : /* istanbul ignore next */ []));
266
266
  this.viewContainerRef = viewChild.required('vcRef', { read: ViewContainerRef });
267
267
  this.disabled = false;
268
268
  // if child has not implemented ControlValueAccessor. Create form control
@@ -349,14 +349,14 @@ class DynamicFieldHostComponent {
349
349
  isDisabled ? inst.formControl.disable({ emitEvent: false }) : inst.formControl.enable({ emitEvent: false });
350
350
  }
351
351
  }
352
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFieldHostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
353
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.9", type: DynamicFieldHostComponent, isStandalone: true, selector: "abp-dynamic-form-field-host", inputs: { component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: false, transformFunction: null }, inputs: { classPropertyName: "inputs", publicName: "inputs", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{
352
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFieldHostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
353
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.6", type: DynamicFieldHostComponent, isStandalone: true, selector: "abp-dynamic-form-field-host", inputs: { component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: false, transformFunction: null }, inputs: { classPropertyName: "inputs", publicName: "inputs", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{
354
354
  provide: NG_VALUE_ACCESSOR,
355
355
  useExisting: forwardRef(() => DynamicFieldHostComponent),
356
356
  multi: true
357
357
  }], viewQueries: [{ propertyName: "viewContainerRef", first: true, predicate: ["vcRef"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: `<ng-template #vcRef></ng-template>`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
358
358
  }
359
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFieldHostComponent, decorators: [{
359
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFieldHostComponent, decorators: [{
360
360
  type: Component,
361
361
  args: [{
362
362
  selector: 'abp-dynamic-form-field-host',
@@ -373,9 +373,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
373
373
 
374
374
  class DynamicFormArrayComponent {
375
375
  constructor() {
376
- this.arrayConfig = input.required(...(ngDevMode ? [{ debugName: "arrayConfig" }] : []));
377
- this.formGroup = input.required(...(ngDevMode ? [{ debugName: "formGroup" }] : []));
378
- this.visible = input(true, ...(ngDevMode ? [{ debugName: "visible" }] : []));
376
+ this.arrayConfig = input.required(...(ngDevMode ? [{ debugName: "arrayConfig" }] : /* istanbul ignore next */ []));
377
+ this.formGroup = input.required(...(ngDevMode ? [{ debugName: "formGroup" }] : /* istanbul ignore next */ []));
378
+ this.visible = input(true, ...(ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []));
379
379
  this.fb = inject(FormBuilder);
380
380
  this.dynamicFormService = inject(DynamicFormService);
381
381
  this.cdr = inject(ChangeDetectorRef);
@@ -417,10 +417,10 @@ class DynamicFormArrayComponent {
417
417
  trackByIndex(index) {
418
418
  return index;
419
419
  }
420
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormArrayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
421
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: DynamicFormArrayComponent, isStandalone: true, selector: "abp-dynamic-form-array", inputs: { arrayConfig: { classPropertyName: "arrayConfig", publicName: "arrayConfig", isSignal: true, isRequired: true, transformFunction: null }, formGroup: { classPropertyName: "formGroup", publicName: "formGroup", isSignal: true, isRequired: true, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (visible()) {\r\n <div class=\"form-array-container\" role=\"region\" [attr.aria-label]=\"arrayConfig().label | abpLocalization\">\r\n \r\n <!-- Header with Add Button -->\r\n <div class=\"array-header d-flex justify-content-between align-items-center mb-3\">\r\n <label class=\"form-array-label\">\r\n {{ arrayConfig().label | abpLocalization }}\r\n @if (arrayConfig().required) {\r\n <span class=\"text-danger\" aria-label=\"required\">*</span>\r\n }\r\n </label>\r\n <button \r\n type=\"button\" \r\n class=\"btn btn-sm btn-primary\"\r\n (click)=\"addItem()\"\r\n [disabled]=\"!canAddItem\"\r\n [attr.aria-label]=\"'Add ' + (arrayConfig().label | abpLocalization)\">\r\n <i class=\"fa fa-plus me-1\"></i>\r\n {{ '::Add' | abpLocalization }}\r\n </button>\r\n </div>\r\n\r\n <!-- Array Items -->\r\n <div class=\"array-items\" role=\"list\">\r\n @for (item of formArray.controls; track trackByIndex($index)) {\r\n <div class=\"array-item border rounded p-3 mb-3\" role=\"listitem\" [formGroup]=\"getItemFormGroup($index)\">\r\n \r\n <!-- Item Header -->\r\n <div class=\"item-header d-flex justify-content-between align-items-center mb-3\">\r\n <strong class=\"item-title\">\r\n {{ arrayConfig().label | abpLocalization }} #{{ $index + 1 }}\r\n </strong>\r\n <button \r\n type=\"button\" \r\n class=\"btn btn-sm btn-danger\"\r\n (click)=\"removeItem($index)\"\r\n [disabled]=\"!canRemoveItem\"\r\n [attr.aria-label]=\"'Remove ' + (arrayConfig().label | abpLocalization) + ' #' + ($index + 1)\">\r\n <i class=\"fa fa-trash me-1\"></i>\r\n {{ '::Remove' | abpLocalization }}\r\n </button>\r\n </div>\r\n\r\n <!-- Item Fields -->\r\n <div class=\"row\">\r\n @for (field of sortedChildren; track field.key) {\r\n <div [ngClass]=\"'col-md-' + (field.gridSize || 12)\">\r\n \r\n <!-- Nested Group -->\r\n @if (field.type === 'group') {\r\n <abp-dynamic-form-group\r\n [groupConfig]=\"field\"\r\n [formGroup]=\"getNestedFormGroup($index, field.key)\" />\r\n }\r\n \r\n <!-- Nested Array (recursive) -->\r\n @else if (field.type === 'array') {\r\n <abp-dynamic-form-array\r\n [arrayConfig]=\"field\"\r\n [formGroup]=\"getItemFormGroup($index)\" />\r\n }\r\n \r\n <!-- Regular Field -->\r\n @else {\r\n <abp-dynamic-form-field\r\n [field]=\"field\"\r\n [formControlName]=\"field.key\" />\r\n }\r\n \r\n </div>\r\n }\r\n </div>\r\n </div>\r\n } @empty {\r\n <div class=\"alert alert-info\" role=\"status\">\r\n <i class=\"fa fa-info-circle me-2\"></i>\r\n {{ '::NoItemsAdded' | abpLocalization }}\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Item Count -->\r\n <div class=\"array-footer text-muted small\" aria-live=\"polite\" aria-atomic=\"true\">\r\n {{ formArray.length }} {{ '::Items' | abpLocalization }}\r\n @if (arrayConfig().minItems) {\r\n ({{ '::Min' | abpLocalization }}: {{ arrayConfig().minItems }})\r\n }\r\n @if (arrayConfig().maxItems) {\r\n ({{ '::Max' | abpLocalization }}: {{ arrayConfig().maxItems }})\r\n }\r\n </div>\r\n </div>\r\n}\r\n", styles: [".form-array-container{margin-bottom:1.5rem}.array-header{border-bottom:2px solid var(--bs-primary, #007bff);padding-bottom:.5rem}.form-array-label{font-size:1.1rem;font-weight:600;color:var(--bs-dark, #212529);margin-bottom:0}.array-items{margin-top:1rem}.array-item{background-color:var(--bs-white, #fff);transition:all .2s ease;position:relative}.array-item:hover{box-shadow:0 .125rem .25rem #00000013;transform:translateY(-1px)}.array-item .array-item{background-color:var(--bs-light, #f8f9fa)}.item-header{border-bottom:1px solid var(--bs-border-color, #dee2e6);padding-bottom:.75rem}.item-title{color:var(--bs-primary, #007bff);font-size:.95rem}.array-footer{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--bs-border-color, #dee2e6)}button:focus-visible{outline:2px solid var(--bs-primary, #007bff);outline-offset:2px}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.array-item{animation:slideIn .3s ease}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => DynamicFormArrayComponent), selector: "abp-dynamic-form-array", inputs: ["arrayConfig", "formGroup", "visible"] }, { kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i1.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "directive", type: i0.forwardRef(() => i2.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i2.NgControlStatusGroup), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(() => i2.FormGroupDirective), selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => i2.FormControlName), selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i0.forwardRef(() => DynamicFormFieldComponent), selector: "abp-dynamic-form-field", inputs: ["field", "visible"], exportAs: ["abpDynamicFormField"] }, { kind: "component", type: i0.forwardRef(() => DynamicFormGroupComponent), selector: "abp-dynamic-form-group", inputs: ["groupConfig", "formGroup", "visible"] }, { kind: "pipe", type: i0.forwardRef(() => LocalizationPipe), name: "abpLocalization" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
420
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormArrayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
421
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: DynamicFormArrayComponent, isStandalone: true, selector: "abp-dynamic-form-array", inputs: { arrayConfig: { classPropertyName: "arrayConfig", publicName: "arrayConfig", isSignal: true, isRequired: true, transformFunction: null }, formGroup: { classPropertyName: "formGroup", publicName: "formGroup", isSignal: true, isRequired: true, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (visible()) {\r\n <div class=\"form-array-container\" role=\"region\" [attr.aria-label]=\"arrayConfig().label | abpLocalization\">\r\n \r\n <!-- Header with Add Button -->\r\n <div class=\"array-header d-flex justify-content-between align-items-center mb-3\">\r\n <label class=\"form-array-label\">\r\n {{ arrayConfig().label | abpLocalization }}\r\n @if (arrayConfig().required) {\r\n <span class=\"text-danger\" aria-label=\"required\">*</span>\r\n }\r\n </label>\r\n <button \r\n type=\"button\" \r\n class=\"btn btn-sm btn-primary\"\r\n (click)=\"addItem()\"\r\n [disabled]=\"!canAddItem\"\r\n [attr.aria-label]=\"'Add ' + (arrayConfig().label | abpLocalization)\">\r\n <i class=\"fa fa-plus me-1\"></i>\r\n {{ '::Add' | abpLocalization }}\r\n </button>\r\n </div>\r\n\r\n <!-- Array Items -->\r\n <div class=\"array-items\" role=\"list\">\r\n @for (item of formArray.controls; track trackByIndex($index)) {\r\n <div class=\"array-item border rounded p-3 mb-3\" role=\"listitem\" [formGroup]=\"getItemFormGroup($index)\">\r\n \r\n <!-- Item Header -->\r\n <div class=\"item-header d-flex justify-content-between align-items-center mb-3\">\r\n <strong class=\"item-title\">\r\n {{ arrayConfig().label | abpLocalization }} #{{ $index + 1 }}\r\n </strong>\r\n <button \r\n type=\"button\" \r\n class=\"btn btn-sm btn-danger\"\r\n (click)=\"removeItem($index)\"\r\n [disabled]=\"!canRemoveItem\"\r\n [attr.aria-label]=\"'Remove ' + (arrayConfig().label | abpLocalization) + ' #' + ($index + 1)\">\r\n <i class=\"fa fa-trash me-1\"></i>\r\n {{ '::Remove' | abpLocalization }}\r\n </button>\r\n </div>\r\n\r\n <!-- Item Fields -->\r\n <div class=\"row\">\r\n @for (field of sortedChildren; track field.key) {\r\n <div [ngClass]=\"'col-md-' + (field.gridSize || 12)\">\r\n \r\n <!-- Nested Group -->\r\n @if (field.type === 'group') {\r\n <abp-dynamic-form-group\r\n [groupConfig]=\"field\"\r\n [formGroup]=\"getNestedFormGroup($index, field.key)\" />\r\n }\r\n \r\n <!-- Nested Array (recursive) -->\r\n @else if (field.type === 'array') {\r\n <abp-dynamic-form-array\r\n [arrayConfig]=\"field\"\r\n [formGroup]=\"getItemFormGroup($index)\" />\r\n }\r\n \r\n <!-- Regular Field -->\r\n @else {\r\n <abp-dynamic-form-field\r\n [field]=\"field\"\r\n [formControlName]=\"field.key\" />\r\n }\r\n \r\n </div>\r\n }\r\n </div>\r\n </div>\r\n } @empty {\r\n <div class=\"alert alert-info\" role=\"status\">\r\n <i class=\"fa fa-info-circle me-2\"></i>\r\n {{ '::NoItemsAdded' | abpLocalization }}\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- Item Count -->\r\n <div class=\"array-footer text-muted small\" aria-live=\"polite\" aria-atomic=\"true\">\r\n {{ formArray.length }} {{ '::Items' | abpLocalization }}\r\n @if (arrayConfig().minItems) {\r\n ({{ '::Min' | abpLocalization }}: {{ arrayConfig().minItems }})\r\n }\r\n @if (arrayConfig().maxItems) {\r\n ({{ '::Max' | abpLocalization }}: {{ arrayConfig().maxItems }})\r\n }\r\n </div>\r\n </div>\r\n}\r\n", styles: [".form-array-container{margin-bottom:1.5rem}.array-header{border-bottom:2px solid var(--bs-primary, #007bff);padding-bottom:.5rem}.form-array-label{font-size:1.1rem;font-weight:600;color:var(--bs-dark, #212529);margin-bottom:0}.array-items{margin-top:1rem}.array-item{background-color:var(--bs-white, #fff);transition:all .2s ease;position:relative}.array-item:hover{box-shadow:0 .125rem .25rem #00000013;transform:translateY(-1px)}.array-item .array-item{background-color:var(--bs-light, #f8f9fa)}.item-header{border-bottom:1px solid var(--bs-border-color, #dee2e6);padding-bottom:.75rem}.item-title{color:var(--bs-primary, #007bff);font-size:.95rem}.array-footer{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--bs-border-color, #dee2e6)}button:focus-visible{outline:2px solid var(--bs-primary, #007bff);outline-offset:2px}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.array-item{animation:slideIn .3s ease}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => DynamicFormArrayComponent), selector: "abp-dynamic-form-array", inputs: ["arrayConfig", "formGroup", "visible"] }, { kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i1.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "directive", type: i0.forwardRef(() => i2.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i2.NgControlStatusGroup), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(() => i2.FormGroupDirective), selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => i2.FormControlName), selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i0.forwardRef(() => DynamicFormFieldComponent), selector: "abp-dynamic-form-field", inputs: ["field", "visible"], exportAs: ["abpDynamicFormField"] }, { kind: "component", type: i0.forwardRef(() => DynamicFormGroupComponent), selector: "abp-dynamic-form-group", inputs: ["groupConfig", "formGroup", "visible"] }, { kind: "pipe", type: i0.forwardRef(() => LocalizationPipe), name: "abpLocalization" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
422
422
  }
423
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormArrayComponent, decorators: [{
423
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormArrayComponent, decorators: [{
424
424
  type: Component,
425
425
  args: [{ selector: 'abp-dynamic-form-array', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
426
426
  CommonModule,
@@ -434,9 +434,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
434
434
 
435
435
  class DynamicFormGroupComponent {
436
436
  constructor() {
437
- this.groupConfig = input.required(...(ngDevMode ? [{ debugName: "groupConfig" }] : []));
438
- this.formGroup = input.required(...(ngDevMode ? [{ debugName: "formGroup" }] : []));
439
- this.visible = input(true, ...(ngDevMode ? [{ debugName: "visible" }] : []));
437
+ this.groupConfig = input.required(...(ngDevMode ? [{ debugName: "groupConfig" }] : /* istanbul ignore next */ []));
438
+ this.formGroup = input.required(...(ngDevMode ? [{ debugName: "formGroup" }] : /* istanbul ignore next */ []));
439
+ this.visible = input(true, ...(ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []));
440
440
  }
441
441
  get sortedChildren() {
442
442
  const children = this.groupConfig().children || [];
@@ -448,10 +448,10 @@ class DynamicFormGroupComponent {
448
448
  getChildControl(key) {
449
449
  return this.formGroup().get(key);
450
450
  }
451
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
452
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: DynamicFormGroupComponent, isStandalone: true, selector: "abp-dynamic-form-group", inputs: { groupConfig: { classPropertyName: "groupConfig", publicName: "groupConfig", isSignal: true, isRequired: true, transformFunction: null }, formGroup: { classPropertyName: "formGroup", publicName: "formGroup", isSignal: true, isRequired: true, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (visible()) {\r\n <fieldset class=\"form-group-container\" [formGroup]=\"formGroup()\" role=\"group\" [attr.aria-labelledby]=\"groupConfig().key + '-legend'\">\r\n <legend [id]=\"groupConfig().key + '-legend'\" class=\"form-group-legend\">\r\n {{ groupConfig().label | abpLocalization }}\r\n </legend>\r\n \r\n <div class=\"row\">\r\n @for (field of sortedChildren; track field.key) {\r\n <div [ngClass]=\"'col-md-' + (field.gridSize || 12)\">\r\n \r\n <!-- Nested Group (Recursive) -->\r\n @if (field.type === 'group') {\r\n <abp-dynamic-form-group\r\n [groupConfig]=\"field\"\r\n [formGroup]=\"getChildFormGroup(field.key)\" />\r\n }\r\n \r\n <!-- Nested Array -->\r\n @else if (field.type === 'array') {\r\n <abp-dynamic-form-array\r\n [arrayConfig]=\"field\"\r\n [formGroup]=\"formGroup()\" />\r\n }\r\n \r\n <!-- Regular Field -->\r\n @else {\r\n <abp-dynamic-form-field\r\n [field]=\"field\"\r\n [formControlName]=\"field.key\" />\r\n }\r\n \r\n </div>\r\n }\r\n </div>\r\n </fieldset>\r\n}\r\n", styles: [".form-group-container{border-left:3px solid var(--bs-primary, #007bff);padding-left:1rem;margin-bottom:1.5rem;border:1px solid var(--bs-border-color, #dee2e6);border-radius:.375rem;padding:1rem;background-color:var(--bs-light, #f8f9fa)}.form-group-container .form-group-container{border-left-color:var(--bs-secondary, #6c757d);padding-left:.75rem;background-color:var(--bs-white, #fff)}.form-group-legend{font-size:1.1rem;font-weight:600;color:var(--bs-primary, #007bff);margin-bottom:1rem;padding:0 .5rem;float:none;width:auto}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => DynamicFormGroupComponent), selector: "abp-dynamic-form-group", inputs: ["groupConfig", "formGroup", "visible"] }, { kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i1.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "directive", type: i0.forwardRef(() => i2.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i2.NgControlStatusGroup), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(() => i2.FormGroupDirective), selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => i2.FormControlName), selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i0.forwardRef(() => DynamicFormFieldComponent), selector: "abp-dynamic-form-field", inputs: ["field", "visible"], exportAs: ["abpDynamicFormField"] }, { kind: "component", type: i0.forwardRef(() => DynamicFormArrayComponent), selector: "abp-dynamic-form-array", inputs: ["arrayConfig", "formGroup", "visible"] }, { kind: "pipe", type: i0.forwardRef(() => LocalizationPipe), name: "abpLocalization" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
451
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
452
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: DynamicFormGroupComponent, isStandalone: true, selector: "abp-dynamic-form-group", inputs: { groupConfig: { classPropertyName: "groupConfig", publicName: "groupConfig", isSignal: true, isRequired: true, transformFunction: null }, formGroup: { classPropertyName: "formGroup", publicName: "formGroup", isSignal: true, isRequired: true, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (visible()) {\r\n <fieldset class=\"form-group-container\" [formGroup]=\"formGroup()\" role=\"group\" [attr.aria-labelledby]=\"groupConfig().key + '-legend'\">\r\n <legend [id]=\"groupConfig().key + '-legend'\" class=\"form-group-legend\">\r\n {{ groupConfig().label | abpLocalization }}\r\n </legend>\r\n \r\n <div class=\"row\">\r\n @for (field of sortedChildren; track field.key) {\r\n <div [ngClass]=\"'col-md-' + (field.gridSize || 12)\">\r\n \r\n <!-- Nested Group (Recursive) -->\r\n @if (field.type === 'group') {\r\n <abp-dynamic-form-group\r\n [groupConfig]=\"field\"\r\n [formGroup]=\"getChildFormGroup(field.key)\" />\r\n }\r\n \r\n <!-- Nested Array -->\r\n @else if (field.type === 'array') {\r\n <abp-dynamic-form-array\r\n [arrayConfig]=\"field\"\r\n [formGroup]=\"formGroup()\" />\r\n }\r\n \r\n <!-- Regular Field -->\r\n @else {\r\n <abp-dynamic-form-field\r\n [field]=\"field\"\r\n [formControlName]=\"field.key\" />\r\n }\r\n \r\n </div>\r\n }\r\n </div>\r\n </fieldset>\r\n}\r\n", styles: [".form-group-container{border-left:3px solid var(--bs-primary, #007bff);padding-left:1rem;margin-bottom:1.5rem;border:1px solid var(--bs-border-color, #dee2e6);border-radius:.375rem;padding:1rem;background-color:var(--bs-light, #f8f9fa)}.form-group-container .form-group-container{border-left-color:var(--bs-secondary, #6c757d);padding-left:.75rem;background-color:var(--bs-white, #fff)}.form-group-legend{font-size:1.1rem;font-weight:600;color:var(--bs-primary, #007bff);margin-bottom:1rem;padding:0 .5rem;float:none;width:auto}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => DynamicFormGroupComponent), selector: "abp-dynamic-form-group", inputs: ["groupConfig", "formGroup", "visible"] }, { kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i1.NgClass), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "directive", type: i0.forwardRef(() => i2.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i2.NgControlStatusGroup), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(() => i2.FormGroupDirective), selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => i2.FormControlName), selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i0.forwardRef(() => DynamicFormFieldComponent), selector: "abp-dynamic-form-field", inputs: ["field", "visible"], exportAs: ["abpDynamicFormField"] }, { kind: "component", type: i0.forwardRef(() => DynamicFormArrayComponent), selector: "abp-dynamic-form-array", inputs: ["arrayConfig", "formGroup", "visible"] }, { kind: "pipe", type: i0.forwardRef(() => LocalizationPipe), name: "abpLocalization" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
453
453
  }
454
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormGroupComponent, decorators: [{
454
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormGroupComponent, decorators: [{
455
455
  type: Component,
456
456
  args: [{ selector: 'abp-dynamic-form-group', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
457
457
  CommonModule,
@@ -465,11 +465,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
465
465
 
466
466
  class DynamicFormComponent {
467
467
  constructor() {
468
- this.fields = input([], ...(ngDevMode ? [{ debugName: "fields" }] : []));
469
- this.values = input(...(ngDevMode ? [undefined, { debugName: "values" }] : []));
470
- this.submitButtonText = input('Submit', ...(ngDevMode ? [{ debugName: "submitButtonText" }] : []));
471
- this.submitInProgress = input(false, ...(ngDevMode ? [{ debugName: "submitInProgress" }] : []));
472
- this.showCancelButton = input(false, ...(ngDevMode ? [{ debugName: "showCancelButton" }] : []));
468
+ this.fields = input([], ...(ngDevMode ? [{ debugName: "fields" }] : /* istanbul ignore next */ []));
469
+ this.values = input(...(ngDevMode ? [undefined, { debugName: "values" }] : /* istanbul ignore next */ []));
470
+ this.submitButtonText = input('Submit', ...(ngDevMode ? [{ debugName: "submitButtonText" }] : /* istanbul ignore next */ []));
471
+ this.submitInProgress = input(false, ...(ngDevMode ? [{ debugName: "submitInProgress" }] : /* istanbul ignore next */ []));
472
+ this.showCancelButton = input(false, ...(ngDevMode ? [{ debugName: "showCancelButton" }] : /* istanbul ignore next */ []));
473
473
  this.onSubmit = output();
474
474
  this.formCancel = output();
475
475
  this.dynamicFormService = inject(DynamicFormService);
@@ -610,10 +610,10 @@ class DynamicFormComponent {
610
610
  }, 100);
611
611
  }
612
612
  }
613
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
614
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: DynamicFormComponent, isStandalone: true, selector: "abp-dynamic-form", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null }, values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: false, transformFunction: null }, submitButtonText: { classPropertyName: "submitButtonText", publicName: "submitButtonText", isSignal: true, isRequired: false, transformFunction: null }, submitInProgress: { classPropertyName: "submitInProgress", publicName: "submitInProgress", isSignal: true, isRequired: false, transformFunction: null }, showCancelButton: { classPropertyName: "showCancelButton", publicName: "showCancelButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit", formCancel: "formCancel" }, host: { classAttribute: "abp-dynamic-form" }, exportAs: ["abpDynamicForm"], ngImport: i0, template: "<div class=\"form-wrapper\">\r\n<form \r\n [formGroup]=\"dynamicForm\" \r\n (ngSubmit)=\"submit()\" \r\n class=\"dynamic-form\"\r\n role=\"form\"\r\n [attr.aria-label]=\"'Dynamic Form'\">\r\n <div class=\"row\" role=\"group\">\r\n @for (field of sortedFields; track field.key) {\r\n <div [ngClass]=\"'col-md-' + (field.gridSize || 12)\">\r\n \r\n <!-- Custom Component -->\r\n @if (field.component) {\r\n <abp-dynamic-form-field-host\r\n [component]=\"field.component\"\r\n [inputs]=\"{ field: field, visible: isFieldVisible(field) }\"\r\n formControlName=\"{{ field.key }}\">\r\n </abp-dynamic-form-field-host>\r\n }\r\n \r\n <!-- Nested Group -->\r\n @else if (field.type === 'group') {\r\n <abp-dynamic-form-group\r\n [groupConfig]=\"field\"\r\n [formGroup]=\"getChildFormGroup(field.key)\"\r\n [visible]=\"isFieldVisible(field)\">\r\n </abp-dynamic-form-group>\r\n }\r\n \r\n <!-- Nested Array -->\r\n @else if (field.type === 'array') {\r\n <abp-dynamic-form-array\r\n [arrayConfig]=\"field\"\r\n [formGroup]=\"dynamicForm\"\r\n [visible]=\"isFieldVisible(field)\">\r\n </abp-dynamic-form-array>\r\n }\r\n \r\n <!-- Regular Field -->\r\n @else {\r\n <abp-dynamic-form-field\r\n [field]=\"field\"\r\n [formControlName]=\"field.key\"\r\n [visible]=\"isFieldVisible(field)\">\r\n </abp-dynamic-form-field>\r\n }\r\n \r\n </div>\r\n }\r\n </div>\r\n <ng-content select=\"[actions]\">\r\n <ng-container [ngTemplateOutlet]=\"defaultActions\"></ng-container>\r\n </ng-content>\r\n\r\n</form>\r\n\r\n<ng-template #defaultActions>\r\n <div class=\"form-actions\" role=\"group\" aria-label=\"Form actions\">\r\n @if (showCancelButton()) {\r\n <button\r\n type=\"button\"\r\n class=\"btn btn-secondary\"\r\n (click)=\"onCancel()\"\r\n aria-label=\"Cancel form\">\r\n Cancel\r\n </button>\r\n }\r\n <button\r\n type=\"submit\"\r\n class=\"btn btn-primary\"\r\n [disabled]=\"!dynamicForm.valid || submitInProgress()\"\r\n [attr.aria-busy]=\"submitInProgress() || null\"\r\n [attr.aria-label]=\"submitInProgress() ? 'Submitting form...' : submitButtonText()\">\r\n {{ submitButtonText() }}\r\n </button>\r\n </div>\r\n</ng-template>\r\n</div>\r\n", styles: [":host(.abp-dynamic-form) form{display:flex;flex-direction:column;gap:.5rem}:host(.abp-dynamic-form) .form-wrapper{text-align:left}.form-actions{display:flex;justify-content:flex-end;gap:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DynamicFormFieldComponent, selector: "abp-dynamic-form-field", inputs: ["field", "visible"], exportAs: ["abpDynamicFormField"] }, { kind: "component", type: DynamicFormGroupComponent, selector: "abp-dynamic-form-group", inputs: ["groupConfig", "formGroup", "visible"] }, { kind: "component", type: DynamicFormArrayComponent, selector: "abp-dynamic-form-array", inputs: ["arrayConfig", "formGroup", "visible"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DynamicFieldHostComponent, selector: "abp-dynamic-form-field-host", inputs: ["component", "inputs"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
613
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
614
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: DynamicFormComponent, isStandalone: true, selector: "abp-dynamic-form", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null }, values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: false, transformFunction: null }, submitButtonText: { classPropertyName: "submitButtonText", publicName: "submitButtonText", isSignal: true, isRequired: false, transformFunction: null }, submitInProgress: { classPropertyName: "submitInProgress", publicName: "submitInProgress", isSignal: true, isRequired: false, transformFunction: null }, showCancelButton: { classPropertyName: "showCancelButton", publicName: "showCancelButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit", formCancel: "formCancel" }, host: { classAttribute: "abp-dynamic-form" }, exportAs: ["abpDynamicForm"], ngImport: i0, template: "<div class=\"form-wrapper\">\r\n<form \r\n [formGroup]=\"dynamicForm\" \r\n (ngSubmit)=\"submit()\" \r\n class=\"dynamic-form\"\r\n role=\"form\"\r\n [attr.aria-label]=\"'Dynamic Form'\">\r\n <div class=\"row\" role=\"group\">\r\n @for (field of sortedFields; track field.key) {\r\n <div [ngClass]=\"'col-md-' + (field.gridSize || 12)\">\r\n \r\n <!-- Custom Component -->\r\n @if (field.component) {\r\n <abp-dynamic-form-field-host\r\n [component]=\"field.component\"\r\n [inputs]=\"{ field: field, visible: isFieldVisible(field) }\"\r\n formControlName=\"{{ field.key }}\">\r\n </abp-dynamic-form-field-host>\r\n }\r\n \r\n <!-- Nested Group -->\r\n @else if (field.type === 'group') {\r\n <abp-dynamic-form-group\r\n [groupConfig]=\"field\"\r\n [formGroup]=\"getChildFormGroup(field.key)\"\r\n [visible]=\"isFieldVisible(field)\">\r\n </abp-dynamic-form-group>\r\n }\r\n \r\n <!-- Nested Array -->\r\n @else if (field.type === 'array') {\r\n <abp-dynamic-form-array\r\n [arrayConfig]=\"field\"\r\n [formGroup]=\"dynamicForm\"\r\n [visible]=\"isFieldVisible(field)\">\r\n </abp-dynamic-form-array>\r\n }\r\n \r\n <!-- Regular Field -->\r\n @else {\r\n <abp-dynamic-form-field\r\n [field]=\"field\"\r\n [formControlName]=\"field.key\"\r\n [visible]=\"isFieldVisible(field)\">\r\n </abp-dynamic-form-field>\r\n }\r\n \r\n </div>\r\n }\r\n </div>\r\n <ng-content select=\"[actions]\">\r\n <ng-container [ngTemplateOutlet]=\"defaultActions\"></ng-container>\r\n </ng-content>\r\n\r\n</form>\r\n\r\n<ng-template #defaultActions>\r\n <div class=\"form-actions\" role=\"group\" aria-label=\"Form actions\">\r\n @if (showCancelButton()) {\r\n <button\r\n type=\"button\"\r\n class=\"btn btn-secondary\"\r\n (click)=\"onCancel()\"\r\n aria-label=\"Cancel form\">\r\n Cancel\r\n </button>\r\n }\r\n <button\r\n type=\"submit\"\r\n class=\"btn btn-primary\"\r\n [disabled]=\"!dynamicForm.valid || submitInProgress()\"\r\n [attr.aria-busy]=\"submitInProgress() || null\"\r\n [attr.aria-label]=\"submitInProgress() ? 'Submitting form...' : submitButtonText()\">\r\n {{ submitButtonText() }}\r\n </button>\r\n </div>\r\n</ng-template>\r\n</div>\r\n", styles: [":host(.abp-dynamic-form) form{display:flex;flex-direction:column;gap:.5rem}:host(.abp-dynamic-form) .form-wrapper{text-align:left}.form-actions{display:flex;justify-content:flex-end;gap:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DynamicFormFieldComponent, selector: "abp-dynamic-form-field", inputs: ["field", "visible"], exportAs: ["abpDynamicFormField"] }, { kind: "component", type: DynamicFormGroupComponent, selector: "abp-dynamic-form-group", inputs: ["groupConfig", "formGroup", "visible"] }, { kind: "component", type: DynamicFormArrayComponent, selector: "abp-dynamic-form-array", inputs: ["arrayConfig", "formGroup", "visible"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DynamicFieldHostComponent, selector: "abp-dynamic-form-field-host", inputs: ["component", "inputs"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
615
615
  }
616
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: DynamicFormComponent, decorators: [{
616
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DynamicFormComponent, decorators: [{
617
617
  type: Component,
618
618
  args: [{ selector: 'abp-dynamic-form', host: { class: 'abp-dynamic-form' }, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'abpDynamicForm', imports: [
619
619
  CommonModule,