myrta-ui 1.0.98 → 1.0.99
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -57,7 +57,7 @@ SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
|
|
|
57
57
|
useExisting: forwardRef(() => SwitchComponent),
|
|
58
58
|
multi: true,
|
|
59
59
|
},
|
|
60
|
-
], ngImport: i0, template: "<div class=\"mrx-switch\" [class]=\"getClasses\">\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"switch\"></mrx-save-state>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <p\r\n class=\"mr-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(false)\"\r\n >\r\n {{ leftText }}\r\n </p>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n </label>\r\n <p\r\n class=\"ml-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(true)\"\r\n >\r\n {{ rightText }}\r\n </p>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n\r\n <p
|
|
60
|
+
], ngImport: i0, template: "<div class=\"mrx-switch\" [class]=\"getClasses\">\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"switch\"></mrx-save-state>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <p\r\n class=\"mr-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(false)\"\r\n >\r\n {{ leftText }}\r\n </p>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n </label>\r\n <p\r\n class=\"ml-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(true)\"\r\n >\r\n {{ rightText }}\r\n </p>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n\r\n <p class=\"ml-2\" [class]=\"boldLabel ? 'mrx-switch__label--bold' : 'mrx-switch__label'\">\r\n {{label}}\r\n <ng-content></ng-content>\r\n </p>\r\n </label>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: [".mrx-switch.mrx-switch{display:flex;position:relative}.mrx-switch.mrx-switch .mrx-switch-checkbox{position:relative}.mrx-switch.mrx-switch .mrx-switch-checkbox input{opacity:0;width:0;height:0;position:absolute!important;padding:0;margin:0}.mrx-switch.mrx-switch .mrx-switch-checkbox .mrx-switch-slider{cursor:pointer;background-color:var(--neutral-bg-stroke-default);transition:.2s}.mrx-switch.mrx-switch .mrx-switch-checkbox .mrx-switch-slider:before{position:absolute;content:\"\";background-color:var(--brand-bg-tertiary-default);transition:.2s;border-radius:50%}.mrx-switch.mrx-switch .mrx-switch-checkbox input:hover:not(:disabled)+.mrx-switch-slider{background-color:var(--neutral-bg-stroke-hover)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked:not(:disabled)+.mrx-switch-slider{background-color:var(--brand-bg-primary-default)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked:hover:not(:disabled)+.mrx-switch-slider{background-color:var(--brand-bg-primary-hover)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-3))}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:not(:checked)+.mrx-switch-slider{background-color:var(--neutral-control-bg-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:not(:checked)+.mrx-switch-slider:before{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:checked+.mrx-switch-slider{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:checked+.mrx-switch-slider:before{background-color:var(--brand-bg-tertiary-default)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled+.mrx-switch-slider{cursor:default}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox .mrx-switch-slider{display:block;position:relative;border-radius:calc(var(--sizing-module) * 5);width:var(--sizing-8);min-width:var(--sizing-8);height:calc(var(--sizing-module) * 5)}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox .mrx-switch-slider:before{width:var(--sizing-4);height:var(--sizing-4);left:var(--spacing-helf);top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-3))}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox .mrx-switch-slider{display:block;position:relative;border-radius:20px;height:var(--sizing-4);width:var(--sizing-6);min-width:var(--sizing-6);margin-top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox .mrx-switch-slider:before{width:var(--sizing-3);height:var(--sizing-3);left:var(--spacing-helf);top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-2))}.mrx-switch.mrx-switch.mrx-switch-default .mrx-switch-checkbox{display:inline-flex;align-items:flex-start}.mrx-switch.mrx-switch.mrx-switch-toggle .mrx-switch-checkbox{display:inline-flex;align-items:center}.mrx-switch.mrx-switch.mrx-switch-toggle .mrx-switch__trigger{white-space:nowrap}.mrx-switch.mrx-switch .mrx-switch__label{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:400;line-height:var(--body-md-line-height)}.mrx-switch.mrx-switch .mrx-switch__label--bold{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:700;line-height:var(--body-md-line-height)}.mrx-switch.mrx-switch .required-active{font-family:var(--body-md-bold-font-family);font-size:var(--body-md-bold-font-size);font-weight:var(--body-md-bold-font-weight);line-height:var(--body-md-bold-line-height);color:var(--system-icon-negative);margin-left:var(--spacing-1);position:relative;display:inline-block}\n"], components: [{ type: i1.SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }], directives: [{ type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3.CheckboxRequiredValidator, selector: "input[type=checkbox][required][formControlName],input[type=checkbox][required][formControl],input[type=checkbox][required][ngModel]" }, { type: i3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
61
61
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SwitchComponent, decorators: [{
|
|
62
62
|
type: Component,
|
|
63
63
|
args: [{ selector: 'mrx-switch', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
@@ -66,7 +66,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
66
66
|
useExisting: forwardRef(() => SwitchComponent),
|
|
67
67
|
multi: true,
|
|
68
68
|
},
|
|
69
|
-
], template: "<div class=\"mrx-switch\" [class]=\"getClasses\">\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"switch\"></mrx-save-state>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <p\r\n class=\"mr-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(false)\"\r\n >\r\n {{ leftText }}\r\n </p>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n </label>\r\n <p\r\n class=\"ml-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(true)\"\r\n >\r\n {{ rightText }}\r\n </p>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n\r\n <p
|
|
69
|
+
], template: "<div class=\"mrx-switch\" [class]=\"getClasses\">\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"switch\"></mrx-save-state>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <p\r\n class=\"mr-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(false)\"\r\n >\r\n {{ leftText }}\r\n </p>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n </label>\r\n <p\r\n class=\"ml-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(true)\"\r\n >\r\n {{ rightText }}\r\n </p>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n\r\n <p class=\"ml-2\" [class]=\"boldLabel ? 'mrx-switch__label--bold' : 'mrx-switch__label'\">\r\n {{label}}\r\n <ng-content></ng-content>\r\n </p>\r\n </label>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: [".mrx-switch.mrx-switch{display:flex;position:relative}.mrx-switch.mrx-switch .mrx-switch-checkbox{position:relative}.mrx-switch.mrx-switch .mrx-switch-checkbox input{opacity:0;width:0;height:0;position:absolute!important;padding:0;margin:0}.mrx-switch.mrx-switch .mrx-switch-checkbox .mrx-switch-slider{cursor:pointer;background-color:var(--neutral-bg-stroke-default);transition:.2s}.mrx-switch.mrx-switch .mrx-switch-checkbox .mrx-switch-slider:before{position:absolute;content:\"\";background-color:var(--brand-bg-tertiary-default);transition:.2s;border-radius:50%}.mrx-switch.mrx-switch .mrx-switch-checkbox input:hover:not(:disabled)+.mrx-switch-slider{background-color:var(--neutral-bg-stroke-hover)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked:not(:disabled)+.mrx-switch-slider{background-color:var(--brand-bg-primary-default)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked:hover:not(:disabled)+.mrx-switch-slider{background-color:var(--brand-bg-primary-hover)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-3))}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:not(:checked)+.mrx-switch-slider{background-color:var(--neutral-control-bg-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:not(:checked)+.mrx-switch-slider:before{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:checked+.mrx-switch-slider{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:checked+.mrx-switch-slider:before{background-color:var(--brand-bg-tertiary-default)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled+.mrx-switch-slider{cursor:default}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox .mrx-switch-slider{display:block;position:relative;border-radius:calc(var(--sizing-module) * 5);width:var(--sizing-8);min-width:var(--sizing-8);height:calc(var(--sizing-module) * 5)}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox .mrx-switch-slider:before{width:var(--sizing-4);height:var(--sizing-4);left:var(--spacing-helf);top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-3))}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox .mrx-switch-slider{display:block;position:relative;border-radius:20px;height:var(--sizing-4);width:var(--sizing-6);min-width:var(--sizing-6);margin-top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox .mrx-switch-slider:before{width:var(--sizing-3);height:var(--sizing-3);left:var(--spacing-helf);top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-2))}.mrx-switch.mrx-switch.mrx-switch-default .mrx-switch-checkbox{display:inline-flex;align-items:flex-start}.mrx-switch.mrx-switch.mrx-switch-toggle .mrx-switch-checkbox{display:inline-flex;align-items:center}.mrx-switch.mrx-switch.mrx-switch-toggle .mrx-switch__trigger{white-space:nowrap}.mrx-switch.mrx-switch .mrx-switch__label{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:400;line-height:var(--body-md-line-height)}.mrx-switch.mrx-switch .mrx-switch__label--bold{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:700;line-height:var(--body-md-line-height)}.mrx-switch.mrx-switch .required-active{font-family:var(--body-md-bold-font-family);font-size:var(--body-md-bold-font-size);font-weight:var(--body-md-bold-font-weight);line-height:var(--body-md-bold-line-height);color:var(--system-icon-negative);margin-left:var(--spacing-1);position:relative;display:inline-block}\n"] }]
|
|
70
70
|
}], propDecorators: { fields: [{
|
|
71
71
|
type: Input
|
|
72
72
|
}], size: [{
|
|
@@ -94,4 +94,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
94
94
|
}], modelChange: [{
|
|
95
95
|
type: Output
|
|
96
96
|
}] } });
|
|
97
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
97
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3dpdGNoLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL215cnRhLXVpL3NyYy9saWIvY29tcG9uZW50cy9mb3JtL3N3aXRjaC9zd2l0Y2guY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbXlydGEtdWkvc3JjL2xpYi9jb21wb25lbnRzL2Zvcm0vc3dpdGNoL3N3aXRjaC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxZQUFZLEVBQ1osVUFBVSxFQUNWLEtBQUssRUFDTCxNQUFNLEdBQ1AsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUF3QixpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ3pFLE9BQU8sRUFDTCxjQUFjLEVBRWQsY0FBYyxFQUlmLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxFQUFFLElBQUksTUFBTSxFQUFFLE1BQU0sTUFBTSxDQUFDOzs7OztBQWdCcEMsTUFBTSxPQUFPLGVBQWU7SUFiNUI7UUFjUyxVQUFLLEdBQXFCLEtBQUssQ0FBQztRQUV2QyxhQUFhO1FBQ04sU0FBSSxHQUFXLE1BQU0sRUFBRSxDQUFBO1FBQ2QsV0FBTSxHQUFZLEVBQUUsQ0FBQztRQUVyQixTQUFJLEdBQW9CLE9BQU8sQ0FBQztRQUNoQyxTQUFJLEdBQW9CLFNBQVMsQ0FBQztRQUNsQyxVQUFLLEdBQUcsRUFBRSxDQUFDO1FBQ1gsY0FBUyxHQUFHLEtBQUssQ0FBQztRQUNsQixhQUFRLEdBQUcsS0FBSyxDQUFDO1FBQ2pCLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFDakIsYUFBUSxHQUFHLEtBQUssQ0FBQztRQUNqQixrQkFBYSxHQUFHLEVBQUUsQ0FBQztRQUNuQixhQUFRLEdBQUcsV0FBVyxDQUFDO1FBQ3ZCLGNBQVMsR0FBRyxVQUFVLENBQUM7UUFFdEIsWUFBTyxHQUFtQyxJQUFJLFlBQVksRUFBb0IsQ0FBQztRQUMvRSxnQkFBVyxHQUFvQyxJQUFJLFlBQVksRUFBcUIsQ0FBQztRQU05RixhQUFRLEdBQUcsQ0FBQyxLQUF1QixFQUFFLEVBQUUsR0FBRSxDQUFDLENBQUM7UUFDM0MsY0FBUyxHQUFHLEdBQUcsRUFBRSxHQUFFLENBQUMsQ0FBQztLQXlCOUI7SUE5QkMsSUFBVyxVQUFVO1FBQ25CLE9BQU8sR0FBRyxjQUFjLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLGNBQWMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO0lBQzNGLENBQUM7SUFLTSxnQkFBZ0IsQ0FBQyxFQUFPO1FBQzdCLElBQUksQ0FBQyxRQUFRLEdBQUcsRUFBRSxDQUFDO0lBQ3JCLENBQUM7SUFFTSxpQkFBaUIsQ0FBQyxFQUFZO1FBQ25DLElBQUksQ0FBQyxTQUFTLEdBQUcsRUFBRSxDQUFDO0lBQ3RCLENBQUM7SUFFTSxVQUFVLENBQUMsWUFBOEI7UUFDOUMsSUFBSSxDQUFDLEtBQUssR0FBRyxZQUFZLENBQUM7SUFDNUIsQ0FBQztJQUVNLGdCQUFnQixDQUFDLFVBQW1CO1FBQ3pDLDhCQUE4QjtJQUNoQyxDQUFDO0lBRU0sV0FBVyxDQUFDLFdBQTZCO1FBQzlDLElBQUksQ0FBQyxLQUFLLEdBQUcsV0FBVyxDQUFDO1FBQ3pCLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBQy9CLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLEVBQUMsS0FBSyxFQUFFLFdBQVcsRUFBRSxFQUFFLEVBQUUsSUFBSSxDQUFDLElBQUksRUFBQyxDQUFDLENBQUE7UUFDMUQsSUFBSSxDQUFDLFFBQVEsQ0FBQyxXQUFXLENBQUMsQ0FBQztRQUMzQixJQUFJLENBQUMsU0FBUyxFQUFFLENBQUM7SUFDbkIsQ0FBQzs7NEdBbERVLGVBQWU7Z0dBQWYsZUFBZSxvVkFSZjtRQUNUO1lBQ0UsT0FBTyxFQUFFLGlCQUFpQjtZQUMxQixXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLGVBQWUsQ0FBQztZQUM5QyxLQUFLLEVBQUUsSUFBSTtTQUNaO0tBQ0YsMEJDL0JILG13REFxREE7MkZEcEJhLGVBQWU7a0JBYjNCLFNBQVM7K0JBQ0UsWUFBWSxtQkFHTCx1QkFBdUIsQ0FBQyxNQUFNLGFBQ3BDO3dCQUNUOzRCQUNFLE9BQU8sRUFBRSxpQkFBaUI7NEJBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLGdCQUFnQixDQUFDOzRCQUM5QyxLQUFLLEVBQUUsSUFBSTt5QkFDWjtxQkFDRjs4QkFPZSxNQUFNO3NCQUFyQixLQUFLO2dCQUVVLElBQUk7c0JBQW5CLEtBQUs7Z0JBQ1UsSUFBSTtzQkFBbkIsS0FBSztnQkFDVSxLQUFLO3NCQUFwQixLQUFLO2dCQUNVLFNBQVM7c0JBQXhCLEtBQUs7Z0JBQ1UsUUFBUTtzQkFBdkIsS0FBSztnQkFDVSxRQUFRO3NCQUF2QixLQUFLO2dCQUNVLFFBQVE7c0JBQXZCLEtBQUs7Z0JBQ1UsYUFBYTtzQkFBNUIsS0FBSztnQkFDVSxRQUFRO3NCQUF2QixLQUFLO2dCQUNVLFNBQVM7c0JBQXhCLEtBQUs7Z0JBRVcsT0FBTztzQkFBdkIsTUFBTTtnQkFDVSxXQUFXO3NCQUEzQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcclxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcclxuICBDb21wb25lbnQsXHJcbiAgRXZlbnRFbWl0dGVyLFxyXG4gIGZvcndhcmRSZWYsXHJcbiAgSW5wdXQsXHJcbiAgT3V0cHV0LFxyXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBDb250cm9sVmFsdWVBY2Nlc3NvciwgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XHJcbmltcG9ydCB7XHJcbiAgU3dpdGNoU2l6ZUVudW0sXHJcbiAgU3dpdGNoU2l6ZVR5cGVzLFxyXG4gIFN3aXRjaFR5cGVFbnVtLFxyXG4gIFN3aXRjaFR5cGVUeXBlcyxcclxuICBTd2l0Y2hWYWx1ZVR5cGVzLFxyXG4gIFN3aXRjaFZhbHVlV2l0aElkXHJcbn0gZnJvbSAnLi9zd2l0Y2guZW51bSc7XHJcbmltcG9ydCB7IHY0IGFzIHV1aWR2NCB9IGZyb20gJ3V1aWQnO1xyXG5pbXBvcnQgeyBGaWVsZCB9IGZyb20gJy4uLy4uLy4uL3NlcnZpY2VzL21yeC1hdXRvc2F2ZS9tcngtYXV0b3NhdmUuc2VydmljZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ21yeC1zd2l0Y2gnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9zd2l0Y2guY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3N3aXRjaC5jb21wb25lbnQubGVzcyddLFxyXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxyXG4gIHByb3ZpZGVyczogW1xyXG4gICAge1xyXG4gICAgICBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUixcclxuICAgICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gU3dpdGNoQ29tcG9uZW50KSxcclxuICAgICAgbXVsdGk6IHRydWUsXHJcbiAgICB9LFxyXG4gIF0sXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBTd2l0Y2hDb21wb25lbnQgaW1wbGVtZW50cyBDb250cm9sVmFsdWVBY2Nlc3NvciB7XHJcbiAgcHVibGljIHZhbHVlOiBTd2l0Y2hWYWx1ZVR5cGVzID0gZmFsc2U7XHJcblxyXG4gIC8vIFNBVkUgU1RBVEVcclxuICBwdWJsaWMgdXVpZDogc3RyaW5nID0gdXVpZHY0KClcclxuICBASW5wdXQoKSBwdWJsaWMgZmllbGRzOiBGaWVsZFtdID0gW107XHJcblxyXG4gIEBJbnB1dCgpIHB1YmxpYyBzaXplOiBTd2l0Y2hTaXplVHlwZXMgPSAnbGFyZ2UnO1xyXG4gIEBJbnB1dCgpIHB1YmxpYyB0eXBlOiBTd2l0Y2hUeXBlVHlwZXMgPSAnZGVmYXVsdCc7XHJcbiAgQElucHV0KCkgcHVibGljIGxhYmVsID0gJyc7XHJcbiAgQElucHV0KCkgcHVibGljIGJvbGRMYWJlbCA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIHB1YmxpYyBkaXNhYmxlZCA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIHB1YmxpYyByZWFkb25seSA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIHB1YmxpYyByZXF1aXJlZCA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIHB1YmxpYyBjdXN0b21DbGFzc2VzID0gJyc7XHJcbiAgQElucHV0KCkgcHVibGljIGxlZnRUZXh0ID0gJ9Ce0YLQutC70Y7Rh9C40YLRjCc7XHJcbiAgQElucHV0KCkgcHVibGljIHJpZ2h0VGV4dCA9ICfQktC60LvRjtGH0LjRgtGMJztcclxuXHJcbiAgQE91dHB1dCgpIHB1YmxpYyBjaGFuZ2VkOiBFdmVudEVtaXR0ZXI8U3dpdGNoVmFsdWVUeXBlcz4gPSBuZXcgRXZlbnRFbWl0dGVyPFN3aXRjaFZhbHVlVHlwZXM+KCk7XHJcbiAgQE91dHB1dCgpIHB1YmxpYyBtb2RlbENoYW5nZTogRXZlbnRFbWl0dGVyPFN3aXRjaFZhbHVlV2l0aElkPiA9IG5ldyBFdmVudEVtaXR0ZXI8U3dpdGNoVmFsdWVXaXRoSWQ+KCk7XHJcblxyXG4gIHB1YmxpYyBnZXQgZ2V0Q2xhc3NlcygpOiBzdHJpbmcge1xyXG4gICAgcmV0dXJuIGAke1N3aXRjaFNpemVFbnVtW3RoaXMuc2l6ZV19ICR7U3dpdGNoVHlwZUVudW1bdGhpcy50eXBlXX0gJHt0aGlzLmN1c3RvbUNsYXNzZXN9YDtcclxuICB9XHJcblxyXG4gIHByaXZhdGUgb25DaGFuZ2UgPSAodmFsdWU6IFN3aXRjaFZhbHVlVHlwZXMpID0+IHt9O1xyXG4gIHByaXZhdGUgb25Ub3VjaGVkID0gKCkgPT4ge307XHJcblxyXG4gIHB1YmxpYyByZWdpc3Rlck9uQ2hhbmdlKGZuOiBhbnkpIHtcclxuICAgIHRoaXMub25DaGFuZ2UgPSBmbjtcclxuICB9XHJcblxyXG4gIHB1YmxpYyByZWdpc3Rlck9uVG91Y2hlZChmbjogKCkgPT4ge30pOiB2b2lkIHtcclxuICAgIHRoaXMub25Ub3VjaGVkID0gZm47XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgd3JpdGVWYWx1ZShvdXRzaWRlVmFsdWU6IFN3aXRjaFZhbHVlVHlwZXMpIHtcclxuICAgIHRoaXMudmFsdWUgPSBvdXRzaWRlVmFsdWU7XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgc2V0RGlzYWJsZWRTdGF0ZShpc0Rpc2FibGVkOiBib29sZWFuKSB7XHJcbiAgICAvLyB0aGlzLmRpc2FibGVkID0gaXNEaXNhYmxlZDtcclxuICB9XHJcblxyXG4gIHB1YmxpYyB1cGRhdGVWYWx1ZShpbnNpZGVWYWx1ZTogU3dpdGNoVmFsdWVUeXBlcykge1xyXG4gICAgdGhpcy52YWx1ZSA9IGluc2lkZVZhbHVlO1xyXG4gICAgdGhpcy5jaGFuZ2VkLmVtaXQoaW5zaWRlVmFsdWUpO1xyXG4gICAgdGhpcy5tb2RlbENoYW5nZS5lbWl0KHt2YWx1ZTogaW5zaWRlVmFsdWUsIGlkOiB0aGlzLnV1aWR9KVxyXG4gICAgdGhpcy5vbkNoYW5nZShpbnNpZGVWYWx1ZSk7XHJcbiAgICB0aGlzLm9uVG91Y2hlZCgpO1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwibXJ4LXN3aXRjaFwiIFtjbGFzc109XCJnZXRDbGFzc2VzXCI+XHJcbiAgPG1yeC1zYXZlLXN0YXRlIFtpZF09XCJ1dWlkXCIgW2ZpZWxkc109XCJmaWVsZHNcIiB0eXBlPVwic3dpdGNoXCI+PC9tcngtc2F2ZS1zdGF0ZT5cclxuXHJcbiAgPG5nLWNvbnRhaW5lciBbbmdTd2l0Y2hdPVwidHlwZVwiPlxyXG5cclxuICAgIDxuZy1jb250YWluZXIgKm5nU3dpdGNoQ2FzZT1cIid0b2dnbGUnXCI+XHJcbiAgICAgIDxwXHJcbiAgICAgICAgY2xhc3M9XCJtci0xIGN1cnNvci1wb2ludGVyIG1yeC1zd2l0Y2hfX3RyaWdnZXJcIlxyXG4gICAgICAgIFtjbGFzcy50ZXh0LWJvbGRdPVwiYm9sZExhYmVsXCJcclxuICAgICAgICAoY2xpY2spPVwiIShkaXNhYmxlZCB8fCByZWFkb25seSkgJiYgdXBkYXRlVmFsdWUoZmFsc2UpXCJcclxuICAgICAgPlxyXG4gICAgICAgIHt7IGxlZnRUZXh0IH19XHJcbiAgICAgIDwvcD5cclxuICAgICAgPGxhYmVsIGNsYXNzPVwibXJ4LXN3aXRjaC1jaGVja2JveFwiPlxyXG4gICAgICAgIDxpbnB1dFxyXG4gICAgICAgICAgdHlwZT1cImNoZWNrYm94XCJcclxuICAgICAgICAgIFtyZXF1aXJlZF09XCJyZXF1aXJlZFwiXHJcbiAgICAgICAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWQgfHwgcmVhZG9ubHlcIlxyXG4gICAgICAgICAgW3JlYWRPbmx5XT1cInJlYWRvbmx5XCJcclxuICAgICAgICAgIFtuZ01vZGVsXT1cInZhbHVlXCJcclxuICAgICAgICAgIChuZ01vZGVsQ2hhbmdlKT1cInVwZGF0ZVZhbHVlKCRldmVudClcIlxyXG4gICAgICAgID5cclxuICAgICAgICA8c3BhbiBjbGFzcz1cIm1yeC1zd2l0Y2gtc2xpZGVyXCI+PC9zcGFuPlxyXG4gICAgICA8L2xhYmVsPlxyXG4gICAgICA8cFxyXG4gICAgICAgIGNsYXNzPVwibWwtMSBjdXJzb3ItcG9pbnRlciBtcngtc3dpdGNoX190cmlnZ2VyXCJcclxuICAgICAgICBbY2xhc3MudGV4dC1ib2xkXT1cImJvbGRMYWJlbFwiXHJcbiAgICAgICAgKGNsaWNrKT1cIiEoZGlzYWJsZWQgfHwgcmVhZG9ubHkpICYmIHVwZGF0ZVZhbHVlKHRydWUpXCJcclxuICAgICAgPlxyXG4gICAgICAgIHt7IHJpZ2h0VGV4dCB9fVxyXG4gICAgICA8L3A+XHJcbiAgICA8L25nLWNvbnRhaW5lcj5cclxuXHJcbiAgICA8bmctY29udGFpbmVyICpuZ1N3aXRjaERlZmF1bHQ+XHJcbiAgICAgIDxsYWJlbCBjbGFzcz1cIm1yeC1zd2l0Y2gtY2hlY2tib3hcIj5cclxuICAgICAgICA8aW5wdXRcclxuICAgICAgICAgIHR5cGU9XCJjaGVja2JveFwiXHJcbiAgICAgICAgICBbcmVxdWlyZWRdPVwicmVxdWlyZWRcIlxyXG4gICAgICAgICAgW2Rpc2FibGVkXT1cImRpc2FibGVkIHx8IHJlYWRvbmx5XCJcclxuICAgICAgICAgIFtyZWFkT25seV09XCJyZWFkb25seVwiXHJcbiAgICAgICAgICBbbmdNb2RlbF09XCJ2YWx1ZVwiXHJcbiAgICAgICAgICAobmdNb2RlbENoYW5nZSk9XCJ1cGRhdGVWYWx1ZSgkZXZlbnQpXCJcclxuICAgICAgICA+XHJcbiAgICAgICAgPHNwYW4gY2xhc3M9XCJtcngtc3dpdGNoLXNsaWRlclwiPjwvc3Bhbj5cclxuXHJcbiAgICAgICAgPHAgY2xhc3M9XCJtbC0yXCIgW2NsYXNzXT1cImJvbGRMYWJlbCA/ICdtcngtc3dpdGNoX19sYWJlbC0tYm9sZCcgOiAnbXJ4LXN3aXRjaF9fbGFiZWwnXCI+XHJcbiAgICAgICAgICB7e2xhYmVsfX1cclxuICAgICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cclxuICAgICAgICA8L3A+XHJcbiAgICAgIDwvbGFiZWw+XHJcbiAgICA8L25nLWNvbnRhaW5lcj5cclxuICA8L25nLWNvbnRhaW5lcj5cclxuPC9kaXY+XHJcbiJdfQ==
|
package/fesm2015/myrta-ui.mjs
CHANGED
|
@@ -894,7 +894,7 @@ SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
|
|
|
894
894
|
useExisting: forwardRef(() => SwitchComponent),
|
|
895
895
|
multi: true,
|
|
896
896
|
},
|
|
897
|
-
], ngImport: i0, template: "<div class=\"mrx-switch\" [class]=\"getClasses\">\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"switch\"></mrx-save-state>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <p\r\n class=\"mr-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(false)\"\r\n >\r\n {{ leftText }}\r\n </p>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n </label>\r\n <p\r\n class=\"ml-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(true)\"\r\n >\r\n {{ rightText }}\r\n </p>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n\r\n <p
|
|
897
|
+
], ngImport: i0, template: "<div class=\"mrx-switch\" [class]=\"getClasses\">\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"switch\"></mrx-save-state>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <p\r\n class=\"mr-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(false)\"\r\n >\r\n {{ leftText }}\r\n </p>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n </label>\r\n <p\r\n class=\"ml-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(true)\"\r\n >\r\n {{ rightText }}\r\n </p>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n\r\n <p class=\"ml-2\" [class]=\"boldLabel ? 'mrx-switch__label--bold' : 'mrx-switch__label'\">\r\n {{label}}\r\n <ng-content></ng-content>\r\n </p>\r\n </label>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: [".mrx-switch.mrx-switch{display:flex;position:relative}.mrx-switch.mrx-switch .mrx-switch-checkbox{position:relative}.mrx-switch.mrx-switch .mrx-switch-checkbox input{opacity:0;width:0;height:0;position:absolute!important;padding:0;margin:0}.mrx-switch.mrx-switch .mrx-switch-checkbox .mrx-switch-slider{cursor:pointer;background-color:var(--neutral-bg-stroke-default);transition:.2s}.mrx-switch.mrx-switch .mrx-switch-checkbox .mrx-switch-slider:before{position:absolute;content:\"\";background-color:var(--brand-bg-tertiary-default);transition:.2s;border-radius:50%}.mrx-switch.mrx-switch .mrx-switch-checkbox input:hover:not(:disabled)+.mrx-switch-slider{background-color:var(--neutral-bg-stroke-hover)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked:not(:disabled)+.mrx-switch-slider{background-color:var(--brand-bg-primary-default)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked:hover:not(:disabled)+.mrx-switch-slider{background-color:var(--brand-bg-primary-hover)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-3))}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:not(:checked)+.mrx-switch-slider{background-color:var(--neutral-control-bg-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:not(:checked)+.mrx-switch-slider:before{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:checked+.mrx-switch-slider{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:checked+.mrx-switch-slider:before{background-color:var(--brand-bg-tertiary-default)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled+.mrx-switch-slider{cursor:default}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox .mrx-switch-slider{display:block;position:relative;border-radius:calc(var(--sizing-module) * 5);width:var(--sizing-8);min-width:var(--sizing-8);height:calc(var(--sizing-module) * 5)}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox .mrx-switch-slider:before{width:var(--sizing-4);height:var(--sizing-4);left:var(--spacing-helf);top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-3))}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox .mrx-switch-slider{display:block;position:relative;border-radius:20px;height:var(--sizing-4);width:var(--sizing-6);min-width:var(--sizing-6);margin-top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox .mrx-switch-slider:before{width:var(--sizing-3);height:var(--sizing-3);left:var(--spacing-helf);top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-2))}.mrx-switch.mrx-switch.mrx-switch-default .mrx-switch-checkbox{display:inline-flex;align-items:flex-start}.mrx-switch.mrx-switch.mrx-switch-toggle .mrx-switch-checkbox{display:inline-flex;align-items:center}.mrx-switch.mrx-switch.mrx-switch-toggle .mrx-switch__trigger{white-space:nowrap}.mrx-switch.mrx-switch .mrx-switch__label{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:400;line-height:var(--body-md-line-height)}.mrx-switch.mrx-switch .mrx-switch__label--bold{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:700;line-height:var(--body-md-line-height)}.mrx-switch.mrx-switch .required-active{font-family:var(--body-md-bold-font-family);font-size:var(--body-md-bold-font-size);font-weight:var(--body-md-bold-font-weight);line-height:var(--body-md-bold-line-height);color:var(--system-icon-negative);margin-left:var(--spacing-1);position:relative;display:inline-block}\n"], components: [{ type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }], directives: [{ type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3.CheckboxRequiredValidator, selector: "input[type=checkbox][required][formControlName],input[type=checkbox][required][formControl],input[type=checkbox][required][ngModel]" }, { type: i3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
898
898
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SwitchComponent, decorators: [{
|
|
899
899
|
type: Component,
|
|
900
900
|
args: [{ selector: 'mrx-switch', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
@@ -903,7 +903,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
903
903
|
useExisting: forwardRef(() => SwitchComponent),
|
|
904
904
|
multi: true,
|
|
905
905
|
},
|
|
906
|
-
], template: "<div class=\"mrx-switch\" [class]=\"getClasses\">\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"switch\"></mrx-save-state>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <p\r\n class=\"mr-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(false)\"\r\n >\r\n {{ leftText }}\r\n </p>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n </label>\r\n <p\r\n class=\"ml-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(true)\"\r\n >\r\n {{ rightText }}\r\n </p>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n\r\n <p
|
|
906
|
+
], template: "<div class=\"mrx-switch\" [class]=\"getClasses\">\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"switch\"></mrx-save-state>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <p\r\n class=\"mr-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(false)\"\r\n >\r\n {{ leftText }}\r\n </p>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n </label>\r\n <p\r\n class=\"ml-1 cursor-pointer mrx-switch__trigger\"\r\n [class.text-bold]=\"boldLabel\"\r\n (click)=\"!(disabled || readonly) && updateValue(true)\"\r\n >\r\n {{ rightText }}\r\n </p>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <label class=\"mrx-switch-checkbox\">\r\n <input\r\n type=\"checkbox\"\r\n [required]=\"required\"\r\n [disabled]=\"disabled || readonly\"\r\n [readOnly]=\"readonly\"\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n >\r\n <span class=\"mrx-switch-slider\"></span>\r\n\r\n <p class=\"ml-2\" [class]=\"boldLabel ? 'mrx-switch__label--bold' : 'mrx-switch__label'\">\r\n {{label}}\r\n <ng-content></ng-content>\r\n </p>\r\n </label>\r\n </ng-container>\r\n </ng-container>\r\n</div>\r\n", styles: [".mrx-switch.mrx-switch{display:flex;position:relative}.mrx-switch.mrx-switch .mrx-switch-checkbox{position:relative}.mrx-switch.mrx-switch .mrx-switch-checkbox input{opacity:0;width:0;height:0;position:absolute!important;padding:0;margin:0}.mrx-switch.mrx-switch .mrx-switch-checkbox .mrx-switch-slider{cursor:pointer;background-color:var(--neutral-bg-stroke-default);transition:.2s}.mrx-switch.mrx-switch .mrx-switch-checkbox .mrx-switch-slider:before{position:absolute;content:\"\";background-color:var(--brand-bg-tertiary-default);transition:.2s;border-radius:50%}.mrx-switch.mrx-switch .mrx-switch-checkbox input:hover:not(:disabled)+.mrx-switch-slider{background-color:var(--neutral-bg-stroke-hover)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked:not(:disabled)+.mrx-switch-slider{background-color:var(--brand-bg-primary-default)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked:hover:not(:disabled)+.mrx-switch-slider{background-color:var(--brand-bg-primary-hover)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-3))}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:not(:checked)+.mrx-switch-slider{background-color:var(--neutral-control-bg-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:not(:checked)+.mrx-switch-slider:before{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:checked+.mrx-switch-slider{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled:checked+.mrx-switch-slider:before{background-color:var(--brand-bg-tertiary-default)}.mrx-switch.mrx-switch .mrx-switch-checkbox input:disabled+.mrx-switch-slider{cursor:default}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox .mrx-switch-slider{display:block;position:relative;border-radius:calc(var(--sizing-module) * 5);width:var(--sizing-8);min-width:var(--sizing-8);height:calc(var(--sizing-module) * 5)}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox .mrx-switch-slider:before{width:var(--sizing-4);height:var(--sizing-4);left:var(--spacing-helf);top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-lg .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-3))}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox .mrx-switch-slider{display:block;position:relative;border-radius:20px;height:var(--sizing-4);width:var(--sizing-6);min-width:var(--sizing-6);margin-top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox .mrx-switch-slider:before{width:var(--sizing-3);height:var(--sizing-3);left:var(--spacing-helf);top:var(--spacing-helf)}.mrx-switch.mrx-switch.mrx-switch-sm .mrx-switch-checkbox input:checked+.mrx-switch-slider:before{transform:translate(var(--sizing-2))}.mrx-switch.mrx-switch.mrx-switch-default .mrx-switch-checkbox{display:inline-flex;align-items:flex-start}.mrx-switch.mrx-switch.mrx-switch-toggle .mrx-switch-checkbox{display:inline-flex;align-items:center}.mrx-switch.mrx-switch.mrx-switch-toggle .mrx-switch__trigger{white-space:nowrap}.mrx-switch.mrx-switch .mrx-switch__label{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:400;line-height:var(--body-md-line-height)}.mrx-switch.mrx-switch .mrx-switch__label--bold{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:700;line-height:var(--body-md-line-height)}.mrx-switch.mrx-switch .required-active{font-family:var(--body-md-bold-font-family);font-size:var(--body-md-bold-font-size);font-weight:var(--body-md-bold-font-weight);line-height:var(--body-md-bold-line-height);color:var(--system-icon-negative);margin-left:var(--spacing-1);position:relative;display:inline-block}\n"] }]
|
|
907
907
|
}], propDecorators: { fields: [{
|
|
908
908
|
type: Input
|
|
909
909
|
}], size: [{
|