design-angular-kit 1.0.3 → 1.1.1

package/esm2022/lib/components/form/upload-drag-drop/upload-drag-drop.component.mjs

@@ -116,10 +116,10 @@ export class ItUploadDragDropComponent extends ItAbstractComponent {
         this.donut?.set(0);
         this._changeDetectorRef.detectChanges();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItUploadDragDropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItUploadDragDropComponent, isStandalone: true, selector: "it-upload-drag-drop", inputs: { accept: "accept" }, outputs: { fileStartUpload: "fileStartUpload" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" } }, viewQueries: [{ propertyName: "donutElement", first: true, predicate: ["donutElement"], descendants: true }], exportAs: ["itUploadDragDrop"], usesInheritance: true, ngImport: i0, template: "<div class=\"upload-dragdrop\" [class.dragover]=\"isDragover\" [class.loading]=\"isLoading\" [class.success]=\"isSuccess\">\n  <div class=\"upload-dragdrop-image\">\n    <img\n      [ngSrc]=\"assetBasePath + '/dist/assets/upload-drag-drop-icon.svg'\"\n      alt=\"drag-drop-icon\"\n      aria-hidden=\"true\"\n      [width]=\"180\"\n      [height]=\"180\" />\n    <div class=\"upload-dragdrop-loading\">\n      <div class=\"progress-donut\" #donutElement></div>\n    </div>\n    <div class=\"upload-dragdrop-success\">\n      <it-icon name=\"check\"></it-icon>\n    </div>\n  </div>\n  <div class=\"upload-dragdrop-text\">\n    <p class=\"upload-dragdrop-weight\">\n      <it-icon name=\"file\" size=\"xs\"></it-icon>\n      {{ extension }} ({{ fileSize }})\n    </p>\n    <h5>{{ filename || ('it.form.upload-drag-file' | translate) }}</h5>\n    @if (isLoading) {\n      <p>{{ 'it.form.upload-loading' | translate }}</p>\n    }\n    @if (isSuccess) {\n      <p>{{ 'it.form.upload-complete' | translate }}</p>\n    }\n    @if (!isLoading && !isSuccess) {\n      <p>\n        {{ 'it.form.upload-or' | translate }}\n        <input type=\"file\" [id]=\"id\" class=\"upload-dragdrop-input\" [accept]=\"accept\" (change)=\"onLoadFile($event)\" />\n        <label [for]=\"id\">{{ 'it.form.upload-select-device' | translate }}</label>\n      </p>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItUploadDragDropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItUploadDragDropComponent, isStandalone: true, selector: "it-upload-drag-drop", inputs: { accept: "accept" }, outputs: { fileStartUpload: "fileStartUpload" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" } }, viewQueries: [{ propertyName: "donutElement", first: true, predicate: ["donutElement"], descendants: true }], exportAs: ["itUploadDragDrop"], usesInheritance: true, ngImport: i0, template: "<div class=\"upload-dragdrop\" [class.dragover]=\"isDragover\" [class.loading]=\"isLoading\" [class.success]=\"isSuccess\">\n  <div class=\"upload-dragdrop-image\">\n    <img\n      [ngSrc]=\"assetBasePath + '/dist/assets/upload-drag-drop-icon.svg'\"\n      alt=\"drag-drop-icon\"\n      aria-hidden=\"true\"\n      [width]=\"180\"\n      [height]=\"180\" />\n    <div class=\"upload-dragdrop-loading\">\n      <div class=\"progress-donut\" #donutElement></div>\n    </div>\n    <div class=\"upload-dragdrop-success\">\n      <it-icon name=\"check\"></it-icon>\n    </div>\n  </div>\n  <div class=\"upload-dragdrop-text\">\n    <p class=\"upload-dragdrop-weight\">\n      <it-icon name=\"file\" size=\"xs\"></it-icon>\n      {{ extension }} ({{ fileSize }})\n    </p>\n    <h5>{{ filename || ('it.form.upload-drag-file' | translate) }}</h5>\n    @if (isLoading) {\n      <p>{{ 'it.form.upload-loading' | translate }}</p>\n    }\n    @if (isSuccess) {\n      <p>{{ 'it.form.upload-complete' | translate }}</p>\n    }\n    @if (!isLoading && !isSuccess) {\n      <p>\n        {{ 'it.form.upload-or' | translate }}\n        <input type=\"file\" [id]=\"id\" class=\"upload-dragdrop-input\" [accept]=\"accept\" (change)=\"onLoadFile($event)\" />\n        <label [for]=\"id\">{{ 'it.form.upload-select-device' | translate }}</label>\n      </p>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItUploadDragDropComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItUploadDragDropComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-upload-drag-drop', exportAs: 'itUploadDragDrop', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ItIconComponent, TranslateModule, NgOptimizedImage], template: "<div class=\"upload-dragdrop\" [class.dragover]=\"isDragover\" [class.loading]=\"isLoading\" [class.success]=\"isSuccess\">\n  <div class=\"upload-dragdrop-image\">\n    <img\n      [ngSrc]=\"assetBasePath + '/dist/assets/upload-drag-drop-icon.svg'\"\n      alt=\"drag-drop-icon\"\n      aria-hidden=\"true\"\n      [width]=\"180\"\n      [height]=\"180\" />\n    <div class=\"upload-dragdrop-loading\">\n      <div class=\"progress-donut\" #donutElement></div>\n    </div>\n    <div class=\"upload-dragdrop-success\">\n      <it-icon name=\"check\"></it-icon>\n    </div>\n  </div>\n  <div class=\"upload-dragdrop-text\">\n    <p class=\"upload-dragdrop-weight\">\n      <it-icon name=\"file\" size=\"xs\"></it-icon>\n      {{ extension }} ({{ fileSize }})\n    </p>\n    <h5>{{ filename || ('it.form.upload-drag-file' | translate) }}</h5>\n    @if (isLoading) {\n      <p>{{ 'it.form.upload-loading' | translate }}</p>\n    }\n    @if (isSuccess) {\n      <p>{{ 'it.form.upload-complete' | translate }}</p>\n    }\n    @if (!isLoading && !isSuccess) {\n      <p>\n        {{ 'it.form.upload-or' | translate }}\n        <input type=\"file\" [id]=\"id\" class=\"upload-dragdrop-input\" [accept]=\"accept\" (change)=\"onLoadFile($event)\" />\n        <label [for]=\"id\">{{ 'it.form.upload-select-device' | translate }}</label>\n      </p>\n    }\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { accept: [{

package/esm2022/lib/components/form/upload-file-list/upload-file-list.component.mjs

