superlikers-dynamic-forms 0.0.0-watch
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/README.md +24 -0
- package/esm2022/lib/components/base-control/base-control.component.mjs +86 -0
- package/esm2022/lib/components/checkbox-field/checkbox-field.component.mjs +16 -0
- package/esm2022/lib/components/checkbox-group-field/checkbox-group-field.component.mjs +33 -0
- package/esm2022/lib/components/errors/errors.component.mjs +45 -0
- package/esm2022/lib/components/group-field/group-field.component.mjs +22 -0
- package/esm2022/lib/components/help-text/help-text.component.mjs +21 -0
- package/esm2022/lib/components/input-field/input-field.component.mjs +16 -0
- package/esm2022/lib/components/radio-field/radio-field.component.mjs +16 -0
- package/esm2022/lib/components/select-field/select-field.component.mjs +26 -0
- package/esm2022/lib/directives/helpText/help-text.directive.mjs +29 -0
- package/esm2022/lib/directives/validator-array-message/validator-array-message.directive.mjs +49 -0
- package/esm2022/lib/directives/validator-message/validator-message.directive.mjs +49 -0
- package/esm2022/lib/models/forms.model.mjs +10 -0
- package/esm2022/lib/pipes/control-injector.pipe.mjs +29 -0
- package/esm2022/lib/services/control-resolver/control-resolver.service.mjs +42 -0
- package/esm2022/lib/utils/control-data.token.mjs +3 -0
- package/esm2022/lib/utils/validation-error-messages.token.mjs +23 -0
- package/esm2022/public-api.mjs +20 -0
- package/esm2022/superlikers-dynamic-forms.mjs +5 -0
- package/fesm2022/superlikers-dynamic-forms-select-field.component-DuEQPRWC.mjs +28 -0
- package/fesm2022/superlikers-dynamic-forms-select-field.component-DuEQPRWC.mjs.map +1 -0
- package/fesm2022/superlikers-dynamic-forms.mjs +459 -0
- package/fesm2022/superlikers-dynamic-forms.mjs.map +1 -0
- package/index.d.ts +5 -0
- package/lib/components/base-control/base-control.component.d.ts +26 -0
- package/lib/components/checkbox-field/checkbox-field.component.d.ts +6 -0
- package/lib/components/checkbox-group-field/checkbox-group-field.component.d.ts +9 -0
- package/lib/components/errors/errors.component.d.ts +13 -0
- package/lib/components/group-field/group-field.component.d.ts +11 -0
- package/lib/components/help-text/help-text.component.d.ts +6 -0
- package/lib/components/input-field/input-field.component.d.ts +6 -0
- package/lib/components/radio-field/radio-field.component.d.ts +6 -0
- package/lib/components/select-field/select-field.component.d.ts +9 -0
- package/lib/directives/helpText/help-text.directive.d.ts +11 -0
- package/lib/directives/validator-array-message/validator-array-message.directive.d.ts +15 -0
- package/lib/directives/validator-message/validator-message.directive.d.ts +17 -0
- package/lib/models/forms.model.d.ts +41 -0
- package/lib/pipes/control-injector.pipe.d.ts +10 -0
- package/lib/services/control-resolver/control-resolver.service.d.ts +12 -0
- package/lib/utils/control-data.token.d.ts +9 -0
- package/lib/utils/validation-error-messages.token.d.ts +10 -0
- package/package.json +25 -0
- package/public-api.d.ts +16 -0
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { Injectable } from '@angular/core';
|
|
2
|
+
import { from, of, tap } from 'rxjs';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
export class ControlResolver {
|
|
5
|
+
constructor() {
|
|
6
|
+
this.lazyControlComponents = {
|
|
7
|
+
input: () => import('../../components/input-field/input-field.component').then(c => c.InputFieldComponent),
|
|
8
|
+
group: () => import('../../components/group-field/group-field.component').then(c => c.GroupFieldComponent),
|
|
9
|
+
radio: () => import('../../components/radio-field/radio-field.component').then(c => c.RadioFieldComponent),
|
|
10
|
+
checkbox: () => import('../../components/checkbox-field/checkbox-field.component').then(c => c.CheckboxFieldComponent),
|
|
11
|
+
'checkbox-group': () => import('../../components/checkbox-group-field/checkbox-group-field.component').then(c => c.CheckboxGroupFieldComponent),
|
|
12
|
+
select: () => import('../../components/select-field/select-field.component').then(c => c.SelectFieldComponent)
|
|
13
|
+
};
|
|
14
|
+
this.loadedControlComponents = new Map();
|
|
15
|
+
}
|
|
16
|
+
resolve(control, form) {
|
|
17
|
+
const controlType = control.controlType;
|
|
18
|
+
const isVisible = this.checkVisible(control, form);
|
|
19
|
+
if (!isVisible)
|
|
20
|
+
return;
|
|
21
|
+
const loadedComponent = this.loadedControlComponents.get(controlType);
|
|
22
|
+
if (loadedComponent)
|
|
23
|
+
return of(loadedComponent);
|
|
24
|
+
return from(this.lazyControlComponents[controlType]()).pipe(tap(component => {
|
|
25
|
+
this.loadedControlComponents.set(controlType, component);
|
|
26
|
+
}));
|
|
27
|
+
}
|
|
28
|
+
checkVisible(control, form) {
|
|
29
|
+
if (!control.visible)
|
|
30
|
+
return true;
|
|
31
|
+
return control.visible(form);
|
|
32
|
+
}
|
|
33
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ControlResolver, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
34
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ControlResolver, providedIn: 'root' }); }
|
|
35
|
+
}
|
|
36
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ControlResolver, decorators: [{
|
|
37
|
+
type: Injectable,
|
|
38
|
+
args: [{
|
|
39
|
+
providedIn: 'root'
|
|
40
|
+
}]
|
|
41
|
+
}] });
|
|
42
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udHJvbC1yZXNvbHZlci5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHluYW1pYy1mb3Jtcy9zcmMvbGliL3NlcnZpY2VzL2NvbnRyb2wtcmVzb2x2ZXIvY29udHJvbC1yZXNvbHZlci5zZXJ2aWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxVQUFVLEVBQVEsTUFBTSxlQUFlLENBQUE7QUFDaEQsT0FBTyxFQUFFLElBQUksRUFBRSxFQUFFLEVBQUUsR0FBRyxFQUFFLE1BQU0sTUFBTSxDQUFBOztBQVFwQyxNQUFNLE9BQU8sZUFBZTtJQUg1QjtRQUlVLDBCQUFxQixHQUFlO1lBQzFDLEtBQUssRUFBRSxHQUFHLEVBQUUsQ0FBQyxNQUFNLENBQUMsb0RBQW9ELENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsbUJBQW1CLENBQUM7WUFDMUcsS0FBSyxFQUFFLEdBQUcsRUFBRSxDQUFDLE1BQU0sQ0FBQyxvREFBb0QsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQyxtQkFBbUIsQ0FBQztZQUMxRyxLQUFLLEVBQUUsR0FBRyxFQUFFLENBQUMsTUFBTSxDQUFDLG9EQUFvRCxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLG1CQUFtQixDQUFDO1lBQzFHLFFBQVEsRUFBRSxHQUFHLEVBQUUsQ0FBQyxNQUFNLENBQUMsMERBQTBELENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsc0JBQXNCLENBQUM7WUFDdEgsZ0JBQWdCLEVBQUUsR0FBRyxFQUFFLENBQUMsTUFBTSxDQUFDLHNFQUFzRSxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLDJCQUEyQixDQUFDO1lBQy9JLE1BQU0sRUFBRSxHQUFHLEVBQUUsQ0FBQyxNQUFNLENBQUMsc0RBQXNELENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsb0JBQW9CLENBQUM7U0FDL0csQ0FBQTtRQUVPLDRCQUF1QixHQUFHLElBQUksR0FBRyxFQUF5QixDQUFBO0tBd0JuRTtJQXRCQyxPQUFPLENBQUMsT0FBZ0IsRUFBRSxJQUFlO1FBQ3ZDLE1BQU0sV0FBVyxHQUFHLE9BQU8sQ0FBQyxXQUFXLENBQUE7UUFFdkMsTUFBTSxTQUFTLEdBQUcsSUFBSSxDQUFDLFlBQVksQ0FBQyxPQUFPLEVBQUUsSUFBSSxDQUFDLENBQUE7UUFFbEQsSUFBSSxDQUFDLFNBQVM7WUFBRSxPQUFNO1FBRXRCLE1BQU0sZUFBZSxHQUFHLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxHQUFHLENBQUMsV0FBVyxDQUFDLENBQUE7UUFFckUsSUFBSSxlQUFlO1lBQUUsT0FBTyxFQUFFLENBQUMsZUFBZSxDQUFDLENBQUE7UUFFL0MsT0FBTyxJQUFJLENBQUMsSUFBSSxDQUFDLHFCQUFxQixDQUFDLFdBQVcsQ0FBQyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQ3pELEdBQUcsQ0FBQyxTQUFTLENBQUMsRUFBRTtZQUNkLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxHQUFHLENBQUMsV0FBVyxFQUFFLFNBQVMsQ0FBQyxDQUFBO1FBQzFELENBQUMsQ0FBQyxDQUNILENBQUE7SUFDSCxDQUFDO0lBRUQsWUFBWSxDQUFDLE9BQWdCLEVBQUUsSUFBZTtRQUM1QyxJQUFJLENBQUMsT0FBTyxDQUFDLE9BQU87WUFBRSxPQUFPLElBQUksQ0FBQTtRQUNqQyxPQUFPLE9BQU8sQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUE7SUFDOUIsQ0FBQzs4R0FqQ1UsZUFBZTtrSEFBZixlQUFlLGNBRmQsTUFBTTs7MkZBRVAsZUFBZTtrQkFIM0IsVUFBVTttQkFBQztvQkFDVixVQUFVLEVBQUUsTUFBTTtpQkFDbkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBJbmplY3RhYmxlLCBUeXBlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSdcbmltcG9ydCB7IGZyb20sIG9mLCB0YXAgfSBmcm9tICdyeGpzJ1xuXG5pbXBvcnQgeyBDb250cm9sLCBDb250cm9sTWFwIH0gZnJvbSAnLi4vLi4vbW9kZWxzL2Zvcm1zLm1vZGVsJ1xuaW1wb3J0IHsgRm9ybUdyb3VwIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnXG5cbkBJbmplY3RhYmxlKHtcbiAgcHJvdmlkZWRJbjogJ3Jvb3QnXG59KVxuZXhwb3J0IGNsYXNzIENvbnRyb2xSZXNvbHZlciB7XG4gIHByaXZhdGUgbGF6eUNvbnRyb2xDb21wb25lbnRzOiBDb250cm9sTWFwID0ge1xuICAgIGlucHV0OiAoKSA9PiBpbXBvcnQoJy4uLy4uL2NvbXBvbmVudHMvaW5wdXQtZmllbGQvaW5wdXQtZmllbGQuY29tcG9uZW50JykudGhlbihjID0+IGMuSW5wdXRGaWVsZENvbXBvbmVudCksXG4gICAgZ3JvdXA6ICgpID0+IGltcG9ydCgnLi4vLi4vY29tcG9uZW50cy9ncm91cC1maWVsZC9ncm91cC1maWVsZC5jb21wb25lbnQnKS50aGVuKGMgPT4gYy5Hcm91cEZpZWxkQ29tcG9uZW50KSxcbiAgICByYWRpbzogKCkgPT4gaW1wb3J0KCcuLi8uLi9jb21wb25lbnRzL3JhZGlvLWZpZWxkL3JhZGlvLWZpZWxkLmNvbXBvbmVudCcpLnRoZW4oYyA9PiBjLlJhZGlvRmllbGRDb21wb25lbnQpLFxuICAgIGNoZWNrYm94OiAoKSA9PiBpbXBvcnQoJy4uLy4uL2NvbXBvbmVudHMvY2hlY2tib3gtZmllbGQvY2hlY2tib3gtZmllbGQuY29tcG9uZW50JykudGhlbihjID0+IGMuQ2hlY2tib3hGaWVsZENvbXBvbmVudCksXG4gICAgJ2NoZWNrYm94LWdyb3VwJzogKCkgPT4gaW1wb3J0KCcuLi8uLi9jb21wb25lbnRzL2NoZWNrYm94LWdyb3VwLWZpZWxkL2NoZWNrYm94LWdyb3VwLWZpZWxkLmNvbXBvbmVudCcpLnRoZW4oYyA9PiBjLkNoZWNrYm94R3JvdXBGaWVsZENvbXBvbmVudCksXG4gICAgc2VsZWN0OiAoKSA9PiBpbXBvcnQoJy4uLy4uL2NvbXBvbmVudHMvc2VsZWN0LWZpZWxkL3NlbGVjdC1maWVsZC5jb21wb25lbnQnKS50aGVuKGMgPT4gYy5TZWxlY3RGaWVsZENvbXBvbmVudClcbiAgfVxuXG4gIHByaXZhdGUgbG9hZGVkQ29udHJvbENvbXBvbmVudHMgPSBuZXcgTWFwPHN0cmluZywgVHlwZTx1bmtub3duPj4oKVxuXG4gIHJlc29sdmUoY29udHJvbDogQ29udHJvbCwgZm9ybTogRm9ybUdyb3VwKSB7XG4gICAgY29uc3QgY29udHJvbFR5cGUgPSBjb250cm9sLmNvbnRyb2xUeXBlXG5cbiAgICBjb25zdCBpc1Zpc2libGUgPSB0aGlzLmNoZWNrVmlzaWJsZShjb250cm9sLCBmb3JtKVxuXG4gICAgaWYgKCFpc1Zpc2libGUpIHJldHVyblxuXG4gICAgY29uc3QgbG9hZGVkQ29tcG9uZW50ID0gdGhpcy5sb2FkZWRDb250cm9sQ29tcG9uZW50cy5nZXQoY29udHJvbFR5cGUpXG5cbiAgICBpZiAobG9hZGVkQ29tcG9uZW50KSByZXR1cm4gb2YobG9hZGVkQ29tcG9uZW50KVxuXG4gICAgcmV0dXJuIGZyb20odGhpcy5sYXp5Q29udHJvbENvbXBvbmVudHNbY29udHJvbFR5cGVdKCkpLnBpcGUoXG4gICAgICB0YXAoY29tcG9uZW50ID0+IHtcbiAgICAgICAgdGhpcy5sb2FkZWRDb250cm9sQ29tcG9uZW50cy5zZXQoY29udHJvbFR5cGUsIGNvbXBvbmVudClcbiAgICAgIH0pXG4gICAgKVxuICB9XG5cbiAgY2hlY2tWaXNpYmxlKGNvbnRyb2w6IENvbnRyb2wsIGZvcm06IEZvcm1Hcm91cCkge1xuICAgIGlmICghY29udHJvbC52aXNpYmxlKSByZXR1cm4gdHJ1ZVxuICAgIHJldHVybiBjb250cm9sLnZpc2libGUoZm9ybSlcbiAgfVxufVxuIl19
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { InjectionToken } from '@angular/core';
|
|
2
|
+
export const CONTROL_DATA = new InjectionToken('Control Data');
|
|
3
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udHJvbC1kYXRhLnRva2VuLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHluYW1pYy1mb3Jtcy9zcmMvbGliL3V0aWxzL2NvbnRyb2wtZGF0YS50b2tlbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sZUFBZSxDQUFBO0FBVTlDLE1BQU0sQ0FBQyxNQUFNLFlBQVksR0FBRyxJQUFJLGNBQWMsQ0FBYyxjQUFjLENBQUMsQ0FBQSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEluamVjdGlvblRva2VuIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSdcbmltcG9ydCB7IENvbnRyb2wgfSBmcm9tICcuLi9tb2RlbHMvZm9ybXMubW9kZWwnXG5pbXBvcnQgeyBGb3JtR3JvdXAgfSBmcm9tICdAYW5ndWxhci9mb3JtcydcblxuZXhwb3J0IGludGVyZmFjZSBDb250cm9sRGF0YSB7XG4gIGNvbnRyb2w6IENvbnRyb2xcbiAgZm9ybUdyb3VwPzogRm9ybUdyb3VwXG4gIGluZGV4PzogbnVtYmVyXG59XG5cbmV4cG9ydCBjb25zdCBDT05UUk9MX0RBVEEgPSBuZXcgSW5qZWN0aW9uVG9rZW48Q29udHJvbERhdGE+KCdDb250cm9sIERhdGEnKVxuIl19
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
2
|
+
import { InjectionToken } from '@angular/core';
|
|
3
|
+
export const ERROR_MESSAGES = {
|
|
4
|
+
required: () => `This field is required`,
|
|
5
|
+
requiredTrue: () => `This field is required`,
|
|
6
|
+
pattern: () => `Does not match the pattern`,
|
|
7
|
+
email: () => `Must be a valid email`,
|
|
8
|
+
minlength: ({ requiredLength }) => `Length must be at least ${requiredLength} characters`,
|
|
9
|
+
customError: error => error
|
|
10
|
+
};
|
|
11
|
+
export const ERROR_MESSAGES_ES = {
|
|
12
|
+
required: () => `Este campo es obligatorio`,
|
|
13
|
+
requiredTrue: () => `Este campo es obligatorio`,
|
|
14
|
+
pattern: () => `No coincide con el patrón`,
|
|
15
|
+
email: () => `Debe ser un correo electrónico válido`,
|
|
16
|
+
minlength: ({ requiredLength }) => `La longitud debe ser al menos de ${requiredLength} caracteres`,
|
|
17
|
+
customError: error => error
|
|
18
|
+
};
|
|
19
|
+
export const VALIDATION_ERROR_MESSAGES = new InjectionToken(`Validation Messages`, {
|
|
20
|
+
providedIn: 'root',
|
|
21
|
+
factory: () => ERROR_MESSAGES
|
|
22
|
+
});
|
|
23
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmFsaWRhdGlvbi1lcnJvci1tZXNzYWdlcy50b2tlbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2R5bmFtaWMtZm9ybXMvc3JjL2xpYi91dGlscy92YWxpZGF0aW9uLWVycm9yLW1lc3NhZ2VzLnRva2VuLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLHVEQUF1RDtBQUN2RCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sZUFBZSxDQUFBO0FBRTlDLE1BQU0sQ0FBQyxNQUFNLGNBQWMsR0FBOEM7SUFDdkUsUUFBUSxFQUFFLEdBQUcsRUFBRSxDQUFDLHdCQUF3QjtJQUN4QyxZQUFZLEVBQUUsR0FBRyxFQUFFLENBQUMsd0JBQXdCO0lBQzVDLE9BQU8sRUFBRSxHQUFHLEVBQUUsQ0FBQyw0QkFBNEI7SUFDM0MsS0FBSyxFQUFFLEdBQUcsRUFBRSxDQUFDLHVCQUF1QjtJQUNwQyxTQUFTLEVBQUUsQ0FBQyxFQUFFLGNBQWMsRUFBRSxFQUFFLEVBQUUsQ0FBQywyQkFBMkIsY0FBYyxhQUFhO0lBQ3pGLFdBQVcsRUFBRSxLQUFLLENBQUMsRUFBRSxDQUFDLEtBQUs7Q0FDNUIsQ0FBQTtBQUVELE1BQU0sQ0FBQyxNQUFNLGlCQUFpQixHQUE4QztJQUMxRSxRQUFRLEVBQUUsR0FBRyxFQUFFLENBQUMsMkJBQTJCO0lBQzNDLFlBQVksRUFBRSxHQUFHLEVBQUUsQ0FBQywyQkFBMkI7SUFDL0MsT0FBTyxFQUFFLEdBQUcsRUFBRSxDQUFDLDJCQUEyQjtJQUMxQyxLQUFLLEVBQUUsR0FBRyxFQUFFLENBQUMsdUNBQXVDO0lBQ3BELFNBQVMsRUFBRSxDQUFDLEVBQUUsY0FBYyxFQUFFLEVBQUUsRUFBRSxDQUFDLG9DQUFvQyxjQUFjLGFBQWE7SUFDbEcsV0FBVyxFQUFFLEtBQUssQ0FBQyxFQUFFLENBQUMsS0FBSztDQUM1QixDQUFBO0FBRUQsTUFBTSxDQUFDLE1BQU0seUJBQXlCLEdBQUcsSUFBSSxjQUFjLENBQUMscUJBQXFCLEVBQUU7SUFDakYsVUFBVSxFQUFFLE1BQU07SUFDbEIsT0FBTyxFQUFFLEdBQUcsRUFBRSxDQUFDLGNBQWM7Q0FDOUIsQ0FBQyxDQUFBIiwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgQHR5cGVzY3JpcHQtZXNsaW50L25vLWV4cGxpY2l0LWFueSAqL1xuaW1wb3J0IHsgSW5qZWN0aW9uVG9rZW4gfSBmcm9tICdAYW5ndWxhci9jb3JlJ1xuXG5leHBvcnQgY29uc3QgRVJST1JfTUVTU0FHRVM6IHsgW2tleTogc3RyaW5nXTogKGFyZ3M/OiBhbnkpID0+IHN0cmluZyB9ID0ge1xuICByZXF1aXJlZDogKCkgPT4gYFRoaXMgZmllbGQgaXMgcmVxdWlyZWRgLFxuICByZXF1aXJlZFRydWU6ICgpID0+IGBUaGlzIGZpZWxkIGlzIHJlcXVpcmVkYCxcbiAgcGF0dGVybjogKCkgPT4gYERvZXMgbm90IG1hdGNoIHRoZSBwYXR0ZXJuYCxcbiAgZW1haWw6ICgpID0+IGBNdXN0IGJlIGEgdmFsaWQgZW1haWxgLFxuICBtaW5sZW5ndGg6ICh7IHJlcXVpcmVkTGVuZ3RoIH0pID0+IGBMZW5ndGggbXVzdCBiZSBhdCBsZWFzdCAke3JlcXVpcmVkTGVuZ3RofSBjaGFyYWN0ZXJzYCxcbiAgY3VzdG9tRXJyb3I6IGVycm9yID0+IGVycm9yXG59XG5cbmV4cG9ydCBjb25zdCBFUlJPUl9NRVNTQUdFU19FUzogeyBba2V5OiBzdHJpbmddOiAoYXJncz86IGFueSkgPT4gc3RyaW5nIH0gPSB7XG4gIHJlcXVpcmVkOiAoKSA9PiBgRXN0ZSBjYW1wbyBlcyBvYmxpZ2F0b3Jpb2AsXG4gIHJlcXVpcmVkVHJ1ZTogKCkgPT4gYEVzdGUgY2FtcG8gZXMgb2JsaWdhdG9yaW9gLFxuICBwYXR0ZXJuOiAoKSA9PiBgTm8gY29pbmNpZGUgY29uIGVsIHBhdHLDs25gLFxuICBlbWFpbDogKCkgPT4gYERlYmUgc2VyIHVuIGNvcnJlbyBlbGVjdHLDs25pY28gdsOhbGlkb2AsXG4gIG1pbmxlbmd0aDogKHsgcmVxdWlyZWRMZW5ndGggfSkgPT4gYExhIGxvbmdpdHVkIGRlYmUgc2VyIGFsIG1lbm9zIGRlICR7cmVxdWlyZWRMZW5ndGh9IGNhcmFjdGVyZXNgLFxuICBjdXN0b21FcnJvcjogZXJyb3IgPT4gZXJyb3Jcbn1cblxuZXhwb3J0IGNvbnN0IFZBTElEQVRJT05fRVJST1JfTUVTU0FHRVMgPSBuZXcgSW5qZWN0aW9uVG9rZW4oYFZhbGlkYXRpb24gTWVzc2FnZXNgLCB7XG4gIHByb3ZpZGVkSW46ICdyb290JyxcbiAgZmFjdG9yeTogKCkgPT4gRVJST1JfTUVTU0FHRVNcbn0pXG4iXX0=
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Public API Surface of ngx-dynamic-forms
|
|
3
|
+
*/
|
|
4
|
+
export * from './lib/pipes/control-injector.pipe';
|
|
5
|
+
export * from './lib/models/forms.model';
|
|
6
|
+
export * from './lib/services/control-resolver/control-resolver.service';
|
|
7
|
+
export * from './lib/components/base-control/base-control.component';
|
|
8
|
+
export * from './lib/components/checkbox-field/checkbox-field.component';
|
|
9
|
+
export * from './lib/components/checkbox-group-field/checkbox-group-field.component';
|
|
10
|
+
export * from './lib/components/errors/errors.component';
|
|
11
|
+
export * from './lib/components/group-field/group-field.component';
|
|
12
|
+
export * from './lib/components/help-text/help-text.component';
|
|
13
|
+
export * from './lib/components/input-field/input-field.component';
|
|
14
|
+
export * from './lib/components/radio-field/radio-field.component';
|
|
15
|
+
export * from './lib/directives/helpText/help-text.directive';
|
|
16
|
+
export * from './lib/directives/validator-array-message/validator-array-message.directive';
|
|
17
|
+
export * from './lib/directives/validator-message/validator-message.directive';
|
|
18
|
+
export * from './lib/utils/control-data.token';
|
|
19
|
+
export * from './lib/utils/validation-error-messages.token';
|
|
20
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL2R5bmFtaWMtZm9ybXMvc3JjL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLG1DQUFtQyxDQUFBO0FBQ2pELGNBQWMsMEJBQTBCLENBQUE7QUFDeEMsY0FBYywwREFBMEQsQ0FBQTtBQUV4RSxjQUFjLHNEQUFzRCxDQUFBO0FBQ3BFLGNBQWMsMERBQTBELENBQUE7QUFDeEUsY0FBYyxzRUFBc0UsQ0FBQTtBQUNwRixjQUFjLDBDQUEwQyxDQUFBO0FBQ3hELGNBQWMsb0RBQW9ELENBQUE7QUFDbEUsY0FBYyxnREFBZ0QsQ0FBQTtBQUM5RCxjQUFjLG9EQUFvRCxDQUFBO0FBQ2xFLGNBQWMsb0RBQW9ELENBQUE7QUFFbEUsY0FBYywrQ0FBK0MsQ0FBQTtBQUM3RCxjQUFjLDRFQUE0RSxDQUFBO0FBQzFGLGNBQWMsZ0VBQWdFLENBQUE7QUFFOUUsY0FBYyxnQ0FBZ0MsQ0FBQTtBQUM5QyxjQUFjLDZDQUE2QyxDQUFBIiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIFB1YmxpYyBBUEkgU3VyZmFjZSBvZiBuZ3gtZHluYW1pYy1mb3Jtc1xuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vbGliL3BpcGVzL2NvbnRyb2wtaW5qZWN0b3IucGlwZSdcbmV4cG9ydCAqIGZyb20gJy4vbGliL21vZGVscy9mb3Jtcy5tb2RlbCdcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NlcnZpY2VzL2NvbnRyb2wtcmVzb2x2ZXIvY29udHJvbC1yZXNvbHZlci5zZXJ2aWNlJ1xuXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2Jhc2UtY29udHJvbC9iYXNlLWNvbnRyb2wuY29tcG9uZW50J1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9jaGVja2JveC1maWVsZC9jaGVja2JveC1maWVsZC5jb21wb25lbnQnXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2NoZWNrYm94LWdyb3VwLWZpZWxkL2NoZWNrYm94LWdyb3VwLWZpZWxkLmNvbXBvbmVudCdcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZXJyb3JzL2Vycm9ycy5jb21wb25lbnQnXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyb3VwLWZpZWxkL2dyb3VwLWZpZWxkLmNvbXBvbmVudCdcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvaGVscC10ZXh0L2hlbHAtdGV4dC5jb21wb25lbnQnXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2lucHV0LWZpZWxkL2lucHV0LWZpZWxkLmNvbXBvbmVudCdcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvcmFkaW8tZmllbGQvcmFkaW8tZmllbGQuY29tcG9uZW50J1xuXG5leHBvcnQgKiBmcm9tICcuL2xpYi9kaXJlY3RpdmVzL2hlbHBUZXh0L2hlbHAtdGV4dC5kaXJlY3RpdmUnXG5leHBvcnQgKiBmcm9tICcuL2xpYi9kaXJlY3RpdmVzL3ZhbGlkYXRvci1hcnJheS1tZXNzYWdlL3ZhbGlkYXRvci1hcnJheS1tZXNzYWdlLmRpcmVjdGl2ZSdcbmV4cG9ydCAqIGZyb20gJy4vbGliL2RpcmVjdGl2ZXMvdmFsaWRhdG9yLW1lc3NhZ2UvdmFsaWRhdG9yLW1lc3NhZ2UuZGlyZWN0aXZlJ1xuXG5leHBvcnQgKiBmcm9tICcuL2xpYi91dGlscy9jb250cm9sLWRhdGEudG9rZW4nXG5leHBvcnQgKiBmcm9tICcuL2xpYi91dGlscy92YWxpZGF0aW9uLWVycm9yLW1lc3NhZ2VzLnRva2VuJ1xuIl19
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Generated bundle index. Do not edit.
|
|
3
|
+
*/
|
|
4
|
+
export * from './public-api';
|
|
5
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3VwZXJsaWtlcnMtZHluYW1pYy1mb3Jtcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL2R5bmFtaWMtZm9ybXMvc3JjL3N1cGVybGlrZXJzLWR5bmFtaWMtZm9ybXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9wdWJsaWMtYXBpJztcbiJdfQ==
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { Component } from '@angular/core';
|
|
3
|
+
import { BaseControlComponent, ValidatorMessageDirective, HelpTextDirective, controlProvider, sharedControlDeps } from './superlikers-dynamic-forms.mjs';
|
|
4
|
+
import * as i1 from '@angular/common';
|
|
5
|
+
import * as i2 from '@angular/forms';
|
|
6
|
+
import 'rxjs';
|
|
7
|
+
|
|
8
|
+
class SelectFieldComponent extends BaseControlComponent {
|
|
9
|
+
ngOnInit() {
|
|
10
|
+
this.initialize();
|
|
11
|
+
this.setSelectedOption();
|
|
12
|
+
}
|
|
13
|
+
setSelectedOption() {
|
|
14
|
+
const selectedOption = this.control.control.options?.find(option => option.selected);
|
|
15
|
+
if (!selectedOption)
|
|
16
|
+
return;
|
|
17
|
+
this.formControl.setValue(selectedOption.value);
|
|
18
|
+
}
|
|
19
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: SelectFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
20
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: SelectFieldComponent, isStandalone: true, selector: "app-radio-field", usesInheritance: true, ngImport: i0, template: "<label for=\"\">{{ control.control.label }}</label>\n<select\n [formControlName]=\"control.control.name\"\n [id]=\"id\">\n @for (option of getOptions() | async; track option.value; let i = $index) {\n <option\n [value]=\"option.value\"\n [disabled]=\"option.disabled\">\n {{ option.label }}\n </option>\n }\n</select>\n\n<div\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorMessage\n [formControlName]=\"control.control.name\"\n ngDefaultControl></div>\n", dependencies: [{ kind: "ngmodule", type: i1.CommonModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: i2.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.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: ValidatorMessageDirective, selector: "[appValidatorMessage]" }, { kind: "directive", type: HelpTextDirective, selector: "[appHelpText]", inputs: ["message"] }], viewProviders: [controlProvider] }); }
|
|
21
|
+
}
|
|
22
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: SelectFieldComponent, decorators: [{
|
|
23
|
+
type: Component,
|
|
24
|
+
args: [{ selector: 'app-radio-field', standalone: true, imports: [...sharedControlDeps], viewProviders: [controlProvider], template: "<label for=\"\">{{ control.control.label }}</label>\n<select\n [formControlName]=\"control.control.name\"\n [id]=\"id\">\n @for (option of getOptions() | async; track option.value; let i = $index) {\n <option\n [value]=\"option.value\"\n [disabled]=\"option.disabled\">\n {{ option.label }}\n </option>\n }\n</select>\n\n<div\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorMessage\n [formControlName]=\"control.control.name\"\n ngDefaultControl></div>\n" }]
|
|
25
|
+
}] });
|
|
26
|
+
|
|
27
|
+
export { SelectFieldComponent };
|
|
28
|
+
//# sourceMappingURL=superlikers-dynamic-forms-select-field.component-DuEQPRWC.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"superlikers-dynamic-forms-select-field.component-DuEQPRWC.mjs","sources":["../../../projects/dynamic-forms/src/lib/components/select-field/select-field.component.ts","../../../projects/dynamic-forms/src/lib/components/select-field/select-field.component.html"],"sourcesContent":["import { Component, OnInit } from '@angular/core'\nimport { BaseControlComponent, controlProvider, sharedControlDeps } from '../base-control/base-control.component'\n\n@Component({\n selector: 'app-radio-field',\n standalone: true,\n imports: [...sharedControlDeps],\n viewProviders: [controlProvider],\n templateUrl: './select-field.component.html'\n})\nexport class SelectFieldComponent extends BaseControlComponent implements OnInit {\n override ngOnInit() {\n this.initialize()\n\n this.setSelectedOption()\n }\n\n setSelectedOption() {\n const selectedOption = this.control.control.options?.find(option => option.selected)\n if (!selectedOption) return\n\n this.formControl.setValue(selectedOption.value)\n }\n}\n","<label for=\"\">{{ control.control.label }}</label>\n<select\n [formControlName]=\"control.control.name\"\n [id]=\"id\">\n @for (option of getOptions() | async; track option.value; let i = $index) {\n <option\n [value]=\"option.value\"\n [disabled]=\"option.disabled\">\n {{ option.label }}\n </option>\n }\n</select>\n\n<div\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorMessage\n [formControlName]=\"control.control.name\"\n ngDefaultControl></div>\n"],"names":["i3.ValidatorMessageDirective","i4.HelpTextDirective"],"mappings":";;;;;;;AAUM,MAAO,oBAAqB,SAAQ,oBAAoB,CAAA;IACnD,QAAQ,GAAA;QACf,IAAI,CAAC,UAAU,EAAE,CAAA;QAEjB,IAAI,CAAC,iBAAiB,EAAE,CAAA;KACzB;IAED,iBAAiB,GAAA;QACf,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,OAAO,EAAE,IAAI,CAAC,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,CAAA;AACpF,QAAA,IAAI,CAAC,cAAc;YAAE,OAAM;QAE3B,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;KAChD;8GAZU,oBAAoB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,ECVjC,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,igBAmBA,EDZiB,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,OAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,cAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,OAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,uBAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,OAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,8MAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,0BAAA,EAAA,QAAA,EAAA,6GAAA,EAAA,MAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,iBAAA,EAAA,UAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,yBAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAC,iBAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,CAAC,eAAe,CAAC,EAAA,CAAA,CAAA,EAAA;;2FAGrB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAPhC,SAAS;+BACE,iBAAiB,EAAA,UAAA,EACf,IAAI,EAAA,OAAA,EACP,CAAC,GAAG,iBAAiB,CAAC,EAAA,aAAA,EAChB,CAAC,eAAe,CAAC,EAAA,QAAA,EAAA,igBAAA,EAAA,CAAA;;;;;"}
|
|
@@ -0,0 +1,459 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { InjectionToken, inject, Injector, Pipe, Injectable, Component, ChangeDetectionStrategy, Input, HostBinding, ElementRef, ViewContainerRef, Directive } from '@angular/core';
|
|
3
|
+
import { of, from, tap, merge, fromEvent, iif, EMPTY, startWith } from 'rxjs';
|
|
4
|
+
import * as i2 from '@angular/forms';
|
|
5
|
+
import { NgControl, ControlContainer, ReactiveFormsModule, FormControl, Validators, FormArray, FormGroup } from '@angular/forms';
|
|
6
|
+
import * as i1 from '@angular/common';
|
|
7
|
+
import { KeyValuePipe, CommonModule, AsyncPipe } from '@angular/common';
|
|
8
|
+
|
|
9
|
+
const CONTROL_DATA = new InjectionToken('Control Data');
|
|
10
|
+
|
|
11
|
+
class ControlInjector {
|
|
12
|
+
constructor() {
|
|
13
|
+
this.injector = inject(Injector);
|
|
14
|
+
}
|
|
15
|
+
transform(name, control, formGroup, index) {
|
|
16
|
+
return Injector.create({
|
|
17
|
+
parent: this.injector,
|
|
18
|
+
providers: [
|
|
19
|
+
{
|
|
20
|
+
provide: CONTROL_DATA,
|
|
21
|
+
useValue: { key: name, control, formGroup, index }
|
|
22
|
+
}
|
|
23
|
+
]
|
|
24
|
+
});
|
|
25
|
+
}
|
|
26
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ControlInjector, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
27
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.0.6", ngImport: i0, type: ControlInjector, isStandalone: true, name: "controlInjector" }); }
|
|
28
|
+
}
|
|
29
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ControlInjector, decorators: [{
|
|
30
|
+
type: Pipe,
|
|
31
|
+
args: [{
|
|
32
|
+
name: 'controlInjector',
|
|
33
|
+
standalone: true
|
|
34
|
+
}]
|
|
35
|
+
}] });
|
|
36
|
+
|
|
37
|
+
var ControlTypeValues;
|
|
38
|
+
(function (ControlTypeValues) {
|
|
39
|
+
ControlTypeValues["INPUT"] = "input";
|
|
40
|
+
ControlTypeValues["GROUP"] = "group";
|
|
41
|
+
ControlTypeValues["CHECKBOX"] = "checkbox";
|
|
42
|
+
ControlTypeValues["CHECKBOX_GROUP"] = "checkbox-group";
|
|
43
|
+
ControlTypeValues["RADIO"] = "radio";
|
|
44
|
+
ControlTypeValues["SELECT"] = "select";
|
|
45
|
+
})(ControlTypeValues || (ControlTypeValues = {}));
|
|
46
|
+
|
|
47
|
+
class ControlResolver {
|
|
48
|
+
constructor() {
|
|
49
|
+
this.lazyControlComponents = {
|
|
50
|
+
input: () => Promise.resolve().then(function () { return inputField_component; }).then(c => c.InputFieldComponent),
|
|
51
|
+
group: () => Promise.resolve().then(function () { return groupField_component; }).then(c => c.GroupFieldComponent),
|
|
52
|
+
radio: () => Promise.resolve().then(function () { return radioField_component; }).then(c => c.RadioFieldComponent),
|
|
53
|
+
checkbox: () => Promise.resolve().then(function () { return checkboxField_component; }).then(c => c.CheckboxFieldComponent),
|
|
54
|
+
'checkbox-group': () => Promise.resolve().then(function () { return checkboxGroupField_component; }).then(c => c.CheckboxGroupFieldComponent),
|
|
55
|
+
select: () => import('./superlikers-dynamic-forms-select-field.component-DuEQPRWC.mjs').then(c => c.SelectFieldComponent)
|
|
56
|
+
};
|
|
57
|
+
this.loadedControlComponents = new Map();
|
|
58
|
+
}
|
|
59
|
+
resolve(control, form) {
|
|
60
|
+
const controlType = control.controlType;
|
|
61
|
+
const isVisible = this.checkVisible(control, form);
|
|
62
|
+
if (!isVisible)
|
|
63
|
+
return;
|
|
64
|
+
const loadedComponent = this.loadedControlComponents.get(controlType);
|
|
65
|
+
if (loadedComponent)
|
|
66
|
+
return of(loadedComponent);
|
|
67
|
+
return from(this.lazyControlComponents[controlType]()).pipe(tap(component => {
|
|
68
|
+
this.loadedControlComponents.set(controlType, component);
|
|
69
|
+
}));
|
|
70
|
+
}
|
|
71
|
+
checkVisible(control, form) {
|
|
72
|
+
if (!control.visible)
|
|
73
|
+
return true;
|
|
74
|
+
return control.visible(form);
|
|
75
|
+
}
|
|
76
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ControlResolver, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
77
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ControlResolver, providedIn: 'root' }); }
|
|
78
|
+
}
|
|
79
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ControlResolver, decorators: [{
|
|
80
|
+
type: Injectable,
|
|
81
|
+
args: [{
|
|
82
|
+
providedIn: 'root'
|
|
83
|
+
}]
|
|
84
|
+
}] });
|
|
85
|
+
|
|
86
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
87
|
+
const ERROR_MESSAGES = {
|
|
88
|
+
required: () => `This field is required`,
|
|
89
|
+
requiredTrue: () => `This field is required`,
|
|
90
|
+
pattern: () => `Does not match the pattern`,
|
|
91
|
+
email: () => `Must be a valid email`,
|
|
92
|
+
minlength: ({ requiredLength }) => `Length must be at least ${requiredLength} characters`,
|
|
93
|
+
customError: error => error
|
|
94
|
+
};
|
|
95
|
+
const ERROR_MESSAGES_ES = {
|
|
96
|
+
required: () => `Este campo es obligatorio`,
|
|
97
|
+
requiredTrue: () => `Este campo es obligatorio`,
|
|
98
|
+
pattern: () => `No coincide con el patrón`,
|
|
99
|
+
email: () => `Debe ser un correo electrónico válido`,
|
|
100
|
+
minlength: ({ requiredLength }) => `La longitud debe ser al menos de ${requiredLength} caracteres`,
|
|
101
|
+
customError: error => error
|
|
102
|
+
};
|
|
103
|
+
const VALIDATION_ERROR_MESSAGES = new InjectionToken(`Validation Messages`, {
|
|
104
|
+
providedIn: 'root',
|
|
105
|
+
factory: () => ERROR_MESSAGES
|
|
106
|
+
});
|
|
107
|
+
|
|
108
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
109
|
+
class ErrorsComponent {
|
|
110
|
+
constructor() {
|
|
111
|
+
this.errors = null;
|
|
112
|
+
this.hostClass = '';
|
|
113
|
+
this.errorsMap = inject(VALIDATION_ERROR_MESSAGES);
|
|
114
|
+
}
|
|
115
|
+
getError(error) {
|
|
116
|
+
if (!this.errorsMap[error.key]) {
|
|
117
|
+
console.warn(`missing message for ${error.key}`);
|
|
118
|
+
return;
|
|
119
|
+
}
|
|
120
|
+
return this.errorsMap[error.key](error.value);
|
|
121
|
+
}
|
|
122
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ErrorsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
123
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ErrorsComponent, isStandalone: true, selector: "app-errors", inputs: { errors: "errors" }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: `
|
|
124
|
+
@for (error of errors | keyvalue; track error.key) {
|
|
125
|
+
<div class="error-text">{{ getError(error) }}</div>
|
|
126
|
+
}
|
|
127
|
+
`, isInline: true, dependencies: [{ kind: "pipe", type: KeyValuePipe, name: "keyvalue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
128
|
+
}
|
|
129
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ErrorsComponent, decorators: [{
|
|
130
|
+
type: Component,
|
|
131
|
+
args: [{
|
|
132
|
+
selector: 'app-errors',
|
|
133
|
+
standalone: true,
|
|
134
|
+
imports: [KeyValuePipe],
|
|
135
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
136
|
+
template: `
|
|
137
|
+
@for (error of errors | keyvalue; track error.key) {
|
|
138
|
+
<div class="error-text">{{ getError(error) }}</div>
|
|
139
|
+
}
|
|
140
|
+
`
|
|
141
|
+
}]
|
|
142
|
+
}], propDecorators: { errors: [{
|
|
143
|
+
type: Input
|
|
144
|
+
}], hostClass: [{
|
|
145
|
+
type: HostBinding,
|
|
146
|
+
args: ['class']
|
|
147
|
+
}] } });
|
|
148
|
+
|
|
149
|
+
class ValidatorMessageDirective {
|
|
150
|
+
constructor() {
|
|
151
|
+
this.ngControl = inject(NgControl, { self: true });
|
|
152
|
+
this.elementRef = inject(ElementRef);
|
|
153
|
+
this.componentRef = null;
|
|
154
|
+
this.parentContainer = inject(ControlContainer, { optional: true });
|
|
155
|
+
this.vcr = inject(ViewContainerRef);
|
|
156
|
+
}
|
|
157
|
+
get form() {
|
|
158
|
+
return this.parentContainer?.formDirective;
|
|
159
|
+
}
|
|
160
|
+
ngOnInit() {
|
|
161
|
+
if (!this.ngControl.control)
|
|
162
|
+
return;
|
|
163
|
+
this.controlSubscription = merge(this.ngControl.control.statusChanges, fromEvent(this.elementRef.nativeElement, 'blur'), iif(() => !!this.form, this.form.ngSubmit, EMPTY))
|
|
164
|
+
.pipe(startWith(this.ngControl.control.status))
|
|
165
|
+
.subscribe(() => {
|
|
166
|
+
if (this.ngControl.errors && this.form?.submitted) {
|
|
167
|
+
if (this.componentRef)
|
|
168
|
+
return;
|
|
169
|
+
this.componentRef = this.vcr.createComponent(ErrorsComponent);
|
|
170
|
+
this.componentRef.changeDetectorRef.markForCheck();
|
|
171
|
+
this.componentRef.setInput('errors', this.ngControl.errors);
|
|
172
|
+
}
|
|
173
|
+
else {
|
|
174
|
+
this.componentRef?.destroy();
|
|
175
|
+
this.componentRef = null;
|
|
176
|
+
}
|
|
177
|
+
});
|
|
178
|
+
}
|
|
179
|
+
ngOnDestroy() {
|
|
180
|
+
this.controlSubscription.unsubscribe();
|
|
181
|
+
}
|
|
182
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ValidatorMessageDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
183
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.6", type: ValidatorMessageDirective, isStandalone: true, selector: "[appValidatorMessage]", ngImport: i0 }); }
|
|
184
|
+
}
|
|
185
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ValidatorMessageDirective, decorators: [{
|
|
186
|
+
type: Directive,
|
|
187
|
+
args: [{
|
|
188
|
+
selector: '[appValidatorMessage]',
|
|
189
|
+
standalone: true
|
|
190
|
+
}]
|
|
191
|
+
}] });
|
|
192
|
+
|
|
193
|
+
class HelpTextComponent {
|
|
194
|
+
constructor() {
|
|
195
|
+
this.message = '';
|
|
196
|
+
}
|
|
197
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: HelpTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
198
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.6", type: HelpTextComponent, isStandalone: true, selector: "app-help-text", inputs: { message: "message" }, ngImport: i0, template: '<p class="help-text">{{ message }}</p>', isInline: true }); }
|
|
199
|
+
}
|
|
200
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: HelpTextComponent, decorators: [{
|
|
201
|
+
type: Component,
|
|
202
|
+
args: [{
|
|
203
|
+
selector: 'app-help-text',
|
|
204
|
+
standalone: true,
|
|
205
|
+
imports: [],
|
|
206
|
+
template: '<p class="help-text">{{ message }}</p>'
|
|
207
|
+
}]
|
|
208
|
+
}], propDecorators: { message: [{
|
|
209
|
+
type: Input
|
|
210
|
+
}] } });
|
|
211
|
+
|
|
212
|
+
class HelpTextDirective {
|
|
213
|
+
constructor() {
|
|
214
|
+
this.message = '';
|
|
215
|
+
this.elementRef = inject(ElementRef);
|
|
216
|
+
this.vcr = inject(ViewContainerRef);
|
|
217
|
+
this.componentRef = null;
|
|
218
|
+
}
|
|
219
|
+
ngOnInit() {
|
|
220
|
+
if (!this.message)
|
|
221
|
+
return;
|
|
222
|
+
this.componentRef = this.vcr.createComponent(HelpTextComponent);
|
|
223
|
+
this.componentRef.setInput('message', this.message);
|
|
224
|
+
}
|
|
225
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: HelpTextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
226
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.6", type: HelpTextDirective, isStandalone: true, selector: "[appHelpText]", inputs: { message: "message" }, ngImport: i0 }); }
|
|
227
|
+
}
|
|
228
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: HelpTextDirective, decorators: [{
|
|
229
|
+
type: Directive,
|
|
230
|
+
args: [{
|
|
231
|
+
selector: '[appHelpText]',
|
|
232
|
+
standalone: true
|
|
233
|
+
}]
|
|
234
|
+
}], propDecorators: { message: [{
|
|
235
|
+
type: Input
|
|
236
|
+
}] } });
|
|
237
|
+
|
|
238
|
+
class ValidatorArrayMessageDirective {
|
|
239
|
+
constructor() {
|
|
240
|
+
this.parentContainer = inject(ControlContainer);
|
|
241
|
+
this.vcr = inject(ViewContainerRef);
|
|
242
|
+
this.elementRef = inject(ElementRef);
|
|
243
|
+
this.componentRef = null;
|
|
244
|
+
}
|
|
245
|
+
get form() {
|
|
246
|
+
return this.parentContainer?.formDirective;
|
|
247
|
+
}
|
|
248
|
+
ngOnInit() {
|
|
249
|
+
const formArray = this.parentContainer.control;
|
|
250
|
+
if (!formArray)
|
|
251
|
+
return;
|
|
252
|
+
this.controlSubscription = merge(formArray.statusChanges, fromEvent(this.elementRef.nativeElement, 'blur'), iif(() => !!this.form, this.form.ngSubmit, EMPTY))
|
|
253
|
+
.pipe(startWith(formArray.status))
|
|
254
|
+
.subscribe(() => {
|
|
255
|
+
if (formArray.errors && this.form?.submitted) {
|
|
256
|
+
if (this.componentRef)
|
|
257
|
+
return;
|
|
258
|
+
this.componentRef = this.vcr.createComponent(ErrorsComponent);
|
|
259
|
+
this.componentRef.changeDetectorRef.markForCheck();
|
|
260
|
+
this.componentRef.setInput('errors', formArray.errors);
|
|
261
|
+
}
|
|
262
|
+
else {
|
|
263
|
+
this.componentRef?.destroy();
|
|
264
|
+
this.componentRef = null;
|
|
265
|
+
}
|
|
266
|
+
});
|
|
267
|
+
}
|
|
268
|
+
ngOnDestroy() {
|
|
269
|
+
this.controlSubscription?.unsubscribe();
|
|
270
|
+
}
|
|
271
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ValidatorArrayMessageDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
272
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.6", type: ValidatorArrayMessageDirective, isStandalone: true, selector: "[appValidatorArrayMessage]", ngImport: i0 }); }
|
|
273
|
+
}
|
|
274
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ValidatorArrayMessageDirective, decorators: [{
|
|
275
|
+
type: Directive,
|
|
276
|
+
args: [{
|
|
277
|
+
selector: '[appValidatorArrayMessage]',
|
|
278
|
+
standalone: true
|
|
279
|
+
}]
|
|
280
|
+
}] });
|
|
281
|
+
|
|
282
|
+
const sharedControlDeps = [CommonModule, ReactiveFormsModule, ValidatorMessageDirective, HelpTextDirective, ValidatorArrayMessageDirective, AsyncPipe];
|
|
283
|
+
const controlProvider = {
|
|
284
|
+
provide: ControlContainer,
|
|
285
|
+
useFactory: () => inject(ControlContainer, { skipSelf: true })
|
|
286
|
+
};
|
|
287
|
+
class BaseControlComponent {
|
|
288
|
+
constructor() {
|
|
289
|
+
this.hostClass = '';
|
|
290
|
+
this.control = inject(CONTROL_DATA);
|
|
291
|
+
this.formControl = new FormControl(this.control.control.value, this.resolveValidators(this.control.control));
|
|
292
|
+
this.id = this.control.control.name + this.control.control.id + (this.control.index ?? '');
|
|
293
|
+
this.parentGroupDir = inject(ControlContainer);
|
|
294
|
+
}
|
|
295
|
+
get parentFormGroup() {
|
|
296
|
+
return this.parentGroupDir.control;
|
|
297
|
+
}
|
|
298
|
+
ngOnInit() {
|
|
299
|
+
this.initialize();
|
|
300
|
+
}
|
|
301
|
+
ngOnDestroy() {
|
|
302
|
+
this.destroy();
|
|
303
|
+
}
|
|
304
|
+
initialize() {
|
|
305
|
+
if (this.control.formGroup) {
|
|
306
|
+
this.control.formGroup.addControl(this.control.control.name, this.formControl);
|
|
307
|
+
}
|
|
308
|
+
else {
|
|
309
|
+
this.parentFormGroup.addControl(this.control.control.name, this.formControl);
|
|
310
|
+
}
|
|
311
|
+
this.hostClass = `field wrapper-${this.control.control.name}`;
|
|
312
|
+
}
|
|
313
|
+
destroy() {
|
|
314
|
+
if (this.control.formGroup)
|
|
315
|
+
return;
|
|
316
|
+
else
|
|
317
|
+
this.parentFormGroup.removeControl(this.control.control.name);
|
|
318
|
+
}
|
|
319
|
+
resolveValidators({ validators = {} }) {
|
|
320
|
+
const validatorsKeys = Object.keys(validators);
|
|
321
|
+
return validatorsKeys.map(key => {
|
|
322
|
+
const value = validators[key];
|
|
323
|
+
if (key === 'required') {
|
|
324
|
+
return Validators.required;
|
|
325
|
+
}
|
|
326
|
+
if (key === 'email') {
|
|
327
|
+
return Validators.email;
|
|
328
|
+
}
|
|
329
|
+
if (key === 'requiredTrue') {
|
|
330
|
+
return Validators.requiredTrue;
|
|
331
|
+
}
|
|
332
|
+
if (key === 'minLength' && typeof value === 'number') {
|
|
333
|
+
return Validators.minLength(value);
|
|
334
|
+
}
|
|
335
|
+
if (key === 'pattern' && typeof value === 'string') {
|
|
336
|
+
return Validators.pattern(value);
|
|
337
|
+
}
|
|
338
|
+
return Validators.nullValidator;
|
|
339
|
+
});
|
|
340
|
+
}
|
|
341
|
+
getOptions() {
|
|
342
|
+
if (this.control.control.options) {
|
|
343
|
+
return of(this.control.control.options);
|
|
344
|
+
}
|
|
345
|
+
if (!this.control.control.asyncOptions)
|
|
346
|
+
return of([]);
|
|
347
|
+
return this.control.control.asyncOptions(this.parentFormGroup);
|
|
348
|
+
}
|
|
349
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: BaseControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
350
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.6", type: BaseControlComponent, host: { properties: { "class": "this.hostClass" } }, ngImport: i0 }); }
|
|
351
|
+
}
|
|
352
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: BaseControlComponent, decorators: [{
|
|
353
|
+
type: Directive
|
|
354
|
+
}], propDecorators: { hostClass: [{
|
|
355
|
+
type: HostBinding,
|
|
356
|
+
args: ['class']
|
|
357
|
+
}] } });
|
|
358
|
+
|
|
359
|
+
class CheckboxFieldComponent extends BaseControlComponent {
|
|
360
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: CheckboxFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
361
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.6", type: CheckboxFieldComponent, isStandalone: true, selector: "app-checkbox-field", usesInheritance: true, ngImport: i0, template: "<div>\n <input\n type=\"checkbox\"\n [id]=\"id\"\n [formControlName]=\"control.control.name\" />\n <label\n [for]=\"id\"\n [innerHTML]=\"control.control.label\">\n </label>\n\n <div\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorMessage\n ngDefaultControl\n [formControlName]=\"control.control.name\"></div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: i1.CommonModule }, { kind: "ngmodule", type: i2.ReactiveFormsModule }, { 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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: ValidatorMessageDirective, selector: "[appValidatorMessage]" }, { kind: "directive", type: HelpTextDirective, selector: "[appHelpText]", inputs: ["message"] }], viewProviders: [controlProvider] }); }
|
|
362
|
+
}
|
|
363
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: CheckboxFieldComponent, decorators: [{
|
|
364
|
+
type: Component,
|
|
365
|
+
args: [{ selector: 'app-checkbox-field', standalone: true, imports: [...sharedControlDeps], viewProviders: [controlProvider], template: "<div>\n <input\n type=\"checkbox\"\n [id]=\"id\"\n [formControlName]=\"control.control.name\" />\n <label\n [for]=\"id\"\n [innerHTML]=\"control.control.label\">\n </label>\n\n <div\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorMessage\n ngDefaultControl\n [formControlName]=\"control.control.name\"></div>\n</div>\n" }]
|
|
366
|
+
}] });
|
|
367
|
+
|
|
368
|
+
var checkboxField_component = /*#__PURE__*/Object.freeze({
|
|
369
|
+
__proto__: null,
|
|
370
|
+
CheckboxFieldComponent: CheckboxFieldComponent
|
|
371
|
+
});
|
|
372
|
+
|
|
373
|
+
class CheckboxGroupFieldComponent extends BaseControlComponent {
|
|
374
|
+
constructor() {
|
|
375
|
+
super(...arguments);
|
|
376
|
+
this.formControl = new FormArray([], this.resolveValidators(this.control.control));
|
|
377
|
+
}
|
|
378
|
+
change(event) {
|
|
379
|
+
const element = event.target;
|
|
380
|
+
const value = element.value;
|
|
381
|
+
const index = this.formControl.value.indexOf(value);
|
|
382
|
+
if (index === -1) {
|
|
383
|
+
const fc = new FormControl(value);
|
|
384
|
+
this.formControl.push(fc);
|
|
385
|
+
}
|
|
386
|
+
else {
|
|
387
|
+
this.formControl.removeAt(index);
|
|
388
|
+
}
|
|
389
|
+
}
|
|
390
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: CheckboxGroupFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
391
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: CheckboxGroupFieldComponent, isStandalone: true, selector: "app-checkbox-group-field", usesInheritance: true, ngImport: i0, template: "<label for=\"\">\n {{ control.control.label }}\n</label>\n\n<div\n [formArrayName]=\"control.control.name\"\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorArrayMessage>\n @for (option of getOptions() | async; track option.value; let index = $index) {\n <div>\n <input\n type=\"checkbox\"\n (change)=\"change($event)\"\n [value]=\"option.value\"\n [id]=\"id + index\" />\n <label [for]=\"id + index\">\n {{ option.label }}\n </label>\n </div>\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: i1.CommonModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: i2.ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: HelpTextDirective, selector: "[appHelpText]", inputs: ["message"] }, { kind: "directive", type: ValidatorArrayMessageDirective, selector: "[appValidatorArrayMessage]" }], viewProviders: [controlProvider] }); }
|
|
392
|
+
}
|
|
393
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: CheckboxGroupFieldComponent, decorators: [{
|
|
394
|
+
type: Component,
|
|
395
|
+
args: [{ selector: 'app-checkbox-group-field', standalone: true, imports: [...sharedControlDeps], viewProviders: [controlProvider], template: "<label for=\"\">\n {{ control.control.label }}\n</label>\n\n<div\n [formArrayName]=\"control.control.name\"\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorArrayMessage>\n @for (option of getOptions() | async; track option.value; let index = $index) {\n <div>\n <input\n type=\"checkbox\"\n (change)=\"change($event)\"\n [value]=\"option.value\"\n [id]=\"id + index\" />\n <label [for]=\"id + index\">\n {{ option.label }}\n </label>\n </div>\n }\n</div>\n" }]
|
|
396
|
+
}] });
|
|
397
|
+
|
|
398
|
+
var checkboxGroupField_component = /*#__PURE__*/Object.freeze({
|
|
399
|
+
__proto__: null,
|
|
400
|
+
CheckboxGroupFieldComponent: CheckboxGroupFieldComponent
|
|
401
|
+
});
|
|
402
|
+
|
|
403
|
+
class GroupFieldComponent extends BaseControlComponent {
|
|
404
|
+
constructor() {
|
|
405
|
+
super(...arguments);
|
|
406
|
+
this.controlResolver = inject(ControlResolver);
|
|
407
|
+
this.formControl = new FormGroup({});
|
|
408
|
+
}
|
|
409
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: GroupFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
410
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: GroupFieldComponent, isStandalone: true, selector: "app-group-field", usesInheritance: true, ngImport: i0, template: "<div [formGroupName]=\"control.control.name\">\n @for (control of control.control.controls; track control.name) {\n <ng-container\n [ngComponentOutlet]=\"controlResolver.resolve(control, parentFormGroup) | async\"\n [ngComponentOutletInjector]=\"control.name | controlInjector: control\">\n </ng-container>\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: i1.CommonModule }, { kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: i2.ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "pipe", type: ControlInjector, name: "controlInjector" }], viewProviders: [controlProvider] }); }
|
|
411
|
+
}
|
|
412
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: GroupFieldComponent, decorators: [{
|
|
413
|
+
type: Component,
|
|
414
|
+
args: [{ selector: 'app-group-field', standalone: true, imports: [...sharedControlDeps, ControlInjector], viewProviders: [controlProvider], template: "<div [formGroupName]=\"control.control.name\">\n @for (control of control.control.controls; track control.name) {\n <ng-container\n [ngComponentOutlet]=\"controlResolver.resolve(control, parentFormGroup) | async\"\n [ngComponentOutletInjector]=\"control.name | controlInjector: control\">\n </ng-container>\n }\n</div>\n" }]
|
|
415
|
+
}] });
|
|
416
|
+
|
|
417
|
+
var groupField_component = /*#__PURE__*/Object.freeze({
|
|
418
|
+
__proto__: null,
|
|
419
|
+
GroupFieldComponent: GroupFieldComponent
|
|
420
|
+
});
|
|
421
|
+
|
|
422
|
+
class InputFieldComponent extends BaseControlComponent {
|
|
423
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: InputFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
424
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.6", type: InputFieldComponent, isStandalone: true, selector: "app-input-field", usesInheritance: true, ngImport: i0, template: "<label [for]=\"id\">\n {{ control.control.label }}\n</label>\n<input\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorMessage\n [type]=\"control.control.type\"\n [formControlName]=\"control.control.name\"\n [checked]=\"control.control.value\"\n [id]=\"id\" />\n", dependencies: [{ kind: "ngmodule", type: i1.CommonModule }, { kind: "ngmodule", type: i2.ReactiveFormsModule }, { 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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: ValidatorMessageDirective, selector: "[appValidatorMessage]" }, { kind: "directive", type: HelpTextDirective, selector: "[appHelpText]", inputs: ["message"] }], viewProviders: [controlProvider] }); }
|
|
425
|
+
}
|
|
426
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: InputFieldComponent, decorators: [{
|
|
427
|
+
type: Component,
|
|
428
|
+
args: [{ selector: 'app-input-field', standalone: true, imports: [...sharedControlDeps], viewProviders: [controlProvider], template: "<label [for]=\"id\">\n {{ control.control.label }}\n</label>\n<input\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorMessage\n [type]=\"control.control.type\"\n [formControlName]=\"control.control.name\"\n [checked]=\"control.control.value\"\n [id]=\"id\" />\n" }]
|
|
429
|
+
}] });
|
|
430
|
+
|
|
431
|
+
var inputField_component = /*#__PURE__*/Object.freeze({
|
|
432
|
+
__proto__: null,
|
|
433
|
+
InputFieldComponent: InputFieldComponent
|
|
434
|
+
});
|
|
435
|
+
|
|
436
|
+
class RadioFieldComponent extends BaseControlComponent {
|
|
437
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: RadioFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
438
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: RadioFieldComponent, isStandalone: true, selector: "app-radio-field", usesInheritance: true, ngImport: i0, template: "<label for=\"\">\n {{ control.control.label }}\n</label>\n\n<div>\n @for (option of getOptions() | async; track option.value; let i = $index) {\n <div>\n <input\n type=\"radio\"\n [formControlName]=\"control.control.name\"\n [value]=\"option.value\"\n [id]=\"id + i\" />\n <label [for]=\"id + i\">\n {{ option.label }}\n </label>\n </div>\n }\n</div>\n\n<div\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorMessage\n [formControlName]=\"control.control.name\"\n ngDefaultControl></div>\n", dependencies: [{ kind: "ngmodule", type: i1.CommonModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: i2.ReactiveFormsModule }, { 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.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.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: ValidatorMessageDirective, selector: "[appValidatorMessage]" }, { kind: "directive", type: HelpTextDirective, selector: "[appHelpText]", inputs: ["message"] }], viewProviders: [controlProvider] }); }
|
|
439
|
+
}
|
|
440
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: RadioFieldComponent, decorators: [{
|
|
441
|
+
type: Component,
|
|
442
|
+
args: [{ selector: 'app-radio-field', standalone: true, imports: [...sharedControlDeps], viewProviders: [controlProvider], template: "<label for=\"\">\n {{ control.control.label }}\n</label>\n\n<div>\n @for (option of getOptions() | async; track option.value; let i = $index) {\n <div>\n <input\n type=\"radio\"\n [formControlName]=\"control.control.name\"\n [value]=\"option.value\"\n [id]=\"id + i\" />\n <label [for]=\"id + i\">\n {{ option.label }}\n </label>\n </div>\n }\n</div>\n\n<div\n appHelpText\n [message]=\"control.control.helpText ?? ''\"\n appValidatorMessage\n [formControlName]=\"control.control.name\"\n ngDefaultControl></div>\n" }]
|
|
443
|
+
}] });
|
|
444
|
+
|
|
445
|
+
var radioField_component = /*#__PURE__*/Object.freeze({
|
|
446
|
+
__proto__: null,
|
|
447
|
+
RadioFieldComponent: RadioFieldComponent
|
|
448
|
+
});
|
|
449
|
+
|
|
450
|
+
/*
|
|
451
|
+
* Public API Surface of ngx-dynamic-forms
|
|
452
|
+
*/
|
|
453
|
+
|
|
454
|
+
/**
|
|
455
|
+
* Generated bundle index. Do not edit.
|
|
456
|
+
*/
|
|
457
|
+
|
|
458
|
+
export { BaseControlComponent, CONTROL_DATA, CheckboxFieldComponent, CheckboxGroupFieldComponent, ControlInjector, ControlResolver, ControlTypeValues, ERROR_MESSAGES, ERROR_MESSAGES_ES, ErrorsComponent, GroupFieldComponent, HelpTextComponent, HelpTextDirective, InputFieldComponent, RadioFieldComponent, VALIDATION_ERROR_MESSAGES, ValidatorArrayMessageDirective, ValidatorMessageDirective, controlProvider, sharedControlDeps };
|
|
459
|
+
//# sourceMappingURL=superlikers-dynamic-forms.mjs.map
|