circletone/esm2022/lib/forms/toggle/toggle.component.mjs

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;
    }
    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 [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 [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,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9nZ2xlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NpcmNsZXRvbmUvc3JjL2xpYi9mb3Jtcy90b2dnbGUvdG9nZ2xlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NpcmNsZXRvbmUvc3JjL2xpYi9mb3Jtcy90b2dnbGUvdG9nZ2xlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUVULFlBQVksRUFDWixLQUFLLEVBQ0wsUUFBUSxFQUNSLE1BQU0sRUFDTixVQUFVLEdBQ1gsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFHNUUsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLDBCQUEwQixDQUFDO0FBQzFELE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxvQkFBb0IsRUFBRSxNQUFNLG9CQUFvQixDQUFDOzs7QUFXbkYsTUFBTSxPQUFPLGVBQWdCLFNBQVEsb0JBQW9CO0lBVXZELFlBQ2lDLGtCQUFzQyxFQUNwRCxVQUFzQjtRQUV2QyxLQUFLLENBQUMsa0JBQWtCLENBQUMsQ0FBQztRQUhLLHVCQUFrQixHQUFsQixrQkFBa0IsQ0FBb0I7UUFDcEQsZUFBVSxHQUFWLFVBQVUsQ0FBWTtRQVhoQyxvQkFBZSxHQUFHLEVBQUUsQ0FBQztRQUNyQixZQUFPLEdBQVksS0FBSyxDQUFDO1FBQ3pCLFVBQUssR0FBRyxFQUFFLENBQUM7UUFDWCxRQUFHLEdBQUcsRUFBRSxDQUFDO1FBQ1QsVUFBSyxHQUFHLEVBQUUsQ0FBQztRQUNYLGNBQVMsR0FBRyxLQUFLLENBQUM7UUFDbEIsZ0JBQVcsR0FBa0MsWUFBWSxDQUFDO1FBQ3pELGVBQVUsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO0lBT25ELENBQUM7SUFFRCxNQUFNO1FBQ0osSUFBSSxDQUFDLE9BQU8sR0FBRyxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUM7UUFDN0IsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDakMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQ3JDLENBQUM7SUFFRCxVQUFVLENBQUMsS0FBVTtRQUNuQixJQUFJLENBQUMsZ0JBQWdCLEVBQUUsQ0FBQztRQUN4QixJQUFJLENBQUMsT0FBTyxHQUFHLEtBQUssQ0FBQztJQUN2QixDQUFDOzhHQTFCVSxlQUFlO2tHQUFmLGVBQWUsbVFBSmYsQ0FBQyxvQkFBb0IsQ0FBQyxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsZUFBZSxDQUFDLENBQUMsQ0FBQyxpRENyQnRFLGk4QkFZQSw0Q0RPWSxjQUFjLHFIQUdULENBQUMsdUJBQXVCLEVBQUUsQ0FBQzs7MkZBRy9CLGVBQWU7a0JBVDNCLFNBQVM7K0JBQ0UsV0FBVyxjQUNULElBQUksV0FDUCxDQUFDLGNBQWMsQ0FBQyxhQUVkLENBQUMsb0JBQW9CLENBQUMsVUFBVSxDQUFDLEdBQUcsRUFBRSxnQkFBZ0IsQ0FBQyxDQUFDLENBQUMsaUJBQ3JELENBQUMsdUJBQXVCLEVBQUUsQ0FBQyxtQkFDekIsdUJBQXVCLENBQUMsTUFBTTs7MEJBYTVDLFFBQVE7a0VBVkYsZUFBZTtzQkFBdkIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLEdBQUc7c0JBQVgsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csU0FBUztzQkFBakIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNJLFVBQVU7c0JBQW5CLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBEZXN0cm95UmVmLFxuICBFdmVudEVtaXR0ZXIsXG4gIElucHV0LFxuICBPcHRpb25hbCxcbiAgT3V0cHV0LFxuICBmb3J3YXJkUmVmLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEZvcm1HZW5lcmljQ29tcG9uZW50IH0gZnJvbSAnLi4vLi4vc2VydmljZXMvZm9ybS1nZW5lcmljLmFic3RyYWN0JztcbmltcG9ydCB7IEZvcm1Hcm91cERpcmVjdGl2ZSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7IENvbXBvbmVudERpc3Bvc2l0aW9uIH0gZnJvbSAnLi4vLi4vbW9kZWwvY29tcG9uZW50cy9jb21wb25lbnQtZGlzcG9zaXRpb24uZW51bSc7XG5pbXBvcnQgeyBMYWJlbENvbXBvbmVudCB9IGZyb20gJy4uL2xhYmVsL2xhYmVsLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBwcm92aWRlQ29udHJvbENvbnRhaW5lciwgcHJvdmlkZVZhbHVlQWNjZXNzb3IgfSBmcm9tICcuLi91dGlscy9mb3JtLnV0aWwnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdjdC10b2dnbGUnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbTGFiZWxDb21wb25lbnRdLFxuICB0ZW1wbGF0ZVVybDogJy4vdG9nZ2xlLmNvbXBvbmVudC5odG1sJyxcbiAgcHJvdmlkZXJzOiBbcHJvdmlkZVZhbHVlQWNjZXNzb3IoZm9yd2FyZFJlZigoKSA9PiBUb2dnbGVDb21wb25lbnQpKV0sXG4gIHZpZXdQcm92aWRlcnM6IFtwcm92aWRlQ29udHJvbENvbnRhaW5lcigpXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIFRvZ2dsZUNvbXBvbmVudCBleHRlbmRzIEZvcm1HZW5lcmljQ29tcG9uZW50IHtcbiAgQElucHV0KCkgZm9ybUNvbnRyb2xOYW1lID0gJyc7XG4gIEBJbnB1dCgpIGNoZWNrZWQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgbGFiZWwgPSAnJztcbiAgQElucHV0KCkga2V5ID0gJyc7XG4gIEBJbnB1dCgpIHZhbHVlID0gJyc7XG4gIEBJbnB1dCgpIHNob3dFcnJvciA9IGZhbHNlO1xuICBASW5wdXQoKSBkaXNwb3NpdGlvbjogQ29tcG9uZW50RGlzcG9zaXRpb24gfCBzdHJpbmcgPSAnaG9yaXpvbnRhbCc7XG4gIEBPdXRwdXQoKSB3YXNDaGVja2VkID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xuXG4gIGNvbnN0cnVjdG9yKFxuICAgIEBPcHRpb25hbCgpIHByb3RlY3RlZCBvdmVycmlkZSBmb3JtR3JvdXBEaXJlY3RpdmU6IEZvcm1Hcm91cERpcmVjdGl2ZSxcbiAgICBwcml2YXRlIHJlYWRvbmx5IGRlc3Ryb3lSZWY6IERlc3Ryb3lSZWZcbiAgKSB7XG4gICAgc3VwZXIoZm9ybUdyb3VwRGlyZWN0aXZlKTtcbiAgfVxuXG4gIHRvZ2dsZSgpIHtcbiAgICB0aGlzLmNoZWNrZWQgPSAhdGhpcy5jaGVja2VkO1xuICAgIHRoaXMudHJpZ2dlckNoYW5nZSh0aGlzLmNoZWNrZWQpO1xuICAgIHRoaXMud2FzQ2hlY2tlZC5lbWl0KHRoaXMuY2hlY2tlZCk7XG4gIH1cblxuICB3cml0ZVZhbHVlKHZhbHVlOiBhbnkpIHtcbiAgICB0aGlzLnRyaWdnZXJNYXJrQ2hlY2soKTtcbiAgICB0aGlzLmNoZWNrZWQgPSB2YWx1ZTtcbiAgfVxufVxuIiwiPGRpdlxuICBjbGFzcz1cImZsZXggZmxleC1yb3cgZ2FwLTRcIlxuICBbY2xhc3MuaXRlbXMtY2VudGVyXT1cImRpc3Bvc2l0aW9uID09PSAnaG9yaXpvbnRhbCdcIlxuICBbY2xhc3MuZmxleC1jb2xdPVwiZGlzcG9zaXRpb24gPT09ICd2ZXJ0aWNhbCdcIj5cbiAgPGN0LWZvcm0tbGFiZWwgW3RleHRdPVwibGFiZWxcIiBbaGFzRXJyb3JdPVwiaGFzRXJyb3JzKGZvcm1Db250cm9sKSAmJiBzaG93RXJyb3JcIiAvPlxuICA8bGFiZWwgY2xhc3M9XCJpbmxpbmUtZmxleCBjdXJzb3ItcG9pbnRlclwiPlxuICAgIDxpbnB1dCB0eXBlPVwiY2hlY2tib3hcIiBbdmFsdWVdPVwidmFsdWVcIiBbY2hlY2tlZF09XCJjaGVja2VkXCIgY2xhc3M9XCJwZWVyIHNyLW9ubHlcIiAoY2hhbmdlKT1cInRvZ2dsZSgpXCIgLz5cbiAgICA8ZGl2XG4gICAgICB0YWJpbmRleD1cIjBcIlxuICAgICAgY2xhc3M9XCJwZWVyIHJlbGF0aXZlIGgtNiB3LTExIHJvdW5kZWQtZnVsbCBiZy1zdXJmYWNlLXZhcmlhbnQgYWZ0ZXI6YWJzb2x1dGUgYWZ0ZXI6c3RhcnQtWzJweF0gYWZ0ZXI6dG9wLVsycHhdIGFmdGVyOnNpemUtNSBhZnRlcjpyb3VuZGVkLWZ1bGwgYWZ0ZXI6Ym9yZGVyIGFmdGVyOmJvcmRlci10cmFuc3BhcmVudCBhZnRlcjpiZy1uZXV0cmFsLTUwIGFmdGVyOnRyYW5zaXRpb24tYWxsIGFmdGVyOmNvbnRlbnQtWycnXSBwZWVyLWNoZWNrZWQ6YmctcHJpbWFyeSBwZWVyLWNoZWNrZWQ6YWZ0ZXI6dHJhbnNsYXRlLXgtZnVsbCBwZWVyLWNoZWNrZWQ6YWZ0ZXI6Ym9yZGVyLXdoaXRlIHBlZXItZm9jdXM6b3V0bGluZS1ub25lIHJ0bDpwZWVyLWNoZWNrZWQ6YWZ0ZXI6LXRyYW5zbGF0ZS14LWZ1bGwgZGFyazpiZy1zdXJmYWNlLXZhcmlhbnQtZGFyayBkYXJrOmFmdGVyOmJnLW5ldXRyYWwtNDAwIGRhcms6cGVlci1jaGVja2VkOmJnLXByaW1hcnktZGFya1wiPjwvZGl2PlxuICA8L2xhYmVsPlxuPC9kaXY+XG4iXX0=