@progress/kendo-angular-layout 7.1.6 → 7.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-layout",
-  "version": "7.1.6",
+  "version": "7.2.0",
   "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/tilelayout/keyboard-navigation.service.d.ts

@@ -0,0 +1,34 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { NgZone, Renderer2 } from '@angular/core';
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { BehaviorSubject } from 'rxjs';
+import { DraggingServiceConfig } from './models/dragging-config.interface';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export declare class TileLayoutKeyboardNavigationService {
+    private zone;
+    private renderer;
+    private localization;
+    navigable: BehaviorSubject<boolean>;
+    private localizationSubscription;
+    private rtl;
+    constructor(zone: NgZone, renderer: Renderer2, localization: LocalizationService);
+    ngOnDestroy(): void;
+    onKeyDown(event: any, elem: HTMLElement, focusableItems: Array<HTMLElement>, settings: DraggingServiceConfig): void;
+    onFocusOut(event: any, elem: HTMLElement, focusableItems: Array<HTMLElement>): void;
+    onClick(event: any, elem: HTMLElement, focusableItems: Array<HTMLElement>): void;
+    changeTabIndex(tabIndex: string, elem: HTMLElement, focusableItems: Array<HTMLElement>): void;
+    getAllFocusableChildren(parent: any): Array<any>;
+    private resizeItem;
+    private reorderItem;
+    private keepFocusWithinComponent;
+    private getFirstAndLastFocusable;
+    private targetTile;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TileLayoutKeyboardNavigationService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<TileLayoutKeyboardNavigationService>;
+}

package/tilelayout/models/navigation.interface.d.ts

@@ -0,0 +1,17 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * Тhe values which determine wether there will be resizing or reordering via keyboard navigation.
+ *
+ * @hidden
+ */
+export interface TileLayoutNavigation {
+    resizeLeft?: boolean;
+    resizeRight?: boolean;
+    resizeUp?: boolean;
+    resizeDown?: boolean;
+    reorderLeft?: boolean;
+    reorderRight?: boolean;
+}

package/tilelayout/tilelayout-item.component.d.ts

@@ -2,18 +2,21 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { AfterViewInit, ElementRef, OnChanges, OnDestroy, Renderer2, SimpleChanges } from '@angular/core';
+import { AfterViewInit, ElementRef, NgZone, OnChanges, OnDestroy, Renderer2, SimpleChanges } from '@angular/core';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { TileLayoutDraggingService } from './dragging-service';
+import { TileLayoutKeyboardNavigationService } from './keyboard-navigation.service';
 import * as i0 from "@angular/core";
 /**
  * Represents a tile item within the TileLayoutComponent.
  */
 export declare class TileLayoutItemComponent implements AfterViewInit, OnDestroy, OnChanges {
     elem: ElementRef;
+    private zone;
     private renderer;
     private localization;
     private draggingService;
+    private keyboardNavigationService;
     /**
      * The title that will be rendered in the item header ([see example]({% slug tiles_tilelayout %}#toc-tiles-configuration)).
      */
@@ -55,6 +58,12 @@ export declare class TileLayoutItemComponent implements AfterViewInit, OnDestroy
      */
     resizable: boolean;
     itemClass: boolean;
+    hostRole: string;
+    get hostDropEffect(): string;
+    get hostTabindex(): string;
+    get ariaKeyShortcuts(): string;
+    get hostGrabbed(): boolean;
+    get hostLabelledBy(): string;
     get colEnd(): string;
     get rowEnd(): string;
     get colStart(): string;
@@ -62,7 +71,15 @@ export declare class TileLayoutItemComponent implements AfterViewInit, OnDestroy
     /**
      * @hidden
      */
-    get reorderableHeader(): boolean;
+    get isReorderable(): boolean;
+    /**
+     * @hidden
+     */
+    get isNavigable(): boolean;
+    /**
+     * @hidden
+     */
+    get isResizable(): boolean;
     /**
      * @hidden
      */
@@ -72,9 +89,15 @@ export declare class TileLayoutItemComponent implements AfterViewInit, OnDestroy
      */
     rtl: boolean;
     private headers;
+    /**
+     * @hidden
+     */
+    titleId: string;
     private subs;
+    private keyboardNavigationSubs;
+    private focusableItems;
     private _order;
-    constructor(elem: ElementRef, renderer: Renderer2, localization: LocalizationService, draggingService: TileLayoutDraggingService);
+    constructor(elem: ElementRef, zone: NgZone, renderer: Renderer2, localization: LocalizationService, draggingService: TileLayoutDraggingService, keyboardNavigationService: TileLayoutKeyboardNavigationService);
     ngAfterViewInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngOnDestroy(): void;

package/tilelayout/tilelayout.component.d.ts

@@ -10,16 +10,18 @@ import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { TileLayoutReorderEvent } from './reorder-event';
 import { TileLayoutGap } from './models/gap.interface';
 import { TileLayoutFlowMode } from './models/flowmode.type';
+import { TileLayoutKeyboardNavigationService } from './keyboard-navigation.service';
 import * as i0 from "@angular/core";
 /**
  * Represents the [Kendo UI TileLayout component for Angular]({% slug overview_tilelayout %})
  */
 export declare class TileLayoutComponent implements OnInit, AfterViewInit, AfterContentInit, OnDestroy, OnChanges {
+    private zone;
     private elem;
     private renderer;
     private localization;
     private draggingService;
-    private zone;
+    private navigationService;
     /**
      * Defines the number of columns ([see example]({% slug tiles_tilelayout %}#toc-tile-size-and-position)).
      * @default 1
@@ -68,6 +70,13 @@ export declare class TileLayoutComponent implements OnInit, AfterViewInit, After
      *
      */
     autoFlow: TileLayoutFlowMode;
+    /**
+     * If set to true, the user can use dedicated shortcuts to interact with the TileLayout.
+     * By default, navigation is disabled and focusable TileLayout content is a part of the natural tab sequence of the page.
+     *
+     * @default false
+     */
+    navigable: boolean;
     /**
      * 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.
@@ -79,6 +88,7 @@ export declare class TileLayoutComponent implements OnInit, AfterViewInit, After
      */
     resize: EventEmitter<TileLayoutResizeEvent>;
     hostClass: boolean;
+    hostRole: string;
     get gapStyle(): string;
     direction: 'ltr' | 'rtl';
     get currentColStart(): string;
@@ -93,7 +103,7 @@ export declare class TileLayoutComponent implements OnInit, AfterViewInit, After
     private draggable;
     private subs;
     private _gap;
-    constructor(elem: ElementRef, renderer: Renderer2, localization: LocalizationService, draggingService: TileLayoutDraggingService, zone: NgZone);
+    constructor(zone: NgZone, elem: ElementRef, renderer: Renderer2, localization: LocalizationService, draggingService: TileLayoutDraggingService, navigationService: TileLayoutKeyboardNavigationService);
     ngOnInit(): void;
     ngAfterViewInit(): void;
     ngAfterContentInit(): void;
@@ -109,5 +119,5 @@ export declare class TileLayoutComponent implements OnInit, AfterViewInit, After
     private applyAutoFlow;
     private setItemsOrder;
     static ɵfac: i0.ɵɵFactoryDeclaration<TileLayoutComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TileLayoutComponent, "kendo-tilelayout", never, { "columns": "columns"; "columnWidth": "columnWidth"; "gap": "gap"; "reorderable": "reorderable"; "resizable": "resizable"; "rowHeight": "rowHeight"; "autoFlow": "autoFlow"; }, { "reorder": "reorder"; "resize": "resize"; }, ["items"], ["*"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TileLayoutComponent, "kendo-tilelayout", never, { "columns": "columns"; "columnWidth": "columnWidth"; "gap": "gap"; "reorderable": "reorderable"; "resizable": "resizable"; "rowHeight": "rowHeight"; "autoFlow": "autoFlow"; "navigable": "navigable"; }, { "reorder": "reorder"; "resize": "resize"; }, ["items"], ["*"]>;
 }

package/tilelayout/util.d.ts

@@ -5,6 +5,12 @@
 import { Renderer2 } from '@angular/core';
 import { TileLayoutItemComponent } from './tilelayout-item.component';
 import { TileLayoutGap } from './models/gap.interface';
+import { DraggingServiceConfig } from './models/dragging-config.interface';
+import { TileLayoutNavigation } from './models/navigation.interface';
+/**
+ * @hidden
+ */
+export declare const getId: (prefix: string) => string;
 /**
  * @hidden
  */
@@ -48,3 +54,15 @@ export declare const calculateOrderFromCell: (row: number, col: number, items: T
     width: number;
     height: number;
 }, columns: number) => number;
+/**
+ * @hidden
+ */
+export declare const shouldResize: (keyCode: number, col: number, selectedTile: TileLayoutItemComponent, settings: DraggingServiceConfig) => TileLayoutNavigation;
+/**
+ * @hidden
+ */
+export declare const shouldReorder: (keyCode: number, col: number, selectedTile: TileLayoutItemComponent, settings: DraggingServiceConfig) => TileLayoutNavigation;
+/**
+ * @hidden
+ */
+export declare const getCurrentCol: (selectedTile: TileLayoutItemComponent, settings: DraggingServiceConfig, rtl: any) => number;