@progress/kendo-angular-layout 7.1.5-dev.202210121019 → 7.1.5-dev.202210131323

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: 1665569927,
+    publishDate: 1665667215,
     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/tabstrip/localization/messages.js

@@ -11,7 +11,7 @@ import * as i0 from "@angular/core";
 export class TabStripMessages extends ComponentMessages {
 }
 TabStripMessages.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TabStripMessages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-TabStripMessages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TabStripMessages, selector: "kendo-tabstrip-messages-base", inputs: { closeTitle: "closeTitle" }, usesInheritance: true, ngImport: i0 });
+TabStripMessages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TabStripMessages, selector: "kendo-tabstrip-messages-base", inputs: { closeTitle: "closeTitle", previousTabButton: "previousTabButton", nextTabButton: "nextTabButton" }, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TabStripMessages, decorators: [{
             type: Directive,
             args: [{
@@ -20,4 +20,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 }]
         }], propDecorators: { closeTitle: [{
                 type: Input
+            }], previousTabButton: [{
+                type: Input
+            }], nextTabButton: [{
+                type: Input
             }] } });

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-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: `
+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">
@@ -104,7 +104,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 args: ['class.k-state-default']
             }], activeClass: [{
                 type: HostBinding,
-                args: ['attr.aria-selected]']
+                args: ['attr.aria-selected']
             }, {
                 type: HostBinding,
                 args: ['class.k-active']

package/esm2015/tabstrip/tabstrip.component.js

@@ -362,7 +362,14 @@ TabStripComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
     ], queries: [{ propertyName: "tabs", predicate: TabStripTabComponent }], viewQueries: [{ propertyName: "tablist", first: true, predicate: ["tablist"], descendants: true }, { propertyName: "prevScrollButton", first: true, predicate: ["prevScrollButton"], descendants: true }, { propertyName: "nextScrollButton", first: true, predicate: ["nextScrollButton"], descendants: true }, { propertyName: "tabHeaderContainers", predicate: ["tabHeaderContainer"], descendants: true, read: ElementRef }], exportAs: ["kendoTabStrip"], usesOnChanges: true, ngImport: i0, template: `
         <ng-container kendoTabStripLocalizedMessages
             i18n-closeTitle="kendo.tabstrip.closeTitle|The title for the **Close** button in the TabStrip tab."
-            closeTitle="Close">
+            closeTitle="Close"
+            
+            i18n-previousTabButton="kendo.tabstrip.previousTabButton|The title for the **Previous Tab** button when the Tabstrip is scrollable."
+            previousTabButton="Previous Tab"
+
+            i18n-nextTabButton="kendo.tabstrip.nextTabButton|The title for the **Next Tab** button when the Tabstrip is scrollable."
+            nextTabButton="Next Tab"
+        >
         </ng-container>
         <ng-container *ngIf="!tabsAtBottom">
             <ng-container *ngTemplateOutlet="heading">
@@ -380,19 +387,23 @@ TabStripComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
         <ng-template #heading>
             <div class="k-tabstrip-items-wrapper" [ngClass]="itemsWrapperClass">
                 <span 
+                    role="button"
                     *ngIf="hasScrollButtons"
                     #prevScrollButton
                     kendoTabStripScrollableButton
                     [scrollable]="scrollable"
                     [tabPosition]="tabPosition"
                     [prev]="true"
+                    [title]="localization.get('previousTabButton')"
                     (tabScroll)="tabScroll.emit($event)"
-                    (onClick)="onScrollButtonClick($event)"></span>
+                    (onClick)="onScrollButtonClick($event)">
+                </span>
                 <ul role="tablist" #tablist
                     class="k-reset k-tabstrip-items"
                     [style.justifyContent]="tabsAlignmentStyles"
                     [style.width]="tabListWidth"
                     [style.height]="tabListHeight"
+                    [attr.aria-orientation]="tabPosition === 'left' || tabPosition === 'right' ? 'vertical' : 'horizontal'"
                 >
                     <ng-container *ngFor="let tab of tabs; let i = index;">
                         <li
@@ -412,12 +423,14 @@ TabStripComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
                     </ng-container>
                 </ul>
                 <span
+                    role="button"
                     *ngIf="hasScrollButtons"
                     #nextScrollButton
                     kendoTabStripScrollableButton
                     [scrollable]="scrollable"
                     [tabPosition]="tabPosition"
                     [prev]="false"
+                    [title]="localization.get('nextTabButton')"
                     (tabScroll)="tabScroll.emit($event)"
                     (onClick)="onScrollButtonClick($event)"></span>
             </div>
@@ -477,7 +490,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
         <ng-container kendoTabStripLocalizedMessages
             i18n-closeTitle="kendo.tabstrip.closeTitle|The title for the **Close** button in the TabStrip tab."
