npm - @indigina/ui-kit - Versions diffs - 1.1.38 → 1.1.40 - Mend

@indigina/ui-kit 1.1.38 → 1.1.40

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (33) hide show

package/assets/icons/sort-ascending.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M14.1831 6.60466L12.5653 1.54573C12.5548 1.51188 12.5336 1.48232 12.505 1.46141C12.4764 1.4405 12.4418 1.42937 12.4064 1.42966H11.0242C10.951 1.42966 10.8885 1.47609 10.8653 1.54573L9.23493 6.60466C9.22957 6.62073 9.226 6.63859 9.226 6.65645C9.226 6.74752 9.301 6.82252 9.39207 6.82252H10.3992C10.4742 6.82252 10.5385 6.77252 10.5599 6.70109L10.8724 5.60109H12.4617L12.7706 6.69931C12.7903 6.77073 12.8564 6.82073 12.9314 6.82073H14.0242C14.0421 6.82073 14.0581 6.81895 14.0742 6.81359C14.1171 6.79931 14.151 6.77073 14.1724 6.73145C14.1921 6.69216 14.1956 6.64752 14.1831 6.60466ZM11.0349 4.67073L11.6206 2.58323H11.7331L12.3064 4.67073H11.0349ZM13.5974 13.4725H11.2831V13.4654L13.651 10.0922C13.6706 10.0636 13.6814 10.0314 13.6814 9.99574V9.34573C13.6814 9.25466 13.6064 9.17966 13.5153 9.17966H9.87243C9.78136 9.17966 9.70636 9.25466 9.70636 9.34573V10.1136C9.70636 10.2047 9.78136 10.2797 9.87243 10.2797H12.0617V10.2868L9.68493 13.66C9.66509 13.6883 9.65448 13.7219 9.65457 13.7564V14.4065C9.65457 14.4975 9.72957 14.5725 9.82064 14.5725H13.5956C13.6867 14.5725 13.7617 14.4975 13.7617 14.4065V13.6386C13.762 13.6169 13.7579 13.5953 13.7497 13.5752C13.7416 13.555 13.7295 13.5367 13.7142 13.5213C13.699 13.5058 13.6808 13.4936 13.6607 13.4852C13.6407 13.4768 13.6192 13.4725 13.5974 13.4725ZM4.73136 1.84216C4.718 1.82509 4.70092 1.81128 4.68143 1.80178C4.66194 1.79229 4.64054 1.78735 4.61886 1.78735C4.59718 1.78735 4.57578 1.79229 4.55629 1.80178C4.5368 1.81128 4.51972 1.82509 4.50636 1.84216L2.50636 4.37609C2.43136 4.47073 2.49922 4.60823 2.61886 4.60823H3.976V14.0725C3.976 14.1511 4.04029 14.2154 4.11886 14.2154H5.11886C5.19743 14.2154 5.26172 14.1511 5.26172 14.0725V4.60823H6.61886C6.7385 4.60823 6.80636 4.46895 6.73136 4.37609L4.73136 1.84216Z" />
+</svg>

package/assets/icons/sort-descending.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M14.1831 6.60466L12.5653 1.54573C12.5548 1.51188 12.5336 1.48232 12.505 1.46141C12.4764 1.4405 12.4418 1.42937 12.4064 1.42966H11.0242C10.951 1.42966 10.8885 1.47609 10.8653 1.54573L9.23493 6.60466C9.22957 6.62073 9.226 6.63859 9.226 6.65645C9.226 6.74752 9.301 6.82252 9.39207 6.82252H10.3992C10.4742 6.82252 10.5385 6.77252 10.5599 6.70109L10.8724 5.60109H12.4617L12.7706 6.69931C12.7903 6.77073 12.8564 6.82073 12.9314 6.82073H14.0242C14.0421 6.82073 14.0581 6.81895 14.0742 6.81359C14.1171 6.79931 14.151 6.77073 14.1724 6.73145C14.1921 6.69216 14.1956 6.64752 14.1831 6.60466ZM11.0349 4.67073L11.6206 2.58323H11.7331L12.3064 4.67073H11.0349ZM13.5974 13.4725H11.2831V13.4654L13.651 10.0922C13.6706 10.0636 13.6814 10.0314 13.6814 9.99574V9.34573C13.6814 9.25466 13.6064 9.17966 13.5153 9.17966H9.87243C9.78136 9.17966 9.70636 9.25466 9.70636 9.34573V10.1136C9.70636 10.2047 9.78136 10.2797 9.87243 10.2797H12.0617V10.2868L9.68493 13.66C9.66509 13.6883 9.65448 13.7219 9.65457 13.7564V14.4065C9.65457 14.4975 9.72957 14.5725 9.82064 14.5725H13.5956C13.6867 14.5725 13.7617 14.4975 13.7617 14.4065V13.6386C13.762 13.6169 13.7579 13.5953 13.7497 13.5752C13.7416 13.555 13.7295 13.5367 13.7142 13.5213C13.699 13.5058 13.6808 13.4936 13.6607 13.4852C13.6407 13.4768 13.6192 13.4725 13.5974 13.4725ZM6.61886 11.3939H5.26172V1.92966C5.26172 1.85109 5.19743 1.78681 5.11886 1.78681H4.11886C4.04029 1.78681 3.976 1.85109 3.976 1.92966V11.3939H2.61886C2.49922 11.3939 2.43136 11.5332 2.50636 11.6261L4.50636 14.16C4.51972 14.1771 4.5368 14.1909 4.55629 14.2004C4.57578 14.2099 4.59718 14.2148 4.61886 14.2148C4.64054 14.2148 4.66194 14.2099 4.68143 14.2004C4.70092 14.1909 4.718 14.1771 4.73136 14.16L6.73136 11.6261C6.80457 11.5332 6.7385 11.3939 6.61886 11.3939Z" />
+</svg>

package/esm2022/lib/components/kit-autocomplete/kit-autocomplete.component.mjs CHANGED Viewed

@@ -133,7 +133,7 @@ export class KitAutocompleteComponent {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => KitAutocompleteComponent),
                 multi: true,
