import * as i0 from '@angular/core';
import { inject, input, signal, computed, effect, HostBinding, ViewChild, ChangeDetectionStrategy, Component } from '@angular/core';
import * as i2 from 'primeng/inputtext';
import { InputTextModule } from 'primeng/inputtext';
import * as i1 from '@angular/forms';
import { Validators, NgControl, FormsModule } from '@angular/forms';
import * as i3 from 'primeng/inputgroup';
import { InputGroupModule } from 'primeng/inputgroup';
import * as i4 from 'primeng/inputgroupaddon';
import { InputGroupAddonModule } from 'primeng/inputgroupaddon';
import { Tooltip } from '@masterteam/components/tooltip';
import { InputIcon } from 'primeng/inputicon';
import { IconField } from 'primeng/iconfield';
import { FieldValidation } from '@masterteam/components/field-validation';
import { isInvalid } from '@masterteam/components';
import { Icon } from '@masterteam/icons';
import { NgTemplateOutlet } from '@angular/common';
import { Directionality } from '@angular/cdk/bidi';

// TODO: text stuck when reset
class TextField {
    dir = inject(Directionality, { optional: true });
    inputText;
    field = input(true, ...(ngDevMode ? [{ debugName: "field" }] : []));
    hint = input(...(ngDevMode ? [undefined, { debugName: "hint" }] : []));
    label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
    placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : []));
    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
    type = input('text', ...(ngDevMode ? [{ debugName: "type" }] : []));
    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
    pInputs = input(...(ngDevMode ? [undefined, { debugName: "pInputs" }] : []));
    // readonly pKeyFilter = input<KeyFilterPattern | RegExp>();
    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
    icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
    iconPosition = input('start', ...(ngDevMode ? [{ debugName: "iconPosition" }] : []));
    // readonly externalControl = input<any>(null);
    styleClass;
    requiredValidator = Validators.required;
    value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
    disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
    iconPos = computed(() => {
        if (this.iconPosition() === 'start') {
            return this.dir?.value === 'rtl' ? 'right' : 'left';
        }
        else {
            return this.dir?.value === 'rtl' ? 'left' : 'right';
        }
    }, ...(ngDevMode ? [{ debugName: "iconPos" }] : []));
    alphaNum = /[\u0621-\u064A\u0660-\u0669a-z0-9\s]/i;
    onTouched = () => { };
    onModelChange = () => { };
    ngControl = null;
    isInvalid = isInvalid;
    constructor() {
        try {
            // Try to inject NgControl if available
            this.ngControl = inject(NgControl, { self: true, optional: true });
            if (this.ngControl) {
                this.ngControl.valueAccessor = this;
            }
        }
        catch (_e) {
            // If injection fails, ngControl will remain null
            this.ngControl = null;
        }
        effect(() => {
            if (this.ngControl?.control && this.required()) {
                this.ngControl.control.addValidators(Validators.required);
                this.ngControl.control.updateValueAndValidity();
            }
        });
    }
    ngOnInit() {
        this.styleClass = this.class();
        // if (this.externalControl()) {
        //   debugger
        //   this.ngControl = this.externalControl();
        // }
        if (this.pInputs()) {
            this.applyInputsToInputText();
        }
    }
    applyInputsToInputText() {
        Object.assign(this.inputText, this.pInputs());
    }
    onValueChange(value) {
        this.onModelChange(value);
        this.onTouched();
        this.value.set(value);
    }
    ngOnChanges(changes) {
        if (changes['pInputs']) {
            this.applyInputsToInputText();
        }
    }
    writeValue(value) {
        this.value.set(value);
    }
    registerOnChange(fn) {
        this.onModelChange = fn;
    }
    registerOnTouched(fn) {
        this.onTouched = fn;
    }
    setDisabledState(disabled) {
        this.disabled.set(disabled);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: TextField, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: TextField, isStandalone: true, selector: "mt-text-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, pInputs: { classPropertyName: "pInputs", publicName: "pInputs", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.styleClass" }, classAttribute: "grid gap-1" }, viewQueries: [{ propertyName: "inputText", first: true, predicate: ["inputText"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "@if (label()) {\n  <label\n    [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n    [for]=\"ngControl?.name || label()\"\n    >{{ label() }}</label\n  >\n}\n@if (!hint()) {\n  <ng-container *ngTemplateOutlet=\"inputTemp\"></ng-container>\n} @else {\n  <p-inputgroup>\n    <ng-container *ngTemplateOutlet=\"inputTemp\"></ng-container>\n    <p-inputgroup-addon [mtTooltip]=\"hint()\" tooltipPosition=\"top\">\n      <mt-icon icon=\"general.help-circle\" />\n    </p-inputgroup-addon>\n  </p-inputgroup>\n}\n\n<ng-template #inputTemp>\n  @if (!icon()) {\n    <input\n      #inputText=\"\"\n      pInputText=\"\"\n      [ngModel]=\"value()\"\n      (ngModelChange)=\"onValueChange($event)\"\n      [disabled]=\"disabled() || readonly()\"\n      [type]=\"type()\"\n      [id]=\"ngControl?.name || label()\"\n      [invalid]=\"isInvalid(ngControl?.control)\"\n      (blur)=\"onTouched()\"\n      placeholder=\"{{ placeholder() ?? label() ?? '' }}\"\n      class=\"w-full\"\n    />\n  } @else {\n    <p-iconfield iconPosition=\"iconPos()\">\n      <p-inputicon>\n        <mt-icon [icon]=\"icon()\" />\n      </p-inputicon>\n      <input\n        #inputText=\"\"\n        pInputText=\"\"\n        [ngModel]=\"value()\"\n        (ngModelChange)=\"onValueChange($event)\"\n        [disabled]=\"disabled() || readonly()\"\n        [type]=\"type()\"\n        [id]=\"ngControl?.name || label()\"\n        [invalid]=\"isInvalid(ngControl?.control)\"\n        (blur)=\"onTouched()\"\n        placeholder=\"{{ placeholder() ?? label() ?? '' }}\"\n        class=\"w-full\"\n      />\n    </p-iconfield>\n  }\n</ng-template>\n\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n", styles: [""], 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "component", type: IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "directive", type: 
                // INFO: if we need this filter uncomment the import, and next line and add this to the template input
                //[pKeyFilter]="
                //   pKeyFilter()
                //     ? pKeyFilter() === 'alphanum'
                //       ? alphaNum
                //       : pKeyFilter()
                //     : null
                // "
                // KeyFilterModule,
                Tooltip, selector: "[mtTooltip]" }, { kind: "ngmodule", type: InputGroupModule }, { kind: "component", type: i3.InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }, { kind: "ngmodule", type: InputGroupAddonModule }, { kind: "component", type: i4.InputGroupAddon, selector: "p-inputgroup-addon, p-inputGroupAddon", inputs: ["style", "styleClass"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: TextField, decorators: [{
            type: Component,
            args: [{ selector: 'mt-text-field', standalone: true, imports: [
                        FormsModule,
                        InputTextModule,
                        InputIcon,
                        IconField,
                        // INFO: if we need this filter uncomment the import, and next line and add this to the template input
                        //[pKeyFilter]="
                        //   pKeyFilter()
                        //     ? pKeyFilter() === 'alphanum'
                        //       ? alphaNum
                        //       : pKeyFilter()
                        //     : null
                        // "
                        // KeyFilterModule,
                        Tooltip,
                        InputGroupModule,
                        InputGroupAddonModule,
                        FieldValidation,
                        Icon,
                        NgTemplateOutlet,
                    ], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                        class: 'grid gap-1',
                    }, template: "@if (label()) {\n  <label\n    [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n    [for]=\"ngControl?.name || label()\"\n    >{{ label() }}</label\n  >\n}\n@if (!hint()) {\n  <ng-container *ngTemplateOutlet=\"inputTemp\"></ng-container>\n} @else {\n  <p-inputgroup>\n    <ng-container *ngTemplateOutlet=\"inputTemp\"></ng-container>\n    <p-inputgroup-addon [mtTooltip]=\"hint()\" tooltipPosition=\"top\">\n      <mt-icon icon=\"general.help-circle\" />\n    </p-inputgroup-addon>\n  </p-inputgroup>\n}\n\n<ng-template #inputTemp>\n  @if (!icon()) {\n    <input\n      #inputText=\"\"\n      pInputText=\"\"\n      [ngModel]=\"value()\"\n      (ngModelChange)=\"onValueChange($event)\"\n      [disabled]=\"disabled() || readonly()\"\n      [type]=\"type()\"\n      [id]=\"ngControl?.name || label()\"\n      [invalid]=\"isInvalid(ngControl?.control)\"\n      (blur)=\"onTouched()\"\n      placeholder=\"{{ placeholder() ?? label() ?? '' }}\"\n      class=\"w-full\"\n    />\n  } @else {\n    <p-iconfield iconPosition=\"iconPos()\">\n      <p-inputicon>\n        <mt-icon [icon]=\"icon()\" />\n      </p-inputicon>\n      <input\n        #inputText=\"\"\n        pInputText=\"\"\n        [ngModel]=\"value()\"\n        (ngModelChange)=\"onValueChange($event)\"\n        [disabled]=\"disabled() || readonly()\"\n        [type]=\"type()\"\n        [id]=\"ngControl?.name || label()\"\n        [invalid]=\"isInvalid(ngControl?.control)\"\n        (blur)=\"onTouched()\"\n        placeholder=\"{{ placeholder() ?? label() ?? '' }}\"\n        class=\"w-full\"\n      />\n    </p-iconfield>\n  }\n</ng-template>\n\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n" }]
        }], ctorParameters: () => [], propDecorators: { inputText: [{
                type: ViewChild,
                args: ['inputText', { static: true }]
            }], field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], pInputs: [{ type: i0.Input, args: [{ isSignal: true, alias: "pInputs", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconPosition", required: false }] }], styleClass: [{
                type: HostBinding,
                args: ['class']
            }] } });

/**
 * Generated bundle index. Do not edit.
 */

export { TextField };
//# sourceMappingURL=masterteam-components-text-field.mjs.map
