@indigina/ui-kit 1.1.124 → 1.1.126

package/fesm2022/indigina-ui-kit.mjs

@@ -1759,7 +1759,7 @@ class KitDatetimepickerComponent {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => KitDatetimepickerComponent),
                 multi: true,
-            }], viewQueries: [{ propertyName: "datetimepicker", first: true, predicate: ["datetimepicker"], descendants: true }], ngImport: i0, template: "<div class=\"kit-datetimepicker\"\n     [class.disabled]=\"disabled\"\n     [class.invalid]=\"invalid\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"$any(datetimepicker)\"\n    ></kit-input-label>\n  }\n  <div class=\"datetimepicker-wrap\">\n    <kendo-datetimepicker #datetimepicker\n                          calendarType=\"classic\"\n                          [placeholder]=\"placeholder\"\n                          [format]=\"format\"\n                          [disabled]=\"disabled\"\n                          [popupSettings]=\"datetimepickerPopupSettings\"\n                          [value]=\"defaultDate\"\n                          [min]=\"min\"\n                          [max]=\"max\"\n                          [focusedDate]=\"defaultDate\"\n                          (valueChange)=\"onValueChange($event)\"\n                          (blur)=\"onBlur()\">\n      <kendo-datetimepicker-messages [accept]=\"applyButtonText\"\n                                     [cancel]=\"cancelButtonText\"\n                                     [now]=\"nowButtonText\"\n      ></kendo-datetimepicker-messages>\n    </kendo-datetimepicker>\n    <button class=\"toggle-btn\"\n            [disabled]=\"disabled\"\n            (click)=\"onPopupToggle()\">\n      <kit-svg-icon class=\"button-icon\"\n                    [icon]=\"icon\"\n      ></kit-svg-icon>\n    </button>\n  </div>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-datetimepicker .label{display:block;margin-bottom:4px}.kit-datetimepicker .datetimepicker-wrap{position:relative}.kit-datetimepicker:hover .k-datetimepicker{border-color:var(--ui-kit-color-hover)}.kit-datetimepicker .k-datetimepicker{height:40px;width:100%;font-size:14px;font-weight:400;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-white)}.kit-datetimepicker .k-datetimepicker.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-datetimepicker .k-datetimepicker.k-focus+.toggle-btn .button-icon{fill:var(--ui-kit-color-main)}.kit-datetimepicker .k-dateinput{box-shadow:none}.kit-datetimepicker .k-input-inner{padding:0 36px 0 12px;color:var(--ui-kit-color-grey-10);line-height:1}.kit-datetimepicker .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-datetimepicker .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-datetimepicker .toggle-btn{position:absolute;top:0;right:0;padding:0 12px 0 8px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-datetimepicker .toggle-btn .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-datetimepicker .toggle-btn:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-datetimepicker.disabled .k-datetimepicker{border-color:var(--ui-kit-color-grey-12)}.kit-datetimepicker.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-grey-13)}.kit-datetimepicker.disabled .toggle-btn{cursor:default}.kit-datetimepicker.disabled .toggle-btn .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-datetimepicker.invalid .k-datetimepicker{border-color:var(--ui-kit-color-red-1)}.kit-datetimepicker.invalid .toggle-btn{cursor:default}.kit-datetimepicker.invalid .toggle-btn .button-icon{fill:var(--ui-kit-color-red-1)}.kit-datetimepicker.invalid .k-dateinput{border-color:var(--ui-kit-color-red-1)}.kit-datetimepicker .k-input-button{display:none}.kit-datetimepicker-popup.k-popup{margin-top:10px;padding:8px;width:296px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup{margin-bottom:10px;padding:0}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button-group{gap:10px;width:auto}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button{padding:0 11px;height:46px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400;border:none;border-bottom:2px solid transparent;border-radius:0;background:var(--ui-kit-color-white);transition:none}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button.k-selected{color:var(--ui-kit-color-main);border-bottom-color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button:hover{color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-datetime-wrap{width:280px}.kit-datetimepicker-popup.k-popup .k-datetime-time-wrap,.kit-datetimepicker-popup.k-popup .k-datetime-calendar-wrap{flex-basis:280px}.kit-datetimepicker-popup.k-popup .k-calendar-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-datetimepicker-popup.k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-weight:400;line-height:20px;border-radius:4px;border:none}.kit-datetimepicker-popup.k-popup .k-calendar-title:hover{background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 8px;color:var(--ui-kit-color-grey-10)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev:before,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev:hover,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-datetimepicker-popup.k-popup .k-calendar-view{margin:0;padding:10px 0;gap:32px;width:auto;box-sizing:border-box}.kit-datetimepicker-popup.k-popup .k-calendar-tr{display:flex;gap:16px}.kit-datetimepicker-popup.k-popup .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-datetimepicker-popup.k-popup .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize}.kit-datetimepicker-popup.k-popup .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-td:focus .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-link{width:24px}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}.kit-datetimepicker-popup.k-popup .k-timeselector{height:100%}.kit-datetimepicker-popup.k-popup .k-time-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-time-header .k-title,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{padding:6px 8px;font-weight:400;line-height:20px}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{color:var(--ui-kit-color-grey-10)}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-time-list-container{justify-content:center;padding:10px 0;gap:20px}.kit-datetimepicker-popup.k-popup .k-reset{display:flex;flex-direction:column;align-items:center;width:auto}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper{flex-grow:0;padding:0;height:208px;min-width:auto}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper:before,.kit-datetimepicker-popup.k-popup .k-time-list-wrapper:after{display:none}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper .k-title{display:flex;align-items:center;justify-content:flex-end;color:var(--ui-kit-color-main);font-size:14px;font-weight:400;height:24px}.kit-datetimepicker-popup.k-popup .k-time-list:before,.kit-datetimepicker-popup.k-popup .k-time-list:after{display:none}.kit-datetimepicker-popup.k-popup .k-time-list .k-item{display:flex;align-items:center;justify-content:center;padding:5px 0;height:24px;width:38px;color:var(--ui-kit-color-grey-12);font-size:16px;font-weight:400}.kit-datetimepicker-popup.k-popup .k-time-list .k-item[aria-selected=true]{padding:10px 0;color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-time-highlight{top:50%;height:34px;border-color:var(--ui-kit-color-grey-12);transform:none}.kit-datetimepicker-popup.k-popup .k-time-separator{top:16px;color:var(--ui-kit-color-grey-10);font-size:16px}.kit-datetimepicker-popup.k-popup .k-actions{margin:0;padding:10px 0 0;flex-direction:row-reverse;border-top:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-actions .k-button{flex:none;padding:0 19px;height:32px;font-size:14px;font-weight:400;border-radius:6px;border:1px solid var(--ui-kit-color-grey-11);transition:none}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept{border-color:transparent;background:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:hover{background:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:active{background:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:disabled{color:var(--ui-kit-color-grey-12);border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel{background:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel:hover{color:var(--ui-kit-color-hover);border-color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel:active{border-color:var(--ui-kit-color-grey-11)}\n"], dependencies: [{ kind: "component", type: i2.DateTimePickerCustomMessagesComponent, selector: "kendo-datetimepicker-messages" }, { kind: "component", type: i2.DateTimePickerComponent, selector: "kendo-datetimepicker", inputs: ["focusableId", "weekDaysFormat", "showOtherMonthDays", "value", "format", "twoDigitYearMax", "tabindex", "disabledDates", "popupSettings", "title", "subtitle", "disabled", "readonly", "readOnlyInput", "cancelButton", "formatPlaceholder", "placeholder", "steps", "focusedDate", "calendarType", "animateCalendarNavigation", "weekNumber", "min", "max", "rangeValidation", "disabledDatesValidation", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "clearButton", "autoFill", "adaptiveMode", "inputAttributes", "defaultTab", "size", "rounded", "fillMode", "headerTemplate", "footerTemplate", "footer"], outputs: ["valueChange", "open", "close", "focus", "blur", "escape"], exportAs: ["kendo-datetimepicker"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+            }], viewQueries: [{ propertyName: "datetimepicker", first: true, predicate: ["datetimepicker"], descendants: true }], ngImport: i0, template: "<div class=\"kit-datetimepicker\"\n     [class.disabled]=\"disabled\"\n     [class.invalid]=\"invalid\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"$any(datetimepicker)\"\n    ></kit-input-label>\n  }\n  <div class=\"datetimepicker-wrap\">\n    <kendo-datetimepicker #datetimepicker\n                          calendarType=\"classic\"\n                          [placeholder]=\"placeholder\"\n                          [format]=\"format\"\n                          [disabled]=\"disabled\"\n                          [popupSettings]=\"datetimepickerPopupSettings\"\n                          [value]=\"defaultDate\"\n                          [min]=\"min\"\n                          [max]=\"max\"\n                          [focusedDate]=\"defaultDate\"\n                          (valueChange)=\"onValueChange($event)\"\n                          (blur)=\"onBlur()\">\n      <kendo-datetimepicker-messages [accept]=\"applyButtonText\"\n                                     [cancel]=\"cancelButtonText\"\n                                     [now]=\"nowButtonText\"\n      ></kendo-datetimepicker-messages>\n    </kendo-datetimepicker>\n    <button class=\"toggle-btn\"\n            [disabled]=\"disabled\"\n            (click)=\"onPopupToggle()\">\n      <kit-svg-icon class=\"button-icon\"\n                    [icon]=\"icon\"\n      ></kit-svg-icon>\n    </button>\n  </div>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-datetimepicker .label{display:block;margin-bottom:4px}.kit-datetimepicker .datetimepicker-wrap{position:relative}.kit-datetimepicker:hover .k-datetimepicker{border-color:var(--ui-kit-color-hover)}.kit-datetimepicker .k-datetimepicker{height:40px;width:100%;font-size:14px;font-weight:400;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-white)}.kit-datetimepicker .k-datetimepicker.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-datetimepicker .k-datetimepicker.k-focus+.toggle-btn .button-icon{fill:var(--ui-kit-color-main)}.kit-datetimepicker .k-dateinput{box-shadow:none}.kit-datetimepicker .k-input-inner{padding:0 36px 0 12px;color:var(--ui-kit-color-grey-10);line-height:1}.kit-datetimepicker .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-datetimepicker .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-datetimepicker .toggle-btn{position:absolute;top:0;right:0;padding:0 12px 0 8px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-datetimepicker .toggle-btn .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-datetimepicker .toggle-btn:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-datetimepicker.disabled .k-datetimepicker{border-color:var(--ui-kit-color-grey-12)}.kit-datetimepicker.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-grey-13)}.kit-datetimepicker.disabled .toggle-btn{cursor:default}.kit-datetimepicker.disabled .toggle-btn .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-datetimepicker.invalid .k-datetimepicker{border-color:var(--ui-kit-color-red-1)}.kit-datetimepicker.invalid .toggle-btn{cursor:default}.kit-datetimepicker.invalid .toggle-btn .button-icon{fill:var(--ui-kit-color-red-1)}.kit-datetimepicker.invalid .k-dateinput{border-color:var(--ui-kit-color-red-1)}.kit-datetimepicker .k-input-button{display:none}.kit-datetimepicker-popup.k-popup{margin-top:10px;padding:8px;width:296px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup{margin-bottom:10px;padding:0}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button-group{gap:10px;width:auto}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button{padding:0 11px;height:46px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400;border:none;border-bottom:2px solid transparent;border-radius:0;background:var(--ui-kit-color-white);transition:none}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button.k-selected{color:var(--ui-kit-color-main);border-bottom-color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button:hover{color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-datetime-wrap{width:280px}.kit-datetimepicker-popup.k-popup .k-datetime-time-wrap,.kit-datetimepicker-popup.k-popup .k-datetime-calendar-wrap{flex-basis:280px}.kit-datetimepicker-popup.k-popup .k-calendar-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-datetimepicker-popup.k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-weight:400;line-height:20px;border-radius:4px;border:none}.kit-datetimepicker-popup.k-popup .k-calendar-title:hover{background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 8px;color:var(--ui-kit-color-grey-10)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev:before,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev:hover,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-datetimepicker-popup.k-popup .k-calendar-view{margin:0;padding:10px 0;gap:32px;width:auto;box-sizing:border-box}.kit-datetimepicker-popup.k-popup .k-calendar-tr{display:flex;gap:16px}.kit-datetimepicker-popup.k-popup .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-datetimepicker-popup.k-popup .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize}.kit-datetimepicker-popup.k-popup .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-td:focus .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-link{width:24px}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-empty{width:24px;height:24px}.kit-datetimepicker-popup.k-popup .k-calendar-yearview .k-calendar-td.k-empty,.kit-datetimepicker-popup.k-popup .k-calendar-decadeview .k-calendar-td.k-empty,.kit-datetimepicker-popup.k-popup .k-calendar-centuryview .k-calendar-td.k-empty{width:54px;height:24px}.kit-datetimepicker-popup.k-popup .k-timeselector{height:100%}.kit-datetimepicker-popup.k-popup .k-time-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-time-header .k-title,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{padding:6px 8px;font-weight:400;line-height:20px}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{color:var(--ui-kit-color-grey-10)}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-time-list-container{justify-content:center;padding:10px 0;gap:20px}.kit-datetimepicker-popup.k-popup .k-reset{display:flex;flex-direction:column;align-items:center;width:auto}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper{flex-grow:0;padding:0;height:208px;min-width:auto}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper:before,.kit-datetimepicker-popup.k-popup .k-time-list-wrapper:after{display:none}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper .k-title{display:flex;align-items:center;justify-content:flex-end;color:var(--ui-kit-color-main);font-size:14px;font-weight:400;height:24px}.kit-datetimepicker-popup.k-popup .k-time-list:before,.kit-datetimepicker-popup.k-popup .k-time-list:after{display:none}.kit-datetimepicker-popup.k-popup .k-time-list .k-item{display:flex;align-items:center;justify-content:center;padding:5px 0;height:24px;width:38px;color:var(--ui-kit-color-grey-12);font-size:16px;font-weight:400}.kit-datetimepicker-popup.k-popup .k-time-list .k-item[aria-selected=true]{padding:10px 0;color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-time-highlight{top:50%;height:34px;border-color:var(--ui-kit-color-grey-12);transform:none}.kit-datetimepicker-popup.k-popup .k-time-separator{top:16px;color:var(--ui-kit-color-grey-10);font-size:16px}.kit-datetimepicker-popup.k-popup .k-actions{margin:0;padding:10px 0 0;flex-direction:row-reverse;border-top:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-actions .k-button{flex:none;padding:0 19px;height:32px;font-size:14px;font-weight:400;border-radius:6px;border:1px solid var(--ui-kit-color-grey-11);transition:none}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept{border-color:transparent;background:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:hover{background:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:active{background:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:disabled{color:var(--ui-kit-color-grey-12);border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel{background:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel:hover{color:var(--ui-kit-color-hover);border-color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel:active{border-color:var(--ui-kit-color-grey-11)}\n"], dependencies: [{ kind: "component", type: i2.DateTimePickerCustomMessagesComponent, selector: "kendo-datetimepicker-messages" }, { kind: "component", type: i2.DateTimePickerComponent, selector: "kendo-datetimepicker", inputs: ["focusableId", "weekDaysFormat", "showOtherMonthDays", "value", "format", "twoDigitYearMax", "tabindex", "disabledDates", "popupSettings", "title", "subtitle", "disabled", "readonly", "readOnlyInput", "cancelButton", "formatPlaceholder", "placeholder", "steps", "focusedDate", "calendarType", "animateCalendarNavigation", "weekNumber", "min", "max", "rangeValidation", "disabledDatesValidation", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "clearButton", "autoFill", "adaptiveMode", "inputAttributes", "defaultTab", "size", "rounded", "fillMode", "headerTemplate", "footerTemplate", "footer"], outputs: ["valueChange", "open", "close", "focus", "blur", "escape"], exportAs: ["kendo-datetimepicker"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitDatetimepickerComponent, decorators: [{
             type: Component,
@@ -1767,7 +1767,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => KitDatetimepickerComponent),
                             multi: true,
-                        }], standalone: false, template: "<div class=\"kit-datetimepicker\"\n     [class.disabled]=\"disabled\"\n     [class.invalid]=\"invalid\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"$any(datetimepicker)\"\n    ></kit-input-label>\n  }\n  <div class=\"datetimepicker-wrap\">\n    <kendo-datetimepicker #datetimepicker\n                          calendarType=\"classic\"\n                          [placeholder]=\"placeholder\"\n                          [format]=\"format\"\n                          [disabled]=\"disabled\"\n                          [popupSettings]=\"datetimepickerPopupSettings\"\n                          [value]=\"defaultDate\"\n                          [min]=\"min\"\n                          [max]=\"max\"\n                          [focusedDate]=\"defaultDate\"\n                          (valueChange)=\"onValueChange($event)\"\n                          (blur)=\"onBlur()\">\n      <kendo-datetimepicker-messages [accept]=\"applyButtonText\"\n                                     [cancel]=\"cancelButtonText\"\n                                     [now]=\"nowButtonText\"\n      ></kendo-datetimepicker-messages>\n    </kendo-datetimepicker>\n    <button class=\"toggle-btn\"\n            [disabled]=\"disabled\"\n            (click)=\"onPopupToggle()\">\n      <kit-svg-icon class=\"button-icon\"\n                    [icon]=\"icon\"\n      ></kit-svg-icon>\n    </button>\n  </div>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-datetimepicker .label{display:block;margin-bottom:4px}.kit-datetimepicker .datetimepicker-wrap{position:relative}.kit-datetimepicker:hover .k-datetimepicker{border-color:var(--ui-kit-color-hover)}.kit-datetimepicker .k-datetimepicker{height:40px;width:100%;font-size:14px;font-weight:400;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-white)}.kit-datetimepicker .k-datetimepicker.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-datetimepicker .k-datetimepicker.k-focus+.toggle-btn .button-icon{fill:var(--ui-kit-color-main)}.kit-datetimepicker .k-dateinput{box-shadow:none}.kit-datetimepicker .k-input-inner{padding:0 36px 0 12px;color:var(--ui-kit-color-grey-10);line-height:1}.kit-datetimepicker .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-datetimepicker .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-datetimepicker .toggle-btn{position:absolute;top:0;right:0;padding:0 12px 0 8px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-datetimepicker .toggle-btn .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-datetimepicker .toggle-btn:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-datetimepicker.disabled .k-datetimepicker{border-color:var(--ui-kit-color-grey-12)}.kit-datetimepicker.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-grey-13)}.kit-datetimepicker.disabled .toggle-btn{cursor:default}.kit-datetimepicker.disabled .toggle-btn .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-datetimepicker.invalid .k-datetimepicker{border-color:var(--ui-kit-color-red-1)}.kit-datetimepicker.invalid .toggle-btn{cursor:default}.kit-datetimepicker.invalid .toggle-btn .button-icon{fill:var(--ui-kit-color-red-1)}.kit-datetimepicker.invalid .k-dateinput{border-color:var(--ui-kit-color-red-1)}.kit-datetimepicker .k-input-button{display:none}.kit-datetimepicker-popup.k-popup{margin-top:10px;padding:8px;width:296px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup{margin-bottom:10px;padding:0}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button-group{gap:10px;width:auto}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button{padding:0 11px;height:46px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400;border:none;border-bottom:2px solid transparent;border-radius:0;background:var(--ui-kit-color-white);transition:none}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button.k-selected{color:var(--ui-kit-color-main);border-bottom-color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button:hover{color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-datetime-wrap{width:280px}.kit-datetimepicker-popup.k-popup .k-datetime-time-wrap,.kit-datetimepicker-popup.k-popup .k-datetime-calendar-wrap{flex-basis:280px}.kit-datetimepicker-popup.k-popup .k-calendar-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-datetimepicker-popup.k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-weight:400;line-height:20px;border-radius:4px;border:none}.kit-datetimepicker-popup.k-popup .k-calendar-title:hover{background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 8px;color:var(--ui-kit-color-grey-10)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev:before,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev:hover,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-datetimepicker-popup.k-popup .k-calendar-view{margin:0;padding:10px 0;gap:32px;width:auto;box-sizing:border-box}.kit-datetimepicker-popup.k-popup .k-calendar-tr{display:flex;gap:16px}.kit-datetimepicker-popup.k-popup .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-datetimepicker-popup.k-popup .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize}.kit-datetimepicker-popup.k-popup .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-td:focus .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-link{width:24px}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}.kit-datetimepicker-popup.k-popup .k-timeselector{height:100%}.kit-datetimepicker-popup.k-popup .k-time-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-time-header .k-title,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{padding:6px 8px;font-weight:400;line-height:20px}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{color:var(--ui-kit-color-grey-10)}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-time-list-container{justify-content:center;padding:10px 0;gap:20px}.kit-datetimepicker-popup.k-popup .k-reset{display:flex;flex-direction:column;align-items:center;width:auto}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper{flex-grow:0;padding:0;height:208px;min-width:auto}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper:before,.kit-datetimepicker-popup.k-popup .k-time-list-wrapper:after{display:none}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper .k-title{display:flex;align-items:center;justify-content:flex-end;color:var(--ui-kit-color-main);font-size:14px;font-weight:400;height:24px}.kit-datetimepicker-popup.k-popup .k-time-list:before,.kit-datetimepicker-popup.k-popup .k-time-list:after{display:none}.kit-datetimepicker-popup.k-popup .k-time-list .k-item{display:flex;align-items:center;justify-content:center;padding:5px 0;height:24px;width:38px;color:var(--ui-kit-color-grey-12);font-size:16px;font-weight:400}.kit-datetimepicker-popup.k-popup .k-time-list .k-item[aria-selected=true]{padding:10px 0;color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-time-highlight{top:50%;height:34px;border-color:var(--ui-kit-color-grey-12);transform:none}.kit-datetimepicker-popup.k-popup .k-time-separator{top:16px;color:var(--ui-kit-color-grey-10);font-size:16px}.kit-datetimepicker-popup.k-popup .k-actions{margin:0;padding:10px 0 0;flex-direction:row-reverse;border-top:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-actions .k-button{flex:none;padding:0 19px;height:32px;font-size:14px;font-weight:400;border-radius:6px;border:1px solid var(--ui-kit-color-grey-11);transition:none}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept{border-color:transparent;background:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:hover{background:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:active{background:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:disabled{color:var(--ui-kit-color-grey-12);border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel{background:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel:hover{color:var(--ui-kit-color-hover);border-color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel:active{border-color:var(--ui-kit-color-grey-11)}\n"] }]
+                        }], standalone: false, template: "<div class=\"kit-datetimepicker\"\n     [class.disabled]=\"disabled\"\n     [class.invalid]=\"invalid\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"$any(datetimepicker)\"\n    ></kit-input-label>\n  }\n  <div class=\"datetimepicker-wrap\">\n    <kendo-datetimepicker #datetimepicker\n                          calendarType=\"classic\"\n                          [placeholder]=\"placeholder\"\n                          [format]=\"format\"\n                          [disabled]=\"disabled\"\n                          [popupSettings]=\"datetimepickerPopupSettings\"\n                          [value]=\"defaultDate\"\n                          [min]=\"min\"\n                          [max]=\"max\"\n                          [focusedDate]=\"defaultDate\"\n                          (valueChange)=\"onValueChange($event)\"\n                          (blur)=\"onBlur()\">\n      <kendo-datetimepicker-messages [accept]=\"applyButtonText\"\n                                     [cancel]=\"cancelButtonText\"\n                                     [now]=\"nowButtonText\"\n      ></kendo-datetimepicker-messages>\n    </kendo-datetimepicker>\n    <button class=\"toggle-btn\"\n            [disabled]=\"disabled\"\n            (click)=\"onPopupToggle()\">\n      <kit-svg-icon class=\"button-icon\"\n                    [icon]=\"icon\"\n      ></kit-svg-icon>\n    </button>\n  </div>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-datetimepicker .label{display:block;margin-bottom:4px}.kit-datetimepicker .datetimepicker-wrap{position:relative}.kit-datetimepicker:hover .k-datetimepicker{border-color:var(--ui-kit-color-hover)}.kit-datetimepicker .k-datetimepicker{height:40px;width:100%;font-size:14px;font-weight:400;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-white)}.kit-datetimepicker .k-datetimepicker.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-datetimepicker .k-datetimepicker.k-focus+.toggle-btn .button-icon{fill:var(--ui-kit-color-main)}.kit-datetimepicker .k-dateinput{box-shadow:none}.kit-datetimepicker .k-input-inner{padding:0 36px 0 12px;color:var(--ui-kit-color-grey-10);line-height:1}.kit-datetimepicker .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-datetimepicker .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-datetimepicker .toggle-btn{position:absolute;top:0;right:0;padding:0 12px 0 8px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-datetimepicker .toggle-btn .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-datetimepicker .toggle-btn:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-datetimepicker.disabled .k-datetimepicker{border-color:var(--ui-kit-color-grey-12)}.kit-datetimepicker.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-grey-13)}.kit-datetimepicker.disabled .toggle-btn{cursor:default}.kit-datetimepicker.disabled .toggle-btn .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-datetimepicker.invalid .k-datetimepicker{border-color:var(--ui-kit-color-red-1)}.kit-datetimepicker.invalid .toggle-btn{cursor:default}.kit-datetimepicker.invalid .toggle-btn .button-icon{fill:var(--ui-kit-color-red-1)}.kit-datetimepicker.invalid .k-dateinput{border-color:var(--ui-kit-color-red-1)}.kit-datetimepicker .k-input-button{display:none}.kit-datetimepicker-popup.k-popup{margin-top:10px;padding:8px;width:296px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup{margin-bottom:10px;padding:0}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button-group{gap:10px;width:auto}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button{padding:0 11px;height:46px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400;border:none;border-bottom:2px solid transparent;border-radius:0;background:var(--ui-kit-color-white);transition:none}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button.k-selected{color:var(--ui-kit-color-main);border-bottom-color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button:hover{color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-datetime-wrap{width:280px}.kit-datetimepicker-popup.k-popup .k-datetime-time-wrap,.kit-datetimepicker-popup.k-popup .k-datetime-calendar-wrap{flex-basis:280px}.kit-datetimepicker-popup.k-popup .k-calendar-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-datetimepicker-popup.k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-weight:400;line-height:20px;border-radius:4px;border:none}.kit-datetimepicker-popup.k-popup .k-calendar-title:hover{background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 8px;color:var(--ui-kit-color-grey-10)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev:before,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-calendar-nav-prev:hover,.kit-datetimepicker-popup.k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-datetimepicker-popup.k-popup .k-calendar-view{margin:0;padding:10px 0;gap:32px;width:auto;box-sizing:border-box}.kit-datetimepicker-popup.k-popup .k-calendar-tr{display:flex;gap:16px}.kit-datetimepicker-popup.k-popup .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-datetimepicker-popup.k-popup .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize}.kit-datetimepicker-popup.k-popup .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-calendar-td:focus .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-link{width:24px}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}.kit-datetimepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-empty{width:24px;height:24px}.kit-datetimepicker-popup.k-popup .k-calendar-yearview .k-calendar-td.k-empty,.kit-datetimepicker-popup.k-popup .k-calendar-decadeview .k-calendar-td.k-empty,.kit-datetimepicker-popup.k-popup .k-calendar-centuryview .k-calendar-td.k-empty{width:54px;height:24px}.kit-datetimepicker-popup.k-popup .k-timeselector{height:100%}.kit-datetimepicker-popup.k-popup .k-time-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-time-header .k-title,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{padding:6px 8px;font-weight:400;line-height:20px}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{color:var(--ui-kit-color-grey-10)}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover{color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover:before{opacity:0}.kit-datetimepicker-popup.k-popup .k-time-list-container{justify-content:center;padding:10px 0;gap:20px}.kit-datetimepicker-popup.k-popup .k-reset{display:flex;flex-direction:column;align-items:center;width:auto}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper{flex-grow:0;padding:0;height:208px;min-width:auto}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper:before,.kit-datetimepicker-popup.k-popup .k-time-list-wrapper:after{display:none}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper .k-title{display:flex;align-items:center;justify-content:flex-end;color:var(--ui-kit-color-main);font-size:14px;font-weight:400;height:24px}.kit-datetimepicker-popup.k-popup .k-time-list:before,.kit-datetimepicker-popup.k-popup .k-time-list:after{display:none}.kit-datetimepicker-popup.k-popup .k-time-list .k-item{display:flex;align-items:center;justify-content:center;padding:5px 0;height:24px;width:38px;color:var(--ui-kit-color-grey-12);font-size:16px;font-weight:400}.kit-datetimepicker-popup.k-popup .k-time-list .k-item[aria-selected=true]{padding:10px 0;color:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-time-highlight{top:50%;height:34px;border-color:var(--ui-kit-color-grey-12);transform:none}.kit-datetimepicker-popup.k-popup .k-time-separator{top:16px;color:var(--ui-kit-color-grey-10);font-size:16px}.kit-datetimepicker-popup.k-popup .k-actions{margin:0;padding:10px 0 0;flex-direction:row-reverse;border-top:1px solid var(--ui-kit-color-grey-11)}.kit-datetimepicker-popup.k-popup .k-actions .k-button{flex:none;padding:0 19px;height:32px;font-size:14px;font-weight:400;border-radius:6px;border:1px solid var(--ui-kit-color-grey-11);transition:none}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept{border-color:transparent;background:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:hover{background:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:active{background:var(--ui-kit-color-main)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-accept:disabled{color:var(--ui-kit-color-grey-12);border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-grey-13)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel{background:var(--ui-kit-color-white)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel:hover{color:var(--ui-kit-color-hover);border-color:var(--ui-kit-color-hover)}.kit-datetimepicker-popup.k-popup .k-actions .k-button.k-time-cancel:active{border-color:var(--ui-kit-color-grey-11)}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
                 type: Input
             }], placeholder: [{
@@ -2722,11 +2722,11 @@ class KitDaterangeComponent {
         this.closed.emit(rangeValue);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitDaterangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: KitDaterangeComponent, isStandalone: false, selector: "kit-daterange", inputs: { type: "type", label: "label", startLabel: "startLabel", endLabel: "endLabel", startPlaceholder: "startPlaceholder", endPlaceholder: "endPlaceholder", format: "format", defaultStartDate: "defaultStartDate", defaultEndDate: "defaultEndDate", min: "min", max: "max", disabled: "disabled", invalid: "invalid", messageIcon: "messageIcon", messageText: "messageText", startDateControl: "startDateControl", endDateControl: "endDateControl" }, outputs: { startDateChanged: "startDateChanged", closed: "closed", endDateChanged: "endDateChanged" }, viewQueries: [{ propertyName: "popup", first: true, predicate: ["popup"], descendants: true, read: DateRangePopupComponent }], ngImport: i0, template: "<div class=\"kit-daterange\"\n     [class.disabled]=\"disabled\"\n     [class.invalid]=\"invalid\"\n     [ngClass]=\"type\">\n  <button #anchor\n          class=\"daterange-button\"\n          [disabled]=\"disabled\"\n          (click)=\"openCalendarPopup()\">\n    <div class=\"button-text\">{{ label }}</div>\n    <kit-svg-icon class=\"button-icon\"\n                  [icon]=\"icon\"\n    ></kit-svg-icon>\n  </button>\n  <kendo-daterange class=\"daterange-wrapper\">\n    <div class=\"daterange-input-wrapper\">\n      @if (startLabel) {\n        <kit-input-label class=\"label\"\n                         [text]=\"startLabel\"\n                         [for]=\"$any(startInput)\"\n        ></kit-input-label>\n      }\n      <div class=\"daterange-input\">\n        <kendo-dateinput #startInput\n                         kendoDateRangeStartInput\n                         [placeholder]=\"startPlaceholder\"\n                         [format]=\"format\"\n                         [value]=\"startDateControl.value || defaultStartDate\"\n                         [min]=\"min\"\n                         [disabled]=\"disabled\"\n                         (blur)=\"onBlur()\"\n                         (valueChange)=\"onStartDateChange($event)\"\n        ></kendo-dateinput>\n        <button class=\"daterange-input-button\"\n                [disabled]=\"disabled\"\n                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    <div class=\"daterange-input-wrapper\">\n      @if (endLabel) {\n        <kit-input-label class=\"label\"\n                         [text]=\"endLabel\"\n                         [for]=\"$any(endInput)\"\n        ></kit-input-label>\n      }\n      <div class=\"daterange-input\">\n        <kendo-dateinput #endInput\n                         kendoDateRangeEndInput\n                         [placeholder]=\"endPlaceholder\"\n                         [format]=\"format\"\n                         [value]=\"endDateControl.value || defaultEndDate\"\n                         [max]=\"max\"\n                         [disabled]=\"disabled\"\n                         (blur)=\"onBlur()\"\n                         (valueChange)=\"onEndDateChange($event)\"\n        ></kendo-dateinput>\n        <button class=\"daterange-input-button\"\n                [disabled]=\"disabled\"\n                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    @if (type === KitDaterangeType.DEFAULT) {\n      <kendo-daterange-popup #popup\n                             appendTo=\"component\"\n                             (close)=\"onClose()\"\n      ></kendo-daterange-popup>\n    }\n    @if (type === KitDaterangeType.BUTTON) {\n      <kendo-daterange-popup #popup\n                             appendTo=\"component\"\n                             [anchor]=\"$any(anchor)\"\n                             (close)=\"onClose()\"\n      ></kendo-daterange-popup>\n    }\n  </kendo-daterange>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-daterange.button .daterange-button{display:flex}.kit-daterange.button .daterange-input-wrapper{display:none}.kit-daterange.invalid .daterange-button{border-color:var(--ui-kit-color-red-1)}.kit-daterange.invalid .daterange-button .button-icon{fill:var(--ui-kit-color-red-1)}.kit-daterange.invalid .k-dateinput{border-color:var(--ui-kit-color-red-1)}.kit-daterange.invalid .daterange-input-button .button-icon{fill:var(--ui-kit-color-red-1)}.kit-daterange.disabled .daterange-button{border-color:var(--ui-kit-color-grey-11);cursor:default}.kit-daterange.disabled .daterange-button .button-text{color:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .daterange-button .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .daterange-button:hover{border-color:var(--ui-kit-color-grey-11)}.kit-daterange.disabled .daterange-button:hover .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);border-color:var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-grey-13)}.kit-daterange.disabled .daterange-input-button,.kit-daterange.disabled .daterange-input-button:hover{cursor:default}.kit-daterange.disabled .daterange-input-button .button-icon,.kit-daterange.disabled .daterange-input-button:hover .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange .daterange-button{display:none;align-items:center;gap:8px;padding:0 12px;width:100%;height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-white);cursor:pointer}.kit-daterange .daterange-button .button-text{flex-grow:1;color:var(--ui-kit-color-grey-10);font-size:14px;text-align:left}.kit-daterange .daterange-button .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-daterange .daterange-button:hover{border-color:var(--ui-kit-color-hover)}.kit-daterange .daterange-button:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-daterange .daterange-wrapper{display:flex;gap:10px}.kit-daterange .label{display:block;margin-bottom:4px}.kit-daterange .daterange-input{display:flex;align-items:center;position:relative}.kit-daterange .daterange-input-button{position:absolute;right:0;padding:0 12px 0 8px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-daterange .daterange-input-button:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-daterange .daterange-input-button .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-daterange .kit-daterange-default{display:flex}.kit-daterange .k-dateinput{height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-white)}.kit-daterange .k-dateinput:hover{border-color:var(--ui-kit-color-hover)}.kit-daterange .k-dateinput.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-daterange .k-dateinput.k-focus+.daterange-input-button .button-icon{fill:var(--ui-kit-color-main)}.kit-daterange .k-input-inner{padding:0 36px 0 12px;width:100%;font-size:14px;font-weight:400;color:var(--ui-kit-color-grey-10)}.kit-daterange .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-daterange .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-daterange .k-popup{margin-top:10px;padding:8px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-daterange .k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-weight:400;line-height:20px;border-radius:4px;border:none}.kit-daterange .k-popup .k-calendar-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-daterange .k-popup .k-calendar-nav-prev,.kit-daterange .k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-daterange .k-popup .k-calendar-nav-prev:before,.kit-daterange .k-popup .k-calendar-nav-next:before{opacity:0}.kit-daterange .k-popup .k-calendar-nav-prev:hover,.kit-daterange .k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-daterange .k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 8px;color:var(--ui-kit-color-grey-10)}.kit-daterange .k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-daterange .k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-daterange .k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-daterange .k-popup .k-calendar-view{padding:10px 0 0;gap:16px;box-sizing:border-box}.kit-daterange .k-popup .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-daterange .k-popup .k-calendar-tr{display:flex;gap:16px}.kit-daterange .k-popup .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-daterange .k-popup .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-daterange .k-popup .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-daterange .k-popup .k-calendar-td:focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-daterange .k-popup .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-range-mid{background:var(--ui-kit-color-selected)}.kit-daterange .k-popup .k-calendar-td.k-range-mid .k-link{color:var(--ui-kit-color-main)}.kit-daterange .k-popup .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-daterange .k-popup .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize}.kit-daterange .k-popup .k-calendar-monthview .k-link{width:24px}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.DateInputComponent, selector: "kendo-dateinput", inputs: ["focusableId", "pickerType", "clearButton", "disabled", "readonly", "title", "tabindex", "role", "ariaReadOnly", "tabIndex", "isRequired", "format", "formatPlaceholder", "placeholder", "steps", "max", "min", "rangeValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "allowCaretMode", "autoFill", "incompleteDateValidation", "twoDigitYearMax", "enableMouseWheel", "value", "spinners", "isPopupOpen", "hasPopup", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "valueUpdate", "focus", "blur"], exportAs: ["kendo-dateinput"] }, { kind: "directive", type: i2.DateRangeEndInputDirective, selector: "[kendoDateRangeEndInput]", inputs: ["autoCorrectOn", "navigateCalendarOnFocus"] }, { kind: "component", type: i2.DateRangeComponent, selector: "kendo-daterange", inputs: ["size"] }, { kind: "component", type: i2.DateRangePopupComponent, selector: "kendo-daterange-popup", inputs: ["showCalendarHeader", "focusedDate", "disabledDates", "activeView", "bottomView", "topView", "min", "max", "allowReverse", "animateNavigation", "disabled", "views", "weekNumber", "animate", "anchor", "anchorAlign", "showViewHeader", "showOtherMonthDays", "appendTo", "collision", "popupAlign", "margin", "adaptiveMode", "title", "subtitle", "size"], outputs: ["open", "close", "blur", "focus", "cancel"], exportAs: ["kendo-daterange-popup"] }, { kind: "directive", type: i2.DateRangeStartInputDirective, selector: "[kendoDateRangeStartInput]", inputs: ["autoCorrectOn", "navigateCalendarOnFocus"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: KitDaterangeComponent, isStandalone: false, selector: "kit-daterange", inputs: { type: "type", label: "label", startLabel: "startLabel", endLabel: "endLabel", startPlaceholder: "startPlaceholder", endPlaceholder: "endPlaceholder", format: "format", defaultStartDate: "defaultStartDate", defaultEndDate: "defaultEndDate", min: "min", max: "max", disabled: "disabled", invalid: "invalid", messageIcon: "messageIcon", messageText: "messageText", startDateControl: "startDateControl", endDateControl: "endDateControl" }, outputs: { startDateChanged: "startDateChanged", closed: "closed", endDateChanged: "endDateChanged" }, viewQueries: [{ propertyName: "popup", first: true, predicate: ["popup"], descendants: true, read: DateRangePopupComponent }], ngImport: i0, template: "<div class=\"kit-daterange\"\n     [class.disabled]=\"disabled\"\n     [class.invalid]=\"invalid\"\n     [ngClass]=\"type\">\n  <button #anchor\n          class=\"daterange-button\"\n          [disabled]=\"disabled\"\n          (click)=\"openCalendarPopup()\">\n    <div class=\"button-text\">{{ label }}</div>\n    <kit-svg-icon class=\"button-icon\"\n                  [icon]=\"icon\"\n    ></kit-svg-icon>\n  </button>\n  <kendo-daterange class=\"daterange-wrapper\">\n    <div class=\"daterange-input-wrapper\">\n      @if (startLabel) {\n        <kit-input-label class=\"label\"\n                         [text]=\"startLabel\"\n                         [for]=\"$any(startInput)\"\n        ></kit-input-label>\n      }\n      <div class=\"daterange-input\">\n        <kendo-dateinput #startInput\n                         kendoDateRangeStartInput\n                         [placeholder]=\"startPlaceholder\"\n                         [format]=\"format\"\n                         [value]=\"startDateControl.value || defaultStartDate\"\n                         [min]=\"min\"\n                         [disabled]=\"disabled\"\n                         (blur)=\"onBlur()\"\n                         (valueChange)=\"onStartDateChange($event)\"\n        ></kendo-dateinput>\n        <button class=\"daterange-input-button\"\n                [disabled]=\"disabled\"\n                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    <div class=\"daterange-input-wrapper\">\n      @if (endLabel) {\n        <kit-input-label class=\"label\"\n                         [text]=\"endLabel\"\n                         [for]=\"$any(endInput)\"\n        ></kit-input-label>\n      }\n      <div class=\"daterange-input\">\n        <kendo-dateinput #endInput\n                         kendoDateRangeEndInput\n                         [placeholder]=\"endPlaceholder\"\n                         [format]=\"format\"\n                         [value]=\"endDateControl.value || defaultEndDate\"\n                         [max]=\"max\"\n                         [disabled]=\"disabled\"\n                         (blur)=\"onBlur()\"\n                         (valueChange)=\"onEndDateChange($event)\"\n        ></kendo-dateinput>\n        <button class=\"daterange-input-button\"\n                [disabled]=\"disabled\"\n                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    @if (type === KitDaterangeType.DEFAULT) {\n      <kendo-daterange-popup #popup\n                             appendTo=\"component\"\n                             (close)=\"onClose()\"\n      ></kendo-daterange-popup>\n    }\n    @if (type === KitDaterangeType.BUTTON) {\n      <kendo-daterange-popup #popup\n                             appendTo=\"component\"\n                             [anchor]=\"$any(anchor)\"\n                             (close)=\"onClose()\"\n      ></kendo-daterange-popup>\n    }\n  </kendo-daterange>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-daterange.button .daterange-button{display:flex}.kit-daterange.button .daterange-input-wrapper{display:none}.kit-daterange.invalid .daterange-button{border-color:var(--ui-kit-color-red-1)}.kit-daterange.invalid .daterange-button .button-icon{fill:var(--ui-kit-color-red-1)}.kit-daterange.invalid .k-dateinput{border-color:var(--ui-kit-color-red-1)}.kit-daterange.invalid .daterange-input-button .button-icon{fill:var(--ui-kit-color-red-1)}.kit-daterange.disabled .daterange-button{border-color:var(--ui-kit-color-grey-11);cursor:default}.kit-daterange.disabled .daterange-button .button-text{color:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .daterange-button .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .daterange-button:hover{border-color:var(--ui-kit-color-grey-11)}.kit-daterange.disabled .daterange-button:hover .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);border-color:var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-grey-13)}.kit-daterange.disabled .daterange-input-button,.kit-daterange.disabled .daterange-input-button:hover{cursor:default}.kit-daterange.disabled .daterange-input-button .button-icon,.kit-daterange.disabled .daterange-input-button:hover .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange .daterange-button{display:none;align-items:center;gap:8px;padding:0 12px;width:100%;height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-white);cursor:pointer}.kit-daterange .daterange-button .button-text{flex-grow:1;color:var(--ui-kit-color-grey-10);font-size:14px;text-align:left}.kit-daterange .daterange-button .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-daterange .daterange-button:hover{border-color:var(--ui-kit-color-hover)}.kit-daterange .daterange-button:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-daterange .daterange-wrapper{display:flex;gap:10px}.kit-daterange .label{display:block;margin-bottom:4px}.kit-daterange .daterange-input{display:flex;align-items:center;position:relative}.kit-daterange .daterange-input-button{position:absolute;right:0;padding:0 12px 0 8px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-daterange .daterange-input-button:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-daterange .daterange-input-button .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-daterange .kit-daterange-default{display:flex}.kit-daterange .k-dateinput{height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-white)}.kit-daterange .k-dateinput:hover{border-color:var(--ui-kit-color-hover)}.kit-daterange .k-dateinput.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-daterange .k-dateinput.k-focus+.daterange-input-button .button-icon{fill:var(--ui-kit-color-main)}.kit-daterange .k-input-inner{padding:0 36px 0 12px;width:100%;font-size:14px;font-weight:400;color:var(--ui-kit-color-grey-10)}.kit-daterange .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-daterange .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-daterange .k-popup{margin-top:10px;padding:8px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-daterange .k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-weight:400;line-height:20px;border-radius:4px;border:none}.kit-daterange .k-popup .k-calendar-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-daterange .k-popup .k-calendar-nav-prev,.kit-daterange .k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-daterange .k-popup .k-calendar-nav-prev:before,.kit-daterange .k-popup .k-calendar-nav-next:before{opacity:0}.kit-daterange .k-popup .k-calendar-nav-prev:hover,.kit-daterange .k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-daterange .k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 8px;color:var(--ui-kit-color-grey-10)}.kit-daterange .k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-daterange .k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-daterange .k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-daterange .k-popup .k-calendar-view{padding:10px 0 0;gap:16px;box-sizing:border-box}.kit-daterange .k-popup .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-daterange .k-popup .k-calendar-tr{display:flex;gap:16px}.kit-daterange .k-popup .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-daterange .k-popup .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-daterange .k-popup .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-daterange .k-popup .k-calendar-td:focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-daterange .k-popup .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-range-mid{background:var(--ui-kit-color-selected)}.kit-daterange .k-popup .k-calendar-td.k-range-mid .k-link{color:var(--ui-kit-color-main)}.kit-daterange .k-popup .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-daterange .k-popup .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize}.kit-daterange .k-popup .k-calendar-monthview .k-link{width:24px}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-td.k-empty{width:24px;height:24px}.kit-daterange .k-popup .k-calendar-yearview .k-calendar-td.k-empty,.kit-daterange .k-popup .k-calendar-decadeview .k-calendar-td.k-empty,.kit-daterange .k-popup .k-calendar-centuryview .k-calendar-td.k-empty{width:54px;height:24px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.DateInputComponent, selector: "kendo-dateinput", inputs: ["focusableId", "pickerType", "clearButton", "disabled", "readonly", "title", "tabindex", "role", "ariaReadOnly", "tabIndex", "isRequired", "format", "formatPlaceholder", "placeholder", "steps", "max", "min", "rangeValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "allowCaretMode", "autoFill", "incompleteDateValidation", "twoDigitYearMax", "enableMouseWheel", "value", "spinners", "isPopupOpen", "hasPopup", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "valueUpdate", "focus", "blur"], exportAs: ["kendo-dateinput"] }, { kind: "directive", type: i2.DateRangeEndInputDirective, selector: "[kendoDateRangeEndInput]", inputs: ["autoCorrectOn", "navigateCalendarOnFocus"] }, { kind: "component", type: i2.DateRangeComponent, selector: "kendo-daterange", inputs: ["size"] }, { kind: "component", type: i2.DateRangePopupComponent, selector: "kendo-daterange-popup", inputs: ["showCalendarHeader", "focusedDate", "disabledDates", "activeView", "bottomView", "topView", "min", "max", "allowReverse", "animateNavigation", "disabled", "views", "weekNumber", "animate", "anchor", "anchorAlign", "showViewHeader", "showOtherMonthDays", "appendTo", "collision", "popupAlign", "margin", "adaptiveMode", "title", "subtitle", "size"], outputs: ["open", "close", "blur", "focus", "cancel"], exportAs: ["kendo-daterange-popup"] }, { kind: "directive", type: i2.DateRangeStartInputDirective, selector: "[kendoDateRangeStartInput]", inputs: ["autoCorrectOn", "navigateCalendarOnFocus"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitDaterangeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kit-daterange', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: false, template: "<div class=\"kit-daterange\"\n     [class.disabled]=\"disabled\"\n     [class.invalid]=\"invalid\"\n     [ngClass]=\"type\">\n  <button #anchor\n          class=\"daterange-button\"\n          [disabled]=\"disabled\"\n          (click)=\"openCalendarPopup()\">\n    <div class=\"button-text\">{{ label }}</div>\n    <kit-svg-icon class=\"button-icon\"\n                  [icon]=\"icon\"\n    ></kit-svg-icon>\n  </button>\n  <kendo-daterange class=\"daterange-wrapper\">\n    <div class=\"daterange-input-wrapper\">\n      @if (startLabel) {\n        <kit-input-label class=\"label\"\n                         [text]=\"startLabel\"\n                         [for]=\"$any(startInput)\"\n        ></kit-input-label>\n      }\n      <div class=\"daterange-input\">\n        <kendo-dateinput #startInput\n                         kendoDateRangeStartInput\n                         [placeholder]=\"startPlaceholder\"\n                         [format]=\"format\"\n                         [value]=\"startDateControl.value || defaultStartDate\"\n                         [min]=\"min\"\n                         [disabled]=\"disabled\"\n                         (blur)=\"onBlur()\"\n                         (valueChange)=\"onStartDateChange($event)\"\n        ></kendo-dateinput>\n        <button class=\"daterange-input-button\"\n                [disabled]=\"disabled\"\n                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    <div class=\"daterange-input-wrapper\">\n      @if (endLabel) {\n        <kit-input-label class=\"label\"\n                         [text]=\"endLabel\"\n                         [for]=\"$any(endInput)\"\n        ></kit-input-label>\n      }\n      <div class=\"daterange-input\">\n        <kendo-dateinput #endInput\n                         kendoDateRangeEndInput\n                         [placeholder]=\"endPlaceholder\"\n                         [format]=\"format\"\n                         [value]=\"endDateControl.value || defaultEndDate\"\n                         [max]=\"max\"\n                         [disabled]=\"disabled\"\n                         (blur)=\"onBlur()\"\n                         (valueChange)=\"onEndDateChange($event)\"\n        ></kendo-dateinput>\n        <button class=\"daterange-input-button\"\n                [disabled]=\"disabled\"\n                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    @if (type === KitDaterangeType.DEFAULT) {\n      <kendo-daterange-popup #popup\n                             appendTo=\"component\"\n                             (close)=\"onClose()\"\n      ></kendo-daterange-popup>\n    }\n    @if (type === KitDaterangeType.BUTTON) {\n      <kendo-daterange-popup #popup\n                             appendTo=\"component\"\n                             [anchor]=\"$any(anchor)\"\n                             (close)=\"onClose()\"\n      ></kendo-daterange-popup>\n    }\n  </kendo-daterange>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-daterange.button .daterange-button{display:flex}.kit-daterange.button .daterange-input-wrapper{display:none}.kit-daterange.invalid .daterange-button{border-color:var(--ui-kit-color-red-1)}.kit-daterange.invalid .daterange-button .button-icon{fill:var(--ui-kit-color-red-1)}.kit-daterange.invalid .k-dateinput{border-color:var(--ui-kit-color-red-1)}.kit-daterange.invalid .daterange-input-button .button-icon{fill:var(--ui-kit-color-red-1)}.kit-daterange.disabled .daterange-button{border-color:var(--ui-kit-color-grey-11);cursor:default}.kit-daterange.disabled .daterange-button .button-text{color:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .daterange-button .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .daterange-button:hover{border-color:var(--ui-kit-color-grey-11)}.kit-daterange.disabled .daterange-button:hover .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);border-color:var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-grey-13)}.kit-daterange.disabled .daterange-input-button,.kit-daterange.disabled .daterange-input-button:hover{cursor:default}.kit-daterange.disabled .daterange-input-button .button-icon,.kit-daterange.disabled .daterange-input-button:hover .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange .daterange-button{display:none;align-items:center;gap:8px;padding:0 12px;width:100%;height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-white);cursor:pointer}.kit-daterange .daterange-button .button-text{flex-grow:1;color:var(--ui-kit-color-grey-10);font-size:14px;text-align:left}.kit-daterange .daterange-button .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-daterange .daterange-button:hover{border-color:var(--ui-kit-color-hover)}.kit-daterange .daterange-button:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-daterange .daterange-wrapper{display:flex;gap:10px}.kit-daterange .label{display:block;margin-bottom:4px}.kit-daterange .daterange-input{display:flex;align-items:center;position:relative}.kit-daterange .daterange-input-button{position:absolute;right:0;padding:0 12px 0 8px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-daterange .daterange-input-button:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-daterange .daterange-input-button .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-daterange .kit-daterange-default{display:flex}.kit-daterange .k-dateinput{height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-white)}.kit-daterange .k-dateinput:hover{border-color:var(--ui-kit-color-hover)}.kit-daterange .k-dateinput.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-daterange .k-dateinput.k-focus+.daterange-input-button .button-icon{fill:var(--ui-kit-color-main)}.kit-daterange .k-input-inner{padding:0 36px 0 12px;width:100%;font-size:14px;font-weight:400;color:var(--ui-kit-color-grey-10)}.kit-daterange .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-daterange .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-daterange .k-popup{margin-top:10px;padding:8px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-daterange .k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-weight:400;line-height:20px;border-radius:4px;border:none}.kit-daterange .k-popup .k-calendar-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-daterange .k-popup .k-calendar-nav-prev,.kit-daterange .k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-daterange .k-popup .k-calendar-nav-prev:before,.kit-daterange .k-popup .k-calendar-nav-next:before{opacity:0}.kit-daterange .k-popup .k-calendar-nav-prev:hover,.kit-daterange .k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-daterange .k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 8px;color:var(--ui-kit-color-grey-10)}.kit-daterange .k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-daterange .k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-daterange .k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-daterange .k-popup .k-calendar-view{padding:10px 0 0;gap:16px;box-sizing:border-box}.kit-daterange .k-popup .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-daterange .k-popup .k-calendar-tr{display:flex;gap:16px}.kit-daterange .k-popup .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-daterange .k-popup .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-daterange .k-popup .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-daterange .k-popup .k-calendar-td:focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-daterange .k-popup .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-range-mid{background:var(--ui-kit-color-selected)}.kit-daterange .k-popup .k-calendar-td.k-range-mid .k-link{color:var(--ui-kit-color-main)}.kit-daterange .k-popup .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-daterange .k-popup .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize}.kit-daterange .k-popup .k-calendar-monthview .k-link{width:24px}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}\n"] }]
+            args: [{ selector: 'kit-daterange', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: false, template: "<div class=\"kit-daterange\"\n     [class.disabled]=\"disabled\"\n     [class.invalid]=\"invalid\"\n     [ngClass]=\"type\">\n  <button #anchor\n          class=\"daterange-button\"\n          [disabled]=\"disabled\"\n          (click)=\"openCalendarPopup()\">\n    <div class=\"button-text\">{{ label }}</div>\n    <kit-svg-icon class=\"button-icon\"\n                  [icon]=\"icon\"\n    ></kit-svg-icon>\n  </button>\n  <kendo-daterange class=\"daterange-wrapper\">\n    <div class=\"daterange-input-wrapper\">\n      @if (startLabel) {\n        <kit-input-label class=\"label\"\n                         [text]=\"startLabel\"\n                         [for]=\"$any(startInput)\"\n        ></kit-input-label>\n      }\n      <div class=\"daterange-input\">\n        <kendo-dateinput #startInput\n                         kendoDateRangeStartInput\n                         [placeholder]=\"startPlaceholder\"\n                         [format]=\"format\"\n                         [value]=\"startDateControl.value || defaultStartDate\"\n                         [min]=\"min\"\n                         [disabled]=\"disabled\"\n                         (blur)=\"onBlur()\"\n                         (valueChange)=\"onStartDateChange($event)\"\n        ></kendo-dateinput>\n        <button class=\"daterange-input-button\"\n                [disabled]=\"disabled\"\n                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    <div class=\"daterange-input-wrapper\">\n      @if (endLabel) {\n        <kit-input-label class=\"label\"\n                         [text]=\"endLabel\"\n                         [for]=\"$any(endInput)\"\n        ></kit-input-label>\n      }\n      <div class=\"daterange-input\">\n        <kendo-dateinput #endInput\n                         kendoDateRangeEndInput\n                         [placeholder]=\"endPlaceholder\"\n                         [format]=\"format\"\n                         [value]=\"endDateControl.value || defaultEndDate\"\n                         [max]=\"max\"\n                         [disabled]=\"disabled\"\n                         (blur)=\"onBlur()\"\n                         (valueChange)=\"onEndDateChange($event)\"\n        ></kendo-dateinput>\n        <button class=\"daterange-input-button\"\n                [disabled]=\"disabled\"\n                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    @if (type === KitDaterangeType.DEFAULT) {\n      <kendo-daterange-popup #popup\n                             appendTo=\"component\"\n                             (close)=\"onClose()\"\n      ></kendo-daterange-popup>\n    }\n    @if (type === KitDaterangeType.BUTTON) {\n      <kendo-daterange-popup #popup\n                             appendTo=\"component\"\n                             [anchor]=\"$any(anchor)\"\n                             (close)=\"onClose()\"\n      ></kendo-daterange-popup>\n    }\n  </kendo-daterange>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-daterange.button .daterange-button{display:flex}.kit-daterange.button .daterange-input-wrapper{display:none}.kit-daterange.invalid .daterange-button{border-color:var(--ui-kit-color-red-1)}.kit-daterange.invalid .daterange-button .button-icon{fill:var(--ui-kit-color-red-1)}.kit-daterange.invalid .k-dateinput{border-color:var(--ui-kit-color-red-1)}.kit-daterange.invalid .daterange-input-button .button-icon{fill:var(--ui-kit-color-red-1)}.kit-daterange.disabled .daterange-button{border-color:var(--ui-kit-color-grey-11);cursor:default}.kit-daterange.disabled .daterange-button .button-text{color:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .daterange-button .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .daterange-button:hover{border-color:var(--ui-kit-color-grey-11)}.kit-daterange.disabled .daterange-button:hover .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);border-color:var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-grey-13)}.kit-daterange.disabled .daterange-input-button,.kit-daterange.disabled .daterange-input-button:hover{cursor:default}.kit-daterange.disabled .daterange-input-button .button-icon,.kit-daterange.disabled .daterange-input-button:hover .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-daterange .daterange-button{display:none;align-items:center;gap:8px;padding:0 12px;width:100%;height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-white);cursor:pointer}.kit-daterange .daterange-button .button-text{flex-grow:1;color:var(--ui-kit-color-grey-10);font-size:14px;text-align:left}.kit-daterange .daterange-button .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-daterange .daterange-button:hover{border-color:var(--ui-kit-color-hover)}.kit-daterange .daterange-button:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-daterange .daterange-wrapper{display:flex;gap:10px}.kit-daterange .label{display:block;margin-bottom:4px}.kit-daterange .daterange-input{display:flex;align-items:center;position:relative}.kit-daterange .daterange-input-button{position:absolute;right:0;padding:0 12px 0 8px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-daterange .daterange-input-button:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-daterange .daterange-input-button .button-icon{display:block;width:16px;height:16px;stroke:none;fill:var(--ui-kit-color-grey-12)}.kit-daterange .kit-daterange-default{display:flex}.kit-daterange .k-dateinput{height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-white)}.kit-daterange .k-dateinput:hover{border-color:var(--ui-kit-color-hover)}.kit-daterange .k-dateinput.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-daterange .k-dateinput.k-focus+.daterange-input-button .button-icon{fill:var(--ui-kit-color-main)}.kit-daterange .k-input-inner{padding:0 36px 0 12px;width:100%;font-size:14px;font-weight:400;color:var(--ui-kit-color-grey-10)}.kit-daterange .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-daterange .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-daterange .k-popup{margin-top:10px;padding:8px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-daterange .k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-weight:400;line-height:20px;border-radius:4px;border:none}.kit-daterange .k-popup .k-calendar-header{padding:0 0 10px;color:var(--ui-kit-color-grey-10);font-size:14px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-daterange .k-popup .k-calendar-nav-prev,.kit-daterange .k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-daterange .k-popup .k-calendar-nav-prev:before,.kit-daterange .k-popup .k-calendar-nav-next:before{opacity:0}.kit-daterange .k-popup .k-calendar-nav-prev:hover,.kit-daterange .k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-daterange .k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 8px;color:var(--ui-kit-color-grey-10)}.kit-daterange .k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-daterange .k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-daterange .k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-daterange .k-popup .k-calendar-view{padding:10px 0 0;gap:16px;box-sizing:border-box}.kit-daterange .k-popup .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-daterange .k-popup .k-calendar-tr{display:flex;gap:16px}.kit-daterange .k-popup .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-daterange .k-popup .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-daterange .k-popup .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-daterange .k-popup .k-calendar-td:focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-daterange .k-popup .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-range-mid{background:var(--ui-kit-color-selected)}.kit-daterange .k-popup .k-calendar-td.k-range-mid .k-link{color:var(--ui-kit-color-main)}.kit-daterange .k-popup .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-daterange .k-popup .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize}.kit-daterange .k-popup .k-calendar-monthview .k-link{width:24px}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}.kit-daterange .k-popup .k-calendar-monthview .k-calendar-td.k-empty{width:24px;height:24px}.kit-daterange .k-popup .k-calendar-yearview .k-calendar-td.k-empty,.kit-daterange .k-popup .k-calendar-decadeview .k-calendar-td.k-empty,.kit-daterange .k-popup .k-calendar-centuryview .k-calendar-td.k-empty{width:54px;height:24px}\n"] }]
         }], propDecorators: { type: [{
                 type: Input
             }], label: [{
@@ -4595,7 +4595,7 @@ class KitDatepickerComponent {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => KitDatepickerComponent),
                 multi: true,
-            }], viewQueries: [{ propertyName: "datepicker", first: true, predicate: ["datepicker"], descendants: true }], ngImport: i0, template: "<div class=\"kit-datepicker\"\n     [class.disabled]=\"disabled\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"$any(datepicker)\"\n    ></kit-input-label>\n  }\n\n  <div class=\"kit-datepicker-input\">\n    <kendo-datepicker #datepicker\n                      calendarType=\"classic\"\n                      [placeholder]=\"placeholder\"\n                      [disabled]=\"disabled\"\n                      [format]=\"format\"\n                      [min]=\"min\"\n                      [max]=\"max\"\n                      [popupSettings]=\"datepickerPopupSettings\"\n                      [(value)]=\"defaultDate\"\n                      [focusedDate]=\"defaultDate\"\n                      (blur)=\"onBlur()\"\n                      (valueChange)=\"onValueChange($event)\"\n    ></kendo-datepicker>\n    <button class=\"toggle-btn\"\n            (click)=\"onPopupToggle()\">\n      <kit-svg-icon class=\"button-icon\"\n                    [icon]=\"calendarIcon\"\n      ></kit-svg-icon>\n    </button>\n  </div>\n\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-datepicker .label{display:block;margin-bottom:4px}.kit-datepicker-input{position:relative}.kit-datepicker .k-input-button{display:none}.kit-datepicker .toggle-btn{position:absolute;top:0;right:0;padding:0 12px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-datepicker .toggle-btn .button-icon{display:block;width:16px;height:16px;fill:var(--ui-kit-color-grey-12);stroke:none}.kit-datepicker .toggle-btn:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-datepicker:hover .k-datepicker{border-color:var(--ui-kit-color-hover)}.kit-datepicker .k-datepicker{height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);box-shadow:none}.kit-datepicker .k-datepicker.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-datepicker .k-datepicker.k-focus+.toggle-btn .button-icon{fill:var(--ui-kit-color-main)}.kit-datepicker .k-input-inner{padding:0 12px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400}.kit-datepicker .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-datepicker .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-datepicker.disabled .k-datepicker{border-color:var(--ui-kit-color-grey-12)}.kit-datepicker.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-grey-13)}.kit-datepicker.disabled .toggle-btn{cursor:default}.kit-datepicker.disabled .toggle-btn .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup{margin-top:10px;padding:8px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-datepicker-popup.k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-datepicker-popup.k-popup .k-calendar-header{padding:0 0 10px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datepicker-popup.k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400;border-radius:4px;border:none}.kit-datepicker-popup.k-popup .k-calendar-title:hover{background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-nav-today{padding:2px 8px;color:var(--ui-kit-color-grey-10)}.kit-datepicker-popup.k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-datepicker-popup.k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-datepicker-popup.k-popup .k-calendar-nav-prev,.kit-datepicker-popup.k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup .k-calendar-nav-prev:before,.kit-datepicker-popup.k-popup .k-calendar-nav-next:before{opacity:0}.kit-datepicker-popup.k-popup .k-calendar-nav-prev:hover,.kit-datepicker-popup.k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-datepicker-popup.k-popup .k-calendar-view{padding:10px 0 0;min-height:auto;width:auto}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td:focus .k-link{box-shadow:none}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-datepicker-popup.k-popup .k-calendar-view .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-tr{display:flex;gap:16px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize;line-height:20px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-link{width:24px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}\n"], dependencies: [{ kind: "component", type: i2.DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "clearButton", "inputAttributes", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "footer", "navigationItemTemplate", "weekDaysFormat", "showOtherMonthDays", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "autoFill", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "title", "subtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close", "escape"], exportAs: ["kendo-datepicker"] }, { kind: "component", type: KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }, { kind: "component", type: KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+            }], viewQueries: [{ propertyName: "datepicker", first: true, predicate: ["datepicker"], descendants: true }], ngImport: i0, template: "<div class=\"kit-datepicker\"\n     [class.disabled]=\"disabled\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"$any(datepicker)\"\n    ></kit-input-label>\n  }\n\n  <div class=\"kit-datepicker-input\">\n    <kendo-datepicker #datepicker\n                      calendarType=\"classic\"\n                      [placeholder]=\"placeholder\"\n                      [disabled]=\"disabled\"\n                      [format]=\"format\"\n                      [min]=\"min\"\n                      [max]=\"max\"\n                      [popupSettings]=\"datepickerPopupSettings\"\n                      [(value)]=\"defaultDate\"\n                      [focusedDate]=\"defaultDate\"\n                      (blur)=\"onBlur()\"\n                      (valueChange)=\"onValueChange($event)\"\n    ></kendo-datepicker>\n    <button class=\"toggle-btn\"\n            (click)=\"onPopupToggle()\">\n      <kit-svg-icon class=\"button-icon\"\n                    [icon]=\"calendarIcon\"\n      ></kit-svg-icon>\n    </button>\n  </div>\n\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-datepicker .label{display:block;margin-bottom:4px}.kit-datepicker-input{position:relative}.kit-datepicker .k-input-button{display:none}.kit-datepicker .toggle-btn{position:absolute;top:0;right:0;padding:0 12px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-datepicker .toggle-btn .button-icon{display:block;width:16px;height:16px;fill:var(--ui-kit-color-grey-12);stroke:none}.kit-datepicker .toggle-btn:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-datepicker:hover .k-datepicker{border-color:var(--ui-kit-color-hover)}.kit-datepicker .k-datepicker{height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);box-shadow:none}.kit-datepicker .k-datepicker.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-datepicker .k-datepicker.k-focus+.toggle-btn .button-icon{fill:var(--ui-kit-color-main)}.kit-datepicker .k-input-inner{padding:0 12px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400}.kit-datepicker .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-datepicker .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-datepicker.disabled .k-datepicker{border-color:var(--ui-kit-color-grey-12)}.kit-datepicker.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-grey-13)}.kit-datepicker.disabled .toggle-btn{cursor:default}.kit-datepicker.disabled .toggle-btn .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup{margin-top:10px;padding:8px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-datepicker-popup.k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-datepicker-popup.k-popup .k-calendar-header{padding:0 0 10px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datepicker-popup.k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400;border-radius:4px;border:none}.kit-datepicker-popup.k-popup .k-calendar-title:hover{background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-nav-today{padding:2px 8px;color:var(--ui-kit-color-grey-10)}.kit-datepicker-popup.k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-datepicker-popup.k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-datepicker-popup.k-popup .k-calendar-nav-prev,.kit-datepicker-popup.k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup .k-calendar-nav-prev:before,.kit-datepicker-popup.k-popup .k-calendar-nav-next:before{opacity:0}.kit-datepicker-popup.k-popup .k-calendar-nav-prev:hover,.kit-datepicker-popup.k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-datepicker-popup.k-popup .k-calendar-view{padding:10px 0 0;min-height:auto;width:auto}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td:focus .k-link{box-shadow:none}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-datepicker-popup.k-popup .k-calendar-view .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-tr{display:flex;gap:16px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize;line-height:20px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-link{width:24px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-empty{width:24px;height:24px}.kit-datepicker-popup.k-popup .k-calendar-yearview .k-calendar-td.k-empty,.kit-datepicker-popup.k-popup .k-calendar-decadeview .k-calendar-td.k-empty,.kit-datepicker-popup.k-popup .k-calendar-centuryview .k-calendar-td.k-empty{width:54px;height:24px}\n"], dependencies: [{ kind: "component", type: i2.DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "clearButton", "inputAttributes", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "footer", "navigationItemTemplate", "weekDaysFormat", "showOtherMonthDays", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "autoFill", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "title", "subtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close", "escape"], exportAs: ["kendo-datepicker"] }, { kind: "component", type: KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }, { kind: "component", type: KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitDatepickerComponent, decorators: [{
             type: Component,
@@ -4603,7 +4603,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => KitDatepickerComponent),
                             multi: true,
-                        }], standalone: false, template: "<div class=\"kit-datepicker\"\n     [class.disabled]=\"disabled\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"$any(datepicker)\"\n    ></kit-input-label>\n  }\n\n  <div class=\"kit-datepicker-input\">\n    <kendo-datepicker #datepicker\n                      calendarType=\"classic\"\n                      [placeholder]=\"placeholder\"\n                      [disabled]=\"disabled\"\n                      [format]=\"format\"\n                      [min]=\"min\"\n                      [max]=\"max\"\n                      [popupSettings]=\"datepickerPopupSettings\"\n                      [(value)]=\"defaultDate\"\n                      [focusedDate]=\"defaultDate\"\n                      (blur)=\"onBlur()\"\n                      (valueChange)=\"onValueChange($event)\"\n    ></kendo-datepicker>\n    <button class=\"toggle-btn\"\n            (click)=\"onPopupToggle()\">\n      <kit-svg-icon class=\"button-icon\"\n                    [icon]=\"calendarIcon\"\n      ></kit-svg-icon>\n    </button>\n  </div>\n\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-datepicker .label{display:block;margin-bottom:4px}.kit-datepicker-input{position:relative}.kit-datepicker .k-input-button{display:none}.kit-datepicker .toggle-btn{position:absolute;top:0;right:0;padding:0 12px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-datepicker .toggle-btn .button-icon{display:block;width:16px;height:16px;fill:var(--ui-kit-color-grey-12);stroke:none}.kit-datepicker .toggle-btn:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-datepicker:hover .k-datepicker{border-color:var(--ui-kit-color-hover)}.kit-datepicker .k-datepicker{height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);box-shadow:none}.kit-datepicker .k-datepicker.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-datepicker .k-datepicker.k-focus+.toggle-btn .button-icon{fill:var(--ui-kit-color-main)}.kit-datepicker .k-input-inner{padding:0 12px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400}.kit-datepicker .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-datepicker .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-datepicker.disabled .k-datepicker{border-color:var(--ui-kit-color-grey-12)}.kit-datepicker.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-grey-13)}.kit-datepicker.disabled .toggle-btn{cursor:default}.kit-datepicker.disabled .toggle-btn .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup{margin-top:10px;padding:8px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-datepicker-popup.k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-datepicker-popup.k-popup .k-calendar-header{padding:0 0 10px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datepicker-popup.k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400;border-radius:4px;border:none}.kit-datepicker-popup.k-popup .k-calendar-title:hover{background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-nav-today{padding:2px 8px;color:var(--ui-kit-color-grey-10)}.kit-datepicker-popup.k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-datepicker-popup.k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-datepicker-popup.k-popup .k-calendar-nav-prev,.kit-datepicker-popup.k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup .k-calendar-nav-prev:before,.kit-datepicker-popup.k-popup .k-calendar-nav-next:before{opacity:0}.kit-datepicker-popup.k-popup .k-calendar-nav-prev:hover,.kit-datepicker-popup.k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-datepicker-popup.k-popup .k-calendar-view{padding:10px 0 0;min-height:auto;width:auto}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td:focus .k-link{box-shadow:none}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-datepicker-popup.k-popup .k-calendar-view .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-tr{display:flex;gap:16px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize;line-height:20px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-link{width:24px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}\n"] }]
+                        }], standalone: false, template: "<div class=\"kit-datepicker\"\n     [class.disabled]=\"disabled\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"$any(datepicker)\"\n    ></kit-input-label>\n  }\n\n  <div class=\"kit-datepicker-input\">\n    <kendo-datepicker #datepicker\n                      calendarType=\"classic\"\n                      [placeholder]=\"placeholder\"\n                      [disabled]=\"disabled\"\n                      [format]=\"format\"\n                      [min]=\"min\"\n                      [max]=\"max\"\n                      [popupSettings]=\"datepickerPopupSettings\"\n                      [(value)]=\"defaultDate\"\n                      [focusedDate]=\"defaultDate\"\n                      (blur)=\"onBlur()\"\n                      (valueChange)=\"onValueChange($event)\"\n    ></kendo-datepicker>\n    <button class=\"toggle-btn\"\n            (click)=\"onPopupToggle()\">\n      <kit-svg-icon class=\"button-icon\"\n                    [icon]=\"calendarIcon\"\n      ></kit-svg-icon>\n    </button>\n  </div>\n\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".kit-datepicker .label{display:block;margin-bottom:4px}.kit-datepicker-input{position:relative}.kit-datepicker .k-input-button{display:none}.kit-datepicker .toggle-btn{position:absolute;top:0;right:0;padding:0 12px;height:100%;border:none;background:none;cursor:pointer;z-index:1}.kit-datepicker .toggle-btn .button-icon{display:block;width:16px;height:16px;fill:var(--ui-kit-color-grey-12);stroke:none}.kit-datepicker .toggle-btn:hover .button-icon{fill:var(--ui-kit-color-hover)}.kit-datepicker:hover .k-datepicker{border-color:var(--ui-kit-color-hover)}.kit-datepicker .k-datepicker{height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);box-shadow:none}.kit-datepicker .k-datepicker.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-datepicker .k-datepicker.k-focus+.toggle-btn .button-icon{fill:var(--ui-kit-color-main)}.kit-datepicker .k-input-inner{padding:0 12px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400}.kit-datepicker .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-datepicker .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-datepicker.disabled .k-datepicker{border-color:var(--ui-kit-color-grey-12)}.kit-datepicker.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-grey-13)}.kit-datepicker.disabled .toggle-btn{cursor:default}.kit-datepicker.disabled .toggle-btn .button-icon{fill:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup{margin-top:10px;padding:8px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-datepicker-popup.k-popup .k-calendar-table{display:flex;flex-direction:column;gap:6px;padding:3px 8px}.kit-datepicker-popup.k-popup .k-calendar-header{padding:0 0 10px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-datepicker-popup.k-popup .k-calendar-title{padding:6px 8px;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400;border-radius:4px;border:none}.kit-datepicker-popup.k-popup .k-calendar-title:hover{background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-nav-today{padding:2px 8px;color:var(--ui-kit-color-grey-10)}.kit-datepicker-popup.k-popup .k-calendar-nav-today:hover{color:var(--ui-kit-color-hover)}.kit-datepicker-popup.k-popup .k-calendar-nav-today:hover:before{opacity:0}.kit-datepicker-popup.k-popup .k-calendar-nav-prev,.kit-datepicker-popup.k-popup .k-calendar-nav-next{padding:0;width:32px;height:32px;color:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup .k-calendar-nav-prev:before,.kit-datepicker-popup.k-popup .k-calendar-nav-next:before{opacity:0}.kit-datepicker-popup.k-popup .k-calendar-nav-prev:hover,.kit-datepicker-popup.k-popup .k-calendar-nav-next:hover{color:var(--ui-kit-color-hover)}.kit-datepicker-popup.k-popup .k-calendar-view{padding:10px 0 0;min-height:auto;width:auto}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td{width:auto;height:auto;border-radius:6px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td:hover .k-link{border:none;background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td:focus .k-link{box-shadow:none}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-main);background:var(--ui-kit-color-grey-13)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-other-month .k-link{color:var(--ui-kit-color-grey-12)}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-td.k-focus .k-link{box-shadow:none}.kit-datepicker-popup.k-popup .k-calendar-view .k-link{padding:0;width:54px;height:24px;color:var(--ui-kit-color-grey-10);border-radius:6px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-tbody{display:flex;flex-direction:column;row-gap:16px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-tr{display:flex;gap:16px}.kit-datepicker-popup.k-popup .k-calendar-view .k-calendar-th{width:24px;height:22px;color:var(--ui-kit-color-main);font-size:14px;text-transform:capitalize;line-height:20px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-link{width:24px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-tbody{row-gap:6px}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-today .k-link{color:var(--ui-kit-color-grey-10);border:1px solid var(--ui-kit-color-main);background:var(--ui-kit-color-white)}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-selected .k-link{color:var(--ui-kit-color-white);border:none;background:var(--ui-kit-color-main);box-shadow:none}.kit-datepicker-popup.k-popup .k-calendar-monthview .k-calendar-td.k-empty{width:24px;height:24px}.kit-datepicker-popup.k-popup .k-calendar-yearview .k-calendar-td.k-empty,.kit-datepicker-popup.k-popup .k-calendar-decadeview .k-calendar-td.k-empty,.kit-datepicker-popup.k-popup .k-calendar-centuryview .k-calendar-td.k-empty{width:54px;height:24px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
@@ -4826,6 +4826,7 @@ class KitTabsComponent {
         this.tabSelected.emit({
             index: event.index,
             title: event.title,
+            preventDefault: () => event.preventDefault(),
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }