@webilix/ngx-form-m3 0.0.23 → 0.0.25

package/fesm2022/webilix-ngx-form-m3.mjs

@@ -11,13 +11,13 @@ import * as i2$1 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
 import { Helper } from '@webilix/helper-library';
 import * as i1$1 from '@angular/platform-browser';
+import { NgxMaskDirective, provideNgxMask } from 'ngx-mask';
+import { JalaliDateTime } from '@webilix/jalali-date-time';
 import { NgComponentOutlet, NgClass, DecimalPipe } from '@angular/common';
 import * as i1$2 from '@webilix/ngx-helper-m3';
 import { NgxHelperDatePipe, NgxHelperFileSizePipe } from '@webilix/ngx-helper-m3';
 import * as i1$3 from '@webilix/ngx-calendar-m3';
-import { JalaliDateTime } from '@webilix/jalali-date-time';
 import * as i3 from '@angular/cdk/bidi';
-import { NgxMaskDirective, provideNgxMask } from 'ngx-mask';
 import * as i3$1 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
 import * as i3$2 from '@angular/material/select';
@@ -196,6 +196,10 @@ class InputErrorPipe {
                 return `انتخاب حداقل ${Helper.NUMBER.format(value)} گزینه الزامی است.`;
             case 'maxcount':
                 return `امکان انتخاب بیشتر از ${Helper.NUMBER.format(value)} گزینه وجود ندارد.`;
+            case 'bank-card':
+                return `شماره کارت بانکی صحیح مشخص نشده است.`;
+            case 'bank-sheba':
+                return `شماره شبا صحیح مشخص نشده است.`;
             case 'pattern':
                 switch (type) {
                     case 'EMAIL':
@@ -216,6 +220,10 @@ class InputErrorPipe {
                 break;
             case 'mask':
                 switch (type) {
+                    case 'BANK-CARD':
+                        return 'شماره کارت بانکی دارای ۱۶ رقم است.';
+                    case 'BANK-SHEBA':
+                        return 'شماره شبا دارای ۲۴ رقم است.';
                     case 'MOBILE':
                         return 'شماره موبایل دارای ۱۱ رقم است.';
                 }
@@ -310,6 +318,220 @@ class InputAutoCompleteMethods extends InputMethods {
     }
 }
 
+class InputBankCardComponent {
+    formControl = inject(INPUT_CONTROL);
+    input = inject(INPUT_TYPE);
+    config = inject(INPUT_CONFIG);
+    values;
+    isButtonDisabled;
+    bank = '';
+    inputTransformFn = (value) => Helper.STRING.changeNumbers(value.toString(), 'EN');
+    ngOnInit() {
+        this.setBank(this.input.value || '');
+    }
+    setBank(card) {
+        card = card.replace(/-/g, '').substring(0, 6);
+        const bank = Helper.BANK.findCard(card);
+        this.bank = bank?.title || '';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: InputBankCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.4", type: InputBankCardComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-bank-card" } }, providers: [provideNgxMask()], ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n    <mat-label>{{ input.title || '\u0634\u0645\u0627\u0631\u0647 \u06A9\u0627\u0631\u062A \u0628\u0627\u0646\u06A9\u06CC' }}</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    <!-- 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    <div class=\"ngx-helper-form-m3-bank-card-input\">\n        <!-- BANK NAME -->\n        @if (!input.hideBank && bank !== '') {\n        <div class=\"bank\">{{ bank }}</div>\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            [AutoFocusDirective]=\"config.autoFocus === input.name\"\n            [mask]=\"'0000-0000-0000-0000'\"\n            [inputTransformFn]=\"inputTransformFn\"\n            (input)=\"setBank(bankCardInput.value)\"\n            #bankCardInput\n        />\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: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { 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: 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" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: InputBankCardComponent, decorators: [{
+            type: Component,
+            args: [{ host: { selector: 'input-bank-card' }, imports: [
+                        ReactiveFormsModule,
+                        MatFormField,
+                        MatIcon,
+                        MatIconButton,
+                        MatInputModule,
+                        NgxMaskDirective,
+                        AutoCompleteDirective,
+                        AutoFocusDirective,
+                        InputErrorPipe,
+                        MultiLinePipe,
+                    ], providers: [provideNgxMask()], template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n    <mat-label>{{ input.title || '\u0634\u0645\u0627\u0631\u0647 \u06A9\u0627\u0631\u062A \u0628\u0627\u0646\u06A9\u06CC' }}</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    <!-- 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    <div class=\"ngx-helper-form-m3-bank-card-input\">\n        <!-- BANK NAME -->\n        @if (!input.hideBank && bank !== '') {\n        <div class=\"bank\">{{ bank }}</div>\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            [AutoFocusDirective]=\"config.autoFocus === input.name\"\n            [mask]=\"'0000-0000-0000-0000'\"\n            [inputTransformFn]=\"inputTransformFn\"\n            (input)=\"setBank(bankCardInput.value)\"\n            #bankCardInput\n        />\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" }]
+        }], propDecorators: { values: [{
+                type: Input,
+                args: [{ required: true }]
+            }], isButtonDisabled: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
+const BankCardValidator = () => {
+    return (formControl) => {
+        const value = formControl.value;
+        if (Helper.IS.empty(value) || !Helper.IS.string(value) || value.length !== 16)
+            return null;
+        return !Helper.IS.STRING.bankCard(value) ? { 'bank-card': true } : null;
+    };
+};
+
+const BankShebaValidator = () => {
+    return (formControl) => {
+        const value = formControl.value;
+        if (Helper.IS.empty(value) || !Helper.IS.string(value) || value.length !== 24)
+            return null;
+        return !Helper.IS.STRING.bankSheba(`IR${value}`) ? { 'bank-sheba': true } : null;
+    };
+};
+
+const MaxCountValidator = (max) => {
+    return (formControl) => {
+        const value = Array.isArray(formControl.value) ? formControl.value : [];
+        return value.length > max ? { maxcount: max } : null;
+    };
+};
+
+const MinCountValidator = (min) => {
+    return (formControl) => {
+        const value = Array.isArray(formControl.value) ? formControl.value : [];
+        return value.length === 0 ? { required: true } : value.length < min ? { mincount: min } : null;
+    };
+};
+
+const MaxDateValidator = (max) => {
+    const jalali = JalaliDateTime();
+    return (formControl) => {
+        const value = formControl.value;
+        if (Helper.IS.empty(value) || !Helper.IS.date(value))
+            return null;
+        const maximum = jalali.periodDay(1, max === 'NOW' ? new Date() : max).to;
+        return value.getTime() > maximum.getTime() ? { maxdate: jalali.toFullText(maximum, { format: 'Y/M/D' }) } : null;
+    };
+};
+
+const MinDateValidator = (min) => {
+    const jalali = JalaliDateTime();
+    return (formControl) => {
+        const value = formControl.value;
+        if (Helper.IS.empty(value) || !Helper.IS.date(value))
+            return null;
+        const minimum = jalali.periodDay(1, min === 'NOW' ? new Date() : min).from;
+        return value.getTime() < minimum.getTime() ? { mindate: jalali.toFullText(minimum, { format: 'Y/M/D' }) } : null;
+    };
+};
+
+const MaxMomentValidator = (max) => {
+    const jalali = JalaliDateTime();
+    const formatDate = (date) => jalali.toString(date, { format: 'Y-M-D H:I' });
+    return (formControl) => {
+        const value = formControl.value;
+        if (Helper.IS.empty(value) || !Helper.IS.date(value))
+            return null;
+        const maximum = max === 'NOW' ? new Date() : max;
+        return formatDate(value) > formatDate(maximum)
+            ? { maxmoment: jalali.toFullText(maximum, { format: 'H:I Y/M/D' }) }
+            : null;
+    };
+};
+
+const MinMomentValidator = (min) => {
+    const jalali = JalaliDateTime();
+    const formatDate = (date) => jalali.toString(date, { format: 'Y-M-D H:I' });
+    return (formControl) => {
+        const value = formControl.value;
+        if (Helper.IS.empty(value) || !Helper.IS.date(value))
+            return null;
+        const minimum = min === 'NOW' ? new Date() : min;
+        return formatDate(value) < formatDate(minimum)
+            ? { minmoment: jalali.toFullText(minimum, { format: 'H:I Y/M/D' }) }
+            : null;
+    };
+};
+
+const MaxNumberValidator = (maximum) => {
+    return (formControl) => {
+        const value = Helper.IS.string(formControl.value) ? +formControl.value.replace(/,/g, '') : formControl.value;
+        if (Helper.IS.empty(value) || !Helper.IS.number(value))
+            return null;
+        return value <= maximum ? null : { maximum };
+    };
+};
+
+const MinNumberValidator = (minimum) => {
+    return (formControl) => {
+        const value = Helper.IS.string(formControl.value) ? +formControl.value.replace(/,/g, '') : formControl.value;
+        if (Helper.IS.empty(value) || !Helper.IS.number(value))
+            return null;
+        return value >= minimum ? null : { minimum };
+    };
+};
+
+const MultiplyOfNumberValidator = (multiplyOf) => {
+    return (formControl) => {
+        const value = Helper.IS.string(formControl.value) ? +formControl.value.replace(/,/g, '') : formControl.value;
+        if (Helper.IS.empty(value) || !Helper.IS.number(value))
+            return null;
+        return value % multiplyOf === 0 ? null : { multiplyOf };
+    };
+};
+
+const LengthValidator = (length) => {
+    return (formControl) => {
+        const value = formControl.value;
+        if (Helper.IS.empty(value) || !Helper.IS.string(value))
+            return null;
+        return value.length !== length ? { length } : null;
+    };
+};
+
+class InputBankCardMethods extends InputMethods {
+    control(input, validators) {
+        validators.push(BankCardValidator());
+        const value = input.value && Helper.IS.STRING.bankCard(input.value) ? input.value : null;
+        return new FormControl(value, validators);
+    }
+    value(value, input) {
+        return Helper.IS.STRING.bankCard(value) ? value : null;
+    }
+}
+
+class InputBankShebaComponent {
+    formControl = inject(INPUT_CONTROL);
+    input = inject(INPUT_TYPE);
+    config = inject(INPUT_CONFIG);
+    values;
+    isButtonDisabled;
+    bank = '';
+    inputTransformFn = (value) => Helper.STRING.changeNumbers(value.toString(), 'EN');
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: InputBankShebaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.4", type: InputBankShebaComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-bank-sheba" } }, providers: [provideNgxMask()], ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n    <mat-label>{{ input.title || '\u0634\u0645\u0627\u0631\u0647 \u0634\u0628\u0627' }}</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\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n        <span class=\"ngx-form-m3-en\">IR</span>\n    </span>\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        [AutoFocusDirective]=\"config.autoFocus === input.name\"\n        [mask]=\"'000000000000000000000000'\"\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: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { 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: 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" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: InputBankShebaComponent, decorators: [{
+            type: Component,
+            args: [{ host: { selector: 'input-bank-sheba' }, imports: [
+                        ReactiveFormsModule,
+                        MatFormField,
+                        MatIcon,
+                        MatIconButton,
+                        MatInputModule,
+                        NgxMaskDirective,
+                        AutoCompleteDirective,
+                        AutoFocusDirective,
+                        InputErrorPipe,
+                        MultiLinePipe,
+                    ], providers: [provideNgxMask()], template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n    <mat-label>{{ input.title || '\u0634\u0645\u0627\u0631\u0647 \u0634\u0628\u0627' }}</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\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n        <span class=\"ngx-form-m3-en\">IR</span>\n    </span>\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        [AutoFocusDirective]=\"config.autoFocus === input.name\"\n        [mask]=\"'000000000000000000000000'\"\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" }]
+        }], propDecorators: { values: [{
+                type: Input,
+                args: [{ required: true }]
+            }], isButtonDisabled: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
+class InputBankShebaMethods extends InputMethods {
+    control(input, validators) {
+        validators.push(BankShebaValidator());
+        const value = input.value && Helper.IS.STRING.bankSheba(input.value) ? input.value.substring(2) : null;
+        return new FormControl(value, validators);
+    }
+    value(value, input) {
+        return Helper.IS.STRING.bankSheba(`IR${value}`) ? `IR${value}` : null;
+    }
+}
+
 class InputCheckboxComponent {
     formControl = inject(INPUT_CONTROL);
     input = inject(INPUT_TYPE);
@@ -528,106 +750,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImpor
                 args: [{ required: true }]
             }] } });
 