-            closeTitle="Close">
+            closeTitle="Close"
+            
+            i18n-previousTabButton="kendo.tabstrip.previousTabButton|The title for the **Previous Tab** button when the Tabstrip is scrollable."
+            previousTabButton="Previous Tab"
+
+            i18n-nextTabButton="kendo.tabstrip.nextTabButton|The title for the **Next Tab** button when the Tabstrip is scrollable."
+            nextTabButton="Next Tab"
+        >
         </ng-container>
         <ng-container *ngIf="!tabsAtBottom">
             <ng-container *ngTemplateOutlet="heading">
@@ -495,19 +515,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         <ng-template #heading>
             <div class="k-tabstrip-items-wrapper" [ngClass]="itemsWrapperClass">
                 <span 
+                    role="button"
                     *ngIf="hasScrollButtons"
                     #prevScrollButton
                     kendoTabStripScrollableButton
                     [scrollable]="scrollable"
                     [tabPosition]="tabPosition"
                     [prev]="true"
+                    [title]="localization.get('previousTabButton')"
                     (tabScroll)="tabScroll.emit($event)"
-                    (onClick)="onScrollButtonClick($event)"></span>
+                    (onClick)="onScrollButtonClick($event)">
+                </span>
                 <ul role="tablist" #tablist
                     class="k-reset k-tabstrip-items"
                     [style.justifyContent]="tabsAlignmentStyles"
                     [style.width]="tabListWidth"
                     [style.height]="tabListHeight"
+                    [attr.aria-orientation]="tabPosition === 'left' || tabPosition === 'right' ? 'vertical' : 'horizontal'"
                 >
                     <ng-container *ngFor="let tab of tabs; let i = index;">
                         <li
@@ -527,12 +551,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     </ng-container>
                 </ul>
                 <span
+                    role="button"
                     *ngIf="hasScrollButtons"
                     #nextScrollButton
                     kendoTabStripScrollableButton
                     [scrollable]="scrollable"
                     [tabPosition]="tabPosition"
                     [prev]="false"
+                    [title]="localization.get('nextTabButton')"
                     (tabScroll)="tabScroll.emit($event)"
                     (onClick)="onScrollButtonClick($event)"></span>
             </div>

package/fesm2015/kendo-angular-layout.js

@@ -26,7 +26,7 @@ const packageMetadata = {
     name: '@progress/kendo-angular-layout',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1665569927,
+    publishDate: 1665667215,
     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'
 };
@@ -3120,7 +3120,7 @@ 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-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: `
+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">
@@ -3174,7 +3174,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 args: ['class.k-state-default']
             }], activeClass: [{
                 type: HostBinding,
-                args: ['attr.aria-selected]']
+                args: ['attr.aria-selected']
             }, {
                 type: HostBinding,
                 args: ['class.k-active']
@@ -3198,7 +3198,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
 class TabStripMessages extends ComponentMessages {
 }
 TabStripMessages.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TabStripMessages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-TabStripMessages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TabStripMessages, selector: "kendo-tabstrip-messages-base", inputs: { closeTitle: "closeTitle" }, usesInheritance: true, ngImport: i0 });
+TabStripMessages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TabStripMessages, selector: "kendo-tabstrip-messages-base", inputs: { closeTitle: "closeTitle", previousTabButton: "previousTabButton", nextTabButton: "nextTabButton" }, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TabStripMessages, decorators: [{
             type: Directive,
             args: [{
@@ -3207,6 +3207,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 }]
         }], propDecorators: { closeTitle: [{
                 type: Input
+            }], previousTabButton: [{
+                type: Input
+            }], nextTabButton: [{
+                type: Input
             }] } });
 
 /**
@@ -3574,7 +3578,14 @@ TabStripComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
     ], queries: [{ propertyName: "tabs", predicate: TabStripTabComponent }], viewQueries: [{ propertyName: "tablist", first: true, predicate: ["tablist"], descendants: true }, { propertyName: "prevScrollButton", first: true, predicate: ["prevScrollButton"], descendants: true }, { propertyName: "nextScrollButton", first: true, predicate: ["nextScrollButton"], descendants: true }, { propertyName: "tabHeaderContainers", predicate: ["tabHeaderContainer"], descendants: true, read: ElementRef }], exportAs: ["kendoTabStrip"], usesOnChanges: true, ngImport: i0, template: `
         <ng-container kendoTabStripLocalizedMessages
             i18n-closeTitle="kendo.tabstrip.closeTitle|The title for the **Close** button in the TabStrip tab."
-            closeTitle="Close">
+            closeTitle="Close"
+            
+            i18n-previousTabButton="kendo.tabstrip.previousTabButton|The title for the **Previous Tab** button when the Tabstrip is scrollable."
+            previousTabButton="Previous Tab"
+
+            i18n-nextTabButton="kendo.tabstrip.nextTabButton|The title for the **Next Tab** button when the Tabstrip is scrollable."
+            nextTabButton="Next Tab"
+        >
         </ng-container>
         <ng-container *ngIf="!tabsAtBottom">
             <ng-container *ngTemplateOutlet="heading">
@@ -3592,19 +3603,23 @@ TabStripComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
         <ng-template #heading>
             <div class="k-tabstrip-items-wrapper" [ngClass]="itemsWrapperClass">
                 <span 
