myrta-ui 17.1.57 → 17.1.59
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/esm2022/lib/components/form/input-date/input-date.component.mjs +7 -3
- package/esm2022/lib/components/form/input-date-time/input-date-time.component.mjs +8 -9
- package/fesm2022/myrta-ui.mjs +13 -10
- package/fesm2022/myrta-ui.mjs.map +1 -1
- package/lib/components/form/input-date/input-date.component.d.ts +2 -1
- package/lib/components/form/input-date-time/input-date-time.component.d.ts +3 -2
- package/package.json +1 -1
package/fesm2022/myrta-ui.mjs
CHANGED
|
@@ -9873,6 +9873,7 @@ class InputDateComponent {
|
|
|
9873
9873
|
invalid = false;
|
|
9874
9874
|
invalidMessage = '';
|
|
9875
9875
|
checkInvalid = null;
|
|
9876
|
+
scrollStrategy = 'reposition';
|
|
9876
9877
|
changed = new EventEmitter();
|
|
9877
9878
|
modelChange = new EventEmitter();
|
|
9878
9879
|
blurred = new EventEmitter();
|
|
@@ -10029,7 +10030,8 @@ class InputDateComponent {
|
|
|
10029
10030
|
.withPositions(PositionStrategyEnum[this.popupPosition]);
|
|
10030
10031
|
this._overlayRef = this._overlay.create({
|
|
10031
10032
|
positionStrategy,
|
|
10032
|
-
hasBackdrop: false
|
|
10033
|
+
hasBackdrop: false,
|
|
10034
|
+
scrollStrategy: this.scrollStrategy === 'reposition' ? this._overlay.scrollStrategies.reposition() : this._overlay.scrollStrategies.close(),
|
|
10033
10035
|
});
|
|
10034
10036
|
const portal = new ComponentPortal(DateCalendarComponent);
|
|
10035
10037
|
const componentRef = this._overlayRef.attach(portal);
|
|
@@ -10083,7 +10085,7 @@ class InputDateComponent {
|
|
|
10083
10085
|
this.onTouched();
|
|
10084
10086
|
}
|
|
10085
10087
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputDateComponent, deps: [{ token: i1$3.Overlay }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
10086
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputDateComponent, selector: "mrx-input-date", inputs: { fields: "fields", format: "format", minDate: "minDate", maxDate: "maxDate", isSilentValidation: "isSilentValidation", isManualInput: "isManualInput", closeAfterSelect: "closeAfterSelect", required: "required", size: "size", customClasses: "customClasses", disabled: "disabled", readonly: "readonly", placeholder: "placeholder", popupPosition: "popupPosition", invalid: "invalid", invalidMessage: "invalidMessage", checkInvalid: "checkInvalid" }, outputs: { changed: "changed", modelChange: "modelChange", blurred: "blurred" }, providers: [
|
|
10088
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputDateComponent, selector: "mrx-input-date", inputs: { fields: "fields", format: "format", minDate: "minDate", maxDate: "maxDate", isSilentValidation: "isSilentValidation", isManualInput: "isManualInput", closeAfterSelect: "closeAfterSelect", required: "required", size: "size", customClasses: "customClasses", disabled: "disabled", readonly: "readonly", placeholder: "placeholder", popupPosition: "popupPosition", invalid: "invalid", invalidMessage: "invalidMessage", checkInvalid: "checkInvalid", scrollStrategy: "scrollStrategy" }, outputs: { changed: "changed", modelChange: "modelChange", blurred: "blurred" }, providers: [
|
|
10087
10089
|
{
|
|
10088
10090
|
provide: NG_VALUE_ACCESSOR,
|
|
10089
10091
|
useExisting: forwardRef(() => InputDateComponent),
|
|
@@ -10134,6 +10136,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
10134
10136
|
type: Input
|
|
10135
10137
|
}], checkInvalid: [{
|
|
10136
10138
|
type: Input
|
|
10139
|
+
}], scrollStrategy: [{
|
|
10140
|
+
type: Input
|
|
10137
10141
|
}], changed: [{
|
|
10138
10142
|
type: Output
|
|
10139
10143
|
}], modelChange: [{
|
|
@@ -10399,8 +10403,8 @@ class InputDateTimeComponent {
|
|
|
10399
10403
|
checkInvalid = null;
|
|
10400
10404
|
minDate = '';
|
|
10401
10405
|
maxDate = '';
|
|
10406
|
+
calendarPosition = 'bottom-start';
|
|
10402
10407
|
dateInput;
|
|
10403
|
-
timeInput;
|
|
10404
10408
|
changed = new EventEmitter();
|
|
10405
10409
|
modelChange = new EventEmitter();
|
|
10406
10410
|
blurred = new EventEmitter();
|
|
@@ -10418,9 +10422,9 @@ class InputDateTimeComponent {
|
|
|
10418
10422
|
minDate: this.minDate ? formattingFromMoscowTimezone(this.minDate, this.timezone) : '',
|
|
10419
10423
|
maxDate: this.maxDate ? formattingFromMoscowTimezone(this.maxDate, this.timezone) : '',
|
|
10420
10424
|
inline: this.inline,
|
|
10421
|
-
position({ $datepicker, $target, $pointer, done }) {
|
|
10425
|
+
position: ({ $datepicker, $target, $pointer, done }) => {
|
|
10422
10426
|
let popper = createPopper($target, $datepicker, {
|
|
10423
|
-
placement:
|
|
10427
|
+
placement: this.calendarPosition,
|
|
10424
10428
|
modifiers: [
|
|
10425
10429
|
{
|
|
10426
10430
|
name: 'flip',
|
|
@@ -10703,9 +10707,9 @@ class InputDateTimeComponent {
|
|
|
10703
10707
|
});
|
|
10704
10708
|
}
|
|
10705
10709
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputDateTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10706
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", 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", timezone: "timezone", inline: "inline", isManualInput: "isManualInput", addMinTime: "addMinTime", addMaxTime: "addMaxTime", addMinTimeObj: "addMinTimeObj", addMaxTimeObj: "addMaxTimeObj", disableValidate: "disableValidate", disableIncludes: "disableIncludes", container: "container", invalid: "invalid", invalidMessage: "invalidMessage", checkInvalid: "checkInvalid", minDate: "minDate", maxDate: "maxDate" }, outputs: { changed: "changed", modelChange: "modelChange", blurred: "blurred" }, providers: [
|
|
10710
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", 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", timezone: "timezone", inline: "inline", isManualInput: "isManualInput", addMinTime: "addMinTime", addMaxTime: "addMaxTime", addMinTimeObj: "addMinTimeObj", addMaxTimeObj: "addMaxTimeObj", disableValidate: "disableValidate", disableIncludes: "disableIncludes", container: "container", invalid: "invalid", invalidMessage: "invalidMessage", checkInvalid: "checkInvalid", minDate: "minDate", maxDate: "maxDate", calendarPosition: "calendarPosition" }, outputs: { changed: "changed", modelChange: "modelChange", blurred: "blurred" }, providers: [
|
|
10707
10711
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => InputDateTimeComponent), multi: true }
|
|
10708
|
-
], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }
|
|
10712
|
+
], 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.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)}.mrx-input-date.mrx-input-date.mrx-input-checked-error .mrx-input-date__input{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-input-date.mrx-input-date.mrx-input-checked-error .mrx-input-date__input:disabled{background-color:var(--neutral-bg-disabled, #EEF0F4);border-color:var(--neutral-bg-stroke-default)}.mrx-input-date.mrx-input-date.mrx-input-checked-success .mrx-input-date__input{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-input-date.mrx-input-date.mrx-input-checked-success .mrx-input-date__input:disabled{background-color:var(--neutral-bg-disabled, #EEF0F4);border-color:var(--neutral-bg-stroke-default)}.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"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }, { kind: "component", type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { kind: "component", 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: ["changeSwitchValue", "changeCheckboxValue", "clickedLink"] }, { kind: "directive", type: i6.NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10709
10713
|
}
|
|
10710
10714
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputDateTimeComponent, decorators: [{
|
|
10711
10715
|
type: Component,
|
|
@@ -10766,12 +10770,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
10766
10770
|
type: Input
|
|
10767
10771
|
}], maxDate: [{
|
|
10768
10772
|
type: Input
|
|
10773
|
+
}], calendarPosition: [{
|
|
10774
|
+
type: Input
|
|
10769
10775
|
}], dateInput: [{
|
|
10770
10776
|
type: ViewChild,
|
|
10771
10777
|
args: ['dateInput']
|
|
10772
|
-
}], timeInput: [{
|
|
10773
|
-
type: ViewChild,
|
|
10774
|
-
args: ['timeInput']
|
|
10775
10778
|
}], changed: [{
|
|
10776
10779
|
type: Output
|
|
10777
10780
|
}], modelChange: [{
|