-const MaxCountValidator = (max) => {
-    return (formControl) => {
-        const value = Array.isArray(formControl.value) ? formControl.value : [];
-        return value.length > max ? { maxcount: max } : null;
-    };
-};
-
-const MinCountValidator = (min) => {
-    return (formControl) => {
-        const value = Array.isArray(formControl.value) ? formControl.value : [];
-        return value.length === 0 ? { required: true } : value.length < min ? { mincount: min } : null;
-    };
-};
-
-const MaxDateValidator = (max) => {
-    const jalali = JalaliDateTime();
-    return (formControl) => {
-        const value = formControl.value;
-        if (Helper.IS.empty(value) || !Helper.IS.date(value))
-            return null;
-        const maximum = jalali.periodDay(1, max === 'NOW' ? new Date() : max).to;
-        return value.getTime() > maximum.getTime() ? { maxdate: jalali.toFullText(maximum, { format: 'Y/M/D' }) } : null;
-    };
-};
-
-const MinDateValidator = (min) => {
-    const jalali = JalaliDateTime();
-    return (formControl) => {
-        const value = formControl.value;
-        if (Helper.IS.empty(value) || !Helper.IS.date(value))
-            return null;
-        const minimum = jalali.periodDay(1, min === 'NOW' ? new Date() : min).from;
-        return value.getTime() < minimum.getTime() ? { mindate: jalali.toFullText(minimum, { format: 'Y/M/D' }) } : null;
-    };
-};
-
-const MaxMomentValidator = (max) => {
-    const jalali = JalaliDateTime();
-    const formatDate = (date) => jalali.toString(date, { format: 'Y-M-D H:I' });
-    return (formControl) => {
-        const value = formControl.value;
-        if (Helper.IS.empty(value) || !Helper.IS.date(value))
-            return null;
-        const maximum = max === 'NOW' ? new Date() : max;
-        return formatDate(value) > formatDate(maximum)
-            ? { maxmoment: jalali.toFullText(maximum, { format: 'H:I Y/M/D' }) }
-            : null;
-    };
-};
-
-const MinMomentValidator = (min) => {
-    const jalali = JalaliDateTime();
-    const formatDate = (date) => jalali.toString(date, { format: 'Y-M-D H:I' });
-    return (formControl) => {
-        const value = formControl.value;
-        if (Helper.IS.empty(value) || !Helper.IS.date(value))
-            return null;
-        const minimum = min === 'NOW' ? new Date() : min;
-        return formatDate(value) < formatDate(minimum)
-            ? { minmoment: jalali.toFullText(minimum, { format: 'H:I Y/M/D' }) }
-            : null;
-    };
-};
-
-const MaxNumberValidator = (maximum) => {
-    return (formControl) => {
-        const value = Helper.IS.string(formControl.value) ? +formControl.value.replace(/,/g, '') : formControl.value;
-        if (Helper.IS.empty(value) || !Helper.IS.number(value))
-            return null;
-        return value <= maximum ? null : { maximum };
-    };
-};
-
-const MinNumberValidator = (minimum) => {
-    return (formControl) => {
-        const value = Helper.IS.string(formControl.value) ? +formControl.value.replace(/,/g, '') : formControl.value;
-        if (Helper.IS.empty(value) || !Helper.IS.number(value))
-            return null;
-        return value >= minimum ? null : { minimum };
-    };
-};
-
-const MultiplyOfNumberValidator = (multiplyOf) => {
-    return (formControl) => {
-        const value = Helper.IS.string(formControl.value) ? +formControl.value.replace(/,/g, '') : formControl.value;
-        if (Helper.IS.empty(value) || !Helper.IS.number(value))
-            return null;
-        return value % multiplyOf === 0 ? null : { multiplyOf };
-    };
-};
-
-const LengthValidator = (length) => {
-    return (formControl) => {
-        const value = formControl.value;
-        if (Helper.IS.empty(value) || !Helper.IS.string(value))
-            return null;
-        return value.length !== length ? { length } : null;
-    };
-};
-
 class InputDateMethods extends InputMethods {
     control(input, validators) {
         if (input.minDate)
@@ -1166,6 +1288,75 @@ class InputPasswordMethods extends InputMethods {
     }
 }
 
+class InputPriceComponent {
+    formControl = inject(INPUT_CONTROL);
+    input = inject(INPUT_TYPE);
+    config = inject(INPUT_CONFIG);
+    values;
+    isButtonDisabled;
+    maxLength = 15;
+    hintText;
+    isFocused = false;
+    inputTransformFn = (value) => Helper.STRING.changeNumbers(value.toString(), 'EN');
+    ngOnInit() {
+        if (!this.input.fractionDigits && this.input.maximum)
+            this.maxLength = Helper.NUMBER.format(this.input.maximum, 'EN').length;
+        this.updateHint();
+    }
+    setValue(input) {
+        const value = input.length === 0 ? null : +input.replace(/,/gi, '');
+        this.formControl.setValue(Helper.IS.number(value) ? value : null);
+        this.formControl.markAllAsTouched();
+    }
+    updateHint() {
+        const value = this.formControl.value;
+        this.hintText =
+            this.input.hideText || !Helper.IS.number(value)
+                ? undefined
+                : Helper.NUMBER.getTitle(Math.abs(value)) + (this.input.currency ? ` ${this.input.currency}` : '');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: InputPriceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.4", type: InputPriceComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-price" } }, providers: [provideNgxMask()], 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) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n    <!-- HINT -->\n    @if (input.hint|| (isFocused && hintText)) { <mat-hint>{{ isFocused && hintText ? hintText : input.hint }}</mat-hint> }\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        [mask]=\"\n            input.fractionDigits === true\n                ? 'separator.3'\n                : !!input.fractionDigits && input.fractionDigits > 0\n                ? 'separator.' + input.fractionDigits.toString()\n                : 'separator.0'\n        \"\n        thousandSeparator=\",\"\n        decimalMarker=\".\"\n        [allowNegativeNumbers]=\"false\"\n        [inputTransformFn]=\"inputTransformFn\"\n        [maxlength]=\"maxLength\"\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])[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.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { 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]", exportAs: ["matButton"] }, { 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: 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" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: InputPriceComponent, decorators: [{
+            type: Component,
+            args: [{ host: { selector: 'input-price' }, imports: [
+                        FormsModule,
+                        ReactiveFormsModule,
+                        MatFormField,
+                        MatIcon,
+                        MatIconButton,
+                        MatInputModule,
+                        NgxMaskDirective,
+                        AutoCompleteDirective,
+                        AutoFocusDirective,
+                        InputErrorPipe,
+                        MultiLinePipe,
+                    ], providers: [provideNgxMask()], template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\">\n    <mat-label>{{ input.title || '\u0642\u06CC\u0645\u062A' }}</mat-label>\n    @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n    <!-- HINT -->\n    @if (input.hint|| (isFocused && hintText)) { <mat-hint>{{ isFocused && hintText ? hintText : input.hint }}</mat-hint> }\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        [mask]=\"\n            input.fractionDigits === true\n                ? 'separator.3'\n                : !!input.fractionDigits && input.fractionDigits > 0\n                ? 'separator.' + input.fractionDigits.toString()\n                : 'separator.0'\n        \"\n        thousandSeparator=\",\"\n        decimalMarker=\".\"\n        [allowNegativeNumbers]=\"false\"\n        [inputTransformFn]=\"inputTransformFn\"\n        [maxlength]=\"maxLength\"\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"] }]
+        }], propDecorators: { values: [{
+                type: Input,
+                args: [{ required: true }]
+            }], isButtonDisabled: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
+class InputPriceMethods extends InputMethods {
+    control(input, validators) {
+        if (input.minimum)
+            validators.push(MinNumberValidator(input.minimum));
+        if (input.maximum)
+            validators.push(MaxNumberValidator(input.maximum));
+        if (input.multiplyOf)
+            validators.push(MultiplyOfNumberValidator(input.multiplyOf));
+        const value = input.value !== undefined && Helper.IS.number(input.value) ? input.value : null;
+        return new FormControl(value, validators);
+    }
+    value(value, input) {
+        return Helper.IS.number(value) ? value : null;
+    }
+}
+
 class InputSelectComponent {
     formControl = inject(INPUT_CONTROL);
     input = inject(INPUT_TYPE);
@@ -1401,6 +1592,8 @@ const InputInfo = {
         methods: new InputAutoCompleteMethods(),
         component: InputAutoCompleteComponent,
     },
+    'BANK-CARD': { title: 'شماره کارت بانکی', methods: new InputBankCardMethods(), component: InputBankCardComponent },
+    'BANK-SHEBA': { title: 'شماره شبا', methods: new InputBankShebaMethods(), component: InputBankShebaComponent },
     CHECKBOX: { title: 'یک انتخابی', methods: new InputCheckboxMethods(), component: InputCheckboxComponent },
     COLOR: { title: 'رنگ', methods: new InputColorMethods(), component: InputColorComponent },
     COMPONENT: { title: 'کامپوننت', methods: new InputComponentMethods(), component: InputComponentComponent },
@@ -1416,6 +1609,7 @@ const InputInfo = {
     NAME: { title: 'نام و نام خانوادگی', methods: new InputNameMethods(), component: InputNameComponent },
     NUMBER: { title: 'مقدار عددی', methods: new InputNumberMethods(), component: InputNumberComponent },
     PASSWORD: { title: 'کلمه عبور', methods: new InputPasswordMethods(), component: InputPasswordComponent },
+    PRICE: { title: 'قیمت', methods: new InputPriceMethods(), component: InputPriceComponent },
     SELECT: { title: 'لیست کشویی', methods: new InputSelectMethods(), component: InputSelectComponent },
     TEXT: { title: 'متن یک خطی', methods: new InputTextMethods(), component: InputTextComponent },
     TEXTAREA: { title: 'متن چند خطی', methods: new InputTextareaMethods(), component: InputTextareaComponent },