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/fesm2020/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();
|
|
@@ -9897,7 +9898,8 @@ class InputDateComponent {
|
|
|
9897
9898
|
.withPositions(PositionStrategyEnum[this.popupPosition]);
|
|
9898
9899
|
this._overlayRef = this._overlay.create({
|
|
9899
9900
|
positionStrategy,
|
|
9900
|
-
hasBackdrop: false
|
|
9901
|
+
hasBackdrop: false,
|
|
9902
|
+
scrollStrategy: this.scrollStrategy === 'reposition' ? this._overlay.scrollStrategies.reposition() : this._overlay.scrollStrategies.close(),
|
|
9901
9903
|
});
|
|
9902
9904
|
const portal = new ComponentPortal(DateCalendarComponent);
|
|
9903
9905
|
const componentRef = this._overlayRef.attach(portal);
|
|
@@ -9952,7 +9954,7 @@ class InputDateComponent {
|
|
|
9952
9954
|
}
|
|
9953
9955
|
}
|
|
9954
9956
|
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 });
|
|
9955
|
-
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: [
|
|
9957
|
+
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: [
|
|
9956
9958
|
{
|
|
9957
9959
|
provide: NG_VALUE_ACCESSOR,
|
|
9958
9960
|
useExisting: forwardRef(() => InputDateComponent),
|
|
@@ -10002,6 +10004,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
10002
10004
|
type: Input
|
|
10003
10005
|
}], checkInvalid: [{
|
|
10004
10006
|
type: Input
|
|
10007
|
+
}], scrollStrategy: [{
|
|
10008
|
+
type: Input
|
|
10005
10009
|
}], changed: [{
|
|
10006
10010
|
type: Output
|
|
10007
10011
|
}], modelChange: [{
|
|
@@ -10267,6 +10271,7 @@ class InputDateTimeComponent {
|
|
|
10267
10271
|
this.checkInvalid = null;
|
|
10268
10272
|
this.minDate = '';
|
|
10269
10273
|
this.maxDate = '';
|
|
10274
|
+
this.calendarPosition = 'bottom-start';
|
|
10270
10275
|
this.changed = new EventEmitter();
|
|
10271
10276
|
this.modelChange = new EventEmitter();
|
|
10272
10277
|
this.blurred = new EventEmitter();
|
|
@@ -10295,9 +10300,9 @@ class InputDateTimeComponent {
|
|
|
10295
10300
|
minDate: this.minDate ? formattingFromMoscowTimezone(this.minDate, this.timezone) : '',
|
|
10296
10301
|
maxDate: this.maxDate ? formattingFromMoscowTimezone(this.maxDate, this.timezone) : '',
|
|
10297
10302
|
inline: this.inline,
|
|
10298
|
-
position({ $datepicker, $target, $pointer, done }) {
|
|
10303
|
+
position: ({ $datepicker, $target, $pointer, done }) => {
|
|
10299
10304
|
let popper = createPopper($target, $datepicker, {
|
|
10300
|
-
placement:
|
|
10305
|
+
placement: this.calendarPosition,
|
|
10301
10306
|
modifiers: [
|
|
10302
10307
|
{
|
|
10303
10308
|
name: 'flip',
|
|
@@ -10566,9 +10571,9 @@ class InputDateTimeComponent {
|
|
|
10566
10571
|
}
|
|
10567
10572
|
}
|
|
10568
10573
|
InputDateTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10569
|
-
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: [
|
|
10574
|
+
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: [
|
|
10570
10575
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => InputDateTimeComponent), multi: true }
|
|
10571
|
-
], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }
|
|
10576
|
+
], 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 });
|
|
10572
10577
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InputDateTimeComponent, decorators: [{
|
|
10573
10578
|
type: Component,
|
|
10574
10579
|
args: [{ selector: 'mrx-input-date-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
@@ -10628,12 +10633,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
10628
10633
|
type: Input
|
|
10629
10634
|
}], maxDate: [{
|
|
10630
10635
|
type: Input
|
|
10636
|
+
}], calendarPosition: [{
|
|
10637
|
+
type: Input
|
|
10631
10638
|
}], dateInput: [{
|
|
10632
10639
|
type: ViewChild,
|
|
10633
10640
|
args: ['dateInput']
|
|
10634
|
-
}], timeInput: [{
|
|
10635
|
-
type: ViewChild,
|
|
10636
|
-
args: ['timeInput']
|
|
10637
10641
|
}], changed: [{
|
|
10638
10642
|
type: Output
|
|
10639
10643
|
}], modelChange: [{
|