myrta-ui 1.1.97 → 1.1.99
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/form/input-date/input-date.component.mjs +7 -3
- package/esm2020/lib/components/form/input-date-time/input-date-time.component.mjs +8 -8
- package/fesm2015/myrta-ui.mjs +13 -9
- package/fesm2015/myrta-ui.mjs.map +1 -1
- package/fesm2020/myrta-ui.mjs +13 -9
- package/fesm2020/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/fesm2015/myrta-ui.mjs
CHANGED
|
@@ -9746,6 +9746,7 @@ class InputDateComponent {
|
|
|
9746
9746
|
this.invalid = false;
|
|
9747
9747
|
this.invalidMessage = '';
|
|
9748
9748
|
this.checkInvalid = null;
|
|
9749
|
+
this.scrollStrategy = 'reposition';
|
|
9749
9750
|
this.changed = new EventEmitter();
|
|
9750
9751
|
this.modelChange = new EventEmitter();
|
|
9751
9752
|
this.blurred = new EventEmitter();
|
|
@@ -9900,7 +9901,8 @@ class InputDateComponent {
|
|
|
9900
9901
|
.withPositions(PositionStrategyEnum[this.popupPosition]);
|
|
9901
9902
|
this._overlayRef = this._overlay.create({
|
|
9902
9903
|
positionStrategy,
|
|
9903
|
-
hasBackdrop: false
|
|
9904
|
+
hasBackdrop: false,
|
|
9905
|
+
scrollStrategy: this.scrollStrategy === 'reposition' ? this._overlay.scrollStrategies.reposition() : this._overlay.scrollStrategies.close(),
|
|
9904
9906
|
});
|
|
9905
9907
|
const portal = new ComponentPortal(DateCalendarComponent);
|
|
9906
9908
|
const componentRef = this._overlayRef.attach(portal);
|
|
@@ -9955,7 +9957,7 @@ class InputDateComponent {
|
|
|
9955
9957
|
}
|
|
9956
9958
|
}
|
|
9957
9959
|
InputDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateComponent, deps: [{ token: i1$2.Overlay }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
9958
|
-
InputDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", 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: [
|
|
9960
|
+
InputDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", 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: [
|
|
9959
9961
|
{
|
|
9960
9962
|
provide: NG_VALUE_ACCESSOR,
|
|
9961
9963
|
useExisting: forwardRef(() => InputDateComponent),
|
|
@@ -10005,6 +10007,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
10005
10007
|
type: Input
|
|
10006
10008
|
}], checkInvalid: [{
|
|
10007
10009
|
type: Input
|
|
10010
|
+
}], scrollStrategy: [{
|
|
10011
|
+
type: Input
|
|
10008
10012
|
}], changed: [{
|
|
10009
10013
|
type: Output
|
|
10010
10014
|
}], modelChange: [{
|
|
@@ -10270,6 +10274,7 @@ class InputDateTimeComponent {
|
|
|
10270
10274
|
this.checkInvalid = null;
|
|
10271
10275
|
this.minDate = '';
|
|
10272
10276
|
this.maxDate = '';
|
|
10277
|
+
this.calendarPosition = 'bottom-start';
|
|
10273
10278
|
this.changed = new EventEmitter();
|
|
10274
10279
|
this.modelChange = new EventEmitter();
|
|
10275
10280
|
this.blurred = new EventEmitter();
|
|
@@ -10298,9 +10303,9 @@ class InputDateTimeComponent {
|
|
|
10298
10303
|
minDate: this.minDate ? formattingFromMoscowTimezone(this.minDate, this.timezone) : '',
|
|
10299
10304
|
maxDate: this.maxDate ? formattingFromMoscowTimezone(this.maxDate, this.timezone) : '',
|
|
10300
10305
|
inline: this.inline,
|
|
10301
|
-
position({ $datepicker, $target, $pointer, done }) {
|
|
10306
|
+
position: ({ $datepicker, $target, $pointer, done }) => {
|
|
10302
10307
|
let popper = createPopper($target, $datepicker, {
|
|
10303
|
-
placement:
|
|
10308
|
+
placement: this.calendarPosition,
|
|
10304
10309
|
modifiers: [
|
|
10305
10310
|
{
|
|
10306
10311
|
name: 'flip',
|
|
@@ -10570,9 +10575,9 @@ class InputDateTimeComponent {
|
|
|
10570
10575
|
}
|
|
10571
10576
|
}
|
|
10572
10577
|
InputDateTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10573
|
-
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", 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: [
|
|
10578
|
+
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", 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: [
|
|
10574
10579
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => InputDateTimeComponent), multi: true }
|
|
10575
|
-
], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }
|
|
10580
|
+
], 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", 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"], components: [{ type: LabelComponent, selector: "mrx-label", inputs: ["requiredHidden", "required", "boldLabel", "placeholder", "label", "customClasses", "triggerTextPosition", "isPublicInfo", "publicInfoTooltip", "disabled", "isSwitch", "switchLabel", "switchValue", "isCheckbox", "checkboxLabel", "checkboxValue", "counter", "linkText", "linkPrevent", "linkType", "linkMonochrome", "href", "triggerType", "tooltip", "tooltipInitialVisible", "isSaveToStorage"], outputs: ["changeCheckboxValue", "clickedLink"] }, { type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$7.MaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "triggerOnMaskChange"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10576
10581
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateTimeComponent, decorators: [{
|
|
10577
10582
|
type: Component,
|
|
10578
10583
|
args: [{ selector: 'mrx-input-date-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
@@ -10632,12 +10637,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
10632
10637
|
type: Input
|
|
10633
10638
|
}], maxDate: [{
|
|
10634
10639
|
type: Input
|
|
10640
|
+
}], calendarPosition: [{
|
|
10641
|
+
type: Input
|
|
10635
10642
|
}], dateInput: [{
|
|
10636
10643
|
type: ViewChild,
|
|
10637
10644
|
args: ['dateInput']
|
|
10638
|
-
}], timeInput: [{
|
|
10639
|
-
type: ViewChild,
|
|
10640
|
-
args: ['timeInput']
|
|
10641
10645
|
}], changed: [{
|
|
10642
10646
|
type: Output
|
|
10643
10647
|
}], modelChange: [{
|