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 === 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,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9nZ2xlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NpcmNsZXRvbmUvc3JjL2xpYi9mb3Jtcy90b2dnbGUvdG9nZ2xlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NpcmNsZXRvbmUvc3JjL2xpYi9mb3Jtcy90b2dnbGUvdG9nZ2xlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUVULFlBQVksRUFDWixLQUFLLEVBQ0wsUUFBUSxFQUNSLE1BQU0sRUFDTixVQUFVLEdBQ1gsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFHNUUsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLDBCQUEwQixDQUFDO0FBQzFELE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxvQkFBb0IsRUFBRSxNQUFNLG9CQUFvQixDQUFDOzs7QUFXbkYsTUFBTSxPQUFPLGVBQWdCLFNBQVEsb0JBQW9CO0lBVXZELFlBQ2lDLGtCQUFzQyxFQUNwRCxVQUFzQjtRQUV2QyxLQUFLLENBQUMsa0JBQWtCLENBQUMsQ0FBQztRQUhLLHVCQUFrQixHQUFsQixrQkFBa0IsQ0FBb0I7UUFDcEQsZUFBVSxHQUFWLFVBQVUsQ0FBWTtRQVhoQyxvQkFBZSxHQUFHLEVBQUUsQ0FBQztRQUNyQixZQUFPLEdBQVksS0FBSyxDQUFDO1FBQ3pCLFVBQUssR0FBRyxFQUFFLENBQUM7UUFDWCxRQUFHLEdBQUcsRUFBRSxDQUFDO1FBQ1QsVUFBSyxHQUFHLEVBQUUsQ0FBQztRQUNYLGNBQVMsR0FBRyxLQUFLLENBQUM7UUFDbEIsZ0JBQVcsR0FBa0MsWUFBWSxDQUFDO1FBQ3pELGVBQVUsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO0lBT25ELENBQUM7SUFFRCxNQUFNO1FBQ0osSUFBSSxDQUFDLE9BQU8sR0FBRyxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUM7UUFDN0IsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDakMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQ3JDLENBQUM7SUFFRCxVQUFVLENBQUMsS0FBVTtRQUNuQixJQUFJLENBQUMsZ0JBQWdCLEVBQUUsQ0FBQztRQUN4QixJQUFJLENBQUMsT0FBTyxHQUFHLEtBQUssS0FBSyxJQUFJLENBQUMsS0FBSyxDQUFDO0lBQ3RDLENBQUM7OEdBMUJVLGVBQWU7a0dBQWYsZUFBZSxtUUFKZixDQUFDLG9CQUFvQixDQUFDLFVBQVUsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxlQUFlLENBQUMsQ0FBQyxDQUFDLGlEQ3JCdEUsazlCQVlBLDRDRE9ZLGNBQWMscUhBR1QsQ0FBQyx1QkFBdUIsRUFBRSxDQUFDOzsyRkFHL0IsZUFBZTtrQkFUM0IsU0FBUzsrQkFDRSxXQUFXLGNBQ1QsSUFBSSxXQUNQLENBQUMsY0FBYyxDQUFDLGFBRWQsQ0FBQyxvQkFBb0IsQ0FBQyxVQUFVLENBQUMsR0FBRyxFQUFFLGdCQUFnQixDQUFDLENBQUMsQ0FBQyxpQkFDckQsQ0FBQyx1QkFBdUIsRUFBRSxDQUFDLG1CQUN6Qix1QkFBdUIsQ0FBQyxNQUFNOzswQkFhNUMsUUFBUTtrRUFWRixlQUFlO3NCQUF2QixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csR0FBRztzQkFBWCxLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0ksVUFBVTtzQkFBbkIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDb21wb25lbnQsXG4gIERlc3Ryb3lSZWYsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE9wdGlvbmFsLFxuICBPdXRwdXQsXG4gIGZvcndhcmRSZWYsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRm9ybUdlbmVyaWNDb21wb25lbnQgfSBmcm9tICcuLi8uLi9zZXJ2aWNlcy9mb3JtLWdlbmVyaWMuYWJzdHJhY3QnO1xuaW1wb3J0IHsgRm9ybUdyb3VwRGlyZWN0aXZlIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgQ29tcG9uZW50RGlzcG9zaXRpb24gfSBmcm9tICcuLi8uLi9tb2RlbC9jb21wb25lbnRzL2NvbXBvbmVudC1kaXNwb3NpdGlvbi5lbnVtJztcbmltcG9ydCB7IExhYmVsQ29tcG9uZW50IH0gZnJvbSAnLi4vbGFiZWwvbGFiZWwuY29tcG9uZW50JztcbmltcG9ydCB7IHByb3ZpZGVDb250cm9sQ29udGFpbmVyLCBwcm92aWRlVmFsdWVBY2Nlc3NvciB9IGZyb20gJy4uL3V0aWxzL2Zvcm0udXRpbCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2N0LXRvZ2dsZScsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtMYWJlbENvbXBvbmVudF0sXG4gIHRlbXBsYXRlVXJsOiAnLi90b2dnbGUuY29tcG9uZW50Lmh0bWwnLFxuICBwcm92aWRlcnM6IFtwcm92aWRlVmFsdWVBY2Nlc3Nvcihmb3J3YXJkUmVmKCgpID0+IFRvZ2dsZUNvbXBvbmVudCkpXSxcbiAgdmlld1Byb3ZpZGVyczogW3Byb3ZpZGVDb250cm9sQ29udGFpbmVyKCldLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgVG9nZ2xlQ29tcG9uZW50IGV4dGVuZHMgRm9ybUdlbmVyaWNDb21wb25lbnQge1xuICBASW5wdXQoKSBmb3JtQ29udHJvbE5hbWUgPSAnJztcbiAgQElucHV0KCkgY2hlY2tlZDogYm9vbGVhbiA9IGZhbHNlO1xuICBASW5wdXQoKSBsYWJlbCA9ICcnO1xuICBASW5wdXQoKSBrZXkgPSAnJztcbiAgQElucHV0KCkgdmFsdWUgPSAnJztcbiAgQElucHV0KCkgc2hvd0Vycm9yID0gZmFsc2U7XG4gIEBJbnB1dCgpIGRpc3Bvc2l0aW9uOiBDb21wb25lbnREaXNwb3NpdGlvbiB8IHN0cmluZyA9ICdob3Jpem9udGFsJztcbiAgQE91dHB1dCgpIHdhc0NoZWNrZWQgPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgQE9wdGlvbmFsKCkgcHJvdGVjdGVkIG92ZXJyaWRlIGZvcm1Hcm91cERpcmVjdGl2ZTogRm9ybUdyb3VwRGlyZWN0aXZlLFxuICAgIHByaXZhdGUgcmVhZG9ubHkgZGVzdHJveVJlZjogRGVzdHJveVJlZlxuICApIHtcbiAgICBzdXBlcihmb3JtR3JvdXBEaXJlY3RpdmUpO1xuICB9XG5cbiAgdG9nZ2xlKCkge1xuICAgIHRoaXMuY2hlY2tlZCA9ICF0aGlzLmNoZWNrZWQ7XG4gICAgdGhpcy50cmlnZ2VyQ2hhbmdlKHRoaXMuY2hlY2tlZCk7XG4gICAgdGhpcy53YXNDaGVja2VkLmVtaXQodGhpcy5jaGVja2VkKTtcbiAgfVxuXG4gIHdyaXRlVmFsdWUodmFsdWU6IGFueSkge1xuICAgIHRoaXMudHJpZ2dlck1hcmtDaGVjaygpO1xuICAgIHRoaXMuY2hlY2tlZCA9IHZhbHVlID09PSB0aGlzLnZhbHVlO1xuICB9XG59XG4iLCI8ZGl2XG4gIGNsYXNzPVwiZmxleCBmbGV4LXJvdyBnYXAtNFwiXG4gIFtjbGFzcy5pdGVtcy1jZW50ZXJdPVwiZGlzcG9zaXRpb24gPT09ICdob3Jpem9udGFsJ1wiXG4gIFtjbGFzcy5mbGV4LWNvbF09XCJkaXNwb3NpdGlvbiA9PT0gJ3ZlcnRpY2FsJ1wiPlxuICA8Y3QtZm9ybS1sYWJlbCBjbGFzcz1cInctZnVsbFwiIFt0ZXh0XT1cImxhYmVsXCIgW2hhc0Vycm9yXT1cImhhc0Vycm9ycyhmb3JtQ29udHJvbCkgJiYgc2hvd0Vycm9yXCIgLz5cbiAgPGxhYmVsIGNsYXNzPVwiaW5saW5lLWZsZXggY3Vyc29yLXBvaW50ZXJcIj5cbiAgICA8aW5wdXQgdHlwZT1cImNoZWNrYm94XCIgW3ZhbHVlXT1cInZhbHVlXCIgW2NoZWNrZWRdPVwiY2hlY2tlZFwiIGNsYXNzPVwicGVlciBzci1vbmx5XCIgKGNoYW5nZSk9XCJ0b2dnbGUoKVwiIC8+XG4gICAgPGRpdlxuICAgICAgdGFiaW5kZXg9XCIwXCJcbiAgICAgIGNsYXNzPVwicGVlciByZWxhdGl2ZSBoLTYgdy0xMSByb3VuZGVkLWZ1bGwgYmctc3VyZmFjZS12YXJpYW50IGFmdGVyOmFic29sdXRlIGFmdGVyOnN0YXJ0LVsycHhdIGFmdGVyOnRvcC1bMnB4XSBhZnRlcjpzaXplLTUgYWZ0ZXI6cm91bmRlZC1mdWxsIGFmdGVyOmJvcmRlciBhZnRlcjpib3JkZXItdHJhbnNwYXJlbnQgYWZ0ZXI6YmctbmV1dHJhbC01MCBhZnRlcjp0cmFuc2l0aW9uLWFsbCBhZnRlcjpjb250ZW50LVsnJ10gcGVlci1jaGVja2VkOmJnLXByaW1hcnkgcGVlci1jaGVja2VkOmFmdGVyOnRyYW5zbGF0ZS14LWZ1bGwgcGVlci1jaGVja2VkOmFmdGVyOmJvcmRlci13aGl0ZSBwZWVyLWZvY3VzOm91dGxpbmUtbm9uZSBydGw6cGVlci1jaGVja2VkOmFmdGVyOi10cmFuc2xhdGUteC1mdWxsIGRhcms6Ymctc3VyZmFjZS12YXJpYW50LWRhcmsgZGFyazphZnRlcjpiZy1uZXV0cmFsLTQwMCBkYXJrOnBlZXItY2hlY2tlZDpiZy1wcmltYXJ5LWRhcmtcIj48L2Rpdj5cbiAgPC9sYWJlbD5cbjwvZGl2PlxuIl19