@morozeckiy/dd-lib 0.7.78 → 0.7.79

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.
@@ -0,0 +1,3 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M11.25 5.07649C12.4203 5.07649 13.372 6.02823 13.372 7.19851C13.372 8.36526 12.4203 9.317 11.25 9.317C10.0797 9.317 9.12801 8.36526 9.12801 7.19851C9.12801 6.02823 10.0797 5.07649 11.25 5.07649ZM11.25 12.3202C14.077 12.3202 16.3753 10.022 16.3753 7.19851C16.3753 4.3715 14.077 2.07324 11.25 2.07324C8.42302 2.07324 6.12829 4.3715 6.12829 7.19851C6.12829 10.022 8.42302 12.3202 11.25 12.3202ZM13.3227 16.5008C14.3661 16.2611 15.3707 15.8487 16.2977 15.2671C16.9992 14.8265 17.2107 13.8994 16.7701 13.198C16.3259 12.493 15.4024 12.2815 14.6974 12.7256C12.6001 14.0439 9.89998 14.0439 7.79911 12.7256C7.09765 12.2815 6.17059 12.493 5.72997 13.198C5.28935 13.8994 5.50085 14.8265 6.20231 15.2671C7.12937 15.8487 8.13398 16.2611 9.17736 16.5008L6.31158 19.3631C5.72644 19.9482 5.72644 20.9 6.31158 21.4851C6.60768 21.7777 6.98837 21.9257 7.37259 21.9257C7.75681 21.9257 8.14103 21.7777 8.43712 21.4851L11.25 18.6722L14.0665 21.4851C14.6516 22.0738 15.5998 22.0738 16.1885 21.4851C16.7736 20.9 16.7736 19.9482 16.1885 19.3631L13.3227 16.5008Z"/>
3
+ </svg>
@@ -0,0 +1,3 @@
1
+ <svg viewBox="0 0 24 24" width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M15 10L11 14L17 20L21 4L3 11L7 13L9 19L12 15" stroke="#07B700" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -0,0 +1,3 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M14 19H10C7.87827 19 5.84344 18.1571 4.34315 16.6569C2.84285 15.1566 2 13.1217 2 11V6H6V11C6 12.0609 6.42143 13.0783 7.17157 13.8284C7.92172 14.5786 8.93913 15 10 15V6H14V10.5H14.03C15.126 10.3632 16.1343 9.83086 16.8654 9.00292C17.5965 8.17498 18 7.10852 18 6.004H22L21.658 7.715C21.4532 8.73909 21.0171 9.70286 20.3832 10.5328C19.7493 11.3628 18.9341 12.037 18 12.504C18.9083 12.8066 19.7186 13.3479 20.346 14.0711C20.9734 14.7944 21.3947 15.673 21.566 16.615L22 19.004H18C18 17.8995 17.5965 16.833 16.8654 16.0051C16.1343 15.1771 15.126 14.6448 14.03 14.508V19.008L14 19Z"/>
3
+ </svg>
@@ -2659,7 +2659,7 @@ class LibCalendarComponent {
2659
2659
  useExisting: forwardRef(() => LibCalendarComponent),
2660
2660
  multi: true,
2661
2661
  },
