@progress/kendo-angular-navigation 12.2.0-develop.1 → 12.2.0-develop.3
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/actionsheet/actionsheet.component.d.ts +8 -5
- package/bottomnavigation/bottomnavigation-item.component.d.ts +0 -2
- package/esm2020/actionsheet/actionsheet.component.mjs +10 -6
- package/esm2020/bottomnavigation/bottomnavigation-item.component.mjs +3 -15
- package/esm2020/bottomnavigation/bottomnavigation.component.mjs +6 -10
- package/esm2020/breadcrumb/breadcrumb-item.component.mjs +3 -8
- package/esm2020/breadcrumb/breadcrumb.component.mjs +2 -2
- package/esm2020/package-metadata.mjs +2 -2
- package/fesm2015/progress-kendo-angular-navigation.mjs +26 -43
- package/fesm2020/progress-kendo-angular-navigation.mjs +26 -43
- package/package.json +5 -5
|
@@ -57,6 +57,13 @@ export declare class ActionSheetComponent implements AfterViewInit, OnDestroy, O
|
|
|
57
57
|
* @default false
|
|
58
58
|
*/
|
|
59
59
|
expanded: boolean;
|
|
60
|
+
/**
|
|
61
|
+
* Sets the `aria-labelledby` attribute of the ActionSheet wrapper element.
|
|
62
|
+
* Use this option when the built-in header element is replaced through the [`ActionSheetHeaderTemplate`]({% slug api_navigation_actionsheetheadertemplatedirective %})
|
|
63
|
+
* or [`ActionSheetContentTemplate`]({% slug api_navigation_actionsheetcontenttemplatedirective %}).
|
|
64
|
+
*
|
|
65
|
+
*/
|
|
66
|
+
titleId: string;
|
|
60
67
|
/**
|
|
61
68
|
* Fires when the `expanded` property of the component is updated.
|
|
62
69
|
* Used to provide a two-way binding for the `expanded` property.
|
|
@@ -102,10 +109,6 @@ export declare class ActionSheetComponent implements AfterViewInit, OnDestroy, O
|
|
|
102
109
|
* @hidden
|
|
103
110
|
*/
|
|
104
111
|
footerTemplate: ActionSheetFooterTemplateDirective;
|
|
105
|
-
/**
|
|
106
|
-
* @hidden
|
|
107
|
-
*/
|
|
108
|
-
titleId: string;
|
|
109
112
|
private dynamicRTLSubscription;
|
|
110
113
|
private rtl;
|
|
111
114
|
private domSubs;
|
|
@@ -151,5 +154,5 @@ export declare class ActionSheetComponent implements AfterViewInit, OnDestroy, O
|
|
|
151
154
|
private onAnimationEnd;
|
|
152
155
|
private playAnimation;
|
|
153
156
|
static ɵfac: i0.ɵɵFactoryDeclaration<ActionSheetComponent, never>;
|
|
154
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<ActionSheetComponent, "kendo-actionsheet", ["kendoActionSheet"], { "title": "title"; "subtitle": "subtitle"; "items": "items"; "cssClass": "cssClass"; "animation": "animation"; "expanded": "expanded"; }, { "expandedChange": "expandedChange"; "expand": "expand"; "collapse": "collapse"; "itemClick": "itemClick"; "overlayClick": "overlayClick"; }, ["actionSheetTemplate", "headerTemplate", "contentTemplate", "itemTemplate", "footerTemplate"], 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>;
|
|
155
158
|
}
|
|
@@ -17,8 +17,6 @@ export declare class BottomNavigationItemComponent {
|
|
|
17
17
|
selectedIdx: number;
|
|
18
18
|
orientation: BottomNavigationItemFlow;
|
|
19
19
|
get disabledClass(): boolean;
|
|
20
|
-
get horizontalItemClass(): boolean;
|
|
21
|
-
get verticalItemClass(): boolean;
|
|
22
20
|
get label(): string;
|
|
23
21
|
get tabindex(): number;
|
|
24
22
|
get selectedClass(): boolean;
|
|
@@ -44,6 +44,13 @@ export class ActionSheetComponent {
|
|
|
44
44
|
* @default false
|
|
45
45
|
*/
|
|
46
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');
|
|
47
54
|
/**
|
|
48
55
|
* Fires when the `expanded` property of the component is updated.
|
|
49
56
|
* Used to provide a two-way binding for the `expanded` property.
|
|
@@ -65,10 +72,6 @@ export class ActionSheetComponent {
|
|
|
65
72
|
* Fires when the modal overlay is clicked.
|
|
66
73
|
*/
|
|
67
74
|
this.overlayClick = new EventEmitter();
|
|
68
|
-
/**
|
|
69
|
-
* @hidden
|
|
70
|
-
*/
|
|
71
|
-
this.titleId = null;
|
|
72
75
|
this.rtl = false;
|
|
73
76
|
this.domSubs = new Subscription();
|
|
74
77
|
this.animationEnd = new EventEmitter();
|
|
@@ -77,7 +80,6 @@ export class ActionSheetComponent {
|
|
|
77
80
|
this.rtl = rtl;
|
|
78
81
|
this.direction = this.rtl ? 'rtl' : 'ltr';
|
|
79
82
|
});
|
|
80
|
-
this.titleId = getId('k-actionsheet-title');
|
|
81
83
|
}
|
|
82
84
|
/**
|
|
83
85
|
* @hidden
|
|
@@ -256,7 +258,7 @@ export class ActionSheetComponent {
|
|
|
256
258
|
}
|
|
257
259
|
}
|
|
258
260
|
ActionSheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.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 });
|
|
259
|
-
ActionSheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ActionSheetComponent, selector: "kendo-actionsheet", inputs: { title: "title", subtitle: "subtitle", items: "items", cssClass: "cssClass", animation: "animation", expanded: "expanded" }, outputs: { expandedChange: "expandedChange", expand: "expand", collapse: "collapse", itemClick: "itemClick", overlayClick: "overlayClick" }, host: { properties: { "class.k-actionsheet-container": "this.hostClass", "attr.dir": "this.direction" } }, providers: [
|
|
261
|
+
ActionSheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ActionSheetComponent, 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: [
|
|
260
262
|
LocalizationService,
|
|
261
263
|
{
|
|
262
264
|
provide: L10N_PREFIX,
|
|
@@ -429,6 +431,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
429
431
|
type: Input
|
|
430
432
|
}], expanded: [{
|
|
431
433
|
type: Input
|
|
434
|
+
}], titleId: [{
|
|
435
|
+
type: Input
|
|
432
436
|
}], expandedChange: [{
|
|
433
437
|
type: Output
|
|
434
438
|
}], expand: [{
|
|
@@ -14,12 +14,6 @@ export class BottomNavigationItemComponent {
|
|
|
14
14
|
get disabledClass() {
|
|
15
15
|
return this.item.disabled;
|
|
16
16
|
}
|
|
17
|
-
get horizontalItemClass() {
|
|
18
|
-
return this.orientation === 'horizontal';
|
|
19
|
-
}
|
|
20
|
-
get verticalItemClass() {
|
|
21
|
-
return this.orientation === 'vertical';
|
|
22
|
-
}
|
|
23
17
|
get label() {
|
|
24
18
|
return this.item.text ? this.item.text : null;
|
|
25
19
|
}
|
|
@@ -39,10 +33,10 @@ export class BottomNavigationItemComponent {
|
|
|
39
33
|
}
|
|
40
34
|
}
|
|
41
35
|
BottomNavigationItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BottomNavigationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
42
|
-
BottomNavigationItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationItemComponent, selector: "[kendoBottomNavigationItem]", inputs: { itemTemplate: "itemTemplate", item: "item", index: "index", disabledComponent: "disabledComponent", selectedIdx: "selectedIdx", orientation: "orientation" }, host: { properties: { "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "
|
|
36
|
+
BottomNavigationItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationItemComponent, selector: "[kendoBottomNavigationItem]", inputs: { itemTemplate: "itemTemplate", item: "item", index: "index", disabledComponent: "disabledComponent", selectedIdx: "selectedIdx", orientation: "orientation" }, host: { properties: { "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "attr.aria-label": "this.label", "attr.tabindex": "this.tabindex", "attr.aria-current": "this.selectedClass", "class.k-selected": "this.selectedClass" } }, ngImport: i0, template: `
|
|
43
37
|
<ng-container *ngIf="!itemTemplate">
|
|
44
38
|
<kendo-icon-wrapper *ngIf="itemIcon"
|
|
45
|
-
|
|
39
|
+
innerCssClass="k-bottom-nav-item-icon"
|
|
46
40
|
[name]="item.icon"
|
|
47
41
|
[customFontClass]="item.iconClass"
|
|
48
42
|
[svgIcon]="item.svgIcon"></kendo-icon-wrapper>
|
|
@@ -61,7 +55,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
61
55
|
template: `
|
|
62
56
|
<ng-container *ngIf="!itemTemplate">
|
|
63
57
|
<kendo-icon-wrapper *ngIf="itemIcon"
|
|
64
|
-
|
|
58
|
+
innerCssClass="k-bottom-nav-item-icon"
|
|
65
59
|
[name]="item.icon"
|
|
66
60
|
[customFontClass]="item.iconClass"
|
|
67
61
|
[svgIcon]="item.svgIcon"></kendo-icon-wrapper>
|
|
@@ -91,12 +85,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
91
85
|
}, {
|
|
92
86
|
type: HostBinding,
|
|
93
87
|
args: ['class.k-disabled']
|
|
94
|
-
}], horizontalItemClass: [{
|
|
95
|
-
type: HostBinding,
|
|
96
|
-
args: ['class.k-hstack']
|
|
97
|
-
}], verticalItemClass: [{
|
|
98
|
-
type: HostBinding,
|
|
99
|
-
args: ['class.k-vstack']
|
|
100
88
|
}], label: [{
|
|
101
89
|
type: HostBinding,
|
|
102
90
|
args: ['attr.aria-label']
|
|
@@ -89,8 +89,10 @@ export class BottomNavigationComponent {
|
|
|
89
89
|
*/
|
|
90
90
|
set fill(fill) {
|
|
91
91
|
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this.fill}`);
|
|
92
|
+
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this.themeColor}`);
|
|
92
93
|
this._fill = fill === 'solid' ? 'solid' : 'flat';
|
|
93
94
|
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this._fill}`);
|
|
95
|
+
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this._fill}-${this.themeColor}`);
|
|
94
96
|
}
|
|
95
97
|
get fill() {
|
|
96
98
|
return this._fill;
|
|
@@ -143,9 +145,9 @@ export class BottomNavigationComponent {
|
|
|
143
145
|
set themeColor(themeColor) {
|
|
144
146
|
const newColor = colors.find(color => color === themeColor);
|
|
145
147
|
if (newColor) {
|
|
146
|
-
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this._themeColor}`);
|
|
148
|
+
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this._themeColor}`);
|
|
147
149
|
this._themeColor = themeColor;
|
|
148
|
-
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this._themeColor}`);
|
|
150
|
+
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this._themeColor}`);
|
|
149
151
|
}
|
|
150
152
|
}
|
|
151
153
|
get themeColor() {
|
|
@@ -198,7 +200,7 @@ export class BottomNavigationComponent {
|
|
|
198
200
|
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.fill}`);
|
|
199
201
|
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-item-flow-${this.itemFlow}`);
|
|
200
202
|
this.renderer.addClass(this._nativeHostElement, `k-pos-${this.positionMode}`);
|
|
201
|
-
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.themeColor}`);
|
|
203
|
+
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this.themeColor}`);
|
|
202
204
|
}
|
|
203
205
|
initDomEvents() {
|
|
204
206
|
if (!this.hostElement) {
|
|
@@ -245,7 +247,7 @@ export class BottomNavigationComponent {
|
|
|
245
247
|
}
|
|
246
248
|
}
|
|
247
249
|
BottomNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BottomNavigationComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
248
|
-
BottomNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationComponent, selector: "kendo-bottomnavigation", inputs: { items: "items", border: "border", disabled: "disabled", fill: "fill", itemFlow: "itemFlow", positionMode: "positionMode", themeColor: "themeColor" }, outputs: { select: "select" }, host: { properties: { "class.k-
|
|
250
|
+
BottomNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationComponent, selector: "kendo-bottomnavigation", inputs: { items: "items", border: "border", disabled: "disabled", fill: "fill", itemFlow: "itemFlow", positionMode: "positionMode", themeColor: "themeColor" }, outputs: { select: "select" }, host: { properties: { "class.k-bottom-nav": "this.hostClass", "class.k-bottom-nav-border": "this.borderClass", "class.k-disabled": "this.disabledClass", "attr.role": "this.role", "attr.dir": "this.direction" } }, providers: [
|
|
249
251
|
LocalizationService,
|
|
250
252
|
{
|
|
251
253
|
provide: L10N_PREFIX,
|
|
@@ -300,12 +302,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
300
302
|
}], select: [{
|
|
301
303
|
type: Output
|
|
302
304
|
}], hostClass: [{
|
|
303
|
-
type: HostBinding,
|
|
304
|
-
args: ['class.k-hstack']
|
|
305
|
-
}, {
|
|
306
|
-
type: HostBinding,
|
|
307
|
-
args: ['class.k-justify-content-stretch']
|
|
308
|
-
}, {
|
|
309
305
|
type: HostBinding,
|
|
310
306
|
args: ['class.k-bottom-nav']
|
|
311
307
|
}], borderClass: [{
|
|
@@ -42,7 +42,7 @@ export class BreadCrumbItemComponent {
|
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
44
|
BreadCrumbItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BreadCrumbItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
45
|
-
BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BreadCrumbItemComponent, selector: "[kendoBreadCrumbItem]", inputs: { item: "item", collapseMode: "collapseMode", index: "index", itemTemplate: "itemTemplate" }, host: { properties: { "class.k-
|
|
45
|
+
BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BreadCrumbItemComponent, selector: "[kendoBreadCrumbItem]", inputs: { item: "item", collapseMode: "collapseMode", index: "index", itemTemplate: "itemTemplate" }, host: { properties: { "class.k-breadcrumb-item": "this.hostClasses", "class.k-breadcrumb-root-item": "this.isRootItem", "attr.aria-disabled": "this.isDisabled", "class.k-breadcrumb-last-item": "this.isLastItem" } }, ngImport: i0, template: `
|
|
46
46
|
<ng-template #separator>
|
|
47
47
|
<ng-content select="[kendoBreadCrumbSeparator]"></ng-content>
|
|
48
48
|
</ng-template>
|
|
@@ -66,7 +66,6 @@ BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
|
|
|
66
66
|
[attr.aria-disabled]="disabled"
|
|
67
67
|
[attr.aria-current]="item.context.isLast ? 'page' : null"
|
|
68
68
|
role="link"
|
|
69
|
-
class="k-cursor-pointer k-flex-none"
|
|
70
69
|
>
|
|
71
70
|
<img *ngIf="item.data.imageUrl" (load)="onImageLoad()" [src]="item.data.imageUrl" class="k-image" role="presentation" />
|
|
72
71
|
<kendo-icon-wrapper *ngIf="item.data.icon || item.data.iconClass || item.data.svgIcon"
|
|
@@ -75,7 +74,7 @@ BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
|
|
|
75
74
|
[svgIcon]="item.data.svgIcon"
|
|
76
75
|
>
|
|
77
76
|
</kendo-icon-wrapper>
|
|
78
|
-
{{ item.data.text }}
|
|
77
|
+
<span class="k-breadcrumb-item-text">{{ item.data.text }}</span>
|
|
79
78
|
</span>
|
|
80
79
|
<ng-template
|
|
81
80
|
*ngIf="itemTemplate"
|
|
@@ -120,7 +119,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
120
119
|
[attr.aria-disabled]="disabled"
|
|
121
120
|
[attr.aria-current]="item.context.isLast ? 'page' : null"
|
|
122
121
|
role="link"
|
|
123
|
-
class="k-cursor-pointer k-flex-none"
|
|
124
122
|
>
|
|
125
123
|
<img *ngIf="item.data.imageUrl" (load)="onImageLoad()" [src]="item.data.imageUrl" class="k-image" role="presentation" />
|
|
126
124
|
<kendo-icon-wrapper *ngIf="item.data.icon || item.data.iconClass || item.data.svgIcon"
|
|
@@ -129,7 +127,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
129
127
|
[svgIcon]="item.data.svgIcon"
|
|
130
128
|
>
|
|
131
129
|
</kendo-icon-wrapper>
|
|
132
|
-
{{ item.data.text }}
|
|
130
|
+
<span class="k-breadcrumb-item-text">{{ item.data.text }}</span>
|
|
133
131
|
</span>
|
|
134
132
|
<ng-template
|
|
135
133
|
*ngIf="itemTemplate"
|
|
@@ -155,9 +153,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
155
153
|
}], itemTemplate: [{
|
|
156
154
|
type: Input
|
|
157
155
|
}], hostClasses: [{
|
|
158
|
-
type: HostBinding,
|
|
159
|
-
args: ['class.k-flex-none']
|
|
160
|
-
}, {
|
|
161
156
|
type: HostBinding,
|
|
162
157
|
args: ['class.k-breadcrumb-item']
|
|
163
158
|
}], isRootItem: [{
|
|
@@ -217,7 +217,7 @@ BreadCrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
|
|
|
217
217
|
[separatorIcon]="separatorIcon"
|
|
218
218
|
[separatorSVGIcon]="separatorSVGIcon"
|
|
219
219
|
(itemClick)="itemClick.emit($event)"
|
|
220
|
-
[ngClass]="{ 'k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
220
|
+
[ngClass]="{ '!k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
221
221
|
></ol>
|
|
222
222
|
<kendo-resize-sensor [rateLimit]="1000" #resizeSensor></kendo-resize-sensor>
|
|
223
223
|
`, isInline: true, components: [{ type: i2.BreadCrumbListComponent, selector: "[kendoBreadCrumbList]", inputs: ["items", "itemTemplate", "collapseMode", "separatorIcon", "separatorSVGIcon"], outputs: ["itemClick"] }, { type: i3.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i4.AsyncPipe } });
|
|
@@ -256,7 +256,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
256
256
|
[separatorIcon]="separatorIcon"
|
|
257
257
|
[separatorSVGIcon]="separatorSVGIcon"
|
|
258
258
|
(itemClick)="itemClick.emit($event)"
|
|
259
|
-
[ngClass]="{ 'k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
259
|
+
[ngClass]="{ '!k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
260
260
|
></ol>
|
|
261
261
|
<kendo-resize-sensor [rateLimit]="1000" #resizeSensor></kendo-resize-sensor>
|
|
262
262
|
`
|
|
@@ -9,7 +9,7 @@ export const packageMetadata = {
|
|
|
9
9
|
name: '@progress/kendo-angular-navigation',
|
|
10
10
|
productName: 'Kendo UI for Angular',
|
|
11
11
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
12
|
-
publishDate:
|
|
13
|
-
version: '12.2.0-develop.
|
|
12
|
+
publishDate: 1684487705,
|
|
13
|
+
version: '12.2.0-develop.3',
|
|
14
14
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
15
15
|
};
|
|
@@ -26,8 +26,8 @@ const packageMetadata = {
|
|
|
26
26
|
name: '@progress/kendo-angular-navigation',
|
|
27
27
|
productName: 'Kendo UI for Angular',
|
|
28
28
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
29
|
-
publishDate:
|
|
30
|
-
version: '12.2.0-develop.
|
|
29
|
+
publishDate: 1684487705,
|
|
30
|
+
version: '12.2.0-develop.3',
|
|
31
31
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
32
32
|
};
|
|
33
33
|
|
|
@@ -459,7 +459,7 @@ class BreadCrumbItemComponent {
|
|
|
459
459
|
}
|
|
460
460
|
}
|
|
461
461
|
BreadCrumbItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BreadCrumbItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
462
|
-
BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BreadCrumbItemComponent, selector: "[kendoBreadCrumbItem]", inputs: { item: "item", collapseMode: "collapseMode", index: "index", itemTemplate: "itemTemplate" }, host: { properties: { "class.k-
|
|
462
|
+
BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BreadCrumbItemComponent, selector: "[kendoBreadCrumbItem]", inputs: { item: "item", collapseMode: "collapseMode", index: "index", itemTemplate: "itemTemplate" }, host: { properties: { "class.k-breadcrumb-item": "this.hostClasses", "class.k-breadcrumb-root-item": "this.isRootItem", "attr.aria-disabled": "this.isDisabled", "class.k-breadcrumb-last-item": "this.isLastItem" } }, ngImport: i0, template: `
|
|
463
463
|
<ng-template #separator>
|
|
464
464
|
<ng-content select="[kendoBreadCrumbSeparator]"></ng-content>
|
|
465
465
|
</ng-template>
|
|
@@ -483,7 +483,6 @@ BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
|
|
|
483
483
|
[attr.aria-disabled]="disabled"
|
|
484
484
|
[attr.aria-current]="item.context.isLast ? 'page' : null"
|
|
485
485
|
role="link"
|
|
486
|
-
class="k-cursor-pointer k-flex-none"
|
|
487
486
|
>
|
|
488
487
|
<img *ngIf="item.data.imageUrl" (load)="onImageLoad()" [src]="item.data.imageUrl" class="k-image" role="presentation" />
|
|
489
488
|
<kendo-icon-wrapper *ngIf="item.data.icon || item.data.iconClass || item.data.svgIcon"
|
|
@@ -492,7 +491,7 @@ BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
|
|
|
492
491
|
[svgIcon]="item.data.svgIcon"
|
|
493
492
|
>
|
|
494
493
|
</kendo-icon-wrapper>
|
|
495
|
-
{{ item.data.text }}
|
|
494
|
+
<span class="k-breadcrumb-item-text">{{ item.data.text }}</span>
|
|
496
495
|
</span>
|
|
497
496
|
<ng-template
|
|
498
497
|
*ngIf="itemTemplate"
|
|
@@ -537,7 +536,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
537
536
|
[attr.aria-disabled]="disabled"
|
|
538
537
|
[attr.aria-current]="item.context.isLast ? 'page' : null"
|
|
539
538
|
role="link"
|
|
540
|
-
class="k-cursor-pointer k-flex-none"
|
|
541
539
|
>
|
|
542
540
|
<img *ngIf="item.data.imageUrl" (load)="onImageLoad()" [src]="item.data.imageUrl" class="k-image" role="presentation" />
|
|
543
541
|
<kendo-icon-wrapper *ngIf="item.data.icon || item.data.iconClass || item.data.svgIcon"
|
|
@@ -546,7 +544,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
546
544
|
[svgIcon]="item.data.svgIcon"
|
|
547
545
|
>
|
|
548
546
|
</kendo-icon-wrapper>
|
|
549
|
-
{{ item.data.text }}
|
|
547
|
+
<span class="k-breadcrumb-item-text">{{ item.data.text }}</span>
|
|
550
548
|
</span>
|
|
551
549
|
<ng-template
|
|
552
550
|
*ngIf="itemTemplate"
|
|
@@ -572,9 +570,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
572
570
|
}], itemTemplate: [{
|
|
573
571
|
type: Input
|
|
574
572
|
}], hostClasses: [{
|
|
575
|
-
type: HostBinding,
|
|
576
|
-
args: ['class.k-flex-none']
|
|
577
|
-
}, {
|
|
578
573
|
type: HostBinding,
|
|
579
574
|
args: ['class.k-breadcrumb-item']
|
|
580
575
|
}], isRootItem: [{
|
|
@@ -995,7 +990,7 @@ BreadCrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
|
|
|
995
990
|
[separatorIcon]="separatorIcon"
|
|
996
991
|
[separatorSVGIcon]="separatorSVGIcon"
|
|
997
992
|
(itemClick)="itemClick.emit($event)"
|
|
998
|
-
[ngClass]="{ 'k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
993
|
+
[ngClass]="{ '!k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
999
994
|
></ol>
|
|
1000
995
|
<kendo-resize-sensor [rateLimit]="1000" #resizeSensor></kendo-resize-sensor>
|
|
1001
996
|
`, isInline: true, components: [{ type: BreadCrumbListComponent, selector: "[kendoBreadCrumbList]", inputs: ["items", "itemTemplate", "collapseMode", "separatorIcon", "separatorSVGIcon"], outputs: ["itemClick"] }, { type: i3.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i2.AsyncPipe } });
|
|
@@ -1034,7 +1029,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
1034
1029
|
[separatorIcon]="separatorIcon"
|
|
1035
1030
|
[separatorSVGIcon]="separatorSVGIcon"
|
|
1036
1031
|
(itemClick)="itemClick.emit($event)"
|
|
1037
|
-
[ngClass]="{ 'k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
1032
|
+
[ngClass]="{ '!k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
1038
1033
|
></ol>
|
|
1039
1034
|
<kendo-resize-sensor [rateLimit]="1000" #resizeSensor></kendo-resize-sensor>
|
|
1040
1035
|
`
|
|
@@ -1144,12 +1139,6 @@ class BottomNavigationItemComponent {
|
|
|
1144
1139
|
get disabledClass() {
|
|
1145
1140
|
return this.item.disabled;
|
|
1146
1141
|
}
|
|
1147
|
-
get horizontalItemClass() {
|
|
1148
|
-
return this.orientation === 'horizontal';
|
|
1149
|
-
}
|
|
1150
|
-
get verticalItemClass() {
|
|
1151
|
-
return this.orientation === 'vertical';
|
|
1152
|
-
}
|
|
1153
1142
|
get label() {
|
|
1154
1143
|
return this.item.text ? this.item.text : null;
|
|
1155
1144
|
}
|
|
@@ -1169,10 +1158,10 @@ class BottomNavigationItemComponent {
|
|
|
1169
1158
|
}
|
|
1170
1159
|
}
|
|
1171
1160
|
BottomNavigationItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BottomNavigationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1172
|
-
BottomNavigationItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationItemComponent, selector: "[kendoBottomNavigationItem]", inputs: { itemTemplate: "itemTemplate", item: "item", index: "index", disabledComponent: "disabledComponent", selectedIdx: "selectedIdx", orientation: "orientation" }, host: { properties: { "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "
|
|
1161
|
+
BottomNavigationItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationItemComponent, selector: "[kendoBottomNavigationItem]", inputs: { itemTemplate: "itemTemplate", item: "item", index: "index", disabledComponent: "disabledComponent", selectedIdx: "selectedIdx", orientation: "orientation" }, host: { properties: { "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "attr.aria-label": "this.label", "attr.tabindex": "this.tabindex", "attr.aria-current": "this.selectedClass", "class.k-selected": "this.selectedClass" } }, ngImport: i0, template: `
|
|
1173
1162
|
<ng-container *ngIf="!itemTemplate">
|
|
1174
1163
|
<kendo-icon-wrapper *ngIf="itemIcon"
|
|
1175
|
-
|
|
1164
|
+
innerCssClass="k-bottom-nav-item-icon"
|
|
1176
1165
|
[name]="item.icon"
|
|
1177
1166
|
[customFontClass]="item.iconClass"
|
|
1178
1167
|
[svgIcon]="item.svgIcon"></kendo-icon-wrapper>
|
|
@@ -1191,7 +1180,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
1191
1180
|
template: `
|
|
1192
1181
|
<ng-container *ngIf="!itemTemplate">
|
|
1193
1182
|
<kendo-icon-wrapper *ngIf="itemIcon"
|
|
1194
|
-
|
|
1183
|
+
innerCssClass="k-bottom-nav-item-icon"
|
|
1195
1184
|
[name]="item.icon"
|
|
1196
1185
|
[customFontClass]="item.iconClass"
|
|
1197
1186
|
[svgIcon]="item.svgIcon"></kendo-icon-wrapper>
|
|
@@ -1221,12 +1210,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
1221
1210
|
}, {
|
|
1222
1211
|
type: HostBinding,
|
|
1223
1212
|
args: ['class.k-disabled']
|
|
1224
|
-
}], horizontalItemClass: [{
|
|
1225
|
-
type: HostBinding,
|
|
1226
|
-
args: ['class.k-hstack']
|
|
1227
|
-
}], verticalItemClass: [{
|
|
1228
|
-
type: HostBinding,
|
|
1229
|
-
args: ['class.k-vstack']
|
|
1230
1213
|
}], label: [{
|
|
1231
1214
|
type: HostBinding,
|
|
1232
1215
|
args: ['attr.aria-label']
|
|
@@ -1383,8 +1366,10 @@ class BottomNavigationComponent {
|
|
|
1383
1366
|
*/
|
|
1384
1367
|
set fill(fill) {
|
|
1385
1368
|
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this.fill}`);
|
|
1369
|
+
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this.themeColor}`);
|
|
1386
1370
|
this._fill = fill === 'solid' ? 'solid' : 'flat';
|
|
1387
1371
|
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this._fill}`);
|
|
1372
|
+
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this._fill}-${this.themeColor}`);
|
|
1388
1373
|
}
|
|
1389
1374
|
get fill() {
|
|
1390
1375
|
return this._fill;
|
|
@@ -1437,9 +1422,9 @@ class BottomNavigationComponent {
|
|
|
1437
1422
|
set themeColor(themeColor) {
|
|
1438
1423
|
const newColor = colors.find(color => color === themeColor);
|
|
1439
1424
|
if (newColor) {
|
|
1440
|
-
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this._themeColor}`);
|
|
1425
|
+
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this._themeColor}`);
|
|
1441
1426
|
this._themeColor = themeColor;
|
|
1442
|
-
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this._themeColor}`);
|
|
1427
|
+
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this._themeColor}`);
|
|
1443
1428
|
}
|
|
1444
1429
|
}
|
|
1445
1430
|
get themeColor() {
|
|
@@ -1492,7 +1477,7 @@ class BottomNavigationComponent {
|
|
|
1492
1477
|
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.fill}`);
|
|
1493
1478
|
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-item-flow-${this.itemFlow}`);
|
|
1494
1479
|
this.renderer.addClass(this._nativeHostElement, `k-pos-${this.positionMode}`);
|
|
1495
|
-
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.themeColor}`);
|
|
1480
|
+
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this.themeColor}`);
|
|
1496
1481
|
}
|
|
1497
1482
|
initDomEvents() {
|
|
1498
1483
|
if (!this.hostElement) {
|
|
@@ -1539,7 +1524,7 @@ class BottomNavigationComponent {
|
|
|
1539
1524
|
}
|
|
1540
1525
|
}
|
|
1541
1526
|
BottomNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BottomNavigationComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
1542
|
-
BottomNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationComponent, selector: "kendo-bottomnavigation", inputs: { items: "items", border: "border", disabled: "disabled", fill: "fill", itemFlow: "itemFlow", positionMode: "positionMode", themeColor: "themeColor" }, outputs: { select: "select" }, host: { properties: { "class.k-
|
|
1527
|
+
BottomNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationComponent, selector: "kendo-bottomnavigation", inputs: { items: "items", border: "border", disabled: "disabled", fill: "fill", itemFlow: "itemFlow", positionMode: "positionMode", themeColor: "themeColor" }, outputs: { select: "select" }, host: { properties: { "class.k-bottom-nav": "this.hostClass", "class.k-bottom-nav-border": "this.borderClass", "class.k-disabled": "this.disabledClass", "attr.role": "this.role", "attr.dir": "this.direction" } }, providers: [
|
|
1543
1528
|
LocalizationService,
|
|
1544
1529
|
{
|
|
1545
1530
|
provide: L10N_PREFIX,
|
|
@@ -1594,12 +1579,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
1594
1579
|
}], select: [{
|
|
1595
1580
|
type: Output
|
|
1596
1581
|
}], hostClass: [{
|
|
1597
|
-
type: HostBinding,
|
|
1598
|
-
args: ['class.k-hstack']
|
|
1599
|
-
}, {
|
|
1600
|
-
type: HostBinding,
|
|
1601
|
-
args: ['class.k-justify-content-stretch']
|
|
1602
|
-
}, {
|
|
1603
1582
|
type: HostBinding,
|
|
1604
1583
|
args: ['class.k-bottom-nav']
|
|
1605
1584
|
}], borderClass: [{
|
|
@@ -2008,6 +1987,13 @@ class ActionSheetComponent {
|
|
|
2008
1987
|
* @default false
|
|
2009
1988
|
*/
|
|
2010
1989
|
this.expanded = false;
|
|
1990
|
+
/**
|
|
1991
|
+
* Sets the `aria-labelledby` attribute of the ActionSheet wrapper element.
|
|
1992
|
+
* Use this option when the built-in header element is replaced through the [`ActionSheetHeaderTemplate`]({% slug api_navigation_actionsheetheadertemplatedirective %})
|
|
1993
|
+
* or [`ActionSheetContentTemplate`]({% slug api_navigation_actionsheetcontenttemplatedirective %}).
|
|
1994
|
+
*
|
|
1995
|
+
*/
|
|
1996
|
+
this.titleId = getId('k-actionsheet-title');
|
|
2011
1997
|
/**
|
|
2012
1998
|
* Fires when the `expanded` property of the component is updated.
|
|
2013
1999
|
* Used to provide a two-way binding for the `expanded` property.
|
|
@@ -2029,10 +2015,6 @@ class ActionSheetComponent {
|
|
|
2029
2015
|
* Fires when the modal overlay is clicked.
|
|
2030
2016
|
*/
|
|
2031
2017
|
this.overlayClick = new EventEmitter();
|
|
2032
|
-
/**
|
|
2033
|
-
* @hidden
|
|
2034
|
-
*/
|
|
2035
|
-
this.titleId = null;
|
|
2036
2018
|
this.rtl = false;
|
|
2037
2019
|
this.domSubs = new Subscription();
|
|
2038
2020
|
this.animationEnd = new EventEmitter();
|
|
@@ -2041,7 +2023,6 @@ class ActionSheetComponent {
|
|
|
2041
2023
|
this.rtl = rtl;
|
|
2042
2024
|
this.direction = this.rtl ? 'rtl' : 'ltr';
|
|
2043
2025
|
});
|
|
2044
|
-
this.titleId = getId('k-actionsheet-title');
|
|
2045
2026
|
}
|
|
2046
2027
|
/**
|
|
2047
2028
|
* @hidden
|
|
@@ -2223,7 +2204,7 @@ class ActionSheetComponent {
|
|
|
2223
2204
|
}
|
|
2224
2205
|
}
|
|
2225
2206
|
ActionSheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ActionSheetComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i2$1.AnimationBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2226
|
-
ActionSheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ActionSheetComponent, selector: "kendo-actionsheet", inputs: { title: "title", subtitle: "subtitle", items: "items", cssClass: "cssClass", animation: "animation", expanded: "expanded" }, outputs: { expandedChange: "expandedChange", expand: "expand", collapse: "collapse", itemClick: "itemClick", overlayClick: "overlayClick" }, host: { properties: { "class.k-actionsheet-container": "this.hostClass", "attr.dir": "this.direction" } }, providers: [
|
|
2207
|
+
ActionSheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ActionSheetComponent, 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: [
|
|
2227
2208
|
LocalizationService,
|
|
2228
2209
|
{
|
|
2229
2210
|
provide: L10N_PREFIX,
|
|
@@ -2396,6 +2377,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
2396
2377
|
type: Input
|
|
2397
2378
|
}], expanded: [{
|
|
2398
2379
|
type: Input
|
|
2380
|
+
}], titleId: [{
|
|
2381
|
+
type: Input
|
|
2399
2382
|
}], expandedChange: [{
|
|
2400
2383
|
type: Output
|
|
2401
2384
|
}], expand: [{
|
|
@@ -26,8 +26,8 @@ const packageMetadata = {
|
|
|
26
26
|
name: '@progress/kendo-angular-navigation',
|
|
27
27
|
productName: 'Kendo UI for Angular',
|
|
28
28
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
29
|
-
publishDate:
|
|
30
|
-
version: '12.2.0-develop.
|
|
29
|
+
publishDate: 1684487705,
|
|
30
|
+
version: '12.2.0-develop.3',
|
|
31
31
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
32
32
|
};
|
|
33
33
|
|
|
@@ -457,7 +457,7 @@ class BreadCrumbItemComponent {
|
|
|
457
457
|
}
|
|
458
458
|
}
|
|
459
459
|
BreadCrumbItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BreadCrumbItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
460
|
-
BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BreadCrumbItemComponent, selector: "[kendoBreadCrumbItem]", inputs: { item: "item", collapseMode: "collapseMode", index: "index", itemTemplate: "itemTemplate" }, host: { properties: { "class.k-
|
|
460
|
+
BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BreadCrumbItemComponent, selector: "[kendoBreadCrumbItem]", inputs: { item: "item", collapseMode: "collapseMode", index: "index", itemTemplate: "itemTemplate" }, host: { properties: { "class.k-breadcrumb-item": "this.hostClasses", "class.k-breadcrumb-root-item": "this.isRootItem", "attr.aria-disabled": "this.isDisabled", "class.k-breadcrumb-last-item": "this.isLastItem" } }, ngImport: i0, template: `
|
|
461
461
|
<ng-template #separator>
|
|
462
462
|
<ng-content select="[kendoBreadCrumbSeparator]"></ng-content>
|
|
463
463
|
</ng-template>
|
|
@@ -481,7 +481,6 @@ BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
|
|
|
481
481
|
[attr.aria-disabled]="disabled"
|
|
482
482
|
[attr.aria-current]="item.context.isLast ? 'page' : null"
|
|
483
483
|
role="link"
|
|
484
|
-
class="k-cursor-pointer k-flex-none"
|
|
485
484
|
>
|
|
486
485
|
<img *ngIf="item.data.imageUrl" (load)="onImageLoad()" [src]="item.data.imageUrl" class="k-image" role="presentation" />
|
|
487
486
|
<kendo-icon-wrapper *ngIf="item.data.icon || item.data.iconClass || item.data.svgIcon"
|
|
@@ -490,7 +489,7 @@ BreadCrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
|
|
|
490
489
|
[svgIcon]="item.data.svgIcon"
|
|
491
490
|
>
|
|
492
491
|
</kendo-icon-wrapper>
|
|
493
|
-
{{ item.data.text }}
|
|
492
|
+
<span class="k-breadcrumb-item-text">{{ item.data.text }}</span>
|
|
494
493
|
</span>
|
|
495
494
|
<ng-template
|
|
496
495
|
*ngIf="itemTemplate"
|
|
@@ -535,7 +534,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
535
534
|
[attr.aria-disabled]="disabled"
|
|
536
535
|
[attr.aria-current]="item.context.isLast ? 'page' : null"
|
|
537
536
|
role="link"
|
|
538
|
-
class="k-cursor-pointer k-flex-none"
|
|
539
537
|
>
|
|
540
538
|
<img *ngIf="item.data.imageUrl" (load)="onImageLoad()" [src]="item.data.imageUrl" class="k-image" role="presentation" />
|
|
541
539
|
<kendo-icon-wrapper *ngIf="item.data.icon || item.data.iconClass || item.data.svgIcon"
|
|
@@ -544,7 +542,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
544
542
|
[svgIcon]="item.data.svgIcon"
|
|
545
543
|
>
|
|
546
544
|
</kendo-icon-wrapper>
|
|
547
|
-
{{ item.data.text }}
|
|
545
|
+
<span class="k-breadcrumb-item-text">{{ item.data.text }}</span>
|
|
548
546
|
</span>
|
|
549
547
|
<ng-template
|
|
550
548
|
*ngIf="itemTemplate"
|
|
@@ -570,9 +568,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
570
568
|
}], itemTemplate: [{
|
|
571
569
|
type: Input
|
|
572
570
|
}], hostClasses: [{
|
|
573
|
-
type: HostBinding,
|
|
574
|
-
args: ['class.k-flex-none']
|
|
575
|
-
}, {
|
|
576
571
|
type: HostBinding,
|
|
577
572
|
args: ['class.k-breadcrumb-item']
|
|
578
573
|
}], isRootItem: [{
|
|
@@ -993,7 +988,7 @@ BreadCrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
|
|
|
993
988
|
[separatorIcon]="separatorIcon"
|
|
994
989
|
[separatorSVGIcon]="separatorSVGIcon"
|
|
995
990
|
(itemClick)="itemClick.emit($event)"
|
|
996
|
-
[ngClass]="{ 'k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
991
|
+
[ngClass]="{ '!k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
997
992
|
></ol>
|
|
998
993
|
<kendo-resize-sensor [rateLimit]="1000" #resizeSensor></kendo-resize-sensor>
|
|
999
994
|
`, isInline: true, components: [{ type: BreadCrumbListComponent, selector: "[kendoBreadCrumbList]", inputs: ["items", "itemTemplate", "collapseMode", "separatorIcon", "separatorSVGIcon"], outputs: ["itemClick"] }, { type: i3.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i2.AsyncPipe } });
|
|
@@ -1032,7 +1027,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
1032
1027
|
[separatorIcon]="separatorIcon"
|
|
1033
1028
|
[separatorSVGIcon]="separatorSVGIcon"
|
|
1034
1029
|
(itemClick)="itemClick.emit($event)"
|
|
1035
|
-
[ngClass]="{ 'k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
1030
|
+
[ngClass]="{ '!k-flex-wrap': collapseMode === 'wrap', 'k-flex-none': collapseMode === 'none' }"
|
|
1036
1031
|
></ol>
|
|
1037
1032
|
<kendo-resize-sensor [rateLimit]="1000" #resizeSensor></kendo-resize-sensor>
|
|
1038
1033
|
`
|
|
@@ -1163,12 +1158,6 @@ class BottomNavigationItemComponent {
|
|
|
1163
1158
|
get disabledClass() {
|
|
1164
1159
|
return this.item.disabled;
|
|
1165
1160
|
}
|
|
1166
|
-
get horizontalItemClass() {
|
|
1167
|
-
return this.orientation === 'horizontal';
|
|
1168
|
-
}
|
|
1169
|
-
get verticalItemClass() {
|
|
1170
|
-
return this.orientation === 'vertical';
|
|
1171
|
-
}
|
|
1172
1161
|
get label() {
|
|
1173
1162
|
return this.item.text ? this.item.text : null;
|
|
1174
1163
|
}
|
|
@@ -1188,10 +1177,10 @@ class BottomNavigationItemComponent {
|
|
|
1188
1177
|
}
|
|
1189
1178
|
}
|
|
1190
1179
|
BottomNavigationItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BottomNavigationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1191
|
-
BottomNavigationItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationItemComponent, selector: "[kendoBottomNavigationItem]", inputs: { itemTemplate: "itemTemplate", item: "item", index: "index", disabledComponent: "disabledComponent", selectedIdx: "selectedIdx", orientation: "orientation" }, host: { properties: { "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "
|
|
1180
|
+
BottomNavigationItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationItemComponent, selector: "[kendoBottomNavigationItem]", inputs: { itemTemplate: "itemTemplate", item: "item", index: "index", disabledComponent: "disabledComponent", selectedIdx: "selectedIdx", orientation: "orientation" }, host: { properties: { "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "attr.aria-label": "this.label", "attr.tabindex": "this.tabindex", "attr.aria-current": "this.selectedClass", "class.k-selected": "this.selectedClass" } }, ngImport: i0, template: `
|
|
1192
1181
|
<ng-container *ngIf="!itemTemplate">
|
|
1193
1182
|
<kendo-icon-wrapper *ngIf="itemIcon"
|
|
1194
|
-
|
|
1183
|
+
innerCssClass="k-bottom-nav-item-icon"
|
|
1195
1184
|
[name]="item.icon"
|
|
1196
1185
|
[customFontClass]="item.iconClass"
|
|
1197
1186
|
[svgIcon]="item.svgIcon"></kendo-icon-wrapper>
|
|
@@ -1210,7 +1199,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
1210
1199
|
template: `
|
|
1211
1200
|
<ng-container *ngIf="!itemTemplate">
|
|
1212
1201
|
<kendo-icon-wrapper *ngIf="itemIcon"
|
|
1213
|
-
|
|
1202
|
+
innerCssClass="k-bottom-nav-item-icon"
|
|
1214
1203
|
[name]="item.icon"
|
|
1215
1204
|
[customFontClass]="item.iconClass"
|
|
1216
1205
|
[svgIcon]="item.svgIcon"></kendo-icon-wrapper>
|
|
@@ -1240,12 +1229,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
1240
1229
|
}, {
|
|
1241
1230
|
type: HostBinding,
|
|
1242
1231
|
args: ['class.k-disabled']
|
|
1243
|
-
}], horizontalItemClass: [{
|
|
1244
|
-
type: HostBinding,
|
|
1245
|
-
args: ['class.k-hstack']
|
|
1246
|
-
}], verticalItemClass: [{
|
|
1247
|
-
type: HostBinding,
|
|
1248
|
-
args: ['class.k-vstack']
|
|
1249
1232
|
}], label: [{
|
|
1250
1233
|
type: HostBinding,
|
|
1251
1234
|
args: ['attr.aria-label']
|
|
@@ -1379,8 +1362,10 @@ class BottomNavigationComponent {
|
|
|
1379
1362
|
*/
|
|
1380
1363
|
set fill(fill) {
|
|
1381
1364
|
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this.fill}`);
|
|
1365
|
+
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this.themeColor}`);
|
|
1382
1366
|
this._fill = fill === 'solid' ? 'solid' : 'flat';
|
|
1383
1367
|
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this._fill}`);
|
|
1368
|
+
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this._fill}-${this.themeColor}`);
|
|
1384
1369
|
}
|
|
1385
1370
|
get fill() {
|
|
1386
1371
|
return this._fill;
|
|
@@ -1433,9 +1418,9 @@ class BottomNavigationComponent {
|
|
|
1433
1418
|
set themeColor(themeColor) {
|
|
1434
1419
|
const newColor = colors.find(color => color === themeColor);
|
|
1435
1420
|
if (newColor) {
|
|
1436
|
-
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this._themeColor}`);
|
|
1421
|
+
this.renderer.removeClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this._themeColor}`);
|
|
1437
1422
|
this._themeColor = themeColor;
|
|
1438
|
-
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this._themeColor}`);
|
|
1423
|
+
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this._themeColor}`);
|
|
1439
1424
|
}
|
|
1440
1425
|
}
|
|
1441
1426
|
get themeColor() {
|
|
@@ -1488,7 +1473,7 @@ class BottomNavigationComponent {
|
|
|
1488
1473
|
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.fill}`);
|
|
1489
1474
|
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-item-flow-${this.itemFlow}`);
|
|
1490
1475
|
this.renderer.addClass(this._nativeHostElement, `k-pos-${this.positionMode}`);
|
|
1491
|
-
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.themeColor}`);
|
|
1476
|
+
this.renderer.addClass(this._nativeHostElement, `k-bottom-nav-${this.fill}-${this.themeColor}`);
|
|
1492
1477
|
}
|
|
1493
1478
|
initDomEvents() {
|
|
1494
1479
|
if (!this.hostElement) {
|
|
@@ -1535,7 +1520,7 @@ class BottomNavigationComponent {
|
|
|
1535
1520
|
}
|
|
1536
1521
|
}
|
|
1537
1522
|
BottomNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BottomNavigationComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
1538
|
-
BottomNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationComponent, selector: "kendo-bottomnavigation", inputs: { items: "items", border: "border", disabled: "disabled", fill: "fill", itemFlow: "itemFlow", positionMode: "positionMode", themeColor: "themeColor" }, outputs: { select: "select" }, host: { properties: { "class.k-
|
|
1523
|
+
BottomNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BottomNavigationComponent, selector: "kendo-bottomnavigation", inputs: { items: "items", border: "border", disabled: "disabled", fill: "fill", itemFlow: "itemFlow", positionMode: "positionMode", themeColor: "themeColor" }, outputs: { select: "select" }, host: { properties: { "class.k-bottom-nav": "this.hostClass", "class.k-bottom-nav-border": "this.borderClass", "class.k-disabled": "this.disabledClass", "attr.role": "this.role", "attr.dir": "this.direction" } }, providers: [
|
|
1539
1524
|
LocalizationService,
|
|
1540
1525
|
{
|
|
1541
1526
|
provide: L10N_PREFIX,
|
|
@@ -1590,12 +1575,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
1590
1575
|
}], select: [{
|
|
1591
1576
|
type: Output
|
|
1592
1577
|
}], hostClass: [{
|
|
1593
|
-
type: HostBinding,
|
|
1594
|
-
args: ['class.k-hstack']
|
|
1595
|
-
}, {
|
|
1596
|
-
type: HostBinding,
|
|
1597
|
-
args: ['class.k-justify-content-stretch']
|
|
1598
|
-
}, {
|
|
1599
1578
|
type: HostBinding,
|
|
1600
1579
|
args: ['class.k-bottom-nav']
|
|
1601
1580
|
}], borderClass: [{
|
|
@@ -1994,6 +1973,13 @@ class ActionSheetComponent {
|
|
|
1994
1973
|
* @default false
|
|
1995
1974
|
*/
|
|
1996
1975
|
this.expanded = false;
|
|
1976
|
+
/**
|
|
1977
|
+
* Sets the `aria-labelledby` attribute of the ActionSheet wrapper element.
|
|
1978
|
+
* Use this option when the built-in header element is replaced through the [`ActionSheetHeaderTemplate`]({% slug api_navigation_actionsheetheadertemplatedirective %})
|
|
1979
|
+
* or [`ActionSheetContentTemplate`]({% slug api_navigation_actionsheetcontenttemplatedirective %}).
|
|
1980
|
+
*
|
|
1981
|
+
*/
|
|
1982
|
+
this.titleId = getId('k-actionsheet-title');
|
|
1997
1983
|
/**
|
|
1998
1984
|
* Fires when the `expanded` property of the component is updated.
|
|
1999
1985
|
* Used to provide a two-way binding for the `expanded` property.
|
|
@@ -2015,10 +2001,6 @@ class ActionSheetComponent {
|
|
|
2015
2001
|
* Fires when the modal overlay is clicked.
|
|
2016
2002
|
*/
|
|
2017
2003
|
this.overlayClick = new EventEmitter();
|
|
2018
|
-
/**
|
|
2019
|
-
* @hidden
|
|
2020
|
-
*/
|
|
2021
|
-
this.titleId = null;
|
|
2022
2004
|
this.rtl = false;
|
|
2023
2005
|
this.domSubs = new Subscription();
|
|
2024
2006
|
this.animationEnd = new EventEmitter();
|
|
@@ -2027,7 +2009,6 @@ class ActionSheetComponent {
|
|
|
2027
2009
|
this.rtl = rtl;
|
|
2028
2010
|
this.direction = this.rtl ? 'rtl' : 'ltr';
|
|
2029
2011
|
});
|
|
2030
|
-
this.titleId = getId('k-actionsheet-title');
|
|
2031
2012
|
}
|
|
2032
2013
|
/**
|
|
2033
2014
|
* @hidden
|
|
@@ -2206,7 +2187,7 @@ class ActionSheetComponent {
|
|
|
2206
2187
|
}
|
|
2207
2188
|
}
|
|
2208
2189
|
ActionSheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ActionSheetComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i2$1.AnimationBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2209
|
-
ActionSheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ActionSheetComponent, selector: "kendo-actionsheet", inputs: { title: "title", subtitle: "subtitle", items: "items", cssClass: "cssClass", animation: "animation", expanded: "expanded" }, outputs: { expandedChange: "expandedChange", expand: "expand", collapse: "collapse", itemClick: "itemClick", overlayClick: "overlayClick" }, host: { properties: { "class.k-actionsheet-container": "this.hostClass", "attr.dir": "this.direction" } }, providers: [
|
|
2190
|
+
ActionSheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ActionSheetComponent, 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: [
|
|
2210
2191
|
LocalizationService,
|
|
2211
2192
|
{
|
|
2212
2193
|
provide: L10N_PREFIX,
|
|
@@ -2379,6 +2360,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
|
|
|
2379
2360
|
type: Input
|
|
2380
2361
|
}], expanded: [{
|
|
2381
2362
|
type: Input
|
|
2363
|
+
}], titleId: [{
|
|
2364
|
+
type: Input
|
|
2382
2365
|
}], expandedChange: [{
|
|
2383
2366
|
type: Output
|
|
2384
2367
|
}], expand: [{
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-angular-navigation",
|
|
3
|
-
"version": "12.2.0-develop.
|
|
3
|
+
"version": "12.2.0-develop.3",
|
|
4
4
|
"description": "Kendo UI Navigation for Angular",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
6
6
|
"author": "Progress",
|
|
@@ -21,14 +21,14 @@
|
|
|
21
21
|
"@angular/core": "13 - 16",
|
|
22
22
|
"@angular/platform-browser": "13 - 16",
|
|
23
23
|
"@progress/kendo-licensing": "^1.0.2",
|
|
24
|
-
"@progress/kendo-angular-common": "12.2.0-develop.
|
|
25
|
-
"@progress/kendo-angular-icons": "12.2.0-develop.
|
|
26
|
-
"@progress/kendo-angular-l10n": "12.2.0-develop.
|
|
24
|
+
"@progress/kendo-angular-common": "12.2.0-develop.3",
|
|
25
|
+
"@progress/kendo-angular-icons": "12.2.0-develop.3",
|
|
26
|
+
"@progress/kendo-angular-l10n": "12.2.0-develop.3",
|
|
27
27
|
"rxjs": "^6.5.3 || ^7.0.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
30
|
"tslib": "^2.3.1",
|
|
31
|
-
"@progress/kendo-angular-schematics": "12.2.0-develop.
|
|
31
|
+
"@progress/kendo-angular-schematics": "12.2.0-develop.3"
|
|
32
32
|
},
|
|
33
33
|
"schematics": "./schematics/collection.json",
|
|
34
34
|
"module": "fesm2015/progress-kendo-angular-navigation.mjs",
|