+                    role="button"
                     *ngIf="hasScrollButtons"
                     #prevScrollButton
                     kendoTabStripScrollableButton
                     [scrollable]="scrollable"
                     [tabPosition]="tabPosition"
                     [prev]="true"
+                    [title]="localization.get('previousTabButton')"
                     (tabScroll)="tabScroll.emit($event)"
-                    (onClick)="onScrollButtonClick($event)"></span>
+                    (onClick)="onScrollButtonClick($event)">
+                </span>
                 <ul role="tablist" #tablist
                     class="k-reset k-tabstrip-items"
                     [style.justifyContent]="tabsAlignmentStyles"
                     [style.width]="tabListWidth"
                     [style.height]="tabListHeight"
+                    [attr.aria-orientation]="tabPosition === 'left' || tabPosition === 'right' ? 'vertical' : 'horizontal'"
                 >
                     <ng-container *ngFor="let tab of tabs; let i = index;">
                         <li
@@ -3624,12 +3639,14 @@ TabStripComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
                     </ng-container>
                 </ul>
                 <span
+                    role="button"
                     *ngIf="hasScrollButtons"
                     #nextScrollButton
                     kendoTabStripScrollableButton
                     [scrollable]="scrollable"
                     [tabPosition]="tabPosition"
                     [prev]="false"
+                    [title]="localization.get('nextTabButton')"
                     (tabScroll)="tabScroll.emit($event)"
                     (onClick)="onScrollButtonClick($event)"></span>
             </div>
@@ -3689,7 +3706,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     template: `
         <ng-container kendoTabStripLocalizedMessages
             i18n-closeTitle="kendo.tabstrip.closeTitle|The title for the **Close** button in the TabStrip tab."
-            closeTitle="Close">
+            closeTitle="Close"
+            
+            i18n-previousTabButton="kendo.tabstrip.previousTabButton|The title for the **Previous Tab** button when the Tabstrip is scrollable."
+            previousTabButton="Previous Tab"
+
+            i18n-nextTabButton="kendo.tabstrip.nextTabButton|The title for the **Next Tab** button when the Tabstrip is scrollable."
+            nextTabButton="Next Tab"
+        >
         </ng-container>
         <ng-container *ngIf="!tabsAtBottom">
             <ng-container *ngTemplateOutlet="heading">
@@ -3707,19 +3731,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         <ng-template #heading>
             <div class="k-tabstrip-items-wrapper" [ngClass]="itemsWrapperClass">
                 <span 
+                    role="button"
                     *ngIf="hasScrollButtons"
                     #prevScrollButton
                     kendoTabStripScrollableButton
                     [scrollable]="scrollable"
                     [tabPosition]="tabPosition"
                     [prev]="true"
+                    [title]="localization.get('previousTabButton')"
                     (tabScroll)="tabScroll.emit($event)"
-                    (onClick)="onScrollButtonClick($event)"></span>
+                    (onClick)="onScrollButtonClick($event)">
+                </span>
                 <ul role="tablist" #tablist
                     class="k-reset k-tabstrip-items"
                     [style.justifyContent]="tabsAlignmentStyles"
                     [style.width]="tabListWidth"
                     [style.height]="tabListHeight"
+                    [attr.aria-orientation]="tabPosition === 'left' || tabPosition === 'right' ? 'vertical' : 'horizontal'"
                 >
                     <ng-container *ngFor="let tab of tabs; let i = index;">
                         <li
@@ -3739,12 +3767,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     </ng-container>
                 </ul>
                 <span
+                    role="button"
                     *ngIf="hasScrollButtons"
                     #nextScrollButton
                     kendoTabStripScrollableButton
                     [scrollable]="scrollable"
                     [tabPosition]="tabPosition"
                     [prev]="false"
+                    [title]="localization.get('nextTabButton')"
                     (tabScroll)="tabScroll.emit($event)"
                     (onClick)="onScrollButtonClick($event)"></span>
             </div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-layout",
-  "version": "7.1.5-dev.202210121019",
+  "version": "7.1.5-dev.202210131323",
   "description": "Kendo UI for Angular Layout Package - a collection of components to create professional application layoyts",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",

package/tabstrip/localization/messages.d.ts

@@ -12,6 +12,14 @@ export declare class TabStripMessages extends ComponentMessages {
      * The title for the **Close** button in the TabStrip tab.
      */
     closeTitle: string;
+    /**
+     * The title for the **Previous Tab** button when the Tabstrip is scrollable.
+     */
+    previousTabButton: string;
+    /**
+     * The title for the **Next Tab** button when the Tabstrip is scrollable.
+     */
+    nextTabButton: string;
     static ɵfac: i0.ɵɵFactoryDeclaration<TabStripMessages, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TabStripMessages, "kendo-tabstrip-messages-base", never, { "closeTitle": "closeTitle"; }, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TabStripMessages, "kendo-tabstrip-messages-base", never, { "closeTitle": "closeTitle"; "previousTabButton": "previousTabButton"; "nextTabButton": "nextTabButton"; }, {}, never>;
 }