myrta-ui 1.1.8 → 1.1.9
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/input-date-time/input-date-time.component.mjs +2 -2
- package/fesm2015/myrta-ui.mjs +4 -4
- package/fesm2015/myrta-ui.mjs.map +1 -1
- package/fesm2020/myrta-ui.mjs +4 -4
- package/fesm2020/myrta-ui.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -90,7 +90,7 @@ CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
|
|
|
90
90
|
useExisting: forwardRef(() => CheckboxComponent),
|
|
91
91
|
multi: true,
|
|
92
92
|
},
|
|
93
|
-
], 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:
|
|
93
|
+
], 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: i2.TooltipTriggerComponent, selector: "mrx-tooltip-trigger", inputs: ["triggerTextPosition", "triggerType", "customClasses", "isVisibleTooltip"], outputs: ["toggleTooltip"] }, { type: i3.SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }, { type: i4.TooltipComponent, selector: "mrx-tooltip", inputs: ["tooltip", "tooltipVisible", "tooltipInitiallyVisible", "triggerType"], outputs: ["visibilityChanged"] }], directives: [{ type: i5.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
94
94
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
95
95
|
type: Component,
|
|
96
96
|
args: [{ selector: 'mrx-checkbox', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
@@ -100,7 +100,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
100
100
|
useExisting: forwardRef(() => CheckboxComponent),
|
|
101
101
|
multi: true,
|
|
102
102
|
},
|
|
103
|
-
], 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:
|
|
103
|
+
], 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"] }]
|
|
104
104
|
}], ctorParameters: function () { return [{ type: i1.TooltipService }]; }, propDecorators: { fields: [{
|
|
105
105
|
type: Input
|
|
106
106
|
}], required: [{
|
|
@@ -333,12 +333,12 @@ export class InputDateTimeComponent {
|
|
|
333
333
|
InputDateTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
334
334
|
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" }, providers: [
|
|
335
335
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => InputDateTimeComponent), multi: true }
|
|
336
|
-
], 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 />\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
|
|
336
|
+
], 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 />\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: i1.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: i2.ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { type: i3.SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.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: i6.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
337
337
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateTimeComponent, decorators: [{
|
|
338
338
|
type: Component,
|
|
339
339
|
args: [{ selector: 'mrx-input-date-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
340
340
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => InputDateTimeComponent), multi: true }
|
|
341
|
-
], 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 />\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
|
|
341
|
+
], 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 />\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"] }]
|
|
342
342
|
}], ctorParameters: function () { return []; }, propDecorators: { fields: [{
|
|
343
343
|
type: Input
|
|
344
344
|
}], size: [{
|
package/fesm2015/myrta-ui.mjs
CHANGED
|
@@ -9397,12 +9397,12 @@ class InputDateTimeComponent {
|
|
|
9397
9397
|
InputDateTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9398
9398
|
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" }, providers: [
|
|
9399
9399
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => InputDateTimeComponent), multi: true }
|
|
9400
|
-
], 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 />\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
|
|
9400
|
+
], 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 />\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: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9401
9401
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateTimeComponent, decorators: [{
|
|
9402
9402
|
type: Component,
|
|
9403
9403
|
args: [{ selector: 'mrx-input-date-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
9404
9404
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => InputDateTimeComponent), multi: true }
|
|
9405
|
-
], 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 />\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
|
|
9405
|
+
], 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 />\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"] }]
|
|
9406
9406
|
}], ctorParameters: function () { return []; }, propDecorators: { fields: [{
|
|
9407
9407
|
type: Input
|
|
9408
9408
|
}], size: [{
|
|
@@ -12641,7 +12641,7 @@ CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
|
|
|
12641
12641
|
useExisting: forwardRef(() => CheckboxComponent),
|
|
12642
12642
|
multi: true,
|
|
12643
12643
|
},
|
|
12644
|
-
], 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:
|
|
12644
|
+
], 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: i3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
12645
12645
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
12646
12646
|
type: Component,
|
|
12647
12647
|
args: [{ selector: 'mrx-checkbox', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
@@ -12651,7 +12651,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
12651
12651
|
useExisting: forwardRef(() => CheckboxComponent),
|
|
12652
12652
|
multi: true,
|
|
12653
12653
|
},
|
|
12654
|
-
], 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:
|
|
12654
|
+
], 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"] }]
|
|
12655
12655
|
}], ctorParameters: function () { return [{ type: TooltipService }]; }, propDecorators: { fields: [{
|
|
12656
12656
|
type: Input
|
|
12657
12657
|
}], required: [{
|