@progress/kendo-angular-layout 17.0.0-develop.4 → 17.0.0-develop.41

package/README.md

@@ -2,42 +2,57 @@
 <img width="631" src="https://www.telerik.com/kendo-angular-ui/npm-banner.svg">
 </a>
 
-## Kendo UI for Angular Layout Package (AppBar, Avatar, Card, Drawer, Menu, PanelBar, Splitter, Stepper, and TabStrip Components)
+## Kendo UI for Angular Layout Package (Avatar, Card, Drawer, ExpansionPanel, GridLayout, PanelBar, Splitter, StackLayout, Stepper, TabStrip, TileLayout and Timeline Components)
 
-> **Important**
-> * This package is part of [Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)&mdash;a commercial library.
-> * You will need to install a license key when adding the package to your project. For more information, please refer to the [Kendo UI for Angular My License page](https://www.telerik.com/kendo-angular-ui/my-license?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout).
-> * To receive a license key, you need to either [purchase a license](https://www.telerik.com/purchase/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout) or register for a [free trial](https://www.telerik.com/download-login-v2-kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout). Doing so indicates that you [accept the Kendo UI for Angular License Agreement](https://www.telerik.com/purchase/license-agreement/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout).
+> * This package is part of [Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui)&mdash;a commercial library designed and built for developing business applications with Angular. Every UI component in the Kendo UI for Angular suite has been built from the ground-up specifically for Angular.
+> * You must [install a license key](https://www.telerik.com/kendo-angular-ui/my-license) when adding the package to your project. To receive a license key, either [purchase a license](https://www.telerik.com/purchase/kendo-ui) or register for a [free trial](https://www.telerik.com/download-login-v2-kendo-angular-ui).
 > * The 30-day free trial gives you access to all the Kendo UI for Angular components and their full functionality. Additionally, for the period of your license, you get access to our legendary technical support provided directly by the Kendo UI for Angular dev team!
 >
-> [Start using Kendo UI for Angular](https://www.telerik.com/download-login-v2-kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout) and speed up your development process!
+> [Start using Kendo UI for Angular](https://www.telerik.com/download-login-v2-kendo-angular-ui) and speed up your development process!
 
-Kendo UI for Angular is a commercial UI library designed and built for developing business applications with Angular. Every UI component in the Kendo UI for Angular suite has been built from the ground-up specifically for Angular.
+The [Kendo UI for Angular Layout package](https://www.telerik.com/kendo-angular-ui/components/layout/) is a collection of popular components for laying out a professional quality app. The components include a variety of layout types and styles that have extensive configuration options allowing flexibility.
 
-The Layout Package is a collection of popular comppnents for laying out a professional quality app. It includes the following components:
-* [Avatar](https://www.telerik.com/kendo-angular-ui/avatar?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [Card](https://www.telerik.com/kendo-angular-ui/card?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [Drawer](https://www.telerik.com/kendo-angular-ui/drawer?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [ExpansionPanel](https://www.telerik.com/kendo-angular-ui/expansionpanel?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [PanelBar](https://www.telerik.com/kendo-angular-ui/panelbar?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [Splitter](https://www.telerik.com/kendo-angular-ui/splitter?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [Stepper](https://www.telerik.com/kendo-angular-ui/stepper?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [TabStrip](https://www.telerik.com/kendo-angular-ui/tabstrip?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [TileLayout](https://www.telerik.com/kendo-angular-ui/tilelayout?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
+## What's Included in the Angular Layout Package
 
-## Resources
+* [Avatar](https://www.telerik.com/kendo-angular-ui/components/layout/avatar)&mdash;Displays a graphical representation of a profile or online avatar, including people or entities with initials, custom icons, and images.
+* [Card](https://www.telerik.com/kendo-angular-ui/components/layout/card)&mdash;Combines text, visual content and actions about a single subject. It provides clarity, categorization, and an attractive way of presentation.
+* [Drawer](https://www.telerik.com/kendo-angular-ui/components/layout/drawer)&mdash;Offers a side navigation element that can be toggled to be displayed or hidden, or permanently displayed. It enables the user to change the content of a specific section of the page.
+* [ExpansionPanel](https://www.telerik.com/kendo-angular-ui/components/layout/expansionpanel)&mdash;Organizes any content into a details-summary view consisting of a title bar and expandable/collapsible content.
+* [GridLayout](https://www.telerik.com/kendo-angular-ui/components/layout/gridlayout)&mdash;Based on the CSS Grid Layout system, which allows setting the specific row, column and size of each item. It allows you to arrange your content in columns and rows, forming a grid structure.
+* [PanelBar](https://www.telerik.com/kendo-angular-ui/components/layout/panelbar)&mdash;Showcases hierarchical or multi-level content in a component, whose individual items can be expanded or collapsed.
+* [Splitter](https://www.telerik.com/kendo-angular-ui/components/layout/splitter)&mdash;Splits a page into sections, which can be expanded, collapsed or resized, and allows users to control the page layout.
+* [StackLayout](https://www.telerik.com/kendo-angular-ui/components/layout/stacklayout)&mdash;Allows you to easily arrange vertically or horizontally multiple elements in a stack according to the alignment and spacing you like. 
+* [Stepper](https://www.telerik.com/kendo-angular-ui/components/layout/stepper)&mdash;Visualizes the progress of a process by dividing it into chronological steps.
+* [TabStrip](https://www.telerik.com/kendo-angular-ui/components/layout/tabstrip)&mdash;Displays a collection of tabs, each with their own associated content, which enable the user to switch between different views inside a single component.
+* [TileLayout](https://www.telerik.com/kendo-angular-ui/components/layout/tilelayout)&mdash;Displays a collection of tiles and aligns them into columns and rows, allowing end users to rearrange and resize any of the tiles.
+* [Timeline](https://www.telerik.com/kendo-angular-ui/components/layout/timeline)&mdash;Displays a collection of events and their data in a chronological succession for each year.
+
+## Key Features
+
+Among the many features which the Kendo UI for Angular Layout components deliver are:
+
+* [Appearance](https://www.telerik.com/kendo-angular-ui/components/layout/avatar/appearance)&mdash;The appearance of all Layout components can be customized using theme variables and configuration options. Kendo UI for Angular offers a variety of popular themes, including Bootstrap and Material. These themes can be easily tailored to your needs using the [Progress ThemeBuilder](https://www.telerik.com/themebuilder), an online utility application.
+* [Globalization](https://www.telerik.com/kendo-angular-ui/components/inputs/globalization)&mdash;The Kendo UI for Angular Layout package supports globalization to ensure that each Layout component can fit well in any application, no matter what languages and locales need to be supported. Additionally, the Layout controls support rendering in a right-to-left (RTL) direction.
+* [Accessibility](https://www.telerik.com/kendo-angular-ui/components/inputs/maskedtextbox/accessibility)&mdash;Most Layout components are accessible for screen readers and support WAI-ARIA attributes.
+* [Keyboard Navigation](https://www.telerik.com/kendo-angular-ui/components/inputs/maskedtextbox/keyboard-navigation)&mdash;Apart from the Avatar, Card, and TileLayout, the Layout components support a number of keyboard shortcuts which allow users to accomplish various commands.
 
-* [Get Started with Kendo UI for Angular (requires trial registration)](https://www.telerik.com/kendo-angular-ui/getting-started?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [Demos, documentation, and component reference](https://www.telerik.com/kendo-angular-ui/components?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [Blogs](http://www.telerik.com/blogs/kendo-ui)
-* [Kendo UI for Angular pricing and licensing](https://www.telerik.com/purchase/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
+## Support Options
 
-## Questions and Feedback
+For any issues you might encounter while working with the Kendo UI for Angular Layout, you have the following support channels available:
+
+* Industry-leading technical support&mdash;Kendo UI for Angular paid license holders and users with an active (free) trial license can take advantage of our outstanding customer support. To submit a ticket, use the [dedicated Kendo UI for Angular support system](https://www.telerik.com/account/support-tickets).
+* Product forums&mdash;The [Kendo UI for Angular forums](https://www.telerik.com/forums/kendo-angular-ui) are part of the free support you can get from the community and from the Kendo UI for Angular team.
+* Feedback portal&mdash;The [Kendo UI for Angular feedback portal](https://feedback.telerik.com/kendo-angular-ui) is where you can request and vote for new features to be added.
+
+## Resources
 
-* [Official Forums](https://www.telerik.com/forums/kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [GitHub Issues](https://github.com/telerik/kendo-angular/issues?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [Feedback Portal](https://feedback.telerik.com/kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
-* [StackOverflow](https://stackoverflow.com/questions/tagged/kendo-ui-angular2?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-layout)
+* [Getting Started with Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui/getting-started)
+* [Getting Started with the Kendo UI for Angular Layout](https://www.telerik.com/kendo-angular-ui/components/layout/installation/getting-started)
+* [Layout Overview page](https://www.telerik.com/kendo-angular-ui/components/layout) and [Layout API reference](https://www.telerik.com/kendo-angular-ui/components/layout/api)
+* [Kendo UI for Angular roadmap](https://www.telerik.com/kendo-angular-ui/roadmap)
+* [Kendo UI for Angular Blog](https://www.telerik.com/blogs/tag/kendo-ui-for-angular)
+* [Demos, documentation, and component reference](https://www.telerik.com/kendo-angular-ui/components)
+* [Kendo UI for Angular pricing and licensing](https://www.telerik.com/purchase/kendo-ui)
 
 *Copyright © 2024 Progress Software Corporation and/or one of its subsidiaries or affiliates. All rights reserved.*
 

package/avatar/avatar.component.d.ts

@@ -160,5 +160,5 @@ export declare class AvatarComponent implements OnInit, AfterViewInit {
      */
     textFor(key: string): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<AvatarComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AvatarComponent, "kendo-avatar", never, { "shape": "shape"; "size": "size"; "rounded": "rounded"; "themeColor": "themeColor"; "fillMode": "fillMode"; "fill": "fill"; "border": "border"; "iconClass": "iconClass"; "width": "width"; "height": "height"; "cssStyle": "cssStyle"; "initials": "initials"; "icon": "icon"; "imageSrc": "imageSrc"; "svgIcon": "svgIcon"; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AvatarComponent, "kendo-avatar", never, { "shape": { "alias": "shape"; "required": false; }; "size": { "alias": "size"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; "fillMode": { "alias": "fillMode"; "required": false; }; "fill": { "alias": "fill"; "required": false; }; "border": { "alias": "border"; "required": false; }; "iconClass": { "alias": "iconClass"; "required": false; }; "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "cssStyle": { "alias": "cssStyle"; "required": false; }; "initials": { "alias": "initials"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "imageSrc": { "alias": "imageSrc"; "required": false; }; "svgIcon": { "alias": "svgIcon"; "required": false; }; }, {}, never, ["*"], true, never>;
 }

package/avatar/l10n/messages.d.ts

@@ -13,5 +13,5 @@ export declare class Messages extends ComponentMessages {
      */
     avatarAlt: string;
     static ɵfac: i0.ɵɵFactoryDeclaration<Messages, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<Messages, "kendoAvatarMessages", never, { "avatarAlt": "avatarAlt"; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<Messages, "kendoAvatarMessages", never, { "avatarAlt": { "alias": "avatarAlt"; "required": false; }; }, {}, never, never, false, never>;
 }

package/avatar/models/fill.d.ts

@@ -5,4 +5,4 @@
 /**
  * Specifies the possible appearance fill styles of the аvatar ([see example](slug:appearance_avatar#toc-fill-mode)).
  */
-export declare type AvatarFillMode = 'solid' | 'outline' | 'none';
+export type AvatarFillMode = 'solid' | 'outline' | 'none';

package/avatar/models/rounded.d.ts

@@ -5,4 +5,4 @@
 /**
  * Specifies the possible rounded options of the аvatar ([see example]({% slug appearance_avatar %}#toc-rounded-corners)).
  */
-export declare type AvatarRounded = 'small' | 'medium' | 'large' | 'full' | 'none';
+export type AvatarRounded = 'small' | 'medium' | 'large' | 'full' | 'none';

package/avatar/models/shape.d.ts

@@ -6,10 +6,10 @@
  * @hidden
  * Specifies the possible shapes of the avatar.
  */
-export declare type AvatarShape = 'square' | 'rectangle' | 'rounded' | 'circle';
+export type AvatarShape = 'square' | 'rectangle' | 'rounded' | 'circle';
 /**
  * Alias for backwards-compatibility.
  *
  * @hidden
  */
-export declare type Shape = AvatarShape;
+export type Shape = AvatarShape;

package/avatar/models/size.d.ts

@@ -5,4 +5,4 @@
 /**
  * Specifies the possible sizes of the аvatar ([see example]({% slug appearance_avatar %}#toc-size)).
  */
-export declare type AvatarSize = 'small' | 'medium' | 'large' | 'none';
+export type AvatarSize = 'small' | 'medium' | 'large' | 'none';

package/avatar/models/theme-color.d.ts

@@ -5,4 +5,4 @@
 /**
  * Specifies the possible theme colors of the аvatar ([see example]({% slug appearance_avatar %}#toc-theme-color)).
  */
-export declare type AvatarThemeColor = 'primary' | 'secondary' | 'tertiary' | 'base' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse' | 'none';
+export type AvatarThemeColor = 'primary' | 'secondary' | 'tertiary' | 'base' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse' | 'none';

package/card/card-actions.component.d.ts

@@ -60,5 +60,5 @@ export declare class CardActionsComponent {
      */
     onClick(action: CardAction): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CardActionsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CardActionsComponent, "kendo-card-actions", never, { "orientation": "orientation"; "layout": "layout"; "actions": "actions"; }, { "action": "action"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CardActionsComponent, "kendo-card-actions", never, { "orientation": { "alias": "orientation"; "required": false; }; "layout": { "alias": "layout"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "action": "action"; }, never, ["*"], true, never>;
 }

package/card/card.component.d.ts

@@ -38,5 +38,5 @@ export declare class CardComponent implements OnDestroy {
     constructor(localizationService: LocalizationService);
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CardComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CardComponent, "kendo-card", never, { "orientation": "orientation"; "width": "width"; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CardComponent, "kendo-card", never, { "orientation": { "alias": "orientation"; "required": false; }; "width": { "alias": "width"; "required": false; }; }, {}, never, ["*"], true, never>;
 }

package/card/directives/card-separator.directive.d.ts

@@ -24,5 +24,5 @@ export declare class CardSeparatorDirective {
      */
     orientation: Orientation;
     static ɵfac: i0.ɵɵFactoryDeclaration<CardSeparatorDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<CardSeparatorDirective, "[kendoCardSeparator]", never, { "color": "color"; "orientation": "orientation"; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CardSeparatorDirective, "[kendoCardSeparator]", never, { "color": { "alias": "color"; "required": false; }; "orientation": { "alias": "orientation"; "required": false; }; }, {}, never, never, true, never>;
 }

package/card/models/actions-layout.d.ts

@@ -12,4 +12,4 @@
  * * `stretched`
  *
  */
-export declare type ActionsLayout = 'start' | 'center' | 'end' | 'stretched';
+export type ActionsLayout = 'start' | 'center' | 'end' | 'stretched';

package/common/direction.d.ts

@@ -5,4 +5,4 @@
 /**
  * @hidden
  */
-export declare type Direction = 'rtl' | 'ltr';
+export type Direction = 'rtl' | 'ltr';

package/common/orientation.d.ts

@@ -5,4 +5,4 @@
 /**
  * Specifies the orientation of layouts in different scenarios.
  */
-export declare type Orientation = 'horizontal' | 'vertical';
+export type Orientation = 'horizontal' | 'vertical';

package/drawer/drawer.component.d.ts

@@ -188,5 +188,5 @@ export declare class DrawerComponent implements OnDestroy {
     private animate;
     private createPlayer;
     static ɵfac: i0.ɵɵFactoryDeclaration<DrawerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DrawerComponent, "kendo-drawer", ["kendoDrawer"], { "mode": "mode"; "position": "position"; "mini": "mini"; "expanded": "expanded"; "width": "width"; "miniWidth": "miniWidth"; "autoCollapse": "autoCollapse"; "items": "items"; "isItemExpanded": "isItemExpanded"; "animation": "animation"; }, { "expand": "expand"; "collapse": "collapse"; "select": "select"; "expandedChange": "expandedChange"; }, ["drawerTemplate", "footerTemplate", "headerTemplate", "itemTemplate"], never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DrawerComponent, "kendo-drawer", ["kendoDrawer"], { "mode": { "alias": "mode"; "required": false; }; "position": { "alias": "position"; "required": false; }; "mini": { "alias": "mini"; "required": false; }; "expanded": { "alias": "expanded"; "required": false; }; "width": { "alias": "width"; "required": false; }; "miniWidth": { "alias": "miniWidth"; "required": false; }; "autoCollapse": { "alias": "autoCollapse"; "required": false; }; "items": { "alias": "items"; "required": false; }; "isItemExpanded": { "alias": "isItemExpanded"; "required": false; }; "animation": { "alias": "animation"; "required": false; }; }, { "expand": "expand"; "collapse": "collapse"; "select": "select"; "expandedChange": "expandedChange"; }, ["drawerTemplate", "footerTemplate", "headerTemplate", "itemTemplate"], never, true, never>;
 }

package/drawer/item.component.d.ts

@@ -34,5 +34,5 @@ export declare class DrawerItemComponent implements AfterViewInit {
     get customIconClasses(): string;
     get item(): any;
     static ɵfac: i0.ɵɵFactoryDeclaration<DrawerItemComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DrawerItemComponent, "[kendoDrawerItem]", never, { "viewItem": "viewItem"; "index": "index"; "itemTemplate": "itemTemplate"; "mini": "mini"; "expanded": "expanded"; "disabled": "disabled"; "cssClass": "cssClass"; "cssStyle": "cssStyle"; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DrawerItemComponent, "[kendoDrawerItem]", never, { "viewItem": { "alias": "viewItem"; "required": false; }; "index": { "alias": "index"; "required": false; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; }; "mini": { "alias": "mini"; "required": false; }; "expanded": { "alias": "expanded"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "cssClass": { "alias": "cssClass"; "required": false; }; "cssStyle": { "alias": "cssStyle"; "required": false; }; }, {}, never, never, true, never>;
 }

package/drawer/list.component.d.ts

@@ -32,5 +32,5 @@ export declare class DrawerListComponent implements OnInit, OnDestroy {
     private onEnterOrSpaceKeyDown;
     private getDrawerItemIndex;
     static ɵfac: i0.ɵɵFactoryDeclaration<DrawerListComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DrawerListComponent, "[kendoDrawerList]", never, { "itemTemplate": "itemTemplate"; "mini": "mini"; "expanded": "expanded"; "view": "view"; }, { "select": "select"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DrawerListComponent, "[kendoDrawerList]", never, { "itemTemplate": { "alias": "itemTemplate"; "required": false; }; "mini": { "alias": "mini"; "required": false; }; "expanded": { "alias": "expanded"; "required": false; }; "view": { "alias": "view"; "required": false; }; }, { "select": "select"; }, never, never, true, never>;
 }

package/drawer/models/drawer-item-expand.interface.d.ts

@@ -5,4 +5,4 @@
 /**
  * Represents the callback that is used by the [isItemExpanded]({% slug api_layout_drawercomponent %}#toc-isItemExpanded) property. ([see example]({% slug hierarchical_drawer %})).
  */
-export declare type DrawerItemExpandedFn = (item: any) => boolean;
+export type DrawerItemExpandedFn = (item: any) => boolean;

package/drawer/models/mode.d.ts

@@ -7,4 +7,4 @@
  * The default `overlay` display mode will overlap the associated content with an overlay effect.
  * On the other hand, the `push` display mode will render the Drawer next to the associated content and will shrink it.
  */
-export declare type DrawerMode = 'overlay' | 'push';
+export type DrawerMode = 'overlay' | 'push';

package/drawer/models/position.d.ts

@@ -10,4 +10,4 @@
  * * (Default) `start`
  * * `end`
  */
-export declare type DrawerPosition = 'start' | 'end';
+export type DrawerPosition = 'start' | 'end';

package/{esm2020 → esm2022}/avatar/avatar.component.mjs

@@ -20,21 +20,10 @@ const DEFAULT_FILL_MODE = 'solid';
  * Displays images, icons or initials representing people or other entities.
  */
 export class AvatarComponent {
-    constructor(localization, renderer, element) {
-        this.localization = localization;
-        this.renderer = renderer;
-        this.element = element;
-        this.hostClass = true;
-        /**
-         * Sets a border to the avatar.
-         */
-        this.border = false;
-        this._themeColor = DEFAULT_THEME_COLOR;
-        this._size = DEFAULT_SIZE;
-        this._fillMode = DEFAULT_FILL_MODE;
-        this._rounded = DEFAULT_ROUNDED;
-        validatePackage(packageMetadata);
-    }
+    localization;
+    renderer;
+    element;
+    hostClass = true;
     /**
      * @hidden
      */
@@ -150,18 +139,54 @@ export class AvatarComponent {
     set fill(fillMode) {
         this.fillMode = fillMode;
     }
+    /**
+     * Sets a border to the avatar.
+     */
+    border = false;
+    /**
+     * Defines a CSS class — or multiple classes separated by spaces —
+     * which are applied to a span element inside the avatar.
+     * Allows the usage of custom icons.
+     */
+    iconClass;
+    /**
+     * Sets the width of the avatar.
+     */
+    width;
     /**
      * @hidden
      */
     get avatarWidth() {
         return this.width;
     }
+    /**
+     * Sets the height of the avatar.
+     */
+    height;
     /**
      * @hidden
      */
     get avatarHeight() {
         return this.height;
     }
+    /**
+     * The CSS styles that will be rendered on the content element of the avatar.
+     * Supports the type of values that are supported by [ngStyle](link:site.data.urls.angular['ngstyleapi']).
+     */
+    cssStyle;
+    /**
+     * Sets `initials` to the avatar.
+     */
+    initials;
+    /**
+     * Sets the `icon` for the avatar.
+     * All [Kendo UI Icons]({% slug icons %}#toc-list-of-font-icons) are supported.
+     */
+    icon;
+    /**
+     * Sets the `image` source of the avatar.
+     */
+    imageSrc;
     /**
      * Defines an SVGIcon to be rendered.
      * The input can take either an [existing Kendo SVG icon](slug:svgicon_list) or a custom one.
@@ -175,6 +200,17 @@ export class AvatarComponent {
     get svgIcon() {
         return this._svgIcon;
     }
+    _themeColor = DEFAULT_THEME_COLOR;
+    _size = DEFAULT_SIZE;
+    _fillMode = DEFAULT_FILL_MODE;
+    _rounded = DEFAULT_ROUNDED;
+    _svgIcon;
+    constructor(localization, renderer, element) {
+        this.localization = localization;
+        this.renderer = renderer;
+        this.element = element;
+        validatePackage(packageMetadata);
+    }
     ngOnInit() {
         this.verifyProperties();
     }
@@ -238,15 +274,14 @@ export class AvatarComponent {
     textFor(key) {
         return this.localization.get(key);
     }
-}
-AvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AvatarComponent, deps: [{ token: i1.LocalizationService }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-AvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: AvatarComponent, isStandalone: true, selector: "kendo-avatar", inputs: { shape: "shape", size: "size", rounded: "rounded", themeColor: "themeColor", fillMode: "fillMode", fill: "fill", border: "border", iconClass: "iconClass", width: "width", height: "height", cssStyle: "cssStyle", initials: "initials", icon: "icon", imageSrc: "imageSrc", svgIcon: "svgIcon" }, host: { properties: { "class.k-avatar": "this.hostClass", "class.k-avatar-bordered": "this.borderClass", "style.flexBasis": "this.flexBasis", "style.width": "this.avatarWidth", "style.height": "this.avatarHeight" } }, providers: [
-        LocalizationService,
-        {
-            provide: L10N_PREFIX,
-            useValue: 'kendo.avatar'
-        }
-    ], ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AvatarComponent, deps: [{ token: i1.LocalizationService }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AvatarComponent, isStandalone: true, selector: "kendo-avatar", inputs: { shape: "shape", size: "size", rounded: "rounded", themeColor: "themeColor", fillMode: "fillMode", fill: "fill", border: "border", iconClass: "iconClass", width: "width", height: "height", cssStyle: "cssStyle", initials: "initials", icon: "icon", imageSrc: "imageSrc", svgIcon: "svgIcon" }, host: { properties: { "class.k-avatar": "this.hostClass", "class.k-avatar-bordered": "this.borderClass", "style.flexBasis": "this.flexBasis", "style.width": "this.avatarWidth", "style.height": "this.avatarHeight" } }, providers: [
+            LocalizationService,
+            {
+                provide: L10N_PREFIX,
+                useValue: 'kendo.avatar'
+            }
+        ], ngImport: i0, template: `
         <ng-container kendoAvatarLocalizedMessages
             i18n-avatarAlt="kendo.avatar.avatarAlt|The alt attribute text of the image in the avatar."
             avatarAlt="Avatar"
@@ -277,7 +312,8 @@ AvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
             </span>
         </ng-container>
     `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: LocalizedAvatarMessagesDirective, selector: "[kendoAvatarLocalizedMessages]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AvatarComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AvatarComponent, decorators: [{
             type: Component,
             args: [{
                     providers: [

package/{esm2020 → esm2022}/avatar/l10n/custom-messages.component.mjs

@@ -13,6 +13,7 @@ import * as i1 from "@progress/kendo-angular-l10n";
  * ([see example]({% slug rtl_layout %})).
  */
 export class AvatarCustomMessagesComponent extends Messages {
+    service;
     constructor(service) {
         super();
         this.service = service;
@@ -20,15 +21,15 @@ export class AvatarCustomMessagesComponent extends Messages {
     get override() {
         return true;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AvatarCustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AvatarCustomMessagesComponent, isStandalone: true, selector: "kendo-avatar-messages", providers: [
+            {
+                provide: Messages,
+                useExisting: forwardRef(() => AvatarCustomMessagesComponent)
+            }
+        ], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
 }
-AvatarCustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AvatarCustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-AvatarCustomMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: AvatarCustomMessagesComponent, isStandalone: true, selector: "kendo-avatar-messages", providers: [
-        {
-            provide: Messages,
-            useExisting: forwardRef(() => AvatarCustomMessagesComponent)
-        }
-    ], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AvatarCustomMessagesComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AvatarCustomMessagesComponent, decorators: [{
             type: Component,
             args: [{
                     providers: [

package/{esm2020 → esm2022}/avatar/l10n/localized-messages.directive.mjs

@@ -12,19 +12,20 @@ import * as i1 from "@progress/kendo-angular-l10n";
  * @hidden
  */
 export class LocalizedAvatarMessagesDirective extends Messages {
+    service;
     constructor(service) {
         super();
         this.service = service;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LocalizedAvatarMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: LocalizedAvatarMessagesDirective, isStandalone: true, selector: "[kendoAvatarLocalizedMessages]", providers: [
+            {
+                provide: Messages,
+                useExisting: forwardRef(() => LocalizedAvatarMessagesDirective)
+            }
+        ], usesInheritance: true, ngImport: i0 });
 }
-LocalizedAvatarMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedAvatarMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
-LocalizedAvatarMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: LocalizedAvatarMessagesDirective, isStandalone: true, selector: "[kendoAvatarLocalizedMessages]", providers: [
-        {
-            provide: Messages,
-            useExisting: forwardRef(() => LocalizedAvatarMessagesDirective)
-        }
-    ], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedAvatarMessagesDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LocalizedAvatarMessagesDirective, decorators: [{
             type: Directive,
             args: [{
                     providers: [

package/{esm2020 → esm2022}/avatar/l10n/messages.mjs

@@ -9,10 +9,14 @@ import * as i0 from "@angular/core";
  * @hidden
  */
 export class Messages extends ComponentMessages {
+    /**
+     * The alt attribute text of the image in the avatar.
+     */
+    avatarAlt;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: Messages, selector: "kendoAvatarMessages", inputs: { avatarAlt: "avatarAlt" }, usesInheritance: true, ngImport: i0 });
 }
-Messages.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-Messages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: Messages, selector: "kendoAvatarMessages", inputs: { avatarAlt: "avatarAlt" }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: Messages, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: Messages, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector

package/{esm2020 → esm2022}/avatar.module.mjs

@@ -13,11 +13,11 @@ import * as i2 from "./avatar/l10n/custom-messages.component";
  * definition for the Avatar component.
  */
 export class AvatarModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: AvatarModule, imports: [i1.AvatarComponent, i2.AvatarCustomMessagesComponent], exports: [i1.AvatarComponent, i2.AvatarCustomMessagesComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AvatarModule, imports: [i1.AvatarComponent] });
 }
-AvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-AvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: AvatarModule, imports: [i1.AvatarComponent, i2.AvatarCustomMessagesComponent], exports: [i1.AvatarComponent, i2.AvatarCustomMessagesComponent] });
-AvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AvatarModule, imports: [KENDO_AVATAR] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AvatarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AvatarModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [...KENDO_AVATAR],

package/{esm2020 → esm2022}/card/card-actions.component.mjs

@@ -10,33 +10,7 @@ import * as i0 from "@angular/core";
  * * ([see example]({% slug actions_card %})).
  */
 export class CardActionsComponent {
-    constructor() {
-        this.hostClass = true;
-        /**
-         * Specifies the layout of the Card action buttons.
-         *
-         * * The possible values are:
-         * * (Default) `horizontal`
-         * * `vertical`
-         *
-         */
-        this.orientation = 'horizontal';
-        /**
-         * Specifies the layout of the Card action buttons.
-         *
-         * The possible values are:
-         * * (Default) `start`
-         * * `center`
-         * * `end`
-         * * `stretched`
-         *
-         */
-        this.layout = 'start';
-        /**
-         * Fires when the user clicks an action button.
-         */
-        this.action = new EventEmitter();
-    }
+    hostClass = true;
     get stretchedClass() {
         return this.layout === 'stretched';
     }
@@ -55,6 +29,26 @@ export class CardActionsComponent {
     get horizontalClass() {
         return this.orientation === 'horizontal';
     }
+    /**
+     * Specifies the layout of the Card action buttons.
+     *
+     * * The possible values are:
+     * * (Default) `horizontal`
+     * * `vertical`
+     *
+     */
+    orientation = 'horizontal';
+    /**
+     * Specifies the layout of the Card action buttons.
+     *
+     * The possible values are:
+     * * (Default) `start`
+     * * `center`
+     * * `end`
+     * * `stretched`
+     *
+     */
+    layout = 'start';
     /**
      * Allows the declarative specification of the Card actions.
      */
@@ -66,15 +60,26 @@ export class CardActionsComponent {
             this.actionsTemplate = value;
         }
     }
+    /**
+     * Fires when the user clicks an action button.
+     */
+    action = new EventEmitter();
+    /**
+     * @hidden
+     */
+    actionsArray;
+    /**
+     * @hidden
+     */
+    actionsTemplate;
     /**
      * @hidden
      */
     onClick(action) {
         this.action.emit(action);
     }
-}
-CardActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CardActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CardActionsComponent, isStandalone: true, selector: "kendo-card-actions", inputs: { orientation: "orientation", layout: "layout", actions: "actions" }, outputs: { action: "action" }, host: { properties: { "class.k-actions": "this.hostClass", "class.k-card-actions": "this.hostClass", "class.k-actions-stretched": "this.stretchedClass", "class.k-actions-start": "this.startClass", "class.k-actions-end": "this.endClass", "class.k-actions-center": "this.centerClass", "class.k-actions-vertical": "this.verticalClass", "class.k-actions-horizontal": "this.horizontalClass" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CardActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CardActionsComponent, isStandalone: true, selector: "kendo-card-actions", inputs: { orientation: "orientation", layout: "layout", actions: "actions" }, outputs: { action: "action" }, host: { properties: { "class.k-actions": "this.hostClass", "class.k-card-actions": "this.hostClass", "class.k-actions-stretched": "this.stretchedClass", "class.k-actions-start": "this.startClass", "class.k-actions-end": "this.endClass", "class.k-actions-center": "this.centerClass", "class.k-actions-vertical": "this.verticalClass", "class.k-actions-horizontal": "this.horizontalClass" } }, ngImport: i0, template: `
         <ng-content *ngIf="!actionsArray && !actionsTemplate"></ng-content>
 
         <ng-container *ngIf="actionsArray">
@@ -96,7 +101,8 @@ CardActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
 
         <ng-template [ngTemplateOutlet]="actionsTemplate" *ngIf="actionsTemplate"></ng-template>
     `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CardActionsComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CardActionsComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kendo-card-actions',