@webilix/ngx-form-m3 0.0.7 → 0.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/webilix-ngx-form-m3.mjs +134 -59
- package/fesm2022/webilix-ngx-form-m3.mjs.map +1 -1
- package/lib/inputs/index.d.ts +2 -0
- package/lib/inputs/input.component.d.ts +5 -0
- package/lib/inputs/moment/input-moment.component.d.ts +15 -0
- package/lib/inputs/moment/input-moment.interface.d.ts +12 -0
- package/lib/ngx-form.interface.d.ts +2 -2
- package/lib/validators/index.d.ts +2 -0
- package/lib/validators/moment/max-moment.validator.d.ts +2 -0
- package/lib/validators/moment/min-moment.validator.d.ts +2 -0
- package/package.json +8 -8
|
@@ -23,10 +23,10 @@ import * as i1$3 from '@angular/router';
|
|
|
23
23
|
|
|
24
24
|
class AutoCompleteDirective {
|
|
25
25
|
autocomplete = 'one-time-code';
|
|
26
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
27
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
26
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AutoCompleteDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
27
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: AutoCompleteDirective, isStandalone: true, selector: "input[type=\"text\"]", host: { properties: { "attr.autocomplete": "this.autocomplete" } }, ngImport: i0 });
|
|
28
28
|
}
|
|
29
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
29
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AutoCompleteDirective, decorators: [{
|
|
30
30
|
type: Directive,
|
|
31
31
|
args: [{ selector: 'input[type="text"]' }]
|
|
32
32
|
}], propDecorators: { autocomplete: [{
|
|
@@ -48,10 +48,10 @@ class AutoFocusDirective {
|
|
|
48
48
|
return;
|
|
49
49
|
setTimeout(() => input.focus && input.focus(), 0);
|
|
50
50
|
}
|
|
51
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
52
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
51
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AutoFocusDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
52
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: AutoFocusDirective, isStandalone: true, selector: "[AutoFocusDirective]", inputs: { AutoFocusDirective: "AutoFocusDirective" }, ngImport: i0 });
|
|
53
53
|
}
|
|
54
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
54
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AutoFocusDirective, decorators: [{
|
|
55
55
|
type: Directive,
|
|
56
56
|
args: [{ selector: '[AutoFocusDirective]' }]
|
|
57
57
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { AutoFocusDirective: [{
|
|
@@ -96,10 +96,10 @@ class AutoHeightDirective {
|
|
|
96
96
|
this.renderer2.setStyle(this.elementRef.nativeElement, 'height', value);
|
|
97
97
|
this.renderer2.setStyle(this.elementRef.nativeElement, 'overflow', 'auto');
|
|
98
98
|
}
|
|
99
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
100
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
99
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AutoHeightDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
|
|
100
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: AutoHeightDirective, isStandalone: true, selector: "[AutoHeightDirective]", inputs: { AutoHeightDirective: "AutoHeightDirective", minHeight: "minHeight", maxHeight: "maxHeight" }, host: { listeners: { "focus": "focus()", "blur": "blur()", "input": "resize()" } }, ngImport: i0 });
|
|
101
101
|
}
|
|
102
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
102
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AutoHeightDirective, decorators: [{
|
|
103
103
|
type: Directive,
|
|
104
104
|
args: [{ selector: '[AutoHeightDirective]' }]
|
|
105
105
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { AutoHeightDirective: [{
|
|
@@ -144,10 +144,10 @@ class FormErrorDirective {
|
|
|
144
144
|
const top = element.getBoundingClientRect().top + window.scrollY - labelOffset;
|
|
145
145
|
window.scroll({ top, left: 0, behavior: 'smooth' });
|
|
146
146
|
}
|
|
147
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
148
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
147
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: FormErrorDirective, deps: [{ token: i0.ElementRef }, { token: i1.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
148
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: FormErrorDirective, isStandalone: true, selector: "form.ngx-form", host: { listeners: { "submit": "onSubmit()" } }, ngImport: i0 });
|
|
149
149
|
}
|
|
150
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
150
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: FormErrorDirective, decorators: [{
|
|
151
151
|
type: Directive,
|
|
152
152
|
args: [{ selector: 'form.ngx-form' }]
|
|
153
153
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.FormGroupDirective, decorators: [{
|
|
@@ -179,6 +179,10 @@ class InputErrorPipe {
|
|
|
179
179
|
return `تاریخ باید برابر یا بعد از ${value} انتخاب شده باشد.`;
|
|
180
180
|
case 'maxdate':
|
|
181
181
|
return `تاریخ باید برابر یا قبل از ${value} انتخاب شده باشد.`;
|
|
182
|
+
case 'minmoment':
|
|
183
|
+
return `زمان باید برابر یا بعد از ${value} انتخاب شده باشد.`;
|
|
184
|
+
case 'maxmoment':
|
|
185
|
+
return `زمان باید برابر یا قبل از ${value} انتخاب شده باشد.`;
|
|
182
186
|
case 'pattern':
|
|
183
187
|
switch (type) {
|
|
184
188
|
case 'EMAIL':
|
|
@@ -206,10 +210,10 @@ class InputErrorPipe {
|
|
|
206
210
|
}
|
|
207
211
|
return 'مقدار وارد شده صحیح نیست.';
|
|
208
212
|
}
|
|
209
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
210
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.
|
|
213
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputErrorPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
214
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.5", ngImport: i0, type: InputErrorPipe, isStandalone: true, name: "InputErrorPipe" });
|
|
211
215
|
}
|
|
212
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
216
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputErrorPipe, decorators: [{
|
|
213
217
|
type: Pipe,
|
|
214
218
|
args: [{ name: 'InputErrorPipe' }]
|
|
215
219
|
}] });
|
|
@@ -226,10 +230,10 @@ class MultiLinePipe {
|
|
|
226
230
|
? this.sanitizer.bypassSecurityTrustHtml(value.replace(/(?:\r\n|\r|\n)/g, '<br />'))
|
|
227
231
|
: Helper.STRING.escapeHTML(value).replace(/(?:\r\n|\r|\n)/g, '<br />');
|
|
228
232
|
}
|
|
229
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
230
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.
|
|
233
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: MultiLinePipe, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
|
|
234
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.5", ngImport: i0, type: MultiLinePipe, isStandalone: true, name: "MultiLinePipe" });
|
|
231
235
|
}
|
|
232
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
236
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: MultiLinePipe, decorators: [{
|
|
233
237
|
type: Pipe,
|
|
234
238
|
args: [{ name: 'MultiLinePipe' }]
|
|
235
239
|
}], ctorParameters: () => [{ type: i1$1.DomSanitizer }] });
|
|
@@ -244,10 +248,10 @@ class InputColorComponent {
|
|
|
244
248
|
formControl = inject(INPUT_CONTROL);
|
|
245
249
|
input = inject(INPUT_TYPE);
|
|
246
250
|
config = inject(INPUT_CONFIG);
|
|
247
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
248
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
251
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputColorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
252
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputColorComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-color" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u0631\u0646\u06AF' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon (click)=\"formControl.value ? formControl.setValue(null) : colorInput.click(); formControl.markAsTouched()\">\n {{ formControl.value ? 'close' : 'palette' }}\n </mat-icon>\n </span>\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n\n <div class=\"ngx-helper-form-m3-color-input\">\n <section>\n <input type=\"color\" (input)=\"formControl.setValue(colorInput.value)\" [value]=\"formControl.value\" #colorInput />\n <div\n class=\"color\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [style.background-color]=\"formControl.value || 'transparent'\"\n (click)=\"formControl.disabled ? null : colorInput.click(); formControl.markAsTouched()\"\n >\n \n </div>\n </section>\n\n <div\n class=\"value ngx-form-m3-en\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n (click)=\"formControl.disabled ? null : colorInput.click(); formControl.markAsTouched()\"\n >\n {{ formControl.value || ' ' }}\n </div>\n </div>\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }] });
|
|
249
253
|
}
|
|
250
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
254
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputColorComponent, decorators: [{
|
|
251
255
|
type: Component,
|
|
252
256
|
args: [{ host: { selector: 'input-color' }, imports: [ReactiveFormsModule, MatFormField, MatIcon, MatInputModule, InputErrorPipe, MultiLinePipe], template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u0631\u0646\u06AF' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon (click)=\"formControl.value ? formControl.setValue(null) : colorInput.click(); formControl.markAsTouched()\">\n {{ formControl.value ? 'close' : 'palette' }}\n </mat-icon>\n </span>\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n\n <div class=\"ngx-helper-form-m3-color-input\">\n <section>\n <input type=\"color\" (input)=\"formControl.setValue(colorInput.value)\" [value]=\"formControl.value\" #colorInput />\n <div\n class=\"color\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [style.background-color]=\"formControl.value || 'transparent'\"\n (click)=\"formControl.disabled ? null : colorInput.click(); formControl.markAsTouched()\"\n >\n \n </div>\n </section>\n\n <div\n class=\"value ngx-form-m3-en\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n (click)=\"formControl.disabled ? null : colorInput.click(); formControl.markAsTouched()\"\n >\n {{ formControl.value || ' ' }}\n </div>\n </div>\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n" }]
|
|
253
257
|
}] });
|
|
@@ -282,36 +286,64 @@ class InputDateComponent {
|
|
|
282
286
|
this.formControl.markAsTouched();
|
|
283
287
|
}, () => this.formControl.markAsTouched());
|
|
284
288
|
}
|
|
285
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
286
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
289
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputDateComponent, deps: [{ token: i1$2.NgxCalendarService }], target: i0.ɵɵFactoryTarget.Component });
|
|
290
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputDateComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-date" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u062A\u0627\u0631\u06CC\u062E' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon (click)=\"formControl.value ? formControl.setValue(null) : setDate(); formControl.markAsTouched()\">\n {{ formControl.value ? 'close' : 'calendar_month' }}\n </mat-icon>\n </span>\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n type=\"text\"\n matInput\n [readonly]=\"true\"\n [disabled]=\"formControl.disabled\"\n (click)=\"setDate()\"\n [value]=\"formControl.value | ngxHelperDate\"\n />\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }, { kind: "pipe", type: NgxHelperDatePipe, name: "ngxHelperDate" }] });
|
|
287
291
|
}
|
|
288
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
292
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputDateComponent, decorators: [{
|
|
289
293
|
type: Component,
|
|
290
294
|
args: [{ host: { selector: 'input-date' }, imports: [ReactiveFormsModule, MatFormField, MatIcon, MatInputModule, InputErrorPipe, MultiLinePipe, NgxHelperDatePipe], template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u062A\u0627\u0631\u06CC\u062E' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon (click)=\"formControl.value ? formControl.setValue(null) : setDate(); formControl.markAsTouched()\">\n {{ formControl.value ? 'close' : 'calendar_month' }}\n </mat-icon>\n </span>\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n type=\"text\"\n matInput\n [readonly]=\"true\"\n [disabled]=\"formControl.disabled\"\n (click)=\"setDate()\"\n [value]=\"formControl.value | ngxHelperDate\"\n />\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n" }]
|
|
291
295
|
}], ctorParameters: () => [{ type: i1$2.NgxCalendarService }] });
|
|
292
296
|
|
|
293
297
|
const MaxDateValidator = (max) => {
|
|
298
|
+
const jalali = JalaliDateTime();
|
|
294
299
|
return (formControl) => {
|
|
295
300
|
const value = formControl.value;
|
|
296
301
|
if (Helper.IS.empty(value) || !Helper.IS.date(value))
|
|
297
302
|
return null;
|
|
298
|
-
const jalali = JalaliDateTime();
|
|
299
303
|
const maximum = jalali.periodDay(1, max === 'NOW' ? new Date() : max).to;
|
|
300
304
|
return value.getTime() > maximum.getTime() ? { maxdate: jalali.toFullText(maximum, { format: 'Y/M/D' }) } : null;
|
|
301
305
|
};
|
|
302
306
|
};
|
|
303
307
|
|
|
304
308
|
const MinDateValidator = (min) => {
|
|
309
|
+
const jalali = JalaliDateTime();
|
|
305
310
|
return (formControl) => {
|
|
306
311
|
const value = formControl.value;
|
|
307
312
|
if (Helper.IS.empty(value) || !Helper.IS.date(value))
|
|
308
313
|
return null;
|
|
309
|
-
const jalali = JalaliDateTime();
|
|
310
314
|
const minimum = jalali.periodDay(1, min === 'NOW' ? new Date() : min).from;
|
|
311
315
|
return value.getTime() < minimum.getTime() ? { mindate: jalali.toFullText(minimum, { format: 'Y/M/D' }) } : null;
|
|
312
316
|
};
|
|
313
317
|
};
|
|
314
318
|
|
|
319
|
+
const MaxMomentValidator = (max) => {
|
|
320
|
+
const jalali = JalaliDateTime();
|
|
321
|
+
const formatDate = (date) => jalali.toString(date, { format: 'Y-M-D H:I' });
|
|
322
|
+
return (formControl) => {
|
|
323
|
+
const value = formControl.value;
|
|
324
|
+
if (Helper.IS.empty(value) || !Helper.IS.date(value))
|
|
325
|
+
return null;
|
|
326
|
+
const maximum = max === 'NOW' ? new Date() : max;
|
|
327
|
+
return formatDate(value) > formatDate(maximum)
|
|
328
|
+
? { maxmoment: jalali.toFullText(maximum, { format: 'H:I Y/M/D' }) }
|
|
329
|
+
: null;
|
|
330
|
+
};
|
|
331
|
+
};
|
|
332
|
+
|
|
333
|
+
const MinMomentValidator = (min) => {
|
|
334
|
+
const jalali = JalaliDateTime();
|
|
335
|
+
const formatDate = (date) => jalali.toString(date, { format: 'Y-M-D H:I' });
|
|
336
|
+
return (formControl) => {
|
|
337
|
+
const value = formControl.value;
|
|
338
|
+
if (Helper.IS.empty(value) || !Helper.IS.date(value))
|
|
339
|
+
return null;
|
|
340
|
+
const minimum = min === 'NOW' ? new Date() : min;
|
|
341
|
+
return formatDate(value) < formatDate(minimum)
|
|
342
|
+
? { minmoment: jalali.toFullText(minimum, { format: 'H:I Y/M/D' }) }
|
|
343
|
+
: null;
|
|
344
|
+
};
|
|
345
|
+
};
|
|
346
|
+
|
|
315
347
|
const LengthValidator = (length) => {
|
|
316
348
|
return (formControl) => {
|
|
317
349
|
const value = formControl.value;
|
|
@@ -339,10 +371,10 @@ class InputEmailComponent {
|
|
|
339
371
|
formControl = inject(INPUT_CONTROL);
|
|
340
372
|
input = inject(INPUT_TYPE);
|
|
341
373
|
config = inject(INPUT_CONFIG);
|
|
342
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
343
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
374
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputEmailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
375
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputEmailComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-email" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u0627\u06CC\u0645\u06CC\u0644' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- ICON -->\n @if (input.showIcon) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon>alternate_email</mat-icon>\n </span>\n }\n\n <input\n matInput\n type=\"text\"\n inputmode=\"email\"\n [name]=\"input.name\"\n [formControl]=\"formControl\"\n class=\"ngx-form-m3-en\"\n [dir]=\"'ltr'\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n />\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i4.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "directive", type: AutoCompleteDirective, selector: "input[type=\"text\"]" }, { kind: "directive", type: AutoFocusDirective, selector: "[AutoFocusDirective]", inputs: ["AutoFocusDirective"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }] });
|
|
344
376
|
}
|
|
345
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
377
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputEmailComponent, decorators: [{
|
|
346
378
|
type: Component,
|
|
347
379
|
args: [{ host: { selector: 'input-email' }, imports: [
|
|
348
380
|
ReactiveFormsModule,
|
|
@@ -379,10 +411,10 @@ class InputFileComponent {
|
|
|
379
411
|
this.formControl.setValue(file);
|
|
380
412
|
this.formControl.markAsTouched();
|
|
381
413
|
}
|
|
382
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
383
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
414
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputFileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
415
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputFileComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-file" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u0641\u0627\u06CC\u0644' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon (click)=\"formControl.value ? formControl.setValue(null) : fileInput.click()\">\n {{ formControl.value ? 'close' : 'insert_drive_file' }}\n </mat-icon>\n </span>\n\n <!-- INPUT -->\n <input\n type=\"file\"\n [style.display]=\"'none !important'\"\n [accept]=\"(input.mimes === 'IMAGE' ? ['image/gif', 'image/jpeg', 'image/png'] : input.mimes || ['*']).join(',')\"\n (change)=\"setFile($event); fileInput.value = ''\"\n #fileInput\n />\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n\n <div\n class=\"ngx-helper-form-m3-file-input\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n (click)=\"fileInput.value = ''; fileInput.click()\"\n >\n <div class=\"size\">{{ formControl.value?.size | ngxHelperFileSize }}</div>\n <input type=\"text \" matInput [readonly]=\"true\" [disabled]=\"formControl.disabled\" class=\"ngx-form-m3-en\" />\n <div class=\"name ngx-form-m3-en\">{{ formControl.value?.name || ' ' }}</div>\n </div>\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }, { kind: "pipe", type: NgxHelperFileSizePipe, name: "ngxHelperFileSize" }] });
|
|
384
416
|
}
|
|
385
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
417
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputFileComponent, decorators: [{
|
|
386
418
|
type: Component,
|
|
387
419
|
args: [{ host: { selector: 'input-file' }, imports: [
|
|
388
420
|
ReactiveFormsModule,
|
|
@@ -409,10 +441,10 @@ class InputMobileComponent {
|
|
|
409
441
|
input = inject(INPUT_TYPE);
|
|
410
442
|
config = inject(INPUT_CONFIG);
|
|
411
443
|
inputTransformFn = (value) => Helper.STRING.changeNumbers(value.toString(), 'EN');
|
|
412
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
413
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
444
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputMobileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
445
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputMobileComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-mobile" } }, providers: [provideNgxMask()], ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u0645\u0648\u0628\u0627\u06CC\u0644' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- ICON & SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span class=\"ngx-form-m3-en\">09</span>\n @if (input.showIcon) { <mat-icon>smartphone</mat-icon> }\n </span>\n\n <input\n matInput\n type=\"text\"\n inputmode=\"numeric\"\n [name]=\"input.name\"\n [formControl]=\"formControl\"\n class=\"ngx-form-m3-en\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n [mask]=\"'00-000-0000'\"\n [inputTransformFn]=\"inputTransformFn\"\n />\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions", "instantPrefix"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { kind: "directive", type: AutoCompleteDirective, selector: "input[type=\"text\"]" }, { kind: "directive", type: AutoFocusDirective, selector: "[AutoFocusDirective]", inputs: ["AutoFocusDirective"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }] });
|
|
414
446
|
}
|
|
415
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
447
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputMobileComponent, decorators: [{
|
|
416
448
|
type: Component,
|
|
417
449
|
args: [{ host: { selector: 'input-mobile' }, imports: [
|
|
418
450
|
ReactiveFormsModule,
|
|
@@ -437,6 +469,48 @@ class InputMobileMethods extends InputMethods {
|
|
|
437
469
|
}
|
|
438
470
|
}
|
|
439
471
|
|
|
472
|
+
class InputMomentComponent {
|
|
473
|
+
ngxCalendarService;
|
|
474
|
+
formControl = inject(INPUT_CONTROL);
|
|
475
|
+
input = inject(INPUT_TYPE);
|
|
476
|
+
config = inject(INPUT_CONFIG);
|
|
477
|
+
constructor(ngxCalendarService) {
|
|
478
|
+
this.ngxCalendarService = ngxCalendarService;
|
|
479
|
+
}
|
|
480
|
+
setMoment() {
|
|
481
|
+
if (this.formControl.disabled)
|
|
482
|
+
return;
|
|
483
|
+
const minDate = this.input.minDate === 'NOW' ? new Date() : this.input.minDate;
|
|
484
|
+
const maxDate = this.input.maxDate === 'NOW' ? new Date() : this.input.maxDate;
|
|
485
|
+
this.ngxCalendarService
|
|
486
|
+
.getMoment({ title: this.input.title || 'زمان', value: this.formControl.value, minDate, maxDate })
|
|
487
|
+
.dialog((moment) => {
|
|
488
|
+
this.formControl.setValue(moment.moment);
|
|
489
|
+
this.formControl.markAsTouched();
|
|
490
|
+
}, () => this.formControl.markAsTouched());
|
|
491
|
+
}
|
|
492
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputMomentComponent, deps: [{ token: i1$2.NgxCalendarService }], target: i0.ɵɵFactoryTarget.Component });
|
|
493
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputMomentComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-moment" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u0632\u0645\u0627\u0646' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon (click)=\"formControl.value ? formControl.setValue(null) : setMoment(); formControl.markAsTouched()\">\n {{ formControl.value ? 'close' : 'calendar_month' }}\n </mat-icon>\n </span>\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n type=\"text\"\n matInput\n [readonly]=\"true\"\n [disabled]=\"formControl.disabled\"\n (click)=\"setMoment()\"\n [value]=\"formControl.value | ngxHelperDate : { format: 'FULL' }\"\n />\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }, { kind: "pipe", type: NgxHelperDatePipe, name: "ngxHelperDate" }] });
|
|
494
|
+
}
|
|
495
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputMomentComponent, decorators: [{
|
|
496
|
+
type: Component,
|
|
497
|
+
args: [{ host: { selector: 'input-moment' }, imports: [ReactiveFormsModule, MatFormField, MatIcon, MatInputModule, InputErrorPipe, MultiLinePipe, NgxHelperDatePipe], template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u0632\u0645\u0627\u0646' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon (click)=\"formControl.value ? formControl.setValue(null) : setMoment(); formControl.markAsTouched()\">\n {{ formControl.value ? 'close' : 'calendar_month' }}\n </mat-icon>\n </span>\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n type=\"text\"\n matInput\n [readonly]=\"true\"\n [disabled]=\"formControl.disabled\"\n (click)=\"setMoment()\"\n [value]=\"formControl.value | ngxHelperDate : { format: 'FULL' }\"\n />\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n" }]
|
|
498
|
+
}], ctorParameters: () => [{ type: i1$2.NgxCalendarService }] });
|
|
499
|
+
|
|
500
|
+
class InputMomentMethods extends InputMethods {
|
|
501
|
+
control(input, validators) {
|
|
502
|
+
if (input.minDate)
|
|
503
|
+
validators.push(MinMomentValidator(input.minDate));
|
|
504
|
+
if (input.maxDate)
|
|
505
|
+
validators.push(MaxMomentValidator(input.maxDate));
|
|
506
|
+
const value = input.value && Helper.IS.date(input.value) ? input.value : null;
|
|
507
|
+
return new FormControl(value, validators);
|
|
508
|
+
}
|
|
509
|
+
value(value, input) {
|
|
510
|
+
return Helper.IS.date(value) ? value : null;
|
|
511
|
+
}
|
|
512
|
+
}
|
|
513
|
+
|
|
440
514
|
class InputNameComponent {
|
|
441
515
|
formControl = inject(INPUT_CONTROL);
|
|
442
516
|
input = inject(INPUT_TYPE);
|
|
@@ -468,10 +542,10 @@ class InputNameComponent {
|
|
|
468
542
|
const value = first !== '' && last !== '' ? { first, last } : null;
|
|
469
543
|
this.formControl.setValue(value);
|
|
470
544
|
}
|
|
471
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
472
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
545
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputNameComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
546
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputNameComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-name" } }, ngImport: i0, template: "<!-- INPUT -->\n<input type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n\n<div class=\"ngx-helper-form-m3-name-input\">\n <!-- FIRST NAME -->\n <mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>\u0646\u0627\u0645 {{ input.title || '' }}</mat-label>\n @if (firstFormControl.invalid) { <mat-error>{{ firstFormControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <input\n matInput\n type=\"text\"\n [name]=\"input.name + '-first'\"\n [formControl]=\"firstFormControl\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n (input)=\"setName()\"\n />\n </mat-form-field>\n <!-- LAST NAME -->\n <mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>\u0646\u0627\u0645 \u062E\u0627\u0646\u0648\u0627\u062F\u06AF\u06CC {{ input.title || '' }}</mat-label>\n @if (lastFormControl.invalid) { <mat-error>{{ lastFormControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <input matInput type=\"text\" [name]=\"input.name + '-last'\" [formControl]=\"lastFormControl\" (input)=\"setName()\" />\n </mat-form-field>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: AutoCompleteDirective, selector: "input[type=\"text\"]" }, { kind: "directive", type: AutoFocusDirective, selector: "[AutoFocusDirective]", inputs: ["AutoFocusDirective"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }] });
|
|
473
547
|
}
|
|
474
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
548
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputNameComponent, decorators: [{
|
|
475
549
|
type: Component,
|
|
476
550
|
args: [{ host: { selector: 'input-name' }, imports: [ReactiveFormsModule, MatFormField, MatInputModule, AutoCompleteDirective, AutoFocusDirective, InputErrorPipe], template: "<!-- INPUT -->\n<input type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n\n<div class=\"ngx-helper-form-m3-name-input\">\n <!-- FIRST NAME -->\n <mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>\u0646\u0627\u0645 {{ input.title || '' }}</mat-label>\n @if (firstFormControl.invalid) { <mat-error>{{ firstFormControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <input\n matInput\n type=\"text\"\n [name]=\"input.name + '-first'\"\n [formControl]=\"firstFormControl\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n (input)=\"setName()\"\n />\n </mat-form-field>\n <!-- LAST NAME -->\n <mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>\u0646\u0627\u0645 \u062E\u0627\u0646\u0648\u0627\u062F\u06AF\u06CC {{ input.title || '' }}</mat-label>\n @if (lastFormControl.invalid) { <mat-error>{{ lastFormControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <input matInput type=\"text\" [name]=\"input.name + '-last'\" [formControl]=\"lastFormControl\" (input)=\"setName()\" />\n </mat-form-field>\n</div>\n" }]
|
|
477
551
|
}] });
|
|
@@ -491,10 +565,10 @@ class InputPasswordComponent {
|
|
|
491
565
|
input = inject(INPUT_TYPE);
|
|
492
566
|
config = inject(INPUT_CONFIG);
|
|
493
567
|
showPassword = false;
|
|
494
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
495
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
568
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
569
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputPasswordComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-password" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u06A9\u0644\u0645\u0647 \u0639\u0628\u0648\u0631' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SHOW PASSWORD -->\n <span\n matTextSuffix\n class=\"ngx-form-m3-input-suffix click\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n (click)=\"showPassword = !showPassword\"\n >\n <span> </span>\n <mat-icon>{{ showPassword ? 'visibility_off' : 'visibility' }}</mat-icon>\n </span>\n\n <input\n matInput\n [type]=\"showPassword ? 'text' : 'password'\"\n [name]=\"input.name\"\n [formControl]=\"formControl\"\n class=\"ngx-form-m3-en\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n />\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: AutoFocusDirective, selector: "[AutoFocusDirective]", inputs: ["AutoFocusDirective"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }] });
|
|
496
570
|
}
|
|
497
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
571
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputPasswordComponent, decorators: [{
|
|
498
572
|
type: Component,
|
|
499
573
|
args: [{ host: { selector: 'input-password' }, imports: [ReactiveFormsModule, MatFormField, MatIcon, MatInputModule, AutoFocusDirective, InputErrorPipe, MultiLinePipe], template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u06A9\u0644\u0645\u0647 \u0639\u0628\u0648\u0631' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SHOW PASSWORD -->\n <span\n matTextSuffix\n class=\"ngx-form-m3-input-suffix click\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n (click)=\"showPassword = !showPassword\"\n >\n <span> </span>\n <mat-icon>{{ showPassword ? 'visibility_off' : 'visibility' }}</mat-icon>\n </span>\n\n <input\n matInput\n [type]=\"showPassword ? 'text' : 'password'\"\n [name]=\"input.name\"\n [formControl]=\"formControl\"\n class=\"ngx-form-m3-en\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n />\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n" }]
|
|
500
574
|
}] });
|
|
@@ -524,10 +598,10 @@ class InputSelectComponent {
|
|
|
524
598
|
getTitle() {
|
|
525
599
|
return this.input.options.find((option) => option.id === this.formControl.value)?.title || '';
|
|
526
600
|
}
|
|
527
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
528
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
601
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
602
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputSelectComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-select" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <mat-select\n [formControl]=\"formControl\"\n [ngClass]=\"input.english ? 'ngx-form-m3-en' : ''\"\n [style.direction]=\"'rtl'\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n >\n <!-- OPTIONAL -->\n @if (!!input.optional) { <mat-option></mat-option> }\n\n <!-- TRIGGER -->\n <mat-select-trigger>\n <div [ngClass]=\"input.english ? 'ngx-form-m3-en' : ''\">{{ getTitle() }}</div>\n </mat-select-trigger>\n\n <!-- OPTIONS -->\n @for (option of input.options; track $index) {\n <mat-option [value]=\"option.id\">\n <div [ngClass]=\"input.english ? 'ngx-form-m3-en' : ''\">{{ option.title }}</div>\n </mat-option>\n }\n </mat-select>\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i3$1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: AutoFocusDirective, selector: "[AutoFocusDirective]", inputs: ["AutoFocusDirective"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }] });
|
|
529
603
|
}
|
|
530
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
604
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputSelectComponent, decorators: [{
|
|
531
605
|
type: Component,
|
|
532
606
|
args: [{ host: { selector: 'input-select' }, imports: [
|
|
533
607
|
NgClass,
|
|
@@ -558,10 +632,10 @@ class InputTextComponent {
|
|
|
558
632
|
formControl = inject(INPUT_CONTROL);
|
|
559
633
|
input = inject(INPUT_TYPE);
|
|
560
634
|
config = inject(INPUT_CONFIG);
|
|
561
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
562
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
635
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
636
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputTextComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-text" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <input\n matInput\n type=\"text\"\n [name]=\"input.name\"\n [formControl]=\"formControl\"\n [ngClass]=\"input.english ? 'ngx-form-m3-en' : ''\"\n [maxLength]=\"input.maxLength || 524288\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n [readonly]=\"input.readonly\"\n />\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: AutoCompleteDirective, selector: "input[type=\"text\"]" }, { kind: "directive", type: AutoFocusDirective, selector: "[AutoFocusDirective]", inputs: ["AutoFocusDirective"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }] });
|
|
563
637
|
}
|
|
564
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
638
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputTextComponent, decorators: [{
|
|
565
639
|
type: Component,
|
|
566
640
|
args: [{ host: { selector: 'input-text' }, imports: [
|
|
567
641
|
NgClass,
|
|
@@ -599,10 +673,10 @@ class InputTextareaComponent {
|
|
|
599
673
|
input = inject(INPUT_TYPE);
|
|
600
674
|
config = inject(INPUT_CONFIG);
|
|
601
675
|
focused = false;
|
|
602
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
603
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
676
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
677
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputTextareaComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-textarea" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- COUNTER -->\n @if (focused && input.counter) {\n <mat-hint [align]=\"'end'\">\n {{ formControl.value?.length || 0 | number }}{{ input.maxLength ? ' \u0627\u0632 ' + (input.maxLength | number) : '' }}\n </mat-hint>\n }\n\n <textarea\n matInput\n [name]=\"input.name\"\n [formControl]=\"formControl\"\n [ngClass]=\"input.english ? 'ngx-form-m3-en' : ''\"\n [style.height]=\"input.height ? input.height.toString() + 'px' : '75px'\"\n [style.resize]=\"'none'\"\n [maxLength]=\"input.maxLength || 524288\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n [AutoHeightDirective]=\"!!input.autoHeight\"\n [minHeight]=\"input.height || 75\"\n [maxHeight]=\"input.maxHeight || 0\"\n (focus)=\"focused = true\"\n (blur)=\"focused = false\"\n ></textarea>\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: AutoFocusDirective, selector: "[AutoFocusDirective]", inputs: ["AutoFocusDirective"] }, { kind: "directive", type: AutoHeightDirective, selector: "[AutoHeightDirective]", inputs: ["AutoHeightDirective", "minHeight", "maxHeight"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }] });
|
|
604
678
|
}
|
|
605
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
679
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputTextareaComponent, decorators: [{
|
|
606
680
|
type: Component,
|
|
607
681
|
args: [{ host: { selector: 'input-textarea' }, imports: [
|
|
608
682
|
DecimalPipe,
|
|
@@ -633,10 +707,10 @@ class InputUrlComponent {
|
|
|
633
707
|
formControl = inject(INPUT_CONTROL);
|
|
634
708
|
input = inject(INPUT_TYPE);
|
|
635
709
|
config = inject(INPUT_CONFIG);
|
|
636
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
637
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
710
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputUrlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
711
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: InputUrlComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "input-url" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u0622\u062F\u0631\u0633 \u0633\u0627\u06CC\u062A' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- ICON -->\n @if (input.showIcon) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon>link</mat-icon>\n </span>\n }\n\n <input\n matInput\n type=\"text\"\n inputmode=\"url\"\n [name]=\"input.name\"\n [formControl]=\"formControl\"\n class=\"ngx-form-m3-en\"\n [dir]=\"'ltr'\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n />\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i4.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "directive", type: AutoCompleteDirective, selector: "input[type=\"text\"]" }, { kind: "directive", type: AutoFocusDirective, selector: "[AutoFocusDirective]", inputs: ["AutoFocusDirective"] }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }] });
|
|
638
712
|
}
|
|
639
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
713
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputUrlComponent, decorators: [{
|
|
640
714
|
type: Component,
|
|
641
715
|
args: [{ host: { selector: 'input-url' }, imports: [
|
|
642
716
|
ReactiveFormsModule,
|
|
@@ -677,10 +751,10 @@ class InputComponent {
|
|
|
677
751
|
],
|
|
678
752
|
});
|
|
679
753
|
}
|
|
680
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
681
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.
|
|
754
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
755
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: InputComponent, isStandalone: true, selector: "form-input", inputs: { formGroup: "formGroup", input: "input", config: "config" }, ngImport: i0, template: "<ng-container *ngComponentOutlet=\"inputInfo[input.type].component; injector: injector\"></ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }] });
|
|
682
756
|
}
|
|
683
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
757
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: InputComponent, decorators: [{
|
|
684
758
|
type: Component,
|
|
685
759
|
args: [{ selector: 'form-input', imports: [NgComponentOutlet], template: "<ng-container *ngComponentOutlet=\"inputInfo[input.type].component; injector: injector\"></ng-container>\n" }]
|
|
686
760
|
}], propDecorators: { formGroup: [{
|
|
@@ -700,6 +774,7 @@ const InputInfo = {
|
|
|
700
774
|
EMAIL: { title: 'ایمیل', methods: new InputEmailMethods(), component: InputEmailComponent },
|
|
701
775
|
FILE: { title: 'فایل', methods: new InputFileMethods(), component: InputFileComponent },
|
|
702
776
|
MOBILE: { title: 'موبایل', methods: new InputMobileMethods(), component: InputMobileComponent },
|
|
777
|
+
MOMENT: { title: 'زمان', methods: new InputMomentMethods(), component: InputMomentComponent },
|
|
703
778
|
NAME: { title: 'نام و نام خانوادگی', methods: new InputNameMethods(), component: InputNameComponent },
|
|
704
779
|
PASSWORD: { title: 'کلمه عبور', methods: new InputPasswordMethods(), component: InputPasswordComponent },
|
|
705
780
|
SELECT: { title: 'لیست کشویی', methods: new InputSelectMethods(), component: InputSelectComponent },
|
|
@@ -975,10 +1050,10 @@ class NgxFormComponent {
|
|
|
975
1050
|
else
|
|
976
1051
|
this.router.navigate(action);
|
|
977
1052
|
}
|
|
978
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
979
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
1053
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: NgxFormComponent, deps: [{ token: i1$3.Router }, { token: NGX_FORM_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
1054
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: NgxFormComponent, isStandalone: true, selector: "ngx-form", inputs: { ngxForm: "ngxForm" }, outputs: { onInit: "onInit", onSubmit: "onSubmit", onChange: "onChange" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "ngForm", first: true, predicate: ["formObject"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"checkSubmit()\" dir=\"rtl\" class=\"ngx-form\" #formObject=\"ngForm\">\n <section class=\"sections\">\n @for (section of sections; track $index) {\n <!-- CHECK SECTION VIEW -->\n @if (showSection(section)) {\n <!-- SECTION HEADER -->\n @if (section.header) {\n <div class=\"ngx-form-m3-header section-header\">{{ section.header }}</div>\n }\n\n <div class=\"section\" [class.section-mobile]=\"isMobile\">\n <!-- SECTIONS -->\n @for (column of section.columns; track $index) {\n <!-- CHECK COLUMN VIEW -->\n @if (showColumn(column)) {\n <div class=\"column\" [style.flex]=\"section.flex[$index]\">\n <!-- COLUMN HEADER -->\n @if (column.header) {\n <div class=\"ngx-form-m3-header column-header\">{{ column.header }}</div>\n }\n\n <!-- ROWS -->\n @for (row of column.rows; track $index) {\n <!-- CHECK Row VIEW -->\n @if (showRow(row)) {\n <!-- ROW HEADER -->\n @if (row.header) {\n <div class=\"ngx-form-m3-header row-header\">{{ row.header }}</div>\n }\n\n <div class=\"inputs\">\n <!-- INPUTS -->\n @for (input of row.inputs; track $index) {\n <!-- CHECK Row VIEW -->\n @if (showInput(input)) {\n <div class=\"input\" [style.flex]=\"row.flex[$index]\">\n <form-input [formGroup]=\"formGroup\" [input]=\"input\" [config]=\"inputConfig\"></form-input>\n </div>\n } }\n </div>\n } }\n </div>\n } }\n </div>\n } }\n </section>\n\n <section class=\"ngx-form-m3-form-buttons\" [class.mobile-view]=\"isMobile\">\n <!-- EXTRA BUTTONS -->\n @for (item of (ngxForm.buttons || []); track $index) {\n <button type=\"button\" mat-stroked-button (click)=\"onClick(item.action)\">{{ item.title }}</button>\n }\n <!-- SUBMIT BUTTON -->\n <button type=\"submit\" mat-flat-button>{{ ngxForm.submit }}</button>\n </section>\n</form>\n", styles: [".sections{display:flex;flex-direction:column}.sections .column-header,.sections .section-header{margin-bottom:1rem}.sections .row-header{margin:1rem 0}.sections .section,.sections .section .column .inputs{display:flex;align-items:flex-start;column-gap:1rem}.sections .section-mobile{display:block}:host ::ng-deep mat-form-field{width:100%;margin-bottom:.5rem}:host ::ng-deep .mat-mdc-form-field-infix{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: InputComponent, selector: "form-input", inputs: ["formGroup", "input", "config"] }, { kind: "directive", type: FormErrorDirective, selector: "form.ngx-form" }] });
|
|
980
1055
|
}
|
|
981
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
1056
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: NgxFormComponent, decorators: [{
|
|
982
1057
|
type: Component,
|
|
983
1058
|
args: [{ selector: 'ngx-form', imports: [ReactiveFormsModule, MatButton, InputComponent, FormErrorDirective], template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"checkSubmit()\" dir=\"rtl\" class=\"ngx-form\" #formObject=\"ngForm\">\n <section class=\"sections\">\n @for (section of sections; track $index) {\n <!-- CHECK SECTION VIEW -->\n @if (showSection(section)) {\n <!-- SECTION HEADER -->\n @if (section.header) {\n <div class=\"ngx-form-m3-header section-header\">{{ section.header }}</div>\n }\n\n <div class=\"section\" [class.section-mobile]=\"isMobile\">\n <!-- SECTIONS -->\n @for (column of section.columns; track $index) {\n <!-- CHECK COLUMN VIEW -->\n @if (showColumn(column)) {\n <div class=\"column\" [style.flex]=\"section.flex[$index]\">\n <!-- COLUMN HEADER -->\n @if (column.header) {\n <div class=\"ngx-form-m3-header column-header\">{{ column.header }}</div>\n }\n\n <!-- ROWS -->\n @for (row of column.rows; track $index) {\n <!-- CHECK Row VIEW -->\n @if (showRow(row)) {\n <!-- ROW HEADER -->\n @if (row.header) {\n <div class=\"ngx-form-m3-header row-header\">{{ row.header }}</div>\n }\n\n <div class=\"inputs\">\n <!-- INPUTS -->\n @for (input of row.inputs; track $index) {\n <!-- CHECK Row VIEW -->\n @if (showInput(input)) {\n <div class=\"input\" [style.flex]=\"row.flex[$index]\">\n <form-input [formGroup]=\"formGroup\" [input]=\"input\" [config]=\"inputConfig\"></form-input>\n </div>\n } }\n </div>\n } }\n </div>\n } }\n </div>\n } }\n </section>\n\n <section class=\"ngx-form-m3-form-buttons\" [class.mobile-view]=\"isMobile\">\n <!-- EXTRA BUTTONS -->\n @for (item of (ngxForm.buttons || []); track $index) {\n <button type=\"button\" mat-stroked-button (click)=\"onClick(item.action)\">{{ item.title }}</button>\n }\n <!-- SUBMIT BUTTON -->\n <button type=\"submit\" mat-flat-button>{{ ngxForm.submit }}</button>\n </section>\n</form>\n", styles: [".sections{display:flex;flex-direction:column}.sections .column-header,.sections .section-header{margin-bottom:1rem}.sections .row-header{margin:1rem 0}.sections .section,.sections .section .column .inputs{display:flex;align-items:flex-start;column-gap:1rem}.sections .section-mobile{display:block}:host ::ng-deep mat-form-field{width:100%;margin-bottom:.5rem}:host ::ng-deep .mat-mdc-form-field-infix{width:100%!important}\n"] }]
|
|
984
1059
|
}], ctorParameters: () => [{ type: i1$3.Router }, { type: undefined, decorators: [{
|