npm - design-angular-kit - Versions diffs - 1.0.3 → 1.1.1 - Mend

design-angular-kit 1.0.3 → 1.1.1

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 (164) hide show

package/esm2022/lib/components/core/notifications/notifications.component.mjs CHANGED Viewed

@@ -94,10 +94,10 @@ export class ItNotificationsComponent {
                 return undefined;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItNotificationsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.ItNotificationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItNotificationsComponent, isStandalone: true, selector: "it-notifications", inputs: { duration: "duration", position: "position", dismissible: ["dismissible", "dismissible", inputToBoolean] }, ngImport: i0, template: "@for (notification of notifications; track notification.id) {\n  <div\n    [id]=\"notification.id\"\n    class=\"notification {{ notification.position }} {{ notification.type }}\"\n    [class.with-icon]=\"!!notification.icon\"\n    [class.dismissable]=\"notification.dismissible\"\n    role=\"alert\"\n    [attr.aria-labelledby]=\"notification.id + '-title'\">\n    <h2 [id]=\"notification.id + '-title'\" class=\"h5\">\n      @if (notification.icon) {\n        <it-icon [name]=\"notification.icon\"></it-icon>\n      }\n      <ng-container>{{ notification.title }}</ng-container>\n    </h2>\n    @if (notification.message) {\n      <p>{{ notification.message }}</p>\n    }\n    @if (notification.dismissible) {\n      <button type=\"button\" class=\"btn notification-close\" (click)=\"hideNotification(notification.id)\">\n        <it-icon name=\"close\"></it-icon>\n        <span class=\"visually-hidden\">{{ 'it.core.close-notification' | translate: { title: notification.title } }}</span>\n      </button>\n    }\n  </div>\n}\n", styles: [".notification{z-index:10000}\n"], dependencies: [{ 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: ItNotificationsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.ItNotificationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItNotificationsComponent, isStandalone: true, selector: "it-notifications", inputs: { duration: "duration", position: "position", dismissible: ["dismissible", "dismissible", inputToBoolean] }, ngImport: i0, template: "@for (notification of notifications; track notification.id) {\n  <div\n    [id]=\"notification.id\"\n    class=\"notification {{ notification.position }} {{ notification.type }}\"\n    [class.with-icon]=\"!!notification.icon\"\n    [class.dismissable]=\"notification.dismissible\"\n    role=\"alert\"\n    [attr.aria-labelledby]=\"notification.id + '-title'\">\n    <h2 [id]=\"notification.id + '-title'\" class=\"h5\">\n      @if (notification.icon) {\n        <it-icon [name]=\"notification.icon\"></it-icon>\n      }\n      <ng-container>{{ notification.title }}</ng-container>\n    </h2>\n    @if (notification.message) {\n      <p>{{ notification.message }}</p>\n    }\n    @if (notification.dismissible) {\n      <button type=\"button\" class=\"btn notification-close\" (click)=\"hideNotification(notification.id)\">\n        <it-icon name=\"close\"></it-icon>\n        <span class=\"visually-hidden\">{{ 'it.core.close-notification' | translate: { title: notification.title } }}</span>\n      </button>\n    }\n  </div>\n}\n", styles: [".notification{z-index:10000}\n"], dependencies: [{ 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: ItNotificationsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItNotificationsComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-notifications', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ItIconComponent, TranslateModule], template: "@for (notification of notifications; track notification.id) {\n  <div\n    [id]=\"notification.id\"\n    class=\"notification {{ notification.position }} {{ notification.type }}\"\n    [class.with-icon]=\"!!notification.icon\"\n    [class.dismissable]=\"notification.dismissible\"\n    role=\"alert\"\n    [attr.aria-labelledby]=\"notification.id + '-title'\">\n    <h2 [id]=\"notification.id + '-title'\" class=\"h5\">\n      @if (notification.icon) {\n        <it-icon [name]=\"notification.icon\"></it-icon>\n      }\n      <ng-container>{{ notification.title }}</ng-container>\n    </h2>\n    @if (notification.message) {\n      <p>{{ notification.message }}</p>\n    }\n    @if (notification.dismissible) {\n      <button type=\"button\" class=\"btn notification-close\" (click)=\"hideNotification(notification.id)\">\n        <it-icon name=\"close\"></it-icon>\n        <span class=\"visually-hidden\">{{ 'it.core.close-notification' | translate: { title: notification.title } }}</span>\n      </button>\n    }\n  </div>\n}\n", styles: [".notification{z-index:10000}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.ItNotificationService }], propDecorators: { duration: [{

package/esm2022/lib/components/core/pagination/pagination.component.mjs CHANGED Viewed

@@ -93,10 +93,10 @@ export class ItPaginationComponent {
         event.preventDefault();
         this.changerEvent.emit(value); // emit new changer value
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItPaginationComponent, isStandalone: true, selector: "it-pagination", inputs: { currentPage: "currentPage", pageNumbers: "pageNumbers", visiblePages: "visiblePages", alignment: "alignment", simpleMode: ["simpleMode", "simpleMode", inputToBoolean], textLinks: ["textLinks", "textLinks", inputToBoolean], currentChanger: "currentChanger", changerValues: "changerValues", showJumpToPage: ["showJumpToPage", "showJumpToPage", inputToBoolean] }, outputs: { pageEvent: "pageEvent", changerEvent: "changerEvent" }, usesOnChanges: true, ngImport: i0, template: "<nav\n  class=\"pagination-wrapper\"\n  [class.justify-content-center]=\"alignment === 'center'\"\n  [class.justify-content-end]=\"alignment === 'end'\"\n  [class.pagination-total]=\"totalNumberText.hasChildNodes()\">\n  @if (pages.length) {\n    <ul class=\"pagination\">\n      <li class=\"page-item\" [class.disabled]=\"currentPage < 1\">\n        <a class=\"page-link\" [class.text]=\"textLinks\" href=\"#\" (click)=\"pageChange($event, currentPage)\">\n          @if (!textLinks) {\n            <it-icon name=\"chevron-left\" color=\"primary\"></it-icon>\n          }\n          <span class=\"visually-hidden\">\n            {{ (textLinks ? 'it.core.page' : 'it.core.previous-page') | translate }}\n          </span>\n          @if (textLinks) {\n            {{ 'it.core.previous' | translate }}\n          }\n        </a>\n      </li>\n      @if (simpleMode) {\n        <li class=\"page-item\">\n          <span class=\"page-link\" aria-current=\"page\">{{ currentPage + 1 }}</span>\n        </li>\n        <li class=\"page-item\"><span class=\"page-link\">/</span></li>\n        <li class=\"page-item\">\n          <span class=\"page-link\">{{ pageNumbers }}</span>\n        </li>\n        <li class=\"page-item visually-hidden\">\n          <a class=\"page-link\" href=\"#\" aria-current=\"page\">\n            {{ 'it.core.page-of-total' | translate: { page: currentPage + 1, total: pageNumbers } }}\n          </a>\n        </li>\n      } @else {\n        @if (pageNumbers > visiblePages && pages[0] >= 2) {\n          <li class=\"page-item\">\n            <a class=\"page-link\" href=\"#\" (click)=\"pageChange($event, 1)\">1</a>\n          </li>\n          @if (pages[0] >= 3) {\n            <li class=\"page-item\">\n              <span class=\"page-link\">...</span>\n            </li>\n          }\n        }\n        @for (page of pages; track page) {\n          <li class=\"page-item\">\n            @if (page === currentPage + 1) {\n              <a class=\"page-link\" aria-current=\"page\">\n                <span class=\"d-inline-block d-sm-none\">{{ 'it.core.page' | translate }}</span> {{ page }}\n              </a>\n            } @else {\n              <a class=\"page-link\" href=\"#\" (click)=\"pageChange($event, page)\">{{ page }}</a>\n            }\n          </li>\n        }\n        @if (pageNumbers > visiblePages && pages[pages.length - 1] < pageNumbers) {\n          @if (pages[pages.length - 1] < pageNumbers - 1) {\n            <li class=\"page-item\">\n              <span class=\"page-link\">...</span>\n            </li>\n          }\n          <li class=\"page-item\">\n            <a class=\"page-link\" href=\"#\" (click)=\"pageChange($event, pageNumbers)\">{{ pageNumbers }}</a>\n          </li>\n        }\n      }\n      <li class=\"page-item\" [class.disabled]=\"currentPage >= pageNumbers - 1\">\n        <a class=\"page-link\" [class.text]=\"textLinks\" href=\"#\" (click)=\"pageChange($event, currentPage + 2)\">\n          <span class=\"visually-hidden\">\n            {{ (textLinks ? 'it.core.page' : 'it.core.next-page') | translate }}\n          </span>\n          @if (textLinks) {\n            {{ 'it.core.next' | translate }}\n          } @else {\n            <it-icon name=\"chevron-right\" color=\"primary\"></it-icon>\n          }\n        </a>\n      </li>\n    </ul>\n  }\n\n  @if (currentChanger !== undefined) {\n    <it-dropdown>\n      <span button>{{ currentChanger }} / {{ 'it.core.page' | translate | lowercase }}</span>\n      <ng-container list>\n        @for (value of changerValues; track value) {\n          <it-dropdown-item href=\"#\" externalLink=\"true\" (click)=\"changerChange($event, value)\">\n            {{ value }} / {{ 'it.core.page' | translate | lowercase }}\n          </it-dropdown-item>\n        }\n      </ng-container>\n    </it-dropdown>\n  }\n\n  @if (showJumpToPage) {\n    <it-input\n      type=\"number\"\n      [min]=\"1\"\n      [max]=\"pageNumbers\"\n      [label]=\"('it.core.go-to' | translate) + '...'\"\n      [formControl]=\"jumpToPage\"></it-input>\n  }\n\n  <p [class.d-none]=\"!totalNumberText.hasChildNodes()\" #totalNumberText>\n    <ng-content></ng-content>\n  </p>\n</nav>\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: "pipe", type: LowerCasePipe, name: "lowercase" }, { kind: "ngmodule", type: ItDropdownModule }, { kind: "component", type: i2.ItDropdownComponent, selector: "it-dropdown", inputs: ["mode", "color", "direction", "fullWidth", "megamenu", "dark"], outputs: ["showEvent", "shownEvent", "hideEvent", "hiddenEvent"], exportAs: ["itDropdown"] }, { kind: "component", type: i3.ItDropdownItemComponent, selector: "it-dropdown-item", inputs: ["divider", "active", "large", "iconName", "iconPosition"] }, { kind: "component", type: ItInputComponent, selector: "it-input", inputs: ["type", "placeholder", "description", "readonly", "maxDate", "minDate", "max", "min", "step", "currency", "percentage", "symbol", "adaptive", "autocomplete"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItPaginationComponent, isStandalone: true, selector: "it-pagination", inputs: { currentPage: "currentPage", pageNumbers: "pageNumbers", visiblePages: "visiblePages", alignment: "alignment", simpleMode: ["simpleMode", "simpleMode", inputToBoolean], textLinks: ["textLinks", "textLinks", inputToBoolean], currentChanger: "currentChanger", changerValues: "changerValues", showJumpToPage: ["showJumpToPage", "showJumpToPage", inputToBoolean] }, outputs: { pageEvent: "pageEvent", changerEvent: "changerEvent" }, usesOnChanges: true, ngImport: i0, template: "<nav\n  class=\"pagination-wrapper\"\n  [class.justify-content-center]=\"alignment === 'center'\"\n  [class.justify-content-end]=\"alignment === 'end'\"\n  [class.pagination-total]=\"totalNumberText.hasChildNodes()\">\n  @if (pages.length) {\n    <ul class=\"pagination\">\n      <li class=\"page-item\" [class.disabled]=\"currentPage < 1\">\n        <a class=\"page-link\" [class.text]=\"textLinks\" href=\"#\" (click)=\"pageChange($event, currentPage)\">\n          @if (!textLinks) {\n            <it-icon name=\"chevron-left\" color=\"primary\"></it-icon>\n          }\n          <span class=\"visually-hidden\">\n            {{ (textLinks ? 'it.core.page' : 'it.core.previous-page') | translate }}\n          </span>\n          @if (textLinks) {\n            {{ 'it.core.previous' | translate }}\n          }\n        </a>\n      </li>\n      @if (simpleMode) {\n        <li class=\"page-item\">\n          <span class=\"page-link\" aria-current=\"page\">{{ currentPage + 1 }}</span>\n        </li>\n        <li class=\"page-item\"><span class=\"page-link\">/</span></li>\n        <li class=\"page-item\">\n          <span class=\"page-link\">{{ pageNumbers }}</span>\n        </li>\n        <li class=\"page-item visually-hidden\">\n          <a class=\"page-link\" href=\"#\" aria-current=\"page\">\n            {{ 'it.core.page-of-total' | translate: { page: currentPage + 1, total: pageNumbers } }}\n          </a>\n        </li>\n      } @else {\n        @if (pageNumbers > visiblePages && pages[0] >= 2) {\n          <li class=\"page-item\">\n            <a class=\"page-link\" href=\"#\" (click)=\"pageChange($event, 1)\">1</a>\n          </li>\n          @if (pages[0] >= 3) {\n            <li class=\"page-item\">\n              <span class=\"page-link\">...</span>\n            </li>\n          }\n        }\n        @for (page of pages; track page) {\n          <li class=\"page-item\">\n            @if (page === currentPage + 1) {\n              <a class=\"page-link\" aria-current=\"page\">\n                <span class=\"d-inline-block d-sm-none\">{{ 'it.core.page' | translate }}</span> {{ page }}\n              </a>\n            } @else {\n              <a class=\"page-link\" href=\"#\" (click)=\"pageChange($event, page)\">{{ page }}</a>\n            }\n          </li>\n        }\n        @if (pageNumbers > visiblePages && pages[pages.length - 1] < pageNumbers) {\n          @if (pages[pages.length - 1] < pageNumbers - 1) {\n            <li class=\"page-item\">\n              <span class=\"page-link\">...</span>\n            </li>\n          }\n          <li class=\"page-item\">\n            <a class=\"page-link\" href=\"#\" (click)=\"pageChange($event, pageNumbers)\">{{ pageNumbers }}</a>\n          </li>\n        }\n      }\n      <li class=\"page-item\" [class.disabled]=\"currentPage >= pageNumbers - 1\">\n        <a class=\"page-link\" [class.text]=\"textLinks\" href=\"#\" (click)=\"pageChange($event, currentPage + 2)\">\n          <span class=\"visually-hidden\">\n            {{ (textLinks ? 'it.core.page' : 'it.core.next-page') | translate }}\n          </span>\n          @if (textLinks) {\n            {{ 'it.core.next' | translate }}\n          } @else {\n            <it-icon name=\"chevron-right\" color=\"primary\"></it-icon>\n          }\n        </a>\n      </li>\n    </ul>\n  }\n\n  @if (currentChanger !== undefined) {\n    <it-dropdown>\n      <span button>{{ currentChanger }} / {{ 'it.core.page' | translate | lowercase }}</span>\n      <ng-container list>\n        @for (value of changerValues; track value) {\n          <it-dropdown-item href=\"#\" externalLink=\"true\" (click)=\"changerChange($event, value)\">\n            {{ value }} / {{ 'it.core.page' | translate | lowercase }}\n          </it-dropdown-item>\n        }\n      </ng-container>\n    </it-dropdown>\n  }\n\n  @if (showJumpToPage) {\n    <it-input\n      type=\"number\"\n      [min]=\"1\"\n      [max]=\"pageNumbers\"\n      [label]=\"('it.core.go-to' | translate) + '...'\"\n      [formControl]=\"jumpToPage\"></it-input>\n  }\n\n  <p [class.d-none]=\"!totalNumberText.hasChildNodes()\" #totalNumberText>\n    <ng-content></ng-content>\n  </p>\n</nav>\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: "pipe", type: LowerCasePipe, name: "lowercase" }, { kind: "ngmodule", type: ItDropdownModule }, { kind: "component", type: i2.ItDropdownComponent, selector: "it-dropdown", inputs: ["mode", "color", "direction", "fullWidth", "megamenu", "dark"], outputs: ["showEvent", "shownEvent", "hideEvent", "hiddenEvent"], exportAs: ["itDropdown"] }, { kind: "component", type: i3.ItDropdownItemComponent, selector: "it-dropdown-item", inputs: ["divider", "active", "large", "iconName", "iconPosition"] }, { kind: "component", type: ItInputComponent, selector: "it-input", inputs: ["type", "placeholder", "description", "readonly", "maxDate", "minDate", "max", "min", "step", "currency", "percentage", "symbol", "adaptive", "autocomplete"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItPaginationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItPaginationComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-pagination', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ItIconComponent, TranslateModule, LowerCasePipe, ItDropdownModule, ItInputComponent, ReactiveFormsModule], template: "<nav\n  class=\"pagination-wrapper\"\n  [class.justify-content-center]=\"alignment === 'center'\"\n  [class.justify-content-end]=\"alignment === 'end'\"\n  [class.pagination-total]=\"totalNumberText.hasChildNodes()\">\n  @if (pages.length) {\n    <ul class=\"pagination\">\n      <li class=\"page-item\" [class.disabled]=\"currentPage < 1\">\n        <a class=\"page-link\" [class.text]=\"textLinks\" href=\"#\" (click)=\"pageChange($event, currentPage)\">\n          @if (!textLinks) {\n            <it-icon name=\"chevron-left\" color=\"primary\"></it-icon>\n          }\n          <span class=\"visually-hidden\">\n            {{ (textLinks ? 'it.core.page' : 'it.core.previous-page') | translate }}\n          </span>\n          @if (textLinks) {\n            {{ 'it.core.previous' | translate }}\n          }\n        </a>\n      </li>\n      @if (simpleMode) {\n        <li class=\"page-item\">\n          <span class=\"page-link\" aria-current=\"page\">{{ currentPage + 1 }}</span>\n        </li>\n        <li class=\"page-item\"><span class=\"page-link\">/</span></li>\n        <li class=\"page-item\">\n          <span class=\"page-link\">{{ pageNumbers }}</span>\n        </li>\n        <li class=\"page-item visually-hidden\">\n          <a class=\"page-link\" href=\"#\" aria-current=\"page\">\n            {{ 'it.core.page-of-total' | translate: { page: currentPage + 1, total: pageNumbers } }}\n          </a>\n        </li>\n      } @else {\n        @if (pageNumbers > visiblePages && pages[0] >= 2) {\n          <li class=\"page-item\">\n            <a class=\"page-link\" href=\"#\" (click)=\"pageChange($event, 1)\">1</a>\n          </li>\n          @if (pages[0] >= 3) {\n            <li class=\"page-item\">\n              <span class=\"page-link\">...</span>\n            </li>\n          }\n        }\n        @for (page of pages; track page) {\n          <li class=\"page-item\">\n            @if (page === currentPage + 1) {\n              <a class=\"page-link\" aria-current=\"page\">\n                <span class=\"d-inline-block d-sm-none\">{{ 'it.core.page' | translate }}</span> {{ page }}\n              </a>\n            } @else {\n              <a class=\"page-link\" href=\"#\" (click)=\"pageChange($event, page)\">{{ page }}</a>\n            }\n          </li>\n        }\n        @if (pageNumbers > visiblePages && pages[pages.length - 1] < pageNumbers) {\n          @if (pages[pages.length - 1] < pageNumbers - 1) {\n            <li class=\"page-item\">\n              <span class=\"page-link\">...</span>\n            </li>\n          }\n          <li class=\"page-item\">\n            <a class=\"page-link\" href=\"#\" (click)=\"pageChange($event, pageNumbers)\">{{ pageNumbers }}</a>\n          </li>\n        }\n      }\n      <li class=\"page-item\" [class.disabled]=\"currentPage >= pageNumbers - 1\">\n        <a class=\"page-link\" [class.text]=\"textLinks\" href=\"#\" (click)=\"pageChange($event, currentPage + 2)\">\n          <span class=\"visually-hidden\">\n            {{ (textLinks ? 'it.core.page' : 'it.core.next-page') | translate }}\n          </span>\n          @if (textLinks) {\n            {{ 'it.core.next' | translate }}\n          } @else {\n            <it-icon name=\"chevron-right\" color=\"primary\"></it-icon>\n          }\n        </a>\n      </li>\n    </ul>\n  }\n\n  @if (currentChanger !== undefined) {\n    <it-dropdown>\n      <span button>{{ currentChanger }} / {{ 'it.core.page' | translate | lowercase }}</span>\n      <ng-container list>\n        @for (value of changerValues; track value) {\n          <it-dropdown-item href=\"#\" externalLink=\"true\" (click)=\"changerChange($event, value)\">\n            {{ value }} / {{ 'it.core.page' | translate | lowercase }}\n          </it-dropdown-item>\n        }\n      </ng-container>\n    </it-dropdown>\n  }\n\n  @if (showJumpToPage) {\n    <it-input\n      type=\"number\"\n      [min]=\"1\"\n      [max]=\"pageNumbers\"\n      [label]=\"('it.core.go-to' | translate) + '...'\"\n      [formControl]=\"jumpToPage\"></it-input>\n  }\n\n  <p [class.d-none]=\"!totalNumberText.hasChildNodes()\" #totalNumberText>\n    <ng-content></ng-content>\n  </p>\n</nav>\n" }]
         }], ctorParameters: () => [], propDecorators: { currentPage: [{

package/esm2022/lib/components/core/popover/popover.directive.mjs CHANGED Viewed

@@ -138,10 +138,10 @@ export class ItPopoverDirective {
     update() {
         this.popover?.disable();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItPopoverDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.1.2", type: ItPopoverDirective, isStandalone: true, selector: "[itPopover]", inputs: { content: ["itPopover", "content"], popoverTitle: "popoverTitle", popoverPlacement: "popoverPlacement", popoverContainer: "popoverContainer", popoverHtml: ["popoverHtml", "popoverHtml", inputToBoolean], popoverTrigger: "popoverTrigger" }, outputs: { showEvent: "showEvent", shownEvent: "shownEvent", hideEvent: "hideEvent", hiddenEvent: "hiddenEvent", insertedEvent: "insertedEvent" }, exportAs: ["itPopover"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItPopoverDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.6", type: ItPopoverDirective, isStandalone: true, selector: "[itPopover]", inputs: { content: ["itPopover", "content"], popoverTitle: "popoverTitle", popoverPlacement: "popoverPlacement", popoverContainer: "popoverContainer", popoverHtml: ["popoverHtml", "popoverHtml", inputToBoolean], popoverTrigger: "popoverTrigger" }, outputs: { showEvent: "showEvent", shownEvent: "shownEvent", hideEvent: "hideEvent", hiddenEvent: "hiddenEvent", insertedEvent: "insertedEvent" }, exportAs: ["itPopover"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItPopoverDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItPopoverDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,

package/esm2022/lib/components/core/progress-bar/progress-bar.component.mjs CHANGED Viewed

@@ -13,10 +13,10 @@ export class ItProgressBarComponent {
         }
         return ` bg-${this.color}`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItProgressBarComponent, isStandalone: true, selector: "it-progress-bar", inputs: { value: "value", showLabel: ["showLabel", "showLabel", inputToBoolean], indeterminate: ["indeterminate", "indeterminate", inputToBoolean], color: "color" }, ngImport: i0, template: "<div class=\"progress-bar-wrapper\">\n  @if (showLabel) {\n    <div class=\"progress-bar-label\">\n      <span class=\"visually-hidden\">{{ 'it.core.progress' | translate }} </span>{{ value }}%\n    </div>\n  }\n  <div class=\"progress\" [class.progress-color]=\"!!color\" [class.progress-indeterminate]=\"indeterminate\">\n    @if (indeterminate) {\n      <div class=\"progress-bar{{ bgColor }}\" role=\"progressbar\"></div>\n    } @else {\n      <div\n        class=\"progress-bar{{ bgColor }}\"\n        role=\"progressbar\"\n        [style.width.%]=\"value\"\n        [attr.aria-valuenow]=\"value\"\n        aria-valuemin=\"0\"\n        aria-valuemax=\"100\"></div>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItProgressBarComponent, isStandalone: true, selector: "it-progress-bar", inputs: { value: "value", showLabel: ["showLabel", "showLabel", inputToBoolean], indeterminate: ["indeterminate", "indeterminate", inputToBoolean], color: "color" }, ngImport: i0, template: "<div class=\"progress-bar-wrapper\">\n  @if (showLabel) {\n    <div class=\"progress-bar-label\">\n      <span class=\"visually-hidden\">{{ 'it.core.progress' | translate }} </span>{{ value }}%\n    </div>\n  }\n  <div class=\"progress\" [class.progress-color]=\"!!color\" [class.progress-indeterminate]=\"indeterminate\">\n    @if (indeterminate) {\n      <div class=\"progress-bar{{ bgColor }}\" role=\"progressbar\"></div>\n    } @else {\n      <div\n        class=\"progress-bar{{ bgColor }}\"\n        role=\"progressbar\"\n        [style.width.%]=\"value\"\n        [attr.aria-valuenow]=\"value\"\n        aria-valuemin=\"0\"\n        aria-valuemax=\"100\"></div>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItProgressBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItProgressBarComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-progress-bar', changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule], template: "<div class=\"progress-bar-wrapper\">\n  @if (showLabel) {\n    <div class=\"progress-bar-label\">\n      <span class=\"visually-hidden\">{{ 'it.core.progress' | translate }} </span>{{ value }}%\n    </div>\n  }\n  <div class=\"progress\" [class.progress-color]=\"!!color\" [class.progress-indeterminate]=\"indeterminate\">\n    @if (indeterminate) {\n      <div class=\"progress-bar{{ bgColor }}\" role=\"progressbar\"></div>\n    } @else {\n      <div\n        class=\"progress-bar{{ bgColor }}\"\n        role=\"progressbar\"\n        [style.width.%]=\"value\"\n        [attr.aria-valuenow]=\"value\"\n        aria-valuemin=\"0\"\n        aria-valuemax=\"100\"></div>\n    }\n  </div>\n</div>\n" }]
         }], propDecorators: { value: [{

package/esm2022/lib/components/core/progress-button/progress-button.component.mjs CHANGED Viewed

@@ -11,10 +11,10 @@ export class ItProgressButtonComponent {
     get isIndeterminate() {
         return typeof this.progress !== 'number' && !!this.progress;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItProgressButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItProgressButtonComponent, isStandalone: true, selector: "button[itButton][progress]", inputs: { progress: "progress", progressColor: "progressColor" }, ngImport: i0, template: "<ng-content></ng-content>\n\n@if (isProgress) {\n  <it-progress-bar [value]=\"progressValue\" [indeterminate]=\"isIndeterminate\" [color]=\"progressColor\"></it-progress-bar>\n}\n", dependencies: [{ kind: "component", type: ItProgressBarComponent, selector: "it-progress-bar", inputs: ["value", "showLabel", "indeterminate", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItProgressButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItProgressButtonComponent, isStandalone: true, selector: "button[itButton][progress]", inputs: { progress: "progress", progressColor: "progressColor" }, ngImport: i0, template: "<ng-content></ng-content>\n\n@if (isProgress) {\n  <it-progress-bar [value]=\"progressValue\" [indeterminate]=\"isIndeterminate\" [color]=\"progressColor\"></it-progress-bar>\n}\n", dependencies: [{ kind: "component", type: ItProgressBarComponent, selector: "it-progress-bar", inputs: ["value", "showLabel", "indeterminate", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItProgressButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItProgressButtonComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'button[itButton][progress]', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ItProgressBarComponent], template: "<ng-content></ng-content>\n\n@if (isProgress) {\n  <it-progress-bar [value]=\"progressValue\" [indeterminate]=\"isIndeterminate\" [color]=\"progressColor\"></it-progress-bar>\n}\n" }]
         }], propDecorators: { progress: [{

package/esm2022/lib/components/core/spinner/spinner.component.mjs CHANGED Viewed

@@ -11,10 +11,10 @@ export class ItSpinnerComponent {
          */
         this.active = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItSpinnerComponent, isStandalone: true, selector: "it-spinner", inputs: { active: ["active", "active", inputToBoolean], small: ["small", "small", inputToBoolean], double: ["double", "double", inputToBoolean] }, ngImport: i0, template: "<div class=\"progress-spinner\" [class.progress-spinner-double]=\"double\" [class.progress-spinner-active]=\"active\" [class.size-sm]=\"small\">\n  @if (double) {\n    <div class=\"progress-spinner-inner\"></div>\n    <div class=\"progress-spinner-inner\"></div>\n  }\n  <span class=\"visually-hidden\">{{ 'it.core.loading' | translate }}...</span>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItSpinnerComponent, isStandalone: true, selector: "it-spinner", inputs: { active: ["active", "active", inputToBoolean], small: ["small", "small", inputToBoolean], double: ["double", "double", inputToBoolean] }, ngImport: i0, template: "<div class=\"progress-spinner\" [class.progress-spinner-double]=\"double\" [class.progress-spinner-active]=\"active\" [class.size-sm]=\"small\">\n  @if (double) {\n    <div class=\"progress-spinner-inner\"></div>\n    <div class=\"progress-spinner-inner\"></div>\n  }\n  <span class=\"visually-hidden\">{{ 'it.core.loading' | translate }}...</span>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItSpinnerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItSpinnerComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-spinner', changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule], template: "<div class=\"progress-spinner\" [class.progress-spinner-double]=\"double\" [class.progress-spinner-active]=\"active\" [class.size-sm]=\"small\">\n  @if (double) {\n    <div class=\"progress-spinner-inner\"></div>\n    <div class=\"progress-spinner-inner\"></div>\n  }\n  <span class=\"visually-hidden\">{{ 'it.core.loading' | translate }}...</span>\n</div>\n" }]
         }], propDecorators: { active: [{

package/esm2022/lib/components/core/steppers/steppers-container/steppers-container.component.mjs CHANGED Viewed

@@ -49,10 +49,10 @@ export class ItSteppersContainerComponent {
     ngOnDestroy() {
         this.stepsSubscriptions?.forEach(step => step.unsubscribe());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItSteppersContainerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItSteppersContainerComponent, isStandalone: true, selector: "it-steppers-container", inputs: { activeStep: "activeStep", showHeader: ["showHeader", "showHeader", inputToBoolean], dark: ["dark", "dark", inputToBoolean], steppersNumber: ["steppersNumber", "steppersNumber", inputToBoolean], progressStyle: "progressStyle", progressColor: "progressColor", showBackButton: ["showBackButton", "showBackButton", inputToBoolean], disableBackButton: ["disableBackButton", "disableBackButton", inputToBoolean], showForwardButton: ["showForwardButton", "showForwardButton", inputToBoolean], disableForwardButton: ["disableForwardButton", "disableForwardButton", inputToBoolean], showConfirmButton: ["showConfirmButton", "showConfirmButton", inputToBoolean], disableConfirmButton: ["disableConfirmButton", "disableConfirmButton", inputToBoolean], confirmLoading: ["confirmLoading", "confirmLoading", inputToBoolean], showSaveButton: ["showSaveButton", "showSaveButton", inputToBoolean], disableSaveButton: ["disableSaveButton", "disableSaveButton", inputToBoolean], saveLoading: ["saveLoading", "saveLoading", inputToBoolean] }, outputs: { backClick: "backClick", forwardClick: "forwardClick", confirmClick: "confirmClick", saveClick: "saveClick" }, queries: [{ propertyName: "steps", predicate: ItSteppersItemComponent }], ngImport: i0, template: "<div class=\"steppers\" [class.bg-dark]=\"dark\">\n  @if (showHeader) {\n    <div class=\"steppers-header\">\n      @if (steps) {\n        <ul>\n          @for (step of steps; track step.id; let i = $index) {\n            <li [class.confirmed]=\"i < activeStep\" [class.active]=\"i === activeStep\" [class.no-line]=\"i === activeStep && steppersNumber\">\n              @if (step.icon && !steppersNumber) {\n                <it-icon [labelWaria]=\"'it.core.confirmed' | translate\" [name]=\"step.icon\"></it-icon>\n              }\n              @if (steppersNumber) {\n                <span class=\"steppers-number\">\n                  @if (i < activeStep) {\n                    <ng-container *ngTemplateOutlet=\"checkIcon\"></ng-container>\n                  } @else {\n                    <span class=\"visually-hidden\">{{ 'it.core.step' | translate }} </span>{{ i + 1 }}\n                  }\n                </span>\n              }\n              {{ step.label }}\n              @if (i < activeStep && !steppersNumber) {\n                <ng-container *ngTemplateOutlet=\"checkIcon\"></ng-container>\n              }\n              @if (i === activeStep) {\n                <span class=\"visually-hidden\">{{ 'it.core.active' | translate }}</span>\n              }\n            </li>\n          }\n        </ul>\n      }\n      @if (steps) {\n        <span class=\"steppers-index\" aria-hidden=\"true\">\n          @if (!steppersNumber) {\n            {{ activeStep + 1 + '/' + steps.length }}\n          } @else {\n            @for (step of steps; track step.id; let i = $index) {\n              <span [class.active]=\"i === activeStep\">{{ i + 1 }}</span>\n            }\n          }\n        </span>\n      }\n    </div>\n  }\n\n  @if (steps?.get(activeStep); as step) {\n    <div class=\"steppers-content\" aria-live=\"polite\">\n      <ng-container *ngTemplateOutlet=\"step.htmlContent\"></ng-container>\n    </div>\n  }\n\n  @if (showBackButton || showSaveButton || showForwardButton || showConfirmButton || !!progressStyle) {\n    <nav class=\"steppers-nav\">\n      @if (showBackButton) {\n        <button\n          type=\"button\"\n          itButton=\"outline-primary\"\n          size=\"sm\"\n          class=\"steppers-btn-prev\"\n          [disabled]=\"disableBackButton\"\n          (click)=\"backClick.emit(activeStep)\">\n          <it-icon [labelWaria]=\"'it.core.back' | translate\" name=\"chevron-left\" color=\"primary\"></it-icon>\n          {{ 'it.core.back' | translate }}\n        </button>\n      }\n      @if (!!progressStyle && steps) {\n        @if (progressStyle === 'dots') {\n          <ul class=\"steppers-dots\">\n            @for (step of steps; track step; let i = $index) {\n              <li [class.done]=\"i < activeStep\">\n                <span class=\"visually-hidden\">\n                  {{ 'it.core.step-of' | translate: { current: activeStep + 1, available: steps?.length } }}\n                  {{ i < activeStep ? '- ' + ('it.core.confirmed' | translate) : '' }}\n                </span>\n              </li>\n            }\n          </ul>\n        } @else {\n          <div class=\"steppers-progress\">\n            <it-progress-bar [color]=\"progressColor\" [value]=\"(activeStep / (steps?.length || 1)) * 100\"></it-progress-bar>\n          </div>\n        }\n      }\n      @if (showSaveButton) {\n        <button\n          type=\"button\"\n          itButton=\"primary\"\n          size=\"sm\"\n          class=\"steppers-btn-save\"\n          [progress]=\"saveLoading\"\n          [disabled]=\"saveLoading || disableSaveButton\"\n          (click)=\"saveClick.emit(activeStep)\">\n          {{ 'it.general.save' | translate }}\n        </button>\n      }\n      @if (showForwardButton) {\n        <button\n          type=\"button\"\n          itButton=\"outline-primary\"\n          size=\"sm\"\n          class=\"steppers-btn-next\"\n          [disabled]=\"disableForwardButton\"\n          (click)=\"forwardClick.emit(activeStep)\">\n          {{ 'it.core.forward' | translate }}\n          <it-icon [labelWaria]=\"'it.core.forward' | translate\" name=\"chevron-right\" color=\"primary\"></it-icon>\n        </button>\n      }\n      @if (showConfirmButton) {\n        <button\n          type=\"button\"\n          itButton=\"primary\"\n          size=\"sm\"\n          class=\"steppers-btn-confirm d-lg-block\"\n          [progress]=\"confirmLoading\"\n          [disabled]=\"confirmLoading || disableConfirmButton\"\n          (click)=\"confirmClick.emit(activeStep)\">\n          {{ 'it.core.confirm' | translate }}\n        </button>\n      }\n    </nav>\n  }\n</div>\n\n<ng-template #checkIcon>\n  <it-icon [labelWaria]=\"'it.core.confirmed' | translate\" name=\"check\" class=\"steppers-success\"></it-icon>\n  <span class=\"visually-hidden\">{{ 'it.core.confirmed' | translate }}</span>\n</ng-template>\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: ItButtonDirective, selector: "[itButton]", inputs: ["itButton", "size", "block", "disabled", "type"], exportAs: ["itButton"] }, { kind: "component", type: ItProgressBarComponent, selector: "it-progress-bar", inputs: ["value", "showLabel", "indeterminate", "color"] }, { kind: "component", type: ItProgressButtonComponent, selector: "button[itButton][progress]", inputs: ["progress", "progressColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItSteppersContainerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItSteppersContainerComponent, isStandalone: true, selector: "it-steppers-container", inputs: { activeStep: "activeStep", showHeader: ["showHeader", "showHeader", inputToBoolean], dark: ["dark", "dark", inputToBoolean], steppersNumber: ["steppersNumber", "steppersNumber", inputToBoolean], progressStyle: "progressStyle", progressColor: "progressColor", showBackButton: ["showBackButton", "showBackButton", inputToBoolean], disableBackButton: ["disableBackButton", "disableBackButton", inputToBoolean], showForwardButton: ["showForwardButton", "showForwardButton", inputToBoolean], disableForwardButton: ["disableForwardButton", "disableForwardButton", inputToBoolean], showConfirmButton: ["showConfirmButton", "showConfirmButton", inputToBoolean], disableConfirmButton: ["disableConfirmButton", "disableConfirmButton", inputToBoolean], confirmLoading: ["confirmLoading", "confirmLoading", inputToBoolean], showSaveButton: ["showSaveButton", "showSaveButton", inputToBoolean], disableSaveButton: ["disableSaveButton", "disableSaveButton", inputToBoolean], saveLoading: ["saveLoading", "saveLoading", inputToBoolean] }, outputs: { backClick: "backClick", forwardClick: "forwardClick", confirmClick: "confirmClick", saveClick: "saveClick" }, queries: [{ propertyName: "steps", predicate: ItSteppersItemComponent }], ngImport: i0, template: "<div class=\"steppers\" [class.bg-dark]=\"dark\">\n  @if (showHeader) {\n    <div class=\"steppers-header\">\n      @if (steps) {\n        <ul>\n          @for (step of steps; track step.id; let i = $index) {\n            <li [class.confirmed]=\"i < activeStep\" [class.active]=\"i === activeStep\" [class.no-line]=\"i === activeStep && steppersNumber\">\n              @if (step.icon && !steppersNumber) {\n                <it-icon [labelWaria]=\"'it.core.confirmed' | translate\" [name]=\"step.icon\"></it-icon>\n              }\n              @if (steppersNumber) {\n                <span class=\"steppers-number\">\n                  @if (i < activeStep) {\n                    <ng-container *ngTemplateOutlet=\"checkIcon\"></ng-container>\n                  } @else {\n                    <span class=\"visually-hidden\">{{ 'it.core.step' | translate }} </span>{{ i + 1 }}\n                  }\n                </span>\n              }\n              {{ step.label }}\n              @if (i < activeStep && !steppersNumber) {\n                <ng-container *ngTemplateOutlet=\"checkIcon\"></ng-container>\n              }\n              @if (i === activeStep) {\n                <span class=\"visually-hidden\">{{ 'it.core.active' | translate }}</span>\n              }\n            </li>\n          }\n        </ul>\n      }\n      @if (steps) {\n        <span class=\"steppers-index\" aria-hidden=\"true\">\n          @if (!steppersNumber) {\n            {{ activeStep + 1 + '/' + steps.length }}\n          } @else {\n            @for (step of steps; track step.id; let i = $index) {\n              <span [class.active]=\"i === activeStep\">{{ i + 1 }}</span>\n            }\n          }\n        </span>\n      }\n    </div>\n  }\n\n  @if (steps?.get(activeStep); as step) {\n    <div class=\"steppers-content\" aria-live=\"polite\">\n      <ng-container *ngTemplateOutlet=\"step.htmlContent\"></ng-container>\n    </div>\n  }\n\n  @if (showBackButton || showSaveButton || showForwardButton || showConfirmButton || !!progressStyle) {\n    <nav class=\"steppers-nav\">\n      @if (showBackButton) {\n        <button\n          type=\"button\"\n          itButton=\"outline-primary\"\n          size=\"sm\"\n          class=\"steppers-btn-prev\"\n          [disabled]=\"disableBackButton\"\n          (click)=\"backClick.emit(activeStep)\">\n          <it-icon [labelWaria]=\"'it.core.back' | translate\" name=\"chevron-left\" color=\"primary\"></it-icon>\n          {{ 'it.core.back' | translate }}\n        </button>\n      }\n      @if (!!progressStyle && steps) {\n        @if (progressStyle === 'dots') {\n          <ul class=\"steppers-dots\">\n            @for (step of steps; track step; let i = $index) {\n              <li [class.done]=\"i < activeStep\">\n                <span class=\"visually-hidden\">\n                  {{ 'it.core.step-of' | translate: { current: activeStep + 1, available: steps?.length } }}\n                  {{ i < activeStep ? '- ' + ('it.core.confirmed' | translate) : '' }}\n                </span>\n              </li>\n            }\n          </ul>\n        } @else {\n          <div class=\"steppers-progress\">\n            <it-progress-bar [color]=\"progressColor\" [value]=\"(activeStep / (steps?.length || 1)) * 100\"></it-progress-bar>\n          </div>\n        }\n      }\n      @if (showSaveButton) {\n        <button\n          type=\"button\"\n          itButton=\"primary\"\n          size=\"sm\"\n          class=\"steppers-btn-save\"\n          [progress]=\"saveLoading\"\n          [disabled]=\"saveLoading || disableSaveButton\"\n          (click)=\"saveClick.emit(activeStep)\">\n          {{ 'it.general.save' | translate }}\n        </button>\n      }\n      @if (showForwardButton) {\n        <button\n          type=\"button\"\n          itButton=\"outline-primary\"\n          size=\"sm\"\n          class=\"steppers-btn-next\"\n          [disabled]=\"disableForwardButton\"\n          (click)=\"forwardClick.emit(activeStep)\">\n          {{ 'it.core.forward' | translate }}\n          <it-icon [labelWaria]=\"'it.core.forward' | translate\" name=\"chevron-right\" color=\"primary\"></it-icon>\n        </button>\n      }\n      @if (showConfirmButton) {\n        <button\n          type=\"button\"\n          itButton=\"primary\"\n          size=\"sm\"\n          class=\"steppers-btn-confirm d-lg-block\"\n          [progress]=\"confirmLoading\"\n          [disabled]=\"confirmLoading || disableConfirmButton\"\n          (click)=\"confirmClick.emit(activeStep)\">\n          {{ 'it.core.confirm' | translate }}\n        </button>\n      }\n    </nav>\n  }\n</div>\n\n<ng-template #checkIcon>\n  <it-icon [labelWaria]=\"'it.core.confirmed' | translate\" name=\"check\" class=\"steppers-success\"></it-icon>\n  <span class=\"visually-hidden\">{{ 'it.core.confirmed' | translate }}</span>\n</ng-template>\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: ItButtonDirective, selector: "[itButton]", inputs: ["itButton", "size", "block", "disabled", "type"], exportAs: ["itButton"] }, { kind: "component", type: ItProgressBarComponent, selector: "it-progress-bar", inputs: ["value", "showLabel", "indeterminate", "color"] }, { kind: "component", type: ItProgressButtonComponent, selector: "button[itButton][progress]", inputs: ["progress", "progressColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItSteppersContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItSteppersContainerComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-steppers-container', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ItIconComponent, NgTemplateOutlet, TranslateModule, ItButtonDirective, ItProgressBarComponent, ItProgressButtonComponent], template: "<div class=\"steppers\" [class.bg-dark]=\"dark\">\n  @if (showHeader) {\n    <div class=\"steppers-header\">\n      @if (steps) {\n        <ul>\n          @for (step of steps; track step.id; let i = $index) {\n            <li [class.confirmed]=\"i < activeStep\" [class.active]=\"i === activeStep\" [class.no-line]=\"i === activeStep && steppersNumber\">\n              @if (step.icon && !steppersNumber) {\n                <it-icon [labelWaria]=\"'it.core.confirmed' | translate\" [name]=\"step.icon\"></it-icon>\n              }\n              @if (steppersNumber) {\n                <span class=\"steppers-number\">\n                  @if (i < activeStep) {\n                    <ng-container *ngTemplateOutlet=\"checkIcon\"></ng-container>\n                  } @else {\n                    <span class=\"visually-hidden\">{{ 'it.core.step' | translate }} </span>{{ i + 1 }}\n                  }\n                </span>\n              }\n              {{ step.label }}\n              @if (i < activeStep && !steppersNumber) {\n                <ng-container *ngTemplateOutlet=\"checkIcon\"></ng-container>\n              }\n              @if (i === activeStep) {\n                <span class=\"visually-hidden\">{{ 'it.core.active' | translate }}</span>\n              }\n            </li>\n          }\n        </ul>\n      }\n      @if (steps) {\n        <span class=\"steppers-index\" aria-hidden=\"true\">\n          @if (!steppersNumber) {\n            {{ activeStep + 1 + '/' + steps.length }}\n          } @else {\n            @for (step of steps; track step.id; let i = $index) {\n              <span [class.active]=\"i === activeStep\">{{ i + 1 }}</span>\n            }\n          }\n        </span>\n      }\n    </div>\n  }\n\n  @if (steps?.get(activeStep); as step) {\n    <div class=\"steppers-content\" aria-live=\"polite\">\n      <ng-container *ngTemplateOutlet=\"step.htmlContent\"></ng-container>\n    </div>\n  }\n\n  @if (showBackButton || showSaveButton || showForwardButton || showConfirmButton || !!progressStyle) {\n    <nav class=\"steppers-nav\">\n      @if (showBackButton) {\n        <button\n          type=\"button\"\n          itButton=\"outline-primary\"\n          size=\"sm\"\n          class=\"steppers-btn-prev\"\n          [disabled]=\"disableBackButton\"\n          (click)=\"backClick.emit(activeStep)\">\n          <it-icon [labelWaria]=\"'it.core.back' | translate\" name=\"chevron-left\" color=\"primary\"></it-icon>\n          {{ 'it.core.back' | translate }}\n        </button>\n      }\n      @if (!!progressStyle && steps) {\n        @if (progressStyle === 'dots') {\n          <ul class=\"steppers-dots\">\n            @for (step of steps; track step; let i = $index) {\n              <li [class.done]=\"i < activeStep\">\n                <span class=\"visually-hidden\">\n                  {{ 'it.core.step-of' | translate: { current: activeStep + 1, available: steps?.length } }}\n                  {{ i < activeStep ? '- ' + ('it.core.confirmed' | translate) : '' }}\n                </span>\n              </li>\n            }\n          </ul>\n        } @else {\n          <div class=\"steppers-progress\">\n            <it-progress-bar [color]=\"progressColor\" [value]=\"(activeStep / (steps?.length || 1)) * 100\"></it-progress-bar>\n          </div>\n        }\n      }\n      @if (showSaveButton) {\n        <button\n          type=\"button\"\n          itButton=\"primary\"\n          size=\"sm\"\n          class=\"steppers-btn-save\"\n          [progress]=\"saveLoading\"\n          [disabled]=\"saveLoading || disableSaveButton\"\n          (click)=\"saveClick.emit(activeStep)\">\n          {{ 'it.general.save' | translate }}\n        </button>\n      }\n      @if (showForwardButton) {\n        <button\n          type=\"button\"\n          itButton=\"outline-primary\"\n          size=\"sm\"\n          class=\"steppers-btn-next\"\n          [disabled]=\"disableForwardButton\"\n          (click)=\"forwardClick.emit(activeStep)\">\n          {{ 'it.core.forward' | translate }}\n          <it-icon [labelWaria]=\"'it.core.forward' | translate\" name=\"chevron-right\" color=\"primary\"></it-icon>\n        </button>\n      }\n      @if (showConfirmButton) {\n        <button\n          type=\"button\"\n          itButton=\"primary\"\n          size=\"sm\"\n          class=\"steppers-btn-confirm d-lg-block\"\n          [progress]=\"confirmLoading\"\n          [disabled]=\"confirmLoading || disableConfirmButton\"\n          (click)=\"confirmClick.emit(activeStep)\">\n          {{ 'it.core.confirm' | translate }}\n        </button>\n      }\n    </nav>\n  }\n</div>\n\n<ng-template #checkIcon>\n  <it-icon [labelWaria]=\"'it.core.confirmed' | translate\" name=\"check\" class=\"steppers-success\"></it-icon>\n  <span class=\"visually-hidden\">{{ 'it.core.confirmed' | translate }}</span>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { activeStep: [{

package/esm2022/lib/components/core/steppers/steppers-item/steppers-item.component.mjs CHANGED Viewed

@@ -2,10 +2,10 @@ import { ChangeDetectionStrategy, Component, Input, TemplateRef, ViewChild } fro
 import { ItAbstractComponent } from '../../../../abstracts/abstract.component';
 import * as i0 from "@angular/core";
 export class ItSteppersItemComponent extends ItAbstractComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItSteppersItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: ItSteppersItemComponent, isStandalone: true, selector: "it-steppers-item", inputs: { label: "label", icon: "icon" }, 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: ItSteppersItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.6", type: ItSteppersItemComponent, isStandalone: true, selector: "it-steppers-item", inputs: { label: "label", icon: "icon" }, 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: ItSteppersItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItSteppersItemComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-steppers-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<ng-template>\n  <ng-content></ng-content>\n</ng-template>\n" }]
         }], propDecorators: { label: [{

package/esm2022/lib/components/core/steppers/steppers.module.mjs CHANGED Viewed

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

package/esm2022/lib/components/core/tab/tab-container/tab-container.component.mjs CHANGED Viewed

@@ -45,10 +45,10 @@ export class ItTabContainerComponent extends ItAbstractComponent {
     onTab(tab) {
         this.tabSelected.emit(tab);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTabContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItTabContainerComponent, isStandalone: true, selector: "it-tab-container", inputs: { auto: ["auto", "auto", inputToBoolean], iconText: ["iconText", "iconText", inputToBoolean], dark: ["dark", "dark", inputToBoolean] }, outputs: { tabSelected: "tabSelected" }, queries: [{ propertyName: "tabs", predicate: ItTabItemComponent }], viewQueries: [{ propertyName: "tabNavLinks", predicate: ["tabNavLinks"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (tabs) {\n  <ul class=\"nav nav-tabs\" [class.auto]=\"auto\" [class.nav-tabs-icon-text]=\"iconText\" [class.nav-dark]=\"dark\" role=\"tablist\">\n    @for (tab of tabs; track tab.id) {\n      <li class=\"nav-item\">\n        <a\n          #tabNavLinks\n          [id]=\"tab.id + '-tab-link'\"\n          role=\"tab\"\n          class=\"nav-link\"\n          [class.active]=\"tab.active\"\n          [class.disabled]=\"tab.disabled\"\n          [attr.href]=\"'#' + tab.id + '-tab'\"\n          [attr.aria-controls]=\"tab.id + '-tab'\"\n          (click)=\"onTab(tab)\">\n          @if (tab.icon) {\n            <it-icon [name]=\"tab.icon\" class=\"me-2\"></it-icon>\n          }\n          {{ tab.label }}\n        </a>\n      </li>\n    }\n  </ul>\n}\n\n@if (tabs) {\n  <div class=\"tab-content\">\n    @for (tab of tabs; track tab.id) {\n      <div\n        [id]=\"tab.id + '-tab'\"\n        class=\"tab-pane p-4 fade {{ tab.class ?? '' }}\"\n        [class.active]=\"tab.active\"\n        [class.show]=\"tab.active\"\n        role=\"tabpanel\"\n        [attr.aria-labelledby]=\"tab.id + '-tab-link'\">\n        <ng-container *ngTemplateOutlet=\"tab.htmlContent\"></ng-container>\n      </div>\n    }\n  </div>\n}\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { 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: ItTabContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItTabContainerComponent, isStandalone: true, selector: "it-tab-container", inputs: { auto: ["auto", "auto", inputToBoolean], iconText: ["iconText", "iconText", inputToBoolean], dark: ["dark", "dark", inputToBoolean] }, outputs: { tabSelected: "tabSelected" }, queries: [{ propertyName: "tabs", predicate: ItTabItemComponent }], viewQueries: [{ propertyName: "tabNavLinks", predicate: ["tabNavLinks"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (tabs) {\n  <ul class=\"nav nav-tabs\" [class.auto]=\"auto\" [class.nav-tabs-icon-text]=\"iconText\" [class.nav-dark]=\"dark\" role=\"tablist\">\n    @for (tab of tabs; track tab.id) {\n      <li class=\"nav-item\">\n        <a\n          #tabNavLinks\n          [id]=\"tab.id + '-tab-link'\"\n          role=\"tab\"\n          class=\"nav-link\"\n          [class.active]=\"tab.active\"\n          [class.disabled]=\"tab.disabled\"\n          [attr.href]=\"'#' + tab.id + '-tab'\"\n          [attr.aria-controls]=\"tab.id + '-tab'\"\n          (click)=\"onTab(tab)\">\n          @if (tab.icon) {\n            <it-icon [name]=\"tab.icon\" class=\"me-2\"></it-icon>\n          }\n          {{ tab.label }}\n        </a>\n      </li>\n    }\n  </ul>\n}\n\n@if (tabs) {\n  <div class=\"tab-content\">\n    @for (tab of tabs; track tab.id) {\n      <div\n        [id]=\"tab.id + '-tab'\"\n        class=\"tab-pane p-4 fade {{ tab.class ?? '' }}\"\n        [class.active]=\"tab.active\"\n        [class.show]=\"tab.active\"\n        role=\"tabpanel\"\n        [attr.aria-labelledby]=\"tab.id + '-tab-link'\">\n        <ng-container *ngTemplateOutlet=\"tab.htmlContent\"></ng-container>\n      </div>\n    }\n  </div>\n}\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { 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: ItTabContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTabContainerComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-tab-container', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ItIconComponent, NgTemplateOutlet], template: "@if (tabs) {\n  <ul class=\"nav nav-tabs\" [class.auto]=\"auto\" [class.nav-tabs-icon-text]=\"iconText\" [class.nav-dark]=\"dark\" role=\"tablist\">\n    @for (tab of tabs; track tab.id) {\n      <li class=\"nav-item\">\n        <a\n          #tabNavLinks\n          [id]=\"tab.id + '-tab-link'\"\n          role=\"tab\"\n          class=\"nav-link\"\n          [class.active]=\"tab.active\"\n          [class.disabled]=\"tab.disabled\"\n          [attr.href]=\"'#' + tab.id + '-tab'\"\n          [attr.aria-controls]=\"tab.id + '-tab'\"\n          (click)=\"onTab(tab)\">\n          @if (tab.icon) {\n            <it-icon [name]=\"tab.icon\" class=\"me-2\"></it-icon>\n          }\n          {{ tab.label }}\n        </a>\n      </li>\n    }\n  </ul>\n}\n\n@if (tabs) {\n  <div class=\"tab-content\">\n    @for (tab of tabs; track tab.id) {\n      <div\n        [id]=\"tab.id + '-tab'\"\n        class=\"tab-pane p-4 fade {{ tab.class ?? '' }}\"\n        [class.active]=\"tab.active\"\n        [class.show]=\"tab.active\"\n        role=\"tabpanel\"\n        [attr.aria-labelledby]=\"tab.id + '-tab-link'\">\n        <ng-container *ngTemplateOutlet=\"tab.htmlContent\"></ng-container>\n      </div>\n    }\n  </div>\n}\n" }]
         }], ctorParameters: () => [], propDecorators: { auto: [{

package/esm2022/lib/components/core/tab/tab-item/tab-item.component.mjs CHANGED Viewed

@@ -14,10 +14,10 @@ export class ItTabItemComponent extends ItAbstractComponent {
         super.ngAfterViewInit();
         this._renderer.removeAttribute(this._elementRef.nativeElement, 'class');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTabItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.1.2", type: ItTabItemComponent, isStandalone: true, selector: "it-tab-item", inputs: { label: "label", icon: "icon", active: ["active", "active", inputToBoolean], disabled: ["disabled", "disabled", inputToBoolean], class: "class" }, 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: ItTabItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.6", type: ItTabItemComponent, isStandalone: true, selector: "it-tab-item", inputs: { label: "label", icon: "icon", active: ["active", "active", inputToBoolean], disabled: ["disabled", "disabled", inputToBoolean], class: "class" }, 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: ItTabItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTabItemComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-tab-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<ng-template>\n  <ng-content></ng-content>\n</ng-template>\n" }]
         }], propDecorators: { label: [{

package/esm2022/lib/components/core/tab/tab.module.mjs CHANGED Viewed

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

package/esm2022/lib/components/core/table/sort/sort-header/sort-header.component.mjs CHANGED Viewed

@@ -92,10 +92,10 @@ export class ItSortHeaderComponent {
             this._changeDetectorRef.markForCheck();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItSortHeaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.ItSortDirective, optional: true }, { token: IT_SORT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.1.2", type: ItSortHeaderComponent, isStandalone: true, selector: "[it-sort-header]", inputs: { id: ["it-sort-header", "id"], arrowPosition: "arrowPosition", start: "start", sortDisabled: ["sortDisabled", "sortDisabled", booleanAttribute], disableSortClear: ["disableSortClear", "disableSortClear", booleanAttribute] }, host: { listeners: { "click": "_handleClick()" }, properties: { "class": "this.sortHeaderClass", "class.it-sort-header-disabled": "this.isDisabled", "attr.aria-sort": "this.ariaSortAttribute" } }, exportAs: ["itSortHeader"], ngImport: i0, template: "<!--\n  We set the `tabindex` on an element inside the table header, rather than the header itself,\n  because of a bug in NVDA where having a `tabindex` on a `th` breaks keyboard navigation in the\n  table (see https://github.com/nvaccess/nvda/issues/7718). This allows for the header to both\n  be focusable, and have screen readers read out its `aria-sort` state. We prefer this approach\n  over having a button with an `aria-label` inside the header, because the button's `aria-label`\n  will be read out as the user is navigating the table's cell (see #13012).\n\n  The approach is based off of: https://dequeuniversity.com/library/aria/tables/sf-sortable-grid\n-->\n<div\n  class=\"it-sort-header-container it-focus-indicator\"\n  [class.it-sort-header-sorted]=\"isSorted\"\n  [class.it-sort-header-position-before]=\"arrowPosition === 'before'\"\n  [attr.tabindex]=\"isDisabled ? null : 0\"\n  [attr.role]=\"isDisabled ? null : 'button'\">\n  <!--\n    We have to keep it due to a large number of screenshot diff failures. It should be removed eventually.\n    Note that the difference isn't visible with a shorter header, but once it breaks up into multiple lines, this element\n    causes it to be center-aligned, whereas removing it will keep the text to the left.\n  -->\n  <div class=\"it-sort-header-content\">\n    <ng-content></ng-content>\n  </div>\n\n  <it-icon class=\"it-sort-arrow\" size=\"sm\" [name]=\"arrowIconClass\" />\n</div>\n", styles: [".it-sort-header-container{display:flex;cursor:pointer;align-items:center;justify-content:space-between;letter-spacing:normal;outline:0}.it-sort-header-disabled .it-sort-header-container{cursor:default}.it-sort-header-disabled .it-sort-header-container .it-sort-arrow{opacity:0!important;fill-opacity:0!important}.it-sort-header-container:before{margin:-5px}.it-sort-header-container.it-sort-header-position-before{flex-direction:row-reverse;justify-content:left;gap:.5rem}.it-sort-header-container .it-sort-arrow{opacity:0;fill-opacity:0;transition:fill-opacity .3s ease-out,opacity .3s ease-out;-moz-transition:fill-opacity .3s ease-out,opacity .3s ease-out;-webkit-transition:fill-opacity .3s ease-out,opacity .3s ease-out;-o-transition:fill-opacity .3s ease-out,opacity .3s ease-out}.it-sort-header-container:hover .it-sort-arrow{opacity:.5;fill-opacity:.5}.it-sort-header-container.it-sort-header-sorted .it-sort-arrow{opacity:1!important;fill-opacity:1!important}\n"], dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItSortHeaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.ItSortDirective, optional: true }, { token: IT_SORT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.6", type: ItSortHeaderComponent, isStandalone: true, selector: "[it-sort-header]", inputs: { id: ["it-sort-header", "id"], arrowPosition: "arrowPosition", start: "start", sortDisabled: ["sortDisabled", "sortDisabled", booleanAttribute], disableSortClear: ["disableSortClear", "disableSortClear", booleanAttribute] }, host: { listeners: { "click": "_handleClick()" }, properties: { "class": "this.sortHeaderClass", "class.it-sort-header-disabled": "this.isDisabled", "attr.aria-sort": "this.ariaSortAttribute" } }, exportAs: ["itSortHeader"], ngImport: i0, template: "<!--\n  We set the `tabindex` on an element inside the table header, rather than the header itself,\n  because of a bug in NVDA where having a `tabindex` on a `th` breaks keyboard navigation in the\n  table (see https://github.com/nvaccess/nvda/issues/7718). This allows for the header to both\n  be focusable, and have screen readers read out its `aria-sort` state. We prefer this approach\n  over having a button with an `aria-label` inside the header, because the button's `aria-label`\n  will be read out as the user is navigating the table's cell (see #13012).\n\n  The approach is based off of: https://dequeuniversity.com/library/aria/tables/sf-sortable-grid\n-->\n<div\n  class=\"it-sort-header-container it-focus-indicator\"\n  [class.it-sort-header-sorted]=\"isSorted\"\n  [class.it-sort-header-position-before]=\"arrowPosition === 'before'\"\n  [attr.tabindex]=\"isDisabled ? null : 0\"\n  [attr.role]=\"isDisabled ? null : 'button'\">\n  <!--\n    We have to keep it due to a large number of screenshot diff failures. It should be removed eventually.\n    Note that the difference isn't visible with a shorter header, but once it breaks up into multiple lines, this element\n    causes it to be center-aligned, whereas removing it will keep the text to the left.\n  -->\n  <div class=\"it-sort-header-content\">\n    <ng-content></ng-content>\n  </div>\n\n  <it-icon class=\"it-sort-arrow\" size=\"sm\" [name]=\"arrowIconClass\" />\n</div>\n", styles: [".it-sort-header-container{display:flex;cursor:pointer;align-items:center;justify-content:space-between;letter-spacing:normal;outline:0}.it-sort-header-disabled .it-sort-header-container{cursor:default}.it-sort-header-disabled .it-sort-header-container .it-sort-arrow{opacity:0!important;fill-opacity:0!important}.it-sort-header-container:before{margin:-5px}.it-sort-header-container.it-sort-header-position-before{flex-direction:row-reverse;justify-content:left;gap:.5rem}.it-sort-header-container .it-sort-arrow{opacity:0;fill-opacity:0;transition:fill-opacity .3s ease-out,opacity .3s ease-out;-moz-transition:fill-opacity .3s ease-out,opacity .3s ease-out;-webkit-transition:fill-opacity .3s ease-out,opacity .3s ease-out;-o-transition:fill-opacity .3s ease-out,opacity .3s ease-out}.it-sort-header-container:hover .it-sort-arrow{opacity:.5;fill-opacity:.5}.it-sort-header-container.it-sort-header-sorted .it-sort-arrow{opacity:1!important;fill-opacity:1!important}\n"], dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItSortHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItSortHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: '[it-sort-header]', exportAs: 'itSortHeader', standalone: true, imports: [ItIconComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  We set the `tabindex` on an element inside the table header, rather than the header itself,\n  because of a bug in NVDA where having a `tabindex` on a `th` breaks keyboard navigation in the\n  table (see https://github.com/nvaccess/nvda/issues/7718). This allows for the header to both\n  be focusable, and have screen readers read out its `aria-sort` state. We prefer this approach\n  over having a button with an `aria-label` inside the header, because the button's `aria-label`\n  will be read out as the user is navigating the table's cell (see #13012).\n\n  The approach is based off of: https://dequeuniversity.com/library/aria/tables/sf-sortable-grid\n-->\n<div\n  class=\"it-sort-header-container it-focus-indicator\"\n  [class.it-sort-header-sorted]=\"isSorted\"\n  [class.it-sort-header-position-before]=\"arrowPosition === 'before'\"\n  [attr.tabindex]=\"isDisabled ? null : 0\"\n  [attr.role]=\"isDisabled ? null : 'button'\">\n  <!--\n    We have to keep it due to a large number of screenshot diff failures. It should be removed eventually.\n    Note that the difference isn't visible with a shorter header, but once it breaks up into multiple lines, this element\n    causes it to be center-aligned, whereas removing it will keep the text to the left.\n  -->\n  <div class=\"it-sort-header-content\">\n    <ng-content></ng-content>\n  </div>\n\n  <it-icon class=\"it-sort-arrow\" size=\"sm\" [name]=\"arrowIconClass\" />\n</div>\n", styles: [".it-sort-header-container{display:flex;cursor:pointer;align-items:center;justify-content:space-between;letter-spacing:normal;outline:0}.it-sort-header-disabled .it-sort-header-container{cursor:default}.it-sort-header-disabled .it-sort-header-container .it-sort-arrow{opacity:0!important;fill-opacity:0!important}.it-sort-header-container:before{margin:-5px}.it-sort-header-container.it-sort-header-position-before{flex-direction:row-reverse;justify-content:left;gap:.5rem}.it-sort-header-container .it-sort-arrow{opacity:0;fill-opacity:0;transition:fill-opacity .3s ease-out,opacity .3s ease-out;-moz-transition:fill-opacity .3s ease-out,opacity .3s ease-out;-webkit-transition:fill-opacity .3s ease-out,opacity .3s ease-out;-o-transition:fill-opacity .3s ease-out,opacity .3s ease-out}.it-sort-header-container:hover .it-sort-arrow{opacity:.5;fill-opacity:.5}.it-sort-header-container.it-sort-header-sorted .it-sort-arrow{opacity:1!important;fill-opacity:1!important}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.ItSortDirective, decorators: [{

package/esm2022/lib/components/core/table/sort/sort.directive.mjs CHANGED Viewed

@@ -73,10 +73,10 @@ export class ItSortDirective {
     ngOnDestroy() {
         this._stateChanges.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItSortDirective, deps: [{ token: IT_SORT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.1.2", type: ItSortDirective, isStandalone: true, selector: "[itSort]", inputs: { active: ["itSortActive", "active"], start: ["itSortStart", "start"], direction: ["itSortDirection", "direction"], disableSortClear: ["disableSortClear", "disableSortClear", booleanAttribute], sortDisabled: ["sortDisabled", "sortDisabled", booleanAttribute] }, outputs: { sortChange: "sortChange" }, host: { properties: { "class": "this.sortDirectiveClass" } }, exportAs: ["itSort"], usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItSortDirective, deps: [{ token: IT_SORT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.6", type: ItSortDirective, isStandalone: true, selector: "[itSort]", inputs: { active: ["itSortActive", "active"], start: ["itSortStart", "start"], direction: ["itSortDirection", "direction"], disableSortClear: ["disableSortClear", "disableSortClear", booleanAttribute], sortDisabled: ["sortDisabled", "sortDisabled", booleanAttribute] }, outputs: { sortChange: "sortChange" }, host: { properties: { "class": "this.sortDirectiveClass" } }, exportAs: ["itSort"], usesOnChanges: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItSortDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItSortDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,

package/esm2022/lib/components/core/table/table.component.mjs CHANGED Viewed

@@ -9,10 +9,10 @@ export class ItTableComponent {
          */
         this.responsive = 'responsive';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.1.2", type: ItTableComponent, isStandalone: true, selector: "it-table", inputs: { color: "color", headColor: "headColor", alignment: "alignment", striped: ["striped", "striped", inputToBoolean], hover: ["hover", "hover", inputToBoolean], bordered: ["bordered", "bordered", inputToBoolean], borderless: ["borderless", "borderless", inputToBoolean], compact: ["compact", "compact", inputToBoolean], captionTop: ["captionTop", "captionTop", inputToBoolean], responsive: "responsive" }, ngImport: i0, template: "<div [class]=\"responsive ? 'table-' + responsive : undefined\">\n  <table\n    class=\"table{{ color ? ' table-' + color : '' }}{{ alignment ? ' ' + alignment : '' }}\"\n    [class.table-striped]=\"striped\"\n    [class.table-hover]=\"hover\"\n    [class.table-bordered]=\"bordered\"\n    [class.table-borderless]=\"borderless\"\n    [class.table-sm]=\"compact\"\n    [class.caption-top]=\"captionTop\">\n    <caption>\n      <ng-content select=\"[caption]\"></ng-content>\n    </caption>\n    <thead [class]=\"headColor ? 'table-' + headColor : undefined\">\n      <ng-content select=\"[thead]\"></ng-content>\n    </thead>\n    <tbody>\n      <ng-content select=\"[tbody]\"></ng-content>\n    </tbody>\n    <tfoot>\n      <ng-content select=\"[tfoot]\"></ng-content>\n    </tfoot>\n  </table>\n</div>\n", styles: ["caption:empty{display:none}caption:empty~thead{border-top:none!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.6", type: ItTableComponent, isStandalone: true, selector: "it-table", inputs: { color: "color", headColor: "headColor", alignment: "alignment", striped: ["striped", "striped", inputToBoolean], hover: ["hover", "hover", inputToBoolean], bordered: ["bordered", "bordered", inputToBoolean], borderless: ["borderless", "borderless", inputToBoolean], compact: ["compact", "compact", inputToBoolean], captionTop: ["captionTop", "captionTop", inputToBoolean], responsive: "responsive" }, ngImport: i0, template: "<div [class]=\"responsive ? 'table-' + responsive : undefined\">\n  <table\n    class=\"table{{ color ? ' table-' + color : '' }}{{ alignment ? ' ' + alignment : '' }}\"\n    [class.table-striped]=\"striped\"\n    [class.table-hover]=\"hover\"\n    [class.table-bordered]=\"bordered\"\n    [class.table-borderless]=\"borderless\"\n    [class.table-sm]=\"compact\"\n    [class.caption-top]=\"captionTop\">\n    <caption>\n      <ng-content select=\"[caption]\"></ng-content>\n    </caption>\n    <thead [class]=\"headColor ? 'table-' + headColor : undefined\">\n      <ng-content select=\"[thead]\"></ng-content>\n    </thead>\n    <tbody>\n      <ng-content select=\"[tbody]\"></ng-content>\n    </tbody>\n    <tfoot>\n      <ng-content select=\"[tfoot]\"></ng-content>\n    </tfoot>\n  </table>\n</div>\n", styles: ["caption:empty{display:none}caption:empty~thead{border-top:none!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTableComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-table', changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<div [class]=\"responsive ? 'table-' + responsive : undefined\">\n  <table\n    class=\"table{{ color ? ' table-' + color : '' }}{{ alignment ? ' ' + alignment : '' }}\"\n    [class.table-striped]=\"striped\"\n    [class.table-hover]=\"hover\"\n    [class.table-bordered]=\"bordered\"\n    [class.table-borderless]=\"borderless\"\n    [class.table-sm]=\"compact\"\n    [class.caption-top]=\"captionTop\">\n    <caption>\n      <ng-content select=\"[caption]\"></ng-content>\n    </caption>\n    <thead [class]=\"headColor ? 'table-' + headColor : undefined\">\n      <ng-content select=\"[thead]\"></ng-content>\n    </thead>\n    <tbody>\n      <ng-content select=\"[tbody]\"></ng-content>\n    </tbody>\n    <tfoot>\n      <ng-content select=\"[tfoot]\"></ng-content>\n    </tfoot>\n  </table>\n</div>\n", styles: ["caption:empty{display:none}caption:empty~thead{border-top:none!important}\n"] }]
         }], propDecorators: { color: [{

package/esm2022/lib/components/core/table/table.module.mjs CHANGED Viewed

@@ -5,11 +5,11 @@ import { ItSortHeaderComponent } from './sort/sort-header/sort-header.component'
 import * as i0 from "@angular/core";
 const tableComponents = [ItTableComponent, ItSortDirective, ItSortHeaderComponent];
 export class ItTableModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.2", ngImport: i0, type: ItTableModule, imports: [ItTableComponent, ItSortDirective, ItSortHeaderComponent], exports: [ItTableComponent, ItSortDirective, ItSortHeaderComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTableModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.6", ngImport: i0, type: ItTableModule, imports: [ItTableComponent, ItSortDirective, ItSortHeaderComponent], exports: [ItTableComponent, ItSortDirective, ItSortHeaderComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTableModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTableModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTableModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: tableComponents,

package/esm2022/lib/components/core/timeline/timeline-item/timeline-item.component.mjs CHANGED Viewed

@@ -38,10 +38,10 @@ export class ItTimelineItemComponent extends ItAbstractComponent {
          */
         this.readMoreLink = '#';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTimelineItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItTimelineItemComponent, isStandalone: true, selector: "it-timeline-item", inputs: { title: "title", text: "text", signature: "signature", eventDate: "eventDate", dateFormat: "dateFormat", pinText: "pinText", pinType: "pinType", pinIcon: "pinIcon", categoryTitle: "categoryTitle", categoryLink: "categoryLink", showReadMore: ["showReadMore", "showReadMore", inputToBoolean], readMoreLink: "readMoreLink" }, usesInheritance: true, ngImport: i0, template: "<div class=\"timeline-element\">\n  @if (pinType === 'now') {\n    <span class=\"it-now-label d-none d-lg-flex\">{{ 'it.timeline.today' | translate }}</span>\n  }\n  <div class=\"it-pin-wrapper\" [ngClass]=\"{ 'it-evidence': pinType === 'evidence', 'it-now': pinType === 'now' }\">\n    <div class=\"pin-icon\">\n      @if (pinIcon) {\n        <it-icon [name]=\"pinIcon\"></it-icon>\n      } @else {\n        <it-icon name=\"code-circle\"></it-icon>\n      }\n    </div>\n    <div class=\"pin-text\">\n      <span>{{ pinText }}</span>\n    </div>\n  </div>\n  <div class=\"card-wrapper\">\n    <div class=\"card\">\n      <div class=\"card-body\">\n        @if ((categoryTitle && categoryLink) || eventDate) {\n          <div class=\"category-top\">\n            @if (categoryTitle) {\n              <a class=\"category\" [href]=\"categoryLink\">{{ categoryTitle }}</a>\n            }\n            @if (eventDate) {\n              <span class=\"data\">{{ eventDate | date: dateFormat }}</span>\n            }\n          </div>\n        }\n        <h5 class=\"card-title\">{{ title }}</h5>\n        <p class=\"card-text\">{{ text }}</p>\n        @if (signature) {\n          <span class=\"card-signature\">{{ signature }}</span>\n        }\n        @if (showReadMore) {\n          <a class=\"read-more\" [href]=\"readMoreLink\">\n            <span class=\"text\">{{ 'it.timeline.read-more' | translate }}</span>\n            <span class=\"visually-hidden\">{{ 'it.timeline.read-more-on' | translate: { title: title } }}</span>\n            <it-icon name=\"arrow-right\"></it-icon>\n          </a>\n        }\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTimelineItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItTimelineItemComponent, isStandalone: true, selector: "it-timeline-item", inputs: { title: "title", text: "text", signature: "signature", eventDate: "eventDate", dateFormat: "dateFormat", pinText: "pinText", pinType: "pinType", pinIcon: "pinIcon", categoryTitle: "categoryTitle", categoryLink: "categoryLink", showReadMore: ["showReadMore", "showReadMore", inputToBoolean], readMoreLink: "readMoreLink" }, usesInheritance: true, ngImport: i0, template: "<div class=\"timeline-element\">\n  @if (pinType === 'now') {\n    <span class=\"it-now-label d-none d-lg-flex\">{{ 'it.timeline.today' | translate }}</span>\n  }\n  <div class=\"it-pin-wrapper\" [ngClass]=\"{ 'it-evidence': pinType === 'evidence', 'it-now': pinType === 'now' }\">\n    <div class=\"pin-icon\">\n      @if (pinIcon) {\n        <it-icon [name]=\"pinIcon\"></it-icon>\n      } @else {\n        <it-icon name=\"code-circle\"></it-icon>\n      }\n    </div>\n    <div class=\"pin-text\">\n      <span>{{ pinText }}</span>\n    </div>\n  </div>\n  <div class=\"card-wrapper\">\n    <div class=\"card\">\n      <div class=\"card-body\">\n        @if ((categoryTitle && categoryLink) || eventDate) {\n          <div class=\"category-top\">\n            @if (categoryTitle) {\n              <a class=\"category\" [href]=\"categoryLink\">{{ categoryTitle }}</a>\n            }\n            @if (eventDate) {\n              <span class=\"data\">{{ eventDate | date: dateFormat }}</span>\n            }\n          </div>\n        }\n        <h5 class=\"card-title\">{{ title }}</h5>\n        <p class=\"card-text\">{{ text }}</p>\n        @if (signature) {\n          <span class=\"card-signature\">{{ signature }}</span>\n        }\n        @if (showReadMore) {\n          <a class=\"read-more\" [href]=\"readMoreLink\">\n            <span class=\"text\">{{ 'it.timeline.read-more' | translate }}</span>\n            <span class=\"visually-hidden\">{{ 'it.timeline.read-more-on' | translate: { title: title } }}</span>\n            <it-icon name=\"arrow-right\"></it-icon>\n          </a>\n        }\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "labelWaria"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTimelineItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTimelineItemComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-timeline-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ItIconComponent, DatePipe, TranslateModule, NgClass], template: "<div class=\"timeline-element\">\n  @if (pinType === 'now') {\n    <span class=\"it-now-label d-none d-lg-flex\">{{ 'it.timeline.today' | translate }}</span>\n  }\n  <div class=\"it-pin-wrapper\" [ngClass]=\"{ 'it-evidence': pinType === 'evidence', 'it-now': pinType === 'now' }\">\n    <div class=\"pin-icon\">\n      @if (pinIcon) {\n        <it-icon [name]=\"pinIcon\"></it-icon>\n      } @else {\n        <it-icon name=\"code-circle\"></it-icon>\n      }\n    </div>\n    <div class=\"pin-text\">\n      <span>{{ pinText }}</span>\n    </div>\n  </div>\n  <div class=\"card-wrapper\">\n    <div class=\"card\">\n      <div class=\"card-body\">\n        @if ((categoryTitle && categoryLink) || eventDate) {\n          <div class=\"category-top\">\n            @if (categoryTitle) {\n              <a class=\"category\" [href]=\"categoryLink\">{{ categoryTitle }}</a>\n            }\n            @if (eventDate) {\n              <span class=\"data\">{{ eventDate | date: dateFormat }}</span>\n            }\n          </div>\n        }\n        <h5 class=\"card-title\">{{ title }}</h5>\n        <p class=\"card-text\">{{ text }}</p>\n        @if (signature) {\n          <span class=\"card-signature\">{{ signature }}</span>\n        }\n        @if (showReadMore) {\n          <a class=\"read-more\" [href]=\"readMoreLink\">\n            <span class=\"text\">{{ 'it.timeline.read-more' | translate }}</span>\n            <span class=\"visually-hidden\">{{ 'it.timeline.read-more-on' | translate: { title: title } }}</span>\n            <it-icon name=\"arrow-right\"></it-icon>\n          </a>\n        }\n      </div>\n    </div>\n  </div>\n</div>\n" }]
         }], propDecorators: { title: [{

package/esm2022/lib/components/core/timeline/timeline.component.mjs CHANGED Viewed

@@ -22,10 +22,10 @@ export class ItTimelineComponent extends ItAbstractComponent {
          */
         this.dateFormat = 'dd/MM/yyyy';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTimelineComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ItTimelineComponent, isStandalone: true, selector: "it-timeline", inputs: { timelineElements: "timelineElements", dateFormat: "dateFormat" }, usesInheritance: true, ngImport: i0, template: "<div class=\"it-timeline-wrapper\">\n  <div class=\"row\">\n    @for (element of timelineElements; track $index) {\n      <div class=\"col-12\">\n        <it-timeline-item\n          [title]=\"element.title\"\n          [text]=\"element.text\"\n          [signature]=\"element.signature\"\n          [pinType]=\"element.pin?.type\"\n          [pinIcon]=\"element.pin?.icon\"\n          [pinText]=\"element.pin?.text\"\n          [eventDate]=\"element.eventDate\"\n          [dateFormat]=\"dateFormat\"\n          [categoryTitle]=\"element.category?.title\"\n          [categoryLink]=\"element.category?.link\"\n          [showReadMore]=\"!!element.link?.length\"\n          [readMoreLink]=\"element.link\" />\n      </div>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: ItTimelineItemComponent, selector: "it-timeline-item", inputs: ["title", "text", "signature", "eventDate", "dateFormat", "pinText", "pinType", "pinIcon", "categoryTitle", "categoryLink", "showReadMore", "readMoreLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTimelineComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItTimelineComponent, isStandalone: true, selector: "it-timeline", inputs: { timelineElements: "timelineElements", dateFormat: "dateFormat" }, usesInheritance: true, ngImport: i0, template: "<div class=\"it-timeline-wrapper\">\n  <div class=\"row\">\n    @for (element of timelineElements; track $index) {\n      <div class=\"col-12\">\n        <it-timeline-item\n          [title]=\"element.title\"\n          [text]=\"element.text\"\n          [signature]=\"element.signature\"\n          [pinType]=\"element.pin?.type\"\n          [pinIcon]=\"element.pin?.icon\"\n          [pinText]=\"element.pin?.text\"\n          [eventDate]=\"element.eventDate\"\n          [dateFormat]=\"dateFormat\"\n          [categoryTitle]=\"element.category?.title\"\n          [categoryLink]=\"element.category?.link\"\n          [showReadMore]=\"!!element.link?.length\"\n          [readMoreLink]=\"element.link\" />\n      </div>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: ItTimelineItemComponent, selector: "it-timeline-item", inputs: ["title", "text", "signature", "eventDate", "dateFormat", "pinText", "pinType", "pinIcon", "categoryTitle", "categoryLink", "showReadMore", "readMoreLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTimelineComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTimelineComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'it-timeline', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ItIconComponent, TranslateModule, ItTimelineItemComponent], template: "<div class=\"it-timeline-wrapper\">\n  <div class=\"row\">\n    @for (element of timelineElements; track $index) {\n      <div class=\"col-12\">\n        <it-timeline-item\n          [title]=\"element.title\"\n          [text]=\"element.text\"\n          [signature]=\"element.signature\"\n          [pinType]=\"element.pin?.type\"\n          [pinIcon]=\"element.pin?.icon\"\n          [pinText]=\"element.pin?.text\"\n          [eventDate]=\"element.eventDate\"\n          [dateFormat]=\"dateFormat\"\n          [categoryTitle]=\"element.category?.title\"\n          [categoryLink]=\"element.category?.link\"\n          [showReadMore]=\"!!element.link?.length\"\n          [readMoreLink]=\"element.link\" />\n      </div>\n    }\n  </div>\n</div>\n" }]
         }], propDecorators: { timelineElements: [{

package/esm2022/lib/components/core/timeline/timeline.module.mjs CHANGED Viewed

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

package/esm2022/lib/components/core/tooltip/tooltip.directive.mjs CHANGED Viewed

@@ -111,10 +111,10 @@ export class ItTooltipDirective {
     update() {
         this.tooltip?.disable();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTooltipDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.1.2", type: ItTooltipDirective, isStandalone: true, selector: "[itTooltip]", inputs: { title: ["itTooltip", "title"], tooltipPlacement: "tooltipPlacement", tooltipHtml: ["tooltipHtml", "tooltipHtml", inputToBoolean] }, outputs: { showEvent: "showEvent", shownEvent: "shownEvent", hideEvent: "hideEvent", hiddenEvent: "hiddenEvent", insertedEvent: "insertedEvent" }, exportAs: ["itTooltip"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTooltipDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.6", type: ItTooltipDirective, isStandalone: true, selector: "[itTooltip]", inputs: { title: ["itTooltip", "title"], tooltipPlacement: "tooltipPlacement", tooltipHtml: ["tooltipHtml", "tooltipHtml", inputToBoolean] }, outputs: { showEvent: "showEvent", shownEvent: "shownEvent", hideEvent: "hideEvent", hiddenEvent: "hiddenEvent", insertedEvent: "insertedEvent" }, exportAs: ["itTooltip"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ItTooltipDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTooltipDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,