@indigina/ui-kit 1.1.128 → 1.1.130
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, ChangeDetectionStrategy, Input, input, EventEmitter, ViewEncapsulation, Output, NgModule, effect, inject, ElementRef, NgZone, Renderer2, Directive, forwardRef, signal, TemplateRef, ContentChild, ViewChild, HostListener, Injectable, output, Host, Self, Inject,
|
|
2
|
+
import { Component, ChangeDetectionStrategy, Input, input, EventEmitter, ViewEncapsulation, Output, NgModule, effect, inject, ElementRef, NgZone, Renderer2, Directive, forwardRef, signal, TemplateRef, ContentChild, ViewChild, HostListener, Injectable, output, Host, Self, Inject, model, contentChildren, viewChild, ContentChildren, computed, contentChild } from '@angular/core';
|
|
3
3
|
import * as i1 from '@progress/kendo-angular-buttons';
|
|
4
4
|
import { ButtonModule, ButtonGroupModule } from '@progress/kendo-angular-buttons';
|
|
5
5
|
import * as i1$1 from '@angular/common';
|
|
@@ -4002,11 +4002,11 @@ class KitNavigationMenuComponent {
|
|
|
4002
4002
|
/**
|
|
4003
4003
|
* An items list which is going to be rendered as menu items
|
|
4004
4004
|
*/
|
|
4005
|
-
this.menuItems = [];
|
|
4005
|
+
this.menuItems = model([]);
|
|
4006
4006
|
/**
|
|
4007
4007
|
* An items list which is going to be rendered as apps menu items
|
|
4008
4008
|
*/
|
|
4009
|
-
this.appsMenuItems = [];
|
|
4009
|
+
this.appsMenuItems = input([]);
|
|
4010
4010
|
this.logoPath = '';
|
|
4011
4011
|
this.selectedItem = signal(null);
|
|
4012
4012
|
this.selectedAppsItems = signal(null);
|
|
@@ -4017,16 +4017,16 @@ class KitNavigationMenuComponent {
|
|
|
4017
4017
|
this.setExpandedStateOnRouterChange();
|
|
4018
4018
|
}
|
|
4019
4019
|
ngOnInit() {
|
|
4020
|
-
this.updateNavigationState(this.menuItems, this.router.url);
|
|
4020
|
+
this.updateNavigationState(this.menuItems(), this.router.url);
|
|
4021
4021
|
}
|
|
4022
4022
|
handleClick(item) {
|
|
4023
|
-
!item.items ? this.collapseAllItems(this.menuItems) : this.toggleItem(item);
|
|
4023
|
+
!item.items ? this.collapseAllItems(this.menuItems()) : this.toggleItem(item);
|
|
4024
4024
|
this.selectedAppsItems.set(null);
|
|
4025
4025
|
this.selectedItem.set(item);
|
|
4026
4026
|
this.updateMenuState();
|
|
4027
4027
|
}
|
|
4028
4028
|
handleLogoClick() {
|
|
4029
|
-
this.collapseAllItems(this.menuItems);
|
|
4029
|
+
this.collapseAllItems(this.menuItems());
|
|
4030
4030
|
this.selectedAppsItems.set(null);
|
|
4031
4031
|
this.selectedItem.set(null);
|
|
4032
4032
|
this.updateMenuState();
|
|
@@ -4034,17 +4034,16 @@ class KitNavigationMenuComponent {
|
|
|
4034
4034
|
onAppsMenuButtonClick() {
|
|
4035
4035
|
if (this.selectedAppsItems() && !this.collapsed()) {
|
|
4036
4036
|
this.selectedAppsItems.set(null);
|
|
4037
|
-
this.collapseAllItems(this.menuItems);
|
|
4037
|
+
this.collapseAllItems(this.menuItems());
|
|
4038
4038
|
}
|
|
4039
4039
|
else {
|
|
4040
4040
|
this.kitNavigationMenuService.setCollapsedState(false);
|
|
4041
|
-
this.
|
|
4042
|
-
this.selectedAppsItems.set(this.appsMenuItems);
|
|
4041
|
+
this.selectedAppsItems.set(this.appsMenuItems());
|
|
4043
4042
|
}
|
|
4044
4043
|
this.updateMenuState();
|
|
4045
4044
|
}
|
|
4046
4045
|
setExpandedStateOnRouterChange() {
|
|
4047
|
-
this.router.events.pipe(filter(event => event instanceof NavigationEnd), takeUntilDestroyed()).subscribe(() => this.updateNavigationState(this.menuItems, this.router.url));
|
|
4046
|
+
this.router.events.pipe(filter(event => event instanceof NavigationEnd), takeUntilDestroyed()).subscribe(() => this.updateNavigationState(this.menuItems(), this.router.url));
|
|
4048
4047
|
}
|
|
4049
4048
|
updateNavigationState(items, url) {
|
|
4050
4049
|
const matchLink = (item) => !!(item.link && url.startsWith(item.link));
|
|
@@ -4057,7 +4056,6 @@ class KitNavigationMenuComponent {
|
|
|
4057
4056
|
if (item.expanded) {
|
|
4058
4057
|
this.selectedItem.set(item);
|
|
4059
4058
|
this.selectedAppsItems.set(null);
|
|
4060
|
-
this.kitNavigationMenuService.setCollapsedState(false);
|
|
4061
4059
|
this.updateMenuState();
|
|
4062
4060
|
}
|
|
4063
4061
|
}
|
|
@@ -4067,22 +4065,22 @@ class KitNavigationMenuComponent {
|
|
|
4067
4065
|
if (item.active) {
|
|
4068
4066
|
this.selectedItem.set(item);
|
|
4069
4067
|
this.selectedAppsItems.set(null);
|
|
4070
|
-
this.kitNavigationMenuService.setCollapsedState(true);
|
|
4071
4068
|
this.updateMenuState();
|
|
4072
4069
|
}
|
|
4073
4070
|
}
|
|
4074
4071
|
});
|
|
4072
|
+
this.menuItems.set([...items]);
|
|
4075
4073
|
}
|
|
4076
4074
|
collapseAllItems(items) {
|
|
4077
4075
|
this.kitNavigationMenuService.setCollapsedState(true);
|
|
4078
4076
|
items.forEach(item => item.expanded = false);
|
|
4079
4077
|
}
|
|
4080
4078
|
toggleItem(item) {
|
|
4081
|
-
if (this.collapsed()
|
|
4079
|
+
if (this.collapsed()) {
|
|
4082
4080
|
this.kitNavigationMenuService.setCollapsedState(!this.collapsed());
|
|
4083
4081
|
}
|
|
4084
4082
|
else {
|
|
4085
|
-
this.
|
|
4083
|
+
!this.selectedAppsItems() && this.kitNavigationMenuService.setCollapsedState(true);
|
|
4086
4084
|
}
|
|
4087
4085
|
item.expanded = !item.expanded;
|
|
4088
4086
|
}
|
|
@@ -4090,7 +4088,7 @@ class KitNavigationMenuComponent {
|
|
|
4090
4088
|
this.kitNavigationMenuService.setSelectedState(!!this.selectedItem()?.items, !!this.selectedAppsItems());
|
|
4091
4089
|
}
|
|
4092
4090
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitNavigationMenuComponent, deps: [{ token: i1$7.Router }, { token: KitNavigationMenuService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4093
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: KitNavigationMenuComponent, isStandalone: false, selector: "kit-navigation-menu", inputs: { menuItems: "menuItems", appsMenuItems: "appsMenuItems", logoPath: "logoPath" }, ngImport: i0, template: "<div class=\"kit-navigation-menu\"\n [class.collapsed]=\"collapsed()\">\n <div class=\"main-panel\">\n @if (appsMenuItems.length > 1) {\n <button class=\"app-btn\"\n [class.active]=\"selectedAppsItems() && !collapsed()\"\n (click)=\"onAppsMenuButtonClick()\">\n <kit-svg-icon class=\"app-btn-icon\"\n [icon]=\"KitSvgIcon.FOUR_SQUARE\"\n ></kit-svg-icon>\n </button>\n }\n <div class=\"nav-list\">\n @for (item of menuItems; track
|
|
4091
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: KitNavigationMenuComponent, isStandalone: false, selector: "kit-navigation-menu", inputs: { menuItems: { classPropertyName: "menuItems", publicName: "menuItems", isSignal: true, isRequired: false, transformFunction: null }, appsMenuItems: { classPropertyName: "appsMenuItems", publicName: "appsMenuItems", isSignal: true, isRequired: false, transformFunction: null }, logoPath: { classPropertyName: "logoPath", publicName: "logoPath", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { menuItems: "menuItemsChange" }, ngImport: i0, template: "<div class=\"kit-navigation-menu\"\n [class.collapsed]=\"collapsed()\">\n <div class=\"main-panel\">\n @if (appsMenuItems().length > 1) {\n <button class=\"app-btn\"\n [class.active]=\"selectedAppsItems() && !collapsed()\"\n (click)=\"onAppsMenuButtonClick()\">\n <kit-svg-icon class=\"app-btn-icon\"\n [icon]=\"KitSvgIcon.FOUR_SQUARE\"\n ></kit-svg-icon>\n </button>\n }\n <div class=\"nav-list\">\n @for (item of menuItems(); track $index) {\n @if (item.items?.length) {\n <a class=\"nav-link\"\n kitTooltip\n kitTooltipFilter=\".nav-link\"\n [kitTooltipPosition]=\"KitTooltipPosition.RIGHT\"\n [title]=\"item.title\"\n [class.active]=\"item.active\"\n (click)=\"handleClick(item)\">\n @if (item.icon) {\n <ng-container *ngTemplateOutlet=\"linkIconTemplate; context: { $implicit: item }\"\n ></ng-container>\n }\n </a>\n } @else {\n @if (item.link) {\n <a class=\"nav-link\"\n routerLinkActive=\"active\"\n kitTooltip\n kitTooltipFilter=\".nav-link\"\n [kitTooltipPosition]=\"KitTooltipPosition.RIGHT\"\n [title]=\"item.title\"\n [routerLink]=\"item.link\"\n (click)=\"handleClick(item)\">\n @if (item.icon) {\n <ng-container *ngTemplateOutlet=\"linkIconTemplate; context: { $implicit: item }\"\n ></ng-container>\n }\n </a>\n }\n }\n }\n </div>\n </div>\n\n @if (!collapsed() && (selectedItem()?.items || selectedAppsItems())) {\n <kit-navigation-menu-submenu class=\"sub-panel\"\n [@widthExpandCollapseAnimation]\n [menuItem]=\"selectedItem()\"\n [appsMenuItems]=\"selectedAppsItems()\"\n [logoPath]=\"logoPath\"\n (logoClicked)=\"handleLogoClick()\"\n ></kit-navigation-menu-submenu>\n }\n\n <ng-template #linkIconTemplate let-item>\n <kit-svg-icon class=\"nav-link-icon\"\n [icon]=\"item.icon\"\n [ngClass]=\"item?.iconType ?? KitSvgIconType.FILL\"\n ></kit-svg-icon>\n </ng-template>\n</div>\n", styles: [".kit-navigation-menu{display:flex;height:100%}.kit-navigation-menu .app-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:none;border-radius:8px;cursor:pointer}.kit-navigation-menu .app-btn-icon{width:16px;height:16px;fill:var(--ui-kit-color-white);stroke:var(--ui-kit-color-white)}.kit-navigation-menu .app-btn:hover{background:var(--ui-kit-color-grey-14)}.kit-navigation-menu .app-btn.active{background:var(--ui-kit-color-main)}.kit-navigation-menu .main-panel{display:flex;flex-direction:column;padding:25px 10px;width:56px;box-sizing:border-box}.kit-navigation-menu .main-panel:has(.app-btn){gap:46px}.kit-navigation-menu .main-panel:has(.app-btn) .nav-list{margin-top:0}.kit-navigation-menu .sub-panel{display:block;width:200px;overflow:hidden}.kit-navigation-menu .nav-list{display:flex;flex-direction:column;gap:30px;margin-top:82px}.kit-navigation-menu .nav-link{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;cursor:pointer}.kit-navigation-menu .nav-link:hover{background:var(--ui-kit-color-grey-14)}.kit-navigation-menu .nav-link.active{background:var(--ui-kit-color-main)}.kit-navigation-menu .nav-link-icon{display:block;width:16px;height:16px;flex-shrink:0}.kit-navigation-menu .nav-link-icon.fill{fill:var(--ui-kit-color-white);stroke:none}.kit-navigation-menu .nav-link-icon.stroke{fill:none;stroke:var(--ui-kit-color-white)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: i1$7.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$7.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: KitNavigationMenuSubmenuComponent, selector: "kit-navigation-menu-submenu", inputs: ["menuItem", "appsMenuItems", "logoPath"], outputs: ["logoClicked"] }, { kind: "directive", type: KitTooltipDirective, selector: "[kitTooltip]", inputs: ["kitTooltipPosition", "kitTooltipFilter", "kitTooltipTemplateRef", "kitTooltipVisible"] }], animations: [
|
|
4094
4092
|
expandCollapseAnimation('width'),
|
|
4095
4093
|
], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4096
4094
|
}
|
|
@@ -4098,12 +4096,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
|
|
|
4098
4096
|
type: Component,
|
|
4099
4097
|
args: [{ selector: 'kit-navigation-menu', changeDetection: ChangeDetectionStrategy.OnPush, animations: [
|
|
4100
4098
|
expandCollapseAnimation('width'),
|
|
4101
|
-
], standalone: false, template: "<div class=\"kit-navigation-menu\"\n [class.collapsed]=\"collapsed()\">\n <div class=\"main-panel\">\n @if (appsMenuItems.length > 1) {\n <button class=\"app-btn\"\n [class.active]=\"selectedAppsItems() && !collapsed()\"\n (click)=\"onAppsMenuButtonClick()\">\n <kit-svg-icon class=\"app-btn-icon\"\n [icon]=\"KitSvgIcon.FOUR_SQUARE\"\n ></kit-svg-icon>\n </button>\n }\n <div class=\"nav-list\">\n @for (item of menuItems; track
|
|
4102
|
-
}], ctorParameters: () => [{ type: i1$7.Router }, { type: KitNavigationMenuService }], propDecorators: {
|
|
4103
|
-
type: Input
|
|
4104
|
-
}], appsMenuItems: [{
|
|
4105
|
-
type: Input
|
|
4106
|
-
}], logoPath: [{
|
|
4099
|
+
], standalone: false, template: "<div class=\"kit-navigation-menu\"\n [class.collapsed]=\"collapsed()\">\n <div class=\"main-panel\">\n @if (appsMenuItems().length > 1) {\n <button class=\"app-btn\"\n [class.active]=\"selectedAppsItems() && !collapsed()\"\n (click)=\"onAppsMenuButtonClick()\">\n <kit-svg-icon class=\"app-btn-icon\"\n [icon]=\"KitSvgIcon.FOUR_SQUARE\"\n ></kit-svg-icon>\n </button>\n }\n <div class=\"nav-list\">\n @for (item of menuItems(); track $index) {\n @if (item.items?.length) {\n <a class=\"nav-link\"\n kitTooltip\n kitTooltipFilter=\".nav-link\"\n [kitTooltipPosition]=\"KitTooltipPosition.RIGHT\"\n [title]=\"item.title\"\n [class.active]=\"item.active\"\n (click)=\"handleClick(item)\">\n @if (item.icon) {\n <ng-container *ngTemplateOutlet=\"linkIconTemplate; context: { $implicit: item }\"\n ></ng-container>\n }\n </a>\n } @else {\n @if (item.link) {\n <a class=\"nav-link\"\n routerLinkActive=\"active\"\n kitTooltip\n kitTooltipFilter=\".nav-link\"\n [kitTooltipPosition]=\"KitTooltipPosition.RIGHT\"\n [title]=\"item.title\"\n [routerLink]=\"item.link\"\n (click)=\"handleClick(item)\">\n @if (item.icon) {\n <ng-container *ngTemplateOutlet=\"linkIconTemplate; context: { $implicit: item }\"\n ></ng-container>\n }\n </a>\n }\n }\n }\n </div>\n </div>\n\n @if (!collapsed() && (selectedItem()?.items || selectedAppsItems())) {\n <kit-navigation-menu-submenu class=\"sub-panel\"\n [@widthExpandCollapseAnimation]\n [menuItem]=\"selectedItem()\"\n [appsMenuItems]=\"selectedAppsItems()\"\n [logoPath]=\"logoPath\"\n (logoClicked)=\"handleLogoClick()\"\n ></kit-navigation-menu-submenu>\n }\n\n <ng-template #linkIconTemplate let-item>\n <kit-svg-icon class=\"nav-link-icon\"\n [icon]=\"item.icon\"\n [ngClass]=\"item?.iconType ?? KitSvgIconType.FILL\"\n ></kit-svg-icon>\n </ng-template>\n</div>\n", styles: [".kit-navigation-menu{display:flex;height:100%}.kit-navigation-menu .app-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:none;border-radius:8px;cursor:pointer}.kit-navigation-menu .app-btn-icon{width:16px;height:16px;fill:var(--ui-kit-color-white);stroke:var(--ui-kit-color-white)}.kit-navigation-menu .app-btn:hover{background:var(--ui-kit-color-grey-14)}.kit-navigation-menu .app-btn.active{background:var(--ui-kit-color-main)}.kit-navigation-menu .main-panel{display:flex;flex-direction:column;padding:25px 10px;width:56px;box-sizing:border-box}.kit-navigation-menu .main-panel:has(.app-btn){gap:46px}.kit-navigation-menu .main-panel:has(.app-btn) .nav-list{margin-top:0}.kit-navigation-menu .sub-panel{display:block;width:200px;overflow:hidden}.kit-navigation-menu .nav-list{display:flex;flex-direction:column;gap:30px;margin-top:82px}.kit-navigation-menu .nav-link{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;cursor:pointer}.kit-navigation-menu .nav-link:hover{background:var(--ui-kit-color-grey-14)}.kit-navigation-menu .nav-link.active{background:var(--ui-kit-color-main)}.kit-navigation-menu .nav-link-icon{display:block;width:16px;height:16px;flex-shrink:0}.kit-navigation-menu .nav-link-icon.fill{fill:var(--ui-kit-color-white);stroke:none}.kit-navigation-menu .nav-link-icon.stroke{fill:none;stroke:var(--ui-kit-color-white)}\n"] }]
|
|
4100
|
+
}], ctorParameters: () => [{ type: i1$7.Router }, { type: KitNavigationMenuService }], propDecorators: { logoPath: [{
|
|
4107
4101
|
type: Input
|
|
4108
4102
|
}] } });
|
|
4109
4103
|
|
|
@@ -4816,7 +4810,7 @@ class KitTabsComponent {
|
|
|
4816
4810
|
/**
|
|
4817
4811
|
* Defines the reference to the tabs content
|
|
4818
4812
|
*/
|
|
4819
|
-
this.tabs =
|
|
4813
|
+
this.tabs = contentChildren(KitTabComponent);
|
|
4820
4814
|
}
|
|
4821
4815
|
onTabSelect(event) {
|
|
4822
4816
|
this.tabSelected.emit({
|
|
@@ -4826,11 +4820,11 @@ class KitTabsComponent {
|
|
|
4826
4820
|
});
|
|
4827
4821
|
}
|
|
4828
4822
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4829
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: KitTabsComponent, isStandalone: false, selector: "kit-tabs", inputs: { type: "type", size: "size", animate: "animate" }, outputs: { tabSelected: "tabSelected" }, queries: [{ propertyName: "tabs", predicate: KitTabComponent }], ngImport: i0, template: "<div class=\"kit-tabs\">\n <kendo-tabstrip [ngClass]=\"[type, size]\"\n [animate]=\"animate\"\n (tabSelect)=\"onTabSelect($event)\">\n @for (tab of tabs; track tab) {\n <kendo-tabstrip-tab [title]=\"tab.title()\"\n [selected]=\"tab.selected\"\n [disabled]=\"tab.disabled()\">\n @if (tab.kitTitleTemplate) {\n <ng-template kendoTabTitle>\n <ng-container *ngTemplateOutlet=\"tab.kitTitleTemplate\"\n ></ng-container>\n </ng-template>\n } @else if (tab.icon) {\n <ng-template kendoTabTitle>\n <div class=\"tab-title\">\n <kit-svg-icon class=\"tab-title-icon\"\n [icon]=\"tab.icon\"\n [ngClass]=\"tab.iconType\"\n ></kit-svg-icon>\n <div class=\"tab title-text\">\n {{ tab.title() }}\n </div>\n </div>\n </ng-template>\n }\n <ng-template kendoTabContent>\n <ng-container *ngTemplateOutlet=\"tab.kitTabContent\"\n ></ng-container>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n </kendo-tabstrip>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$2.TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "size", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "component", type: i2$2.TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: i2$2.TabContentDirective, selector: "[kendoTabContent]" }, { kind: "directive", type: i2$2.TabTitleDirective, selector: "[kendoTabTitle]" }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4823
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: KitTabsComponent, isStandalone: false, selector: "kit-tabs", inputs: { type: "type", size: "size", animate: "animate" }, outputs: { tabSelected: "tabSelected" }, queries: [{ propertyName: "tabs", predicate: KitTabComponent, isSignal: true }], ngImport: i0, template: "<div class=\"kit-tabs\">\n <kendo-tabstrip [ngClass]=\"[type, size]\"\n [animate]=\"animate\"\n (tabSelect)=\"onTabSelect($event)\">\n @for (tab of tabs(); track tab) {\n <kendo-tabstrip-tab [title]=\"tab.title()\"\n [selected]=\"tab.selected\"\n [disabled]=\"tab.disabled()\">\n @if (tab.kitTitleTemplate) {\n <ng-template kendoTabTitle>\n <ng-container *ngTemplateOutlet=\"tab.kitTitleTemplate\"\n ></ng-container>\n </ng-template>\n } @else if (tab.icon) {\n <ng-template kendoTabTitle>\n <div class=\"tab-title\">\n <kit-svg-icon class=\"tab-title-icon\"\n [icon]=\"tab.icon\"\n [ngClass]=\"tab.iconType\"\n ></kit-svg-icon>\n <div class=\"tab title-text\">\n {{ tab.title() }}\n </div>\n </div>\n </ng-template>\n }\n <ng-template kendoTabContent>\n <ng-container *ngTemplateOutlet=\"tab.kitTabContent\"\n ></ng-container>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n </kendo-tabstrip>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$2.TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "size", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "component", type: i2$2.TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: i2$2.TabContentDirective, selector: "[kendoTabContent]" }, { kind: "directive", type: i2$2.TabTitleDirective, selector: "[kendoTabTitle]" }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4830
4824
|
}
|
|
4831
4825
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: KitTabsComponent, decorators: [{
|
|
4832
4826
|
type: Component,
|
|
4833
|
-
args: [{ selector: 'kit-tabs', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div class=\"kit-tabs\">\n <kendo-tabstrip [ngClass]=\"[type, size]\"\n [animate]=\"animate\"\n (tabSelect)=\"onTabSelect($event)\">\n @for (tab of tabs; track tab) {\n <kendo-tabstrip-tab [title]=\"tab.title()\"\n [selected]=\"tab.selected\"\n [disabled]=\"tab.disabled()\">\n @if (tab.kitTitleTemplate) {\n <ng-template kendoTabTitle>\n <ng-container *ngTemplateOutlet=\"tab.kitTitleTemplate\"\n ></ng-container>\n </ng-template>\n } @else if (tab.icon) {\n <ng-template kendoTabTitle>\n <div class=\"tab-title\">\n <kit-svg-icon class=\"tab-title-icon\"\n [icon]=\"tab.icon\"\n [ngClass]=\"tab.iconType\"\n ></kit-svg-icon>\n <div class=\"tab title-text\">\n {{ tab.title() }}\n </div>\n </div>\n </ng-template>\n }\n <ng-template kendoTabContent>\n <ng-container *ngTemplateOutlet=\"tab.kitTabContent\"\n ></ng-container>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n </kendo-tabstrip>\n</div>\n" }]
|
|
4827
|
+
args: [{ selector: 'kit-tabs', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div class=\"kit-tabs\">\n <kendo-tabstrip [ngClass]=\"[type, size]\"\n [animate]=\"animate\"\n (tabSelect)=\"onTabSelect($event)\">\n @for (tab of tabs(); track tab) {\n <kendo-tabstrip-tab [title]=\"tab.title()\"\n [selected]=\"tab.selected\"\n [disabled]=\"tab.disabled()\">\n @if (tab.kitTitleTemplate) {\n <ng-template kendoTabTitle>\n <ng-container *ngTemplateOutlet=\"tab.kitTitleTemplate\"\n ></ng-container>\n </ng-template>\n } @else if (tab.icon) {\n <ng-template kendoTabTitle>\n <div class=\"tab-title\">\n <kit-svg-icon class=\"tab-title-icon\"\n [icon]=\"tab.icon\"\n [ngClass]=\"tab.iconType\"\n ></kit-svg-icon>\n <div class=\"tab title-text\">\n {{ tab.title() }}\n </div>\n </div>\n </ng-template>\n }\n <ng-template kendoTabContent>\n <ng-container *ngTemplateOutlet=\"tab.kitTabContent\"\n ></ng-container>\n </ng-template>\n </kendo-tabstrip-tab>\n }\n </kendo-tabstrip>\n</div>\n" }]
|
|
4834
4828
|
}], propDecorators: { type: [{
|
|
4835
4829
|
type: Input
|
|
4836
4830
|
}], size: [{
|
|
@@ -4839,9 +4833,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
|
|
|
4839
4833
|
type: Input
|
|
4840
4834
|
}], tabSelected: [{
|
|
4841
4835
|
type: Output
|
|
4842
|
-
}], tabs: [{
|
|
4843
|
-
type: ContentChildren,
|
|
4844
|
-
args: [KitTabComponent]
|
|
4845
4836
|
}] } });
|
|
4846
4837
|
|
|
4847
4838
|
class KitTabsModule {
|