import { ChangeDetectionStrategy, Component, EventEmitter, Input, Optional, Output, forwardRef, } from '@angular/core';
import { FormGenericComponent } from '../../services/form-generic.abstract';
import { LabelComponent } from '../label/label.component';
import { provideControlContainer, provideValueAccessor } from '../utils/form.util';
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
export class ToggleComponent extends FormGenericComponent {
    constructor(formGroupDirective, destroyRef) {
        super(formGroupDirective);
        this.formGroupDirective = formGroupDirective;
        this.destroyRef = destroyRef;
        this.formControlName = '';
        this.checked = false;
        this.label = '';
        this.key = '';
        this.value = '';
        this.showError = false;
        this.disposition = 'horizontal';
        this.wasChecked = new EventEmitter();
    }
    toggle() {
        this.checked = !this.checked;
        this.triggerChange(this.checked);
        this.wasChecked.emit(this.checked);
    }
    writeValue(value) {
        this.triggerMarkCheck();
        this.checked = value === this.value;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ToggleComponent, deps: [{ token: i1.FormGroupDirective, optional: true }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: ToggleComponent, isStandalone: true, selector: "ct-toggle", inputs: { formControlName: "formControlName", checked: "checked", label: "label", key: "key", value: "value", showError: "showError", disposition: "disposition" }, outputs: { wasChecked: "wasChecked" }, providers: [provideValueAccessor(forwardRef(() => ToggleComponent))], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"flex flex-row gap-4\"\n  [class.items-center]=\"disposition === 'horizontal'\"\n  [class.flex-col]=\"disposition === 'vertical'\">\n  <ct-form-label class=\"w-full\" [text]=\"label\" [hasError]=\"hasErrors(formControl) && showError\" />\n  <label class=\"inline-flex cursor-pointer\">\n    <input type=\"checkbox\" [value]=\"value\" [checked]=\"checked\" class=\"peer sr-only\" (change)=\"toggle()\" />\n    <div\n      tabindex=\"0\"\n      class=\"peer relative h-6 w-11 rounded-full bg-surface-variant after:absolute after:start-[2px] after:top-[2px] after:size-5 after:rounded-full after:border after:border-transparent after:bg-neutral-50 after:transition-all after:content-[''] peer-checked:bg-primary peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none rtl:peer-checked:after:-translate-x-full dark:bg-surface-variant-dark dark:after:bg-neutral-400 dark:peer-checked:bg-primary-dark\"></div>\n  </label>\n</div>\n", dependencies: [{ kind: "component", type: LabelComponent, selector: "ct-form-label", inputs: ["text", "type", "formControlName", "hasError", "showError"] }], viewProviders: [provideControlContainer()], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ToggleComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ct-toggle', standalone: true, imports: [LabelComponent], providers: [provideValueAccessor(forwardRef(() => ToggleComponent))], viewProviders: [provideControlContainer()], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"flex flex-row gap-4\"\n  [class.items-center]=\"disposition === 'horizontal'\"\n  [class.flex-col]=\"disposition === 'vertical'\">\n  <ct-form-label class=\"w-full\" [text]=\"label\" [hasError]=\"hasErrors(formControl) && showError\" />\n  <label class=\"inline-flex cursor-pointer\">\n    <input type=\"checkbox\" [value]=\"value\" [checked]=\"checked\" class=\"peer sr-only\" (change)=\"toggle()\" />\n    <div\n      tabindex=\"0\"\n      class=\"peer relative h-6 w-11 rounded-full bg-surface-variant after:absolute after:start-[2px] after:top-[2px] after:size-5 after:rounded-full after:border after:border-transparent after:bg-neutral-50 after:transition-all after:content-[''] peer-checked:bg-primary peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none rtl:peer-checked:after:-translate-x-full dark:bg-surface-variant-dark dark:after:bg-neutral-400 dark:peer-checked:bg-primary-dark\"></div>\n  </label>\n</div>\n" }]
        }], ctorParameters: () => [{ type: i1.FormGroupDirective, decorators: [{
                    type: Optional
                }] }, { type: i0.DestroyRef }], propDecorators: { formControlName: [{
                type: Input
            }], checked: [{
                type: Input
            }], label: [{
                type: Input
            }], key: [{
                type: Input
            }], value: [{
                type: Input
            }], showError: [{
                type: Input
            }], disposition: [{
                type: Input
            }], wasChecked: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64,[encoded data, 5792 characters]