@@ -79,10 +79,10 @@ export class ItUploadFileListComponent extends ItAbstractComponent {
     getFileSize(file) {
         return ItFileUtils.getFileSizeString(file);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItUploadFileListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItUploadFileListComponent, isStandalone: true, selector: "it-upload-file-list", inputs: { fileList: "fileList", accept: "accept", multiple: ["multiple", "multiple", inputToBoolean], images: ["images", "images", inputToBoolean], hideLoadButton: ["hideLoadButton", "hideLoadButton", inputToBoolean] }, outputs: { uploadFiles: "uploadFiles", deleteItem: "deleteItem" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (!hideLoadButton) {\n  <input type=\"file\" [id]=\"id\" class=\"upload\" [accept]=\"accept\" [multiple]=\"multiple\" (change)=\"onLoadFiles($event)\" />\n  <label [for]=\"id\">\n    <it-icon name=\"upload\" size=\"sm\"></it-icon>\n    <span>{{ 'it.form.upload' | translate }}</span>\n  </label>\n}\n\n@if (fileList.length) {\n  <ul class=\"upload-file-list\" [class.upload-file-list-image]=\"images\">\n    @for (item of fileList; track item.id) {\n      <li\n        class=\"upload-file\"\n        [class.error]=\"item.error\"\n        [class.uploading]=\"!item.error && item.progress !== undefined && item.progress > 0 && item.progress < 100\"\n        [class.success]=\"!item.error && (!item.progress || item.progress >= 100)\">\n        @if (images) {\n          <div class=\"upload-image\">\n            <img [attr.src]=\"previewImages.get(item.id)\" [alt]=\"item.file.name\" />\n          </div>\n        } @else {\n          <it-icon name=\"file\" size=\"sm\" [color]=\"!item.error ? (item.progress ? 'secondary' : 'primary') : 'danger'\"></it-icon>\n        }\n        <p [itTooltip]=\"item.tooltip\">\n          <span class=\"visually-hidden\">{{ 'it.form.uploaded-file' | translate: { name: item.file.name } }}</span>\n          {{ item.file.name }} <span class=\"upload-file-weight\">{{ getFileSize(item.file) }}</span>\n        </p>\n        @if (item.removable && (!item.progress || item.progress < 100)) {\n          <button type=\"button\" (click)=\"deleteItem.emit(item)\">\n            <span class=\"visually-hidden\">{{ 'it.form.delete-file' | translate: { name: item.file.name } }}</span>\n            <it-icon name=\"close\"></it-icon>\n          </button>\n        }\n        @if ((!item.removable && !item.progress) || (item.progress !== undefined && item.progress >= 100)) {\n          <button type=\"button\" disabled>\n            <span class=\"visually-hidden\">{{ 'it.form.upload-complete' | translate }}</span>\n            <it-icon name=\"check\"></it-icon>\n          </button>\n        }\n        @if (!item.error && item.progress !== undefined && item.progress > 0 && item.progress < 100) {\n          <it-progress-bar [value]=\"item.progress!\"></it-progress-bar>\n        }\n      </li>\n    }\n  </ul>\n}\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: ItTooltipDirective, selector: "[itTooltip]", inputs: ["itTooltip", "tooltipPlacement", "tooltipHtml"], outputs: ["showEvent", "shownEvent", "hideEvent", "hiddenEvent", "insertedEvent"], exportAs: ["itTooltip"] }, { kind: "component", type: ItProgressBarComponent, selector: "it-progress-bar", inputs: ["value", "showLabel", "indeterminate", "color"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItUploadFileListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItUploadFileListComponent, isStandalone: true, selector: "it-upload-file-list", inputs: { fileList: "fileList", accept: "accept", multiple: ["multiple", "multiple", inputToBoolean], images: ["images", "images", inputToBoolean], hideLoadButton: ["hideLoadButton", "hideLoadButton", inputToBoolean] }, outputs: { uploadFiles: "uploadFiles", deleteItem: "deleteItem" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (!hideLoadButton) {\n  <input type=\"file\" [id]=\"id\" class=\"upload\" [accept]=\"accept\" [multiple]=\"multiple\" (change)=\"onLoadFiles($event)\" />\n  <label [for]=\"id\">\n    <it-icon name=\"upload\" size=\"sm\"></it-icon>\n    <span>{{ 'it.form.upload' | translate }}</span>\n  </label>\n}\n\n@if (fileList.length) {\n  <ul class=\"upload-file-list\" [class.upload-file-list-image]=\"images\">\n    @for (item of fileList; track item.id) {\n      <li\n        class=\"upload-file\"\n        [class.error]=\"item.error\"\n        [class.uploading]=\"!item.error && item.progress !== undefined && item.progress > 0 && item.progress < 100\"\n        [class.success]=\"!item.error && (!item.progress || item.progress >= 100)\">\n        @if (images) {\n          <div class=\"upload-image\">\n            <img [attr.src]=\"previewImages.get(item.id)\" [alt]=\"item.file.name\" />\n          </div>\n        } @else {\n          <it-icon name=\"file\" size=\"sm\" [color]=\"!item.error ? (item.progress ? 'secondary' : 'primary') : 'danger'\"></it-icon>\n        }\n        <p [itTooltip]=\"item.tooltip\">\n          <span class=\"visually-hidden\">{{ 'it.form.uploaded-file' | translate: { name: item.file.name } }}</span>\n          {{ item.file.name }} <span class=\"upload-file-weight\">{{ getFileSize(item.file) }}</span>\n        </p>\n        @if (item.removable && (!item.progress || item.progress < 100)) {\n          <button type=\"button\" (click)=\"deleteItem.emit(item)\">\n            <span class=\"visually-hidden\">{{ 'it.form.delete-file' | translate: { name: item.file.name } }}</span>\n            <it-icon name=\"close\"></it-icon>\n          </button>\n        }\n        @if ((!item.removable && !item.progress) || (item.progress !== undefined && item.progress >= 100)) {\n          <button type=\"button\" disabled>\n            <span class=\"visually-hidden\">{{ 'it.form.upload-complete' | translate }}</span>\n            <it-icon name=\"check\"></it-icon>\n          </button>\n        }\n        @if (!item.error && item.progress !== undefined && item.progress > 0 && item.progress < 100) {\n          <it-progress-bar [value]=\"item.progress!\"></it-progress-bar>\n        }\n      </li>\n    }\n  </ul>\n}\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: ItTooltipDirective, selector: "[itTooltip]", inputs: ["itTooltip", "tooltipPlacement", "tooltipHtml"], outputs: ["showEvent", "shownEvent", "hideEvent", "hiddenEvent", "insertedEvent"], exportAs: ["itTooltip"] }, { kind: "component", type: ItProgressBarComponent, selector: "it-progress-bar", inputs: ["value", "showLabel", "indeterminate", "color"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItUploadFileListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItUploadFileListComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-upload-file-list', imports: [ItIconComponent, TranslateModule, ItTooltipDirective, ItProgressBarComponent], template: "@if (!hideLoadButton) {\n  <input type=\"file\" [id]=\"id\" class=\"upload\" [accept]=\"accept\" [multiple]=\"multiple\" (change)=\"onLoadFiles($event)\" />\n  <label [for]=\"id\">\n    <it-icon name=\"upload\" size=\"sm\"></it-icon>\n    <span>{{ 'it.form.upload' | translate }}</span>\n  </label>\n}\n\n@if (fileList.length) {\n  <ul class=\"upload-file-list\" [class.upload-file-list-image]=\"images\">\n    @for (item of fileList; track item.id) {\n      <li\n        class=\"upload-file\"\n        [class.error]=\"item.error\"\n        [class.uploading]=\"!item.error && item.progress !== undefined && item.progress > 0 && item.progress < 100\"\n        [class.success]=\"!item.error && (!item.progress || item.progress >= 100)\">\n        @if (images) {\n          <div class=\"upload-image\">\n            <img [attr.src]=\"previewImages.get(item.id)\" [alt]=\"item.file.name\" />\n          </div>\n        } @else {\n          <it-icon name=\"file\" size=\"sm\" [color]=\"!item.error ? (item.progress ? 'secondary' : 'primary') : 'danger'\"></it-icon>\n        }\n        <p [itTooltip]=\"item.tooltip\">\n          <span class=\"visually-hidden\">{{ 'it.form.uploaded-file' | translate: { name: item.file.name } }}</span>\n          {{ item.file.name }} <span class=\"upload-file-weight\">{{ getFileSize(item.file) }}</span>\n        </p>\n        @if (item.removable && (!item.progress || item.progress < 100)) {\n          <button type=\"button\" (click)=\"deleteItem.emit(item)\">\n            <span class=\"visually-hidden\">{{ 'it.form.delete-file' | translate: { name: item.file.name } }}</span>\n            <it-icon name=\"close\"></it-icon>\n          </button>\n        }\n        @if ((!item.removable && !item.progress) || (item.progress !== undefined && item.progress >= 100)) {\n          <button type=\"button\" disabled>\n            <span class=\"visually-hidden\">{{ 'it.form.upload-complete' | translate }}</span>\n            <it-icon name=\"check\"></it-icon>\n          </button>\n        }\n        @if (!item.error && item.progress !== undefined && item.progress > 0 && item.progress < 100) {\n          <it-progress-bar [value]=\"item.progress!\"></it-progress-bar>\n        }\n      </li>\n    }\n  </ul>\n}\n" }]
         }], propDecorators: { fileList: [{

package/esm2022/lib/components/navigation/back-button/back-button.component.mjs

@@ -45,10 +45,10 @@ export class ItBackButtonComponent {
         }
         this._location.back();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBackButtonComponent, deps: [{ token: i1.Location }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItBackButtonComponent, isStandalone: true, selector: "it-back-button", inputs: { buttonStyle: "buttonStyle", direction: "direction", showIcon: ["showIcon", "showIcon", inputToBoolean], showText: ["showText", "showText", inputToBoolean], backFn: "backFn" }, exportAs: ["itBackButton"], ngImport: i0, template: "@if (buttonStyle === 'link') {\n  <a href=\"#\" class=\"go-back\" (click)=\"goBack($event)\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n}\n\n@if (buttonStyle === 'button') {\n  <button itButton=\"primary\" class=\"go-back\" (click)=\"goBack($event)\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </button>\n}\n\n<ng-template #content>\n  @if (showIcon) {\n    <it-icon\n      size=\"sm\"\n      [name]=\"direction === 'left' ? 'arrow-left' : 'arrow-up'\"\n      [color]=\"buttonStyle === 'link' ? 'primary' : 'white'\"\n      [class.me-2]=\"showText\"></it-icon>\n  }\n\n  <span [class.visually-hidden]=\"!showText\">\n    {{ (direction === 'left' ? 'it.navigation.go-back' : 'it.navigation.upper-level') | translate }}\n  </span>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ItButtonDirective, selector: "[itButton]", inputs: ["itButton", "size", "block", "disabled", "type"], exportAs: ["itButton"] }, { kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBackButtonComponent, deps: [{ token: i1.Location }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItBackButtonComponent, isStandalone: true, selector: "it-back-button", inputs: { buttonStyle: "buttonStyle", direction: "direction", showIcon: ["showIcon", "showIcon", inputToBoolean], showText: ["showText", "showText", inputToBoolean], backFn: "backFn" }, exportAs: ["itBackButton"], ngImport: i0, template: "@if (buttonStyle === 'link') {\n  <a href=\"#\" class=\"go-back\" (click)=\"goBack($event)\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n}\n\n@if (buttonStyle === 'button') {\n  <button itButton=\"primary\" class=\"go-back\" (click)=\"goBack($event)\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </button>\n}\n\n<ng-template #content>\n  @if (showIcon) {\n    <it-icon\n      size=\"sm\"\n      [name]=\"direction === 'left' ? 'arrow-left' : 'arrow-up'\"\n      [color]=\"buttonStyle === 'link' ? 'primary' : 'white'\"\n      [class.me-2]=\"showText\"></it-icon>\n  }\n\n  <span [class.visually-hidden]=\"!showText\">\n    {{ (direction === 'left' ? 'it.navigation.go-back' : 'it.navigation.upper-level') | translate }}\n  </span>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ItButtonDirective, selector: "[itButton]", inputs: ["itButton", "size", "block", "disabled", "type"], exportAs: ["itButton"] }, { kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBackButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBackButtonComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-back-button', exportAs: 'itBackButton', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, ItButtonDirective, ItIconComponent, TranslateModule], template: "@if (buttonStyle === 'link') {\n  <a href=\"#\" class=\"go-back\" (click)=\"goBack($event)\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n}\n\n@if (buttonStyle === 'button') {\n  <button itButton=\"primary\" class=\"go-back\" (click)=\"goBack($event)\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </button>\n}\n\n<ng-template #content>\n  @if (showIcon) {\n    <it-icon\n      size=\"sm\"\n      [name]=\"direction === 'left' ? 'arrow-left' : 'arrow-up'\"\n      [color]=\"buttonStyle === 'link' ? 'primary' : 'white'\"\n      [class.me-2]=\"showText\"></it-icon>\n  }\n\n  <span [class.visually-hidden]=\"!showText\">\n    {{ (direction === 'left' ? 'it.navigation.go-back' : 'it.navigation.upper-level') | translate }}\n  </span>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: i1.Location }], propDecorators: { buttonStyle: [{

package/esm2022/lib/components/navigation/back-to-top/back-to-top.component.mjs

@@ -36,10 +36,10 @@ export class ItBackToTopComponent extends ItAbstractComponent {
     dispose() {
         this.backToTop?.dispose();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBackToTopComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.1.2", type: ItBackToTopComponent, isStandalone: true, selector: "it-back-to-top", inputs: { small: ["small", "small", inputToBoolean], shadow: ["shadow", "shadow", inputToBoolean], dark: ["dark", "dark", inputToBoolean] }, viewQueries: [{ propertyName: "backToTopElement", first: true, predicate: ["backToTop"], descendants: true }], exportAs: ["itBackToTop"], usesInheritance: true, ngImport: i0, template: "<a\n  #backToTop\n  [id]=\"id\"\n  href=\"#\"\n  aria-hidden=\"true\"\n  class=\"back-to-top\"\n  [class.back-to-top-small]=\"small\"\n  [class.shadow]=\"shadow\"\n  [class.dark]=\"dark\">\n  <it-icon name=\"arrow-up\" [color]=\"dark ? 'secondary' : 'light'\"></it-icon>\n</a>\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBackToTopComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.6", type: ItBackToTopComponent, isStandalone: true, selector: "it-back-to-top", inputs: { small: ["small", "small", inputToBoolean], shadow: ["shadow", "shadow", inputToBoolean], dark: ["dark", "dark", inputToBoolean] }, viewQueries: [{ propertyName: "backToTopElement", first: true, predicate: ["backToTop"], descendants: true }], exportAs: ["itBackToTop"], usesInheritance: true, ngImport: i0, template: "<a\n  #backToTop\n  [id]=\"id\"\n  href=\"#\"\n  aria-hidden=\"true\"\n  class=\"back-to-top\"\n  [class.back-to-top-small]=\"small\"\n  [class.shadow]=\"shadow\"\n  [class.dark]=\"dark\">\n  <it-icon name=\"arrow-up\" [color]=\"dark ? 'secondary' : 'light'\"></it-icon>\n</a>\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBackToTopComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBackToTopComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-back-to-top', exportAs: 'itBackToTop', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ItIconComponent], template: "<a\n  #backToTop\n  [id]=\"id\"\n  href=\"#\"\n  aria-hidden=\"true\"\n  class=\"back-to-top\"\n  [class.back-to-top-small]=\"small\"\n  [class.shadow]=\"shadow\"\n  [class.dark]=\"dark\">\n  <it-icon name=\"arrow-up\" [color]=\"dark ? 'secondary' : 'light'\"></it-icon>\n</a>\n" }]
         }], propDecorators: { small: [{

package/esm2022/lib/components/navigation/breadcrumbs/breadcrumb/breadcrumb.component.mjs

@@ -33,10 +33,10 @@ export class ItBreadcrumbComponent {
     ngOnDestroy() {
         this.itemSubscriptions?.forEach(item => item.unsubscribe());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBreadcrumbComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItBreadcrumbComponent, isStandalone: true, selector: "it-breadcrumb", inputs: { separator: "separator", dark: ["dark", "dark", inputToBoolean] }, queries: [{ propertyName: "items", predicate: ItBreadcrumbItemComponent }], ngImport: i0, template: "<nav class=\"breadcrumb-container\" [attr.aria-label]=\"'it.navigation.navigation-path' | translate\">\n  @if (items) {\n    <ol class=\"breadcrumb\" [class.dark]=\"dark\" [class.px-3]=\"dark\">\n      @for (item of items; track item; let isLast = $last) {\n        <li class=\"breadcrumb-item\" [class.active]=\"item.active\" [attr.aria-current]=\"item.active ? 'page' : null\">\n          @if (item.iconName) {\n            <it-icon [name]=\"item.iconName\" [color]=\"dark ? 'white' : 'secondary'\" size=\"sm\" svgClass=\"align-top me-1\"></it-icon>\n          }\n          @if (!item.active && !isLast) {\n            <it-link [href]=\"item.href\" [class]=\"item.class\" [externalLink]=\"item.externalLink\" [disabled]=\"item.disabled\">\n              <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n            </it-link>\n          } @else {\n            <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n          }\n          @if (!isLast) {\n            <span class=\"separator\">{{ separator }}</span>\n          }\n        </li>\n      }\n    </ol>\n  }\n</nav>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "component", type: ItLinkComponent, selector: "it-link", inputs: ["href", "externalLink", "disabled", "class"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBreadcrumbComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItBreadcrumbComponent, isStandalone: true, selector: "it-breadcrumb", inputs: { separator: "separator", dark: ["dark", "dark", inputToBoolean] }, queries: [{ propertyName: "items", predicate: ItBreadcrumbItemComponent }], ngImport: i0, template: "<nav class=\"breadcrumb-container\" [attr.aria-label]=\"'it.navigation.navigation-path' | translate\">\n  @if (items) {\n    <ol class=\"breadcrumb\" [class.dark]=\"dark\" [class.px-3]=\"dark\">\n      @for (item of items; track item; let isLast = $last) {\n        <li class=\"breadcrumb-item\" [class.active]=\"item.active\" [attr.aria-current]=\"item.active ? 'page' : null\">\n          @if (item.iconName) {\n            <it-icon [name]=\"item.iconName\" [color]=\"dark ? 'white' : 'secondary'\" size=\"sm\" svgClass=\"align-top me-1\"></it-icon>\n          }\n          @if (!item.active && !isLast) {\n            <it-link [href]=\"item.href\" [class]=\"item.class\" [externalLink]=\"item.externalLink\" [disabled]=\"item.disabled\">\n              <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n            </it-link>\n          } @else {\n            <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n          }\n          @if (!isLast) {\n            <span class=\"separator\">{{ separator }}</span>\n          }\n        </li>\n      }\n    </ol>\n  }\n</nav>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "component", type: ItLinkComponent, selector: "it-link", inputs: ["href", "externalLink", "disabled", "class"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBreadcrumbComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBreadcrumbComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule, ItIconComponent, ItLinkComponent, NgTemplateOutlet], template: "<nav class=\"breadcrumb-container\" [attr.aria-label]=\"'it.navigation.navigation-path' | translate\">\n  @if (items) {\n    <ol class=\"breadcrumb\" [class.dark]=\"dark\" [class.px-3]=\"dark\">\n      @for (item of items; track item; let isLast = $last) {\n        <li class=\"breadcrumb-item\" [class.active]=\"item.active\" [attr.aria-current]=\"item.active ? 'page' : null\">\n          @if (item.iconName) {\n            <it-icon [name]=\"item.iconName\" [color]=\"dark ? 'white' : 'secondary'\" size=\"sm\" svgClass=\"align-top me-1\"></it-icon>\n          }\n          @if (!item.active && !isLast) {\n            <it-link [href]=\"item.href\" [class]=\"item.class\" [externalLink]=\"item.externalLink\" [disabled]=\"item.disabled\">\n              <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n            </it-link>\n          } @else {\n            <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n          }\n          @if (!isLast) {\n            <span class=\"separator\">{{ separator }}</span>\n          }\n        </li>\n      }\n    </ol>\n  }\n</nav>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { separator: [{

package/esm2022/lib/components/navigation/breadcrumbs/breadcrumb-item/breadcrumb-item.component.mjs

@@ -3,10 +3,10 @@ import { ItLinkComponent } from '../../../core/link/link.component';
 import { inputToBoolean } from '../../../../utils/coercion';
 import * as i0 from "@angular/core";
 export class ItBreadcrumbItemComponent extends ItLinkComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBreadcrumbItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.1.2", type: ItBreadcrumbItemComponent, isStandalone: true, selector: "it-breadcrumb-item", inputs: { active: ["active", "active", inputToBoolean], iconName: "iconName" }, viewQueries: [{ propertyName: "htmlContent", first: true, predicate: TemplateRef, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template>\n  <ng-content></ng-content>\n</ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBreadcrumbItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.6", type: ItBreadcrumbItemComponent, isStandalone: true, selector: "it-breadcrumb-item", inputs: { active: ["active", "active", inputToBoolean], iconName: "iconName" }, viewQueries: [{ propertyName: "htmlContent", first: true, predicate: TemplateRef, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template>\n  <ng-content></ng-content>\n</ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBreadcrumbItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBreadcrumbItemComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-breadcrumb-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<ng-template>\n  <ng-content></ng-content>\n</ng-template>\n" }]
         }], propDecorators: { active: [{

package/esm2022/lib/components/navigation/breadcrumbs/breadcrumbs.module.mjs

@@ -4,11 +4,11 @@ import { ItBreadcrumbItemComponent } from './breadcrumb-item/breadcrumb-item.com
 import * as i0 from "@angular/core";
 const breadcrumb = [ItBreadcrumbComponent, ItBreadcrumbItemComponent];
 export class ItBreadcrumbsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBreadcrumbsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.2", ngImport: i0, type: ItBreadcrumbsModule, imports: [ItBreadcrumbComponent, ItBreadcrumbItemComponent], exports: [ItBreadcrumbComponent, ItBreadcrumbItemComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBreadcrumbsModule, imports: [ItBreadcrumbComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBreadcrumbsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.6", ngImport: i0, type: ItBreadcrumbsModule, imports: [ItBreadcrumbComponent, ItBreadcrumbItemComponent], exports: [ItBreadcrumbComponent, ItBreadcrumbItemComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBreadcrumbsModule, imports: [ItBreadcrumbComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItBreadcrumbsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItBreadcrumbsModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: breadcrumb,

package/esm2022/lib/components/navigation/header/header.component.mjs

@@ -50,10 +50,10 @@ export class ItHeaderComponent {
     toggleCollapse() {
         this.itNavBarComponent?.toggleCollapse();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItHeaderComponent, isStandalone: true, selector: "it-header", inputs: { light: ["light", "light", inputToBoolean], sticky: ["sticky", "sticky", inputToBoolean], showSlim: ["showSlim", "showSlim", inputToBoolean], smallHeader: ["smallHeader", "smallHeader", inputToBoolean], showSearch: ["showSearch", "showSearch", inputToBoolean], slimTitle: "slimTitle", slimTitleLink: "slimTitleLink", loginStyle: "loginStyle", megamenu: ["megamenu", "megamenu", inputToBoolean], expand: ["expand", "expand", inputToBoolean] }, outputs: { loginClick: "loginClick", searchClick: "searchClick" }, viewQueries: [{ propertyName: "headerWrapper", first: true, predicate: ["headerWrapper"], descendants: true }, { propertyName: "itNavBarComponent", first: true, predicate: ItNavBarComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<header\n  #headerWrapper\n  class=\"it-header-wrapper\"\n  [class.it-header-sticky]=\"sticky\"\n  data-bs-position-type=\"fixed\"\n  data-bs-sticky-class-name=\"is-sticky\"\n  data-bs-target=\"#header-nav-wrapper\">\n  @if (showSlim) {\n    <div class=\"it-header-slim-wrapper\" [class.theme-light]=\"light\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col-12\">\n            <div class=\"it-header-slim-wrapper-content\">\n              <a class=\"d-none d-lg-block navbar-brand\" [href]=\"slimTitleLink\" [target]=\"slimTitleLink !== '#' ? '_blank' : '_self'\">\n                {{ slimTitle }}\n              </a>\n              <div class=\"nav-mobile\">\n                <nav [attr.aria-label]=\"'it.navigation.secondary-navigation' | translate\">\n                  <a\n                    class=\"it-opener d-lg-none\"\n                    data-bs-toggle=\"collapse\"\n                    href=\"#menuC1\"\n                    role=\"button\"\n                    aria-expanded=\"false\"\n                    aria-controls=\"menuC1\">\n                    <span>{{ slimTitle }}</span>\n                    <it-icon name=\"expand\"></it-icon>\n                  </a>\n                  <div class=\"link-list-wrapper collapse\" id=\"menuC1\">\n                    <ng-content select=\"[slimLinkList]\"></ng-content>\n                  </div>\n                </nav>\n              </div>\n              <div class=\"it-header-slim-right-zone\">\n                <ng-content select=\"[slimRightZone]\"></ng-content>\n                @if (loginStyle === 'default') {\n                  <div class=\"it-access-top-wrapper\">\n                    <a class=\"btn btn-primary btn-sm\" (click)=\"emitLoginClick($event)\" href=\"#\">\n                      {{ 'it.navigation.login' | translate }}\n                    </a>\n                  </div>\n                }\n                @if (loginStyle === 'full') {\n                  <a itButton=\"primary\" class=\"btn-full btn-icon\" (click)=\"emitLoginClick($event)\" href=\"#\">\n                    <span class=\"rounded-icon\">\n                      <it-icon name=\"user\" color=\"primary\"></it-icon>\n                    </span>\n                    <span class=\"d-none d-lg-block\">{{ 'it.navigation.full-login' | translate }}</span>\n                  </a>\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  }\n  <div class=\"it-nav-wrapper\">\n    <div class=\"it-header-center-wrapper\" [class.it-small-header]=\"smallHeader\" [class.theme-light]=\"light\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col-12\">\n            <div class=\"it-header-center-content-wrapper\">\n              <div class=\"it-brand-wrapper\">\n                <ng-content select=\"[brand]\"></ng-content>\n              </div>\n              <div class=\"it-right-zone\">\n                <ng-content select=\"[rightZone]\"></ng-content>\n\n                @if (showSearch) {\n                  <div class=\"it-search-wrapper\">\n                    <span class=\"d-none d-md-block\">{{ 'it.navigation.search' | translate }}</span>\n                    <a\n                      href=\"#\"\n                      class=\"search-link rounded-icon\"\n                      [attr.aria-label]=\"'it.navigation.website-search' | translate\"\n                      (click)=\"emitSearchClick($event)\">\n                      <it-icon name=\"search\"></it-icon>\n                    </a>\n                  </div>\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"it-header-navbar-wrapper\" [class.theme-light-desk]=\"light\" id=\"header-nav-wrapper\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col-12\">\n            <it-navbar [megamenu]=\"megamenu\" [expand]=\"expand\">\n              <ng-container navItems>\n                <ng-content select=\"[navItems]\"></ng-content>\n              </ng-container>\n            </it-navbar>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</header>\n", styles: [".nav-mobile:has(.link-list-wrapper:empty){display:none}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "directive", type: ItButtonDirective, selector: "[itButton]", inputs: ["itButton", "size", "block", "disabled", "type"], exportAs: ["itButton"] }, { kind: "ngmodule", type: ItNavBarModule }, { kind: "component", type: i2.ItNavBarComponent, selector: "it-navbar", inputs: ["megamenu", "expand"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItHeaderComponent, isStandalone: true, selector: "it-header", inputs: { light: ["light", "light", inputToBoolean], sticky: ["sticky", "sticky", inputToBoolean], showSlim: ["showSlim", "showSlim", inputToBoolean], smallHeader: ["smallHeader", "smallHeader", inputToBoolean], showSearch: ["showSearch", "showSearch", inputToBoolean], slimTitle: "slimTitle", slimTitleLink: "slimTitleLink", loginStyle: "loginStyle", megamenu: ["megamenu", "megamenu", inputToBoolean], expand: ["expand", "expand", inputToBoolean] }, outputs: { loginClick: "loginClick", searchClick: "searchClick" }, viewQueries: [{ propertyName: "headerWrapper", first: true, predicate: ["headerWrapper"], descendants: true }, { propertyName: "itNavBarComponent", first: true, predicate: ItNavBarComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<header\n  #headerWrapper\n  class=\"it-header-wrapper\"\n  [class.it-header-sticky]=\"sticky\"\n  data-bs-position-type=\"fixed\"\n  data-bs-sticky-class-name=\"is-sticky\"\n  data-bs-target=\"#header-nav-wrapper\">\n  @if (showSlim) {\n    <div class=\"it-header-slim-wrapper\" [class.theme-light]=\"light\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col-12\">\n            <div class=\"it-header-slim-wrapper-content\">\n              <a class=\"d-none d-lg-block navbar-brand\" [href]=\"slimTitleLink\" [target]=\"slimTitleLink !== '#' ? '_blank' : '_self'\">\n                {{ slimTitle }}\n              </a>\n              <div class=\"nav-mobile\">\n                <nav [attr.aria-label]=\"'it.navigation.secondary-navigation' | translate\">\n                  <a\n                    class=\"it-opener d-lg-none\"\n                    data-bs-toggle=\"collapse\"\n                    href=\"#menuC1\"\n                    role=\"button\"\n                    aria-expanded=\"false\"\n                    aria-controls=\"menuC1\">\n                    <span>{{ slimTitle }}</span>\n                    <it-icon name=\"expand\"></it-icon>\n                  </a>\n                  <div class=\"link-list-wrapper collapse\" id=\"menuC1\">\n                    <ng-content select=\"[slimLinkList]\"></ng-content>\n                  </div>\n                </nav>\n              </div>\n              <div class=\"it-header-slim-right-zone\">\n                <ng-content select=\"[slimRightZone]\"></ng-content>\n                @if (loginStyle === 'default') {\n                  <div class=\"it-access-top-wrapper\">\n                    <a class=\"btn btn-primary btn-sm\" (click)=\"emitLoginClick($event)\" href=\"#\">\n                      {{ 'it.navigation.login' | translate }}\n                    </a>\n                  </div>\n                }\n                @if (loginStyle === 'full') {\n                  <a itButton=\"primary\" class=\"btn-full btn-icon\" (click)=\"emitLoginClick($event)\" href=\"#\">\n                    <span class=\"rounded-icon\">\n                      <it-icon name=\"user\" color=\"primary\"></it-icon>\n                    </span>\n                    <span class=\"d-none d-lg-block\">{{ 'it.navigation.full-login' | translate }}</span>\n                  </a>\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  }\n  <div class=\"it-nav-wrapper\">\n    <div class=\"it-header-center-wrapper\" [class.it-small-header]=\"smallHeader\" [class.theme-light]=\"light\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col-12\">\n            <div class=\"it-header-center-content-wrapper\">\n              <div class=\"it-brand-wrapper\">\n                <ng-content select=\"[brand]\"></ng-content>\n              </div>\n              <div class=\"it-right-zone\">\n                <ng-content select=\"[rightZone]\"></ng-content>\n\n                @if (showSearch) {\n                  <div class=\"it-search-wrapper\">\n                    <span class=\"d-none d-md-block\">{{ 'it.navigation.search' | translate }}</span>\n                    <a\n                      href=\"#\"\n                      class=\"search-link rounded-icon\"\n                      [attr.aria-label]=\"'it.navigation.website-search' | translate\"\n                      (click)=\"emitSearchClick($event)\">\n                      <it-icon name=\"search\"></it-icon>\n                    </a>\n                  </div>\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"it-header-navbar-wrapper\" [class.theme-light-desk]=\"light\" id=\"header-nav-wrapper\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col-12\">\n            <it-navbar [megamenu]=\"megamenu\" [expand]=\"expand\">\n              <ng-container navItems>\n                <ng-content select=\"[navItems]\"></ng-content>\n              </ng-container>\n            </it-navbar>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</header>\n", styles: [".nav-mobile:has(.link-list-wrapper:empty){display:none}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "directive", type: ItButtonDirective, selector: "[itButton]", inputs: ["itButton", "size", "block", "disabled", "type"], exportAs: ["itButton"] }, { kind: "ngmodule", type: ItNavBarModule }, { kind: "component", type: i2.ItNavBarComponent, selector: "it-navbar", inputs: ["megamenu", "expand"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItHeaderComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-header', changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule, ItIconComponent, ItButtonDirective, ItNavBarModule], template: "<header\n  #headerWrapper\n  class=\"it-header-wrapper\"\n  [class.it-header-sticky]=\"sticky\"\n  data-bs-position-type=\"fixed\"\n  data-bs-sticky-class-name=\"is-sticky\"\n  data-bs-target=\"#header-nav-wrapper\">\n  @if (showSlim) {\n    <div class=\"it-header-slim-wrapper\" [class.theme-light]=\"light\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col-12\">\n            <div class=\"it-header-slim-wrapper-content\">\n              <a class=\"d-none d-lg-block navbar-brand\" [href]=\"slimTitleLink\" [target]=\"slimTitleLink !== '#' ? '_blank' : '_self'\">\n                {{ slimTitle }}\n              </a>\n              <div class=\"nav-mobile\">\n                <nav [attr.aria-label]=\"'it.navigation.secondary-navigation' | translate\">\n                  <a\n                    class=\"it-opener d-lg-none\"\n                    data-bs-toggle=\"collapse\"\n                    href=\"#menuC1\"\n                    role=\"button\"\n                    aria-expanded=\"false\"\n                    aria-controls=\"menuC1\">\n                    <span>{{ slimTitle }}</span>\n                    <it-icon name=\"expand\"></it-icon>\n                  </a>\n                  <div class=\"link-list-wrapper collapse\" id=\"menuC1\">\n                    <ng-content select=\"[slimLinkList]\"></ng-content>\n                  </div>\n                </nav>\n              </div>\n              <div class=\"it-header-slim-right-zone\">\n                <ng-content select=\"[slimRightZone]\"></ng-content>\n                @if (loginStyle === 'default') {\n                  <div class=\"it-access-top-wrapper\">\n                    <a class=\"btn btn-primary btn-sm\" (click)=\"emitLoginClick($event)\" href=\"#\">\n                      {{ 'it.navigation.login' | translate }}\n                    </a>\n                  </div>\n                }\n                @if (loginStyle === 'full') {\n                  <a itButton=\"primary\" class=\"btn-full btn-icon\" (click)=\"emitLoginClick($event)\" href=\"#\">\n                    <span class=\"rounded-icon\">\n                      <it-icon name=\"user\" color=\"primary\"></it-icon>\n                    </span>\n                    <span class=\"d-none d-lg-block\">{{ 'it.navigation.full-login' | translate }}</span>\n                  </a>\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  }\n  <div class=\"it-nav-wrapper\">\n    <div class=\"it-header-center-wrapper\" [class.it-small-header]=\"smallHeader\" [class.theme-light]=\"light\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col-12\">\n            <div class=\"it-header-center-content-wrapper\">\n              <div class=\"it-brand-wrapper\">\n                <ng-content select=\"[brand]\"></ng-content>\n              </div>\n              <div class=\"it-right-zone\">\n                <ng-content select=\"[rightZone]\"></ng-content>\n\n                @if (showSearch) {\n                  <div class=\"it-search-wrapper\">\n                    <span class=\"d-none d-md-block\">{{ 'it.navigation.search' | translate }}</span>\n                    <a\n                      href=\"#\"\n                      class=\"search-link rounded-icon\"\n                      [attr.aria-label]=\"'it.navigation.website-search' | translate\"\n                      (click)=\"emitSearchClick($event)\">\n                      <it-icon name=\"search\"></it-icon>\n                    </a>\n                  </div>\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"it-header-navbar-wrapper\" [class.theme-light-desk]=\"light\" id=\"header-nav-wrapper\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col-12\">\n            <it-navbar [megamenu]=\"megamenu\" [expand]=\"expand\">\n              <ng-container navItems>\n                <ng-content select=\"[navItems]\"></ng-content>\n              </ng-container>\n            </it-navbar>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</header>\n", styles: [".nav-mobile:has(.link-list-wrapper:empty){display:none}\n"] }]
         }], ctorParameters: () => [], propDecorators: { light: [{

package/esm2022/lib/components/navigation/megamenu/megamenu.component.mjs

@@ -9,10 +9,10 @@ export class ItMegamenuComponent {
          */
         this.mode = 'normal';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItMegamenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItMegamenuComponent, isStandalone: true, selector: "it-megamenu", inputs: { mode: "mode", header: ["header", "header", inputToBoolean], footer: ["footer", "footer", inputToBoolean] }, ngImport: i0, template: "<div class=\"megamenu pb-5 pt-3 py-lg-0\">\n  <div class=\"row\">\n    @if (mode === 'left-section') {\n      <div class=\"col-xs-12 col-lg-4 px-0\">\n        <div class=\"row\">\n          <div class=\"col-12 it-vertical it-description pb-lg-3\">\n            <div class=\"description-content ps-4 ps-sm-5 ms-3\">\n              <ng-content select=\"[megamenuLeftZone]\"></ng-content>\n            </div>\n          </div>\n        </div>\n      </div>\n    }\n    <div class=\"col-12\" [class.col-lg-8]=\"mode !== 'normal'\">\n      @if (header) {\n        <div class=\"it-heading-link-wrapper\">\n          <ng-content select=\"[megamenuHeadingLink]\"></ng-content>\n        </div>\n      }\n      <div class=\"row\">\n        <ng-content select=\"[megamenuLinkList]\"></ng-content>\n      </div>\n    </div>\n    @if (footer || mode === 'right-section') {\n      <div [class.col-xs-12]=\"mode === 'right-section'\" [class.col-lg-4]=\"mode === 'right-section'\" [class.px-0]=\"mode === 'right-section'\">\n        <div [class.it-footer-link-wrapper]=\"footer\" [class.it-footer-link-wrapper-vertical]=\"mode === 'right-section'\">\n          <div class=\"d-flex flex-column justify-content-around\" [class.flex-lg-row]=\"mode !== 'right-section'\">\n            <ng-content select=\"[megamenuFooter]\"></ng-content>\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: ["::ng-deep .theme-light-desk .nav-link:before{background-color:#06c}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItMegamenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItMegamenuComponent, isStandalone: true, selector: "it-megamenu", inputs: { mode: "mode", header: ["header", "header", inputToBoolean], footer: ["footer", "footer", inputToBoolean] }, ngImport: i0, template: "<div class=\"megamenu pb-5 pt-3 py-lg-0\">\n  <div class=\"row\">\n    @if (mode === 'left-section') {\n      <div class=\"col-xs-12 col-lg-4 px-0\">\n        <div class=\"row\">\n          <div class=\"col-12 it-vertical it-description pb-lg-3\">\n            <div class=\"description-content ps-4 ps-sm-5 ms-3\">\n              <ng-content select=\"[megamenuLeftZone]\"></ng-content>\n            </div>\n          </div>\n        </div>\n      </div>\n    }\n    <div class=\"col-12\" [class.col-lg-8]=\"mode !== 'normal'\">\n      @if (header) {\n        <div class=\"it-heading-link-wrapper\">\n          <ng-content select=\"[megamenuHeadingLink]\"></ng-content>\n        </div>\n      }\n      <div class=\"row\">\n        <ng-content select=\"[megamenuLinkList]\"></ng-content>\n      </div>\n    </div>\n    @if (footer || mode === 'right-section') {\n      <div [class.col-xs-12]=\"mode === 'right-section'\" [class.col-lg-4]=\"mode === 'right-section'\" [class.px-0]=\"mode === 'right-section'\">\n        <div [class.it-footer-link-wrapper]=\"footer\" [class.it-footer-link-wrapper-vertical]=\"mode === 'right-section'\">\n          <div class=\"d-flex flex-column justify-content-around\" [class.flex-lg-row]=\"mode !== 'right-section'\">\n            <ng-content select=\"[megamenuFooter]\"></ng-content>\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: ["::ng-deep .theme-light-desk .nav-link:before{background-color:#06c}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItMegamenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItMegamenuComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-megamenu', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet], template: "<div class=\"megamenu pb-5 pt-3 py-lg-0\">\n  <div class=\"row\">\n    @if (mode === 'left-section') {\n      <div class=\"col-xs-12 col-lg-4 px-0\">\n        <div class=\"row\">\n          <div class=\"col-12 it-vertical it-description pb-lg-3\">\n            <div class=\"description-content ps-4 ps-sm-5 ms-3\">\n              <ng-content select=\"[megamenuLeftZone]\"></ng-content>\n            </div>\n          </div>\n        </div>\n      </div>\n    }\n    <div class=\"col-12\" [class.col-lg-8]=\"mode !== 'normal'\">\n      @if (header) {\n        <div class=\"it-heading-link-wrapper\">\n          <ng-content select=\"[megamenuHeadingLink]\"></ng-content>\n        </div>\n      }\n      <div class=\"row\">\n        <ng-content select=\"[megamenuLinkList]\"></ng-content>\n      </div>\n    </div>\n    @if (footer || mode === 'right-section') {\n      <div [class.col-xs-12]=\"mode === 'right-section'\" [class.col-lg-4]=\"mode === 'right-section'\" [class.px-0]=\"mode === 'right-section'\">\n        <div [class.it-footer-link-wrapper]=\"footer\" [class.it-footer-link-wrapper-vertical]=\"mode === 'right-section'\">\n          <div class=\"d-flex flex-column justify-content-around\" [class.flex-lg-row]=\"mode !== 'right-section'\">\n            <ng-content select=\"[megamenuFooter]\"></ng-content>\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: ["::ng-deep .theme-light-desk .nav-link:before{background-color:#06c}\n"] }]
         }], propDecorators: { mode: [{

package/esm2022/lib/components/navigation/navbar/navbar/navbar.component.mjs

@@ -18,10 +18,10 @@ export class ItNavBarComponent {
     toggleCollapse() {
         this.navbar?.toggle(this.collapseButton?.nativeElement);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItNavBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.1.2", type: ItNavBarComponent, isStandalone: true, selector: "it-navbar", inputs: { megamenu: ["megamenu", "megamenu", inputToBoolean], expand: ["expand", "expand", inputToBoolean] }, viewQueries: [{ propertyName: "collapseButton", first: true, predicate: ["collapseButton"], descendants: true }, { propertyName: "collapseView", first: true, predicate: ["collapseView"], descendants: true }], ngImport: i0, template: "<nav\n  class=\"navbar\"\n  [class.navbar-expand-lg]=\"expand\"\n  [class.has-megamenu]=\"megamenu\"\n  [attr.aria-label]=\"'it.navbar.aria-label-main' | translate\">\n  <button\n    (click)=\"toggleCollapse()\"\n    #collapseButton\n    class=\"custom-navbar-toggler\"\n    type=\"button\"\n    [attr.aria-label]=\"'it.navbar.aria-label-toggle' | translate\">\n    <it-icon name=\"burger\"></it-icon>\n  </button>\n  <div #collapseView class=\"navbar-collapsable\" style=\"display: none\">\n    <div class=\"overlay\" style=\"display: none\"></div>\n    <div class=\"close-div\">\n      <button class=\"btn close-menu\" type=\"button\">\n        <span class=\"visually-hidden\">{{ 'it.navbar.hide' | translate }}</span>\n        <it-icon name=\"close-big\"></it-icon>\n      </button>\n    </div>\n    <div class=\"menu-wrapper\">\n      <ul class=\"navbar-nav\">\n        <ng-content select=\"[navItems]\"></ng-content>\n      </ul>\n    </div>\n  </div>\n</nav>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.6", type: ItNavBarComponent, isStandalone: true, selector: "it-navbar", inputs: { megamenu: ["megamenu", "megamenu", inputToBoolean], expand: ["expand", "expand", inputToBoolean] }, viewQueries: [{ propertyName: "collapseButton", first: true, predicate: ["collapseButton"], descendants: true }, { propertyName: "collapseView", first: true, predicate: ["collapseView"], descendants: true }], ngImport: i0, template: "<nav\n  class=\"navbar\"\n  [class.navbar-expand-lg]=\"expand\"\n  [class.has-megamenu]=\"megamenu\"\n  [attr.aria-label]=\"'it.navbar.aria-label-main' | translate\">\n  <button\n    (click)=\"toggleCollapse()\"\n    #collapseButton\n    class=\"custom-navbar-toggler\"\n    type=\"button\"\n    [attr.aria-label]=\"'it.navbar.aria-label-toggle' | translate\">\n    <it-icon name=\"burger\"></it-icon>\n  </button>\n  <div #collapseView class=\"navbar-collapsable\" style=\"display: none\">\n    <div class=\"overlay\" style=\"display: none\"></div>\n    <div class=\"close-div\">\n      <button class=\"btn close-menu\" type=\"button\">\n        <span class=\"visually-hidden\">{{ 'it.navbar.hide' | translate }}</span>\n        <it-icon name=\"close-big\"></it-icon>\n      </button>\n    </div>\n    <div class=\"menu-wrapper\">\n      <ul class=\"navbar-nav\">\n        <ng-content select=\"[navItems]\"></ng-content>\n      </ul>\n    </div>\n  </div>\n</nav>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItNavBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavBarComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-navbar', changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule, ItIconComponent, ItButtonDirective], template: "<nav\n  class=\"navbar\"\n  [class.navbar-expand-lg]=\"expand\"\n  [class.has-megamenu]=\"megamenu\"\n  [attr.aria-label]=\"'it.navbar.aria-label-main' | translate\">\n  <button\n    (click)=\"toggleCollapse()\"\n    #collapseButton\n    class=\"custom-navbar-toggler\"\n    type=\"button\"\n    [attr.aria-label]=\"'it.navbar.aria-label-toggle' | translate\">\n    <it-icon name=\"burger\"></it-icon>\n  </button>\n  <div #collapseView class=\"navbar-collapsable\" style=\"display: none\">\n    <div class=\"overlay\" style=\"display: none\"></div>\n    <div class=\"close-div\">\n      <button class=\"btn close-menu\" type=\"button\">\n        <span class=\"visually-hidden\">{{ 'it.navbar.hide' | translate }}</span>\n        <it-icon name=\"close-big\"></it-icon>\n      </button>\n    </div>\n    <div class=\"menu-wrapper\">\n      <ul class=\"navbar-nav\">\n        <ng-content select=\"[navItems]\"></ng-content>\n      </ul>\n    </div>\n  </div>\n</nav>\n" }]
         }], propDecorators: { megamenu: [{

package/esm2022/lib/components/navigation/navbar/navbar-item/navbar-item.component.mjs

@@ -1,10 +1,10 @@
 import { ChangeDetectionStrategy, Component } from '@angular/core';
 import * as i0 from "@angular/core";
 export class ItNavBarItemComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItNavBarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: ItNavBarItemComponent, isStandalone: true, selector: "it-navbar-item", ngImport: i0, template: "<li class=\"nav-item\">\n  <ng-content></ng-content>\n</li>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavBarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.6", type: ItNavBarItemComponent, isStandalone: true, selector: "it-navbar-item", ngImport: i0, template: "<li class=\"nav-item\">\n  <ng-content></ng-content>\n</li>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItNavBarItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavBarItemComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-navbar-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<li class=\"nav-item\">\n  <ng-content></ng-content>\n</li>\n" }]
         }] });

package/esm2022/lib/components/navigation/navbar/navbar.module.mjs

@@ -4,11 +4,11 @@ import { ItNavBarItemComponent } from './navbar-item/navbar-item.component';
 import * as i0 from "@angular/core";
 const navbarComponents = [ItNavBarComponent, ItNavBarItemComponent];
 export class ItNavBarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItNavBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.2", ngImport: i0, type: ItNavBarModule, imports: [ItNavBarComponent, ItNavBarItemComponent], exports: [ItNavBarComponent, ItNavBarItemComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItNavBarModule, imports: [ItNavBarComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.6", ngImport: i0, type: ItNavBarModule, imports: [ItNavBarComponent, ItNavBarItemComponent], exports: [ItNavBarComponent, ItNavBarItemComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavBarModule, imports: [ItNavBarComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItNavBarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavBarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: navbarComponents,

package/esm2022/lib/components/navigation/navscroll/navscroll-list-item.component.mjs

@@ -0,0 +1,98 @@
+import { AsyncPipe } from '@angular/common';
+import { ChangeDetectionStrategy, Component, DestroyRef, EventEmitter, inject, Input, Output, ViewChild } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { NavigationEnd, Router, RouterLink, RouterLinkActive, RouterLinkWithHref, Scroll, } from '@angular/router';
+import { AsyncSubject, filter, switchMap, tap } from 'rxjs';
+import { ItNavscrollListItemsComponent } from './navscroll-list-items.component';
+import { NavscrollStore } from './navscroll.store';
+import * as i0 from "@angular/core";
+const ROUTER_LINK_ACTIVE_OPTIONS = {
+    fragment: 'exact',
+    paths: 'exact',
+    queryParams: 'exact',
+    matrixParams: 'exact',
+};
+export class ItNavscrollListItemComponent {
+    constructor() {
+        this.checkActive = new EventEmitter();
+        this.routerLinkActiveOptions = ROUTER_LINK_ACTIVE_OPTIONS;
+        this.#initIsActive = new AsyncSubject();
+        this.active = this.#initIsActive.asObservable().pipe(switchMap(item => this.#store.isActive$(item)));
+        this.#router = inject(Router);
+        this.#store = inject(NavscrollStore);
+        this.#destroyRef = inject(DestroyRef);
+    }
+    #initIsActive;
+    #router;
+    #store;
+    #destroyRef;
+    ngOnInit() {
+        this.#initIsActiveSub();
+        this.#router.events
+            .pipe(takeUntilDestroyed(this.#destroyRef), filter((event) => {
+            const isNavigationEndEvent = event instanceof NavigationEnd;
+            const isScrollEvent = event instanceof Scroll && event.routerEvent instanceof NavigationEnd;
+            return isNavigationEndEvent || isScrollEvent;
+        }), tap(() => {
+            if (this.rtl?.isActive) {
+                this.#store.setActive(this.item);
+            }
+        }))
+            .subscribe();
+    }
+    clickHandler(event) {
+        event.preventDefault();
+        this.#store.selectMenuItem();
+        this.#router.navigate([], { fragment: this.item.href });
+    }
+    #initIsActiveSub() {
+        this.#initIsActive.next(this.item);
+        this.#initIsActive.complete();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavscrollListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.6", type: ItNavscrollListItemComponent, isStandalone: true, selector: "it-navscroll-list-item", inputs: { item: "item" }, outputs: { checkActive: "checkActive" }, viewQueries: [{ propertyName: "rtl", first: true, predicate: ["rtl"], descendants: true }], ngImport: i0, template: `
+    <a
+      class="nav-link"
+      [class.active]="active | async"
+      [routerLink]="[]"
+      routerLinkActive
+      [fragment]="item?.href"
+      [routerLinkActiveOptions]="routerLinkActiveOptions"
+      ariaCurrentWhenActive="page"
+      #rtl="routerLinkActive"
+      (click)="clickHandler($event)"
+      ><span>{{ item?.title }}</span></a
+    >
+  `, isInline: true, dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavscrollListItemComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'it-navscroll-list-item',
+                    standalone: true,
+                    imports: [RouterLink, RouterLinkActive, RouterLinkWithHref, ItNavscrollListItemsComponent, AsyncPipe],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: `
+    <a
+      class="nav-link"
+      [class.active]="active | async"
+      [routerLink]="[]"
+      routerLinkActive
+      [fragment]="item?.href"
+      [routerLinkActiveOptions]="routerLinkActiveOptions"
+      ariaCurrentWhenActive="page"
+      #rtl="routerLinkActive"
+      (click)="clickHandler($event)"
+      ><span>{{ item?.title }}</span></a
+    >
+  `,
+                }]
+        }], propDecorators: { item: [{
+                type: Input
+            }], checkActive: [{
+                type: Output
+            }], rtl: [{
+                type: ViewChild,
+                args: ['rtl']
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmF2c2Nyb2xsLWxpc3QtaXRlbS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kZXNpZ24tYW5ndWxhci1raXQvc3JjL2xpYi9jb21wb25lbnRzL25hdmlnYXRpb24vbmF2c2Nyb2xsL25hdnNjcm9sbC1saXN0LWl0ZW0uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUM1QyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxZQUFZLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3ZJLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLDRCQUE0QixDQUFDO0FBQ2hFLE9BQU8sRUFFTCxhQUFhLEVBQ2IsTUFBTSxFQUVOLFVBQVUsRUFDVixnQkFBZ0IsRUFDaEIsa0JBQWtCLEVBQ2xCLE1BQU0sR0FDUCxNQUFNLGlCQUFpQixDQUFDO0FBQ3pCLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxHQUFHLEVBQUUsTUFBTSxNQUFNLENBQUM7QUFDNUQsT0FBTyxFQUFFLDZCQUE2QixFQUFFLE1BQU0sa0NBQWtDLENBQUM7QUFFakYsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLG1CQUFtQixDQUFDOztBQUVuRCxNQUFNLDBCQUEwQixHQUF5QjtJQUN2RCxRQUFRLEVBQUUsT0FBTztJQUNqQixLQUFLLEVBQUUsT0FBTztJQUNkLFdBQVcsRUFBRSxPQUFPO0lBQ3BCLFlBQVksRUFBRSxPQUFPO0NBQ3RCLENBQUM7QUFzQkYsTUFBTSxPQUFPLDRCQUE0QjtJQXBCekM7UUF1QnFCLGdCQUFXLEdBQUcsSUFBSSxZQUFZLEVBQWlCLENBQUM7UUFLMUQsNEJBQXVCLEdBQUcsMEJBQTBCLENBQUM7UUFFckQsa0JBQWEsR0FBRyxJQUFJLFlBQVksRUFBaUIsQ0FBQztRQUVsRCxXQUFNLEdBQUcsSUFBSSxDQUFDLGFBQWEsQ0FBQyxZQUFZLEVBQUUsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxDQUFDO1FBRWhHLFlBQU8sR0FBRyxNQUFNLENBQUMsTUFBTSxDQUFDLENBQUM7UUFFekIsV0FBTSxHQUFHLE1BQU0sQ0FBQyxjQUFjLENBQUMsQ0FBQztRQUVoQyxnQkFBVyxHQUFHLE1BQU0sQ0FBQyxVQUFVLENBQUMsQ0FBQztLQStCM0M7SUF2Q1UsYUFBYSxDQUFxQztJQUlsRCxPQUFPLENBQWtCO0lBRXpCLE1BQU0sQ0FBMEI7SUFFaEMsV0FBVyxDQUFzQjtJQUUxQyxRQUFRO1FBQ04sSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUM7UUFDeEIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxNQUFNO2FBQ2hCLElBQUksQ0FDSCxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLEVBQ3BDLE1BQU0sQ0FBQyxDQUFDLEtBQWtCLEVBQUUsRUFBRTtZQUM1QixNQUFNLG9CQUFvQixHQUFHLEtBQUssWUFBWSxhQUFhLENBQUM7WUFDNUQsTUFBTSxhQUFhLEdBQUcsS0FBSyxZQUFZLE1BQU0sSUFBSyxLQUFnQixDQUFDLFdBQVcsWUFBWSxhQUFhLENBQUM7WUFDeEcsT0FBTyxvQkFBb0IsSUFBSSxhQUFhLENBQUM7UUFDL0MsQ0FBQyxDQUFDLEVBQ0YsR0FBRyxDQUFDLEdBQUcsRUFBRTtZQUNQLElBQUksSUFBSSxDQUFDLEdBQUcsRUFBRSxRQUFRLEVBQUUsQ0FBQztnQkFDdkIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1lBQ25DLENBQUM7UUFDSCxDQUFDLENBQUMsQ0FDSDthQUNBLFNBQVMsRUFBRSxDQUFDO0lBQ2pCLENBQUM7SUFFRCxZQUFZLENBQUMsS0FBWTtRQUN2QixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7UUFDdkIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUM3QixJQUFJLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQyxFQUFFLEVBQUUsRUFBRSxRQUFRLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsQ0FBQyxDQUFDO0lBQzFELENBQUM7SUFFRCxnQkFBZ0I7UUFDZCxJQUFJLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDbkMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNoQyxDQUFDOzhHQWhEVSw0QkFBNEI7a0dBQTVCLDRCQUE0QixpUEFmN0I7Ozs7Ozs7Ozs7Ozs7R0FhVCw0REFmUyxVQUFVLG9PQUFFLGdCQUFnQix5TUFBcUQsU0FBUzs7MkZBaUJ6Riw0QkFBNEI7a0JBcEJ4QyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSx3QkFBd0I7b0JBQ2xDLFVBQVUsRUFBRSxJQUFJO29CQUNoQixPQUFPLEVBQUUsQ0FBQyxVQUFVLEVBQUUsZ0JBQWdCLEVBQUUsa0JBQWtCLEVBQUUsNkJBQTZCLEVBQUUsU0FBUyxDQUFDO29CQUNyRyxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTtvQkFDL0MsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7O0dBYVQ7aUJBQ0Y7OEJBRVUsSUFBSTtzQkFBWixLQUFLO2dCQUVhLFdBQVc7c0JBQTdCLE1BQU07Z0JBR0UsR0FBRztzQkFEWCxTQUFTO3VCQUFDLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBc3luY1BpcGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgRGVzdHJveVJlZiwgRXZlbnRFbWl0dGVyLCBpbmplY3QsIElucHV0LCBPbkluaXQsIE91dHB1dCwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyB0YWtlVW50aWxEZXN0cm95ZWQgfSBmcm9tICdAYW5ndWxhci9jb3JlL3J4anMtaW50ZXJvcCc7XG5pbXBvcnQge1xuICBJc0FjdGl2ZU1hdGNoT3B0aW9ucyxcbiAgTmF2aWdhdGlvbkVuZCxcbiAgUm91dGVyLFxuICBFdmVudCBhcyBSb3V0ZXJFdmVudCxcbiAgUm91dGVyTGluayxcbiAgUm91dGVyTGlua0FjdGl2ZSxcbiAgUm91dGVyTGlua1dpdGhIcmVmLFxuICBTY3JvbGwsXG59IGZyb20gJ0Bhbmd1bGFyL3JvdXRlcic7XG5pbXBvcnQgeyBBc3luY1N1YmplY3QsIGZpbHRlciwgc3dpdGNoTWFwLCB0YXAgfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IEl0TmF2c2Nyb2xsTGlzdEl0ZW1zQ29tcG9uZW50IH0gZnJvbSAnLi9uYXZzY3JvbGwtbGlzdC1pdGVtcy5jb21wb25lbnQnO1xuaW1wb3J0IHsgTmF2c2Nyb2xsSXRlbSB9IGZyb20gJy4vbmF2c2Nyb2xsLm1vZGVsJztcbmltcG9ydCB7IE5hdnNjcm9sbFN0b3JlIH0gZnJvbSAnLi9uYXZzY3JvbGwuc3RvcmUnO1xuXG5jb25zdCBST1VURVJfTElOS19BQ1RJVkVfT1BUSU9OUzogSXNBY3RpdmVNYXRjaE9wdGlvbnMgPSB7XG4gIGZyYWdtZW50OiAnZXhhY3QnLFxuICBwYXRoczogJ2V4YWN0JyxcbiAgcXVlcnlQYXJhbXM6ICdleGFjdCcsXG4gIG1hdHJpeFBhcmFtczogJ2V4YWN0Jyxcbn07XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2l0LW5hdnNjcm9sbC1saXN0LWl0ZW0nLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbUm91dGVyTGluaywgUm91dGVyTGlua0FjdGl2ZSwgUm91dGVyTGlua1dpdGhIcmVmLCBJdE5hdnNjcm9sbExpc3RJdGVtc0NvbXBvbmVudCwgQXN5bmNQaXBlXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHRlbXBsYXRlOiBgXG4gICAgPGFcbiAgICAgIGNsYXNzPVwibmF2LWxpbmtcIlxuICAgICAgW2NsYXNzLmFjdGl2ZV09XCJhY3RpdmUgfCBhc3luY1wiXG4gICAgICBbcm91dGVyTGlua109XCJbXVwiXG4gICAgICByb3V0ZXJMaW5rQWN0aXZlXG4gICAgICBbZnJhZ21lbnRdPVwiaXRlbT8uaHJlZlwiXG4gICAgICBbcm91dGVyTGlua0FjdGl2ZU9wdGlvbnNdPVwicm91dGVyTGlua0FjdGl2ZU9wdGlvbnNcIlxuICAgICAgYXJpYUN1cnJlbnRXaGVuQWN0aXZlPVwicGFnZVwiXG4gICAgICAjcnRsPVwicm91dGVyTGlua0FjdGl2ZVwiXG4gICAgICAoY2xpY2spPVwiY2xpY2tIYW5kbGVyKCRldmVudClcIlxuICAgICAgPjxzcGFuPnt7IGl0ZW0/LnRpdGxlIH19PC9zcGFuPjwvYVxuICAgID5cbiAgYCxcbn0pXG5leHBvcnQgY2xhc3MgSXROYXZzY3JvbGxMaXN0SXRlbUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIGl0ZW0hOiBOYXZzY3JvbGxJdGVtO1xuXG4gIEBPdXRwdXQoKSByZWFkb25seSBjaGVja0FjdGl2ZSA9IG5ldyBFdmVudEVtaXR0ZXI8TmF2c2Nyb2xsSXRlbT4oKTtcblxuICBAVmlld0NoaWxkKCdydGwnKVxuICByZWFkb25seSBydGw6IGFueTtcblxuICByZWFkb25seSByb3V0ZXJMaW5rQWN0aXZlT3B0aW9ucyA9IFJPVVRFUl9MSU5LX0FDVElWRV9PUFRJT05TO1xuXG4gIHJlYWRvbmx5ICNpbml0SXNBY3RpdmUgPSBuZXcgQXN5bmNTdWJqZWN0PE5hdnNjcm9sbEl0ZW0+KCk7XG5cbiAgcmVhZG9ubHkgYWN0aXZlID0gdGhpcy4jaW5pdElzQWN0aXZlLmFzT2JzZXJ2YWJsZSgpLnBpcGUoc3dpdGNoTWFwKGl0ZW0gPT4gdGhpcy4jc3RvcmUuaXNBY3RpdmUkKGl0ZW0pKSk7XG5cbiAgcmVhZG9ubHkgI3JvdXRlciA9IGluamVjdChSb3V0ZXIpO1xuXG4gIHJlYWRvbmx5ICNzdG9yZSA9IGluamVjdChOYXZzY3JvbGxTdG9yZSk7XG5cbiAgcmVhZG9ubHkgI2Rlc3Ryb3lSZWYgPSBpbmplY3QoRGVzdHJveVJlZik7XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgdGhpcy4jaW5pdElzQWN0aXZlU3ViKCk7XG4gICAgdGhpcy4jcm91dGVyLmV2ZW50c1xuICAgICAgLnBpcGUoXG4gICAgICAgIHRha2VVbnRpbERlc3Ryb3llZCh0aGlzLiNkZXN0cm95UmVmKSxcbiAgICAgICAgZmlsdGVyKChldmVudDogUm91dGVyRXZlbnQpID0+IHtcbiAgICAgICAgICBjb25zdCBpc05hdmlnYXRpb25FbmRFdmVudCA9IGV2ZW50IGluc3RhbmNlb2YgTmF2aWdhdGlvbkVuZDtcbiAgICAgICAgICBjb25zdCBpc1Njcm9sbEV2ZW50ID0gZXZlbnQgaW5zdGFuY2VvZiBTY3JvbGwgJiYgKGV2ZW50IGFzIFNjcm9sbCkucm91dGVyRXZlbnQgaW5zdGFuY2VvZiBOYXZpZ2F0aW9uRW5kO1xuICAgICAgICAgIHJldHVybiBpc05hdmlnYXRpb25FbmRFdmVudCB8fCBpc1Njcm9sbEV2ZW50O1xuICAgICAgICB9KSxcbiAgICAgICAgdGFwKCgpID0+IHtcbiAgICAgICAgICBpZiAodGhpcy5ydGw/LmlzQWN0aXZlKSB7XG4gICAgICAgICAgICB0aGlzLiNzdG9yZS5zZXRBY3RpdmUodGhpcy5pdGVtKTtcbiAgICAgICAgICB9XG4gICAgICAgIH0pXG4gICAgICApXG4gICAgICAuc3Vic2NyaWJlKCk7XG4gIH1cblxuICBjbGlja0hhbmRsZXIoZXZlbnQ6IEV2ZW50KSB7XG4gICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICB0aGlzLiNzdG9yZS5zZWxlY3RNZW51SXRlbSgpO1xuICAgIHRoaXMuI3JvdXRlci5uYXZpZ2F0ZShbXSwgeyBmcmFnbWVudDogdGhpcy5pdGVtLmhyZWYgfSk7XG4gIH1cblxuICAjaW5pdElzQWN0aXZlU3ViKCkge1xuICAgIHRoaXMuI2luaXRJc0FjdGl2ZS5uZXh0KHRoaXMuaXRlbSk7XG4gICAgdGhpcy4jaW5pdElzQWN0aXZlLmNvbXBsZXRlKCk7XG4gIH1cbn1cbiJdfQ==

package/esm2022/lib/components/navigation/navscroll/navscroll-list-items.component.mjs

@@ -0,0 +1,44 @@
+import { JsonPipe, NgTemplateOutlet } from '@angular/common';
+import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
+import { RouterLink, RouterLinkActive, RouterLinkWithHref } from '@angular/router';
+import { ItNavscrollListItemComponent } from './navscroll-list-item.component';
+import * as i0 from "@angular/core";
+export class ItNavscrollListItemsComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavscrollListItemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItNavscrollListItemsComponent, isStandalone: true, selector: "it-navscroll-list-items", inputs: { items: "items" }, ngImport: i0, template: `
+    <ul class="link-list">
+      @for (item of items; track item.href) {
+        <li class="nav-item">
+          <it-navscroll-list-item [item]="item"></it-navscroll-list-item>
+          @if (item.childs?.length) {
+            <it-navscroll-list-items [items]="item.childs"></it-navscroll-list-items>
+          }
+        </li>
+      }
+    </ul>
+  `, isInline: true, dependencies: [{ kind: "component", type: ItNavscrollListItemsComponent, selector: "it-navscroll-list-items", inputs: ["items"] }, { kind: "component", type: ItNavscrollListItemComponent, selector: "it-navscroll-list-item", inputs: ["item"], outputs: ["checkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNavscrollListItemsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'it-navscroll-list-items',
+                    standalone: true,
+                    imports: [NgTemplateOutlet, RouterLink, RouterLinkActive, RouterLinkWithHref, JsonPipe, ItNavscrollListItemComponent],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: `
+    <ul class="link-list">
+      @for (item of items; track item.href) {
+        <li class="nav-item">
+          <it-navscroll-list-item [item]="item"></it-navscroll-list-item>
+          @if (item.childs?.length) {
+            <it-navscroll-list-items [items]="item.childs"></it-navscroll-list-items>
+          }
+        </li>
+      }
+    </ul>
+  `,
+                }]
+        }], propDecorators: { items: [{
+                type: Input
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmF2c2Nyb2xsLWxpc3QtaXRlbXMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGVzaWduLWFuZ3VsYXIta2l0L3NyYy9saWIvY29tcG9uZW50cy9uYXZpZ2F0aW9uL25hdnNjcm9sbC9uYXZzY3JvbGwtbGlzdC1pdGVtcy5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQzdELE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzFFLE9BQU8sRUFBRSxVQUFVLEVBQUUsZ0JBQWdCLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUNuRixPQUFPLEVBQUUsNEJBQTRCLEVBQUUsTUFBTSxpQ0FBaUMsQ0FBQzs7QUFxQi9FLE1BQU0sT0FBTyw2QkFBNkI7OEdBQTdCLDZCQUE2QjtrR0FBN0IsNkJBQTZCLCtHQWI5Qjs7Ozs7Ozs7Ozs7R0FXVCw0REFFVSw2QkFBNkIsdUZBZmdELDRCQUE0Qjs7MkZBZXpHLDZCQUE2QjtrQkFsQnpDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLHlCQUF5QjtvQkFDbkMsVUFBVSxFQUFFLElBQUk7b0JBQ2hCLE9BQU8sRUFBRSxDQUFDLGdCQUFnQixFQUFFLFVBQVUsRUFBRSxnQkFBZ0IsRUFBRSxrQkFBa0IsRUFBRSxRQUFRLEVBQUUsNEJBQTRCLENBQUM7b0JBQ3JILGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNO29CQUMvQyxRQUFRLEVBQUU7Ozs7Ozs7Ozs7O0dBV1Q7aUJBQ0Y7OEJBRVUsS0FBSztzQkFBYixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSnNvblBpcGUsIE5nVGVtcGxhdGVPdXRsZXQgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFJvdXRlckxpbmssIFJvdXRlckxpbmtBY3RpdmUsIFJvdXRlckxpbmtXaXRoSHJlZiB9IGZyb20gJ0Bhbmd1bGFyL3JvdXRlcic7XG5pbXBvcnQgeyBJdE5hdnNjcm9sbExpc3RJdGVtQ29tcG9uZW50IH0gZnJvbSAnLi9uYXZzY3JvbGwtbGlzdC1pdGVtLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBOYXZzY3JvbGxJdGVtcyB9IGZyb20gJy4vbmF2c2Nyb2xsLm1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnaXQtbmF2c2Nyb2xsLWxpc3QtaXRlbXMnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbTmdUZW1wbGF0ZU91dGxldCwgUm91dGVyTGluaywgUm91dGVyTGlua0FjdGl2ZSwgUm91dGVyTGlua1dpdGhIcmVmLCBKc29uUGlwZSwgSXROYXZzY3JvbGxMaXN0SXRlbUNvbXBvbmVudF0sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICB0ZW1wbGF0ZTogYFxuICAgIDx1bCBjbGFzcz1cImxpbmstbGlzdFwiPlxuICAgICAgQGZvciAoaXRlbSBvZiBpdGVtczsgdHJhY2sgaXRlbS5ocmVmKSB7XG4gICAgICAgIDxsaSBjbGFzcz1cIm5hdi1pdGVtXCI+XG4gICAgICAgICAgPGl0LW5hdnNjcm9sbC1saXN0LWl0ZW0gW2l0ZW1dPVwiaXRlbVwiPjwvaXQtbmF2c2Nyb2xsLWxpc3QtaXRlbT5cbiAgICAgICAgICBAaWYgKGl0ZW0uY2hpbGRzPy5sZW5ndGgpIHtcbiAgICAgICAgICAgIDxpdC1uYXZzY3JvbGwtbGlzdC1pdGVtcyBbaXRlbXNdPVwiaXRlbS5jaGlsZHNcIj48L2l0LW5hdnNjcm9sbC1saXN0LWl0ZW1zPlxuICAgICAgICAgIH1cbiAgICAgICAgPC9saT5cbiAgICAgIH1cbiAgICA8L3VsPlxuICBgLFxufSlcbmV4cG9ydCBjbGFzcyBJdE5hdnNjcm9sbExpc3RJdGVtc0NvbXBvbmVudCB7XG4gIEBJbnB1dCgpIGl0ZW1zITogTmF2c2Nyb2xsSXRlbXM7XG59XG4iXX0=