2662
- ], ngImport: i0, template: "@if (mode === 'icon') {\r\n<div class=\"pos-relative d-flex align-center\">\r\n @if (dateValue) {\r\n <span class=\"mr-12 green\">{{ dateValue | date: 'dd.MM.yyyy' }}</span>\r\n }\r\n <dd-lib-svg-icon class=\"cup\" (click)=\"showCalendar = !showCalendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n @if (dateValue) {\r\n <dd-lib-svg-icon class=\"cup\" (click)=\"canselDate()\" icon=\"clear\"></dd-lib-svg-icon>\r\n } @if (showCalendar) {\r\n <div class=\"calendar-abs-wrapper\">\r\n <ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n </div>\r\n }\r\n</div>\r\n} @if (mode === 'full') {\r\n<ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n}\r\n\r\n<ng-template #calendar>\r\n <dd-lib-card class=\"calendar-block\" type=\"small\">\r\n <div class=\"full-width\">\r\n <div class=\"calendar-block__header\">\r\n <div class=\"calendar-block__header_arrow\">\r\n <dd-lib-svg-icon (click)=\"changeMonth(-1)\" icon=\"left_chevron\"></dd-lib-svg-icon>\r\n </div>\r\n <div class=\"calendar-block__header_year\">{{ getMonth() + ' ' + year }}</div>\r\n <div class=\"calendar-block__header_arrow\">\r\n <dd-lib-svg-icon (click)=\"changeMonth(1)\" icon=\"right_chevron\"></dd-lib-svg-icon>\r\n </div>\r\n </div>\r\n <div class=\"calendar-block__week\">\r\n @for (day of week; track day) {\r\n <div class=\"calendar-block__week_day\">{{ day }}</div>\r\n }\r\n </div>\r\n <div class=\"calendar-block__days\">\r\n @for (day of daysInMonth?.prevDays; track day) {\r\n <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n } @for (day of daysInMonth?.days; track day) {\r\n <div\r\n (click)=\"selectDay(day)\"\r\n [class.active]=\"checkActiveDay(day)\"\r\n\r\n [class.current]=\"\r\n dateNow.getDate() === day && dateNow.getMonth() === month && dateNow.getFullYear() === year\r\n \"\r\n [class.hide]=\"checkHideDay(day)\"\r\n class=\"calendar-block__days_day normal\">\r\n {{ day }}\r\n </div>\r\n } @for (day of daysInMonth?.lastDays; track day) {\r\n <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n }\r\n </div>\r\n @if(needTime) {\r\n <div class=\"calendar-block__time\">\r\n <div class=\"d-flex justify-between\">\r\n <div class=\"text-plain\">\u0412\u0440\u0435\u043C\u044F</div>\r\n <div class=\"d-flex\">\r\n <input [(ngModel)]=\"hours\" class=\"calendar-block__time-input\"\r\n type=\"text\"\r\n [ddMaxNum]=\"maxHours\"\r\n [curVal]=\"hours\"\r\n [disabled]=\"!dateValue\"\r\n [regExp]=\"true\"\r\n ddBanSymbol=\"^\\d+$\"\r\n max=\"23\"\r\n maxlength=\"2\"\r\n pattern=\"^\\d+$\">\r\n <span class=\"second-dot\">:</span>\r\n <input [(ngModel)]=\"minutes\" class=\"calendar-block__time-input\"\r\n [ddMaxNum]=\"maxMinutes\"\r\n [curVal]=\"minutes\"\r\n [disabled]=\"!dateValue\"\r\n [regExp]=\"true\"\r\n ddBanSymbol=\"^\\d+$\"\r\n max=\"59\"\r\n maxlength=\"2\"\r\n pattern=\"^\\d+$\"\r\n type=\"text\">\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n <div class=\"calendar-block__footer\">\r\n <dd-lib-button (click)=\"canselDate()\" [btnColor]=\"'transparent'\" class=\"calendar-block__footer_btn\"\r\n >\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C\r\n </dd-lib-button>\r\n <dd-lib-button (click)=\"selectDate()\"\r\n [disabled]=\"(!dateValue && !rangeMode) || (rangeMode && (!dateStart || !dateEnd))\"\r\n class=\"calendar-block__footer_btn\"\r\n >\u0412\u044B\u0431\u0440\u0430\u0442\u044C\r\n </dd-lib-button>\r\n </div>\r\n </div>\r\n </dd-lib-card>\r\n</ng-template>\r\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none}.calendar-block{z-index:1100;display:block}@media screen and (max-width: 840px){.calendar-block{height:100%}}.calendar-block__time{padding:22px 0;margin:22px 0;border-top:1px solid var(--gray-color-200);border-bottom:1px solid var(--gray-color-200)}.calendar-block__time-input{width:56px;height:36px;border-radius:12px;border:1px solid var(--primary-gray-color);text-align:center}.calendar-block__time .second-dot{margin:auto 8px;animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.calendar-block__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;color:var(--calendar-gray-color);font-size:14px;font-weight:400;line-height:24px}.calendar-block__header_arrow{cursor:pointer}.calendar-block__week{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;color:var(--primary-green-color);font-size:10px;font-weight:400;line-height:12px;letter-spacing:1.5px;margin-bottom:22px}.calendar-block__week_day{display:flex;align-items:center;justify-content:space-around}.calendar-block__days{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;margin-bottom:22px}.calendar-block__days_day{cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:29px;color:var(--light-black-color)}.calendar-block__days_day.current{border:1px solid var(--primary-green-color)}.calendar-block__days_day.active,.calendar-block__days_day.normal:hover{background-color:var(--primary-green-color);color:var(--white-color)}.calendar-block__days_day.hide{pointer-events:none;cursor:default;color:var(--calendar-gray-hide-color)}.calendar-block__footer{display:flex;align-items:center;justify-content:space-between}.calendar-abs-wrapper{position:absolute;box-shadow:var(--main-card-shadow);top:0;right:0;z-index:1111}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: LibCardComponent, selector: "dd-lib-card", inputs: ["type", "footerBtn", "sHeight", "skeleton", "parentLvlForSkeleton", "plugs", "borderRadius"], outputs: ["cardBtnEvent"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }, { kind: "component", type: LibButtonComponent, selector: "dd-lib-button", inputs: ["noPadding", "loaderColor"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.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: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: BanSymbolDirective, selector: "[ddBanSymbol]", inputs: ["ddBanSymbol", "regExp"] }, { kind: "directive", type: MaxNumDirective, selector: "[ddMaxNum]", inputs: ["ddMaxNum", "curVal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2662
+ ], ngImport: i0, template: "@if (mode === 'icon') {\r\n<div class=\"pos-relative d-flex align-center\">\r\n @if (dateValue) {\r\n <span class=\"mr-12 green\">{{ dateValue | date: 'dd.MM.yyyy' }}</span>\r\n }\r\n <dd-lib-svg-icon class=\"cup\" (click)=\"showCalendar = !showCalendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n @if (dateValue) {\r\n <dd-lib-svg-icon class=\"cup\" (click)=\"canselDate()\" icon=\"clear\"></dd-lib-svg-icon>\r\n } @if (showCalendar) {\r\n <div class=\"calendar-abs-wrapper\">\r\n <ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n </div>\r\n }\r\n</div>\r\n} @if (mode === 'full') {\r\n<ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n}\r\n\r\n<ng-template #calendar>\r\n <dd-lib-card class=\"calendar-block\" type=\"small\">\r\n <div class=\"full-width\">\r\n <div class=\"calendar-block__header\">\r\n <div class=\"calendar-block__header_arrow\">\r\n <dd-lib-svg-icon (click)=\"changeMonth(-1)\" icon=\"left_chevron\"></dd-lib-svg-icon>\r\n </div>\r\n <div class=\"calendar-block__header_year\">{{ getMonth() + ' ' + year }}</div>\r\n <div class=\"calendar-block__header_arrow\">\r\n <dd-lib-svg-icon (click)=\"changeMonth(1)\" icon=\"right_chevron\"></dd-lib-svg-icon>\r\n </div>\r\n </div>\r\n <div class=\"calendar-block__week\">\r\n @for (day of week; track day) {\r\n <div class=\"calendar-block__week_day\">{{ day }}</div>\r\n }\r\n </div>\r\n <div class=\"calendar-block__days\">\r\n @for (day of daysInMonth?.prevDays; track day) {\r\n <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n } @for (day of daysInMonth?.days; track day) {\r\n <div\r\n (click)=\"selectDay(day)\"\r\n [class.active]=\"checkActiveDay(day)\"\r\n\r\n [class.current]=\"\r\n dateNow.getDate() === day && dateNow.getMonth() === month && dateNow.getFullYear() === year\r\n \"\r\n [class.hide]=\"checkHideDay(day)\"\r\n class=\"calendar-block__days_day normal\">\r\n {{ day }}\r\n </div>\r\n } @for (day of daysInMonth?.lastDays; track day) {\r\n <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n }\r\n </div>\r\n @if(needTime) {\r\n <div class=\"calendar-block__time\">\r\n <div class=\"d-flex justify-between\">\r\n <div class=\"text-plain\">\u0412\u0440\u0435\u043C\u044F</div>\r\n <div class=\"d-flex\">\r\n <input [(ngModel)]=\"hours\" class=\"calendar-block__time-input\"\r\n type=\"text\"\r\n [ddMaxNum]=\"maxHours\"\r\n [curVal]=\"hours\"\r\n [disabled]=\"!dateValue\"\r\n [regExp]=\"true\"\r\n ddBanSymbol=\"^\\d+$\"\r\n max=\"23\"\r\n maxlength=\"2\"\r\n pattern=\"^\\d+$\">\r\n <span class=\"second-dot\">:</span>\r\n <input [(ngModel)]=\"minutes\" class=\"calendar-block__time-input\"\r\n [ddMaxNum]=\"maxMinutes\"\r\n [curVal]=\"minutes\"\r\n [disabled]=\"!dateValue\"\r\n [regExp]=\"true\"\r\n ddBanSymbol=\"^\\d+$\"\r\n max=\"59\"\r\n maxlength=\"2\"\r\n pattern=\"^\\d+$\"\r\n type=\"text\">\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n <div class=\"calendar-block__footer\">\r\n <dd-lib-button (click)=\"canselDate()\" [btnColor]=\"'transparent'\" class=\"calendar-block__footer_btn\"\r\n >\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C\r\n </dd-lib-button>\r\n <dd-lib-button (click)=\"selectDate()\"\r\n [disabled]=\"(!dateValue && !rangeMode) || (rangeMode && (!dateStart || !dateEnd))\"\r\n class=\"calendar-block__footer_btn\"\r\n >\u0412\u044B\u0431\u0440\u0430\u0442\u044C\r\n </dd-lib-button>\r\n </div>\r\n </div>\r\n </dd-lib-card>\r\n</ng-template>\r\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none}.calendar-block{z-index:1100;display:block}@media screen and (max-width: 840px){.calendar-block{height:100%}}.calendar-block__time{padding:22px 0;margin:22px 0;border-top:1px solid var(--gray-color-200);border-bottom:1px solid var(--gray-color-200)}.calendar-block__time-input{width:56px;height:36px;border-radius:12px;border:1px solid var(--primary-gray-color);text-align:center}.calendar-block__time .second-dot{margin:auto 8px;animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.calendar-block__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;color:var(--calendar-gray-color);font-size:14px;font-weight:400;line-height:24px}.calendar-block__header_arrow{cursor:pointer}.calendar-block__week{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;color:var(--primary-green-color);font-size:10px;font-weight:400;line-height:12px;letter-spacing:1.5px;margin-bottom:22px}.calendar-block__week_day{display:flex;align-items:center;justify-content:space-around}.calendar-block__days{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;justify-items:center;margin-bottom:22px}.calendar-block__days_day{cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:29px;color:var(--light-black-color)}.calendar-block__days_day.current{border:1px solid var(--primary-green-color)}.calendar-block__days_day.active,.calendar-block__days_day.normal:hover{background-color:var(--primary-green-color);color:var(--white-color)}.calendar-block__days_day.hide{pointer-events:none;cursor:default;color:var(--calendar-gray-hide-color)}.calendar-block__footer{display:flex;align-items:center;justify-content:space-between}.calendar-abs-wrapper{position:absolute;box-shadow:var(--main-card-shadow);top:0;right:0;z-index:1111}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: LibCardComponent, selector: "dd-lib-card", inputs: ["type", "footerBtn", "sHeight", "skeleton", "parentLvlForSkeleton", "plugs", "borderRadius"], outputs: ["cardBtnEvent"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }, { kind: "component", type: LibButtonComponent, selector: "dd-lib-button", inputs: ["noPadding", "loaderColor"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.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: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: BanSymbolDirective, selector: "[ddBanSymbol]", inputs: ["ddBanSymbol", "regExp"] }, { kind: "directive", type: MaxNumDirective, selector: "[ddMaxNum]", inputs: ["ddMaxNum", "curVal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2663
2663
  }
