import * as i0 from '@angular/core';
import { input, contentChild, output, inject, computed, signal, effect, ViewChild, ChangeDetectionStrategy, Component } from '@angular/core';
import * as i1 from '@angular/forms';
import { NgControl, Validators, FormsModule } from '@angular/forms';
import * as i2 from 'primeng/toggleswitch';
import { ToggleSwitchModule } from 'primeng/toggleswitch';
import { FieldValidation } from '@masterteam/components/field-validation';
import { isInvalid } from '@masterteam/components';
import { Card } from '@masterteam/components/card';
import { Avatar } from '@masterteam/components/avatar';
import { NgTemplateOutlet } from '@angular/common';

class ToggleField {
    toggle;
    label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
    labelPosition = input('end', ...(ngDevMode ? [{ debugName: "labelPosition" }] : []));
    placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : []));
    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
    pInputs = input(...(ngDevMode ? [undefined, { debugName: "pInputs" }] : []));
    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
    toggleShape = input('toggle', ...(ngDevMode ? [{ debugName: "toggleShape" }] : []));
    size = input('large', ...(ngDevMode ? [{ debugName: "size" }] : []));
    icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
    descriptionCard = input(...(ngDevMode ? [undefined, { debugName: "descriptionCard" }] : []));
    // Content child for custom bottom content in card shape
    toggleCardBottom = contentChild('toggleCardBottom', ...(ngDevMode ? [{ debugName: "toggleCardBottom" }] : []));
    onChange = output();
    ngControl = inject(NgControl, { self: true });
    isInvalid = isInvalid;
    isVertical = computed(() => this.labelPosition() === 'top' || this.labelPosition() === 'bottom', ...(ngDevMode ? [{ debugName: "isVertical" }] : []));
    requiredValidator = Validators.required;
    value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
    disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
    onTouched = () => { };
    onModelChange = () => { };
    constructor() {
        if (this.ngControl) {
            this.ngControl.valueAccessor = this;
        }
        // Effect to apply pInputs reactively when the pInputs signal changes
        effect(() => {
            const currentPInputs = this.pInputs();
            // Ensure checkbox ViewChild is initialized and pInputs has a value
            // @ViewChild with static: true makes 'checkbox' available during construction/ngOnInit
            if (this.toggle && currentPInputs) {
                this.applyInputsToCheckbox();
            }
        });
        // Effect to add required validator if required input is true
        effect(() => {
            if (this.ngControl?.control && this.required()) {
                this.ngControl.control.addValidators(Validators.required);
                this.ngControl.control.updateValueAndValidity();
            }
        });
    }
    applyInputsToCheckbox() {
        const currentPInputs = this.pInputs();
        if (currentPInputs) {
            Object.assign(this.toggle, currentPInputs);
        }
    }
    onValueChange(value) {
        this.onModelChange(value);
        this.value.set(value);
    }
    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: ToggleField, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: ToggleField, isStandalone: true, selector: "mt-toggle-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", 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 }, toggleShape: { classPropertyName: "toggleShape", publicName: "toggleShape", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, descriptionCard: { classPropertyName: "descriptionCard", publicName: "descriptionCard", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChange: "onChange" }, host: { classAttribute: "grid gap-1" }, queries: [{ propertyName: "toggleCardBottom", first: true, predicate: ["toggleCardBottom"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "toggle", first: true, predicate: ["toggle"], descendants: true, static: true }], ngImport: i0, template: "@if (toggleShape() === \"card\") {\r\n  <mt-card\r\n    class=\"cursor-pointer transition-all hover:border-primary\"\r\n    [class.border-primary]=\"value()\"\r\n    [class.opacity-60]=\"disabled() || readonly()\"\r\n  >\r\n    <div class=\"flex items-center gap-4\">\r\n      <div class=\"flex flex-1 items-center gap-3\">\r\n        @if (icon()) {\r\n          <mt-avatar [icon]=\"icon()\" size=\"normal\" />\r\n        }\r\n        <div class=\"flex flex-col\">\r\n          @if (label()) {\r\n            <label\r\n              [class.required]=\"\r\n                ngControl?.control?.hasValidator(requiredValidator)\r\n              \"\r\n              [for]=\"ngControl?.name || label()\"\r\n              class=\"cursor-pointer font-medium\"\r\n              >{{ label() }}</label\r\n            >\r\n          }\r\n          @if (descriptionCard()) {\r\n            <span class=\"text-sm text-muted-color\">{{\r\n              descriptionCard()\r\n            }}</span>\r\n          }\r\n        </div>\r\n      </div>\r\n      <p-toggleswitch\r\n        #checkbox\r\n        [ngModel]=\"value()\"\r\n        [size]=\"size()\"\r\n        (ngModelChange)=\"onValueChange($event)\"\r\n        (onChange)=\"onTouched(); onChange.emit($event)\"\r\n        [disabled]=\"disabled() || readonly()\"\r\n        [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\r\n        [invalid]=\"isInvalid(ngControl?.control)\"\r\n        class=\"leading-none\"\r\n      ></p-toggleswitch>\r\n    </div>\r\n    @if (toggleCardBottom()) {\r\n      <ng-container *ngTemplateOutlet=\"toggleCardBottom()!\"></ng-container>\r\n    }\r\n  </mt-card>\r\n} @else {\r\n  <div\r\n    class=\"flex gap-1\"\r\n    [class.items-center]=\"!isVertical()\"\r\n    [class.gap-2]=\"!isVertical()\"\r\n    [class.flex-col]=\"isVertical()\"\r\n    [class.flex-col-reverse]=\"labelPosition() === 'top'\"\r\n    [class.flex-row-reverse]=\"labelPosition() === 'start'\"\r\n    [class.justify-end]=\"labelPosition() === 'start'\"\r\n  >\r\n    <p-toggleswitch\r\n      #checkbox\r\n      [size]=\"size()\"\r\n      [ngModel]=\"value()\"\r\n      (ngModelChange)=\"onValueChange($event)\"\r\n      (onChange)=\"onTouched(); onChange.emit($event)\"\r\n      [disabled]=\"disabled()\"\r\n      [readonly]=\"readonly()\"\r\n      [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\r\n      [invalid]=\"isInvalid(ngControl?.control)\"\r\n      class=\"leading-none\"\r\n    ></p-toggleswitch>\r\n    @if (label()) {\r\n      <label\r\n        [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n        [for]=\"ngControl?.name || label()\"\r\n        >{{ label() }}</label\r\n      >\r\n    }\r\n  </div>\r\n}\r\n\r\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { 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: ToggleSwitchModule }, { kind: "component", type: i2.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "styleClass", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }, { 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: ToggleField, decorators: [{
            type: Component,
            args: [{ selector: 'mt-toggle-field', standalone: true, imports: [
                        FormsModule,
                        ToggleSwitchModule,
                        FieldValidation,
                        Card,
                        Avatar,
                        NgTemplateOutlet,
                    ], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                        class: 'grid gap-1',
                    }, template: "@if (toggleShape() === \"card\") {\r\n  <mt-card\r\n    class=\"cursor-pointer transition-all hover:border-primary\"\r\n    [class.border-primary]=\"value()\"\r\n    [class.opacity-60]=\"disabled() || readonly()\"\r\n  >\r\n    <div class=\"flex items-center gap-4\">\r\n      <div class=\"flex flex-1 items-center gap-3\">\r\n        @if (icon()) {\r\n          <mt-avatar [icon]=\"icon()\" size=\"normal\" />\r\n        }\r\n        <div class=\"flex flex-col\">\r\n          @if (label()) {\r\n            <label\r\n              [class.required]=\"\r\n                ngControl?.control?.hasValidator(requiredValidator)\r\n              \"\r\n              [for]=\"ngControl?.name || label()\"\r\n              class=\"cursor-pointer font-medium\"\r\n              >{{ label() }}</label\r\n            >\r\n          }\r\n          @if (descriptionCard()) {\r\n            <span class=\"text-sm text-muted-color\">{{\r\n              descriptionCard()\r\n            }}</span>\r\n          }\r\n        </div>\r\n      </div>\r\n      <p-toggleswitch\r\n        #checkbox\r\n        [ngModel]=\"value()\"\r\n        [size]=\"size()\"\r\n        (ngModelChange)=\"onValueChange($event)\"\r\n        (onChange)=\"onTouched(); onChange.emit($event)\"\r\n        [disabled]=\"disabled() || readonly()\"\r\n        [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\r\n        [invalid]=\"isInvalid(ngControl?.control)\"\r\n        class=\"leading-none\"\r\n      ></p-toggleswitch>\r\n    </div>\r\n    @if (toggleCardBottom()) {\r\n      <ng-container *ngTemplateOutlet=\"toggleCardBottom()!\"></ng-container>\r\n    }\r\n  </mt-card>\r\n} @else {\r\n  <div\r\n    class=\"flex gap-1\"\r\n    [class.items-center]=\"!isVertical()\"\r\n    [class.gap-2]=\"!isVertical()\"\r\n    [class.flex-col]=\"isVertical()\"\r\n    [class.flex-col-reverse]=\"labelPosition() === 'top'\"\r\n    [class.flex-row-reverse]=\"labelPosition() === 'start'\"\r\n    [class.justify-end]=\"labelPosition() === 'start'\"\r\n  >\r\n    <p-toggleswitch\r\n      #checkbox\r\n      [size]=\"size()\"\r\n      [ngModel]=\"value()\"\r\n      (ngModelChange)=\"onValueChange($event)\"\r\n      (onChange)=\"onTouched(); onChange.emit($event)\"\r\n      [disabled]=\"disabled()\"\r\n      [readonly]=\"readonly()\"\r\n      [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\r\n      [invalid]=\"isInvalid(ngControl?.control)\"\r\n      class=\"leading-none\"\r\n    ></p-toggleswitch>\r\n    @if (label()) {\r\n      <label\r\n        [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n        [for]=\"ngControl?.name || label()\"\r\n        >{{ label() }}</label\r\n      >\r\n    }\r\n  </div>\r\n}\r\n\r\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n" }]
        }], ctorParameters: () => [], propDecorators: { toggle: [{
                type: ViewChild,
                args: ['toggle', { static: true }]
            }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelPosition", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", 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 }] }], toggleShape: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggleShape", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], descriptionCard: [{ type: i0.Input, args: [{ isSignal: true, alias: "descriptionCard", required: false }] }], toggleCardBottom: [{ type: i0.ContentChild, args: ['toggleCardBottom', { isSignal: true }] }], onChange: [{ type: i0.Output, args: ["onChange"] }] } });

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

export { ToggleField };
//# sourceMappingURL=masterteam-components-toggle-field.mjs.map
