myrta-ui 1.1.41 → 1.1.42
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.
- package/esm2020/lib/components/form/checkbox/checkbox.component.mjs +2 -2
- package/esm2020/lib/components/form/checkbox-group/components/checkbox-group-header/checkbox-group-header.component.mjs +1 -1
- package/esm2020/lib/components/form/input-date-time/input-date-time.component.mjs +1 -1
- package/esm2020/lib/components/form/input-datepicker/input-datepicker.component.mjs +1 -1
- package/esm2020/lib/components/form/radio-group/components/radio-group-header/radio-group-header.component.mjs +1 -1
- package/esm2020/lib/components/label/label.component.mjs +20 -9
- package/esm2020/lib/components/label/label.module.mjs +30 -4
- package/fesm2015/myrta-ui.mjs +193 -158
- package/fesm2015/myrta-ui.mjs.map +1 -1
- package/fesm2020/myrta-ui.mjs +193 -158
- package/fesm2020/myrta-ui.mjs.map +1 -1
- package/lib/components/label/label.component.d.ts +6 -2
- package/lib/components/label/label.module.d.ts +2 -1
- package/package.json +1 -1
package/fesm2020/myrta-ui.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, Input, Pipe, EventEmitter, ChangeDetectionStrategy, Output, NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable, forwardRef, InjectionToken, TemplateRef, Inject, Injector, Directive, HostListener, ContentChild,
|
|
2
|
+
import { Component, Input, Pipe, EventEmitter, ChangeDetectionStrategy, Output, NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable, forwardRef, ViewChild, InjectionToken, TemplateRef, Inject, Injector, Directive, HostListener, ContentChild, QueryList, Optional, ViewChildren, ElementRef, ViewEncapsulation, ContentChildren, HostBinding, LOCALE_ID } from '@angular/core';
|
|
3
3
|
import * as i1$1 from '@angular/common';
|
|
4
4
|
import { CommonModule, registerLocaleData, DatePipe, DOCUMENT } from '@angular/common';
|
|
5
5
|
import * as i1 from '@angular/platform-browser';
|
|
@@ -992,6 +992,138 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
992
992
|
type: Output
|
|
993
993
|
}] } });
|
|
994
994
|
|
|
995
|
+
class CheckboxComponent {
|
|
996
|
+
constructor(tooltipService) {
|
|
997
|
+
this.tooltipService = tooltipService;
|
|
998
|
+
this.value = false;
|
|
999
|
+
this._tooltip = '';
|
|
1000
|
+
this._tooltipInitialVisible = false;
|
|
1001
|
+
this._isSaveToStorage = false;
|
|
1002
|
+
// SAVE STATE
|
|
1003
|
+
this.uuid = v4();
|
|
1004
|
+
this.fields = [];
|
|
1005
|
+
this.required = false;
|
|
1006
|
+
this.boldLabel = false;
|
|
1007
|
+
this.indeterminate = false;
|
|
1008
|
+
this.disabled = false;
|
|
1009
|
+
this.readonly = false;
|
|
1010
|
+
this.label = '';
|
|
1011
|
+
this.customClasses = '';
|
|
1012
|
+
this.customWrapperClasses = '';
|
|
1013
|
+
this.invalid = false;
|
|
1014
|
+
this.checkInvalid = null;
|
|
1015
|
+
this.changed = new EventEmitter();
|
|
1016
|
+
this.modelChange = new EventEmitter();
|
|
1017
|
+
this.onChange = (value) => {
|
|
1018
|
+
};
|
|
1019
|
+
this.onTouched = () => {
|
|
1020
|
+
};
|
|
1021
|
+
}
|
|
1022
|
+
set tooltip(tooltip) {
|
|
1023
|
+
this._tooltip = tooltip;
|
|
1024
|
+
this.tooltipService.setTooltip = tooltip;
|
|
1025
|
+
}
|
|
1026
|
+
set tooltipInitialVisible(value) {
|
|
1027
|
+
this._tooltipInitialVisible = value;
|
|
1028
|
+
this.tooltipService.toggleTooltipVisibleFromCode(value);
|
|
1029
|
+
}
|
|
1030
|
+
set isSaveToStorage(value) {
|
|
1031
|
+
this._isSaveToStorage = value;
|
|
1032
|
+
this.tooltipService.setSaveToStorage = value;
|
|
1033
|
+
}
|
|
1034
|
+
get getWrapperClasses() {
|
|
1035
|
+
return `${this.customWrapperClasses}`;
|
|
1036
|
+
}
|
|
1037
|
+
get getClasses() {
|
|
1038
|
+
return `${this.customClasses} ${this.checkValidClasses}`;
|
|
1039
|
+
}
|
|
1040
|
+
get checkValidClasses() {
|
|
1041
|
+
return this.checkInvalid === false ?
|
|
1042
|
+
'mrx-input-checked-success' :
|
|
1043
|
+
this.checkInvalid === true ? 'mrx-input-checked-error' : '';
|
|
1044
|
+
}
|
|
1045
|
+
registerOnChange(fn) {
|
|
1046
|
+
this.onChange = fn;
|
|
1047
|
+
}
|
|
1048
|
+
registerOnTouched(fn) {
|
|
1049
|
+
this.onTouched = fn;
|
|
1050
|
+
}
|
|
1051
|
+
writeValue(outsideValue) {
|
|
1052
|
+
this.value = outsideValue;
|
|
1053
|
+
}
|
|
1054
|
+
setDisabledState(isDisabled) {
|
|
1055
|
+
this.disabled = isDisabled;
|
|
1056
|
+
}
|
|
1057
|
+
updateValue(insideValue) {
|
|
1058
|
+
this.value = insideValue;
|
|
1059
|
+
this.changed.emit(insideValue);
|
|
1060
|
+
this.modelChange.emit({ value: insideValue, id: this.uuid });
|
|
1061
|
+
this.onChange(insideValue);
|
|
1062
|
+
this.onTouched();
|
|
1063
|
+
}
|
|
1064
|
+
ngOnInit() {
|
|
1065
|
+
this.tooltipService.initTooltip(this._tooltip, this._tooltipInitialVisible);
|
|
1066
|
+
}
|
|
1067
|
+
}
|
|
1068
|
+
CheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxComponent, deps: [{ token: TooltipService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1069
|
+
CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CheckboxComponent, selector: "mrx-checkbox", inputs: { fields: "fields", required: "required", boldLabel: "boldLabel", indeterminate: "indeterminate", disabled: "disabled", readonly: "readonly", label: "label", customClasses: "customClasses", customWrapperClasses: "customWrapperClasses", invalid: "invalid", checkInvalid: "checkInvalid", tooltip: "tooltip", tooltipInitialVisible: "tooltipInitialVisible", isSaveToStorage: "isSaveToStorage" }, outputs: { changed: "changed", modelChange: "modelChange" }, providers: [
|
|
1070
|
+
TooltipService,
|
|
1071
|
+
{
|
|
1072
|
+
provide: NG_VALUE_ACCESSOR,
|
|
1073
|
+
useExisting: forwardRef(() => CheckboxComponent),
|
|
1074
|
+
multi: true,
|
|
1075
|
+
},
|
|
1076
|
+
], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "labelContent", first: true, predicate: ["labelContent"], descendants: true }], ngImport: i0, template: "<div\r\n #input\r\n class=\"mrx-checkbox-wrapper\"\r\n [class]=\"getWrapperClasses\"\r\n>\r\n <label\r\n class=\"mrx-checkbox\"\r\n [class]=\"getClasses\"\r\n [class.mrx-checkbox-indeterminate]=\"indeterminate\"\r\n [class.mrx-checkbox-error]=\"invalid\"\r\n [class.mrx-checkbox-input-disabled]=\"disabled\"\r\n >\r\n <input\r\n type=\"checkbox\"\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-checkbox-mark\">\r\n <span class=\"mrx-icon icon-check icon-font-12 text-bold\" *ngIf=\"!indeterminate\"></span>\r\n </span>\r\n <span\r\n #labelContent\r\n [class]=\"boldLabel ? 'mrx-checkbox-label mrx-checkbox-label-bold' : 'mrx-checkbox-label'\"\r\n >\r\n {{label}}\r\n <ng-content></ng-content>\r\n <span *ngIf=\"required && !disabled\" class=\"required-active\">*</span>\r\n </span>\r\n </label>\r\n\r\n <mrx-tooltip-trigger\r\n *ngIf=\"tooltipService.getTooltip\"\r\n (toggleTooltip)=\"tooltipService.toggleTooltipVisible()\"\r\n [isVisibleTooltip]=\"tooltipService.getTooltipVisible\"\r\n ></mrx-tooltip-trigger>\r\n\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"checkbox\"></mrx-save-state>\r\n</div>\r\n\r\n<mrx-tooltip\r\n *ngIf=\"tooltipService.getTooltip\"\r\n [tooltip]=\"tooltipService.getTooltip\"\r\n [tooltipVisible]=\"tooltipService.getTooltipVisible\"\r\n></mrx-tooltip>\r\n", styles: [".mrx-checkbox{display:inline-flex;align-items:flex-start;position:relative;gap:var(--spacing-2)}.mrx-checkbox:hover .mrx-checkbox-mark{border-color:var(--neutral-bg-stroke-hover)}.mrx-checkbox:hover.mrx-input-disabled .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox]{min-height:auto;position:absolute;left:0;opacity:0;height:var(--sizing-4);width:var(--sizing-4);z-index:2;padding:0;margin:2px 0 0;cursor:pointer}.mrx-checkbox-wrapper{display:flex;align-items:center;justify-content:flex-start;position:relative}.mrx-checkbox .mrx-checkbox-label{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-primary);-webkit-user-select:none;user-select:none;cursor:pointer}.mrx-checkbox .mrx-checkbox-label-bold{font-weight:var(--body-md-bold-font-weight)}.mrx-checkbox .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}.mrx-checkbox .mrx-checkbox-mark{display:block;height:var(--sizing-4);width:var(--sizing-4);min-width:var(--sizing-4);border:var(--border-width-checkbox) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);position:relative;margin-top:2px}.mrx-checkbox .mrx-checkbox-mark .mrx-icon{color:#fff;position:absolute;top:0;left:0;display:none}.mrx-checkbox input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--brand-bg-primary-default);background:var(--brand-bg-primary-default)}.mrx-checkbox input[type=checkbox]:checked+.mrx-checkbox-mark .mrx-icon{display:block}.mrx-checkbox input[type=checkbox][readonly]{cursor:default}.mrx-checkbox input[type=checkbox][readonly]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox][readonly]+.mrx-checkbox-mark{cursor:default;border-color:var(--neutral-control-bg-accent-disabled);background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox][readonly]+.mrx-checkbox-mark+.mrx-checkbox-label{cursor:default}.mrx-checkbox.mrx-checkbox-indeterminate .mrx-checkbox-mark{display:flex;align-items:center;justify-content:center}.mrx-checkbox.mrx-checkbox-indeterminate .mrx-checkbox-mark:after{content:\"\";display:block;width:6px;height:2px;background-color:var(--brand-bg-primary-default);border-radius:var(--border-radius-1)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled:hover .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled:hover .mrx-checkbox-mark:after{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled .mrx-checkbox-mark:after{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-bg-stroke-default);background:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]{cursor:default}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]+.mrx-checkbox-mark{cursor:default;background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]+.mrx-checkbox-mark+.mrx-checkbox-label{cursor:default}.mrx-checkbox.mrx-checkbox-error .mrx-checkbox-mark,.mrx-checkbox.mrx-input-checked-error .mrx-checkbox-mark{border-color:var(--system-bg-controls-negative-default)}.mrx-checkbox.mrx-input-checked-success input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--system-bg-controls-positive-default);background-color:var(--system-bg-controls-positive-default)}.mrx-checkbox.mrx-input-checked-success .mrx-checkbox-mark{border-color:var(--system-bg-controls-positive-default)}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]{cursor:default}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark .mrx-icon{display:block}.mrx-checkbox.mrx-checkbox-input-disabled .mrx-checkbox-mark{cursor:default;border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-input-disabled .mrx-checkbox-label{cursor:default}\n"], components: [{ type: TooltipTriggerComponent, selector: "mrx-tooltip-trigger", inputs: ["triggerTextPosition", "triggerType", "customClasses", "isVisibleTooltip"], outputs: ["toggleTooltip"] }, { type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }, { type: TooltipComponent, selector: "mrx-tooltip", inputs: ["tooltip", "tooltipVisible", "tooltipInitiallyVisible", "triggerType"], outputs: ["visibilityChanged"] }], directives: [{ type: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1077
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
1078
|
+
type: Component,
|
|
1079
|
+
args: [{ selector: 'mrx-checkbox', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
1080
|
+
TooltipService,
|
|
1081
|
+
{
|
|
1082
|
+
provide: NG_VALUE_ACCESSOR,
|
|
1083
|
+
useExisting: forwardRef(() => CheckboxComponent),
|
|
1084
|
+
multi: true,
|
|
1085
|
+
},
|
|
1086
|
+
], template: "<div\r\n #input\r\n class=\"mrx-checkbox-wrapper\"\r\n [class]=\"getWrapperClasses\"\r\n>\r\n <label\r\n class=\"mrx-checkbox\"\r\n [class]=\"getClasses\"\r\n [class.mrx-checkbox-indeterminate]=\"indeterminate\"\r\n [class.mrx-checkbox-error]=\"invalid\"\r\n [class.mrx-checkbox-input-disabled]=\"disabled\"\r\n >\r\n <input\r\n type=\"checkbox\"\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-checkbox-mark\">\r\n <span class=\"mrx-icon icon-check icon-font-12 text-bold\" *ngIf=\"!indeterminate\"></span>\r\n </span>\r\n <span\r\n #labelContent\r\n [class]=\"boldLabel ? 'mrx-checkbox-label mrx-checkbox-label-bold' : 'mrx-checkbox-label'\"\r\n >\r\n {{label}}\r\n <ng-content></ng-content>\r\n <span *ngIf=\"required && !disabled\" class=\"required-active\">*</span>\r\n </span>\r\n </label>\r\n\r\n <mrx-tooltip-trigger\r\n *ngIf=\"tooltipService.getTooltip\"\r\n (toggleTooltip)=\"tooltipService.toggleTooltipVisible()\"\r\n [isVisibleTooltip]=\"tooltipService.getTooltipVisible\"\r\n ></mrx-tooltip-trigger>\r\n\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"checkbox\"></mrx-save-state>\r\n</div>\r\n\r\n<mrx-tooltip\r\n *ngIf=\"tooltipService.getTooltip\"\r\n [tooltip]=\"tooltipService.getTooltip\"\r\n [tooltipVisible]=\"tooltipService.getTooltipVisible\"\r\n></mrx-tooltip>\r\n", styles: [".mrx-checkbox{display:inline-flex;align-items:flex-start;position:relative;gap:var(--spacing-2)}.mrx-checkbox:hover .mrx-checkbox-mark{border-color:var(--neutral-bg-stroke-hover)}.mrx-checkbox:hover.mrx-input-disabled .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox]{min-height:auto;position:absolute;left:0;opacity:0;height:var(--sizing-4);width:var(--sizing-4);z-index:2;padding:0;margin:2px 0 0;cursor:pointer}.mrx-checkbox-wrapper{display:flex;align-items:center;justify-content:flex-start;position:relative}.mrx-checkbox .mrx-checkbox-label{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-primary);-webkit-user-select:none;user-select:none;cursor:pointer}.mrx-checkbox .mrx-checkbox-label-bold{font-weight:var(--body-md-bold-font-weight)}.mrx-checkbox .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}.mrx-checkbox .mrx-checkbox-mark{display:block;height:var(--sizing-4);width:var(--sizing-4);min-width:var(--sizing-4);border:var(--border-width-checkbox) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);position:relative;margin-top:2px}.mrx-checkbox .mrx-checkbox-mark .mrx-icon{color:#fff;position:absolute;top:0;left:0;display:none}.mrx-checkbox input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--brand-bg-primary-default);background:var(--brand-bg-primary-default)}.mrx-checkbox input[type=checkbox]:checked+.mrx-checkbox-mark .mrx-icon{display:block}.mrx-checkbox input[type=checkbox][readonly]{cursor:default}.mrx-checkbox input[type=checkbox][readonly]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox][readonly]+.mrx-checkbox-mark{cursor:default;border-color:var(--neutral-control-bg-accent-disabled);background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox][readonly]+.mrx-checkbox-mark+.mrx-checkbox-label{cursor:default}.mrx-checkbox.mrx-checkbox-indeterminate .mrx-checkbox-mark{display:flex;align-items:center;justify-content:center}.mrx-checkbox.mrx-checkbox-indeterminate .mrx-checkbox-mark:after{content:\"\";display:block;width:6px;height:2px;background-color:var(--brand-bg-primary-default);border-radius:var(--border-radius-1)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled:hover .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled:hover .mrx-checkbox-mark:after{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled .mrx-checkbox-mark:after{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-bg-stroke-default);background:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]{cursor:default}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]+.mrx-checkbox-mark{cursor:default;background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]+.mrx-checkbox-mark+.mrx-checkbox-label{cursor:default}.mrx-checkbox.mrx-checkbox-error .mrx-checkbox-mark,.mrx-checkbox.mrx-input-checked-error .mrx-checkbox-mark{border-color:var(--system-bg-controls-negative-default)}.mrx-checkbox.mrx-input-checked-success input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--system-bg-controls-positive-default);background-color:var(--system-bg-controls-positive-default)}.mrx-checkbox.mrx-input-checked-success .mrx-checkbox-mark{border-color:var(--system-bg-controls-positive-default)}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]{cursor:default}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark .mrx-icon{display:block}.mrx-checkbox.mrx-checkbox-input-disabled .mrx-checkbox-mark{cursor:default;border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-input-disabled .mrx-checkbox-label{cursor:default}\n"] }]
|
|
1087
|
+
}], ctorParameters: function () { return [{ type: TooltipService }]; }, propDecorators: { fields: [{
|
|
1088
|
+
type: Input
|
|
1089
|
+
}], required: [{
|
|
1090
|
+
type: Input
|
|
1091
|
+
}], boldLabel: [{
|
|
1092
|
+
type: Input
|
|
1093
|
+
}], indeterminate: [{
|
|
1094
|
+
type: Input
|
|
1095
|
+
}], disabled: [{
|
|
1096
|
+
type: Input
|
|
1097
|
+
}], readonly: [{
|
|
1098
|
+
type: Input
|
|
1099
|
+
}], label: [{
|
|
1100
|
+
type: Input
|
|
1101
|
+
}], customClasses: [{
|
|
1102
|
+
type: Input
|
|
1103
|
+
}], customWrapperClasses: [{
|
|
1104
|
+
type: Input
|
|
1105
|
+
}], invalid: [{
|
|
1106
|
+
type: Input
|
|
1107
|
+
}], checkInvalid: [{
|
|
1108
|
+
type: Input
|
|
1109
|
+
}], tooltip: [{
|
|
1110
|
+
type: Input
|
|
1111
|
+
}], tooltipInitialVisible: [{
|
|
1112
|
+
type: Input
|
|
1113
|
+
}], isSaveToStorage: [{
|
|
1114
|
+
type: Input
|
|
1115
|
+
}], input: [{
|
|
1116
|
+
type: ViewChild,
|
|
1117
|
+
args: ['input']
|
|
1118
|
+
}], labelContent: [{
|
|
1119
|
+
type: ViewChild,
|
|
1120
|
+
args: ['labelContent']
|
|
1121
|
+
}], changed: [{
|
|
1122
|
+
type: Output
|
|
1123
|
+
}], modelChange: [{
|
|
1124
|
+
type: Output
|
|
1125
|
+
}] } });
|
|
1126
|
+
|
|
995
1127
|
const TOOLTIP_DATA = new InjectionToken('Data to display in tooltip');
|
|
996
1128
|
class TooltipContainerComponent {
|
|
997
1129
|
constructor(tooltipData) {
|
|
@@ -1192,10 +1324,14 @@ class LabelComponent {
|
|
|
1192
1324
|
this.triggerTextPosition = 'default';
|
|
1193
1325
|
this.isPublicInfo = false;
|
|
1194
1326
|
this.publicInfoTooltip = '';
|
|
1195
|
-
//
|
|
1327
|
+
// SWITCH
|
|
1196
1328
|
this.isSwitch = false;
|
|
1197
1329
|
this.switchLabel = '';
|
|
1198
1330
|
this.switchValue = false;
|
|
1331
|
+
// CHECKBOX
|
|
1332
|
+
this.isCheckbox = false;
|
|
1333
|
+
this.checkboxLabel = '';
|
|
1334
|
+
this.checkboxValue = false;
|
|
1199
1335
|
// COUNTER
|
|
1200
1336
|
this.counter = 0;
|
|
1201
1337
|
// LINK
|
|
@@ -1231,7 +1367,7 @@ class LabelComponent {
|
|
|
1231
1367
|
}
|
|
1232
1368
|
}
|
|
1233
1369
|
LabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: LabelComponent, deps: [{ token: TooltipService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1234
|
-
LabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: LabelComponent, selector: "mrx-label", inputs: { requiredHidden: "requiredHidden", required: "required", boldLabel: "boldLabel", disabled: "disabled", placeholder: "placeholder", label: "label", customClasses: "customClasses", triggerTextPosition: "triggerTextPosition", isPublicInfo: "isPublicInfo", publicInfoTooltip: "publicInfoTooltip", isSwitch: "isSwitch", switchLabel: "switchLabel", switchValue: "switchValue", counter: "counter", linkText: "linkText", linkPrevent: "linkPrevent", linkType: "linkType", linkMonochrome: "linkMonochrome", href: "href", triggerType: "triggerType", tooltip: "tooltip", tooltipInitialVisible: "tooltipInitialVisible", isSaveToStorage: "isSaveToStorage" }, outputs: { changeCheckboxValue: "changeCheckboxValue", clickedLink: "clickedLink" }, providers: [TooltipService], queries: [{ propertyName: "customIcons", first: true, predicate: ["customIcons"], descendants: true }], ngImport: i0, template: "<div class=\"mrx-label-wrapper mb-2\">\r\n <div class=\"mrx-label-content d-flex align-items-start\" [class.mr-2]=\"isSwitch\">\r\n <div class=\"d-flex\" [style.padding]=\"boldLabel ? 'var(--spacing-half) 0' : ''\">\r\n <label\r\n [class]=\"getClasses\"\r\n [class.required]=\"required\"\r\n [class.bold-label]=\"boldLabel\"\r\n class=\"mrx-label\"\r\n >\r\n <ng-content></ng-content>\r\n\r\n <span *ngIf=\"required && !disabled && !requiredHidden\" class=\"required-active\">*</span>\r\n\r\n <span\r\n *ngIf=\"isPublicInfo\"\r\n class=\"mrx-icon icon-megafon ml-1 icon-font-16\"\r\n [mrxCdkTooltip]=\"publicInfoTooltip\"\r\n ></span>\r\n\r\n <div class=\"label-hint\">\r\n <mrx-tooltip-trigger\r\n *ngIf=\"tooltipService.getTooltip\"\r\n (toggleTooltip)=\"tooltipService.toggleTooltipVisible()\"\r\n [isVisibleTooltip]=\"tooltipService.getTooltipVisible\"\r\n [triggerTextPosition]=\"triggerTextPosition\"\r\n [triggerType]=\"triggerType\"\r\n ></mrx-tooltip-trigger>\r\n </div>\r\n\r\n <ng-container *ngTemplateOutlet=\"customIcons\"></ng-container>\r\n </label>\r\n </div>\r\n\r\n <mrx-badge *ngIf=\"counter\" customClasses=\"ml-2\" type=\"circle\" size=\"small\">{{ counter }}</mrx-badge>\r\n </div>\r\n\r\n <mrx-switch\r\n *ngIf=\"isSwitch\"\r\n size=\"small\"\r\n [label]=\"switchLabel\"\r\n [ngModel]=\"switchValue\"\r\n (ngModelChange)=\"changeCheckboxValue.emit($event)\"\r\n ></mrx-switch>\r\n\r\n <mrx-link\r\n *ngIf=\"linkText\"\r\n [prevent]=\"linkPrevent\"\r\n [type]=\"linkType\"\r\n [monochrome]=\"linkMonochrome\"\r\n (click)=\"onClickToLink($event)\"\r\n >{{ linkText }}</mrx-link>\r\n</div>\r\n\r\n<mrx-tooltip\r\n *ngIf=\"tooltipService.getTooltip\"\r\n [tooltip]=\"tooltipService.getTooltip\"\r\n [tooltipVisible]=\"tooltipService.getTooltipVisible\"\r\n [triggerType]=\"triggerType\"\r\n></mrx-tooltip>\r\n\r\n", styles: [".mrx-label-wrapper.mrx-label-wrapper{display:flex;align-items:flex-start;justify-content:space-between}.mrx-label.mrx-label{display:inline-block;color:var(--neutral-text-primary)}.mrx-label.mrx-label:not(.mrx-label.mrx-label.bold-label){font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-label.mrx-label.bold-label{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)}.mrx-label.mrx-label .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}.mrx-label.mrx-label .label-hint{display:inline-flex;align-items:center;justify-content:center;margin-top:-2px;transform:translateY(2px);margin-left:var(--spacing-1)}.mrx-label.mrx-label ::ng-deep .mrx-icon{vertical-align:top}::ng-deep .mrx-label-wrapper .mrx-switch{white-space:nowrap}::ng-deep mrx-tooltip-trigger{display:inline-flex;align-items:center}\n"], components: [{ type: TooltipTriggerComponent, selector: "mrx-tooltip-trigger", inputs: ["triggerTextPosition", "triggerType", "customClasses", "isVisibleTooltip"], outputs: ["toggleTooltip"] }, { type: BadgeComponent, selector: "mrx-badge", inputs: ["type", "tag", "size", "color", "customColor", "text", "path", "customClasses", "target"], outputs: ["clicked"] }, { type: SwitchComponent, selector: "mrx-switch", inputs: ["fields", "size", "type", "label", "boldLabel", "disabled", "readonly", "required", "customClasses", "leftText", "rightText"], outputs: ["changed", "modelChange"] }, { type: LinkComponent, selector: "mrx-link", inputs: ["type", "target", "monochrome", "customClasses", "href", "prevent", "size"], outputs: ["clicked"] }, { type: TooltipComponent, selector: "mrx-tooltip", inputs: ["tooltip", "tooltipVisible", "tooltipInitiallyVisible", "triggerType"], outputs: ["visibilityChanged"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: CdkTooltipDirective, selector: "[mrxCdkTooltip]", inputs: ["mrxCdkTooltip", "tooltipActive", "autoCloseByScroll", "tooltipPosition", "tooltipMaxWidth"] }, { type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
|
|
1370
|
+
LabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: LabelComponent, selector: "mrx-label", inputs: { requiredHidden: "requiredHidden", required: "required", boldLabel: "boldLabel", disabled: "disabled", placeholder: "placeholder", label: "label", customClasses: "customClasses", triggerTextPosition: "triggerTextPosition", isPublicInfo: "isPublicInfo", publicInfoTooltip: "publicInfoTooltip", isSwitch: "isSwitch", switchLabel: "switchLabel", switchValue: "switchValue", isCheckbox: "isCheckbox", checkboxLabel: "checkboxLabel", checkboxValue: "checkboxValue", counter: "counter", linkText: "linkText", linkPrevent: "linkPrevent", linkType: "linkType", linkMonochrome: "linkMonochrome", href: "href", triggerType: "triggerType", tooltip: "tooltip", tooltipInitialVisible: "tooltipInitialVisible", isSaveToStorage: "isSaveToStorage" }, outputs: { changeCheckboxValue: "changeCheckboxValue", clickedLink: "clickedLink" }, providers: [TooltipService], queries: [{ propertyName: "customIcons", first: true, predicate: ["customIcons"], descendants: true }], ngImport: i0, template: "<div class=\"mrx-label-wrapper mb-2\">\r\n <div class=\"mrx-label-content d-flex align-items-start\" [class.mr-2]=\"isSwitch\">\r\n <div class=\"d-flex\" [style.padding]=\"boldLabel ? 'var(--spacing-half) 0' : ''\">\r\n <label\r\n [class]=\"getClasses\"\r\n [class.required]=\"required\"\r\n [class.bold-label]=\"boldLabel\"\r\n class=\"mrx-label\"\r\n >\r\n <ng-content></ng-content>\r\n\r\n <span *ngIf=\"required && !disabled && !requiredHidden\" class=\"required-active\">*</span>\r\n\r\n <span\r\n *ngIf=\"isPublicInfo\"\r\n class=\"mrx-icon icon-megafon ml-1 icon-font-16\"\r\n [mrxCdkTooltip]=\"publicInfoTooltip\"\r\n ></span>\r\n\r\n <div class=\"label-hint\">\r\n <mrx-tooltip-trigger\r\n *ngIf=\"tooltipService.getTooltip\"\r\n (toggleTooltip)=\"tooltipService.toggleTooltipVisible()\"\r\n [isVisibleTooltip]=\"tooltipService.getTooltipVisible\"\r\n [triggerTextPosition]=\"triggerTextPosition\"\r\n [triggerType]=\"triggerType\"\r\n ></mrx-tooltip-trigger>\r\n </div>\r\n\r\n <ng-container *ngTemplateOutlet=\"customIcons\"></ng-container>\r\n </label>\r\n </div>\r\n\r\n <mrx-badge *ngIf=\"counter\" customClasses=\"ml-2\" type=\"circle\" size=\"small\">{{ counter }}</mrx-badge>\r\n </div>\r\n\r\n <mrx-switch\r\n *ngIf=\"isSwitch && !isCheckbox\"\r\n size=\"small\"\r\n [label]=\"switchLabel\"\r\n [ngModel]=\"switchValue\"\r\n (ngModelChange)=\"changeCheckboxValue.emit($event)\"\r\n ></mrx-switch>\r\n\r\n <mrx-checkbox\r\n *ngIf=\"isCheckbox && !isSwitch\"\r\n [label]=\"checkboxLabel\"\r\n [ngModel]=\"checkboxValue\"\r\n (ngModelChange)=\"changeCheckboxValue.emit($event)\"\r\n ></mrx-checkbox>\r\n\r\n <mrx-link\r\n *ngIf=\"linkText\"\r\n [prevent]=\"linkPrevent\"\r\n [type]=\"linkType\"\r\n [monochrome]=\"linkMonochrome\"\r\n (click)=\"onClickToLink($event)\"\r\n >{{ linkText }}</mrx-link>\r\n</div>\r\n\r\n<mrx-tooltip\r\n *ngIf=\"tooltipService.getTooltip\"\r\n [tooltip]=\"tooltipService.getTooltip\"\r\n [tooltipVisible]=\"tooltipService.getTooltipVisible\"\r\n [triggerType]=\"triggerType\"\r\n></mrx-tooltip>\r\n\r\n", styles: [".mrx-label-wrapper.mrx-label-wrapper{display:flex;align-items:flex-start;justify-content:space-between}.mrx-label.mrx-label{display:inline-block;color:var(--neutral-text-primary)}.mrx-label.mrx-label:not(.mrx-label.mrx-label.bold-label){font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-label.mrx-label.bold-label{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)}.mrx-label.mrx-label .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}.mrx-label.mrx-label .label-hint{display:inline-flex;align-items:center;justify-content:center;margin-top:-2px;transform:translateY(2px);margin-left:var(--spacing-1)}.mrx-label.mrx-label ::ng-deep .mrx-icon{vertical-align:top}::ng-deep .mrx-label-wrapper .mrx-switch{white-space:nowrap}::ng-deep mrx-tooltip-trigger{display:inline-flex;align-items:center}\n"], components: [{ type: TooltipTriggerComponent, selector: "mrx-tooltip-trigger", inputs: ["triggerTextPosition", "triggerType", "customClasses", "isVisibleTooltip"], outputs: ["toggleTooltip"] }, { type: BadgeComponent, selector: "mrx-badge", inputs: ["type", "tag", "size", "color", "customColor", "text", "path", "customClasses", "target"], outputs: ["clicked"] }, { type: SwitchComponent, selector: "mrx-switch", inputs: ["fields", "size", "type", "label", "boldLabel", "disabled", "readonly", "required", "customClasses", "leftText", "rightText"], outputs: ["changed", "modelChange"] }, { type: CheckboxComponent, selector: "mrx-checkbox", inputs: ["fields", "required", "boldLabel", "indeterminate", "disabled", "readonly", "label", "customClasses", "customWrapperClasses", "invalid", "checkInvalid", "tooltip", "tooltipInitialVisible", "isSaveToStorage"], outputs: ["changed", "modelChange"] }, { type: LinkComponent, selector: "mrx-link", inputs: ["type", "target", "monochrome", "customClasses", "href", "prevent", "size"], outputs: ["clicked"] }, { type: TooltipComponent, selector: "mrx-tooltip", inputs: ["tooltip", "tooltipVisible", "tooltipInitiallyVisible", "triggerType"], outputs: ["visibilityChanged"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: CdkTooltipDirective, selector: "[mrxCdkTooltip]", inputs: ["mrxCdkTooltip", "tooltipActive", "autoCloseByScroll", "tooltipPosition", "tooltipMaxWidth"] }, { type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
|
|
1235
1371
|
trigger('openClose', [
|
|
1236
1372
|
state('open', style({ height: '*', padding: '*', 'margin-bottom': '8px' })),
|
|
1237
1373
|
state('closed', style({ height: 0, padding: 0, 'margin-bottom': 0 })),
|
|
@@ -1248,7 +1384,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
1248
1384
|
transition('open => closed', [animate('0.5s ease')]),
|
|
1249
1385
|
transition('closed => open', [animate('0.5s ease')]),
|
|
1250
1386
|
]),
|
|
1251
|
-
], providers: [TooltipService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mrx-label-wrapper mb-2\">\r\n <div class=\"mrx-label-content d-flex align-items-start\" [class.mr-2]=\"isSwitch\">\r\n <div class=\"d-flex\" [style.padding]=\"boldLabel ? 'var(--spacing-half) 0' : ''\">\r\n <label\r\n [class]=\"getClasses\"\r\n [class.required]=\"required\"\r\n [class.bold-label]=\"boldLabel\"\r\n class=\"mrx-label\"\r\n >\r\n <ng-content></ng-content>\r\n\r\n <span *ngIf=\"required && !disabled && !requiredHidden\" class=\"required-active\">*</span>\r\n\r\n <span\r\n *ngIf=\"isPublicInfo\"\r\n class=\"mrx-icon icon-megafon ml-1 icon-font-16\"\r\n [mrxCdkTooltip]=\"publicInfoTooltip\"\r\n ></span>\r\n\r\n <div class=\"label-hint\">\r\n <mrx-tooltip-trigger\r\n *ngIf=\"tooltipService.getTooltip\"\r\n (toggleTooltip)=\"tooltipService.toggleTooltipVisible()\"\r\n [isVisibleTooltip]=\"tooltipService.getTooltipVisible\"\r\n [triggerTextPosition]=\"triggerTextPosition\"\r\n [triggerType]=\"triggerType\"\r\n ></mrx-tooltip-trigger>\r\n </div>\r\n\r\n <ng-container *ngTemplateOutlet=\"customIcons\"></ng-container>\r\n </label>\r\n </div>\r\n\r\n <mrx-badge *ngIf=\"counter\" customClasses=\"ml-2\" type=\"circle\" size=\"small\">{{ counter }}</mrx-badge>\r\n </div>\r\n\r\n <mrx-switch\r\n *ngIf=\"isSwitch\"\r\n size=\"small\"\r\n [label]=\"switchLabel\"\r\n [ngModel]=\"switchValue\"\r\n (ngModelChange)=\"changeCheckboxValue.emit($event)\"\r\n ></mrx-switch>\r\n\r\n <mrx-link\r\n *ngIf=\"linkText\"\r\n [prevent]=\"linkPrevent\"\r\n [type]=\"linkType\"\r\n [monochrome]=\"linkMonochrome\"\r\n (click)=\"onClickToLink($event)\"\r\n >{{ linkText }}</mrx-link>\r\n</div>\r\n\r\n<mrx-tooltip\r\n *ngIf=\"tooltipService.getTooltip\"\r\n [tooltip]=\"tooltipService.getTooltip\"\r\n [tooltipVisible]=\"tooltipService.getTooltipVisible\"\r\n [triggerType]=\"triggerType\"\r\n></mrx-tooltip>\r\n\r\n", styles: [".mrx-label-wrapper.mrx-label-wrapper{display:flex;align-items:flex-start;justify-content:space-between}.mrx-label.mrx-label{display:inline-block;color:var(--neutral-text-primary)}.mrx-label.mrx-label:not(.mrx-label.mrx-label.bold-label){font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-label.mrx-label.bold-label{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)}.mrx-label.mrx-label .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}.mrx-label.mrx-label .label-hint{display:inline-flex;align-items:center;justify-content:center;margin-top:-2px;transform:translateY(2px);margin-left:var(--spacing-1)}.mrx-label.mrx-label ::ng-deep .mrx-icon{vertical-align:top}::ng-deep .mrx-label-wrapper .mrx-switch{white-space:nowrap}::ng-deep mrx-tooltip-trigger{display:inline-flex;align-items:center}\n"] }]
|
|
1387
|
+
], providers: [TooltipService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mrx-label-wrapper mb-2\">\r\n <div class=\"mrx-label-content d-flex align-items-start\" [class.mr-2]=\"isSwitch\">\r\n <div class=\"d-flex\" [style.padding]=\"boldLabel ? 'var(--spacing-half) 0' : ''\">\r\n <label\r\n [class]=\"getClasses\"\r\n [class.required]=\"required\"\r\n [class.bold-label]=\"boldLabel\"\r\n class=\"mrx-label\"\r\n >\r\n <ng-content></ng-content>\r\n\r\n <span *ngIf=\"required && !disabled && !requiredHidden\" class=\"required-active\">*</span>\r\n\r\n <span\r\n *ngIf=\"isPublicInfo\"\r\n class=\"mrx-icon icon-megafon ml-1 icon-font-16\"\r\n [mrxCdkTooltip]=\"publicInfoTooltip\"\r\n ></span>\r\n\r\n <div class=\"label-hint\">\r\n <mrx-tooltip-trigger\r\n *ngIf=\"tooltipService.getTooltip\"\r\n (toggleTooltip)=\"tooltipService.toggleTooltipVisible()\"\r\n [isVisibleTooltip]=\"tooltipService.getTooltipVisible\"\r\n [triggerTextPosition]=\"triggerTextPosition\"\r\n [triggerType]=\"triggerType\"\r\n ></mrx-tooltip-trigger>\r\n </div>\r\n\r\n <ng-container *ngTemplateOutlet=\"customIcons\"></ng-container>\r\n </label>\r\n </div>\r\n\r\n <mrx-badge *ngIf=\"counter\" customClasses=\"ml-2\" type=\"circle\" size=\"small\">{{ counter }}</mrx-badge>\r\n </div>\r\n\r\n <mrx-switch\r\n *ngIf=\"isSwitch && !isCheckbox\"\r\n size=\"small\"\r\n [label]=\"switchLabel\"\r\n [ngModel]=\"switchValue\"\r\n (ngModelChange)=\"changeCheckboxValue.emit($event)\"\r\n ></mrx-switch>\r\n\r\n <mrx-checkbox\r\n *ngIf=\"isCheckbox && !isSwitch\"\r\n [label]=\"checkboxLabel\"\r\n [ngModel]=\"checkboxValue\"\r\n (ngModelChange)=\"changeCheckboxValue.emit($event)\"\r\n ></mrx-checkbox>\r\n\r\n <mrx-link\r\n *ngIf=\"linkText\"\r\n [prevent]=\"linkPrevent\"\r\n [type]=\"linkType\"\r\n [monochrome]=\"linkMonochrome\"\r\n (click)=\"onClickToLink($event)\"\r\n >{{ linkText }}</mrx-link>\r\n</div>\r\n\r\n<mrx-tooltip\r\n *ngIf=\"tooltipService.getTooltip\"\r\n [tooltip]=\"tooltipService.getTooltip\"\r\n [tooltipVisible]=\"tooltipService.getTooltipVisible\"\r\n [triggerType]=\"triggerType\"\r\n></mrx-tooltip>\r\n\r\n", styles: [".mrx-label-wrapper.mrx-label-wrapper{display:flex;align-items:flex-start;justify-content:space-between}.mrx-label.mrx-label{display:inline-block;color:var(--neutral-text-primary)}.mrx-label.mrx-label:not(.mrx-label.mrx-label.bold-label){font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-label.mrx-label.bold-label{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)}.mrx-label.mrx-label .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}.mrx-label.mrx-label .label-hint{display:inline-flex;align-items:center;justify-content:center;margin-top:-2px;transform:translateY(2px);margin-left:var(--spacing-1)}.mrx-label.mrx-label ::ng-deep .mrx-icon{vertical-align:top}::ng-deep .mrx-label-wrapper .mrx-switch{white-space:nowrap}::ng-deep mrx-tooltip-trigger{display:inline-flex;align-items:center}\n"] }]
|
|
1252
1388
|
}], ctorParameters: function () { return [{ type: TooltipService }]; }, propDecorators: { requiredHidden: [{
|
|
1253
1389
|
type: Input
|
|
1254
1390
|
}], required: [{
|
|
@@ -1275,6 +1411,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
1275
1411
|
type: Input
|
|
1276
1412
|
}], switchValue: [{
|
|
1277
1413
|
type: Input
|
|
1414
|
+
}], isCheckbox: [{
|
|
1415
|
+
type: Input
|
|
1416
|
+
}], checkboxLabel: [{
|
|
1417
|
+
type: Input
|
|
1418
|
+
}], checkboxValue: [{
|
|
1419
|
+
type: Input
|
|
1278
1420
|
}], counter: [{
|
|
1279
1421
|
type: Input
|
|
1280
1422
|
}], linkText: [{
|
|
@@ -1379,16 +1521,56 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
1379
1521
|
}]
|
|
1380
1522
|
}] });
|
|
1381
1523
|
|
|
1524
|
+
class CheckboxModule {
|
|
1525
|
+
}
|
|
1526
|
+
CheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1527
|
+
CheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxModule, declarations: [CheckboxComponent], imports: [CommonModule, FormsModule, TooltipModule, SaveStateModule], exports: [CheckboxComponent] });
|
|
1528
|
+
CheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxModule, imports: [[CommonModule, FormsModule, TooltipModule, SaveStateModule]] });
|
|
1529
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxModule, decorators: [{
|
|
1530
|
+
type: NgModule,
|
|
1531
|
+
args: [{
|
|
1532
|
+
declarations: [CheckboxComponent],
|
|
1533
|
+
imports: [CommonModule, FormsModule, TooltipModule, SaveStateModule],
|
|
1534
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
|
1535
|
+
exports: [CheckboxComponent],
|
|
1536
|
+
}]
|
|
1537
|
+
}] });
|
|
1538
|
+
|
|
1382
1539
|
class LabelModule {
|
|
1383
1540
|
}
|
|
1384
1541
|
LabelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: LabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1385
|
-
LabelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: LabelModule, declarations: [LabelComponent], imports: [CommonModule,
|
|
1386
|
-
|
|
1542
|
+
LabelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: LabelModule, declarations: [LabelComponent], imports: [CommonModule,
|
|
1543
|
+
FormsModule,
|
|
1544
|
+
TooltipModule,
|
|
1545
|
+
SwitchModule,
|
|
1546
|
+
BadgesModule,
|
|
1547
|
+
LinkModule,
|
|
1548
|
+
CdkTooltipModule,
|
|
1549
|
+
CheckboxModule], exports: [LabelComponent] });
|
|
1550
|
+
LabelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: LabelModule, imports: [[
|
|
1551
|
+
CommonModule,
|
|
1552
|
+
FormsModule,
|
|
1553
|
+
TooltipModule,
|
|
1554
|
+
SwitchModule,
|
|
1555
|
+
BadgesModule,
|
|
1556
|
+
LinkModule,
|
|
1557
|
+
CdkTooltipModule,
|
|
1558
|
+
CheckboxModule
|
|
1559
|
+
]] });
|
|
1387
1560
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: LabelModule, decorators: [{
|
|
1388
1561
|
type: NgModule,
|
|
1389
1562
|
args: [{
|
|
1390
1563
|
declarations: [LabelComponent],
|
|
1391
|
-
imports: [
|
|
1564
|
+
imports: [
|
|
1565
|
+
CommonModule,
|
|
1566
|
+
FormsModule,
|
|
1567
|
+
TooltipModule,
|
|
1568
|
+
SwitchModule,
|
|
1569
|
+
BadgesModule,
|
|
1570
|
+
LinkModule,
|
|
1571
|
+
CdkTooltipModule,
|
|
1572
|
+
CheckboxModule
|
|
1573
|
+
],
|
|
1392
1574
|
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
|
1393
1575
|
exports: [LabelComponent],
|
|
1394
1576
|
}]
|
|
@@ -8846,7 +9028,7 @@ class InputDatepickerComponent {
|
|
|
8846
9028
|
InputDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDatepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8847
9029
|
InputDatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: InputDatepickerComponent, selector: "mrx-input-datepicker", inputs: { fields: "fields", size: "size", format: "format", locale: "locale", customClasses: "customClasses", dateLabel: "dateLabel", timeLabel: "timeLabel", datePlaceholder: "datePlaceholder", placeholder: "placeholder", disabled: "disabled", readonly: "readonly", required: "required", timepicker: "timepicker", minDate: "minDate", maxDate: "maxDate", inline: "inline", closable: "closable", leadZeroDateTime: "leadZeroDateTime", mask: "mask", container: "container", validationType: "validationType", disableValidation: "disableValidation", invalid: "invalid", invalidMessage: "invalidMessage", checkInvalid: "checkInvalid", isShowMessages: "isShowMessages" }, outputs: { changed: "changed", modelChange: "modelChange" }, providers: [
|
|
8848
9030
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => InputDatepickerComponent), multi: true }
|
|
8849
|
-
], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"mrx-input-date\"\r\n [class.mrx-input-error]=\"invalid || innerInvalid\"\r\n [class.-disabled]=\"disabled\"\r\n [class.-readonly]=\"readonly\"\r\n [class]=\"getClasses\"\r\n>\r\n <div class=\"\">\r\n <mrx-label *ngIf=\"timeLabel || dateLabel\">{{ dateLabel }}</mrx-label>\r\n <div class=\"mrx-input-date__wrapper\">\r\n <input\r\n #dateInput\r\n type=\"text\"\r\n autocomplete=\"nope\"\r\n class=\"mrx-input-date__input mrx-input-date__date\"\r\n [placeholder]=\"placeholder\"\r\n [ngModel]=\"getDateValue\"\r\n [mask]=\"mask\"\r\n [leadZeroDateTime]=\"leadZeroDateTime\"\r\n [validation]=\"false\"\r\n [disabled]=\"disabled || readonly\"\r\n (input)=\"updateDateValue(dateInput)\"\r\n (click)=\"clickToInput(dateInput)\"\r\n />\r\n\r\n <div *ngIf=\"!disabled\" class=\"mrx-input-date__icons\">\r\n <span\r\n class=\"mrx-icon icon-close\"\r\n *ngIf=\"isViewCleanIcon && !(disabled || readonly)\"\r\n (click)=\"clickToIconClear()\"\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'medium' || size === 'large'\"\r\n ></span>\r\n <span\r\n class=\"mrx-icon icon-calendar\"\r\n (click)=\"clickToIconCalendar()\"\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'medium' || size === 'large'\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <mrx-error-message\r\n *ngIf=\"invalid; else innerInvalidTemplate\"\r\n [invalidMessage]=\"invalidMessage\"\r\n ></mrx-error-message>\r\n\r\n <ng-template #innerInvalidTemplate>\r\n <mrx-error-message\r\n *ngIf=\"innerInvalid\"\r\n [invalidMessage]=\"innerInvalidMessage\"\r\n ></mrx-error-message>\r\n </ng-template>\r\n\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".mrx-input-date.mrx-input-date{width:100%;position:relative}.mrx-input-date.mrx-input-date .mrx-input-date__wrapper{position:relative}.mrx-input-date.mrx-input-date .mrx-input-date__input{border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);width:100%;transition:outline-width .2s,border .2s}.mrx-input-date.mrx-input-date .mrx-input-date__input:focus,.mrx-input-date.mrx-input-date .mrx-input-date__input:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-input-date.mrx-input-date .mrx-input-date__input:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-input-date.mrx-input-date.mrx-input-date-lg .mrx-input-date__input{padding:calc(var(--spacing-3) + var(--spacing-half) - var(--border-width-default)) calc(var(--spacing-4) - var(--border-width-default));font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-input-date.mrx-input-date.mrx-input-date-md .mrx-input-date__input{padding:calc(var(--spacing-2) + var(--spacing-half) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default));font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-input-date.mrx-input-date.mrx-input-date-sm .mrx-input-date__input{padding:calc(var(--spacing-2) - var(--border-width-default)) calc(var(--spacing-2) - var(--border-width-default));font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height)}.mrx-input-date.mrx-input-date.mrx-input-error .mrx-input-date__input{border-color:var(--system-bg-controls-negative-default)!important}.mrx-input-date.mrx-input-date.mrx-input-checked-error .mrx-input-date__input{border-color:var(--system-bg-controls-negative-default)!important;background-color:var(--system-bg-negative-secondary)!important}.mrx-input-date.mrx-input-date.mrx-input-checked-success .mrx-input-date__input{background-color:var(--system-bg-positive-secondary)!important;border-color:var(--system-bg-controls-positive-default)!important}.mrx-input-date.mrx-input-date .mrx-input-date__icons{position:absolute;top:0;right:0;display:flex;align-items:center}.mrx-input-date.mrx-input-date .mrx-input-date__icons-item,.mrx-input-date.mrx-input-date .mrx-input-date__icons .mrx-icon{cursor:pointer}.mrx-input-date.mrx-input-date.mrx-input-date-lg .mrx-icon{margin-top:calc(var(--spacing-3) - var(--border-width-default));margin-right:var(--spacing-3)}.mrx-input-date.mrx-input-date.mrx-input-date-md .mrx-icon{margin-top:calc(var(--spacing-2) - var(--border-width-default));margin-right:var(--spacing-3)}.mrx-input-date.mrx-input-date.mrx-input-date-sm .mrx-icon{margin-top:calc(var(--spacing-2) - var(--border-width-default));margin-right:var(--spacing-2)}.mrx-input-date.mrx-input-date.-disabled input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-tertiary, #71767E);color:var(--neutral-text-tertiary, #71767E)}.mrx-input-date.mrx-input-date.-readonly input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-primary, #262626);color:var(--neutral-text-primary, #262626)}\n"], components: [{ type: LabelComponent, selector: "mrx-label", inputs: ["requiredHidden", "required", "boldLabel", "disabled", "placeholder", "label", "customClasses", "triggerTextPosition", "isPublicInfo", "publicInfoTooltip", "isSwitch", "switchLabel", "switchValue", "counter", "linkText", "linkPrevent", "linkType", "linkMonochrome", "href", "triggerType", "tooltip", "tooltipInitialVisible", "isSaveToStorage"], outputs: ["changeCheckboxValue", "clickedLink"] }, { type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$7.MaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "triggerOnMaskChange"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
9031
|
+
], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"mrx-input-date\"\r\n [class.mrx-input-error]=\"invalid || innerInvalid\"\r\n [class.-disabled]=\"disabled\"\r\n [class.-readonly]=\"readonly\"\r\n [class]=\"getClasses\"\r\n>\r\n <div class=\"\">\r\n <mrx-label *ngIf=\"timeLabel || dateLabel\">{{ dateLabel }}</mrx-label>\r\n <div class=\"mrx-input-date__wrapper\">\r\n <input\r\n #dateInput\r\n type=\"text\"\r\n autocomplete=\"nope\"\r\n class=\"mrx-input-date__input mrx-input-date__date\"\r\n [placeholder]=\"placeholder\"\r\n [ngModel]=\"getDateValue\"\r\n [mask]=\"mask\"\r\n [leadZeroDateTime]=\"leadZeroDateTime\"\r\n [validation]=\"false\"\r\n [disabled]=\"disabled || readonly\"\r\n (input)=\"updateDateValue(dateInput)\"\r\n (click)=\"clickToInput(dateInput)\"\r\n />\r\n\r\n <div *ngIf=\"!disabled\" class=\"mrx-input-date__icons\">\r\n <span\r\n class=\"mrx-icon icon-close\"\r\n *ngIf=\"isViewCleanIcon && !(disabled || readonly)\"\r\n (click)=\"clickToIconClear()\"\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'medium' || size === 'large'\"\r\n ></span>\r\n <span\r\n class=\"mrx-icon icon-calendar\"\r\n (click)=\"clickToIconCalendar()\"\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'medium' || size === 'large'\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <mrx-error-message\r\n *ngIf=\"invalid; else innerInvalidTemplate\"\r\n [invalidMessage]=\"invalidMessage\"\r\n ></mrx-error-message>\r\n\r\n <ng-template #innerInvalidTemplate>\r\n <mrx-error-message\r\n *ngIf=\"innerInvalid\"\r\n [invalidMessage]=\"innerInvalidMessage\"\r\n ></mrx-error-message>\r\n </ng-template>\r\n\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".mrx-input-date.mrx-input-date{width:100%;position:relative}.mrx-input-date.mrx-input-date .mrx-input-date__wrapper{position:relative}.mrx-input-date.mrx-input-date .mrx-input-date__input{border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);width:100%;transition:outline-width .2s,border .2s}.mrx-input-date.mrx-input-date .mrx-input-date__input:focus,.mrx-input-date.mrx-input-date .mrx-input-date__input:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-input-date.mrx-input-date .mrx-input-date__input:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-input-date.mrx-input-date.mrx-input-date-lg .mrx-input-date__input{padding:calc(var(--spacing-3) + var(--spacing-half) - var(--border-width-default)) calc(var(--spacing-4) - var(--border-width-default));font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-input-date.mrx-input-date.mrx-input-date-md .mrx-input-date__input{padding:calc(var(--spacing-2) + var(--spacing-half) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default));font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-input-date.mrx-input-date.mrx-input-date-sm .mrx-input-date__input{padding:calc(var(--spacing-2) - var(--border-width-default)) calc(var(--spacing-2) - var(--border-width-default));font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height)}.mrx-input-date.mrx-input-date.mrx-input-error .mrx-input-date__input{border-color:var(--system-bg-controls-negative-default)!important}.mrx-input-date.mrx-input-date.mrx-input-checked-error .mrx-input-date__input{border-color:var(--system-bg-controls-negative-default)!important;background-color:var(--system-bg-negative-secondary)!important}.mrx-input-date.mrx-input-date.mrx-input-checked-success .mrx-input-date__input{background-color:var(--system-bg-positive-secondary)!important;border-color:var(--system-bg-controls-positive-default)!important}.mrx-input-date.mrx-input-date .mrx-input-date__icons{position:absolute;top:0;right:0;display:flex;align-items:center}.mrx-input-date.mrx-input-date .mrx-input-date__icons-item,.mrx-input-date.mrx-input-date .mrx-input-date__icons .mrx-icon{cursor:pointer}.mrx-input-date.mrx-input-date.mrx-input-date-lg .mrx-icon{margin-top:calc(var(--spacing-3) - var(--border-width-default));margin-right:var(--spacing-3)}.mrx-input-date.mrx-input-date.mrx-input-date-md .mrx-icon{margin-top:calc(var(--spacing-2) - var(--border-width-default));margin-right:var(--spacing-3)}.mrx-input-date.mrx-input-date.mrx-input-date-sm .mrx-icon{margin-top:calc(var(--spacing-2) - var(--border-width-default));margin-right:var(--spacing-2)}.mrx-input-date.mrx-input-date.-disabled input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-tertiary, #71767E);color:var(--neutral-text-tertiary, #71767E)}.mrx-input-date.mrx-input-date.-readonly input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-primary, #262626);color:var(--neutral-text-primary, #262626)}\n"], components: [{ type: LabelComponent, selector: "mrx-label", inputs: ["requiredHidden", "required", "boldLabel", "disabled", "placeholder", "label", "customClasses", "triggerTextPosition", "isPublicInfo", "publicInfoTooltip", "isSwitch", "switchLabel", "switchValue", "isCheckbox", "checkboxLabel", "checkboxValue", "counter", "linkText", "linkPrevent", "linkType", "linkMonochrome", "href", "triggerType", "tooltip", "tooltipInitialVisible", "isSaveToStorage"], outputs: ["changeCheckboxValue", "clickedLink"] }, { type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$7.MaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "triggerOnMaskChange"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
8850
9032
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDatepickerComponent, decorators: [{
|
|
8851
9033
|
type: Component,
|
|
8852
9034
|
args: [{ selector: 'mrx-input-datepicker', providers: [
|
|
@@ -9434,7 +9616,7 @@ class InputDateTimeComponent {
|
|
|
9434
9616
|
InputDateTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9435
9617
|
InputDateTimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: InputDateTimeComponent, selector: "mrx-input-date-time", inputs: { fields: "fields", size: "size", customClasses: "customClasses", dateLabel: "dateLabel", timeLabel: "timeLabel", datePlaceholder: "datePlaceholder", timePlaceholder: "timePlaceholder", disabled: "disabled", readonly: "readonly", required: "required", timepicker: "timepicker", range: "range", minDate: "minDate", maxDate: "maxDate", timezone: "timezone", inline: "inline", isManualInput: "isManualInput", addMinTime: "addMinTime", addMaxTime: "addMaxTime", addMinTimeObj: "addMinTimeObj", addMaxTimeObj: "addMaxTimeObj", disableValidate: "disableValidate", container: "container", invalid: "invalid", invalidMessage: "invalidMessage", checkInvalid: "checkInvalid" }, outputs: { changed: "changed", modelChange: "modelChange", blurred: "blurred" }, providers: [
|
|
9436
9618
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => InputDateTimeComponent), multi: true }
|
|
9437
|
-
], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }, { propertyName: "timeInput", first: true, predicate: ["timeInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"mrx-input-date\"\r\n [class.mrx-input-error]=\"invalid || innerInvalid\"\r\n [class.mrx-input-readonly]=\"readonly\"\r\n [class]=\"getClasses\"\r\n>\r\n <div class=\"\">\r\n <mrx-label *ngIf=\"timeLabel || dateLabel\">{{ dateLabel }}</mrx-label>\r\n <div class=\"mrx-input-date__wrapper\">\r\n <input\r\n #dateInput\r\n type=\"text\"\r\n autocomplete=\"nope\"\r\n class=\"mrx-input-date__input mrx-input-date__date\"\r\n [placeholder]=\"datePlaceholder\"\r\n [ngModel]=\"getDateValue\"\r\n [mask]=\"'00.00.0000 00:m0'\"\r\n [leadZeroDateTime]=\"true\"\r\n [validation]=\"false\"\r\n [disabled]=\"disabled\"\r\n [readOnly]=\"!isManualInput\"\r\n (input)=\"updateDateValue(dateInput)\"\r\n (click)=\"clickToInput(dateInput)\"\r\n (blur)=\"onBlur($event)\"\r\n />\r\n\r\n <div *ngIf=\"!disabled\" class=\"mrx-input-date__icons\">\r\n <span\r\n class=\"mrx-icon icon-close\"\r\n *ngIf=\"isViewCleanIcon\"\r\n (click)=\"clickToIconClear()\"\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'medium' || size === 'large'\"\r\n ></span>\r\n <span\r\n class=\"mrx-icon icon-calendar\"\r\n (click)=\"clickToIconCalendar()\"\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'medium' || size === 'large'\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <mrx-error-message\r\n *ngIf=\"invalid; else innerInvalidTemplate\"\r\n [invalidMessage]=\"invalidMessage\"\r\n ></mrx-error-message>\r\n\r\n <ng-template #innerInvalidTemplate>\r\n <mrx-error-message\r\n *ngIf=\"innerInvalid\"\r\n [invalidMessage]=\"innerInvalidMessage\"\r\n ></mrx-error-message>\r\n </ng-template>\r\n\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".mrx-input-date{width:100%;position:relative}.mrx-input-date .mrx-input-date__wrapper{position:relative}.mrx-input-date .mrx-input-date__input{border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);color:var(--neutral-text-primary);width:100%;transition:outline-width .2s,border .2s}.mrx-input-date .mrx-input-date__input:focus,.mrx-input-date .mrx-input-date__input:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-input-date .mrx-input-date__input:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-input-date .mrx-input-date__input:disabled{background-color:var(--neutral-bg-disabled);color:var(--neutral-text-tertiary)}.mrx-input-date.mrx-input-date-lg .mrx-input-date__input{padding:calc(var(--spacing-3) + var(--spacing-half) - var(--border-width-default)) calc(var(--spacing-4) - var(--border-width-default));font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-input-date.mrx-input-date-md .mrx-input-date__input{padding:calc(var(--spacing-2) + var(--spacing-half) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default));font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-input-date.mrx-input-date-sm .mrx-input-date__input{padding:calc(var(--spacing-2) - var(--border-width-default)) calc(var(--spacing-2) - var(--border-width-default));font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height)}.mrx-input-date.mrx-input-date.mrx-input-error .mrx-input-date__input{border-color:var(--system-bg-controls-negative-default)!important}.mrx-input-date.mrx-input-date.mrx-input-checked-error .mrx-input-date__input{border-color:var(--system-bg-controls-negative-default)!important;background-color:var(--system-bg-negative-secondary)!important}.mrx-input-date.mrx-input-date.mrx-input-checked-success .mrx-input-date__input{background-color:var(--system-bg-positive-secondary)!important;border-color:var(--system-bg-controls-positive-default)!important}.mrx-input-date.mrx-input-date .mrx-input-date__icons{position:absolute;top:0;right:0;display:flex;align-items:center}.mrx-input-date.mrx-input-date .mrx-input-date__icons-item,.mrx-input-date.mrx-input-date .mrx-input-date__icons .mrx-icon{cursor:pointer}.mrx-input-date.mrx-input-date.mrx-input-date-lg .mrx-icon{margin-top:calc(var(--spacing-3) - var(--border-width-default));margin-right:var(--spacing-3)}.mrx-input-date.mrx-input-date.mrx-input-date-md .mrx-icon{margin-top:calc(var(--spacing-2) - var(--border-width-default));margin-right:var(--spacing-3)}.mrx-input-date.mrx-input-date.mrx-input-date-sm .mrx-icon{margin-top:calc(var(--spacing-2) - var(--border-width-default));margin-right:var(--spacing-2)}\n"], components: [{ type: LabelComponent, selector: "mrx-label", inputs: ["requiredHidden", "required", "boldLabel", "disabled", "placeholder", "label", "customClasses", "triggerTextPosition", "isPublicInfo", "publicInfoTooltip", "isSwitch", "switchLabel", "switchValue", "counter", "linkText", "linkPrevent", "linkType", "linkMonochrome", "href", "triggerType", "tooltip", "tooltipInitialVisible", "isSaveToStorage"], outputs: ["changeCheckboxValue", "clickedLink"] }, { type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$7.MaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "triggerOnMaskChange"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9619
|
+
], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }, { propertyName: "timeInput", first: true, predicate: ["timeInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"mrx-input-date\"\r\n [class.mrx-input-error]=\"invalid || innerInvalid\"\r\n [class.mrx-input-readonly]=\"readonly\"\r\n [class]=\"getClasses\"\r\n>\r\n <div class=\"\">\r\n <mrx-label *ngIf=\"timeLabel || dateLabel\">{{ dateLabel }}</mrx-label>\r\n <div class=\"mrx-input-date__wrapper\">\r\n <input\r\n #dateInput\r\n type=\"text\"\r\n autocomplete=\"nope\"\r\n class=\"mrx-input-date__input mrx-input-date__date\"\r\n [placeholder]=\"datePlaceholder\"\r\n [ngModel]=\"getDateValue\"\r\n [mask]=\"'00.00.0000 00:m0'\"\r\n [leadZeroDateTime]=\"true\"\r\n [validation]=\"false\"\r\n [disabled]=\"disabled\"\r\n [readOnly]=\"!isManualInput\"\r\n (input)=\"updateDateValue(dateInput)\"\r\n (click)=\"clickToInput(dateInput)\"\r\n (blur)=\"onBlur($event)\"\r\n />\r\n\r\n <div *ngIf=\"!disabled\" class=\"mrx-input-date__icons\">\r\n <span\r\n class=\"mrx-icon icon-close\"\r\n *ngIf=\"isViewCleanIcon\"\r\n (click)=\"clickToIconClear()\"\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'medium' || size === 'large'\"\r\n ></span>\r\n <span\r\n class=\"mrx-icon icon-calendar\"\r\n (click)=\"clickToIconCalendar()\"\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'medium' || size === 'large'\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <mrx-error-message\r\n *ngIf=\"invalid; else innerInvalidTemplate\"\r\n [invalidMessage]=\"invalidMessage\"\r\n ></mrx-error-message>\r\n\r\n <ng-template #innerInvalidTemplate>\r\n <mrx-error-message\r\n *ngIf=\"innerInvalid\"\r\n [invalidMessage]=\"innerInvalidMessage\"\r\n ></mrx-error-message>\r\n </ng-template>\r\n\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".mrx-input-date{width:100%;position:relative}.mrx-input-date .mrx-input-date__wrapper{position:relative}.mrx-input-date .mrx-input-date__input{border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);color:var(--neutral-text-primary);width:100%;transition:outline-width .2s,border .2s}.mrx-input-date .mrx-input-date__input:focus,.mrx-input-date .mrx-input-date__input:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-input-date .mrx-input-date__input:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-input-date .mrx-input-date__input:disabled{background-color:var(--neutral-bg-disabled);color:var(--neutral-text-tertiary)}.mrx-input-date.mrx-input-date-lg .mrx-input-date__input{padding:calc(var(--spacing-3) + var(--spacing-half) - var(--border-width-default)) calc(var(--spacing-4) - var(--border-width-default));font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-input-date.mrx-input-date-md .mrx-input-date__input{padding:calc(var(--spacing-2) + var(--spacing-half) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default));font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-input-date.mrx-input-date-sm .mrx-input-date__input{padding:calc(var(--spacing-2) - var(--border-width-default)) calc(var(--spacing-2) - var(--border-width-default));font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height)}.mrx-input-date.mrx-input-date.mrx-input-error .mrx-input-date__input{border-color:var(--system-bg-controls-negative-default)!important}.mrx-input-date.mrx-input-date.mrx-input-checked-error .mrx-input-date__input{border-color:var(--system-bg-controls-negative-default)!important;background-color:var(--system-bg-negative-secondary)!important}.mrx-input-date.mrx-input-date.mrx-input-checked-success .mrx-input-date__input{background-color:var(--system-bg-positive-secondary)!important;border-color:var(--system-bg-controls-positive-default)!important}.mrx-input-date.mrx-input-date .mrx-input-date__icons{position:absolute;top:0;right:0;display:flex;align-items:center}.mrx-input-date.mrx-input-date .mrx-input-date__icons-item,.mrx-input-date.mrx-input-date .mrx-input-date__icons .mrx-icon{cursor:pointer}.mrx-input-date.mrx-input-date.mrx-input-date-lg .mrx-icon{margin-top:calc(var(--spacing-3) - var(--border-width-default));margin-right:var(--spacing-3)}.mrx-input-date.mrx-input-date.mrx-input-date-md .mrx-icon{margin-top:calc(var(--spacing-2) - var(--border-width-default));margin-right:var(--spacing-3)}.mrx-input-date.mrx-input-date.mrx-input-date-sm .mrx-icon{margin-top:calc(var(--spacing-2) - var(--border-width-default));margin-right:var(--spacing-2)}\n"], components: [{ type: LabelComponent, selector: "mrx-label", inputs: ["requiredHidden", "required", "boldLabel", "disabled", "placeholder", "label", "customClasses", "triggerTextPosition", "isPublicInfo", "publicInfoTooltip", "isSwitch", "switchLabel", "switchValue", "isCheckbox", "checkboxLabel", "checkboxValue", "counter", "linkText", "linkPrevent", "linkType", "linkMonochrome", "href", "triggerType", "tooltip", "tooltipInitialVisible", "isSaveToStorage"], outputs: ["changeCheckboxValue", "clickedLink"] }, { type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$7.MaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "triggerOnMaskChange"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9438
9620
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateTimeComponent, decorators: [{
|
|
9439
9621
|
type: Component,
|
|
9440
9622
|
args: [{ selector: 'mrx-input-date-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
@@ -12690,153 +12872,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
12690
12872
|
}]
|
|
12691
12873
|
}] });
|
|
12692
12874
|
|
|
12693
|
-
class CheckboxComponent {
|
|
12694
|
-
constructor(tooltipService) {
|
|
12695
|
-
this.tooltipService = tooltipService;
|
|
12696
|
-
this.value = false;
|
|
12697
|
-
this._tooltip = '';
|
|
12698
|
-
this._tooltipInitialVisible = false;
|
|
12699
|
-
this._isSaveToStorage = false;
|
|
12700
|
-
// SAVE STATE
|
|
12701
|
-
this.uuid = v4();
|
|
12702
|
-
this.fields = [];
|
|
12703
|
-
this.required = false;
|
|
12704
|
-
this.boldLabel = false;
|
|
12705
|
-
this.indeterminate = false;
|
|
12706
|
-
this.disabled = false;
|
|
12707
|
-
this.readonly = false;
|
|
12708
|
-
this.label = '';
|
|
12709
|
-
this.customClasses = '';
|
|
12710
|
-
this.customWrapperClasses = '';
|
|
12711
|
-
this.invalid = false;
|
|
12712
|
-
this.checkInvalid = null;
|
|
12713
|
-
this.changed = new EventEmitter();
|
|
12714
|
-
this.modelChange = new EventEmitter();
|
|
12715
|
-
this.onChange = (value) => {
|
|
12716
|
-
};
|
|
12717
|
-
this.onTouched = () => {
|
|
12718
|
-
};
|
|
12719
|
-
}
|
|
12720
|
-
set tooltip(tooltip) {
|
|
12721
|
-
this._tooltip = tooltip;
|
|
12722
|
-
this.tooltipService.setTooltip = tooltip;
|
|
12723
|
-
}
|
|
12724
|
-
set tooltipInitialVisible(value) {
|
|
12725
|
-
this._tooltipInitialVisible = value;
|
|
12726
|
-
this.tooltipService.toggleTooltipVisibleFromCode(value);
|
|
12727
|
-
}
|
|
12728
|
-
set isSaveToStorage(value) {
|
|
12729
|
-
this._isSaveToStorage = value;
|
|
12730
|
-
this.tooltipService.setSaveToStorage = value;
|
|
12731
|
-
}
|
|
12732
|
-
get getWrapperClasses() {
|
|
12733
|
-
return `${this.customWrapperClasses}`;
|
|
12734
|
-
}
|
|
12735
|
-
get getClasses() {
|
|
12736
|
-
return `${this.customClasses} ${this.checkValidClasses}`;
|
|
12737
|
-
}
|
|
12738
|
-
get checkValidClasses() {
|
|
12739
|
-
return this.checkInvalid === false ?
|
|
12740
|
-
'mrx-input-checked-success' :
|
|
12741
|
-
this.checkInvalid === true ? 'mrx-input-checked-error' : '';
|
|
12742
|
-
}
|
|
12743
|
-
registerOnChange(fn) {
|
|
12744
|
-
this.onChange = fn;
|
|
12745
|
-
}
|
|
12746
|
-
registerOnTouched(fn) {
|
|
12747
|
-
this.onTouched = fn;
|
|
12748
|
-
}
|
|
12749
|
-
writeValue(outsideValue) {
|
|
12750
|
-
this.value = outsideValue;
|
|
12751
|
-
}
|
|
12752
|
-
setDisabledState(isDisabled) {
|
|
12753
|
-
this.disabled = isDisabled;
|
|
12754
|
-
}
|
|
12755
|
-
updateValue(insideValue) {
|
|
12756
|
-
this.value = insideValue;
|
|
12757
|
-
this.changed.emit(insideValue);
|
|
12758
|
-
this.modelChange.emit({ value: insideValue, id: this.uuid });
|
|
12759
|
-
this.onChange(insideValue);
|
|
12760
|
-
this.onTouched();
|
|
12761
|
-
}
|
|
12762
|
-
ngOnInit() {
|
|
12763
|
-
this.tooltipService.initTooltip(this._tooltip, this._tooltipInitialVisible);
|
|
12764
|
-
}
|
|
12765
|
-
}
|
|
12766
|
-
CheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxComponent, deps: [{ token: TooltipService }], target: i0.ɵɵFactoryTarget.Component });
|
|
12767
|
-
CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CheckboxComponent, selector: "mrx-checkbox", inputs: { fields: "fields", required: "required", boldLabel: "boldLabel", indeterminate: "indeterminate", disabled: "disabled", readonly: "readonly", label: "label", customClasses: "customClasses", customWrapperClasses: "customWrapperClasses", invalid: "invalid", checkInvalid: "checkInvalid", tooltip: "tooltip", tooltipInitialVisible: "tooltipInitialVisible", isSaveToStorage: "isSaveToStorage" }, outputs: { changed: "changed", modelChange: "modelChange" }, providers: [
|
|
12768
|
-
TooltipService,
|
|
12769
|
-
{
|
|
12770
|
-
provide: NG_VALUE_ACCESSOR,
|
|
12771
|
-
useExisting: forwardRef(() => CheckboxComponent),
|
|
12772
|
-
multi: true,
|
|
12773
|
-
},
|
|
12774
|
-
], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "labelContent", first: true, predicate: ["labelContent"], descendants: true }], ngImport: i0, template: "<div\r\n #input\r\n class=\"mrx-checkbox-wrapper\"\r\n [class]=\"getWrapperClasses\"\r\n>\r\n <label\r\n class=\"mrx-checkbox\"\r\n [class]=\"getClasses\"\r\n [class.mrx-checkbox-indeterminate]=\"indeterminate\"\r\n [class.mrx-checkbox-error]=\"invalid\"\r\n [class.mrx-checkbox-input-disabled]=\"disabled\"\r\n >\r\n <input\r\n type=\"checkbox\"\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-checkbox-mark\">\r\n <span class=\"mrx-icon icon-check icon-font-12 text-bold\" *ngIf=\"!indeterminate\"></span>\r\n </span>\r\n <span\r\n #labelContent\r\n [class]=\"boldLabel ? 'mrx-checkbox-label mrx-checkbox-label-bold' : 'mrx-checkbox-label'\"\r\n >\r\n {{label}}\r\n <ng-content></ng-content>\r\n <span *ngIf=\"required && !disabled\" class=\"required-active\">*</span>\r\n </span>\r\n </label>\r\n\r\n <mrx-tooltip-trigger\r\n *ngIf=\"tooltipService.getTooltip\"\r\n (toggleTooltip)=\"tooltipService.toggleTooltipVisible()\"\r\n [isVisibleTooltip]=\"tooltipService.getTooltipVisible\"\r\n ></mrx-tooltip-trigger>\r\n\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"checkbox\"></mrx-save-state>\r\n</div>\r\n\r\n<mrx-tooltip\r\n *ngIf=\"tooltipService.getTooltip\"\r\n [tooltip]=\"tooltipService.getTooltip\"\r\n [tooltipVisible]=\"tooltipService.getTooltipVisible\"\r\n></mrx-tooltip>\r\n", styles: [".mrx-checkbox{display:inline-flex;align-items:flex-start;position:relative;gap:var(--spacing-2)}.mrx-checkbox:hover .mrx-checkbox-mark{border-color:var(--neutral-bg-stroke-hover)}.mrx-checkbox:hover.mrx-input-disabled .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox]{min-height:auto;position:absolute;left:0;opacity:0;height:var(--sizing-4);width:var(--sizing-4);z-index:2;padding:0;margin:2px 0 0;cursor:pointer}.mrx-checkbox-wrapper{display:flex;align-items:center;justify-content:flex-start;position:relative;gap:var(--spacing-2)}.mrx-checkbox .mrx-checkbox-label{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-primary);-webkit-user-select:none;user-select:none;cursor:pointer}.mrx-checkbox .mrx-checkbox-label-bold{font-weight:var(--body-md-bold-font-weight)}.mrx-checkbox .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}.mrx-checkbox .mrx-checkbox-mark{display:block;height:var(--sizing-4);width:var(--sizing-4);min-width:var(--sizing-4);border:var(--border-width-checkbox) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);position:relative;margin-top:2px}.mrx-checkbox .mrx-checkbox-mark .mrx-icon{color:#fff;position:absolute;top:0;left:0;display:none}.mrx-checkbox input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--brand-bg-primary-default);background:var(--brand-bg-primary-default)}.mrx-checkbox input[type=checkbox]:checked+.mrx-checkbox-mark .mrx-icon{display:block}.mrx-checkbox input[type=checkbox][readonly]{cursor:default}.mrx-checkbox input[type=checkbox][readonly]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox][readonly]+.mrx-checkbox-mark{cursor:default;border-color:var(--neutral-control-bg-accent-disabled);background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox][readonly]+.mrx-checkbox-mark+.mrx-checkbox-label{cursor:default}.mrx-checkbox.mrx-checkbox-indeterminate .mrx-checkbox-mark{display:flex;align-items:center;justify-content:center}.mrx-checkbox.mrx-checkbox-indeterminate .mrx-checkbox-mark:after{content:\"\";display:block;width:6px;height:2px;background-color:var(--brand-bg-primary-default);border-radius:var(--border-radius-1)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled:hover .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled:hover .mrx-checkbox-mark:after{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled .mrx-checkbox-mark:after{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-bg-stroke-default);background:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]{cursor:default}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]+.mrx-checkbox-mark{cursor:default;background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]+.mrx-checkbox-mark+.mrx-checkbox-label{cursor:default}.mrx-checkbox.mrx-checkbox-error .mrx-checkbox-mark,.mrx-checkbox.mrx-input-checked-error .mrx-checkbox-mark{border-color:var(--system-bg-controls-negative-default)}.mrx-checkbox.mrx-input-checked-success input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--system-bg-controls-positive-default);background-color:var(--system-bg-controls-positive-default)}.mrx-checkbox.mrx-input-checked-success .mrx-checkbox-mark{border-color:var(--system-bg-controls-positive-default)}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]{cursor:default}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark .mrx-icon{display:block}.mrx-checkbox.mrx-checkbox-input-disabled .mrx-checkbox-mark{cursor:default;border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-input-disabled .mrx-checkbox-label{cursor:default}\n"], components: [{ type: TooltipTriggerComponent, selector: "mrx-tooltip-trigger", inputs: ["triggerTextPosition", "triggerType", "customClasses", "isVisibleTooltip"], outputs: ["toggleTooltip"] }, { type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }, { type: TooltipComponent, selector: "mrx-tooltip", inputs: ["tooltip", "tooltipVisible", "tooltipInitiallyVisible", "triggerType"], outputs: ["visibilityChanged"] }], directives: [{ type: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
12775
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
12776
|
-
type: Component,
|
|
12777
|
-
args: [{ selector: 'mrx-checkbox', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
12778
|
-
TooltipService,
|
|
12779
|
-
{
|
|
12780
|
-
provide: NG_VALUE_ACCESSOR,
|
|
12781
|
-
useExisting: forwardRef(() => CheckboxComponent),
|
|
12782
|
-
multi: true,
|
|
12783
|
-
},
|
|
12784
|
-
], template: "<div\r\n #input\r\n class=\"mrx-checkbox-wrapper\"\r\n [class]=\"getWrapperClasses\"\r\n>\r\n <label\r\n class=\"mrx-checkbox\"\r\n [class]=\"getClasses\"\r\n [class.mrx-checkbox-indeterminate]=\"indeterminate\"\r\n [class.mrx-checkbox-error]=\"invalid\"\r\n [class.mrx-checkbox-input-disabled]=\"disabled\"\r\n >\r\n <input\r\n type=\"checkbox\"\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-checkbox-mark\">\r\n <span class=\"mrx-icon icon-check icon-font-12 text-bold\" *ngIf=\"!indeterminate\"></span>\r\n </span>\r\n <span\r\n #labelContent\r\n [class]=\"boldLabel ? 'mrx-checkbox-label mrx-checkbox-label-bold' : 'mrx-checkbox-label'\"\r\n >\r\n {{label}}\r\n <ng-content></ng-content>\r\n <span *ngIf=\"required && !disabled\" class=\"required-active\">*</span>\r\n </span>\r\n </label>\r\n\r\n <mrx-tooltip-trigger\r\n *ngIf=\"tooltipService.getTooltip\"\r\n (toggleTooltip)=\"tooltipService.toggleTooltipVisible()\"\r\n [isVisibleTooltip]=\"tooltipService.getTooltipVisible\"\r\n ></mrx-tooltip-trigger>\r\n\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\" type=\"checkbox\"></mrx-save-state>\r\n</div>\r\n\r\n<mrx-tooltip\r\n *ngIf=\"tooltipService.getTooltip\"\r\n [tooltip]=\"tooltipService.getTooltip\"\r\n [tooltipVisible]=\"tooltipService.getTooltipVisible\"\r\n></mrx-tooltip>\r\n", styles: [".mrx-checkbox{display:inline-flex;align-items:flex-start;position:relative;gap:var(--spacing-2)}.mrx-checkbox:hover .mrx-checkbox-mark{border-color:var(--neutral-bg-stroke-hover)}.mrx-checkbox:hover.mrx-input-disabled .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox]{min-height:auto;position:absolute;left:0;opacity:0;height:var(--sizing-4);width:var(--sizing-4);z-index:2;padding:0;margin:2px 0 0;cursor:pointer}.mrx-checkbox-wrapper{display:flex;align-items:center;justify-content:flex-start;position:relative;gap:var(--spacing-2)}.mrx-checkbox .mrx-checkbox-label{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-primary);-webkit-user-select:none;user-select:none;cursor:pointer}.mrx-checkbox .mrx-checkbox-label-bold{font-weight:var(--body-md-bold-font-weight)}.mrx-checkbox .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}.mrx-checkbox .mrx-checkbox-mark{display:block;height:var(--sizing-4);width:var(--sizing-4);min-width:var(--sizing-4);border:var(--border-width-checkbox) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);position:relative;margin-top:2px}.mrx-checkbox .mrx-checkbox-mark .mrx-icon{color:#fff;position:absolute;top:0;left:0;display:none}.mrx-checkbox input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--brand-bg-primary-default);background:var(--brand-bg-primary-default)}.mrx-checkbox input[type=checkbox]:checked+.mrx-checkbox-mark .mrx-icon{display:block}.mrx-checkbox input[type=checkbox][readonly]{cursor:default}.mrx-checkbox input[type=checkbox][readonly]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox][readonly]+.mrx-checkbox-mark{cursor:default;border-color:var(--neutral-control-bg-accent-disabled);background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox input[type=checkbox][readonly]+.mrx-checkbox-mark+.mrx-checkbox-label{cursor:default}.mrx-checkbox.mrx-checkbox-indeterminate .mrx-checkbox-mark{display:flex;align-items:center;justify-content:center}.mrx-checkbox.mrx-checkbox-indeterminate .mrx-checkbox-mark:after{content:\"\";display:block;width:6px;height:2px;background-color:var(--brand-bg-primary-default);border-radius:var(--border-radius-1)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled:hover .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled:hover .mrx-checkbox-mark:after{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled .mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate.mrx-checkbox-input-disabled .mrx-checkbox-mark:after{background-color:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-bg-stroke-default);background:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]{cursor:default}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]+.mrx-checkbox-mark{cursor:default;background-color:transparent}.mrx-checkbox.mrx-checkbox-indeterminate input[type=checkbox][readonly]+.mrx-checkbox-mark+.mrx-checkbox-label{cursor:default}.mrx-checkbox.mrx-checkbox-error .mrx-checkbox-mark,.mrx-checkbox.mrx-input-checked-error .mrx-checkbox-mark{border-color:var(--system-bg-controls-negative-default)}.mrx-checkbox.mrx-input-checked-success input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--system-bg-controls-positive-default);background-color:var(--system-bg-controls-positive-default)}.mrx-checkbox.mrx-input-checked-success .mrx-checkbox-mark{border-color:var(--system-bg-controls-positive-default)}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]{cursor:default}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark{border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-input-disabled input[type=checkbox]:checked+.mrx-checkbox-mark .mrx-icon{display:block}.mrx-checkbox.mrx-checkbox-input-disabled .mrx-checkbox-mark{cursor:default;border-color:var(--neutral-control-bg-accent-disabled);background:var(--neutral-control-bg-accent-disabled)}.mrx-checkbox.mrx-checkbox-input-disabled .mrx-checkbox-label{cursor:default}\n"] }]
|
|
12785
|
-
}], ctorParameters: function () { return [{ type: TooltipService }]; }, propDecorators: { fields: [{
|
|
12786
|
-
type: Input
|
|
12787
|
-
}], required: [{
|
|
12788
|
-
type: Input
|
|
12789
|
-
}], boldLabel: [{
|
|
12790
|
-
type: Input
|
|
12791
|
-
}], indeterminate: [{
|
|
12792
|
-
type: Input
|
|
12793
|
-
}], disabled: [{
|
|
12794
|
-
type: Input
|
|
12795
|
-
}], readonly: [{
|
|
12796
|
-
type: Input
|
|
12797
|
-
}], label: [{
|
|
12798
|
-
type: Input
|
|
12799
|
-
}], customClasses: [{
|
|
12800
|
-
type: Input
|
|
12801
|
-
}], customWrapperClasses: [{
|
|
12802
|
-
type: Input
|
|
12803
|
-
}], invalid: [{
|
|
12804
|
-
type: Input
|
|
12805
|
-
}], checkInvalid: [{
|
|
12806
|
-
type: Input
|
|
12807
|
-
}], tooltip: [{
|
|
12808
|
-
type: Input
|
|
12809
|
-
}], tooltipInitialVisible: [{
|
|
12810
|
-
type: Input
|
|
12811
|
-
}], isSaveToStorage: [{
|
|
12812
|
-
type: Input
|
|
12813
|
-
}], input: [{
|
|
12814
|
-
type: ViewChild,
|
|
12815
|
-
args: ['input']
|
|
12816
|
-
}], labelContent: [{
|
|
12817
|
-
type: ViewChild,
|
|
12818
|
-
args: ['labelContent']
|
|
12819
|
-
}], changed: [{
|
|
12820
|
-
type: Output
|
|
12821
|
-
}], modelChange: [{
|
|
12822
|
-
type: Output
|
|
12823
|
-
}] } });
|
|
12824
|
-
|
|
12825
|
-
class CheckboxModule {
|
|
12826
|
-
}
|
|
12827
|
-
CheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
12828
|
-
CheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxModule, declarations: [CheckboxComponent], imports: [CommonModule, FormsModule, TooltipModule, SaveStateModule], exports: [CheckboxComponent] });
|
|
12829
|
-
CheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxModule, imports: [[CommonModule, FormsModule, TooltipModule, SaveStateModule]] });
|
|
12830
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxModule, decorators: [{
|
|
12831
|
-
type: NgModule,
|
|
12832
|
-
args: [{
|
|
12833
|
-
declarations: [CheckboxComponent],
|
|
12834
|
-
imports: [CommonModule, FormsModule, TooltipModule, SaveStateModule],
|
|
12835
|
-
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
|
12836
|
-
exports: [CheckboxComponent],
|
|
12837
|
-
}]
|
|
12838
|
-
}] });
|
|
12839
|
-
|
|
12840
12875
|
const getSortedList = (list, sortable) => {
|
|
12841
12876
|
if (!list || !sortable)
|
|
12842
12877
|
return list;
|
|
@@ -13045,7 +13080,7 @@ class CheckboxGroupHeaderComponent {
|
|
|
13045
13080
|
}
|
|
13046
13081
|
}
|
|
13047
13082
|
CheckboxGroupHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxGroupHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13048
|
-
CheckboxGroupHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CheckboxGroupHeaderComponent, selector: "mrx-checkbox-group-header", inputs: { searchable: "searchable", searchPlaceholder: "searchPlaceholder", tooltip: "tooltip", labelText: "labelText", linkText: "linkText", checkedItemsCount: "checkedItemsCount" }, outputs: { updateCheckboxGroupSearchValue: "updateCheckboxGroupSearchValue", clearFilters: "clearFilters" }, ngImport: i0, template: "<mrx-label\r\n *ngIf=\"labelText\"\r\n [counter]=\"checkedItemsCount\"\r\n [linkText]=\"linkText\"\r\n [tooltip]=\"tooltip\"\r\n (clickedLink)=\"onClearFilters()\"\r\n>{{ labelText }}</mrx-label>\r\n\r\n<div class=\"mrx-checkbox-group-head--search\" *ngIf=\"searchable\">\r\n <mrx-input-search\r\n [ngModel]=\"searchValue\"\r\n [size]=\"'medium'\"\r\n [placeholder]=\"searchPlaceholder\"\r\n (ngModelChange)=\"changeSearchValue($event)\"\r\n ></mrx-input-search>\r\n</div>\r\n", styles: [".mrx-checkbox-group-head--search{margin-bottom:12px}\n"], components: [{ type: LabelComponent, selector: "mrx-label", inputs: ["requiredHidden", "required", "boldLabel", "disabled", "placeholder", "label", "customClasses", "triggerTextPosition", "isPublicInfo", "publicInfoTooltip", "isSwitch", "switchLabel", "switchValue", "counter", "linkText", "linkPrevent", "linkType", "linkMonochrome", "href", "triggerType", "tooltip", "tooltipInitialVisible", "isSaveToStorage"], outputs: ["changeCheckboxValue", "clickedLink"] }, { type: InputSearchComponent, selector: "mrx-input-search", inputs: ["fields", "disabled", "required", "readonly", "maxlength", "minlength", "placeholder", "customClasses", "mask", "size", "invalid", "invalidMessage", "checkInvalid", "restrictInput"], outputs: ["changed", "modelChange", "blurred", "cleared", "searched"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
13083
|
+
CheckboxGroupHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CheckboxGroupHeaderComponent, selector: "mrx-checkbox-group-header", inputs: { searchable: "searchable", searchPlaceholder: "searchPlaceholder", tooltip: "tooltip", labelText: "labelText", linkText: "linkText", checkedItemsCount: "checkedItemsCount" }, outputs: { updateCheckboxGroupSearchValue: "updateCheckboxGroupSearchValue", clearFilters: "clearFilters" }, ngImport: i0, template: "<mrx-label\r\n *ngIf=\"labelText\"\r\n [counter]=\"checkedItemsCount\"\r\n [linkText]=\"linkText\"\r\n [tooltip]=\"tooltip\"\r\n (clickedLink)=\"onClearFilters()\"\r\n>{{ labelText }}</mrx-label>\r\n\r\n<div class=\"mrx-checkbox-group-head--search\" *ngIf=\"searchable\">\r\n <mrx-input-search\r\n [ngModel]=\"searchValue\"\r\n [size]=\"'medium'\"\r\n [placeholder]=\"searchPlaceholder\"\r\n (ngModelChange)=\"changeSearchValue($event)\"\r\n ></mrx-input-search>\r\n</div>\r\n", styles: [".mrx-checkbox-group-head--search{margin-bottom:12px}\n"], components: [{ type: LabelComponent, selector: "mrx-label", inputs: ["requiredHidden", "required", "boldLabel", "disabled", "placeholder", "label", "customClasses", "triggerTextPosition", "isPublicInfo", "publicInfoTooltip", "isSwitch", "switchLabel", "switchValue", "isCheckbox", "checkboxLabel", "checkboxValue", "counter", "linkText", "linkPrevent", "linkType", "linkMonochrome", "href", "triggerType", "tooltip", "tooltipInitialVisible", "isSaveToStorage"], outputs: ["changeCheckboxValue", "clickedLink"] }, { type: InputSearchComponent, selector: "mrx-input-search", inputs: ["fields", "disabled", "required", "readonly", "maxlength", "minlength", "placeholder", "customClasses", "mask", "size", "invalid", "invalidMessage", "checkInvalid", "restrictInput"], outputs: ["changed", "modelChange", "blurred", "cleared", "searched"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
13049
13084
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxGroupHeaderComponent, decorators: [{
|
|
13050
13085
|
type: Component,
|
|
13051
13086
|
args: [{ selector: 'mrx-checkbox-group-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mrx-label\r\n *ngIf=\"labelText\"\r\n [counter]=\"checkedItemsCount\"\r\n [linkText]=\"linkText\"\r\n [tooltip]=\"tooltip\"\r\n (clickedLink)=\"onClearFilters()\"\r\n>{{ labelText }}</mrx-label>\r\n\r\n<div class=\"mrx-checkbox-group-head--search\" *ngIf=\"searchable\">\r\n <mrx-input-search\r\n [ngModel]=\"searchValue\"\r\n [size]=\"'medium'\"\r\n [placeholder]=\"searchPlaceholder\"\r\n (ngModelChange)=\"changeSearchValue($event)\"\r\n ></mrx-input-search>\r\n</div>\r\n", styles: [".mrx-checkbox-group-head--search{margin-bottom:12px}\n"] }]
|
|
@@ -13590,7 +13625,7 @@ class RadioGroupHeaderComponent {
|
|
|
13590
13625
|
}
|
|
13591
13626
|
}
|
|
13592
13627
|
RadioGroupHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: RadioGroupHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13593
|
-
RadioGroupHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: RadioGroupHeaderComponent, selector: "mrx-radio-group-header", inputs: { searchSize: "searchSize", searchable: "searchable", searchPlaceholder: "searchPlaceholder", tooltip: "tooltip", labelText: "labelText", linkText: "linkText", checkedItemsCount: "checkedItemsCount", required: "required" }, outputs: { updateradioGroupSearchValue: "updateradioGroupSearchValue" }, ngImport: i0, template: "<mrx-label\r\n *ngIf=\"labelText\"\r\n [tooltip]=\"tooltip\"\r\n [required]=\"required\"\r\n>{{ labelText }}</mrx-label>\r\n\r\n<div class=\"mrx-radio-group-head--search mb-12px\" *ngIf=\"searchable\">\r\n <mrx-input-search\r\n [ngModel]=\"searchValue\"\r\n [size]=\"searchSize\"\r\n [placeholder]=\"searchPlaceholder\"\r\n (ngModelChange)=\"changeSearchValue($event)\"\r\n ></mrx-input-search>\r\n</div>\r\n", components: [{ type: LabelComponent, selector: "mrx-label", inputs: ["requiredHidden", "required", "boldLabel", "disabled", "placeholder", "label", "customClasses", "triggerTextPosition", "isPublicInfo", "publicInfoTooltip", "isSwitch", "switchLabel", "switchValue", "counter", "linkText", "linkPrevent", "linkType", "linkMonochrome", "href", "triggerType", "tooltip", "tooltipInitialVisible", "isSaveToStorage"], outputs: ["changeCheckboxValue", "clickedLink"] }, { type: InputSearchComponent, selector: "mrx-input-search", inputs: ["fields", "disabled", "required", "readonly", "maxlength", "minlength", "placeholder", "customClasses", "mask", "size", "invalid", "invalidMessage", "checkInvalid", "restrictInput"], outputs: ["changed", "modelChange", "blurred", "cleared", "searched"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
13628
|
+
RadioGroupHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: RadioGroupHeaderComponent, selector: "mrx-radio-group-header", inputs: { searchSize: "searchSize", searchable: "searchable", searchPlaceholder: "searchPlaceholder", tooltip: "tooltip", labelText: "labelText", linkText: "linkText", checkedItemsCount: "checkedItemsCount", required: "required" }, outputs: { updateradioGroupSearchValue: "updateradioGroupSearchValue" }, ngImport: i0, template: "<mrx-label\r\n *ngIf=\"labelText\"\r\n [tooltip]=\"tooltip\"\r\n [required]=\"required\"\r\n>{{ labelText }}</mrx-label>\r\n\r\n<div class=\"mrx-radio-group-head--search mb-12px\" *ngIf=\"searchable\">\r\n <mrx-input-search\r\n [ngModel]=\"searchValue\"\r\n [size]=\"searchSize\"\r\n [placeholder]=\"searchPlaceholder\"\r\n (ngModelChange)=\"changeSearchValue($event)\"\r\n ></mrx-input-search>\r\n</div>\r\n", components: [{ type: LabelComponent, selector: "mrx-label", inputs: ["requiredHidden", "required", "boldLabel", "disabled", "placeholder", "label", "customClasses", "triggerTextPosition", "isPublicInfo", "publicInfoTooltip", "isSwitch", "switchLabel", "switchValue", "isCheckbox", "checkboxLabel", "checkboxValue", "counter", "linkText", "linkPrevent", "linkType", "linkMonochrome", "href", "triggerType", "tooltip", "tooltipInitialVisible", "isSaveToStorage"], outputs: ["changeCheckboxValue", "clickedLink"] }, { type: InputSearchComponent, selector: "mrx-input-search", inputs: ["fields", "disabled", "required", "readonly", "maxlength", "minlength", "placeholder", "customClasses", "mask", "size", "invalid", "invalidMessage", "checkInvalid", "restrictInput"], outputs: ["changed", "modelChange", "blurred", "cleared", "searched"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
13594
13629
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: RadioGroupHeaderComponent, decorators: [{
|
|
13595
13630
|
type: Component,
|
|
13596
13631
|
args: [{ selector: 'mrx-radio-group-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mrx-label\r\n *ngIf=\"labelText\"\r\n [tooltip]=\"tooltip\"\r\n [required]=\"required\"\r\n>{{ labelText }}</mrx-label>\r\n\r\n<div class=\"mrx-radio-group-head--search mb-12px\" *ngIf=\"searchable\">\r\n <mrx-input-search\r\n [ngModel]=\"searchValue\"\r\n [size]=\"searchSize\"\r\n [placeholder]=\"searchPlaceholder\"\r\n (ngModelChange)=\"changeSearchValue($event)\"\r\n ></mrx-input-search>\r\n</div>\r\n" }]
|