@webilix/ngx-form-m3 0.0.67 → 0.0.69
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.
|
@@ -233,6 +233,8 @@ class InputErrorPipe {
|
|
|
233
233
|
return value;
|
|
234
234
|
case 'username':
|
|
235
235
|
return value;
|
|
236
|
+
case 'nationalCode':
|
|
237
|
+
return 'کدملی صحیح مشخص نشده است.';
|
|
236
238
|
case 'pattern':
|
|
237
239
|
switch (type) {
|
|
238
240
|
case 'EMAIL':
|
|
@@ -249,6 +251,8 @@ class InputErrorPipe {
|
|
|
249
251
|
return 'کاراکترهای الزامی در کلمه عبور استفاده نشدهاند.';
|
|
250
252
|
case 'URL':
|
|
251
253
|
return 'فرمت استاندارد آدرس سایت رعایت نشده است.';
|
|
254
|
+
default:
|
|
255
|
+
return 'فرمت مقدار وارد شده صحیح نیست.';
|
|
252
256
|
}
|
|
253
257
|
break;
|
|
254
258
|
}
|
|
@@ -594,6 +598,18 @@ const MobileValidator = () => {
|
|
|
594
598
|
};
|
|
595
599
|
};
|
|
596
600
|
|
|
601
|
+
const NationalCodeValidator = () => {
|
|
602
|
+
return (formControl) => {
|
|
603
|
+
const value = formControl.value;
|
|
604
|
+
if (Helper.IS.empty(value) || !Helper.IS.string(value))
|
|
605
|
+
return null;
|
|
606
|
+
// ERRORS
|
|
607
|
+
if (!Helper.IS.STRING.nationalCode(value))
|
|
608
|
+
return { nationalCode: true };
|
|
609
|
+
return null;
|
|
610
|
+
};
|
|
611
|
+
};
|
|
612
|
+
|
|
597
613
|
const UsernameValidator = (verify) => {
|
|
598
614
|
return (formControl) => {
|
|
599
615
|
const value = formControl.value;
|
|
@@ -1566,6 +1582,55 @@ class InputNameMethods extends InputMethods {
|
|
|
1566
1582
|
}
|
|
1567
1583
|
}
|
|
1568
1584
|
|
|
1585
|
+
class InputNationalCodeComponent {
|
|
1586
|
+
formControl = inject(INPUT_CONTROL);
|
|
1587
|
+
input = inject(INPUT_TYPE);
|
|
1588
|
+
config = inject(INPUT_CONFIG);
|
|
1589
|
+
values;
|
|
1590
|
+
isButtonDisabled;
|
|
1591
|
+
maskitoOptions = {
|
|
1592
|
+
mask: Array.from({ length: 10 }).fill(/\d/),
|
|
1593
|
+
preprocessors: [
|
|
1594
|
+
// CHANGE PERSIAN NUMBERS
|
|
1595
|
+
({ elementState, data }) => ({ elementState, data: Helper.STRING.changeNumbers(data.toString(), 'EN') }),
|
|
1596
|
+
],
|
|
1597
|
+
};
|
|
1598
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: InputNationalCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1599
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: InputNationalCodeComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-national-code" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u06A9\u062F\u0645\u0644\u06CC' }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint) {\n <mat-hint>{{ input.hint }}</mat-hint>\n }\n\n <!-- ICON & SUFFIX -->\n @if (input.showIcon) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <mat-icon>badge</mat-icon>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\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 [maskito]=\"maskitoOptions\"\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]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[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: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.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: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"], outputs: ["maskitoChange", "maskitoElementChange"] }, { 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" }] });
|
|
1600
|
+
}
|
|
1601
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: InputNationalCodeComponent, decorators: [{
|
|
1602
|
+
type: Component,
|
|
1603
|
+
args: [{ host: { selector: 'input-national-code' }, imports: [
|
|
1604
|
+
ReactiveFormsModule,
|
|
1605
|
+
MatFormField,
|
|
1606
|
+
MatIcon,
|
|
1607
|
+
MatIconButton,
|
|
1608
|
+
MatInputModule,
|
|
1609
|
+
MaskitoDirective,
|
|
1610
|
+
AutoCompleteDirective,
|
|
1611
|
+
AutoFocusDirective,
|
|
1612
|
+
InputErrorPipe,
|
|
1613
|
+
MultiLinePipe,
|
|
1614
|
+
], template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u06A9\u062F\u0645\u0644\u06CC' }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint) {\n <mat-hint>{{ input.hint }}</mat-hint>\n }\n\n <!-- ICON & SUFFIX -->\n @if (input.showIcon) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <mat-icon>badge</mat-icon>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\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 [maskito]=\"maskitoOptions\"\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" }]
|
|
1615
|
+
}], propDecorators: { values: [{
|
|
1616
|
+
type: Input,
|
|
1617
|
+
args: [{ required: true }]
|
|
1618
|
+
}], isButtonDisabled: [{
|
|
1619
|
+
type: Input,
|
|
1620
|
+
args: [{ required: true }]
|
|
1621
|
+
}] } });
|
|
1622
|
+
|
|
1623
|
+
class InputNationalCodeMethods extends InputMethods {
|
|
1624
|
+
control(input, validators) {
|
|
1625
|
+
validators.push(NationalCodeValidator());
|
|
1626
|
+
const value = input.value && Helper.IS.STRING.nationalCode(input.value) ? input.value.toLowerCase() : null;
|
|
1627
|
+
return new FormControl(value, validators);
|
|
1628
|
+
}
|
|
1629
|
+
value(value, input) {
|
|
1630
|
+
return typeof value === 'string' && Helper.IS.STRING.nationalCode(value) ? value.toLowerCase() : null;
|
|
1631
|
+
}
|
|
1632
|
+
}
|
|
1633
|
+
|
|
1569
1634
|
class InputNumberComponent {
|
|
1570
1635
|
formControl = inject(INPUT_CONTROL);
|
|
1571
1636
|
input = inject(INPUT_TYPE);
|
|
@@ -1611,7 +1676,7 @@ class InputNumberComponent {
|
|
|
1611
1676
|
this.hintText = (isNegative ? 'منفی ' : '') + Helper.NUMBER.getTitle(Math.abs(value));
|
|
1612
1677
|
}
|
|
1613
1678
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: InputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1614
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: InputNumberComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-number" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint || (isFocused && hintText)) {\n <mat-hint>{{ isFocused && hintText ? hintText : input.hint }}</mat-hint>\n }\n\n <!-- CURRENCY -->\n @if (input.suffix) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix text\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>{{ input.suffix }}</span>\n </span>\n }\n\n <!-- ICON -->\n @if (input.showIcon && !input.suffix) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon>tag</mat-icon>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n matInput\n type=\"text\"\n inputmode=\"numeric\"\n class=\"ngx-form-m3-en\"\n [ngModel]=\"formControl.value?.toString() || ''\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n
|
|
1679
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: InputNumberComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-number" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint || (isFocused && hintText)) {\n <mat-hint>{{ isFocused && hintText ? hintText : input.hint }}</mat-hint>\n }\n\n <!-- CURRENCY -->\n @if (input.suffix) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix text\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>{{ input.suffix }}</span>\n </span>\n }\n\n <!-- ICON -->\n @if (input.showIcon && !input.suffix) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon>tag</mat-icon>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n matInput\n type=\"text\"\n inputmode=\"numeric\"\n class=\"ngx-form-m3-en\"\n [ngModel]=\"formControl.value?.toString() || ''\"\n [maskito]=\"maskitoOptions\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n (input)=\"setValue(numberInput.value); updateHint()\"\n [disabled]=\"formControl.disabled\"\n (focus)=\"isFocused = true; updateHint()\"\n (blur)=\"isFocused = false\"\n #numberInput\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: [".ngx-form-m3-input-suffix.text{padding-right:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { 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: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.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: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"], outputs: ["maskitoChange", "maskitoElementChange"] }, { 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" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
1615
1680
|
}
|
|
1616
1681
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: InputNumberComponent, decorators: [{
|
|
1617
1682
|
type: Component,
|
|
@@ -1627,7 +1692,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
|
|
|
1627
1692
|
AutoFocusDirective,
|
|
1628
1693
|
InputErrorPipe,
|
|
1629
1694
|
MultiLinePipe,
|
|
1630
|
-
], changeDetection: ChangeDetectionStrategy.Eager, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint || (isFocused && hintText)) {\n <mat-hint>{{ isFocused && hintText ? hintText : input.hint }}</mat-hint>\n }\n\n <!-- CURRENCY -->\n @if (input.suffix) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix text\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>{{ input.suffix }}</span>\n </span>\n }\n\n <!-- ICON -->\n @if (input.showIcon && !input.suffix) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon>tag</mat-icon>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n matInput\n type=\"text\"\n inputmode=\"numeric\"\n class=\"ngx-form-m3-en\"\n [ngModel]=\"formControl.value?.toString() || ''\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n
|
|
1695
|
+
], changeDetection: ChangeDetectionStrategy.Eager, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint || (isFocused && hintText)) {\n <mat-hint>{{ isFocused && hintText ? hintText : input.hint }}</mat-hint>\n }\n\n <!-- CURRENCY -->\n @if (input.suffix) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix text\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>{{ input.suffix }}</span>\n </span>\n }\n\n <!-- ICON -->\n @if (input.showIcon && !input.suffix) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span> </span>\n <mat-icon>tag</mat-icon>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n matInput\n type=\"text\"\n inputmode=\"numeric\"\n class=\"ngx-form-m3-en\"\n [ngModel]=\"formControl.value?.toString() || ''\"\n [maskito]=\"maskitoOptions\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n (input)=\"setValue(numberInput.value); updateHint()\"\n [disabled]=\"formControl.disabled\"\n (focus)=\"isFocused = true; updateHint()\"\n (blur)=\"isFocused = false\"\n #numberInput\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: [".ngx-form-m3-input-suffix.text{padding-right:.5rem}\n"] }]
|
|
1631
1696
|
}], propDecorators: { values: [{
|
|
1632
1697
|
type: Input,
|
|
1633
1698
|
args: [{ required: true }]
|
|
@@ -1830,7 +1895,7 @@ class InputPriceComponent {
|
|
|
1830
1895
|
: Helper.NUMBER.getTitle(Math.abs(value)) + (this.input.currency ? ` ${this.input.currency}` : '');
|
|
1831
1896
|
}
|
|
1832
1897
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: InputPriceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1833
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: InputPriceComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-price" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u0642\u06CC\u0645\u062A' }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint || (isFocused && hintText)) {\n <mat-hint>{{ isFocused && hintText ? hintText : input.hint }}</mat-hint>\n }\n\n <!-- CURRENCY -->\n @if (input.currency) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>{{ input.currency }}</span>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n matInput\n type=\"text\"\n inputmode=\"numeric\"\n class=\"ngx-form-m3-en\"\n [ngModel]=\"formControl.value?.toString() || ''\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n
|
|
1898
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: InputPriceComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-price" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u0642\u06CC\u0645\u062A' }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint || (isFocused && hintText)) {\n <mat-hint>{{ isFocused && hintText ? hintText : input.hint }}</mat-hint>\n }\n\n <!-- CURRENCY -->\n @if (input.currency) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>{{ input.currency }}</span>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n matInput\n type=\"text\"\n inputmode=\"numeric\"\n class=\"ngx-form-m3-en\"\n [ngModel]=\"formControl.value?.toString() || ''\"\n [maskito]=\"maskitoOptions\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n (input)=\"setValue(numberInput.value); updateHint()\"\n [disabled]=\"formControl.disabled\"\n (focus)=\"isFocused = true; updateHint()\"\n (blur)=\"isFocused = false\"\n #numberInput\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: [".ngx-form-m3-input-suffix{padding-right:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { 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: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.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: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"], outputs: ["maskitoChange", "maskitoElementChange"] }, { 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" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
1834
1899
|
}
|
|
1835
1900
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: InputPriceComponent, decorators: [{
|
|
1836
1901
|
type: Component,
|
|
@@ -1846,7 +1911,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
|
|
|
1846
1911
|
AutoFocusDirective,
|
|
1847
1912
|
InputErrorPipe,
|
|
1848
1913
|
MultiLinePipe,
|
|
1849
|
-
], changeDetection: ChangeDetectionStrategy.Eager, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u0642\u06CC\u0645\u062A' }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint || (isFocused && hintText)) {\n <mat-hint>{{ isFocused && hintText ? hintText : input.hint }}</mat-hint>\n }\n\n <!-- CURRENCY -->\n @if (input.currency) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>{{ input.currency }}</span>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n matInput\n type=\"text\"\n inputmode=\"numeric\"\n class=\"ngx-form-m3-en\"\n [ngModel]=\"formControl.value?.toString() || ''\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n
|
|
1914
|
+
], changeDetection: ChangeDetectionStrategy.Eager, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title || '\u0642\u06CC\u0645\u062A' }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint || (isFocused && hintText)) {\n <mat-hint>{{ isFocused && hintText ? hintText : input.hint }}</mat-hint>\n }\n\n <!-- CURRENCY -->\n @if (input.currency) {\n <span matTextSuffix class=\"ngx-form-m3-input-suffix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>{{ input.currency }}</span>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <input\n matInput\n type=\"text\"\n inputmode=\"numeric\"\n class=\"ngx-form-m3-en\"\n [ngModel]=\"formControl.value?.toString() || ''\"\n [maskito]=\"maskitoOptions\"\n [AutoFocusDirective]=\"config.autoFocus === input.name\"\n (input)=\"setValue(numberInput.value); updateHint()\"\n [disabled]=\"formControl.disabled\"\n (focus)=\"isFocused = true; updateHint()\"\n (blur)=\"isFocused = false\"\n #numberInput\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: [".ngx-form-m3-input-suffix{padding-right:.5rem}\n"] }]
|
|
1850
1915
|
}], propDecorators: { values: [{
|
|
1851
1916
|
type: Input,
|
|
1852
1917
|
args: [{ required: true }]
|
|
@@ -2084,8 +2149,22 @@ class InputTextComponent {
|
|
|
2084
2149
|
config = inject(INPUT_CONFIG);
|
|
2085
2150
|
values;
|
|
2086
2151
|
isButtonDisabled;
|
|
2152
|
+
maskitoOptions = this.input.mask
|
|
2153
|
+
? {
|
|
2154
|
+
mask: this.input.mask,
|
|
2155
|
+
preprocessors: this.input.maskChangeNumbers
|
|
2156
|
+
? [
|
|
2157
|
+
// CHANGE PERSIAN NUMBERS
|
|
2158
|
+
({ elementState, data }) => ({
|
|
2159
|
+
elementState,
|
|
2160
|
+
data: Helper.STRING.changeNumbers(data.toString(), 'EN'),
|
|
2161
|
+
}),
|
|
2162
|
+
]
|
|
2163
|
+
: [],
|
|
2164
|
+
}
|
|
2165
|
+
: null;
|
|
2087
2166
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: InputTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2088
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: InputTextComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, 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) {
|
|
2167
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: InputTextComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-text" } }, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"!!input.prefix ? 'always' : 'auto'\">\n <mat-label>{{ input.title }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint) {\n <mat-hint>{{ input.hint }}</mat-hint>\n }\n\n <!-- SUFFIX -->\n @if (!!input.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]=\"input.suffixEnglish\">{{ input.suffix }}</span>\n </span>\n }\n\n <!-- PREFIX -->\n @if (!!input.prefix) {\n <span matTextPrefix=\"\" class=\"ngx-form-m3-input-prefix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span [class.ngx-form-m3-en]=\"input.prefixEnglish\">{{ input.prefix }}</span>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\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 [maskito]=\"maskitoOptions\"\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: [".ngx-form-m3-input-suffix{padding-right:.5rem}.ngx-form-m3-input-prefix{padding-left:.5rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[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: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.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: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"], outputs: ["maskitoChange", "maskitoElementChange"] }, { 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" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
2089
2168
|
}
|
|
2090
2169
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: InputTextComponent, decorators: [{
|
|
2091
2170
|
type: Component,
|
|
@@ -2096,11 +2175,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
|
|
|
2096
2175
|
MatIcon,
|
|
2097
2176
|
MatIconButton,
|
|
2098
2177
|
MatInputModule,
|
|
2178
|
+
MaskitoDirective,
|
|
2099
2179
|
AutoCompleteDirective,
|
|
2100
2180
|
AutoFocusDirective,
|
|
2101
2181
|
InputErrorPipe,
|
|
2102
2182
|
MultiLinePipe,
|
|
2103
|
-
], changeDetection: ChangeDetectionStrategy.Eager, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n <mat-label>{{ input.title }}</mat-label>\n @if (formControl.invalid) {
|
|
2183
|
+
], changeDetection: ChangeDetectionStrategy.Eager, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"!!input.prefix ? 'always' : 'auto'\">\n <mat-label>{{ input.title }}</mat-label>\n @if (formControl.invalid) {\n <mat-error>{{ formControl.errors | InputErrorPipe: input.type }}</mat-error>\n }\n\n <!-- HINT -->\n @if (input.hint) {\n <mat-hint>{{ input.hint }}</mat-hint>\n }\n\n <!-- SUFFIX -->\n @if (!!input.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]=\"input.suffixEnglish\">{{ input.suffix }}</span>\n </span>\n }\n\n <!-- PREFIX -->\n @if (!!input.prefix) {\n <span matTextPrefix=\"\" class=\"ngx-form-m3-input-prefix\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span [class.ngx-form-m3-en]=\"input.prefixEnglish\">{{ input.prefix }}</span>\n </span>\n }\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\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 [maskito]=\"maskitoOptions\"\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: [".ngx-form-m3-input-suffix{padding-right:.5rem}.ngx-form-m3-input-prefix{padding-left:.5rem}\n"] }]
|
|
2104
2184
|
}], propDecorators: { values: [{
|
|
2105
2185
|
type: Input,
|
|
2106
2186
|
args: [{ required: true }]
|
|
@@ -2121,6 +2201,8 @@ class InputTextMethods extends InputMethods {
|
|
|
2121
2201
|
if (maxLength && maxLength > 0)
|
|
2122
2202
|
validators.push(Validators.maxLength(maxLength));
|
|
2123
2203
|
}
|
|
2204
|
+
if (input.pattern)
|
|
2205
|
+
validators.push(Validators.pattern(input.pattern));
|
|
2124
2206
|
return new FormControl(input.value || null, validators);
|
|
2125
2207
|
}
|
|
2126
2208
|
value(value, input) {
|
|
@@ -2418,6 +2500,7 @@ const InputInfo = {
|
|
|
2418
2500
|
MOMENT: { title: 'زمان', methods: new InputMomentMethods(), component: InputMomentComponent },
|
|
2419
2501
|
'MULTI-SELECT': { title: 'چند انتخابی', methods: new InputMultiSelectMethods(), component: InputMultiSelectComponent },
|
|
2420
2502
|
NAME: { title: 'نام و نام خانوادگی', methods: new InputNameMethods(), component: InputNameComponent },
|
|
2503
|
+
'NATIONAL-CODE': { title: 'کدملی', methods: new InputNationalCodeMethods(), component: InputNationalCodeComponent },
|
|
2421
2504
|
NUMBER: { title: 'مقدار عددی', methods: new InputNumberMethods(), component: InputNumberComponent },
|
|
2422
2505
|
'OPTION-LIST': { title: 'لیست گزینهها', methods: new InputOptionListMethods(), component: InputOptionListComponent },
|
|
2423
2506
|
PASSWORD: { title: 'کلمه عبور', methods: new InputPasswordMethods(), component: InputPasswordComponent },
|