2664
2664
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: LibCalendarComponent, decorators: [{
2665
2665
  type: Component,
@@ -2677,7 +2677,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImpor
2677
2677
  useExisting: forwardRef(() => LibCalendarComponent),
2678
2678
  multi: true,
2679
2679
  },
2680
- ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (mode === 'icon') {\r\n<div class=\"pos-relative d-flex align-center\">\r\n @if (dateValue) {\r\n <span class=\"mr-12 green\">{{ dateValue | date: 'dd.MM.yyyy' }}</span>\r\n }\r\n <dd-lib-svg-icon class=\"cup\" (click)=\"showCalendar = !showCalendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n @if (dateValue) {\r\n <dd-lib-svg-icon class=\"cup\" (click)=\"canselDate()\" icon=\"clear\"></dd-lib-svg-icon>\r\n } @if (showCalendar) {\r\n <div class=\"calendar-abs-wrapper\">\r\n <ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n </div>\r\n }\r\n</div>\r\n} @if (mode === 'full') {\r\n<ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n}\r\n\r\n<ng-template #calendar>\r\n <dd-lib-card class=\"calendar-block\" type=\"small\">\r\n <div class=\"full-width\">\r\n <div class=\"calendar-block__header\">\r\n <div class=\"calendar-block__header_arrow\">\r\n <dd-lib-svg-icon (click)=\"changeMonth(-1)\" icon=\"left_chevron\"></dd-lib-svg-icon>\r\n </div>\r\n <div class=\"calendar-block__header_year\">{{ getMonth() + ' ' + year }}</div>\r\n <div class=\"calendar-block__header_arrow\">\r\n <dd-lib-svg-icon (click)=\"changeMonth(1)\" icon=\"right_chevron\"></dd-lib-svg-icon>\r\n </div>\r\n </div>\r\n <div class=\"calendar-block__week\">\r\n @for (day of week; track day) {\r\n <div class=\"calendar-block__week_day\">{{ day }}</div>\r\n }\r\n </div>\r\n <div class=\"calendar-block__days\">\r\n @for (day of daysInMonth?.prevDays; track day) {\r\n <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n } @for (day of daysInMonth?.days; track day) {\r\n <div\r\n (click)=\"selectDay(day)\"\r\n [class.active]=\"checkActiveDay(day)\"\r\n\r\n [class.current]=\"\r\n dateNow.getDate() === day && dateNow.getMonth() === month && dateNow.getFullYear() === year\r\n \"\r\n [class.hide]=\"checkHideDay(day)\"\r\n class=\"calendar-block__days_day normal\">\r\n {{ day }}\r\n </div>\r\n } @for (day of daysInMonth?.lastDays; track day) {\r\n <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n }\r\n </div>\r\n @if(needTime) {\r\n <div class=\"calendar-block__time\">\r\n <div class=\"d-flex justify-between\">\r\n <div class=\"text-plain\">\u0412\u0440\u0435\u043C\u044F</div>\r\n <div class=\"d-flex\">\r\n <input [(ngModel)]=\"hours\" class=\"calendar-block__time-input\"\r\n type=\"text\"\r\n [ddMaxNum]=\"maxHours\"\r\n [curVal]=\"hours\"\r\n [disabled]=\"!dateValue\"\r\n [regExp]=\"true\"\r\n ddBanSymbol=\"^\\d+$\"\r\n max=\"23\"\r\n maxlength=\"2\"\r\n pattern=\"^\\d+$\">\r\n <span class=\"second-dot\">:</span>\r\n <input [(ngModel)]=\"minutes\" class=\"calendar-block__time-input\"\r\n [ddMaxNum]=\"maxMinutes\"\r\n [curVal]=\"minutes\"\r\n [disabled]=\"!dateValue\"\r\n [regExp]=\"true\"\r\n ddBanSymbol=\"^\\d+$\"\r\n max=\"59\"\r\n maxlength=\"2\"\r\n pattern=\"^\\d+$\"\r\n type=\"text\">\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n <div class=\"calendar-block__footer\">\r\n <dd-lib-button (click)=\"canselDate()\" [btnColor]=\"'transparent'\" class=\"calendar-block__footer_btn\"\r\n >\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C\r\n </dd-lib-button>\r\n <dd-lib-button (click)=\"selectDate()\"\r\n [disabled]=\"(!dateValue && !rangeMode) || (rangeMode && (!dateStart || !dateEnd))\"\r\n class=\"calendar-block__footer_btn\"\r\n >\u0412\u044B\u0431\u0440\u0430\u0442\u044C\r\n </dd-lib-button>\r\n </div>\r\n </div>\r\n </dd-lib-card>\r\n</ng-template>\r\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none}.calendar-block{z-index:1100;display:block}@media screen and (max-width: 840px){.calendar-block{height:100%}}.calendar-block__time{padding:22px 0;margin:22px 0;border-top:1px solid var(--gray-color-200);border-bottom:1px solid var(--gray-color-200)}.calendar-block__time-input{width:56px;height:36px;border-radius:12px;border:1px solid var(--primary-gray-color);text-align:center}.calendar-block__time .second-dot{margin:auto 8px;animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.calendar-block__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;color:var(--calendar-gray-color);font-size:14px;font-weight:400;line-height:24px}.calendar-block__header_arrow{cursor:pointer}.calendar-block__week{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;color:var(--primary-green-color);font-size:10px;font-weight:400;line-height:12px;letter-spacing:1.5px;margin-bottom:22px}.calendar-block__week_day{display:flex;align-items:center;justify-content:space-around}.calendar-block__days{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;margin-bottom:22px}.calendar-block__days_day{cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:29px;color:var(--light-black-color)}.calendar-block__days_day.current{border:1px solid var(--primary-green-color)}.calendar-block__days_day.active,.calendar-block__days_day.normal:hover{background-color:var(--primary-green-color);color:var(--white-color)}.calendar-block__days_day.hide{pointer-events:none;cursor:default;color:var(--calendar-gray-hide-color)}.calendar-block__footer{display:flex;align-items:center;justify-content:space-between}.calendar-abs-wrapper{position:absolute;box-shadow:var(--main-card-shadow);top:0;right:0;z-index:1111}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
2680
+ ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (mode === 'icon') {\r\n<div class=\"pos-relative d-flex align-center\">\r\n @if (dateValue) {\r\n <span class=\"mr-12 green\">{{ dateValue | date: 'dd.MM.yyyy' }}</span>\r\n }\r\n <dd-lib-svg-icon class=\"cup\" (click)=\"showCalendar = !showCalendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n @if (dateValue) {\r\n <dd-lib-svg-icon class=\"cup\" (click)=\"canselDate()\" icon=\"clear\"></dd-lib-svg-icon>\r\n } @if (showCalendar) {\r\n <div class=\"calendar-abs-wrapper\">\r\n <ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n </div>\r\n }\r\n</div>\r\n} @if (mode === 'full') {\r\n<ng-template [ngTemplateOutlet]=\"calendar\"></ng-template>\r\n}\r\n\r\n<ng-template #calendar>\r\n <dd-lib-card class=\"calendar-block\" type=\"small\">\r\n <div class=\"full-width\">\r\n <div class=\"calendar-block__header\">\r\n <div class=\"calendar-block__header_arrow\">\r\n <dd-lib-svg-icon (click)=\"changeMonth(-1)\" icon=\"left_chevron\"></dd-lib-svg-icon>\r\n </div>\r\n <div class=\"calendar-block__header_year\">{{ getMonth() + ' ' + year }}</div>\r\n <div class=\"calendar-block__header_arrow\">\r\n <dd-lib-svg-icon (click)=\"changeMonth(1)\" icon=\"right_chevron\"></dd-lib-svg-icon>\r\n </div>\r\n </div>\r\n <div class=\"calendar-block__week\">\r\n @for (day of week; track day) {\r\n <div class=\"calendar-block__week_day\">{{ day }}</div>\r\n }\r\n </div>\r\n <div class=\"calendar-block__days\">\r\n @for (day of daysInMonth?.prevDays; track day) {\r\n <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n } @for (day of daysInMonth?.days; track day) {\r\n <div\r\n (click)=\"selectDay(day)\"\r\n [class.active]=\"checkActiveDay(day)\"\r\n\r\n [class.current]=\"\r\n dateNow.getDate() === day && dateNow.getMonth() === month && dateNow.getFullYear() === year\r\n \"\r\n [class.hide]=\"checkHideDay(day)\"\r\n class=\"calendar-block__days_day normal\">\r\n {{ day }}\r\n </div>\r\n } @for (day of daysInMonth?.lastDays; track day) {\r\n <div class=\"calendar-block__days_day hide\">{{ day }}</div>\r\n }\r\n </div>\r\n @if(needTime) {\r\n <div class=\"calendar-block__time\">\r\n <div class=\"d-flex justify-between\">\r\n <div class=\"text-plain\">\u0412\u0440\u0435\u043C\u044F</div>\r\n <div class=\"d-flex\">\r\n <input [(ngModel)]=\"hours\" class=\"calendar-block__time-input\"\r\n type=\"text\"\r\n [ddMaxNum]=\"maxHours\"\r\n [curVal]=\"hours\"\r\n [disabled]=\"!dateValue\"\r\n [regExp]=\"true\"\r\n ddBanSymbol=\"^\\d+$\"\r\n max=\"23\"\r\n maxlength=\"2\"\r\n pattern=\"^\\d+$\">\r\n <span class=\"second-dot\">:</span>\r\n <input [(ngModel)]=\"minutes\" class=\"calendar-block__time-input\"\r\n [ddMaxNum]=\"maxMinutes\"\r\n [curVal]=\"minutes\"\r\n [disabled]=\"!dateValue\"\r\n [regExp]=\"true\"\r\n ddBanSymbol=\"^\\d+$\"\r\n max=\"59\"\r\n maxlength=\"2\"\r\n pattern=\"^\\d+$\"\r\n type=\"text\">\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n <div class=\"calendar-block__footer\">\r\n <dd-lib-button (click)=\"canselDate()\" [btnColor]=\"'transparent'\" class=\"calendar-block__footer_btn\"\r\n >\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C\r\n </dd-lib-button>\r\n <dd-lib-button (click)=\"selectDate()\"\r\n [disabled]=\"(!dateValue && !rangeMode) || (rangeMode && (!dateStart || !dateEnd))\"\r\n class=\"calendar-block__footer_btn\"\r\n >\u0412\u044B\u0431\u0440\u0430\u0442\u044C\r\n </dd-lib-button>\r\n </div>\r\n </div>\r\n </dd-lib-card>\r\n</ng-template>\r\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none}.calendar-block{z-index:1100;display:block}@media screen and (max-width: 840px){.calendar-block{height:100%}}.calendar-block__time{padding:22px 0;margin:22px 0;border-top:1px solid var(--gray-color-200);border-bottom:1px solid var(--gray-color-200)}.calendar-block__time-input{width:56px;height:36px;border-radius:12px;border:1px solid var(--primary-gray-color);text-align:center}.calendar-block__time .second-dot{margin:auto 8px;animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.calendar-block__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;color:var(--calendar-gray-color);font-size:14px;font-weight:400;line-height:24px}.calendar-block__header_arrow{cursor:pointer}.calendar-block__week{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;justify-items:center;color:var(--primary-green-color);font-size:10px;font-weight:400;line-height:12px;letter-spacing:1.5px;margin-bottom:22px}.calendar-block__week_day{display:flex;align-items:center;justify-content:space-around}.calendar-block__days{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;justify-items:center;margin-bottom:22px}.calendar-block__days_day{cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:29px;color:var(--light-black-color)}.calendar-block__days_day.current{border:1px solid var(--primary-green-color)}.calendar-block__days_day.active,.calendar-block__days_day.normal:hover{background-color:var(--primary-green-color);color:var(--white-color)}.calendar-block__days_day.hide{pointer-events:none;cursor:default;color:var(--calendar-gray-hide-color)}.calendar-block__footer{display:flex;align-items:center;justify-content:space-between}.calendar-abs-wrapper{position:absolute;box-shadow:var(--main-card-shadow);top:0;right:0;z-index:1111}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
2681
2681
  }], ctorParameters: () => [{ type: DateService }], propDecorators: { type: [{
2682
2682
  type: Input
2683
2683
  }], formatDate: [{
@@ -4203,6 +4203,9 @@ class LibFileLoaderComponent {
4203
4203
  }
4204
4204
  return acc;
4205
4205
  }, []);
4206
+ if (error) {
4207
+ this.files = [];
4208
+ }
4206
4209
  }
4207
4210
  if (acceptedFiles.length) {
4208
4211
  this.inputFiles.emit(acceptedFiles);
@@ -4330,7 +4333,7 @@ class LibDateRangeComponent {
4330
4333
  useExisting: forwardRef(() => LibDateRangeComponent),
4331
4334
  multi: true,
4332
4335
  },
4333
- ], ngImport: i0, template: "<div class=\"lib-range\" id=\"lib-range-{{ rangeId }}\" [destroyedItem]=\"isShownPeriod\" ddFixedPosition>\r\n @if (label) {\r\n <label [for]=\"rangeId\" class=\"lib-range__title\">\r\n {{ label }}\r\n @if (required) {\r\n <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n }\r\n </label>\r\n }\r\n <div class=\"pos-relative\" data-child=\"input\">\r\n <input\r\n [attr.id]=\"rangeId\"\r\n [attr.placeholder]=\"placeholder\"\r\n (click)=\"openCalendar()\"\r\n [(ngModel)]=\"selectedPeriodStr\"\r\n [mask]=\"'d0.M0.0000 - d0.M0.0000'\"\r\n (ngModelChange)=\"changeStrDate($event)\"\r\n [leadZeroDateTime]=\"true\"\r\n class=\"text-select\"/>\r\n @if (!selectedPeriodStr) {\r\n <dd-lib-svg-icon [class.gray-svg]=\"!isShownPeriod\"\r\n (click)=\"openCalendar()\"\r\n id=\"calendar-{{ rangeId }}\"\r\n class=\"calendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n\r\n\r\n } @else {\r\n <dd-lib-svg-icon\r\n (click)=\"setPeriod(undefined)\"\r\n class=\"clear\"\r\n icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n }\r\n </div>\r\n @if (isShownPeriod) {\r\n <div data-child=\"list\"\r\n (ddClickOutside)=\"closeCalendar()\"\r\n [elements]=\"['lib-range-' + rangeId, 'calendar' + rangeId]\"\r\n class=\"calendar-wrapper\">\r\n <dd-lib-calendar [(ngModel)]=\"selectedPeriod\" [rangeMode]=\"true\" (emitPeriod)=\"setPeriod($event)\"></dd-lib-calendar>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".lib-range{min-width:340px;position:relative}.lib-range input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-range input:hover{border-color:var(--input-active-border-colort)}.lib-range input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-range input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-range input:disabled::placeholder{color:var(--input-placeholder)}.lib-range input.invalid,.lib-range input.invalid:hover{border-color:var(--input-error-border-color)}.lib-range input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-range .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-range .calendar{cursor:pointer;position:absolute;right:16px;top:10px}.lib-range .calendar.up{transform:rotate(180deg)}.lib-range__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-range__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-range .calendar-wrapper{position:absolute;display:block;z-index:100;width:100%;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.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: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[ddClickOutside]", inputs: ["elements"], outputs: ["ddClickOutside"] }, { kind: "component", type: LibCalendarComponent, selector: "dd-lib-calendar", inputs: ["type", "formatDate", "formatTime", "rangeMode", "maxHours", "maxMinutes", "needTime", "mode", "maxDate", "minDate"], outputs: ["emitDate", "emitPeriod"] }, { kind: "directive", type: 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"] }, { kind: "directive", type: FixedPositionDirective, selector: "[ddFixedPosition]", inputs: ["childName1", "childName2", "destroyedItem"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4336
+ ], ngImport: i0, template: "<div class=\"lib-range\" id=\"lib-range-{{ rangeId }}\" [destroyedItem]=\"isShownPeriod\" ddFixedPosition>\r\n @if (label) {\r\n <label [for]=\"rangeId\" class=\"lib-range__title\">\r\n {{ label }}\r\n @if (required) {\r\n <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n }\r\n </label>\r\n }\r\n <div class=\"pos-relative\" data-child=\"input\">\r\n <input\r\n [attr.id]=\"rangeId\"\r\n [attr.placeholder]=\"placeholder\"\r\n (click)=\"openCalendar()\"\r\n [(ngModel)]=\"selectedPeriodStr\"\r\n [mask]=\"'d0.M0.0000 - d0.M0.0000'\"\r\n (ngModelChange)=\"changeStrDate($event)\"\r\n [leadZeroDateTime]=\"true\"\r\n class=\"text-select\"/>\r\n @if (!selectedPeriodStr) {\r\n <dd-lib-svg-icon [class.gray-svg]=\"!isShownPeriod\"\r\n (click)=\"openCalendar()\"\r\n id=\"calendar-{{ rangeId }}\"\r\n class=\"calendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n\r\n\r\n } @else {\r\n <dd-lib-svg-icon\r\n (click)=\"setPeriod(undefined)\"\r\n class=\"clear\"\r\n icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n }\r\n </div>\r\n @if (isShownPeriod) {\r\n <div data-child=\"list\"\r\n (ddClickOutside)=\"closeCalendar()\"\r\n [elements]=\"['lib-range-' + rangeId, 'calendar' + rangeId]\"\r\n class=\"calendar-wrapper\">\r\n <dd-lib-calendar [(ngModel)]=\"selectedPeriod\" [rangeMode]=\"true\" (emitPeriod)=\"setPeriod($event)\"></dd-lib-calendar>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".lib-range{min-width:311px;position:relative}.lib-range input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-range input:hover{border-color:var(--input-active-border-colort)}.lib-range input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-range input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-range input:disabled::placeholder{color:var(--input-placeholder)}.lib-range input.invalid,.lib-range input.invalid:hover{border-color:var(--input-error-border-color)}.lib-range input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-range .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-range .calendar{cursor:pointer;position:absolute;right:16px;top:10px}.lib-range .calendar.up{transform:rotate(180deg)}.lib-range__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-range__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-range .calendar-wrapper{position:absolute;display:block;z-index:100;width:100%;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.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: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[ddClickOutside]", inputs: ["elements"], outputs: ["ddClickOutside"] }, { kind: "component", type: LibCalendarComponent, selector: "dd-lib-calendar", inputs: ["type", "formatDate", "formatTime", "rangeMode", "maxHours", "maxMinutes", "needTime", "mode", "maxDate", "minDate"], outputs: ["emitDate", "emitPeriod"] }, { kind: "directive", type: 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"] }, { kind: "directive", type: FixedPositionDirective, selector: "[ddFixedPosition]", inputs: ["childName1", "childName2", "destroyedItem"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4334
4337
  }
4335
4338
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: LibDateRangeComponent, decorators: [{
4336
4339
  type: Component,
@@ -4348,7 +4351,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImpor
4348
4351
  useExisting: forwardRef(() => LibDateRangeComponent),
4349
4352
  multi: true,
4350
4353
  },
4351
- ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"lib-range\" id=\"lib-range-{{ rangeId }}\" [destroyedItem]=\"isShownPeriod\" ddFixedPosition>\r\n @if (label) {\r\n <label [for]=\"rangeId\" class=\"lib-range__title\">\r\n {{ label }}\r\n @if (required) {\r\n <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n }\r\n </label>\r\n }\r\n <div class=\"pos-relative\" data-child=\"input\">\r\n <input\r\n [attr.id]=\"rangeId\"\r\n [attr.placeholder]=\"placeholder\"\r\n (click)=\"openCalendar()\"\r\n [(ngModel)]=\"selectedPeriodStr\"\r\n [mask]=\"'d0.M0.0000 - d0.M0.0000'\"\r\n (ngModelChange)=\"changeStrDate($event)\"\r\n [leadZeroDateTime]=\"true\"\r\n class=\"text-select\"/>\r\n @if (!selectedPeriodStr) {\r\n <dd-lib-svg-icon [class.gray-svg]=\"!isShownPeriod\"\r\n (click)=\"openCalendar()\"\r\n id=\"calendar-{{ rangeId }}\"\r\n class=\"calendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n\r\n\r\n } @else {\r\n <dd-lib-svg-icon\r\n (click)=\"setPeriod(undefined)\"\r\n class=\"clear\"\r\n icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n }\r\n </div>\r\n @if (isShownPeriod) {\r\n <div data-child=\"list\"\r\n (ddClickOutside)=\"closeCalendar()\"\r\n [elements]=\"['lib-range-' + rangeId, 'calendar' + rangeId]\"\r\n class=\"calendar-wrapper\">\r\n <dd-lib-calendar [(ngModel)]=\"selectedPeriod\" [rangeMode]=\"true\" (emitPeriod)=\"setPeriod($event)\"></dd-lib-calendar>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".lib-range{min-width:340px;position:relative}.lib-range input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-range input:hover{border-color:var(--input-active-border-colort)}.lib-range input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-range input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-range input:disabled::placeholder{color:var(--input-placeholder)}.lib-range input.invalid,.lib-range input.invalid:hover{border-color:var(--input-error-border-color)}.lib-range input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-range .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-range .calendar{cursor:pointer;position:absolute;right:16px;top:10px}.lib-range .calendar.up{transform:rotate(180deg)}.lib-range__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-range__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-range .calendar-wrapper{position:absolute;display:block;z-index:100;width:100%;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}\n"] }]
4354
+ ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"lib-range\" id=\"lib-range-{{ rangeId }}\" [destroyedItem]=\"isShownPeriod\" ddFixedPosition>\r\n @if (label) {\r\n <label [for]=\"rangeId\" class=\"lib-range__title\">\r\n {{ label }}\r\n @if (required) {\r\n <dd-lib-svg-icon icon=\"error_hint\"></dd-lib-svg-icon>\r\n }\r\n </label>\r\n }\r\n <div class=\"pos-relative\" data-child=\"input\">\r\n <input\r\n [attr.id]=\"rangeId\"\r\n [attr.placeholder]=\"placeholder\"\r\n (click)=\"openCalendar()\"\r\n [(ngModel)]=\"selectedPeriodStr\"\r\n [mask]=\"'d0.M0.0000 - d0.M0.0000'\"\r\n (ngModelChange)=\"changeStrDate($event)\"\r\n [leadZeroDateTime]=\"true\"\r\n class=\"text-select\"/>\r\n @if (!selectedPeriodStr) {\r\n <dd-lib-svg-icon [class.gray-svg]=\"!isShownPeriod\"\r\n (click)=\"openCalendar()\"\r\n id=\"calendar-{{ rangeId }}\"\r\n class=\"calendar\" icon=\"calendar\"></dd-lib-svg-icon>\r\n\r\n\r\n } @else {\r\n <dd-lib-svg-icon\r\n (click)=\"setPeriod(undefined)\"\r\n class=\"clear\"\r\n icon=\"clear\"></dd-lib-svg-icon>\r\n\r\n }\r\n </div>\r\n @if (isShownPeriod) {\r\n <div data-child=\"list\"\r\n (ddClickOutside)=\"closeCalendar()\"\r\n [elements]=\"['lib-range-' + rangeId, 'calendar' + rangeId]\"\r\n class=\"calendar-wrapper\">\r\n <dd-lib-calendar [(ngModel)]=\"selectedPeriod\" [rangeMode]=\"true\" (emitPeriod)=\"setPeriod($event)\"></dd-lib-calendar>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".lib-range{min-width:311px;position:relative}.lib-range input{width:100%;height:48px;padding:15px 28px 15px 16px;overflow:hidden;text-overflow:ellipsis;border-radius:8px;border:1px solid var(--input-border-color);background-color:transparent;position:relative}.lib-range input:hover{border-color:var(--input-active-border-colort)}.lib-range input:focus{border-color:var(--input-active-border-colort);box-shadow:var(--input-active-border-shadow)}.lib-range input:disabled{border:none;background-color:var(--input-disable-input);color:var(--input-disable-text);pointer-events:none}.lib-range input:disabled::placeholder{color:var(--input-placeholder)}.lib-range input.invalid,.lib-range input.invalid:hover{border-color:var(--input-error-border-color)}.lib-range input.invalid:focus{border-color:var(--input-error-border-color);box-shadow:var(--input-error-border-shadow)}.lib-range .clear{cursor:pointer;position:absolute;right:8px;top:12px}.lib-range .calendar{cursor:pointer;position:absolute;right:16px;top:10px}.lib-range .calendar.up{transform:rotate(180deg)}.lib-range__title{margin-bottom:4px;font-size:14px;line-height:24px;display:flex;align-items:flex-start}.lib-range__error{color:var(--primary-red-color);font-size:12px;font-weight:400;line-height:10px;margin-top:2px;position:absolute}.lib-range .calendar-wrapper{position:absolute;display:block;z-index:100;width:100%;overflow:auto;border-radius:8px;box-shadow:var(--main-card-shadow);background-color:var(--main-card-color)}\n"] }]
4352
4355
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { rangeId: [{
4353
4356
  type: Input
4354
4357
  }], placeholder: [{