@crediblefinance/credible-ui/esm2022/lib/cf-toggle/cf-toggle.component.mjs

Credible's standard UI library

import { Component, EventEmitter, Input, Output } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/material/tooltip";
import * as i2 from "@angular/material/slide-toggle";
export class CfToggleComponent {
    checked = false;
    tooltip = '';
    theme = 'dark';
    change = new EventEmitter();
    constructor() { }
    changeHandler($event) {
        this.change.emit($event.checked);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: CfToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: CfToggleComponent, selector: "cf-toggle", inputs: { checked: "checked", tooltip: "tooltip", theme: "theme" }, outputs: { change: "change" }, ngImport: i0, template: "<div class=\"cf-toggle\">\n    <mat-slide-toggle\n        (change)=\"changeHandler($event)\"\n        [checked]=\"checked\"\n        [matTooltip]=\"tooltip\"\n    ></mat-slide-toggle>\n</div>\n", styles: [".cf-toggle{width:min-content;margin:auto}::ng-deep .cf-toggle .mdc-switch:enabled .mdc-switch__track:after{background-color:#ccff00b3}::ng-deep .cf-toggle .mat-slide-toggle.mat-checked .mat-slide-toggle-bar{background-color:#cf0}::ng-deep .cf-toggle .mat-slide-toggle.mat-checked .mat-slide-toggle-thumb{background-color:#cf0}::ng-deep .cf-toggle .mdc-switch.mdc-switch--selected:enabled .mdc-switch__icon{fill:#000}::ng-deep .cf-toggle .mdc-switch:enabled .mdc-switch__track:after:hover{background-color:#cf0}::ng-deep .mat-mdc-slide-toggle.mat-mdc-slide-toggle-checked:not(.mat-disabled) .mdc-switch__shadow{background-color:#cf0}::ng-deep .mat-mdc-slide-toggle.mat-mdc-slide-toggle-checked:not(.mat-disabled) .mdc-switch__track:after{background-color:#ccff00b3!important}\n"], dependencies: [{ kind: "directive", type: i1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked", "hideIcon"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: CfToggleComponent, decorators: [{
            type: Component,
            args: [{ selector: 'cf-toggle', template: "<div class=\"cf-toggle\">\n    <mat-slide-toggle\n        (change)=\"changeHandler($event)\"\n        [checked]=\"checked\"\n        [matTooltip]=\"tooltip\"\n    ></mat-slide-toggle>\n</div>\n", styles: [".cf-toggle{width:min-content;margin:auto}::ng-deep .cf-toggle .mdc-switch:enabled .mdc-switch__track:after{background-color:#ccff00b3}::ng-deep .cf-toggle .mat-slide-toggle.mat-checked .mat-slide-toggle-bar{background-color:#cf0}::ng-deep .cf-toggle .mat-slide-toggle.mat-checked .mat-slide-toggle-thumb{background-color:#cf0}::ng-deep .cf-toggle .mdc-switch.mdc-switch--selected:enabled .mdc-switch__icon{fill:#000}::ng-deep .cf-toggle .mdc-switch:enabled .mdc-switch__track:after:hover{background-color:#cf0}::ng-deep .mat-mdc-slide-toggle.mat-mdc-slide-toggle-checked:not(.mat-disabled) .mdc-switch__shadow{background-color:#cf0}::ng-deep .mat-mdc-slide-toggle.mat-mdc-slide-toggle-checked:not(.mat-disabled) .mdc-switch__track:after{background-color:#ccff00b3!important}\n"] }]
        }], ctorParameters: () => [], propDecorators: { checked: [{
                type: Input
            }], tooltip: [{
                type: Input
            }], theme: [{
                type: Input
            }], change: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2YtdG9nZ2xlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NyZWRpYmxlLXVpL3NyYy9saWIvY2YtdG9nZ2xlL2NmLXRvZ2dsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jcmVkaWJsZS11aS9zcmMvbGliL2NmLXRvZ2dsZS9jZi10b2dnbGUuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNILFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFDekMsTUFBTSxlQUFlLENBQUM7Ozs7QUFPdkIsTUFBTSxPQUFPLGlCQUFpQjtJQUNqQixPQUFPLEdBQUcsS0FBSyxDQUFDO0lBQ2hCLE9BQU8sR0FBRyxFQUFFLENBQUM7SUFDYixLQUFLLEdBQVcsTUFBTSxDQUFDO0lBRXRCLE1BQU0sR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO0lBRS9DLGdCQUFnQixDQUFDO0lBRWpCLGFBQWEsQ0FBQyxNQUFXO1FBQ3JCLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUNyQyxDQUFDO3VHQVhRLGlCQUFpQjsyRkFBakIsaUJBQWlCLG9KQ1Q5QixtTUFPQTs7MkZERWEsaUJBQWlCO2tCQUw3QixTQUFTOytCQUNJLFdBQVc7d0RBS1osT0FBTztzQkFBZixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBRUksTUFBTTtzQkFBZixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgICBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdjZi10b2dnbGUnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9jZi10b2dnbGUuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL2NmLXRvZ2dsZS5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIENmVG9nZ2xlQ29tcG9uZW50IHtcbiAgICBASW5wdXQoKSBjaGVja2VkID0gZmFsc2U7XG4gICAgQElucHV0KCkgdG9vbHRpcCA9ICcnO1xuICAgIEBJbnB1dCgpIHRoZW1lOiBzdHJpbmcgPSAnZGFyayc7XG5cbiAgICBAT3V0cHV0KCkgY2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xuXG4gICAgY29uc3RydWN0b3IoKSB7IH1cblxuICAgIGNoYW5nZUhhbmRsZXIoJGV2ZW50OiBhbnkpIHtcbiAgICAgICAgdGhpcy5jaGFuZ2UuZW1pdCgkZXZlbnQuY2hlY2tlZCk7XG4gICAgfVxufVxuIiwiPGRpdiBjbGFzcz1cImNmLXRvZ2dsZVwiPlxuICAgIDxtYXQtc2xpZGUtdG9nZ2xlXG4gICAgICAgIChjaGFuZ2UpPVwiY2hhbmdlSGFuZGxlcigkZXZlbnQpXCJcbiAgICAgICAgW2NoZWNrZWRdPVwiY2hlY2tlZFwiXG4gICAgICAgIFttYXRUb29sdGlwXT1cInRvb2x0aXBcIlxuICAgID48L21hdC1zbGlkZS10b2dnbGU+XG48L2Rpdj5cbiJdfQ==