@progress/kendo-angular-layout 7.1.0 → 7.1.2-dev.202208301247

package/drawer/util.d.ts

@@ -9,7 +9,7 @@ export declare const DRAWER_LINK_SELECTOR = ".k-drawer-link";
 /**
  * @hidden
  */
-export declare const ACTIVE_NESTED_LINK_SELECTOR = ":focus:not(.k-state-disabled) .k-drawer-link";
+export declare const ACTIVE_NESTED_LINK_SELECTOR = ":focus:not(.k-disabled) .k-drawer-link";
 /**
  * @hidden
  */

package/esm2015/drawer/item.component.js

@@ -47,7 +47,7 @@ export class DrawerItemComponent {
     }
 }
 DrawerItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DrawerItemComponent, deps: [{ token: i1.DrawerService }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-DrawerItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: DrawerItemComponent, selector: "[kendoDrawerItem]", inputs: { viewItem: "viewItem", index: "index", itemTemplate: "itemTemplate", mini: "mini", expanded: "expanded", disabled: "disabled", cssClass: "cssClass", cssStyle: "cssStyle" }, host: { properties: { "attr.aria-disabled": "this.disabledClass", "class.k-state-disabled": "this.disabledClass", "attr.aria-current": "this.selectedClass", "class.k-state-selected": "this.selectedClass", "attr.aria-label": "this.label" } }, ngImport: i0, template: `
+DrawerItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: DrawerItemComponent, selector: "[kendoDrawerItem]", inputs: { viewItem: "viewItem", index: "index", itemTemplate: "itemTemplate", mini: "mini", expanded: "expanded", disabled: "disabled", cssClass: "cssClass", cssStyle: "cssStyle" }, host: { properties: { "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "attr.aria-current": "this.selectedClass", "class.k-selected": "this.selectedClass", "attr.aria-label": "this.label" } }, ngImport: i0, template: `
         <ng-template *ngIf="itemTemplate; else defaultTemplate"
             [ngTemplateOutlet]="itemTemplate"
             [ngTemplateOutletContext]="{
@@ -64,8 +64,8 @@ DrawerItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
                 <span class="k-item-text">{{ item.text }}</span>
                 <span *ngIf="viewItem.hasChildren"
                       class="k-icon k-drawer-toggle"
-                      [class.k-i-arrow-chevron-up]="viewItem.isExpanded"
-                      [class.k-i-arrow-chevron-down]="!viewItem.isExpanded"
+                      [class.k-i-chevron-up]="viewItem.isExpanded"
+                      [class.k-i-chevron-down]="!viewItem.isExpanded"
                 ></span>
             </ng-container>
             <ng-container *ngIf="mini && !expanded">
@@ -95,8 +95,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 <span class="k-item-text">{{ item.text }}</span>
                 <span *ngIf="viewItem.hasChildren"
                       class="k-icon k-drawer-toggle"
-                      [class.k-i-arrow-chevron-up]="viewItem.isExpanded"
-                      [class.k-i-arrow-chevron-down]="!viewItem.isExpanded"
+                      [class.k-i-chevron-up]="viewItem.isExpanded"
+                      [class.k-i-chevron-down]="!viewItem.isExpanded"
                 ></span>
             </ng-container>
             <ng-container *ngIf="mini && !expanded">
@@ -126,13 +126,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 args: ['attr.aria-disabled']
             }, {
                 type: HostBinding,
-                args: ['class.k-state-disabled']
+                args: ['class.k-disabled']
             }], selectedClass: [{
                 type: HostBinding,
                 args: ['attr.aria-current']
             }, {
                 type: HostBinding,
-                args: ['class.k-state-selected']
+                args: ['class.k-selected']
             }], label: [{
                 type: HostBinding,
                 args: ['attr.aria-label']

package/esm2015/drawer/util.js

@@ -9,7 +9,7 @@ export const DRAWER_LINK_SELECTOR = '.k-drawer-link';
 /**
  * @hidden
  */
-export const ACTIVE_NESTED_LINK_SELECTOR = ':focus:not(.k-state-disabled) .k-drawer-link';
+export const ACTIVE_NESTED_LINK_SELECTOR = ':focus:not(.k-disabled) .k-drawer-link';
 /**
  * @hidden
  */

package/esm2015/expansionpanel/expansionpanel.component.js

@@ -228,10 +228,10 @@ export class ExpansionPanelComponent {
      */
     get indicatorClasses() {
         if (this.expanded) {
-            return this.collapseIcon ? this.collapseIcon : `k-icon k-i-arrow-chevron-up`;
+            return this.collapseIcon ? this.collapseIcon : `k-icon k-i-chevron-up`;
         }
         else {
-            return this.expandIcon ? this.expandIcon : `k-icon k-i-arrow-chevron-down`;
+            return this.expandIcon ? this.expandIcon : `k-icon k-i-chevron-down`;
         }
     }
     /**
@@ -299,7 +299,7 @@ export class ExpansionPanelComponent {
     }
 }
 ExpansionPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ExpansionPanelComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.LocalizationService }, { token: i2.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Component });
-ExpansionPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ExpansionPanelComponent, selector: "kendo-expansionpanel", inputs: { title: "title", subtitle: "subtitle", disabled: "disabled", expanded: "expanded", expandIcon: "expandIcon", collapseIcon: "collapseIcon", animation: "animation" }, outputs: { expandedChange: "expandedChange", action: "action", expand: "expand", collapse: "collapse" }, host: { listeners: { "blur": "onComponentBlur()", "focus": "onComponentFocus()" }, properties: { "class.k-expander": "this.hostClass", "class.k-expanded": "this.expandedClass", "class.k-state-focus": "this.focusClass", "attr.aria-disabled": "this.disabledClass", "class.k-state-disabled": "this.disabledClass", "attr.dir": "this.direction", "attr.tabindex": "this.tabindex" } }, providers: [
+ExpansionPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ExpansionPanelComponent, selector: "kendo-expansionpanel", inputs: { title: "title", subtitle: "subtitle", disabled: "disabled", expanded: "expanded", expandIcon: "expandIcon", collapseIcon: "collapseIcon", animation: "animation" }, outputs: { expandedChange: "expandedChange", action: "action", expand: "expand", collapse: "collapse" }, host: { listeners: { "blur": "onComponentBlur()", "focus": "onComponentFocus()" }, properties: { "class.k-expander": "this.hostClass", "class.k-expanded": "this.expandedClass", "class.k-focus": "this.focusClass", "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "attr.dir": "this.direction", "attr.tabindex": "this.tabindex" } }, providers: [
         LocalizationService,
         {
             provide: L10N_PREFIX,
@@ -408,13 +408,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 args: ['class.k-expanded']
             }], focusClass: [{
                 type: HostBinding,
-                args: ['class.k-state-focus']
+                args: ['class.k-focus']
             }], disabledClass: [{
                 type: HostBinding,
                 args: ['attr.aria-disabled']
             }, {
                 type: HostBinding,
-                args: ['class.k-state-disabled']
+                args: ['class.k-disabled']
             }], direction: [{
                 type: HostBinding,
                 args: ['attr.dir']

package/esm2015/package-metadata.js

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-layout',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1655110279,
+    publishDate: 1661863628,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/esm2015/panelbar/panelbar-item.component.js

@@ -244,12 +244,12 @@ export class PanelBarItemComponent {
     }
 }
 PanelBarItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PanelBarItemComponent, deps: [{ token: PanelBarItemComponent, host: true, optional: true, skipSelf: true }, { token: i1.PanelBarService }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-PanelBarItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: PanelBarItemComponent, selector: "kendo-panelbar-item", inputs: { title: "title", id: "id", icon: "icon", iconClass: "iconClass", imageUrl: "imageUrl", disabled: "disabled", expanded: "expanded", selected: "selected", content: "content", items: "items", template: "template" }, host: { properties: { "attr.role": "this.role", "attr.title": "this.titleAttribute", "class.k-item": "this.kItemClass", "class.k-state-default": "this.kStateDefaultClass", "class.k-state-disabled": "this.kStateDisabledClass", "class.k-state-expanded": "this.kStateExpandedClass", "id": "this.itemId", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-selected": "this.ariaSelected", "attr.aria-disabled": "this.ariaDisabled", "class.k-panelbar-header": "this.headerClass", "class.k-panelbar-item": "this.childClass" } }, queries: [{ propertyName: "contentItems", predicate: PanelBarItemComponent }, { propertyName: "contentTemplate", predicate: PanelBarContentDirective }, { propertyName: "titleTemplates", predicate: PanelBarItemTitleDirective }], viewQueries: [{ propertyName: "header", first: true, predicate: ["header"], descendants: true }, { propertyName: "contentWrapper", first: true, predicate: ["contentWrapper"], descendants: true }, { propertyName: "viewChildItems", predicate: PanelBarItemComponent, descendants: true }], exportAs: ["kendoPanelbarItem"], ngImport: i0, template: `
+PanelBarItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: PanelBarItemComponent, selector: "kendo-panelbar-item", inputs: { title: "title", id: "id", icon: "icon", iconClass: "iconClass", imageUrl: "imageUrl", disabled: "disabled", expanded: "expanded", selected: "selected", content: "content", items: "items", template: "template" }, host: { properties: { "attr.role": "this.role", "attr.title": "this.titleAttribute", "class.k-item": "this.kItemClass", "class.k-state-default": "this.kStateDefaultClass", "class.k-disabled": "this.kStateDisabledClass", "class.k-state-expanded": "this.kStateExpandedClass", "id": "this.itemId", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-selected": "this.ariaSelected", "attr.aria-disabled": "this.ariaDisabled", "class.k-panelbar-header": "this.headerClass", "class.k-panelbar-item": "this.childClass" } }, queries: [{ propertyName: "contentItems", predicate: PanelBarItemComponent }, { propertyName: "contentTemplate", predicate: PanelBarContentDirective }, { propertyName: "titleTemplates", predicate: PanelBarItemTitleDirective }], viewQueries: [{ propertyName: "header", first: true, predicate: ["header"], descendants: true }, { propertyName: "contentWrapper", first: true, predicate: ["contentWrapper"], descendants: true }, { propertyName: "viewChildItems", predicate: PanelBarItemComponent, descendants: true }], exportAs: ["kendoPanelbarItem"], ngImport: i0, template: `
             <span
                 #header
                 [class.k-link]="true"
-                [class.k-state-selected]="!disabled && selected"
-                [class.k-state-focused]="focused && wrapperFocused"
+                [class.k-selected]="!disabled && selected"
+                [class.k-focus]="focused && wrapperFocused"
                 (click)="onItemClick($event)">
                 <span
                     *ngIf="icon || iconClass"
@@ -280,7 +280,7 @@ PanelBarItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
                 }"></ng-template>
                 <span *ngIf="hasChildItems || hasContent"
                     class="k-icon k-panelbar-toggle"
-                    [ngClass]="{'k-i-arrow-chevron-up k-panelbar-collapse': expanded, 'k-i-arrow-chevron-down k-panelbar-expand': !expanded}">
+                    [ngClass]="{'k-i-chevron-up k-panelbar-collapse': expanded, 'k-i-chevron-down k-panelbar-expand': !expanded}">
                 </span>
             </span>
             <div #contentWrapper
@@ -389,8 +389,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             <span
                 #header
                 [class.k-link]="true"
-                [class.k-state-selected]="!disabled && selected"
-                [class.k-state-focused]="focused && wrapperFocused"
+                [class.k-selected]="!disabled && selected"
+                [class.k-focus]="focused && wrapperFocused"
                 (click)="onItemClick($event)">
                 <span
                     *ngIf="icon || iconClass"
@@ -421,7 +421,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 }"></ng-template>
                 <span *ngIf="hasChildItems || hasContent"
                     class="k-icon k-panelbar-toggle"
-                    [ngClass]="{'k-i-arrow-chevron-up k-panelbar-collapse': expanded, 'k-i-arrow-chevron-down k-panelbar-expand': !expanded}">
+                    [ngClass]="{'k-i-chevron-up k-panelbar-collapse': expanded, 'k-i-chevron-down k-panelbar-expand': !expanded}">
                 </span>
             </span>
             <div #contentWrapper
@@ -545,7 +545,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 args: ['class.k-state-default']
             }], kStateDisabledClass: [{
                 type: HostBinding,
-                args: ['class.k-state-disabled']
+                args: ['class.k-disabled']
             }], kStateExpandedClass: [{
                 type: HostBinding,
                 args: ['class.k-state-expanded']

package/esm2015/splitter/splitter-bar.component.js

@@ -49,7 +49,7 @@ export class SplitterBarComponent {
         const isDraggable = this.splitter.isDraggable(this.index);
         const isStatic = this.splitter.isStatic(this.index);
         return classFromObject({
-            'k-state-focused': this.focused,
+            'k-focus': this.focused,
             'k-splitbar': true,
             'k-splitbar-horizontal': isHorizontal,
             'k-splitbar-vertical': !isHorizontal,
@@ -145,10 +145,10 @@ export class SplitterBarComponent {
             'k-icon': true,
             'k-hidden': !isCollapsible || nextPane.isHidden,
             'k-collapse-prev': isCollapsible,
-            'k-i-arrow-60-left': isCollapsible && isHorizontal && !isCollapsed,
-            'k-i-arrow-60-right': isCollapsible && isHorizontal && isCollapsed,
-            'k-i-arrow-60-up': isCollapsible && !isHorizontal && !isCollapsed,
-            'k-i-arrow-60-down': isCollapsible && !isHorizontal && isCollapsed
+            'k-i-caret-alt-left': isCollapsible && isHorizontal && !isCollapsed,
+            'k-i-caret-alt-right': isCollapsible && isHorizontal && isCollapsed,
+            'k-i-caret-alt-up': isCollapsible && !isHorizontal && !isCollapsed,
+            'k-i-caret-alt-down': isCollapsible && !isHorizontal && isCollapsed
         });
     }
     nextArrowClass() {
@@ -161,10 +161,10 @@ export class SplitterBarComponent {
             'k-icon': true,
             'k-hidden': !isCollapsible || prevPane.isHidden,
             'k-collapse-next': isCollapsible,
-            'k-i-arrow-60-right': isCollapsible && isHorizontal && !isCollapsed,
-            'k-i-arrow-60-left': isCollapsible && isHorizontal && isCollapsed,
-            'k-i-arrow-60-down': isCollapsible && !isHorizontal && !isCollapsed,
-            'k-i-arrow-60-up': isCollapsible && !isHorizontal && isCollapsed
+            'k-i-caret-alt-right': isCollapsible && isHorizontal && !isCollapsed,
+            'k-i-caret-alt-left': isCollapsible && isHorizontal && isCollapsed,
+            'k-i-caret-alt-down': isCollapsible && !isHorizontal && !isCollapsed,
+            'k-i-caret-alt-up': isCollapsible && !isHorizontal && isCollapsed
         });
     }
     tryToggleNearest() {
@@ -176,7 +176,7 @@ export class SplitterBarComponent {
     }
 }
 SplitterBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SplitterBarComponent, deps: [{ token: i1.DraggableDirective, host: true }, { token: i0.ElementRef }, { token: i2.SplitterService }, { token: i3.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-SplitterBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SplitterBarComponent, selector: "kendo-splitter-bar", inputs: { orientation: "orientation", index: "index" }, host: { listeners: { "dblclick": "collapseAny()", "focusin": "onFocusIn()", "focusout": "onFocusOut()", "keydown": "onKeyDown($event)" }, properties: { "attr.aria-orientation": "this.orientation", "attr.role": "this.ariaRole", "class.k-state-focused": "this.focused", "attr.tabindex": "this.tabIndex", "class": "this.hostClasses", "style.-ms-flex-order": "this.order", "style.order": "this.order" } }, ngImport: i0, template: `
+SplitterBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SplitterBarComponent, selector: "kendo-splitter-bar", inputs: { orientation: "orientation", index: "index" }, host: { listeners: { "dblclick": "collapseAny()", "focusin": "onFocusIn()", "focusout": "onFocusOut()", "keydown": "onKeyDown($event)" }, properties: { "attr.aria-orientation": "this.orientation", "attr.role": "this.ariaRole", "class.k-focus": "this.focused", "attr.tabindex": "this.tabIndex", "class": "this.hostClasses", "style.-ms-flex-order": "this.order", "style.order": "this.order" } }, ngImport: i0, template: `
       <div [class]="previousArrowClass()" (click)="togglePrevious()"></div>
       <div class="k-resize-handle"></div>
       <div [class]="nextArrowClass()" (click)="toggleNext()"></div>
@@ -205,7 +205,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 args: ['attr.role']
             }], focused: [{
                 type: HostBinding,
-                args: ['class.k-state-focused']
+                args: ['class.k-focus']
             }], tabIndex: [{
                 type: HostBinding,
                 args: ['attr.tabindex']

package/esm2015/stepper/step.component.js

@@ -106,7 +106,7 @@ export class StepperStepComponent {
             return this.successIcon ? `${this.successIcon}` : 'k-icon k-i-check';
         }
         else {
-            return this.errorIcon ? `${this.errorIcon}` : 'k-icon k-i-warning';
+            return this.errorIcon ? `${this.errorIcon}` : 'k-icon k-i-exclamation-circle';
         }
     }
     get indicatorText() {

package/esm2015/tabstrip/constants.js

@@ -22,10 +22,10 @@ export const HIDDEN_CLASS = 'k-hidden';
  * @hidden
  */
 export const DIRECTION_CLASSES = {
-    left: 'k-i-arrow-60-left',
-    right: 'k-i-arrow-60-right',
-    up: 'k-i-arrow-60-up',
-    down: 'k-i-arrow-60-down'
+    left: 'k-i-caret-alt-left',
+    right: 'k-i-caret-alt-right',
+    up: 'k-i-caret-alt-up',
+    down: 'k-i-caret-alt-down'
 };
 /**
  * @hidden

package/esm2015/tabstrip/rendering/tab.component.js

@@ -50,7 +50,7 @@ export class TabComponent {
     }
 }
 TabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TabComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-TabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TabComponent, selector: "[kendoTabStripTab]", inputs: { tab: "tab", index: "index", tabStripClosable: "tabStripClosable", tabStripCloseIcon: "tabStripCloseIcon" }, outputs: { tabClose: "tabClose" }, host: { properties: { "class.k-item": "this.hostClasses", "class.k-state-default": "this.hostClasses", "attr.aria-selected]": "this.activeClass", "class.k-state-active": "this.activeClass", "attr.aria-disabled]": "this.disabledClass", "class.k-state-disabled": "this.disabledClass", "class.k-state-focused": "this.focusedClass", "attr.tabindex": "this.tabIndex" } }, ngImport: i0, template: `
+TabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TabComponent, selector: "[kendoTabStripTab]", inputs: { tab: "tab", index: "index", tabStripClosable: "tabStripClosable", tabStripCloseIcon: "tabStripCloseIcon" }, outputs: { tabClose: "tabClose" }, host: { properties: { "class.k-item": "this.hostClasses", "class.k-state-default": "this.hostClasses", "attr.aria-selected]": "this.activeClass", "class.k-active": "this.activeClass", "attr.aria-disabled]": "this.disabledClass", "class.k-disabled": "this.disabledClass", "class.k-focus": "this.focusedClass", "attr.tabindex": "this.tabIndex" } }, ngImport: i0, template: `
         <span class="k-link" *ngIf="!tab.tabTitle">{{ tab.title }}</span>
         <span class="k-link" *ngIf="tab.tabTitle">
             <ng-template [ngTemplateOutlet]="tab.tabTitle?.templateRef">
@@ -107,16 +107,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 args: ['attr.aria-selected]']
             }, {
                 type: HostBinding,
-                args: ['class.k-state-active']
+                args: ['class.k-active']
             }], disabledClass: [{
                 type: HostBinding,
                 args: ['attr.aria-disabled]']
             }, {
                 type: HostBinding,
-                args: ['class.k-state-disabled']
+                args: ['class.k-disabled']
             }], focusedClass: [{
                 type: HostBinding,
-                args: ['class.k-state-focused']
+                args: ['class.k-focus']
             }], tabIndex: [{
                 type: HostBinding,
                 args: ['attr.tabindex']

package/esm2015/tabstrip/tabstrip.component.js

@@ -427,7 +427,7 @@ TabStripComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
                 <div
                     [@state]="tab.selected && animate ? 'active' : 'inactive'"
                     *ngIf="tab.selected || keepTabContent"
-                    [ngClass]="!this.keepTabContent || tab.selected ? 'k-content k-state-active' : 'k-content'"
+                    [ngClass]="!this.keepTabContent || tab.selected ? 'k-content k-active' : 'k-content'"
                     [tabIndex]="0"
                     role="tabpanel"
                     [id]="'k-tabstrip-tabpanel-' + i"
@@ -542,7 +542,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 <div
                     [@state]="tab.selected && animate ? 'active' : 'inactive'"
                     *ngIf="tab.selected || keepTabContent"
-                    [ngClass]="!this.keepTabContent || tab.selected ? 'k-content k-state-active' : 'k-content'"
+                    [ngClass]="!this.keepTabContent || tab.selected ? 'k-content k-active' : 'k-content'"
                     [tabIndex]="0"
                     role="tabpanel"
                     [id]="'k-tabstrip-tabpanel-' + i"

package/esm2015/tilelayout/tilelayout.component.js

@@ -70,12 +70,12 @@ export class TileLayoutComponent {
          */
         this.autoFlow = 'column';
         /**
-         * Fires when the user completes the reordering of the item ([see example]({% slug overview_tilelayout %}#toc-events)).
+         * Fires when the user completes the reordering of the item ([see example]({% slug reordering_tilelayout %})).
          * This event is preventable. If you cancel it, the item will not be reordered.
          */
         this.reorder = new EventEmitter();
         /**
-         * Fires when the user completes the resizing of the item ([see example]({% slug overview_tilelayout %}#toc-events)).
+         * Fires when the user completes the resizing of the item ([see example]({% slug resizing_tilelayout %})).
          * This event is preventable. If you cancel it, the item will not be resized.
          */
         this.resize = new EventEmitter();