-            }], viewQueries: [{ propertyName: "combobox", first: true, predicate: ["combobox"], descendants: true }], ngImport: i0, template: "<div class=\"kit-autocomplete {{ state }}\"\n     [class.autocomplete-empty]=\"!items || !items.length\"\n     [class.autocomplete-disabled]=\"disabled\"\n     [class.autocomplete-loading]=\"loaderVisible\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"combobox\"\n    ></kit-input-label>\n  }\n  <div class=\"autocomplete-wrap\">\n    <kendo-combobox #combobox\n                    textField=\"text\"\n                    valueField=\"value\"\n                    kendoDropDownFilter\n                    [data]=\"items\"\n                    [placeholder]=\"placeholder\"\n                    [filterable]=\"true\"\n                    [disabled]=\"disabled\"\n                    [clearButton]=\"false\"\n                    [value]=\"selectedValue\"\n                    [allowCustom]=\"true\"\n                    [valueNormalizer]=\"normalizedSelectedValue$\"\n                    [popupSettings]=\"dropdownPopupSettings\"\n                    (focus)=\"onFocus()\"\n                    (blur)=\"onBlur()\"\n                    (selectionChange)=\"onValueSelect($event)\"\n                    (filterChange)=\"onFilterChange($event)\">\n      <ng-template kendoComboBoxHeaderTemplate>\n        @if (loaderVisible) {\n          <kit-loader class=\"popup-loader\"\n          ></kit-loader>\n        }\n      </ng-template>\n      <ng-template kendoComboBoxItemTemplate\n                   let-item>\n        <span class=\"template\">{{ getOptionText(item) }}</span>\n      </ng-template>\n    </kendo-combobox>\n    <kit-svg-icon class=\"input-icon\"\n                  icon=\"search\"\n    ></kit-svg-icon>\n  </div>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}:root{--ui-kit-color-white: #ffffff;--ui-kit-color-black: #000000;--ui-kit-color-main: #56a2f7;--ui-kit-color-hover: #3678c3;--ui-kit-color-selected: #3678c366;--ui-kit-color-active: #3678c3;--ui-kit-color-focus: #56a2f733;--ui-kit-color-grey-0: #252b30;--ui-kit-color-grey-2: #a7b2c3;--ui-kit-color-grey-3: #c2d1d9;--ui-kit-color-grey-4: #e2e7ed;--ui-kit-color-grey-5: #fafafc;--ui-kit-color-grey-6: #ebebe4;--ui-kit-color-grey-7: #a9a8a8;--ui-kit-color-grey-8: #efefef;--ui-kit-color-grey-9: #969696;--ui-kit-color-grey-10: #2a2b32;--ui-kit-color-grey-11: #e3e4e5;--ui-kit-color-grey-12: #a9aec3;--ui-kit-color-grey-13: #f7f7f8;--ui-kit-color-grey-14: #565963;--ui-kit-color-green: #00b0ad;--ui-kit-color-green-1: #39c237;--ui-kit-color-green-2: #39c23733;--ui-kit-color-green-3: #1cb589;--ui-kit-color-red: #ef3e42;--ui-kit-color-red-20: #f8e0e0;--ui-kit-color-red-1: #f5222d;--ui-kit-color-red-2: #f5222d33;--ui-kit-color-cobalt: #006890;--ui-kit-color-cobalt-darkest: #002a3a;--ui-kit-color-teal: #23afd2;--ui-kit-color-orange: #faad14;--ui-kit-color-orange-1: #faad1433;--ui-kit-color-pink: #cd1159;--ui-kit-color-purple: #7673ce}.kit-autocomplete .label{display:block;margin-bottom:4px}.kit-autocomplete .autocomplete-wrap{position:relative;display:flex;align-items:center}.kit-autocomplete .k-input-button{display:none}.kit-autocomplete .k-combobox{position:static;padding:0 32px 0 8px;height:34px;border:1px solid #efefef;border-radius:4px;background:#fff}.kit-autocomplete .k-combobox.k-focus{box-shadow:none}.kit-autocomplete .k-input-inner{padding:0;color:#002a3a;font-size:13px;line-height:1}.kit-autocomplete .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-autocomplete .popup-loader{height:100%}.kit-autocomplete .kit-loader,.kit-autocomplete .kit-loader>div{height:100%}.kit-autocomplete .kit-loader .circle{box-sizing:content-box}.kit-autocomplete .input-icon{position:absolute;right:8px;width:16px;height:16px;fill:#fff;stroke:#000}.kit-autocomplete .kit-autocomplete-popup{margin-top:4px;border:1px solid #c1c7d0;border-radius:4px;box-shadow:0 0 5px #003e5680;background-color:#f3f4f6;padding:4px}.kit-autocomplete .kit-autocomplete-popup .k-list{background-color:#f3f4f6}.kit-autocomplete .kit-autocomplete-popup .k-list-item{padding:8px;min-height:auto;background-color:#fff;font-size:13px;font-weight:500;line-height:1.26;box-shadow:none;border-radius:2px;color:#002a3a}.kit-autocomplete .kit-autocomplete-popup .k-list-item:not(:last-of-type){margin-bottom:4px}.kit-autocomplete .kit-autocomplete-popup .k-list-item:hover{background-color:#f3f5fa;color:#56a2f7}.kit-autocomplete:focus-within .k-combobox{border-color:#00b0ad}.kit-autocomplete.autocomplete-empty .kit-autocomplete-popup{display:none}.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup{display:block;height:200px}.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup .k-no-data,.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup .k-list{display:none}.kit-autocomplete.danger .k-combobox{border-color:#ef3e42;background:#f8e0e0}.kit-autocomplete.danger .input-icon{fill:#f8e0e0}\n"], dependencies: [{ kind: "directive", type: i1.HeaderTemplateDirective, selector: "[kendoDropDownListHeaderTemplate],[kendoComboBoxHeaderTemplate],[kendoDropDownTreeHeaderTemplate],[kendoMultiColumnComboBoxHeaderTemplate],[kendoAutoCompleteHeaderTemplate],[kendoMultiSelectHeaderTemplate],[kendoMultiSelectTreeHeaderTemplate]" }, { kind: "directive", type: i1.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "directive", type: i1.FilterDirective, selector: "[kendoDropDownFilter]", inputs: ["data", "kendoDropDownFilter", "filterable"] }, { kind: "component", type: i1.ComboBoxComponent, selector: "kendo-combobox", inputs: ["icon", "svgIcon", "showStickyHeader", "focusableId", "allowCustom", "data", "value", "textField", "valueField", "valuePrimitive", "valueNormalizer", "placeholder", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "loading", "suggest", "clearButton", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoComboBox"] }, { kind: "component", type: i2.KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: i3.KitLoaderComponent, selector: "kit-loader" }, { kind: "component", type: i4.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: i5.KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+            }], viewQueries: [{ propertyName: "combobox", first: true, predicate: ["combobox"], descendants: true }], ngImport: i0, template: "<div class=\"kit-autocomplete {{ state }}\"\n     [class.autocomplete-empty]=\"!items || !items.length\"\n     [class.autocomplete-disabled]=\"disabled\"\n     [class.autocomplete-loading]=\"loaderVisible\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"combobox\"\n    ></kit-input-label>\n  }\n  <div class=\"autocomplete-wrap\">\n    <kendo-combobox #combobox\n                    textField=\"text\"\n                    valueField=\"value\"\n                    kendoDropDownFilter\n                    [data]=\"items\"\n                    [placeholder]=\"placeholder\"\n                    [filterable]=\"true\"\n                    [disabled]=\"disabled\"\n                    [clearButton]=\"false\"\n                    [value]=\"selectedValue\"\n                    [allowCustom]=\"true\"\n                    [valueNormalizer]=\"normalizedSelectedValue$\"\n                    [popupSettings]=\"dropdownPopupSettings\"\n                    (focus)=\"onFocus()\"\n                    (blur)=\"onBlur()\"\n                    (selectionChange)=\"onValueSelect($event)\"\n                    (filterChange)=\"onFilterChange($event)\">\n      <ng-template kendoComboBoxHeaderTemplate>\n        @if (loaderVisible) {\n          <kit-loader class=\"popup-loader\"\n          ></kit-loader>\n        }\n      </ng-template>\n      <ng-template kendoComboBoxItemTemplate\n                   let-item>\n        <span class=\"template\">{{ getOptionText(item) }}</span>\n      </ng-template>\n    </kendo-combobox>\n    <kit-svg-icon class=\"input-icon\"\n                  icon=\"search\"\n    ></kit-svg-icon>\n  </div>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}:root{--ui-kit-color-white: #ffffff;--ui-kit-color-black: #000000;--ui-kit-color-main: #56a2f7;--ui-kit-color-hover: #3678c3;--ui-kit-color-selected: #3678c366;--ui-kit-color-active: #3678c3;--ui-kit-color-focus: #56a2f733;--ui-kit-color-grey-0: #252b30;--ui-kit-color-grey-2: #a7b2c3;--ui-kit-color-grey-3: #c2d1d9;--ui-kit-color-grey-4: #e2e7ed;--ui-kit-color-grey-5: #fafafc;--ui-kit-color-grey-6: #ebebe4;--ui-kit-color-grey-7: #a9a8a8;--ui-kit-color-grey-8: #efefef;--ui-kit-color-grey-9: #969696;--ui-kit-color-grey-10: #2a2b32;--ui-kit-color-grey-11: #e3e4e5;--ui-kit-color-grey-12: #a9aec3;--ui-kit-color-grey-13: #f7f7f8;--ui-kit-color-grey-14: #565963;--ui-kit-color-green: #00b0ad;--ui-kit-color-green-1: #39c237;--ui-kit-color-green-2: #39c23733;--ui-kit-color-green-3: #1cb589;--ui-kit-color-red: #ef3e42;--ui-kit-color-red-20: #f8e0e0;--ui-kit-color-red-1: #f5222d;--ui-kit-color-red-2: #f5222d33;--ui-kit-color-cobalt: #006890;--ui-kit-color-cobalt-darkest: #002a3a;--ui-kit-color-teal: #23afd2;--ui-kit-color-orange: #faad14;--ui-kit-color-orange-1: #faad1433;--ui-kit-color-pink: #cd1159;--ui-kit-color-purple: #7673ce}.kit-autocomplete .label{display:block;margin-bottom:4px}.kit-autocomplete .autocomplete-wrap{position:relative;display:flex;align-items:center}.kit-autocomplete .k-input-button{display:none}.kit-autocomplete .k-combobox{position:static;padding:0 32px 0 8px;height:34px;border:1px solid #efefef;border-radius:4px;background:#fff}.kit-autocomplete .k-combobox.k-focus{box-shadow:none}.kit-autocomplete .k-input-inner{padding:0;color:#002a3a;font-size:13px;line-height:1}.kit-autocomplete .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-autocomplete .popup-loader{height:100%}.kit-autocomplete .kit-loader,.kit-autocomplete .kit-loader>div{height:100%}.kit-autocomplete .kit-loader .circle{box-sizing:content-box}.kit-autocomplete .input-icon{position:absolute;right:8px;width:16px;height:16px;fill:#fff;stroke:#000}.kit-autocomplete .kit-autocomplete-popup{margin-top:4px;border:1px solid #c1c7d0;border-radius:4px;box-shadow:0 0 5px #003e5680;background-color:#f3f4f6;padding:4px}.kit-autocomplete .kit-autocomplete-popup .k-list{background-color:#f3f4f6}.kit-autocomplete .kit-autocomplete-popup .k-list-item{padding:8px;min-height:auto;background-color:#fff;font-size:13px;font-weight:500;line-height:1.26;box-shadow:none;border-radius:2px;color:#002a3a}.kit-autocomplete .kit-autocomplete-popup .k-list-item:not(:last-of-type){margin-bottom:4px}.kit-autocomplete .kit-autocomplete-popup .k-list-item:hover{background-color:#f3f5fa;color:#56a2f7}.kit-autocomplete:focus-within .k-combobox{border-color:#00b0ad}.kit-autocomplete.autocomplete-empty .kit-autocomplete-popup{display:none}.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup{display:block;height:200px}.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup .k-no-data,.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup .k-list{display:none}.kit-autocomplete.danger .k-combobox{border-color:#ef3e42;background:#f8e0e0}.kit-autocomplete.danger .input-icon{fill:#f8e0e0}\n"], dependencies: [{ kind: "directive", type: i1.HeaderTemplateDirective, selector: "[kendoDropDownListHeaderTemplate],[kendoComboBoxHeaderTemplate],[kendoDropDownTreeHeaderTemplate],[kendoMultiColumnComboBoxHeaderTemplate],[kendoAutoCompleteHeaderTemplate],[kendoMultiSelectHeaderTemplate],[kendoMultiSelectTreeHeaderTemplate]" }, { kind: "directive", type: i1.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "directive", type: i1.FilterDirective, selector: "[kendoDropDownFilter]", inputs: ["data", "kendoDropDownFilter", "filterable"] }, { kind: "component", type: i1.ComboBoxComponent, selector: "kendo-combobox", inputs: ["icon", "svgIcon", "showStickyHeader", "focusableId", "allowCustom", "data", "value", "textField", "valueField", "valuePrimitive", "valueNormalizer", "placeholder", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "loading", "suggest", "clearButton", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoComboBox"] }, { kind: "component", type: i2.KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: i3.KitLoaderComponent, selector: "kit-loader" }, { kind: "component", type: i4.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: i5.KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitAutocompleteComponent, decorators: [{
             type: Component,
@@ -141,7 +141,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImpor
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => KitAutocompleteComponent),
                             multi: true,
-                        }], template: "<div class=\"kit-autocomplete {{ state }}\"\n     [class.autocomplete-empty]=\"!items || !items.length\"\n     [class.autocomplete-disabled]=\"disabled\"\n     [class.autocomplete-loading]=\"loaderVisible\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"combobox\"\n    ></kit-input-label>\n  }\n  <div class=\"autocomplete-wrap\">\n    <kendo-combobox #combobox\n                    textField=\"text\"\n                    valueField=\"value\"\n                    kendoDropDownFilter\n                    [data]=\"items\"\n                    [placeholder]=\"placeholder\"\n                    [filterable]=\"true\"\n                    [disabled]=\"disabled\"\n                    [clearButton]=\"false\"\n                    [value]=\"selectedValue\"\n                    [allowCustom]=\"true\"\n                    [valueNormalizer]=\"normalizedSelectedValue$\"\n                    [popupSettings]=\"dropdownPopupSettings\"\n                    (focus)=\"onFocus()\"\n                    (blur)=\"onBlur()\"\n                    (selectionChange)=\"onValueSelect($event)\"\n                    (filterChange)=\"onFilterChange($event)\">\n      <ng-template kendoComboBoxHeaderTemplate>\n        @if (loaderVisible) {\n          <kit-loader class=\"popup-loader\"\n          ></kit-loader>\n        }\n      </ng-template>\n      <ng-template kendoComboBoxItemTemplate\n                   let-item>\n        <span class=\"template\">{{ getOptionText(item) }}</span>\n      </ng-template>\n    </kendo-combobox>\n    <kit-svg-icon class=\"input-icon\"\n                  icon=\"search\"\n    ></kit-svg-icon>\n  </div>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}:root{--ui-kit-color-white: #ffffff;--ui-kit-color-black: #000000;--ui-kit-color-main: #56a2f7;--ui-kit-color-hover: #3678c3;--ui-kit-color-selected: #3678c366;--ui-kit-color-active: #3678c3;--ui-kit-color-focus: #56a2f733;--ui-kit-color-grey-0: #252b30;--ui-kit-color-grey-2: #a7b2c3;--ui-kit-color-grey-3: #c2d1d9;--ui-kit-color-grey-4: #e2e7ed;--ui-kit-color-grey-5: #fafafc;--ui-kit-color-grey-6: #ebebe4;--ui-kit-color-grey-7: #a9a8a8;--ui-kit-color-grey-8: #efefef;--ui-kit-color-grey-9: #969696;--ui-kit-color-grey-10: #2a2b32;--ui-kit-color-grey-11: #e3e4e5;--ui-kit-color-grey-12: #a9aec3;--ui-kit-color-grey-13: #f7f7f8;--ui-kit-color-grey-14: #565963;--ui-kit-color-green: #00b0ad;--ui-kit-color-green-1: #39c237;--ui-kit-color-green-2: #39c23733;--ui-kit-color-green-3: #1cb589;--ui-kit-color-red: #ef3e42;--ui-kit-color-red-20: #f8e0e0;--ui-kit-color-red-1: #f5222d;--ui-kit-color-red-2: #f5222d33;--ui-kit-color-cobalt: #006890;--ui-kit-color-cobalt-darkest: #002a3a;--ui-kit-color-teal: #23afd2;--ui-kit-color-orange: #faad14;--ui-kit-color-orange-1: #faad1433;--ui-kit-color-pink: #cd1159;--ui-kit-color-purple: #7673ce}.kit-autocomplete .label{display:block;margin-bottom:4px}.kit-autocomplete .autocomplete-wrap{position:relative;display:flex;align-items:center}.kit-autocomplete .k-input-button{display:none}.kit-autocomplete .k-combobox{position:static;padding:0 32px 0 8px;height:34px;border:1px solid #efefef;border-radius:4px;background:#fff}.kit-autocomplete .k-combobox.k-focus{box-shadow:none}.kit-autocomplete .k-input-inner{padding:0;color:#002a3a;font-size:13px;line-height:1}.kit-autocomplete .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-autocomplete .popup-loader{height:100%}.kit-autocomplete .kit-loader,.kit-autocomplete .kit-loader>div{height:100%}.kit-autocomplete .kit-loader .circle{box-sizing:content-box}.kit-autocomplete .input-icon{position:absolute;right:8px;width:16px;height:16px;fill:#fff;stroke:#000}.kit-autocomplete .kit-autocomplete-popup{margin-top:4px;border:1px solid #c1c7d0;border-radius:4px;box-shadow:0 0 5px #003e5680;background-color:#f3f4f6;padding:4px}.kit-autocomplete .kit-autocomplete-popup .k-list{background-color:#f3f4f6}.kit-autocomplete .kit-autocomplete-popup .k-list-item{padding:8px;min-height:auto;background-color:#fff;font-size:13px;font-weight:500;line-height:1.26;box-shadow:none;border-radius:2px;color:#002a3a}.kit-autocomplete .kit-autocomplete-popup .k-list-item:not(:last-of-type){margin-bottom:4px}.kit-autocomplete .kit-autocomplete-popup .k-list-item:hover{background-color:#f3f5fa;color:#56a2f7}.kit-autocomplete:focus-within .k-combobox{border-color:#00b0ad}.kit-autocomplete.autocomplete-empty .kit-autocomplete-popup{display:none}.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup{display:block;height:200px}.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup .k-no-data,.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup .k-list{display:none}.kit-autocomplete.danger .k-combobox{border-color:#ef3e42;background:#f8e0e0}.kit-autocomplete.danger .input-icon{fill:#f8e0e0}\n"] }]
+                        }], template: "<div class=\"kit-autocomplete {{ state }}\"\n     [class.autocomplete-empty]=\"!items || !items.length\"\n     [class.autocomplete-disabled]=\"disabled\"\n     [class.autocomplete-loading]=\"loaderVisible\">\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"combobox\"\n    ></kit-input-label>\n  }\n  <div class=\"autocomplete-wrap\">\n    <kendo-combobox #combobox\n                    textField=\"text\"\n                    valueField=\"value\"\n                    kendoDropDownFilter\n                    [data]=\"items\"\n                    [placeholder]=\"placeholder\"\n                    [filterable]=\"true\"\n                    [disabled]=\"disabled\"\n                    [clearButton]=\"false\"\n                    [value]=\"selectedValue\"\n                    [allowCustom]=\"true\"\n                    [valueNormalizer]=\"normalizedSelectedValue$\"\n                    [popupSettings]=\"dropdownPopupSettings\"\n                    (focus)=\"onFocus()\"\n                    (blur)=\"onBlur()\"\n                    (selectionChange)=\"onValueSelect($event)\"\n                    (filterChange)=\"onFilterChange($event)\">\n      <ng-template kendoComboBoxHeaderTemplate>\n        @if (loaderVisible) {\n          <kit-loader class=\"popup-loader\"\n          ></kit-loader>\n        }\n      </ng-template>\n      <ng-template kendoComboBoxItemTemplate\n                   let-item>\n        <span class=\"template\">{{ getOptionText(item) }}</span>\n      </ng-template>\n    </kendo-combobox>\n    <kit-svg-icon class=\"input-icon\"\n                  icon=\"search\"\n    ></kit-svg-icon>\n  </div>\n  @if (messageText) {\n    <kit-input-message [icon]=\"messageIcon\"\n                       [message]=\"messageText\"\n    ></kit-input-message>\n  }\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}:root{--ui-kit-color-white: #ffffff;--ui-kit-color-black: #000000;--ui-kit-color-main: #56a2f7;--ui-kit-color-hover: #3678c3;--ui-kit-color-selected: #3678c366;--ui-kit-color-active: #3678c3;--ui-kit-color-focus: #56a2f733;--ui-kit-color-grey-0: #252b30;--ui-kit-color-grey-2: #a7b2c3;--ui-kit-color-grey-3: #c2d1d9;--ui-kit-color-grey-4: #e2e7ed;--ui-kit-color-grey-5: #fafafc;--ui-kit-color-grey-6: #ebebe4;--ui-kit-color-grey-7: #a9a8a8;--ui-kit-color-grey-8: #efefef;--ui-kit-color-grey-9: #969696;--ui-kit-color-grey-10: #2a2b32;--ui-kit-color-grey-11: #e3e4e5;--ui-kit-color-grey-12: #a9aec3;--ui-kit-color-grey-13: #f7f7f8;--ui-kit-color-grey-14: #565963;--ui-kit-color-green: #00b0ad;--ui-kit-color-green-1: #39c237;--ui-kit-color-green-2: #39c23733;--ui-kit-color-green-3: #1cb589;--ui-kit-color-red: #ef3e42;--ui-kit-color-red-20: #f8e0e0;--ui-kit-color-red-1: #f5222d;--ui-kit-color-red-2: #f5222d33;--ui-kit-color-cobalt: #006890;--ui-kit-color-cobalt-darkest: #002a3a;--ui-kit-color-teal: #23afd2;--ui-kit-color-orange: #faad14;--ui-kit-color-orange-1: #faad1433;--ui-kit-color-pink: #cd1159;--ui-kit-color-purple: #7673ce}.kit-autocomplete .label{display:block;margin-bottom:4px}.kit-autocomplete .autocomplete-wrap{position:relative;display:flex;align-items:center}.kit-autocomplete .k-input-button{display:none}.kit-autocomplete .k-combobox{position:static;padding:0 32px 0 8px;height:34px;border:1px solid #efefef;border-radius:4px;background:#fff}.kit-autocomplete .k-combobox.k-focus{box-shadow:none}.kit-autocomplete .k-input-inner{padding:0;color:#002a3a;font-size:13px;line-height:1}.kit-autocomplete .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-autocomplete .popup-loader{height:100%}.kit-autocomplete .kit-loader,.kit-autocomplete .kit-loader>div{height:100%}.kit-autocomplete .kit-loader .circle{box-sizing:content-box}.kit-autocomplete .input-icon{position:absolute;right:8px;width:16px;height:16px;fill:#fff;stroke:#000}.kit-autocomplete .kit-autocomplete-popup{margin-top:4px;border:1px solid #c1c7d0;border-radius:4px;box-shadow:0 0 5px #003e5680;background-color:#f3f4f6;padding:4px}.kit-autocomplete .kit-autocomplete-popup .k-list{background-color:#f3f4f6}.kit-autocomplete .kit-autocomplete-popup .k-list-item{padding:8px;min-height:auto;background-color:#fff;font-size:13px;font-weight:500;line-height:1.26;box-shadow:none;border-radius:2px;color:#002a3a}.kit-autocomplete .kit-autocomplete-popup .k-list-item:not(:last-of-type){margin-bottom:4px}.kit-autocomplete .kit-autocomplete-popup .k-list-item:hover{background-color:#f3f5fa;color:#56a2f7}.kit-autocomplete:focus-within .k-combobox{border-color:#00b0ad}.kit-autocomplete.autocomplete-empty .kit-autocomplete-popup{display:none}.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup{display:block;height:200px}.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup .k-no-data,.kit-autocomplete.autocomplete-loading .kit-autocomplete-popup .k-list{display:none}.kit-autocomplete.danger .k-combobox{border-color:#ef3e42;background:#f8e0e0}.kit-autocomplete.danger .input-icon{fill:#f8e0e0}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { label: [{
                 type: Input
             }], placeholder: [{

package/esm2022/lib/components/kit-cta-panel-abstract-confirmation/kit-cta-panel-abstract-confirmation.component.mjs CHANGED Viewed

@@ -10,11 +10,11 @@ export class KitCtaPanelAbstractConfirmationComponent {
         this.confirmClicked = new EventEmitter();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitCtaPanelAbstractConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.7", type: KitCtaPanelAbstractConfirmationComponent, selector: "kit-cta-panel-abstract-confirmation", inputs: { confirmButtonDisabled: "confirmButtonDisabled", quitText: "quitText", confirmText: "confirmText" }, outputs: { quitClicked: "quitClicked", confirmClicked: "confirmClicked" }, ngImport: i0, template: "<div class=\"kit-cta-panel-confirmation\">\n  <ng-content select=\".confirmation-head\"\n  ></ng-content>\n  <ng-content select=\".confirmation-main\"\n  ></ng-content>\n  <kit-cta-panel-action [disabled]=\"confirmButtonDisabled\"\n                        [quitText]=\"quitText\"\n                        [confirmText]=\"confirmText\"\n                        (quitClicked)=\"quitClicked.emit()\"\n                        (confirmClicked)=\"confirmClicked.emit()\"\n  ></kit-cta-panel-action>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}.kit-cta-panel-confirmation{padding:15px 20px;border:2px solid #00b0ad;background:#f8f9fe;line-height:1.26}.kit-cta-panel-confirmation .confirmation-head{display:flex;margin-bottom:24px}.kit-cta-panel-confirmation .head-icon{width:24px;height:24px;margin-right:20px;flex-shrink:0;stroke:#00b0ad;fill:none}.kit-cta-panel-confirmation .head-icon .reset-icon{stroke:none;fill:#00b0ad}.kit-cta-panel-confirmation .head-title{color:#002a3a;font-weight:700}.kit-cta-panel-confirmation .head-description{margin-top:24px;color:#000}.kit-cta-panel-confirmation .confirmation-main{margin-bottom:24px}.kit-cta-panel-confirmation .confirmation-main-form{display:flex;flex-direction:column;gap:8px}\n"], dependencies: [{ kind: "component", type: i1.KitCtaPanelActionComponent, selector: "kit-cta-panel-action", inputs: ["disabled", "confirmText", "quitText"], outputs: ["quitClicked", "confirmClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.7", type: KitCtaPanelAbstractConfirmationComponent, selector: "kit-cta-panel-abstract-confirmation", inputs: { confirmButtonDisabled: "confirmButtonDisabled", quitText: "quitText", confirmText: "confirmText" }, outputs: { quitClicked: "quitClicked", confirmClicked: "confirmClicked" }, ngImport: i0, template: "<div class=\"kit-cta-panel-confirmation\">\n  <ng-content select=\".confirmation-head\"\n  ></ng-content>\n  <ng-content select=\".confirmation-main\"\n  ></ng-content>\n  <kit-cta-panel-action [disabled]=\"confirmButtonDisabled\"\n                        [quitText]=\"quitText\"\n                        [confirmText]=\"confirmText\"\n                        (quitClicked)=\"quitClicked.emit()\"\n                        (confirmClicked)=\"confirmClicked.emit()\"\n  ></kit-cta-panel-action>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}.kit-cta-panel-confirmation{padding:15px 20px;border:2px solid #00b0ad;background:#f8f9fe;line-height:1.26}.kit-cta-panel-confirmation .confirmation-head{display:flex;margin-bottom:24px}.kit-cta-panel-confirmation .head-icon{width:24px;height:24px;margin-right:20px;flex-shrink:0;stroke:#00b0ad;fill:none}.kit-cta-panel-confirmation .head-icon .reset-icon{stroke:none;fill:#00b0ad}.kit-cta-panel-confirmation .head-title{color:#002a3a;font-weight:700}.kit-cta-panel-confirmation .head-description{margin-top:24px;color:#000}.kit-cta-panel-confirmation .confirmation-main{margin-bottom:24px}.kit-cta-panel-confirmation .confirmation-main-form{display:flex;flex-direction:column;gap:8px}\n"], dependencies: [{ kind: "component", type: i1.KitCtaPanelActionComponent, selector: "kit-cta-panel-action", inputs: ["disabled", "confirmText", "quitText"], outputs: ["quitClicked", "confirmClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitCtaPanelAbstractConfirmationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kit-cta-panel-abstract-confirmation', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-cta-panel-confirmation\">\n  <ng-content select=\".confirmation-head\"\n  ></ng-content>\n  <ng-content select=\".confirmation-main\"\n  ></ng-content>\n  <kit-cta-panel-action [disabled]=\"confirmButtonDisabled\"\n                        [quitText]=\"quitText\"\n                        [confirmText]=\"confirmText\"\n                        (quitClicked)=\"quitClicked.emit()\"\n                        (confirmClicked)=\"confirmClicked.emit()\"\n  ></kit-cta-panel-action>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}.kit-cta-panel-confirmation{padding:15px 20px;border:2px solid #00b0ad;background:#f8f9fe;line-height:1.26}.kit-cta-panel-confirmation .confirmation-head{display:flex;margin-bottom:24px}.kit-cta-panel-confirmation .head-icon{width:24px;height:24px;margin-right:20px;flex-shrink:0;stroke:#00b0ad;fill:none}.kit-cta-panel-confirmation .head-icon .reset-icon{stroke:none;fill:#00b0ad}.kit-cta-panel-confirmation .head-title{color:#002a3a;font-weight:700}.kit-cta-panel-confirmation .head-description{margin-top:24px;color:#000}.kit-cta-panel-confirmation .confirmation-main{margin-bottom:24px}.kit-cta-panel-confirmation .confirmation-main-form{display:flex;flex-direction:column;gap:8px}\n"] }]
+            args: [{ selector: 'kit-cta-panel-abstract-confirmation', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-cta-panel-confirmation\">\n  <ng-content select=\".confirmation-head\"\n  ></ng-content>\n  <ng-content select=\".confirmation-main\"\n  ></ng-content>\n  <kit-cta-panel-action [disabled]=\"confirmButtonDisabled\"\n                        [quitText]=\"quitText\"\n                        [confirmText]=\"confirmText\"\n                        (quitClicked)=\"quitClicked.emit()\"\n                        (confirmClicked)=\"confirmClicked.emit()\"\n  ></kit-cta-panel-action>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}.kit-cta-panel-confirmation{padding:15px 20px;border:2px solid #00b0ad;background:#f8f9fe;line-height:1.26}.kit-cta-panel-confirmation .confirmation-head{display:flex;margin-bottom:24px}.kit-cta-panel-confirmation .head-icon{width:24px;height:24px;margin-right:20px;flex-shrink:0;stroke:#00b0ad;fill:none}.kit-cta-panel-confirmation .head-icon .reset-icon{stroke:none;fill:#00b0ad}.kit-cta-panel-confirmation .head-title{color:#002a3a;font-weight:700}.kit-cta-panel-confirmation .head-description{margin-top:24px;color:#000}.kit-cta-panel-confirmation .confirmation-main{margin-bottom:24px}.kit-cta-panel-confirmation .confirmation-main-form{display:flex;flex-direction:column;gap:8px}\n"] }]
         }], propDecorators: { confirmButtonDisabled: [{
                 type: Input
             }], quitText: [{

package/esm2022/lib/components/kit-cta-panel-confirmation/kit-cta-panel-confirmation.component.mjs CHANGED Viewed

@@ -25,11 +25,11 @@ export class KitCtaPanelConfirmationComponent {
         this.confirmClicked.emit(this.form.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitCtaPanelConfirmationComponent, deps: [{ token: i1.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.7", type: KitCtaPanelConfirmationComponent, selector: "kit-cta-panel-confirmation", inputs: { data: "data", confirmButtonDisabled: "confirmButtonDisabled", dropdownListHeight: "dropdownListHeight", quitText: "quitText", confirmText: "confirmText" }, outputs: { quitClicked: "quitClicked", confirmClicked: "confirmClicked" }, ngImport: i0, template: "<div class=\"kit-cta-panel-confirmation\">\n  <div class=\"confirmation-head\">\n    <kit-svg-icon *ngIf=\"data?.icon\" class=\"head-icon\"\n                  [icon]=\"data?.icon\"\n    ></kit-svg-icon>\n    <div class=\"head-text\">\n      <div class=\"head-title\">{{ data?.title }}</div>\n      <div *ngIf=\"data?.description\" class=\"head-description\">\n        {{ data?.description }}\n      </div>\n    </div>\n  </div>\n  <div class=\"confirmation-main\">\n    <form [formGroup]=\"form\" class=\"confirmation-main-form\">\n      <kit-dropdown *ngIf=\"data?.dropdownItems\"\n                    formControlName=\"reason\"\n                    [defaultItem]=\"data?.defaultDropdownItem\"\n                    [label]=\"data?.dropdownLabel\"\n                    [items]=\"data?.dropdownItems\"\n                    [listHeight]=\"dropdownListHeight\"\n      ></kit-dropdown>\n\n      <kit-checkbox *ngIf=\"data?.checkboxLabel\"\n                    formControlName=\"checkbox\"\n                    [label]=\"data?.checkboxLabel\"\n      ></kit-checkbox>\n    </form>\n  </div>\n  <kit-cta-panel-action [disabled]=\"data?.dropdownItems && form.invalid\"\n                        [quitText]=\"quitText\"\n                        [confirmText]=\"confirmText\"\n                        (quitClicked)=\"quitClicked.emit()\"\n                        (confirmClicked)=\"onConfirmButtonClick()\"\n  ></kit-cta-panel-action>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}.kit-cta-panel-confirmation{padding:15px 20px;border:2px solid #00b0ad;background:#f8f9fe;line-height:1.26}.kit-cta-panel-confirmation .confirmation-head{display:flex;margin-bottom:24px}.kit-cta-panel-confirmation .head-icon{width:24px;height:24px;margin-right:20px;flex-shrink:0;stroke:#00b0ad;fill:none}.kit-cta-panel-confirmation .head-icon .reset-icon{stroke:none;fill:#00b0ad}.kit-cta-panel-confirmation .head-title{color:#002a3a;font-weight:700}.kit-cta-panel-confirmation .head-description{margin-top:24px;color:#000}.kit-cta-panel-confirmation .confirmation-main{margin-bottom:24px}.kit-cta-panel-confirmation .confirmation-main-form{display:flex;flex-direction:column;gap:8px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: i4.KitDropdownComponent, selector: "kit-dropdown", inputs: ["items", "selectedItem", "label", "disabled", "messageIcon", "messageText", "state", "defaultItem", "listHeight", "hideDefaultItem", "toggleIcon"], outputs: ["selected"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5.KitCtaPanelActionComponent, selector: "kit-cta-panel-action", inputs: ["disabled", "confirmText", "quitText"], outputs: ["quitClicked", "confirmClicked"] }, { kind: "component", type: i6.KitCheckboxComponent, selector: "kit-checkbox", inputs: ["label", "disabled", "defaultChecked", "readonly", "state", "messageIcon", "messageText"], outputs: ["changed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.7", type: KitCtaPanelConfirmationComponent, selector: "kit-cta-panel-confirmation", inputs: { data: "data", confirmButtonDisabled: "confirmButtonDisabled", dropdownListHeight: "dropdownListHeight", quitText: "quitText", confirmText: "confirmText" }, outputs: { quitClicked: "quitClicked", confirmClicked: "confirmClicked" }, ngImport: i0, template: "<div class=\"kit-cta-panel-confirmation\">\n  <div class=\"confirmation-head\">\n    <kit-svg-icon *ngIf=\"data?.icon\" class=\"head-icon\"\n                  [icon]=\"data?.icon\"\n    ></kit-svg-icon>\n    <div class=\"head-text\">\n      <div class=\"head-title\">{{ data?.title }}</div>\n      <div *ngIf=\"data?.description\" class=\"head-description\">\n        {{ data?.description }}\n      </div>\n    </div>\n  </div>\n  <div class=\"confirmation-main\">\n    <form [formGroup]=\"form\" class=\"confirmation-main-form\">\n      <kit-dropdown *ngIf=\"data?.dropdownItems\"\n                    formControlName=\"reason\"\n                    [defaultItem]=\"data?.defaultDropdownItem\"\n                    [label]=\"data?.dropdownLabel\"\n                    [items]=\"data?.dropdownItems\"\n                    [listHeight]=\"dropdownListHeight\"\n      ></kit-dropdown>\n\n      <kit-checkbox *ngIf=\"data?.checkboxLabel\"\n                    formControlName=\"checkbox\"\n                    [label]=\"data?.checkboxLabel\"\n      ></kit-checkbox>\n    </form>\n  </div>\n  <kit-cta-panel-action [disabled]=\"data?.dropdownItems && form.invalid\"\n                        [quitText]=\"quitText\"\n                        [confirmText]=\"confirmText\"\n                        (quitClicked)=\"quitClicked.emit()\"\n                        (confirmClicked)=\"onConfirmButtonClick()\"\n  ></kit-cta-panel-action>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}.kit-cta-panel-confirmation{padding:15px 20px;border:2px solid #00b0ad;background:#f8f9fe;line-height:1.26}.kit-cta-panel-confirmation .confirmation-head{display:flex;margin-bottom:24px}.kit-cta-panel-confirmation .head-icon{width:24px;height:24px;margin-right:20px;flex-shrink:0;stroke:#00b0ad;fill:none}.kit-cta-panel-confirmation .head-icon .reset-icon{stroke:none;fill:#00b0ad}.kit-cta-panel-confirmation .head-title{color:#002a3a;font-weight:700}.kit-cta-panel-confirmation .head-description{margin-top:24px;color:#000}.kit-cta-panel-confirmation .confirmation-main{margin-bottom:24px}.kit-cta-panel-confirmation .confirmation-main-form{display:flex;flex-direction:column;gap:8px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: i4.KitDropdownComponent, selector: "kit-dropdown", inputs: ["items", "selectedItem", "label", "disabled", "messageIcon", "messageText", "state", "defaultItem", "listHeight", "hideDefaultItem", "toggleIcon"], outputs: ["selected"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5.KitCtaPanelActionComponent, selector: "kit-cta-panel-action", inputs: ["disabled", "confirmText", "quitText"], outputs: ["quitClicked", "confirmClicked"] }, { kind: "component", type: i6.KitCheckboxComponent, selector: "kit-checkbox", inputs: ["label", "disabled", "defaultChecked", "readonly", "state", "messageIcon", "messageText"], outputs: ["changed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitCtaPanelConfirmationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kit-cta-panel-confirmation', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-cta-panel-confirmation\">\n  <div class=\"confirmation-head\">\n    <kit-svg-icon *ngIf=\"data?.icon\" class=\"head-icon\"\n                  [icon]=\"data?.icon\"\n    ></kit-svg-icon>\n    <div class=\"head-text\">\n      <div class=\"head-title\">{{ data?.title }}</div>\n      <div *ngIf=\"data?.description\" class=\"head-description\">\n        {{ data?.description }}\n      </div>\n    </div>\n  </div>\n  <div class=\"confirmation-main\">\n    <form [formGroup]=\"form\" class=\"confirmation-main-form\">\n      <kit-dropdown *ngIf=\"data?.dropdownItems\"\n                    formControlName=\"reason\"\n                    [defaultItem]=\"data?.defaultDropdownItem\"\n                    [label]=\"data?.dropdownLabel\"\n                    [items]=\"data?.dropdownItems\"\n                    [listHeight]=\"dropdownListHeight\"\n      ></kit-dropdown>\n\n      <kit-checkbox *ngIf=\"data?.checkboxLabel\"\n                    formControlName=\"checkbox\"\n                    [label]=\"data?.checkboxLabel\"\n      ></kit-checkbox>\n    </form>\n  </div>\n  <kit-cta-panel-action [disabled]=\"data?.dropdownItems && form.invalid\"\n                        [quitText]=\"quitText\"\n                        [confirmText]=\"confirmText\"\n                        (quitClicked)=\"quitClicked.emit()\"\n                        (confirmClicked)=\"onConfirmButtonClick()\"\n  ></kit-cta-panel-action>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}.kit-cta-panel-confirmation{padding:15px 20px;border:2px solid #00b0ad;background:#f8f9fe;line-height:1.26}.kit-cta-panel-confirmation .confirmation-head{display:flex;margin-bottom:24px}.kit-cta-panel-confirmation .head-icon{width:24px;height:24px;margin-right:20px;flex-shrink:0;stroke:#00b0ad;fill:none}.kit-cta-panel-confirmation .head-icon .reset-icon{stroke:none;fill:#00b0ad}.kit-cta-panel-confirmation .head-title{color:#002a3a;font-weight:700}.kit-cta-panel-confirmation .head-description{margin-top:24px;color:#000}.kit-cta-panel-confirmation .confirmation-main{margin-bottom:24px}.kit-cta-panel-confirmation .confirmation-main-form{display:flex;flex-direction:column;gap:8px}\n"] }]
+            args: [{ selector: 'kit-cta-panel-confirmation', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-cta-panel-confirmation\">\n  <div class=\"confirmation-head\">\n    <kit-svg-icon *ngIf=\"data?.icon\" class=\"head-icon\"\n                  [icon]=\"data?.icon\"\n    ></kit-svg-icon>\n    <div class=\"head-text\">\n      <div class=\"head-title\">{{ data?.title }}</div>\n      <div *ngIf=\"data?.description\" class=\"head-description\">\n        {{ data?.description }}\n      </div>\n    </div>\n  </div>\n  <div class=\"confirmation-main\">\n    <form [formGroup]=\"form\" class=\"confirmation-main-form\">\n      <kit-dropdown *ngIf=\"data?.dropdownItems\"\n                    formControlName=\"reason\"\n                    [defaultItem]=\"data?.defaultDropdownItem\"\n                    [label]=\"data?.dropdownLabel\"\n                    [items]=\"data?.dropdownItems\"\n                    [listHeight]=\"dropdownListHeight\"\n      ></kit-dropdown>\n\n      <kit-checkbox *ngIf=\"data?.checkboxLabel\"\n                    formControlName=\"checkbox\"\n                    [label]=\"data?.checkboxLabel\"\n      ></kit-checkbox>\n    </form>\n  </div>\n  <kit-cta-panel-action [disabled]=\"data?.dropdownItems && form.invalid\"\n                        [quitText]=\"quitText\"\n                        [confirmText]=\"confirmText\"\n                        (quitClicked)=\"quitClicked.emit()\"\n                        (confirmClicked)=\"onConfirmButtonClick()\"\n  ></kit-cta-panel-action>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}.kit-cta-panel-confirmation{padding:15px 20px;border:2px solid #00b0ad;background:#f8f9fe;line-height:1.26}.kit-cta-panel-confirmation .confirmation-head{display:flex;margin-bottom:24px}.kit-cta-panel-confirmation .head-icon{width:24px;height:24px;margin-right:20px;flex-shrink:0;stroke:#00b0ad;fill:none}.kit-cta-panel-confirmation .head-icon .reset-icon{stroke:none;fill:#00b0ad}.kit-cta-panel-confirmation .head-title{color:#002a3a;font-weight:700}.kit-cta-panel-confirmation .head-description{margin-top:24px;color:#000}.kit-cta-panel-confirmation .confirmation-main{margin-bottom:24px}.kit-cta-panel-confirmation .confirmation-main-form{display:flex;flex-direction:column;gap:8px}\n"] }]
         }], ctorParameters: () => [{ type: i1.UntypedFormBuilder }], propDecorators: { data: [{
                 type: Input
             }], confirmButtonDisabled: [{

package/esm2022/lib/components/kit-cta-panel-item/kit-cta-panel-item.component.mjs CHANGED Viewed

@@ -20,11 +20,11 @@ export class KitCtaPanelItemComponent {
         this.clicked.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitCtaPanelItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.7", type: KitCtaPanelItemComponent, selector: "kit-cta-panel-item", inputs: { item: "item", type: "type" }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<div class=\"kit-cta-panel-item\">\n  <div class=\"panel-item-inner\">\n    <kit-svg-icon *ngIf=\"item?.icon\" class=\"panel-item-icon\"\n                  [icon]=\"item?.icon\"\n    ></kit-svg-icon>\n    <div class=\"panel-item-text\">\n      <div *ngIf=\"item?.title\" class=\"panel-item-title\">\n        {{ item?.title }}\n      </div>\n\n      <ng-container [ngSwitch]=\"type\">\n        <ng-container *ngSwitchCase=\"KitCtaPanelItemType.BUTTON\">\n          <button *ngIf=\"item?.buttonText\" class=\"panel-item-button\" (click)=\"onButtonClick()\">\n            <span class=\"button-label\">\n              {{ item?.buttonText }}\n            </span>\n            <kit-svg-icon class=\"button-icon\" [icon]=\"KitSvgIcon.CHEVRON_RIGHT\"\n            ></kit-svg-icon>\n          </button>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"KitCtaPanelItemType.LINK\">\n          <a *ngIf=\"item?.buttonText\" [routerLink]=\"item?.link\" class=\"panel-item-button\">\n            <span class=\"button-label\">\n              {{ item?.buttonText }}\n            </span>\n            <kit-svg-icon class=\"button-icon\" [icon]=\"KitSvgIcon.CHEVRON_RIGHT\"\n            ></kit-svg-icon>\n          </a>\n        </ng-container>\n      </ng-container>\n\n      <div *ngIf=\"item?.copyItem; let copyItem\" class=\"panel-item-copy\">\n        <kit-copy-text [textToCopy]=\"copyItem.textToCopy\"\n                       [tooltipTextBefore]=\"copyItem.tooltipTextBefore\"\n                       [tooltipTextAfter]=\"copyItem.tooltipTextAfter\"\n        ></kit-copy-text>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}.kit-cta-panel-item{padding:15px 20px;background:#fff}.kit-cta-panel-item .panel-item-inner{display:flex;padding-bottom:24px;border-bottom:6px solid #efefef}.kit-cta-panel-item .panel-item-icon{margin-right:20px;width:24px;height:24px;stroke:#a9a8a8;fill:none;flex-shrink:0}.kit-cta-panel-item .panel-item-icon .order-icon,.kit-cta-panel-item .panel-item-icon .reset-icon{stroke:none;fill:#a9a8a8}.kit-cta-panel-item .panel-item-title{margin-bottom:8px;color:#002a3a;font-size:14px}.kit-cta-panel-item .panel-item-button{display:flex;align-items:center;padding:0;color:#56a2f7;font-size:14px;font-weight:500;font-family:inherit;border:none;background:none;cursor:pointer;text-decoration:none}.kit-cta-panel-item .panel-item-button:hover{text-decoration:underline}.kit-cta-panel-item .button-label{margin-right:6px}.kit-cta-panel-item .button-icon{width:16px;height:16px;stroke:#56a2f7;fill:none}.kit-cta-panel-item .panel-item-copy{margin-top:8px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i4.KitCopyTextComponent, selector: "kit-copy-text", inputs: ["textToCopy", "tooltipTextBefore", "tooltipTextAfter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.7", type: KitCtaPanelItemComponent, selector: "kit-cta-panel-item", inputs: { item: "item", type: "type" }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<div class=\"kit-cta-panel-item\">\n  <div class=\"panel-item-inner\">\n    <kit-svg-icon *ngIf=\"item?.icon\" class=\"panel-item-icon\"\n                  [icon]=\"item?.icon\"\n    ></kit-svg-icon>\n    <div class=\"panel-item-text\">\n      <div *ngIf=\"item?.title\" class=\"panel-item-title\">\n        {{ item?.title }}\n      </div>\n\n      <ng-container [ngSwitch]=\"type\">\n        <ng-container *ngSwitchCase=\"KitCtaPanelItemType.BUTTON\">\n          <button *ngIf=\"item?.buttonText\" class=\"panel-item-button\" (click)=\"onButtonClick()\">\n            <span class=\"button-label\">\n              {{ item?.buttonText }}\n            </span>\n            <kit-svg-icon class=\"button-icon\" [icon]=\"KitSvgIcon.CHEVRON_RIGHT\"\n            ></kit-svg-icon>\n          </button>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"KitCtaPanelItemType.LINK\">\n          <a *ngIf=\"item?.buttonText\" [routerLink]=\"item?.link\" class=\"panel-item-button\">\n            <span class=\"button-label\">\n              {{ item?.buttonText }}\n            </span>\n            <kit-svg-icon class=\"button-icon\" [icon]=\"KitSvgIcon.CHEVRON_RIGHT\"\n            ></kit-svg-icon>\n          </a>\n        </ng-container>\n      </ng-container>\n\n      <div *ngIf=\"item?.copyItem; let copyItem\" class=\"panel-item-copy\">\n        <kit-copy-text [textToCopy]=\"copyItem.textToCopy\"\n                       [tooltipTextBefore]=\"copyItem.tooltipTextBefore\"\n                       [tooltipTextAfter]=\"copyItem.tooltipTextAfter\"\n        ></kit-copy-text>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}.kit-cta-panel-item{padding:15px 20px;background:#fff}.kit-cta-panel-item .panel-item-inner{display:flex;padding-bottom:24px;border-bottom:6px solid #efefef}.kit-cta-panel-item .panel-item-icon{margin-right:20px;width:24px;height:24px;stroke:#a9a8a8;fill:none;flex-shrink:0}.kit-cta-panel-item .panel-item-icon .order-icon,.kit-cta-panel-item .panel-item-icon .reset-icon{stroke:none;fill:#a9a8a8}.kit-cta-panel-item .panel-item-title{margin-bottom:8px;color:#002a3a;font-size:14px}.kit-cta-panel-item .panel-item-button{display:flex;align-items:center;padding:0;color:#56a2f7;font-size:14px;font-weight:500;font-family:inherit;border:none;background:none;cursor:pointer;text-decoration:none}.kit-cta-panel-item .panel-item-button:hover{text-decoration:underline}.kit-cta-panel-item .button-label{margin-right:6px}.kit-cta-panel-item .button-icon{width:16px;height:16px;stroke:#56a2f7;fill:none}.kit-cta-panel-item .panel-item-copy{margin-top:8px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i4.KitCopyTextComponent, selector: "kit-copy-text", inputs: ["textToCopy", "tooltipTextBefore", "tooltipTextAfter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitCtaPanelItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kit-cta-panel-item', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-cta-panel-item\">\n  <div class=\"panel-item-inner\">\n    <kit-svg-icon *ngIf=\"item?.icon\" class=\"panel-item-icon\"\n                  [icon]=\"item?.icon\"\n    ></kit-svg-icon>\n    <div class=\"panel-item-text\">\n      <div *ngIf=\"item?.title\" class=\"panel-item-title\">\n        {{ item?.title }}\n      </div>\n\n      <ng-container [ngSwitch]=\"type\">\n        <ng-container *ngSwitchCase=\"KitCtaPanelItemType.BUTTON\">\n          <button *ngIf=\"item?.buttonText\" class=\"panel-item-button\" (click)=\"onButtonClick()\">\n            <span class=\"button-label\">\n              {{ item?.buttonText }}\n            </span>\n            <kit-svg-icon class=\"button-icon\" [icon]=\"KitSvgIcon.CHEVRON_RIGHT\"\n            ></kit-svg-icon>\n          </button>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"KitCtaPanelItemType.LINK\">\n          <a *ngIf=\"item?.buttonText\" [routerLink]=\"item?.link\" class=\"panel-item-button\">\n            <span class=\"button-label\">\n              {{ item?.buttonText }}\n            </span>\n            <kit-svg-icon class=\"button-icon\" [icon]=\"KitSvgIcon.CHEVRON_RIGHT\"\n            ></kit-svg-icon>\n          </a>\n        </ng-container>\n      </ng-container>\n\n      <div *ngIf=\"item?.copyItem; let copyItem\" class=\"panel-item-copy\">\n        <kit-copy-text [textToCopy]=\"copyItem.textToCopy\"\n                       [tooltipTextBefore]=\"copyItem.tooltipTextBefore\"\n                       [tooltipTextAfter]=\"copyItem.tooltipTextAfter\"\n        ></kit-copy-text>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}.kit-cta-panel-item{padding:15px 20px;background:#fff}.kit-cta-panel-item .panel-item-inner{display:flex;padding-bottom:24px;border-bottom:6px solid #efefef}.kit-cta-panel-item .panel-item-icon{margin-right:20px;width:24px;height:24px;stroke:#a9a8a8;fill:none;flex-shrink:0}.kit-cta-panel-item .panel-item-icon .order-icon,.kit-cta-panel-item .panel-item-icon .reset-icon{stroke:none;fill:#a9a8a8}.kit-cta-panel-item .panel-item-title{margin-bottom:8px;color:#002a3a;font-size:14px}.kit-cta-panel-item .panel-item-button{display:flex;align-items:center;padding:0;color:#56a2f7;font-size:14px;font-weight:500;font-family:inherit;border:none;background:none;cursor:pointer;text-decoration:none}.kit-cta-panel-item .panel-item-button:hover{text-decoration:underline}.kit-cta-panel-item .button-label{margin-right:6px}.kit-cta-panel-item .button-icon{width:16px;height:16px;stroke:#56a2f7;fill:none}.kit-cta-panel-item .panel-item-copy{margin-top:8px}\n"] }]
+            args: [{ selector: 'kit-cta-panel-item', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-cta-panel-item\">\n  <div class=\"panel-item-inner\">\n    <kit-svg-icon *ngIf=\"item?.icon\" class=\"panel-item-icon\"\n                  [icon]=\"item?.icon\"\n    ></kit-svg-icon>\n    <div class=\"panel-item-text\">\n      <div *ngIf=\"item?.title\" class=\"panel-item-title\">\n        {{ item?.title }}\n      </div>\n\n      <ng-container [ngSwitch]=\"type\">\n        <ng-container *ngSwitchCase=\"KitCtaPanelItemType.BUTTON\">\n          <button *ngIf=\"item?.buttonText\" class=\"panel-item-button\" (click)=\"onButtonClick()\">\n            <span class=\"button-label\">\n              {{ item?.buttonText }}\n            </span>\n            <kit-svg-icon class=\"button-icon\" [icon]=\"KitSvgIcon.CHEVRON_RIGHT\"\n            ></kit-svg-icon>\n          </button>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"KitCtaPanelItemType.LINK\">\n          <a *ngIf=\"item?.buttonText\" [routerLink]=\"item?.link\" class=\"panel-item-button\">\n            <span class=\"button-label\">\n              {{ item?.buttonText }}\n            </span>\n            <kit-svg-icon class=\"button-icon\" [icon]=\"KitSvgIcon.CHEVRON_RIGHT\"\n            ></kit-svg-icon>\n          </a>\n        </ng-container>\n      </ng-container>\n\n      <div *ngIf=\"item?.copyItem; let copyItem\" class=\"panel-item-copy\">\n        <kit-copy-text [textToCopy]=\"copyItem.textToCopy\"\n                       [tooltipTextBefore]=\"copyItem.tooltipTextBefore\"\n                       [tooltipTextAfter]=\"copyItem.tooltipTextAfter\"\n        ></kit-copy-text>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}.kit-cta-panel-item{padding:15px 20px;background:#fff}.kit-cta-panel-item .panel-item-inner{display:flex;padding-bottom:24px;border-bottom:6px solid #efefef}.kit-cta-panel-item .panel-item-icon{margin-right:20px;width:24px;height:24px;stroke:#a9a8a8;fill:none;flex-shrink:0}.kit-cta-panel-item .panel-item-icon .order-icon,.kit-cta-panel-item .panel-item-icon .reset-icon{stroke:none;fill:#a9a8a8}.kit-cta-panel-item .panel-item-title{margin-bottom:8px;color:#002a3a;font-size:14px}.kit-cta-panel-item .panel-item-button{display:flex;align-items:center;padding:0;color:#56a2f7;font-size:14px;font-weight:500;font-family:inherit;border:none;background:none;cursor:pointer;text-decoration:none}.kit-cta-panel-item .panel-item-button:hover{text-decoration:underline}.kit-cta-panel-item .button-label{margin-right:6px}.kit-cta-panel-item .button-icon{width:16px;height:16px;stroke:#56a2f7;fill:none}.kit-cta-panel-item .panel-item-copy{margin-top:8px}\n"] }]
         }], propDecorators: { item: [{
                 type: Input
             }], type: [{

package/esm2022/lib/components/kit-daterange/kit-daterange.component.mjs CHANGED Viewed

@@ -84,11 +84,11 @@ export class KitDaterangeComponent {
         this.closed.emit(rangeValue);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitDaterangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.7", type: KitDaterangeComponent, 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", isValid: "isValid", iconPosition: "iconPosition", 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]=\"!isValid\"\n     [ngClass]=\"[iconPosition, 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 *ngIf=\"icon\"\n                  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]=\"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                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon *ngIf=\"icon\"\n                        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]=\"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                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon *ngIf=\"icon\"\n                        class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    <kendo-daterange-popup *ngIf=\"type === KitDaterangeType.DEFAULT\"\n                           #popup appendTo=\"component\"\n                           (close)=\"onClose()\"></kendo-daterange-popup>\n    <kendo-daterange-popup *ngIf=\"type === KitDaterangeType.BUTTON\"\n                           #popup appendTo=\"component\"\n                           [anchor]=\"$any(anchor)\"\n                           (close)=\"onClose()\"></kendo-daterange-popup>\n  </kendo-daterange>\n  <kit-input-message *ngIf=\"messageText\"\n                     [icon]=\"messageIcon\"\n                     [message]=\"messageText\"\n  ></kit-input-message>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}.kit-daterange.button .daterange-button{display:flex}.kit-daterange.button .daterange-input-wrapper{display:none}.kit-daterange.invalid .daterange-button{border-color:#ef3e42;background-color:#f8e0e0}.kit-daterange.invalid .daterange-button .button-text{color:#27282a}.kit-daterange.invalid .k-input-inner{color:#27282a;border-color:#ef3e42;background-color:#f8e0e0}.kit-daterange.disabled .daterange-button{border-color:#c1c7d0;background-color:#f3f4f6;cursor:default}.kit-daterange.disabled .daterange-button .button-text{color:#9a9fa6}.kit-daterange.disabled .daterange-button .button-icon{stroke:#c1c7d0}.kit-daterange.disabled .k-input-inner{color:#9a9fa6;border-color:#c1c7d0;background-color:#f3f4f6}.kit-daterange.disabled .daterange-input-button .button-icon{stroke:#c1c7d0}.kit-daterange.left .daterange-input-button{left:0;right:initial}.kit-daterange.left .k-input-inner{padding:4px 8px 4px 28px}.kit-daterange.left .daterange-button{flex-direction:row-reverse}.kit-daterange .daterange-button{display:none;align-items:center;padding:8px;width:100%;height:34px;gap:8px;border-radius:4px;border:1px solid #efefef;background:#fff;cursor:pointer}.kit-daterange .daterange-button .button-text{flex-grow:1;color:#27282a;font-size:13px;text-align:left}.kit-daterange .daterange-button .button-icon{display:block;width:16px;height:16px;fill:transparent;stroke:#002a3a}.kit-daterange .daterange-wrapper{display:flex;gap:8px}.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 8px;border:none;background:none;cursor:pointer;z-index:1}.kit-daterange .daterange-input-button .button-icon{display:block;width:16px;height:16px;fill:transparent;stroke:#002a3a}.kit-daterange .kit-daterange-default{display:flex}.kit-daterange .k-dateinput{border:none;border-radius:0;background:none}.kit-daterange .k-dateinput.k-focus{box-shadow:none}.kit-daterange .k-dateinput.k-focus .k-input-inner{border-color:#00b0ad}.kit-daterange .k-input-inner{padding:4px 28px 4px 8px;width:100%;height:34px;font-size:13px;font-weight:400;color:#002a3a;border-radius:4px;background-color:#fff;border:1px solid #efefef}.kit-daterange .k-input-inner::placeholder{color:#74777d}.kit-daterange .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-daterange .k-popup{border:1px solid #efefef;box-shadow:none}.kit-daterange .k-popup .k-calendar-header{padding:6px;font-size:14px;font-weight:500}.kit-daterange .k-popup .k-calendar-title{padding:0;color:#000;font-weight:500;line-height:1.26}.kit-daterange .k-popup .k-button{padding:0}.kit-daterange .k-popup .k-button:hover:before{background:none}.kit-daterange .k-popup .k-button-icon{padding:0;width:16px;height:16px;color:#002a3a}.kit-daterange .k-popup .k-prev-view .k-icon:before,.kit-daterange .k-popup .k-next-view .k-icon:before{position:absolute}.kit-daterange .k-popup .k-prev-view .k-icon:before{content:\"\\e016\"}.kit-daterange .k-popup .k-next-view .k-icon:before{content:\"\\e014\"}.kit-daterange .k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 6px;color:#56a2f7}.kit-daterange .k-popup .k-calendar-nav-today:hover{color:#56a2f7}.kit-daterange .k-popup .k-calendar-table{padding:0 10px 10px}.kit-daterange .k-popup .k-calendar-tr{display:flex}.kit-daterange .k-popup .k-calendar-th,.kit-daterange .k-popup .k-calendar-td{display:flex;padding:0;width:40px;height:40px;color:#000;font-weight:500;font-size:13px;line-height:1;border-radius:0;box-sizing:border-box}.kit-daterange .k-popup .k-calendar-th{align-items:center;justify-content:center;text-transform:capitalize}.kit-daterange .k-popup .k-calendar-td{border:1px solid #dfdfdf}.kit-daterange .k-popup .k-calendar-td:hover .k-link{color:#56a2f7;background:#fff}.kit-daterange .k-popup .k-calendar-td.k-state-focused .k-link,.kit-daterange .k-popup .k-calendar-td.k-state-active .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-range-start,.kit-daterange .k-popup .k-calendar-td.k-range-end{background:none}.kit-daterange .k-popup .k-calendar-td.k-range-start.k-today .k-link,.kit-daterange .k-popup .k-calendar-td.k-range-end.k-today .k-link{color:#fff}.kit-daterange .k-popup .k-calendar-td.k-range-start .k-link,.kit-daterange .k-popup .k-calendar-td.k-range-end .k-link{color:#fff;border:1px solid #dfdfdf;border-radius:50%;background:#56a2f7}.kit-daterange .k-popup .k-calendar-td.k-range-mid{background:#aad0fb}.kit-daterange .k-popup .k-calendar-td.k-today .k-link{color:#56a2f7}.kit-daterange .k-popup .k-calendar-td.k-today.k-focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-other-month .k-link{color:#a9a8a8}.kit-daterange .k-popup .k-link{display:flex;align-items:center;justify-content:center;margin:0;padding:0;width:100%;height:100%}.kit-daterange .k-popup .k-calendar-view{padding:0;gap:0}.kit-daterange .k-popup .k-calendar-content{padding:0 10px 10px}.kit-daterange .k-popup .k-calendar-yearview .k-calendar-td,.kit-daterange .k-popup .k-calendar-decadeview .k-calendar-td,.kit-daterange .k-popup .k-calendar-centuryview .k-calendar-td{width:76px;height:76px}.kit-daterange .k-popup .k-range-split-start:after,.kit-daterange .k-popup .k-range-split-end:after{background-image:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.DateInputComponent, selector: "kendo-dateinput", inputs: ["focusableId", "pickerType", "disabled", "readonly", "title", "tabindex", "role", "ariaReadOnly", "tabIndex", "format", "formatPlaceholder", "placeholder", "steps", "max", "min", "rangeValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "allowCaretMode", "autoFill", "incompleteDateValidation", "twoDigitYearMax", "enableMouseWheel", "value", "spinners", "isPopupOpen", "hasPopup", "size", "rounded", "fillMode"], outputs: ["valueChange", "valueUpdate", "focus", "blur"], exportAs: ["kendo-dateinput"] }, { kind: "component", type: i2.DateRangeComponent, selector: "kendo-daterange" }, { kind: "component", type: i2.DateRangePopupComponent, selector: "kendo-daterange-popup", inputs: ["animate", "anchor", "anchorAlign", "appendTo", "collision", "popupAlign", "margin", "adaptiveMode", "title", "subtitle"], outputs: ["open", "close", "blur", "focus", "cancel"], exportAs: ["kendo-daterange-popup"] }, { kind: "directive", type: i2.DateRangeStartInputDirective, selector: "[kendoDateRangeStartInput]", inputs: ["autoCorrectOn", "navigateCalendarOnFocus"] }, { kind: "directive", type: i2.DateRangeEndInputDirective, selector: "[kendoDateRangeEndInput]", inputs: ["autoCorrectOn", "navigateCalendarOnFocus"] }, { kind: "component", type: i3.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: i4.KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: i5.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: "17.0.7", type: KitDaterangeComponent, 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", isValid: "isValid", iconPosition: "iconPosition", 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]=\"!isValid\"\n     [ngClass]=\"[iconPosition, 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 *ngIf=\"icon\"\n                  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]=\"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                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon *ngIf=\"icon\"\n                        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]=\"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                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon *ngIf=\"icon\"\n                        class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    <kendo-daterange-popup *ngIf=\"type === KitDaterangeType.DEFAULT\"\n                           #popup appendTo=\"component\"\n                           (close)=\"onClose()\"></kendo-daterange-popup>\n    <kendo-daterange-popup *ngIf=\"type === KitDaterangeType.BUTTON\"\n                           #popup appendTo=\"component\"\n                           [anchor]=\"$any(anchor)\"\n                           (close)=\"onClose()\"></kendo-daterange-popup>\n  </kendo-daterange>\n  <kit-input-message *ngIf=\"messageText\"\n                     [icon]=\"messageIcon\"\n                     [message]=\"messageText\"\n  ></kit-input-message>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}.kit-daterange.button .daterange-button{display:flex}.kit-daterange.button .daterange-input-wrapper{display:none}.kit-daterange.invalid .daterange-button{border-color:#ef3e42;background-color:#f8e0e0}.kit-daterange.invalid .daterange-button .button-text{color:#27282a}.kit-daterange.invalid .k-input-inner{color:#27282a;border-color:#ef3e42;background-color:#f8e0e0}.kit-daterange.disabled .daterange-button{border-color:#c1c7d0;background-color:#f3f4f6;cursor:default}.kit-daterange.disabled .daterange-button .button-text{color:#9a9fa6}.kit-daterange.disabled .daterange-button .button-icon{stroke:#c1c7d0}.kit-daterange.disabled .k-input-inner{color:#9a9fa6;border-color:#c1c7d0;background-color:#f3f4f6}.kit-daterange.disabled .daterange-input-button .button-icon{stroke:#c1c7d0}.kit-daterange.left .daterange-input-button{left:0;right:initial}.kit-daterange.left .k-input-inner{padding:4px 8px 4px 28px}.kit-daterange.left .daterange-button{flex-direction:row-reverse}.kit-daterange .daterange-button{display:none;align-items:center;padding:8px;width:100%;height:34px;gap:8px;border-radius:4px;border:1px solid #efefef;background:#fff;cursor:pointer}.kit-daterange .daterange-button .button-text{flex-grow:1;color:#27282a;font-size:13px;text-align:left}.kit-daterange .daterange-button .button-icon{display:block;width:16px;height:16px;fill:transparent;stroke:#002a3a}.kit-daterange .daterange-wrapper{display:flex;gap:8px}.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 8px;border:none;background:none;cursor:pointer;z-index:1}.kit-daterange .daterange-input-button .button-icon{display:block;width:16px;height:16px;fill:transparent;stroke:#002a3a}.kit-daterange .kit-daterange-default{display:flex}.kit-daterange .k-dateinput{border:none;border-radius:0;background:none}.kit-daterange .k-dateinput.k-focus{box-shadow:none}.kit-daterange .k-dateinput.k-focus .k-input-inner{border-color:#00b0ad}.kit-daterange .k-input-inner{padding:4px 28px 4px 8px;width:100%;height:34px;font-size:13px;font-weight:400;color:#002a3a;border-radius:4px;background-color:#fff;border:1px solid #efefef}.kit-daterange .k-input-inner::placeholder{color:#74777d}.kit-daterange .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-daterange .k-popup{border:1px solid #efefef;box-shadow:none}.kit-daterange .k-popup .k-calendar-header{padding:6px;font-size:14px;font-weight:500}.kit-daterange .k-popup .k-calendar-title{padding:0;color:#000;font-weight:500;line-height:1.26}.kit-daterange .k-popup .k-button{padding:0}.kit-daterange .k-popup .k-button:hover:before{background:none}.kit-daterange .k-popup .k-button-icon{padding:0;width:16px;height:16px;color:#002a3a}.kit-daterange .k-popup .k-prev-view .k-icon:before,.kit-daterange .k-popup .k-next-view .k-icon:before{position:absolute}.kit-daterange .k-popup .k-prev-view .k-icon:before{content:\"\\e016\"}.kit-daterange .k-popup .k-next-view .k-icon:before{content:\"\\e014\"}.kit-daterange .k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 6px;color:#56a2f7}.kit-daterange .k-popup .k-calendar-nav-today:hover{color:#56a2f7}.kit-daterange .k-popup .k-calendar-table{padding:0 10px 10px}.kit-daterange .k-popup .k-calendar-tr{display:flex}.kit-daterange .k-popup .k-calendar-th,.kit-daterange .k-popup .k-calendar-td{display:flex;padding:0;width:40px;height:40px;color:#000;font-weight:500;font-size:13px;line-height:1;border-radius:0;box-sizing:border-box}.kit-daterange .k-popup .k-calendar-th{align-items:center;justify-content:center;text-transform:capitalize}.kit-daterange .k-popup .k-calendar-td{border:1px solid #dfdfdf}.kit-daterange .k-popup .k-calendar-td:hover .k-link{color:#56a2f7;background:#fff}.kit-daterange .k-popup .k-calendar-td.k-state-focused .k-link,.kit-daterange .k-popup .k-calendar-td.k-state-active .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-range-start,.kit-daterange .k-popup .k-calendar-td.k-range-end{background:none}.kit-daterange .k-popup .k-calendar-td.k-range-start.k-today .k-link,.kit-daterange .k-popup .k-calendar-td.k-range-end.k-today .k-link{color:#fff}.kit-daterange .k-popup .k-calendar-td.k-range-start .k-link,.kit-daterange .k-popup .k-calendar-td.k-range-end .k-link{color:#fff;border:1px solid #dfdfdf;border-radius:50%;background:#56a2f7}.kit-daterange .k-popup .k-calendar-td.k-range-mid{background:#aad0fb}.kit-daterange .k-popup .k-calendar-td.k-today .k-link{color:#56a2f7}.kit-daterange .k-popup .k-calendar-td.k-today.k-focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-other-month .k-link{color:#a9a8a8}.kit-daterange .k-popup .k-link{display:flex;align-items:center;justify-content:center;margin:0;padding:0;width:100%;height:100%}.kit-daterange .k-popup .k-calendar-view{padding:0;gap:0}.kit-daterange .k-popup .k-calendar-content{padding:0 10px 10px}.kit-daterange .k-popup .k-calendar-yearview .k-calendar-td,.kit-daterange .k-popup .k-calendar-decadeview .k-calendar-td,.kit-daterange .k-popup .k-calendar-centuryview .k-calendar-td{width:76px;height:76px}.kit-daterange .k-popup .k-range-split-start:after,.kit-daterange .k-popup .k-range-split-end:after{background-image:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.DateInputComponent, selector: "kendo-dateinput", inputs: ["focusableId", "pickerType", "disabled", "readonly", "title", "tabindex", "role", "ariaReadOnly", "tabIndex", "format", "formatPlaceholder", "placeholder", "steps", "max", "min", "rangeValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "allowCaretMode", "autoFill", "incompleteDateValidation", "twoDigitYearMax", "enableMouseWheel", "value", "spinners", "isPopupOpen", "hasPopup", "size", "rounded", "fillMode"], outputs: ["valueChange", "valueUpdate", "focus", "blur"], exportAs: ["kendo-dateinput"] }, { kind: "component", type: i2.DateRangeComponent, selector: "kendo-daterange" }, { kind: "component", type: i2.DateRangePopupComponent, selector: "kendo-daterange-popup", inputs: ["animate", "anchor", "anchorAlign", "appendTo", "collision", "popupAlign", "margin", "adaptiveMode", "title", "subtitle"], outputs: ["open", "close", "blur", "focus", "cancel"], exportAs: ["kendo-daterange-popup"] }, { kind: "directive", type: i2.DateRangeStartInputDirective, selector: "[kendoDateRangeStartInput]", inputs: ["autoCorrectOn", "navigateCalendarOnFocus"] }, { kind: "directive", type: i2.DateRangeEndInputDirective, selector: "[kendoDateRangeEndInput]", inputs: ["autoCorrectOn", "navigateCalendarOnFocus"] }, { kind: "component", type: i3.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: i4.KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: i5.KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitDaterangeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kit-daterange', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-daterange\"\n     [class.disabled]=\"disabled\"\n     [class.invalid]=\"!isValid\"\n     [ngClass]=\"[iconPosition, 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 *ngIf=\"icon\"\n                  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]=\"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                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon *ngIf=\"icon\"\n                        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]=\"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                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon *ngIf=\"icon\"\n                        class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    <kendo-daterange-popup *ngIf=\"type === KitDaterangeType.DEFAULT\"\n                           #popup appendTo=\"component\"\n                           (close)=\"onClose()\"></kendo-daterange-popup>\n    <kendo-daterange-popup *ngIf=\"type === KitDaterangeType.BUTTON\"\n                           #popup appendTo=\"component\"\n                           [anchor]=\"$any(anchor)\"\n                           (close)=\"onClose()\"></kendo-daterange-popup>\n  </kendo-daterange>\n  <kit-input-message *ngIf=\"messageText\"\n                     [icon]=\"messageIcon\"\n                     [message]=\"messageText\"\n  ></kit-input-message>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}.kit-daterange.button .daterange-button{display:flex}.kit-daterange.button .daterange-input-wrapper{display:none}.kit-daterange.invalid .daterange-button{border-color:#ef3e42;background-color:#f8e0e0}.kit-daterange.invalid .daterange-button .button-text{color:#27282a}.kit-daterange.invalid .k-input-inner{color:#27282a;border-color:#ef3e42;background-color:#f8e0e0}.kit-daterange.disabled .daterange-button{border-color:#c1c7d0;background-color:#f3f4f6;cursor:default}.kit-daterange.disabled .daterange-button .button-text{color:#9a9fa6}.kit-daterange.disabled .daterange-button .button-icon{stroke:#c1c7d0}.kit-daterange.disabled .k-input-inner{color:#9a9fa6;border-color:#c1c7d0;background-color:#f3f4f6}.kit-daterange.disabled .daterange-input-button .button-icon{stroke:#c1c7d0}.kit-daterange.left .daterange-input-button{left:0;right:initial}.kit-daterange.left .k-input-inner{padding:4px 8px 4px 28px}.kit-daterange.left .daterange-button{flex-direction:row-reverse}.kit-daterange .daterange-button{display:none;align-items:center;padding:8px;width:100%;height:34px;gap:8px;border-radius:4px;border:1px solid #efefef;background:#fff;cursor:pointer}.kit-daterange .daterange-button .button-text{flex-grow:1;color:#27282a;font-size:13px;text-align:left}.kit-daterange .daterange-button .button-icon{display:block;width:16px;height:16px;fill:transparent;stroke:#002a3a}.kit-daterange .daterange-wrapper{display:flex;gap:8px}.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 8px;border:none;background:none;cursor:pointer;z-index:1}.kit-daterange .daterange-input-button .button-icon{display:block;width:16px;height:16px;fill:transparent;stroke:#002a3a}.kit-daterange .kit-daterange-default{display:flex}.kit-daterange .k-dateinput{border:none;border-radius:0;background:none}.kit-daterange .k-dateinput.k-focus{box-shadow:none}.kit-daterange .k-dateinput.k-focus .k-input-inner{border-color:#00b0ad}.kit-daterange .k-input-inner{padding:4px 28px 4px 8px;width:100%;height:34px;font-size:13px;font-weight:400;color:#002a3a;border-radius:4px;background-color:#fff;border:1px solid #efefef}.kit-daterange .k-input-inner::placeholder{color:#74777d}.kit-daterange .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-daterange .k-popup{border:1px solid #efefef;box-shadow:none}.kit-daterange .k-popup .k-calendar-header{padding:6px;font-size:14px;font-weight:500}.kit-daterange .k-popup .k-calendar-title{padding:0;color:#000;font-weight:500;line-height:1.26}.kit-daterange .k-popup .k-button{padding:0}.kit-daterange .k-popup .k-button:hover:before{background:none}.kit-daterange .k-popup .k-button-icon{padding:0;width:16px;height:16px;color:#002a3a}.kit-daterange .k-popup .k-prev-view .k-icon:before,.kit-daterange .k-popup .k-next-view .k-icon:before{position:absolute}.kit-daterange .k-popup .k-prev-view .k-icon:before{content:\"\\e016\"}.kit-daterange .k-popup .k-next-view .k-icon:before{content:\"\\e014\"}.kit-daterange .k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 6px;color:#56a2f7}.kit-daterange .k-popup .k-calendar-nav-today:hover{color:#56a2f7}.kit-daterange .k-popup .k-calendar-table{padding:0 10px 10px}.kit-daterange .k-popup .k-calendar-tr{display:flex}.kit-daterange .k-popup .k-calendar-th,.kit-daterange .k-popup .k-calendar-td{display:flex;padding:0;width:40px;height:40px;color:#000;font-weight:500;font-size:13px;line-height:1;border-radius:0;box-sizing:border-box}.kit-daterange .k-popup .k-calendar-th{align-items:center;justify-content:center;text-transform:capitalize}.kit-daterange .k-popup .k-calendar-td{border:1px solid #dfdfdf}.kit-daterange .k-popup .k-calendar-td:hover .k-link{color:#56a2f7;background:#fff}.kit-daterange .k-popup .k-calendar-td.k-state-focused .k-link,.kit-daterange .k-popup .k-calendar-td.k-state-active .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-range-start,.kit-daterange .k-popup .k-calendar-td.k-range-end{background:none}.kit-daterange .k-popup .k-calendar-td.k-range-start.k-today .k-link,.kit-daterange .k-popup .k-calendar-td.k-range-end.k-today .k-link{color:#fff}.kit-daterange .k-popup .k-calendar-td.k-range-start .k-link,.kit-daterange .k-popup .k-calendar-td.k-range-end .k-link{color:#fff;border:1px solid #dfdfdf;border-radius:50%;background:#56a2f7}.kit-daterange .k-popup .k-calendar-td.k-range-mid{background:#aad0fb}.kit-daterange .k-popup .k-calendar-td.k-today .k-link{color:#56a2f7}.kit-daterange .k-popup .k-calendar-td.k-today.k-focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-other-month .k-link{color:#a9a8a8}.kit-daterange .k-popup .k-link{display:flex;align-items:center;justify-content:center;margin:0;padding:0;width:100%;height:100%}.kit-daterange .k-popup .k-calendar-view{padding:0;gap:0}.kit-daterange .k-popup .k-calendar-content{padding:0 10px 10px}.kit-daterange .k-popup .k-calendar-yearview .k-calendar-td,.kit-daterange .k-popup .k-calendar-decadeview .k-calendar-td,.kit-daterange .k-popup .k-calendar-centuryview .k-calendar-td{width:76px;height:76px}.kit-daterange .k-popup .k-range-split-start:after,.kit-daterange .k-popup .k-range-split-end:after{background-image:none}\n"] }]
+            args: [{ selector: 'kit-daterange', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-daterange\"\n     [class.disabled]=\"disabled\"\n     [class.invalid]=\"!isValid\"\n     [ngClass]=\"[iconPosition, 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 *ngIf=\"icon\"\n                  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]=\"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                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon *ngIf=\"icon\"\n                        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]=\"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                (click)=\"openCalendarPopup()\">\n          <kit-svg-icon *ngIf=\"icon\"\n                        class=\"button-icon\"\n                        [icon]=\"icon\"\n          ></kit-svg-icon>\n        </button>\n      </div>\n    </div>\n    <kendo-daterange-popup *ngIf=\"type === KitDaterangeType.DEFAULT\"\n                           #popup appendTo=\"component\"\n                           (close)=\"onClose()\"></kendo-daterange-popup>\n    <kendo-daterange-popup *ngIf=\"type === KitDaterangeType.BUTTON\"\n                           #popup appendTo=\"component\"\n                           [anchor]=\"$any(anchor)\"\n                           (close)=\"onClose()\"></kendo-daterange-popup>\n  </kendo-daterange>\n  <kit-input-message *ngIf=\"messageText\"\n                     [icon]=\"messageIcon\"\n                     [message]=\"messageText\"\n  ></kit-input-message>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}.kit-daterange.button .daterange-button{display:flex}.kit-daterange.button .daterange-input-wrapper{display:none}.kit-daterange.invalid .daterange-button{border-color:#ef3e42;background-color:#f8e0e0}.kit-daterange.invalid .daterange-button .button-text{color:#27282a}.kit-daterange.invalid .k-input-inner{color:#27282a;border-color:#ef3e42;background-color:#f8e0e0}.kit-daterange.disabled .daterange-button{border-color:#c1c7d0;background-color:#f3f4f6;cursor:default}.kit-daterange.disabled .daterange-button .button-text{color:#9a9fa6}.kit-daterange.disabled .daterange-button .button-icon{stroke:#c1c7d0}.kit-daterange.disabled .k-input-inner{color:#9a9fa6;border-color:#c1c7d0;background-color:#f3f4f6}.kit-daterange.disabled .daterange-input-button .button-icon{stroke:#c1c7d0}.kit-daterange.left .daterange-input-button{left:0;right:initial}.kit-daterange.left .k-input-inner{padding:4px 8px 4px 28px}.kit-daterange.left .daterange-button{flex-direction:row-reverse}.kit-daterange .daterange-button{display:none;align-items:center;padding:8px;width:100%;height:34px;gap:8px;border-radius:4px;border:1px solid #efefef;background:#fff;cursor:pointer}.kit-daterange .daterange-button .button-text{flex-grow:1;color:#27282a;font-size:13px;text-align:left}.kit-daterange .daterange-button .button-icon{display:block;width:16px;height:16px;fill:transparent;stroke:#002a3a}.kit-daterange .daterange-wrapper{display:flex;gap:8px}.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 8px;border:none;background:none;cursor:pointer;z-index:1}.kit-daterange .daterange-input-button .button-icon{display:block;width:16px;height:16px;fill:transparent;stroke:#002a3a}.kit-daterange .kit-daterange-default{display:flex}.kit-daterange .k-dateinput{border:none;border-radius:0;background:none}.kit-daterange .k-dateinput.k-focus{box-shadow:none}.kit-daterange .k-dateinput.k-focus .k-input-inner{border-color:#00b0ad}.kit-daterange .k-input-inner{padding:4px 28px 4px 8px;width:100%;height:34px;font-size:13px;font-weight:400;color:#002a3a;border-radius:4px;background-color:#fff;border:1px solid #efefef}.kit-daterange .k-input-inner::placeholder{color:#74777d}.kit-daterange .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-daterange .k-popup{border:1px solid #efefef;box-shadow:none}.kit-daterange .k-popup .k-calendar-header{padding:6px;font-size:14px;font-weight:500}.kit-daterange .k-popup .k-calendar-title{padding:0;color:#000;font-weight:500;line-height:1.26}.kit-daterange .k-popup .k-button{padding:0}.kit-daterange .k-popup .k-button:hover:before{background:none}.kit-daterange .k-popup .k-button-icon{padding:0;width:16px;height:16px;color:#002a3a}.kit-daterange .k-popup .k-prev-view .k-icon:before,.kit-daterange .k-popup .k-next-view .k-icon:before{position:absolute}.kit-daterange .k-popup .k-prev-view .k-icon:before{content:\"\\e016\"}.kit-daterange .k-popup .k-next-view .k-icon:before{content:\"\\e014\"}.kit-daterange .k-popup .k-calendar-nav-today{display:flex;align-items:center;padding:0 6px;color:#56a2f7}.kit-daterange .k-popup .k-calendar-nav-today:hover{color:#56a2f7}.kit-daterange .k-popup .k-calendar-table{padding:0 10px 10px}.kit-daterange .k-popup .k-calendar-tr{display:flex}.kit-daterange .k-popup .k-calendar-th,.kit-daterange .k-popup .k-calendar-td{display:flex;padding:0;width:40px;height:40px;color:#000;font-weight:500;font-size:13px;line-height:1;border-radius:0;box-sizing:border-box}.kit-daterange .k-popup .k-calendar-th{align-items:center;justify-content:center;text-transform:capitalize}.kit-daterange .k-popup .k-calendar-td{border:1px solid #dfdfdf}.kit-daterange .k-popup .k-calendar-td:hover .k-link{color:#56a2f7;background:#fff}.kit-daterange .k-popup .k-calendar-td.k-state-focused .k-link,.kit-daterange .k-popup .k-calendar-td.k-state-active .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-range-start,.kit-daterange .k-popup .k-calendar-td.k-range-end{background:none}.kit-daterange .k-popup .k-calendar-td.k-range-start.k-today .k-link,.kit-daterange .k-popup .k-calendar-td.k-range-end.k-today .k-link{color:#fff}.kit-daterange .k-popup .k-calendar-td.k-range-start .k-link,.kit-daterange .k-popup .k-calendar-td.k-range-end .k-link{color:#fff;border:1px solid #dfdfdf;border-radius:50%;background:#56a2f7}.kit-daterange .k-popup .k-calendar-td.k-range-mid{background:#aad0fb}.kit-daterange .k-popup .k-calendar-td.k-today .k-link{color:#56a2f7}.kit-daterange .k-popup .k-calendar-td.k-today.k-focus .k-link{box-shadow:none}.kit-daterange .k-popup .k-calendar-td.k-other-month .k-link{color:#a9a8a8}.kit-daterange .k-popup .k-link{display:flex;align-items:center;justify-content:center;margin:0;padding:0;width:100%;height:100%}.kit-daterange .k-popup .k-calendar-view{padding:0;gap:0}.kit-daterange .k-popup .k-calendar-content{padding:0 10px 10px}.kit-daterange .k-popup .k-calendar-yearview .k-calendar-td,.kit-daterange .k-popup .k-calendar-decadeview .k-calendar-td,.kit-daterange .k-popup .k-calendar-centuryview .k-calendar-td{width:76px;height:76px}.kit-daterange .k-popup .k-range-split-start:after,.kit-daterange .k-popup .k-range-split-end:after{background-image:none}\n"] }]
         }], propDecorators: { type: [{
                 type: Input
             }], label: [{

package/esm2022/lib/components/kit-datetimepicker/kit-datetimepicker.component.mjs CHANGED Viewed

@@ -91,7 +91,7 @@ export 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.datetimepicker-disabled]=\"disabled\"\n     [class.datetimepicker-invalid]=\"!isValid\"\n     [class.datetimepicker-opened]=\"datetimepicker.isOpen\"\n>\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"datetimepicker\"\n    ></kit-input-label>\n  }\n  <div class=\"datetimepicker-wrap\">\n    <button class=\"toggle-btn\" (click)=\"onPopupToggle()\">\n      <kit-svg-icon *ngIf=\"icon\"\n                    class=\"button-icon\"\n                    [icon]=\"icon\"\n      ></kit-svg-icon>\n    </button>\n    <kendo-datetimepicker #datetimepicker\n                          [placeholder]=\"placeholder\"\n                          [format]=\"format\"\n                          [disabled]=\"disabled\"\n                          [popupSettings]=\"datetimepickerPopupSettings\"\n                          [value]=\"defaultDate\"\n                          [min]=\"min\" [max]=\"max\"\n                          [focusedDate]=\"defaultDate\"\n                          (valueChange)=\"onValueChange($event)\"\n                          (blur)=\"onBlur()\"\n                          (close)=\"onClose()\"\n    ></kendo-datetimepicker>\n  </div>\n  <kit-input-message *ngIf=\"messageText\"\n                     [icon]=\"messageIcon\"\n                     [message]=\"messageText\"\n  ></kit-input-message>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}.kit-datetimepicker .label{display:block;margin-bottom:4px}.kit-datetimepicker .datetimepicker-wrap{position:relative}.kit-datetimepicker .k-datetimepicker{padding:4px 8px 4px 28px;height:34px;width:100%;font-size:13px;font-weight:400;color:#002a3a;border-radius:4px;border:1px solid #efefef}.kit-datetimepicker .k-datetimepicker.k-focus{border-color:#00b0ad;box-shadow:none}.kit-datetimepicker .k-dateinput{box-shadow:none}.kit-datetimepicker .k-input-inner{padding:0;line-height:1}.kit-datetimepicker .k-input-inner::placeholder{color:#74777d}.kit-datetimepicker .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-datetimepicker .toggle-btn{position:absolute;top:0;left:0;padding: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;fill:transparent;stroke:#002a3a}.kit-datetimepicker.datetimepicker-opened .toggle-btn .button-icon{stroke:#00b0ad}.kit-datetimepicker:focus-within .k-datetimepicker{color:#27282a}.kit-datetimepicker.datetimepicker-disabled .k-datetimepicker{color:#9a9fa6;border-color:#c1c7d0;background-color:#f3f4f6}.kit-datetimepicker.datetimepicker-disabled .toggle-btn{cursor:default}.kit-datetimepicker.datetimepicker-disabled .toggle-btn .button-icon{stroke:#c1c7d0}.kit-datetimepicker.datetimepicker-invalid .k-datetimepicker{color:#27282a;border-color:#ef3e42;background-color:#f8e0e0}.kit-datetimepicker .k-input-button{display:none}.kit-datetimepicker-popup.k-popup{margin-top:8px;border-radius:6px;border:1px solid #006890;box-shadow:none;background:#f3f4f6}.kit-datetimepicker-popup.k-popup .k-datetime-wrap{width:296px}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup{padding:4px;border-radius:6px 6px 0 0;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button{height:32px;color:#27282a;font-size:13px;font-weight:400;border-radius:6px 6px 0 0;border:1px solid #c1c7d0;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button.k-active{background:#fff}.kit-datetimepicker-popup.k-popup .k-datetime-selector{padding-top:6px;background:none}.kit-datetimepicker-popup.k-popup .kalendar-view{padding:0}.kit-datetimepicker-popup.k-popup .k-datetime-time-wrap,.kit-datetimepicker-popup.k-popup .k-datetime-calendar-wrap{flex-basis:296px}.kit-datetimepicker-popup.k-popup .k-calendar{width:100%;background:none}.kit-datetimepicker-popup.k-popup .k-link{align-items:center;width:100%;height:100%;color:#27282a;font-size:13px;font-weight:500;line-height:1;border-radius:50%;box-shadow:none}.kit-datetimepicker-popup.k-popup .k-link:hover{color:#7ccdf4;background:none}.kit-datetimepicker-popup.k-popup .k-calendar-view{padding:0;width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-view:after{display:none}.kit-datetimepicker-popup.k-popup .k-calendar-view .k-calendar-th{padding:6px 0;height:auto;color:#9a9fa6;font-size:16px;font-weight:700}.kit-datetimepicker-popup.k-popup .k-calendar-view .k-link{width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-table{border-collapse:collapse}.kit-datetimepicker-popup.k-popup .k-calendar-header,.kit-datetimepicker-popup.k-popup .k-time-header{margin:0 0 6px;padding:4px 30px;border-radius:6px 6px 0 0;background:#fff}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-title,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-title{padding:0;color:#27282a;font-size:16px;font-weight:700}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-nav-today,.kit-datetimepicker-popup.k-popup .k-calendar-header .k-time-now,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-nav-today,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{display:flex;align-items:center;padding:0;color:#7ccdf4;font-size:16px;font-weight:400;text-transform:uppercase}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-nav-today:hover,.kit-datetimepicker-popup.k-popup .k-calendar-header .k-time-now:hover,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-nav-today:hover,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover{color:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-weekdays{padding:6px 8px 0}.kit-datetimepicker-popup.k-popup .k-calendar-weekdays .k-calendar-th{padding:0;height:40px;color:#27282a;font-size:13px;font-weight:500;line-height:1;text-transform:uppercase}.kit-datetimepicker-popup.k-popup .k-calendar-content{margin:0;padding:0 8px;box-sizing:border-box}.kit-datetimepicker-popup.k-popup .k-calendar-content>.k-calendar-table{margin:0;width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-td{width:40px;height:40px;border:1px solid #dfdfdf}.kit-datetimepicker-popup.k-popup .k-calendar-td:hover .k-link{background:none}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-empty{border:none}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-today .k-link{color:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-selected .k-link{color:#fff;border:1px solid #dfdfdf;background:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-selected.k-focus .k-link,.kit-datetimepicker-popup.k-popup .k-calendar-td.k-state-focused .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-actions{margin-top:0;padding:12px;justify-content:center;flex-direction:row-reverse;border-top:1px solid #006890}.kit-datetimepicker-popup.k-popup .k-actions .k-button{margin:0 5px;width:110px;height:30px;flex:0 0 auto;font-size:14px;font-weight:400;border-radius:4px;border:none}.kit-datetimepicker-popup.k-popup .k-time-cancel{color:#27282a;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-time-accept{color:#fff;background:#006890}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper{padding:0;height:252px;background:#fff}.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-state-focused{background:#f3f4f6}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper .k-title{display:flex;align-items:center;justify-content:center;margin:0;color:#27282a;font-size:14px;font-weight:500;height:40px}.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:0;height:40px;color:#27282a;font-size:14px;font-weight:500}.kit-datetimepicker-popup.k-popup .k-time-highlight{top:50%;height:40px;border-color:#cdd2d9;transform:none}.kit-datetimepicker-popup.k-popup .k-time-separator{margin-top:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.DateTimePickerComponent, selector: "kendo-datetimepicker", inputs: ["focusableId", "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", "autoFill", "adaptiveMode", "defaultTab", "size", "rounded", "fillMode"], outputs: ["valueChange", "open", "close", "focus", "blur"], exportAs: ["kendo-datetimepicker"] }, { kind: "component", type: i3.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: i4.KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: i5.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.datetimepicker-disabled]=\"disabled\"\n     [class.datetimepicker-invalid]=\"!isValid\"\n     [class.datetimepicker-opened]=\"datetimepicker.isOpen\"\n>\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"datetimepicker\"\n    ></kit-input-label>\n  }\n  <div class=\"datetimepicker-wrap\">\n    <button class=\"toggle-btn\" (click)=\"onPopupToggle()\">\n      <kit-svg-icon *ngIf=\"icon\"\n                    class=\"button-icon\"\n                    [icon]=\"icon\"\n      ></kit-svg-icon>\n    </button>\n    <kendo-datetimepicker #datetimepicker\n                          [placeholder]=\"placeholder\"\n                          [format]=\"format\"\n                          [disabled]=\"disabled\"\n                          [popupSettings]=\"datetimepickerPopupSettings\"\n                          [value]=\"defaultDate\"\n                          [min]=\"min\" [max]=\"max\"\n                          [focusedDate]=\"defaultDate\"\n                          (valueChange)=\"onValueChange($event)\"\n                          (blur)=\"onBlur()\"\n                          (close)=\"onClose()\"\n    ></kendo-datetimepicker>\n  </div>\n  <kit-input-message *ngIf=\"messageText\"\n                     [icon]=\"messageIcon\"\n                     [message]=\"messageText\"\n  ></kit-input-message>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}.kit-datetimepicker .label{display:block;margin-bottom:4px}.kit-datetimepicker .datetimepicker-wrap{position:relative}.kit-datetimepicker .k-datetimepicker{padding:4px 8px 4px 28px;height:34px;width:100%;font-size:13px;font-weight:400;color:#002a3a;border-radius:4px;border:1px solid #efefef}.kit-datetimepicker .k-datetimepicker.k-focus{border-color:#00b0ad;box-shadow:none}.kit-datetimepicker .k-dateinput{box-shadow:none}.kit-datetimepicker .k-input-inner{padding:0;line-height:1}.kit-datetimepicker .k-input-inner::placeholder{color:#74777d}.kit-datetimepicker .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-datetimepicker .toggle-btn{position:absolute;top:0;left:0;padding: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;fill:transparent;stroke:#002a3a}.kit-datetimepicker.datetimepicker-opened .toggle-btn .button-icon{stroke:#00b0ad}.kit-datetimepicker:focus-within .k-datetimepicker{color:#27282a}.kit-datetimepicker.datetimepicker-disabled .k-datetimepicker{color:#9a9fa6;border-color:#c1c7d0;background-color:#f3f4f6}.kit-datetimepicker.datetimepicker-disabled .toggle-btn{cursor:default}.kit-datetimepicker.datetimepicker-disabled .toggle-btn .button-icon{stroke:#c1c7d0}.kit-datetimepicker.datetimepicker-invalid .k-datetimepicker{color:#27282a;border-color:#ef3e42;background-color:#f8e0e0}.kit-datetimepicker .k-input-button{display:none}.kit-datetimepicker-popup.k-popup{margin-top:8px;border-radius:6px;border:1px solid #006890;box-shadow:none;background:#f3f4f6}.kit-datetimepicker-popup.k-popup .k-datetime-wrap{width:296px}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup{padding:4px;border-radius:6px 6px 0 0;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button{height:32px;color:#27282a;font-size:13px;font-weight:400;border-radius:6px 6px 0 0;border:1px solid #c1c7d0;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button.k-active{background:#fff}.kit-datetimepicker-popup.k-popup .k-datetime-selector{padding-top:6px;background:none}.kit-datetimepicker-popup.k-popup .kalendar-view{padding:0}.kit-datetimepicker-popup.k-popup .k-datetime-time-wrap,.kit-datetimepicker-popup.k-popup .k-datetime-calendar-wrap{flex-basis:296px}.kit-datetimepicker-popup.k-popup .k-calendar{width:100%;background:none}.kit-datetimepicker-popup.k-popup .k-link{align-items:center;width:100%;height:100%;color:#27282a;font-size:13px;font-weight:500;line-height:1;border-radius:50%;box-shadow:none}.kit-datetimepicker-popup.k-popup .k-link:hover{color:#7ccdf4;background:none}.kit-datetimepicker-popup.k-popup .k-calendar-view{padding:0;width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-view:after{display:none}.kit-datetimepicker-popup.k-popup .k-calendar-view .k-calendar-th{padding:6px 0;height:auto;color:#9a9fa6;font-size:16px;font-weight:700}.kit-datetimepicker-popup.k-popup .k-calendar-view .k-link{width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-table{border-collapse:collapse}.kit-datetimepicker-popup.k-popup .k-calendar-header,.kit-datetimepicker-popup.k-popup .k-time-header{margin:0 0 6px;padding:4px 30px;border-radius:6px 6px 0 0;background:#fff}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-title,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-title{padding:0;color:#27282a;font-size:16px;font-weight:700}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-nav-today,.kit-datetimepicker-popup.k-popup .k-calendar-header .k-time-now,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-nav-today,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{display:flex;align-items:center;padding:0;color:#7ccdf4;font-size:16px;font-weight:400;text-transform:uppercase}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-nav-today:hover,.kit-datetimepicker-popup.k-popup .k-calendar-header .k-time-now:hover,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-nav-today:hover,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover{color:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-weekdays{padding:6px 8px 0}.kit-datetimepicker-popup.k-popup .k-calendar-weekdays .k-calendar-th{padding:0;height:40px;color:#27282a;font-size:13px;font-weight:500;line-height:1;text-transform:uppercase}.kit-datetimepicker-popup.k-popup .k-calendar-content{margin:0;padding:0 8px;box-sizing:border-box}.kit-datetimepicker-popup.k-popup .k-calendar-content>.k-calendar-table{margin:0;width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-td{width:40px;height:40px;border:1px solid #dfdfdf}.kit-datetimepicker-popup.k-popup .k-calendar-td:hover .k-link{background:none}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-empty{border:none}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-today .k-link{color:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-selected .k-link{color:#fff;border:1px solid #dfdfdf;background:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-selected.k-focus .k-link,.kit-datetimepicker-popup.k-popup .k-calendar-td.k-state-focused .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-actions{margin-top:0;padding:12px;justify-content:center;flex-direction:row-reverse;border-top:1px solid #006890}.kit-datetimepicker-popup.k-popup .k-actions .k-button{margin:0 5px;width:110px;height:30px;flex:0 0 auto;font-size:14px;font-weight:400;border-radius:4px;border:none}.kit-datetimepicker-popup.k-popup .k-time-cancel{color:#27282a;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-time-accept{color:#fff;background:#006890}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper{padding:0;height:252px;background:#fff}.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-state-focused{background:#f3f4f6}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper .k-title{display:flex;align-items:center;justify-content:center;margin:0;color:#27282a;font-size:14px;font-weight:500;height:40px}.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:0;height:40px;color:#27282a;font-size:14px;font-weight:500}.kit-datetimepicker-popup.k-popup .k-time-highlight{top:50%;height:40px;border-color:#cdd2d9;transform:none}.kit-datetimepicker-popup.k-popup .k-time-separator{margin-top:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.DateTimePickerComponent, selector: "kendo-datetimepicker", inputs: ["focusableId", "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", "autoFill", "adaptiveMode", "defaultTab", "size", "rounded", "fillMode"], outputs: ["valueChange", "open", "close", "focus", "blur"], exportAs: ["kendo-datetimepicker"] }, { kind: "component", type: i3.KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: i4.KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: i5.KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitDatetimepickerComponent, decorators: [{
             type: Component,
@@ -99,7 +99,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImpor
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => KitDatetimepickerComponent),
                             multi: true,
-                        }], template: "<div class=\"kit-datetimepicker\"\n     [class.datetimepicker-disabled]=\"disabled\"\n     [class.datetimepicker-invalid]=\"!isValid\"\n     [class.datetimepicker-opened]=\"datetimepicker.isOpen\"\n>\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"datetimepicker\"\n    ></kit-input-label>\n  }\n  <div class=\"datetimepicker-wrap\">\n    <button class=\"toggle-btn\" (click)=\"onPopupToggle()\">\n      <kit-svg-icon *ngIf=\"icon\"\n                    class=\"button-icon\"\n                    [icon]=\"icon\"\n      ></kit-svg-icon>\n    </button>\n    <kendo-datetimepicker #datetimepicker\n                          [placeholder]=\"placeholder\"\n                          [format]=\"format\"\n                          [disabled]=\"disabled\"\n                          [popupSettings]=\"datetimepickerPopupSettings\"\n                          [value]=\"defaultDate\"\n                          [min]=\"min\" [max]=\"max\"\n                          [focusedDate]=\"defaultDate\"\n                          (valueChange)=\"onValueChange($event)\"\n                          (blur)=\"onBlur()\"\n                          (close)=\"onClose()\"\n    ></kendo-datetimepicker>\n  </div>\n  <kit-input-message *ngIf=\"messageText\"\n                     [icon]=\"messageIcon\"\n                     [message]=\"messageText\"\n  ></kit-input-message>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}.kit-datetimepicker .label{display:block;margin-bottom:4px}.kit-datetimepicker .datetimepicker-wrap{position:relative}.kit-datetimepicker .k-datetimepicker{padding:4px 8px 4px 28px;height:34px;width:100%;font-size:13px;font-weight:400;color:#002a3a;border-radius:4px;border:1px solid #efefef}.kit-datetimepicker .k-datetimepicker.k-focus{border-color:#00b0ad;box-shadow:none}.kit-datetimepicker .k-dateinput{box-shadow:none}.kit-datetimepicker .k-input-inner{padding:0;line-height:1}.kit-datetimepicker .k-input-inner::placeholder{color:#74777d}.kit-datetimepicker .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-datetimepicker .toggle-btn{position:absolute;top:0;left:0;padding: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;fill:transparent;stroke:#002a3a}.kit-datetimepicker.datetimepicker-opened .toggle-btn .button-icon{stroke:#00b0ad}.kit-datetimepicker:focus-within .k-datetimepicker{color:#27282a}.kit-datetimepicker.datetimepicker-disabled .k-datetimepicker{color:#9a9fa6;border-color:#c1c7d0;background-color:#f3f4f6}.kit-datetimepicker.datetimepicker-disabled .toggle-btn{cursor:default}.kit-datetimepicker.datetimepicker-disabled .toggle-btn .button-icon{stroke:#c1c7d0}.kit-datetimepicker.datetimepicker-invalid .k-datetimepicker{color:#27282a;border-color:#ef3e42;background-color:#f8e0e0}.kit-datetimepicker .k-input-button{display:none}.kit-datetimepicker-popup.k-popup{margin-top:8px;border-radius:6px;border:1px solid #006890;box-shadow:none;background:#f3f4f6}.kit-datetimepicker-popup.k-popup .k-datetime-wrap{width:296px}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup{padding:4px;border-radius:6px 6px 0 0;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button{height:32px;color:#27282a;font-size:13px;font-weight:400;border-radius:6px 6px 0 0;border:1px solid #c1c7d0;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button.k-active{background:#fff}.kit-datetimepicker-popup.k-popup .k-datetime-selector{padding-top:6px;background:none}.kit-datetimepicker-popup.k-popup .kalendar-view{padding:0}.kit-datetimepicker-popup.k-popup .k-datetime-time-wrap,.kit-datetimepicker-popup.k-popup .k-datetime-calendar-wrap{flex-basis:296px}.kit-datetimepicker-popup.k-popup .k-calendar{width:100%;background:none}.kit-datetimepicker-popup.k-popup .k-link{align-items:center;width:100%;height:100%;color:#27282a;font-size:13px;font-weight:500;line-height:1;border-radius:50%;box-shadow:none}.kit-datetimepicker-popup.k-popup .k-link:hover{color:#7ccdf4;background:none}.kit-datetimepicker-popup.k-popup .k-calendar-view{padding:0;width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-view:after{display:none}.kit-datetimepicker-popup.k-popup .k-calendar-view .k-calendar-th{padding:6px 0;height:auto;color:#9a9fa6;font-size:16px;font-weight:700}.kit-datetimepicker-popup.k-popup .k-calendar-view .k-link{width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-table{border-collapse:collapse}.kit-datetimepicker-popup.k-popup .k-calendar-header,.kit-datetimepicker-popup.k-popup .k-time-header{margin:0 0 6px;padding:4px 30px;border-radius:6px 6px 0 0;background:#fff}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-title,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-title{padding:0;color:#27282a;font-size:16px;font-weight:700}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-nav-today,.kit-datetimepicker-popup.k-popup .k-calendar-header .k-time-now,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-nav-today,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{display:flex;align-items:center;padding:0;color:#7ccdf4;font-size:16px;font-weight:400;text-transform:uppercase}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-nav-today:hover,.kit-datetimepicker-popup.k-popup .k-calendar-header .k-time-now:hover,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-nav-today:hover,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover{color:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-weekdays{padding:6px 8px 0}.kit-datetimepicker-popup.k-popup .k-calendar-weekdays .k-calendar-th{padding:0;height:40px;color:#27282a;font-size:13px;font-weight:500;line-height:1;text-transform:uppercase}.kit-datetimepicker-popup.k-popup .k-calendar-content{margin:0;padding:0 8px;box-sizing:border-box}.kit-datetimepicker-popup.k-popup .k-calendar-content>.k-calendar-table{margin:0;width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-td{width:40px;height:40px;border:1px solid #dfdfdf}.kit-datetimepicker-popup.k-popup .k-calendar-td:hover .k-link{background:none}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-empty{border:none}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-today .k-link{color:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-selected .k-link{color:#fff;border:1px solid #dfdfdf;background:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-selected.k-focus .k-link,.kit-datetimepicker-popup.k-popup .k-calendar-td.k-state-focused .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-actions{margin-top:0;padding:12px;justify-content:center;flex-direction:row-reverse;border-top:1px solid #006890}.kit-datetimepicker-popup.k-popup .k-actions .k-button{margin:0 5px;width:110px;height:30px;flex:0 0 auto;font-size:14px;font-weight:400;border-radius:4px;border:none}.kit-datetimepicker-popup.k-popup .k-time-cancel{color:#27282a;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-time-accept{color:#fff;background:#006890}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper{padding:0;height:252px;background:#fff}.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-state-focused{background:#f3f4f6}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper .k-title{display:flex;align-items:center;justify-content:center;margin:0;color:#27282a;font-size:14px;font-weight:500;height:40px}.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:0;height:40px;color:#27282a;font-size:14px;font-weight:500}.kit-datetimepicker-popup.k-popup .k-time-highlight{top:50%;height:40px;border-color:#cdd2d9;transform:none}.kit-datetimepicker-popup.k-popup .k-time-separator{margin-top:20px}\n"] }]
+                        }], template: "<div class=\"kit-datetimepicker\"\n     [class.datetimepicker-disabled]=\"disabled\"\n     [class.datetimepicker-invalid]=\"!isValid\"\n     [class.datetimepicker-opened]=\"datetimepicker.isOpen\"\n>\n  @if (label) {\n    <kit-input-label class=\"label\"\n                     [text]=\"label\"\n                     [for]=\"datetimepicker\"\n    ></kit-input-label>\n  }\n  <div class=\"datetimepicker-wrap\">\n    <button class=\"toggle-btn\" (click)=\"onPopupToggle()\">\n      <kit-svg-icon *ngIf=\"icon\"\n                    class=\"button-icon\"\n                    [icon]=\"icon\"\n      ></kit-svg-icon>\n    </button>\n    <kendo-datetimepicker #datetimepicker\n                          [placeholder]=\"placeholder\"\n                          [format]=\"format\"\n                          [disabled]=\"disabled\"\n                          [popupSettings]=\"datetimepickerPopupSettings\"\n                          [value]=\"defaultDate\"\n                          [min]=\"min\" [max]=\"max\"\n                          [focusedDate]=\"defaultDate\"\n                          (valueChange)=\"onValueChange($event)\"\n                          (blur)=\"onBlur()\"\n                          (close)=\"onClose()\"\n    ></kendo-datetimepicker>\n  </div>\n  <kit-input-message *ngIf=\"messageText\"\n                     [icon]=\"messageIcon\"\n                     [message]=\"messageText\"\n  ></kit-input-message>\n</div>\n", styles: [".display-flex{display:flex}.flex-align-items-center{align-items:center}.flex-justify-content-center{justify-content:center}.flex-justify-content-end{justify-content:flex-end}.display-block{display:block}div[kendowatermarkoverlay]{display:none}.kit-datetimepicker .label{display:block;margin-bottom:4px}.kit-datetimepicker .datetimepicker-wrap{position:relative}.kit-datetimepicker .k-datetimepicker{padding:4px 8px 4px 28px;height:34px;width:100%;font-size:13px;font-weight:400;color:#002a3a;border-radius:4px;border:1px solid #efefef}.kit-datetimepicker .k-datetimepicker.k-focus{border-color:#00b0ad;box-shadow:none}.kit-datetimepicker .k-dateinput{box-shadow:none}.kit-datetimepicker .k-input-inner{padding:0;line-height:1}.kit-datetimepicker .k-input-inner::placeholder{color:#74777d}.kit-datetimepicker .k-input-inner::selection{color:#fff;background:#00b0ad}.kit-datetimepicker .toggle-btn{position:absolute;top:0;left:0;padding: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;fill:transparent;stroke:#002a3a}.kit-datetimepicker.datetimepicker-opened .toggle-btn .button-icon{stroke:#00b0ad}.kit-datetimepicker:focus-within .k-datetimepicker{color:#27282a}.kit-datetimepicker.datetimepicker-disabled .k-datetimepicker{color:#9a9fa6;border-color:#c1c7d0;background-color:#f3f4f6}.kit-datetimepicker.datetimepicker-disabled .toggle-btn{cursor:default}.kit-datetimepicker.datetimepicker-disabled .toggle-btn .button-icon{stroke:#c1c7d0}.kit-datetimepicker.datetimepicker-invalid .k-datetimepicker{color:#27282a;border-color:#ef3e42;background-color:#f8e0e0}.kit-datetimepicker .k-input-button{display:none}.kit-datetimepicker-popup.k-popup{margin-top:8px;border-radius:6px;border:1px solid #006890;box-shadow:none;background:#f3f4f6}.kit-datetimepicker-popup.k-popup .k-datetime-wrap{width:296px}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup{padding:4px;border-radius:6px 6px 0 0;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button{height:32px;color:#27282a;font-size:13px;font-weight:400;border-radius:6px 6px 0 0;border:1px solid #c1c7d0;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-datetime-buttongroup .k-button.k-active{background:#fff}.kit-datetimepicker-popup.k-popup .k-datetime-selector{padding-top:6px;background:none}.kit-datetimepicker-popup.k-popup .kalendar-view{padding:0}.kit-datetimepicker-popup.k-popup .k-datetime-time-wrap,.kit-datetimepicker-popup.k-popup .k-datetime-calendar-wrap{flex-basis:296px}.kit-datetimepicker-popup.k-popup .k-calendar{width:100%;background:none}.kit-datetimepicker-popup.k-popup .k-link{align-items:center;width:100%;height:100%;color:#27282a;font-size:13px;font-weight:500;line-height:1;border-radius:50%;box-shadow:none}.kit-datetimepicker-popup.k-popup .k-link:hover{color:#7ccdf4;background:none}.kit-datetimepicker-popup.k-popup .k-calendar-view{padding:0;width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-view:after{display:none}.kit-datetimepicker-popup.k-popup .k-calendar-view .k-calendar-th{padding:6px 0;height:auto;color:#9a9fa6;font-size:16px;font-weight:700}.kit-datetimepicker-popup.k-popup .k-calendar-view .k-link{width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-table{border-collapse:collapse}.kit-datetimepicker-popup.k-popup .k-calendar-header,.kit-datetimepicker-popup.k-popup .k-time-header{margin:0 0 6px;padding:4px 30px;border-radius:6px 6px 0 0;background:#fff}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-title,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-title{padding:0;color:#27282a;font-size:16px;font-weight:700}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-nav-today,.kit-datetimepicker-popup.k-popup .k-calendar-header .k-time-now,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-nav-today,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now{display:flex;align-items:center;padding:0;color:#7ccdf4;font-size:16px;font-weight:400;text-transform:uppercase}.kit-datetimepicker-popup.k-popup .k-calendar-header .k-calendar-nav-today:hover,.kit-datetimepicker-popup.k-popup .k-calendar-header .k-time-now:hover,.kit-datetimepicker-popup.k-popup .k-time-header .k-calendar-nav-today:hover,.kit-datetimepicker-popup.k-popup .k-time-header .k-time-now:hover{color:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-weekdays{padding:6px 8px 0}.kit-datetimepicker-popup.k-popup .k-calendar-weekdays .k-calendar-th{padding:0;height:40px;color:#27282a;font-size:13px;font-weight:500;line-height:1;text-transform:uppercase}.kit-datetimepicker-popup.k-popup .k-calendar-content{margin:0;padding:0 8px;box-sizing:border-box}.kit-datetimepicker-popup.k-popup .k-calendar-content>.k-calendar-table{margin:0;width:100%}.kit-datetimepicker-popup.k-popup .k-calendar-td{width:40px;height:40px;border:1px solid #dfdfdf}.kit-datetimepicker-popup.k-popup .k-calendar-td:hover .k-link{background:none}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-empty{border:none}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-today .k-link{color:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-selected .k-link{color:#fff;border:1px solid #dfdfdf;background:#7ccdf4}.kit-datetimepicker-popup.k-popup .k-calendar-td.k-selected.k-focus .k-link,.kit-datetimepicker-popup.k-popup .k-calendar-td.k-state-focused .k-link{box-shadow:none}.kit-datetimepicker-popup.k-popup .k-actions{margin-top:0;padding:12px;justify-content:center;flex-direction:row-reverse;border-top:1px solid #006890}.kit-datetimepicker-popup.k-popup .k-actions .k-button{margin:0 5px;width:110px;height:30px;flex:0 0 auto;font-size:14px;font-weight:400;border-radius:4px;border:none}.kit-datetimepicker-popup.k-popup .k-time-cancel{color:#27282a;background:#dadde3}.kit-datetimepicker-popup.k-popup .k-time-accept{color:#fff;background:#006890}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper{padding:0;height:252px;background:#fff}.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-state-focused{background:#f3f4f6}.kit-datetimepicker-popup.k-popup .k-time-list-wrapper .k-title{display:flex;align-items:center;justify-content:center;margin:0;color:#27282a;font-size:14px;font-weight:500;height:40px}.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:0;height:40px;color:#27282a;font-size:14px;font-weight:500}.kit-datetimepicker-popup.k-popup .k-time-highlight{top:50%;height:40px;border-color:#cdd2d9;transform:none}.kit-datetimepicker-popup.k-popup .k-time-separator{margin-top:20px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
                 type: Input
             }], placeholder: [{

package/esm2022/lib/components/kit-grid/kit-grid-column/kit-grid-column.component.mjs ADDED Viewed

@@ -0,0 +1,49 @@
+import { ChangeDetectionStrategy, Component, ContentChild, Input } from '@angular/core';
+import { KitSvgIconType } from '../../kit-svg-icon/kit-svg-icon.const';
+import * as i0 from "@angular/core";
+export class KitGridColumnComponent {
+    constructor() {
+        /**
+         * Defines the field to which the column is bound
+         */
+        this.field = '';
+        /**
+         * Defines the title of the column
+         */
+        this.title = '';
+        /**
+         * Defines the column title icon type
+         */
+        this.titleIconType = KitSvgIconType.FILL;
+        /**
+         * Defines whether the column can be sorted by clicking on its title
+         */
+        this.sortable = true;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitGridColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.7", type: KitGridColumnComponent, selector: "kit-grid-column", inputs: { field: "field", title: "title", titleIcon: "titleIcon", titleIconType: "titleIconType", sortable: "sortable", width: "width" }, queries: [{ propertyName: "cellTemplate", first: true, predicate: ["kitGridCellTemplate"], descendants: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitGridColumnComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kit-grid-column',
+                    template: '',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { field: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], titleIcon: [{
+                type: Input
+            }], titleIconType: [{
+                type: Input
+            }], sortable: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], cellTemplate: [{
+                type: ContentChild,
+                args: ['kitGridCellTemplate']
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoia2l0LWdyaWQtY29sdW1uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3VpLWtpdC9zcmMvbGliL2NvbXBvbmVudHMva2l0LWdyaWQva2l0LWdyaWQtY29sdW1uL2tpdC1ncmlkLWNvbHVtbi5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFlLE1BQU0sZUFBZSxDQUFDO0FBQ3JHLE9BQU8sRUFBYyxjQUFjLEVBQUUsTUFBTSx1Q0FBdUMsQ0FBQzs7QUFPbkYsTUFBTSxPQUFPLHNCQUFzQjtJQUxuQztRQU1FOztXQUVHO1FBQ00sVUFBSyxHQUFXLEVBQUUsQ0FBQztRQUU1Qjs7V0FFRztRQUNNLFVBQUssR0FBVyxFQUFFLENBQUM7UUFPNUI7O1dBRUc7UUFDTSxrQkFBYSxHQUFtQixjQUFjLENBQUMsSUFBSSxDQUFDO1FBRTdEOztXQUVHO1FBQ00sYUFBUSxHQUFZLElBQUksQ0FBQztLQVduQzs4R0FuQ1ksc0JBQXNCO2tHQUF0QixzQkFBc0Isa1RBSHZCLEVBQUU7OzJGQUdELHNCQUFzQjtrQkFMbEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsaUJBQWlCO29CQUMzQixRQUFRLEVBQUUsRUFBRTtvQkFDWixlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTtpQkFDaEQ7OEJBS1UsS0FBSztzQkFBYixLQUFLO2dCQUtHLEtBQUs7c0JBQWIsS0FBSztnQkFLRyxTQUFTO3NCQUFqQixLQUFLO2dCQUtHLGFBQWE7c0JBQXJCLEtBQUs7Z0JBS0csUUFBUTtzQkFBaEIsS0FBSztnQkFLRyxLQUFLO3NCQUFiLEtBQUs7Z0JBSytCLFlBQVk7c0JBQWhELFlBQVk7dUJBQUMscUJBQXFCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgQ29udGVudENoaWxkLCBJbnB1dCwgVGVtcGxhdGVSZWYgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEtpdFN2Z0ljb24sIEtpdFN2Z0ljb25UeXBlIH0gZnJvbSAnLi4vLi4va2l0LXN2Zy1pY29uL2tpdC1zdmctaWNvbi5jb25zdCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2tpdC1ncmlkLWNvbHVtbicsXG4gIHRlbXBsYXRlOiAnJyxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIEtpdEdyaWRDb2x1bW5Db21wb25lbnQge1xuICAvKipcbiAgICogRGVmaW5lcyB0aGUgZmllbGQgdG8gd2hpY2ggdGhlIGNvbHVtbiBpcyBib3VuZFxuICAgKi9cbiAgQElucHV0KCkgZmllbGQ6IHN0cmluZyA9ICcnO1xuXG4gIC8qKlxuICAgKiBEZWZpbmVzIHRoZSB0aXRsZSBvZiB0aGUgY29sdW1uXG4gICAqL1xuICBASW5wdXQoKSB0aXRsZTogc3RyaW5nID0gJyc7XG5cbiAgLyoqXG4gICAqIERlZmluZXMgdGhlIGNvbHVtbiB0aXRsZSBpY29uXG4gICAqL1xuICBASW5wdXQoKSB0aXRsZUljb24/OiBLaXRTdmdJY29uO1xuXG4gIC8qKlxuICAgKiBEZWZpbmVzIHRoZSBjb2x1bW4gdGl0bGUgaWNvbiB0eXBlXG4gICAqL1xuICBASW5wdXQoKSB0aXRsZUljb25UeXBlOiBLaXRTdmdJY29uVHlwZSA9IEtpdFN2Z0ljb25UeXBlLkZJTEw7XG5cbiAgLyoqXG4gICAqIERlZmluZXMgd2hldGhlciB0aGUgY29sdW1uIGNhbiBiZSBzb3J0ZWQgYnkgY2xpY2tpbmcgb24gaXRzIHRpdGxlXG4gICAqL1xuICBASW5wdXQoKSBzb3J0YWJsZTogYm9vbGVhbiA9IHRydWU7XG5cbiAgLyoqXG4gICAqIERlZmluZXMgdGhlIHdpZHRoIG9mIHRoZSBjb2x1bW4gKGluIHBpeGVscylcbiAgICovXG4gIEBJbnB1dCgpIHdpZHRoPzogbnVtYmVyO1xuXG4gIC8qKlxuICAgKiBEZWZpbmVzIHRoZSBjb2x1bW4gY2VsbCB0ZW1wbGF0ZVxuICAgKi9cbiAgQENvbnRlbnRDaGlsZCgna2l0R3JpZENlbGxUZW1wbGF0ZScpIGNlbGxUZW1wbGF0ZT86IFRlbXBsYXRlUmVmPEhUTUxFbGVtZW50Pjtcbn1cbiJdfQ==