@progress/kendo-angular-navigation 17.0.0-develop.4 → 17.0.0-develop.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +38 -18
- package/actionsheet/actionsheet.component.d.ts +1 -1
- package/actionsheet/item.component.d.ts +1 -1
- package/actionsheet/list.component.d.ts +1 -1
- package/actionsheet/models/group.d.ts +1 -1
- package/appbar/appbar-spacer.component.d.ts +1 -1
- package/appbar/appbar.component.d.ts +1 -1
- package/appbar/models/position-mode.d.ts +1 -1
- package/appbar/models/position.d.ts +1 -1
- package/appbar/models/theme-color.d.ts +1 -1
- package/bottomnavigation/bottomnavigation-item.component.d.ts +1 -1
- package/bottomnavigation/bottomnavigation.component.d.ts +1 -1
- package/bottomnavigation/types/bottomnavigation-fill.d.ts +1 -1
- package/bottomnavigation/types/bottomnavigation-item-flow.d.ts +1 -1
- package/bottomnavigation/types/bottomnavigation-position-mode.d.ts +1 -1
- package/bottomnavigation/types/bottomnavigation-theme-color.d.ts +1 -1
- package/breadcrumb/breadcrumb-item.component.d.ts +2 -2
- package/breadcrumb/breadcrumb.component.d.ts +1 -1
- package/breadcrumb/list.component.d.ts +1 -1
- package/breadcrumb/models/breadcrumb-size.d.ts +1 -1
- package/breadcrumb/models/collapse-mode.d.ts +1 -1
- package/breadcrumb/template-directives/separator.directive.d.ts +1 -2
- package/common/direction.d.ts +1 -1
- package/{esm2020 → esm2022}/actionsheet/actionsheet.component.mjs +113 -60
- package/{esm2020 → esm2022}/actionsheet/item.component.mjs +7 -7
- package/{esm2020 → esm2022}/actionsheet/list.component.mjs +11 -7
- package/{esm2020 → esm2022}/actionsheet/models/item-click.event.mjs +8 -0
- package/{esm2020 → esm2022}/actionsheet/templates/actionsheet-template.mjs +4 -3
- package/{esm2020 → esm2022}/actionsheet/templates/content-template.directive.mjs +4 -3
- package/{esm2020 → esm2022}/actionsheet/templates/footer-template.directive.mjs +4 -3
- package/{esm2020 → esm2022}/actionsheet/templates/header-template.directive.mjs +4 -3
- package/{esm2020 → esm2022}/actionsheet/templates/item-template.directive.mjs +4 -3
- package/{esm2020 → esm2022}/actionsheet.module.mjs +4 -4
- package/{esm2020 → esm2022}/appbar/appbar-section.component.mjs +5 -7
- package/{esm2020 → esm2022}/appbar/appbar-spacer.component.mjs +15 -7
- package/{esm2020 → esm2022}/appbar/appbar.component.mjs +33 -25
- package/{esm2020 → esm2022}/appbar.module.mjs +4 -4
- package/{esm2020 → esm2022}/bottomnavigation/bottomnavigation-item.component.mjs +10 -4
- package/{esm2020 → esm2022}/bottomnavigation/bottomnavigation.component.mjs +75 -52
- package/{esm2020 → esm2022}/bottomnavigation/events/select-event.mjs +16 -0
- package/{esm2020 → esm2022}/bottomnavigation/templates/item-template.directive.mjs +4 -3
- package/{esm2020 → esm2022}/bottomnavigation.module.mjs +4 -4
- package/{esm2020 → esm2022}/breadcrumb/breadcrumb-item.component.mjs +19 -14
- package/{esm2020 → esm2022}/breadcrumb/breadcrumb.component.mjs +87 -56
- package/{esm2020 → esm2022}/breadcrumb/list.component.mjs +14 -6
- package/{esm2020 → esm2022}/breadcrumb/template-directives/item-template.directive.mjs +4 -3
- package/{esm2020 → esm2022}/breadcrumb/template-directives/separator.directive.mjs +20 -18
- package/{esm2020 → esm2022}/breadcrumb.module.mjs +4 -4
- package/{esm2020 → esm2022}/common/preventable-event.mjs +7 -7
- package/{esm2020 → esm2022}/navigation.module.mjs +4 -4
- package/{esm2020 → esm2022}/package-metadata.mjs +2 -2
- package/{fesm2020 → fesm2022}/progress-kendo-angular-navigation.mjs +490 -313
- package/package.json +13 -19
- package/fesm2015/progress-kendo-angular-navigation.mjs +0 -2613
- /package/{esm2020 → esm2022}/actionsheet/animation/animations.mjs +0 -0
- /package/{esm2020 → esm2022}/actionsheet/models/actionsheet-item.interface.mjs +0 -0
- /package/{esm2020 → esm2022}/actionsheet/models/animation.mjs +0 -0
- /package/{esm2020 → esm2022}/actionsheet/models/group.mjs +0 -0
- /package/{esm2020 → esm2022}/actionsheet/models/index.mjs +0 -0
- /package/{esm2020 → esm2022}/appbar/models/position-mode.mjs +0 -0
- /package/{esm2020 → esm2022}/appbar/models/position.mjs +0 -0
- /package/{esm2020 → esm2022}/appbar/models/theme-color.mjs +0 -0
- /package/{esm2020 → esm2022}/bottomnavigation/constants.mjs +0 -0
- /package/{esm2020 → esm2022}/bottomnavigation/types/bottomnavigation-fill.mjs +0 -0
- /package/{esm2020 → esm2022}/bottomnavigation/types/bottomnavigation-item-flow.mjs +0 -0
- /package/{esm2020 → esm2022}/bottomnavigation/types/bottomnavigation-item.mjs +0 -0
- /package/{esm2020 → esm2022}/bottomnavigation/types/bottomnavigation-position-mode.mjs +0 -0
- /package/{esm2020 → esm2022}/bottomnavigation/types/bottomnavigation-theme-color.mjs +0 -0
- /package/{esm2020 → esm2022}/breadcrumb/models/breadcrumb-item.interface.mjs +0 -0
- /package/{esm2020 → esm2022}/breadcrumb/models/breadcrumb-size.mjs +0 -0
- /package/{esm2020 → esm2022}/breadcrumb/models/collapse-mode.mjs +0 -0
- /package/{esm2020 → esm2022}/breadcrumb/models/constants.mjs +0 -0
- /package/{esm2020 → esm2022}/breadcrumb/util.mjs +0 -0
- /package/{esm2020 → esm2022}/common/direction.mjs +0 -0
- /package/{esm2020 → esm2022}/common/dom-queries.mjs +0 -0
- /package/{esm2020 → esm2022}/common/util.mjs +0 -0
- /package/{esm2020 → esm2022}/directives.mjs +0 -0
- /package/{esm2020 → esm2022}/index.mjs +0 -0
- /package/{esm2020 → esm2022}/progress-kendo-angular-navigation.mjs +0 -0
package/README.md
CHANGED
|
@@ -1,33 +1,53 @@
|
|
|
1
|
-
<a href="https://www.telerik.com/kendo-angular-ui/" target="_blank">
|
|
1
|
+
<a href="https://www.telerik.com/kendo-angular-ui/components/navigation" target="_blank">
|
|
2
2
|
<img width="631" src="https://www.telerik.com/kendo-angular-ui/npm-banner.svg">
|
|
3
3
|
</a>
|
|
4
4
|
|
|
5
|
-
## Kendo UI for Angular Navigation Package
|
|
5
|
+
## Kendo UI for Angular Navigation Package
|
|
6
6
|
|
|
7
|
-
>
|
|
8
|
-
> *
|
|
9
|
-
> *
|
|
10
|
-
> * 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-navigation) 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-navigation). 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-navigation).
|
|
11
|
-
> * 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!
|
|
12
|
-
>
|
|
13
|
-
> [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-navigation) and speed up your development process!
|
|
7
|
+
> * This package is part of the [Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui/)—a commercial UI library.
|
|
8
|
+
> * 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).
|
|
9
|
+
> * 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 team!
|
|
14
10
|
|
|
15
|
-
Kendo UI for Angular
|
|
11
|
+
The [Kendo UI for Angular Navigation](https://www.telerik.com/kendo-angular-ui/components/navigation) package contains a set of components that provide easy and intuitive page navigation.
|
|
12
|
+
|
|
13
|
+
## What's Included in the Angular Navigation Package
|
|
14
|
+
|
|
15
|
+
The [Angular Navigation](https://www.telerik.com/kendo-angular-ui/components/navigation) package includes four built-in components:
|
|
16
|
+
|
|
17
|
+
* [Angular ActionSheet Component](https://www.telerik.com/kendo-angular-ui/components/navigation/actionsheet)—Allows you to display a predefined set of options in a modal view. It is commonly used to present choices related to an action that the user initiates.
|
|
18
|
+
* [Angular AppBar Component](https://www.telerik.com/kendo-angular-ui/components/navigation/appbar)—Provides information and actions related to the current application screen and is typically used as the main navigation element for a page.
|
|
19
|
+
* [Angular BottomNavigation Component](https://www.telerik.com/kendo-angular-ui/components/navigation/bottomnavigation)—Allows the user to navigate between primary destinations on smaller devices and is commonly used in responsive applications.
|
|
20
|
+
* [Angular BreadCrumb Component](https://www.telerik.com/kendo-angular-ui/components/navigation/breadcrumb)—Allows you to navigate within a folder structure or web page and provides an easy way to navigate backwards by one or multiple steps.
|
|
21
|
+
|
|
22
|
+
## Key Features
|
|
23
|
+
|
|
24
|
+
Among the many features which the Kendo UI for Angular Navigation components deliver are:
|
|
25
|
+
|
|
26
|
+
* [Items Configuration](https://www.telerik.com/kendo-angular-ui/components/navigation/actionsheet/items)—You can provide a collection of elements for the Navigation components to define their items.
|
|
27
|
+
* [Appearance](https://www.telerik.com/kendo-angular-ui/components/navigation/breadcrumb/item-appearance)—You can customize the appearance of the Navigation items by displaying icons or images, or by changing their colors.
|
|
28
|
+
* [Templates](https://www.telerik.com/kendo-angular-ui/components/navigation/actionsheet/templates)—The Navigation components also provide built-in directives that allow you to customize their appearance through templates.
|
|
29
|
+
* [Position Modes](https://www.telerik.com/kendo-angular-ui/components/navigation/bottomnavigation/position-mode)—The Navigation components allow you to specify their position in relation to the page content.
|
|
30
|
+
* [Routing](https://www.telerik.com/kendo-angular-ui/components/navigation/bottomnavigation/routing)—You can utilize [Angular Router](https://angular.dev/guide/routing) and use the components from the Kendo UI for Angular Navigation as a navigational component.
|
|
31
|
+
* [Globalization](https://www.telerik.com/kendo-angular-ui/components/navigation/globalization)—The included components support globalization to ensure that they can fit well in any application, no matter what languages and locales need to be supported. Additionally, the Navigation components support rendering in a right-to-left (RTL) direction.
|
|
32
|
+
* [Accessibility](https://www.telerik.com/kendo-angular-ui/components/navigation/actionsheet/accessibility)—The Navigation components are accessible for screen readers and support WAI-ARIA attributes.
|
|
33
|
+
* [Keyboard Navigation](https://www.telerik.com/kendo-angular-ui/components/navigation/actionsheet/keyboard-navigation)—The Navigation components support a number of keyboard shortcuts which allow users to accomplish various commands.
|
|
34
|
+
|
|
35
|
+
## Support Options
|
|
36
|
+
|
|
37
|
+
For any issues you might encounter while working with the Kendo UI for Angular Navigation, you have the following support channels available:
|
|
38
|
+
|
|
39
|
+
* Industry-leading technical support—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).
|
|
40
|
+
* Product forums—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.
|
|
41
|
+
* Feedback portal—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.
|
|
16
42
|
|
|
17
43
|
## Resources
|
|
18
44
|
|
|
19
|
-
* [
|
|
45
|
+
* [Getting Started with Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui/getting-started)
|
|
46
|
+
* [Getting Started with the Kendo UI for Angular Navigation](https://www.telerik.com/kendo-angular-ui/components/navigation/installation/getting-started)
|
|
20
47
|
* [Demos, documentation, and component reference](https://www.telerik.com/kendo-angular-ui/components)
|
|
21
48
|
* [Blogs](http://www.telerik.com/blogs/kendo-ui)
|
|
22
49
|
* [Kendo UI for Angular pricing and licensing](https://www.telerik.com/purchase/kendo-ui)
|
|
23
50
|
|
|
24
|
-
## Questions and Feedback
|
|
25
|
-
|
|
26
|
-
* [Official Forums](https://www.telerik.com/forums/kendo-angular-ui)
|
|
27
|
-
* [GitHub Issues](https://github.com/telerik/kendo-angular/issues)
|
|
28
|
-
* [Feedback Portal](https://feedback.telerik.com/kendo-angular-ui)
|
|
29
|
-
* [StackOverflow](https://stackoverflow.com/questions/tagged/kendo-ui-angular2)
|
|
30
|
-
|
|
31
51
|
*Copyright © 2024 Progress Software Corporation and/or one of its subsidiaries or affiliates. All rights reserved.*
|
|
32
52
|
|
|
33
53
|
*Progress, Telerik, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries.*
|
|
@@ -154,5 +154,5 @@ export declare class ActionSheetComponent implements AfterViewInit, OnDestroy, O
|
|
|
154
154
|
private onAnimationEnd;
|
|
155
155
|
private playAnimation;
|
|
156
156
|
static ɵfac: i0.ɵɵFactoryDeclaration<ActionSheetComponent, never>;
|
|
157
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<ActionSheetComponent, "kendo-actionsheet", ["kendoActionSheet"], { "title": "title"; "subtitle": "subtitle"; "items": "items"; "cssClass": "cssClass"; "animation": "animation"; "expanded": "expanded"; "titleId": "titleId"; }, { "expandedChange": "expandedChange"; "expand": "expand"; "collapse": "collapse"; "itemClick": "itemClick"; "overlayClick": "overlayClick"; }, ["actionSheetTemplate", "headerTemplate", "contentTemplate", "itemTemplate", "footerTemplate"], never, true, never>;
|
|
157
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ActionSheetComponent, "kendo-actionsheet", ["kendoActionSheet"], { "title": { "alias": "title"; "required": false; }; "subtitle": { "alias": "subtitle"; "required": false; }; "items": { "alias": "items"; "required": false; }; "cssClass": { "alias": "cssClass"; "required": false; }; "animation": { "alias": "animation"; "required": false; }; "expanded": { "alias": "expanded"; "required": false; }; "titleId": { "alias": "titleId"; "required": false; }; }, { "expandedChange": "expandedChange"; "expand": "expand"; "collapse": "collapse"; "itemClick": "itemClick"; "overlayClick": "overlayClick"; }, ["actionSheetTemplate", "headerTemplate", "contentTemplate", "itemTemplate", "footerTemplate"], never, true, never>;
|
|
158
158
|
}
|
|
@@ -15,5 +15,5 @@ export declare class ActionSheetItemComponent {
|
|
|
15
15
|
manageIconClasses(item: ActionSheetItem): string;
|
|
16
16
|
manageIconStyles(item: ActionSheetItem): any;
|
|
17
17
|
static ɵfac: i0.ɵɵFactoryDeclaration<ActionSheetItemComponent, never>;
|
|
18
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<ActionSheetItemComponent, "[kendoActionSheetItem]", never, { "itemTemplate": "itemTemplate"; "item": "item"; }, {}, never, never, true, never>;
|
|
18
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ActionSheetItemComponent, "[kendoActionSheetItem]", never, { "itemTemplate": { "alias": "itemTemplate"; "required": false; }; "item": { "alias": "item"; "required": false; }; }, {}, never, never, true, never>;
|
|
19
19
|
}
|
|
@@ -24,5 +24,5 @@ export declare class ActionSheetListComponent implements AfterViewInit, OnDestro
|
|
|
24
24
|
private clickHandler;
|
|
25
25
|
setAttrIndex(item: ActionSheetItem): number;
|
|
26
26
|
static ɵfac: i0.ɵɵFactoryDeclaration<ActionSheetListComponent, never>;
|
|
27
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<ActionSheetListComponent, "[kendoActionSheetList]", never, { "groupItems": "groupItems"; "allItems": "allItems"; "itemTemplate": "itemTemplate"; }, { "itemClick": "itemClick"; }, never, never, true, never>;
|
|
27
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ActionSheetListComponent, "[kendoActionSheetList]", never, { "groupItems": { "alias": "groupItems"; "required": false; }; "allItems": { "alias": "allItems"; "required": false; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; }; }, { "itemClick": "itemClick"; }, never, never, true, never>;
|
|
28
28
|
}
|
|
@@ -2,4 +2,4 @@
|
|
|
2
2
|
* Copyright © 2024 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
export
|
|
5
|
+
export type ActionSheetItemGroup = 'top' | 'bottom';
|
|
@@ -46,5 +46,5 @@ export declare class AppBarSpacerComponent implements AfterViewInit {
|
|
|
46
46
|
constructor(renderer: Renderer2, element: ElementRef);
|
|
47
47
|
ngAfterViewInit(): void;
|
|
48
48
|
static ɵfac: i0.ɵɵFactoryDeclaration<AppBarSpacerComponent, never>;
|
|
49
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<AppBarSpacerComponent, "kendo-appbar-spacer", never, { "width": "width"; }, {}, never, never, true, never>;
|
|
49
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<AppBarSpacerComponent, "kendo-appbar-spacer", never, { "width": { "alias": "width"; "required": false; }; }, {}, never, never, true, never>;
|
|
50
50
|
}
|
|
@@ -72,5 +72,5 @@ export declare class AppBarComponent implements AfterViewInit, OnDestroy {
|
|
|
72
72
|
ngOnDestroy(): void;
|
|
73
73
|
private handleHostClasses;
|
|
74
74
|
static ɵfac: i0.ɵɵFactoryDeclaration<AppBarComponent, never>;
|
|
75
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<AppBarComponent, "kendo-appbar", ["kendoAppBar"], { "position": "position"; "positionMode": "positionMode"; "themeColor": "themeColor"; }, {}, never, ["*"], true, never>;
|
|
75
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<AppBarComponent, "kendo-appbar", ["kendoAppBar"], { "position": { "alias": "position"; "required": false; }; "positionMode": { "alias": "positionMode"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; }, {}, never, ["*"], true, never>;
|
|
76
76
|
}
|
|
@@ -11,4 +11,4 @@
|
|
|
11
11
|
* * `sticky`—Positions the AppBar based on the user's scroll position. A sticky element toggles between static and fixed CSS [`position`](https://developer.mozilla.org/en-US/docs/Web/CSS/position) property, depending on the scroll position.
|
|
12
12
|
* * `fixed`—Positions the AppBar relative to the viewport. It always stays in the same place even if the page is scrolled.
|
|
13
13
|
*/
|
|
14
|
-
export
|
|
14
|
+
export type AppBarPositionMode = 'static' | 'sticky' | 'fixed';
|
|
@@ -16,4 +16,4 @@
|
|
|
16
16
|
* The position property applies CSS `bottom: 0` style in [`fixed mode`]({% slug api_navigation_appbarcomponent %}#toc-positionMode) and also adds a `box-shadow ` to the top of the AppBar.
|
|
17
17
|
*
|
|
18
18
|
*/
|
|
19
|
-
export
|
|
19
|
+
export type AppBarPosition = 'top' | 'bottom';
|
|
@@ -23,5 +23,5 @@ export declare class BottomNavigationItemComponent {
|
|
|
23
23
|
get itemIcon(): boolean;
|
|
24
24
|
get iconClasses(): string;
|
|
25
25
|
static ɵfac: i0.ɵɵFactoryDeclaration<BottomNavigationItemComponent, never>;
|
|
26
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<BottomNavigationItemComponent, "[kendoBottomNavigationItem]", never, { "itemTemplate": "itemTemplate"; "item": "item"; "index": "index"; "disabledComponent": "disabledComponent"; "selectedIdx": "selectedIdx"; "orientation": "orientation"; }, {}, never, never, true, never>;
|
|
26
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BottomNavigationItemComponent, "[kendoBottomNavigationItem]", never, { "itemTemplate": { "alias": "itemTemplate"; "required": false; }; "item": { "alias": "item"; "required": false; }; "index": { "alias": "index"; "required": false; }; "disabledComponent": { "alias": "disabledComponent"; "required": false; }; "selectedIdx": { "alias": "selectedIdx"; "required": false; }; "orientation": { "alias": "orientation"; "required": false; }; }, {}, never, never, true, never>;
|
|
27
27
|
}
|
|
@@ -160,5 +160,5 @@ export declare class BottomNavigationComponent implements OnInit, AfterViewInit,
|
|
|
160
160
|
private keyDownHandler;
|
|
161
161
|
private getBottomNavigationItemIndex;
|
|
162
162
|
static ɵfac: i0.ɵɵFactoryDeclaration<BottomNavigationComponent, never>;
|
|
163
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<BottomNavigationComponent, "kendo-bottomnavigation", ["kendoBottomNavigation"], { "items": "items"; "border": "border"; "disabled": "disabled"; "fill": "fill"; "itemFlow": "itemFlow"; "positionMode": "positionMode"; "themeColor": "themeColor"; }, { "select": "select"; }, ["itemTemplate"], never, true, never>;
|
|
163
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BottomNavigationComponent, "kendo-bottomnavigation", ["kendoBottomNavigation"], { "items": { "alias": "items"; "required": false; }; "border": { "alias": "border"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "fill": { "alias": "fill"; "required": false; }; "itemFlow": { "alias": "itemFlow"; "required": false; }; "positionMode": { "alias": "positionMode"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; }, { "select": "select"; }, ["itemTemplate"], never, true, never>;
|
|
164
164
|
}
|
|
@@ -9,4 +9,4 @@
|
|
|
9
9
|
* * (Default) `vertical` - Renders the text below the icon.
|
|
10
10
|
* * `horizontal` - Renders the icon and the text on the same line.
|
|
11
11
|
*/
|
|
12
|
-
export
|
|
12
|
+
export type BottomNavigationItemFlow = 'vertical' | 'horizontal';
|
|
@@ -9,4 +9,4 @@
|
|
|
9
9
|
* * (Default) `fixed` - The BottomNavigation always stays at the bottom of the viewport, regardless of the page scroll position.
|
|
10
10
|
* * `sticky` - Positions the BottomNavigation at the end of the scrollable container.
|
|
11
11
|
*/
|
|
12
|
-
export
|
|
12
|
+
export type BottomNavigationPositionMode = 'fixed' | 'sticky';
|
|
@@ -17,4 +17,4 @@
|
|
|
17
17
|
* * `light` - Applies coloring based on the light theme color.
|
|
18
18
|
* * `inverse` - Applies coloring based on the inverted theme color.
|
|
19
19
|
*/
|
|
20
|
-
export
|
|
20
|
+
export type BottomNavigationThemeColor = 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse';
|
|
@@ -14,7 +14,7 @@ export declare class BreadCrumbItemComponent implements OnInit, AfterViewInit {
|
|
|
14
14
|
item: BreadCrumbItemModel;
|
|
15
15
|
collapseMode: BreadCrumbCollapseMode;
|
|
16
16
|
index: number;
|
|
17
|
-
itemTemplate: TemplateRef<
|
|
17
|
+
itemTemplate: TemplateRef<any>;
|
|
18
18
|
hostClasses: boolean;
|
|
19
19
|
get isRootItem(): boolean;
|
|
20
20
|
get isDisabled(): boolean;
|
|
@@ -26,5 +26,5 @@ export declare class BreadCrumbItemComponent implements OnInit, AfterViewInit {
|
|
|
26
26
|
ngAfterViewInit(): void;
|
|
27
27
|
onImageLoad(): void;
|
|
28
28
|
static ɵfac: i0.ɵɵFactoryDeclaration<BreadCrumbItemComponent, never>;
|
|
29
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<BreadCrumbItemComponent, "[kendoBreadCrumbItem]", never, { "item": "item"; "collapseMode": "collapseMode"; "index": "index"; "itemTemplate": "itemTemplate"; }, {}, never, ["[kendoBreadCrumbSeparator]"], true, never>;
|
|
29
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BreadCrumbItemComponent, "[kendoBreadCrumbItem]", never, { "item": { "alias": "item"; "required": false; }; "collapseMode": { "alias": "collapseMode"; "required": false; }; "index": { "alias": "index"; "required": false; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; }; }, {}, never, ["[kendoBreadCrumbSeparator]"], true, never>;
|
|
30
30
|
}
|
|
@@ -126,5 +126,5 @@ export declare class BreadCrumbComponent implements OnInit, AfterViewInit, OnDes
|
|
|
126
126
|
private attachResizeHandler;
|
|
127
127
|
private handleClasses;
|
|
128
128
|
static ɵfac: i0.ɵɵFactoryDeclaration<BreadCrumbComponent, never>;
|
|
129
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<BreadCrumbComponent, "kendo-breadcrumb", ["kendoBreadCrumb"], { "items": "items"; "separatorIcon": "separatorIcon"; "separatorSVGIcon": "separatorSVGIcon"; "collapseMode": "collapseMode"; "size": "size"; }, { "itemClick": "itemClick"; }, ["itemTemplate"], never, true, never>;
|
|
129
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BreadCrumbComponent, "kendo-breadcrumb", ["kendoBreadCrumb"], { "items": { "alias": "items"; "required": false; }; "separatorIcon": { "alias": "separatorIcon"; "required": false; }; "separatorSVGIcon": { "alias": "separatorSVGIcon"; "required": false; }; "collapseMode": { "alias": "collapseMode"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "itemClick": "itemClick"; }, ["itemTemplate"], never, true, never>;
|
|
130
130
|
}
|
|
@@ -27,5 +27,5 @@ export declare class BreadCrumbListComponent implements OnDestroy {
|
|
|
27
27
|
ngOnDestroy(): void;
|
|
28
28
|
private getItemIndex;
|
|
29
29
|
static ɵfac: i0.ɵɵFactoryDeclaration<BreadCrumbListComponent, never>;
|
|
30
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<BreadCrumbListComponent, "[kendoBreadCrumbList]", never, { "items": "items"; "itemTemplate": "itemTemplate"; "collapseMode": "collapseMode"; "separatorIcon": "separatorIcon"; "separatorSVGIcon": "separatorSVGIcon"; }, { "itemClick": "itemClick"; }, never, never, true, never>;
|
|
30
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BreadCrumbListComponent, "[kendoBreadCrumbList]", never, { "items": { "alias": "items"; "required": false; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; }; "collapseMode": { "alias": "collapseMode"; "required": false; }; "separatorIcon": { "alias": "separatorIcon"; "required": false; }; "separatorSVGIcon": { "alias": "separatorSVGIcon"; "required": false; }; }, { "itemClick": "itemClick"; }, never, never, true, never>;
|
|
31
31
|
}
|
|
@@ -16,7 +16,6 @@ export declare class BreadCrumbSeparatorDirective {
|
|
|
16
16
|
get icon(): string;
|
|
17
17
|
set svgIcon(svgIcon: SVGIcon);
|
|
18
18
|
get svgIcon(): SVGIcon;
|
|
19
|
-
defaultClasses: boolean;
|
|
20
19
|
ariaHidden: boolean;
|
|
21
20
|
private _icon;
|
|
22
21
|
private _svgIcon;
|
|
@@ -28,5 +27,5 @@ export declare class BreadCrumbSeparatorDirective {
|
|
|
28
27
|
ngOnInit(): void;
|
|
29
28
|
ngOnDestroy(): void;
|
|
30
29
|
static ɵfac: i0.ɵɵFactoryDeclaration<BreadCrumbSeparatorDirective, never>;
|
|
31
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<BreadCrumbSeparatorDirective, "[kendoBreadCrumbSeparator]", never, { "icon": "icon"; "svgIcon": "svgIcon"; }, {}, never, never, true, never>;
|
|
30
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BreadCrumbSeparatorDirective, "[kendoBreadCrumbSeparator]", never, { "icon": { "alias": "icon"; "required": false; }; "svgIcon": { "alias": "svgIcon"; "required": false; }; }, {}, never, never, true, never>;
|
|
32
31
|
}
|
package/common/direction.d.ts
CHANGED
|
@@ -24,6 +24,109 @@ const DEFAULT_ANIMATION_CONFIG = { duration: 300 };
|
|
|
24
24
|
* Used to display a set of choices related to a task the user initiates.
|
|
25
25
|
*/
|
|
26
26
|
export class ActionSheetComponent {
|
|
27
|
+
element;
|
|
28
|
+
ngZone;
|
|
29
|
+
renderer;
|
|
30
|
+
localizationService;
|
|
31
|
+
builder;
|
|
32
|
+
cdr;
|
|
33
|
+
/**
|
|
34
|
+
* @hidden
|
|
35
|
+
*/
|
|
36
|
+
get hostClass() {
|
|
37
|
+
return this.expanded;
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* @hidden
|
|
41
|
+
*/
|
|
42
|
+
direction;
|
|
43
|
+
/**
|
|
44
|
+
* Specifies the text that is rendered as title.
|
|
45
|
+
*/
|
|
46
|
+
title;
|
|
47
|
+
/**
|
|
48
|
+
* Specifies the text that is rendered under the title.
|
|
49
|
+
*/
|
|
50
|
+
subtitle;
|
|
51
|
+
/**
|
|
52
|
+
* The collection of items that will be rendered in the ActionSheet.
|
|
53
|
+
*/
|
|
54
|
+
items;
|
|
55
|
+
/**
|
|
56
|
+
* The CSS classes that will be rendered on the inner ActionSheet element.
|
|
57
|
+
* Supports the type of values that are supported by [ngClass](link:site.data.urls.angular['ngclassapi']).
|
|
58
|
+
*/
|
|
59
|
+
cssClass;
|
|
60
|
+
/**
|
|
61
|
+
* Configures the ActionSheet opening and closing animations ([see example]({% slug animations_actionsheet %})).
|
|
62
|
+
* By default the animations are turned off. The default animations' duration is `300ms`.
|
|
63
|
+
*
|
|
64
|
+
* @default true
|
|
65
|
+
*/
|
|
66
|
+
animation = true;
|
|
67
|
+
/**
|
|
68
|
+
* Specifies the state of the ActionSheet.
|
|
69
|
+
*
|
|
70
|
+
* @default false
|
|
71
|
+
*/
|
|
72
|
+
expanded = false;
|
|
73
|
+
/**
|
|
74
|
+
* Sets the `aria-labelledby` attribute of the ActionSheet wrapper element.
|
|
75
|
+
* Use this option when the built-in header element is replaced through the [`ActionSheetHeaderTemplate`]({% slug api_navigation_actionsheetheadertemplatedirective %})
|
|
76
|
+
* or [`ActionSheetContentTemplate`]({% slug api_navigation_actionsheetcontenttemplatedirective %}).
|
|
77
|
+
*
|
|
78
|
+
*/
|
|
79
|
+
titleId = getId('k-actionsheet-title');
|
|
80
|
+
/**
|
|
81
|
+
* Fires when the `expanded` property of the component is updated.
|
|
82
|
+
* Used to provide a two-way binding for the `expanded` property.
|
|
83
|
+
*/
|
|
84
|
+
expandedChange = new EventEmitter();
|
|
85
|
+
/**
|
|
86
|
+
* Fires when the ActionSheet is expanded and its animation is complete.
|
|
87
|
+
*/
|
|
88
|
+
expand = new EventEmitter();
|
|
89
|
+
/**
|
|
90
|
+
* Fires when the ActionSheet is collapsed and its animation is complete.
|
|
91
|
+
*/
|
|
92
|
+
collapse = new EventEmitter();
|
|
93
|
+
/**
|
|
94
|
+
* Fires when an ActionSheet item is clicked.
|
|
95
|
+
*/
|
|
96
|
+
itemClick = new EventEmitter();
|
|
97
|
+
/**
|
|
98
|
+
* Fires when the modal overlay is clicked.
|
|
99
|
+
*/
|
|
100
|
+
overlayClick = new EventEmitter();
|
|
101
|
+
/**
|
|
102
|
+
* @hidden
|
|
103
|
+
*/
|
|
104
|
+
childContainer;
|
|
105
|
+
/**
|
|
106
|
+
* @hidden
|
|
107
|
+
*/
|
|
108
|
+
actionSheetTemplate;
|
|
109
|
+
/**
|
|
110
|
+
* @hidden
|
|
111
|
+
*/
|
|
112
|
+
headerTemplate;
|
|
113
|
+
/**
|
|
114
|
+
* @hidden
|
|
115
|
+
*/
|
|
116
|
+
contentTemplate;
|
|
117
|
+
/**
|
|
118
|
+
* @hidden
|
|
119
|
+
*/
|
|
120
|
+
itemTemplate;
|
|
121
|
+
/**
|
|
122
|
+
* @hidden
|
|
123
|
+
*/
|
|
124
|
+
footerTemplate;
|
|
125
|
+
dynamicRTLSubscription;
|
|
126
|
+
rtl = false;
|
|
127
|
+
domSubs = new Subscription();
|
|
128
|
+
player;
|
|
129
|
+
animationEnd = new EventEmitter();
|
|
27
130
|
constructor(element, ngZone, renderer, localizationService, builder, cdr) {
|
|
28
131
|
this.element = element;
|
|
29
132
|
this.ngZone = ngZone;
|
|
@@ -31,62 +134,12 @@ export class ActionSheetComponent {
|
|
|
31
134
|
this.localizationService = localizationService;
|
|
32
135
|
this.builder = builder;
|
|
33
136
|
this.cdr = cdr;
|
|
34
|
-
/**
|
|
35
|
-
* Configures the ActionSheet opening and closing animations ([see example]({% slug animations_actionsheet %})).
|
|
36
|
-
* By default the animations are turned off. The default animations' duration is `300ms`.
|
|
37
|
-
*
|
|
38
|
-
* @default true
|
|
39
|
-
*/
|
|
40
|
-
this.animation = true;
|
|
41
|
-
/**
|
|
42
|
-
* Specifies the state of the ActionSheet.
|
|
43
|
-
*
|
|
44
|
-
* @default false
|
|
45
|
-
*/
|
|
46
|
-
this.expanded = false;
|
|
47
|
-
/**
|
|
48
|
-
* Sets the `aria-labelledby` attribute of the ActionSheet wrapper element.
|
|
49
|
-
* Use this option when the built-in header element is replaced through the [`ActionSheetHeaderTemplate`]({% slug api_navigation_actionsheetheadertemplatedirective %})
|
|
50
|
-
* or [`ActionSheetContentTemplate`]({% slug api_navigation_actionsheetcontenttemplatedirective %}).
|
|
51
|
-
*
|
|
52
|
-
*/
|
|
53
|
-
this.titleId = getId('k-actionsheet-title');
|
|
54
|
-
/**
|
|
55
|
-
* Fires when the `expanded` property of the component is updated.
|
|
56
|
-
* Used to provide a two-way binding for the `expanded` property.
|
|
57
|
-
*/
|
|
58
|
-
this.expandedChange = new EventEmitter();
|
|
59
|
-
/**
|
|
60
|
-
* Fires when the ActionSheet is expanded and its animation is complete.
|
|
61
|
-
*/
|
|
62
|
-
this.expand = new EventEmitter();
|
|
63
|
-
/**
|
|
64
|
-
* Fires when the ActionSheet is collapsed and its animation is complete.
|
|
65
|
-
*/
|
|
66
|
-
this.collapse = new EventEmitter();
|
|
67
|
-
/**
|
|
68
|
-
* Fires when an ActionSheet item is clicked.
|
|
69
|
-
*/
|
|
70
|
-
this.itemClick = new EventEmitter();
|
|
71
|
-
/**
|
|
72
|
-
* Fires when the modal overlay is clicked.
|
|
73
|
-
*/
|
|
74
|
-
this.overlayClick = new EventEmitter();
|
|
75
|
-
this.rtl = false;
|
|
76
|
-
this.domSubs = new Subscription();
|
|
77
|
-
this.animationEnd = new EventEmitter();
|
|
78
137
|
validatePackage(packageMetadata);
|
|
79
138
|
this.dynamicRTLSubscription = this.localizationService.changes.subscribe(({ rtl }) => {
|
|
80
139
|
this.rtl = rtl;
|
|
81
140
|
this.direction = this.rtl ? 'rtl' : 'ltr';
|
|
82
141
|
});
|
|
83
142
|
}
|
|
84
|
-
/**
|
|
85
|
-
* @hidden
|
|
86
|
-
*/
|
|
87
|
-
get hostClass() {
|
|
88
|
-
return this.expanded;
|
|
89
|
-
}
|
|
90
143
|
ngAfterViewInit() {
|
|
91
144
|
this.initDomEvents();
|
|
92
145
|
this.setCssVariables();
|
|
@@ -257,15 +310,14 @@ export class ActionSheetComponent {
|
|
|
257
310
|
});
|
|
258
311
|
this.player.play();
|
|
259
312
|
}
|
|
260
|
-
}
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
}
|
|
268
|
-
], queries: [{ propertyName: "actionSheetTemplate", first: true, predicate: ActionSheetTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ActionSheetHeaderTemplateDirective, descendants: true }, { propertyName: "contentTemplate", first: true, predicate: ActionSheetContentTemplateDirective, descendants: true }, { propertyName: "itemTemplate", first: true, predicate: ActionSheetItemTemplateDirective, descendants: true }, { propertyName: "footerTemplate", first: true, predicate: ActionSheetFooterTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "childContainer", first: true, predicate: ["childContainer"], descendants: true }], exportAs: ["kendoActionSheet"], usesOnChanges: true, ngImport: i0, template: `
|
|
313
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionSheetComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i2.AnimationBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
314
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ActionSheetComponent, isStandalone: true, selector: "kendo-actionsheet", inputs: { title: "title", subtitle: "subtitle", items: "items", cssClass: "cssClass", animation: "animation", expanded: "expanded", titleId: "titleId" }, outputs: { expandedChange: "expandedChange", expand: "expand", collapse: "collapse", itemClick: "itemClick", overlayClick: "overlayClick" }, host: { properties: { "class.k-actionsheet-container": "this.hostClass", "attr.dir": "this.direction" } }, providers: [
|
|
315
|
+
LocalizationService,
|
|
316
|
+
{
|
|
317
|
+
provide: L10N_PREFIX,
|
|
318
|
+
useValue: 'kendo.actionsheet.component'
|
|
319
|
+
}
|
|
320
|
+
], queries: [{ propertyName: "actionSheetTemplate", first: true, predicate: ActionSheetTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ActionSheetHeaderTemplateDirective, descendants: true }, { propertyName: "contentTemplate", first: true, predicate: ActionSheetContentTemplateDirective, descendants: true }, { propertyName: "itemTemplate", first: true, predicate: ActionSheetItemTemplateDirective, descendants: true }, { propertyName: "footerTemplate", first: true, predicate: ActionSheetFooterTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "childContainer", first: true, predicate: ["childContainer"], descendants: true }], exportAs: ["kendoActionSheet"], usesOnChanges: true, ngImport: i0, template: `
|
|
269
321
|
<ng-container *ngIf="expanded">
|
|
270
322
|
<div class="k-overlay" (click)="onOverlayClick()"></div>
|
|
271
323
|
<div class="k-animation-container k-animation-container-shown">
|
|
@@ -333,7 +385,8 @@ ActionSheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
|
|
|
333
385
|
</div>
|
|
334
386
|
</ng-container>
|
|
335
387
|
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ActionSheetListComponent, selector: "[kendoActionSheetList]", inputs: ["groupItems", "allItems", "itemTemplate"], outputs: ["itemClick"] }] });
|
|
336
|
-
|
|
388
|
+
}
|
|
389
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionSheetComponent, decorators: [{
|
|
337
390
|
type: Component,
|
|
338
391
|
args: [{
|
|
339
392
|
exportAs: 'kendoActionSheet',
|
|
@@ -11,9 +11,9 @@ import * as i0 from "@angular/core";
|
|
|
11
11
|
* @hidden
|
|
12
12
|
*/
|
|
13
13
|
export class ActionSheetItemComponent {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
14
|
+
itemTemplate;
|
|
15
|
+
item;
|
|
16
|
+
pointerClass = true;
|
|
17
17
|
manageIconClasses(item) {
|
|
18
18
|
const classes = ['k-actionsheet-item-icon'];
|
|
19
19
|
const isHexColor = isPresent(item.iconColor) && hexColorRegex.test(item.iconColor);
|
|
@@ -35,9 +35,8 @@ export class ActionSheetItemComponent {
|
|
|
35
35
|
}
|
|
36
36
|
return styles;
|
|
37
37
|
}
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
ActionSheetItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ActionSheetItemComponent, isStandalone: true, selector: "[kendoActionSheetItem]", inputs: { itemTemplate: "itemTemplate", item: "item" }, host: { properties: { "class.k-cursor-pointer": "this.pointerClass" } }, ngImport: i0, template: `
|
|
38
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionSheetItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
39
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ActionSheetItemComponent, isStandalone: true, selector: "[kendoActionSheetItem]", inputs: { itemTemplate: "itemTemplate", item: "item" }, host: { properties: { "class.k-cursor-pointer": "this.pointerClass" } }, ngImport: i0, template: `
|
|
41
40
|
<ng-template *ngIf="itemTemplate; else defaultTemplate"
|
|
42
41
|
[ngTemplateOutlet]="itemTemplate"
|
|
43
42
|
[ngTemplateOutletContext]="{
|
|
@@ -63,7 +62,8 @@ ActionSheetItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0
|
|
|
63
62
|
</span>
|
|
64
63
|
</ng-template>
|
|
65
64
|
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
|
|
66
|
-
|
|
65
|
+
}
|
|
66
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionSheetItemComponent, decorators: [{
|
|
67
67
|
type: Component,
|
|
68
68
|
args: [{
|
|
69
69
|
// eslint-disable-next-line @angular-eslint/component-selector
|
|
@@ -12,14 +12,18 @@ import * as i0 from "@angular/core";
|
|
|
12
12
|
* @hidden
|
|
13
13
|
*/
|
|
14
14
|
export class ActionSheetListComponent {
|
|
15
|
+
renderer;
|
|
16
|
+
ngZone;
|
|
17
|
+
element;
|
|
18
|
+
groupItems = [];
|
|
19
|
+
allItems = [];
|
|
20
|
+
itemTemplate;
|
|
21
|
+
itemClick = new EventEmitter();
|
|
22
|
+
subscriptions = new Subscription();
|
|
15
23
|
constructor(renderer, ngZone, element) {
|
|
16
24
|
this.renderer = renderer;
|
|
17
25
|
this.ngZone = ngZone;
|
|
18
26
|
this.element = element;
|
|
19
|
-
this.groupItems = [];
|
|
20
|
-
this.allItems = [];
|
|
21
|
-
this.itemClick = new EventEmitter();
|
|
22
|
-
this.subscriptions = new Subscription();
|
|
23
27
|
}
|
|
24
28
|
ngAfterViewInit() {
|
|
25
29
|
this.initDomEvents();
|
|
@@ -53,10 +57,10 @@ export class ActionSheetListComponent {
|
|
|
53
57
|
setAttrIndex(item) {
|
|
54
58
|
return this.allItems.indexOf(item);
|
|
55
59
|
}
|
|
60
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionSheetListComponent, deps: [{ token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
61
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ActionSheetListComponent, isStandalone: true, selector: "[kendoActionSheetList]", inputs: { groupItems: "groupItems", allItems: "allItems", itemTemplate: "itemTemplate" }, outputs: { itemClick: "itemClick" }, ngImport: i0, template: "\n <span *ngFor=\"let item of groupItems\" kendoActionSheetItem\n tabindex=\"0\"\n role=\"button\"\n [attr.aria-disabled]=\"item.disabled\"\n [class.k-actionsheet-item]=\"true\"\n [attr.kendo-actionsheet-item-index]=\"setAttrIndex(item)\"\n [class.k-disabled]=\"item.disabled\"\n [ngClass]=\"item.cssClass\"\n [ngStyle]=\"item.cssStyle\"\n [itemTemplate]=\"itemTemplate\"\n [item]=\"item\">\n </span>\n ", isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ActionSheetItemComponent, selector: "[kendoActionSheetItem]", inputs: ["itemTemplate", "item"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
56
62
|
}
|
|
57
|
-
|
|
58
|
-
ActionSheetListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ActionSheetListComponent, isStandalone: true, selector: "[kendoActionSheetList]", inputs: { groupItems: "groupItems", allItems: "allItems", itemTemplate: "itemTemplate" }, outputs: { itemClick: "itemClick" }, ngImport: i0, template: "\n <span *ngFor=\"let item of groupItems\" kendoActionSheetItem\n tabindex=\"0\"\n role=\"button\"\n [attr.aria-disabled]=\"item.disabled\"\n [class.k-actionsheet-item]=\"true\"\n [attr.kendo-actionsheet-item-index]=\"setAttrIndex(item)\"\n [class.k-disabled]=\"item.disabled\"\n [ngClass]=\"item.cssClass\"\n [ngStyle]=\"item.cssStyle\"\n [itemTemplate]=\"itemTemplate\"\n [item]=\"item\">\n </span>\n ", isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ActionSheetItemComponent, selector: "[kendoActionSheetItem]", inputs: ["itemTemplate", "item"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
59
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ActionSheetListComponent, decorators: [{
|
|
63
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionSheetListComponent, decorators: [{
|
|
60
64
|
type: Component,
|
|
61
65
|
args: [{
|
|
62
66
|
// eslint-disable-next-line @angular-eslint/component-selector
|
|
@@ -6,4 +6,12 @@
|
|
|
6
6
|
* Arguments for the `itemClick` event of the ActionSheet.
|
|
7
7
|
*/
|
|
8
8
|
export class ActionSheetItemClickEvent {
|
|
9
|
+
/**
|
|
10
|
+
* The ActionSheet item that was clicked.
|
|
11
|
+
*/
|
|
12
|
+
item;
|
|
13
|
+
/**
|
|
14
|
+
* The DOM event that triggered the `itemClick` event.
|
|
15
|
+
*/
|
|
16
|
+
originalEvent;
|
|
9
17
|
}
|
|
@@ -10,13 +10,14 @@ import * as i0 from "@angular/core";
|
|
|
10
10
|
* with the `kendoActionSheetTemplate` directive inside the `<kendo-actionsheet>` tag.
|
|
11
11
|
*/
|
|
12
12
|
export class ActionSheetTemplateDirective {
|
|
13
|
+
templateRef;
|
|
13
14
|
constructor(templateRef) {
|
|
14
15
|
this.templateRef = templateRef;
|
|
15
16
|
}
|
|
17
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionSheetTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
18
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ActionSheetTemplateDirective, isStandalone: true, selector: "[kendoActionSheetTemplate]", ngImport: i0 });
|
|
16
19
|
}
|
|
17
|
-
|
|
18
|
-
ActionSheetTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: ActionSheetTemplateDirective, isStandalone: true, selector: "[kendoActionSheetTemplate]", ngImport: i0 });
|
|
19
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ActionSheetTemplateDirective, decorators: [{
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionSheetTemplateDirective, decorators: [{
|
|
20
21
|
type: Directive,
|
|
21
22
|
args: [{
|
|
22
23
|
selector: '[kendoActionSheetTemplate]',
|