@progress/kendo-angular-common 20.1.2-develop.2 → 21.0.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/esm2022/adornments/prefix.directive.mjs +5 -5
- package/esm2022/adornments/separator.component.mjs +3 -3
- package/esm2022/adornments/suffix.directive.mjs +5 -5
- package/esm2022/draggable/draggable.directive.mjs +4 -4
- package/esm2022/events/events-outside-angular.directive.mjs +4 -4
- package/esm2022/resize-sensor/resize-batch.service.mjs +4 -4
- package/esm2022/resize-sensor/resize-sensor.component.mjs +4 -4
- package/esm2022/template-context/template-context.directive.mjs +4 -4
- package/esm2022/toggle-button-tab-stop/toggle-button-tab-stop.directive.mjs +50 -20
- package/esm2022/utils/html-attributes.mjs +7 -2
- package/esm2022/utils/scrollbar-width.service.mjs +4 -4
- package/esm2022/watermark/watermark.component.mjs +3 -3
- package/fesm2022/progress-kendo-angular-common.mjs +97 -62
- package/package.json +5 -5
|
@@ -37,17 +37,17 @@ export class PrefixTemplateDirective {
|
|
|
37
37
|
constructor(templateRef) {
|
|
38
38
|
this.templateRef = templateRef;
|
|
39
39
|
}
|
|
40
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
41
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
40
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PrefixTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
41
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: PrefixTemplateDirective, isStandalone: true, selector: "[kendoPrefixTemplate]", inputs: { showSeparator: "showSeparator" }, ngImport: i0 });
|
|
42
42
|
}
|
|
43
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
43
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PrefixTemplateDirective, decorators: [{
|
|
44
44
|
type: Directive,
|
|
45
45
|
args: [{
|
|
46
46
|
selector: '[kendoPrefixTemplate]',
|
|
47
47
|
standalone: true
|
|
48
48
|
}]
|
|
49
|
-
}], ctorParameters:
|
|
49
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef, decorators: [{
|
|
50
50
|
type: Optional
|
|
51
|
-
}] }]
|
|
51
|
+
}] }], propDecorators: { showSeparator: [{
|
|
52
52
|
type: Input
|
|
53
53
|
}] } });
|
|
@@ -46,10 +46,10 @@ export class SeparatorComponent {
|
|
|
46
46
|
* @hidden
|
|
47
47
|
*/
|
|
48
48
|
hostClass = true;
|
|
49
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
50
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
49
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
50
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: SeparatorComponent, isStandalone: true, selector: "kendo-separator", inputs: { orientation: "orientation" }, host: { properties: { "class.k-input-separator-vertical": "this.vertical", "class.k-input-separator-horizontal": "this.horizontal", "class.k-input-separator": "this.hostClass" } }, ngImport: i0, template: ``, isInline: true });
|
|
51
51
|
}
|
|
52
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
52
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SeparatorComponent, decorators: [{
|
|
53
53
|
type: Component,
|
|
54
54
|
args: [{
|
|
55
55
|
selector: 'kendo-separator',
|
|
@@ -43,17 +43,17 @@ export class SuffixTemplateDirective {
|
|
|
43
43
|
constructor(templateRef) {
|
|
44
44
|
this.templateRef = templateRef;
|
|
45
45
|
}
|
|
46
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
47
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
46
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SuffixTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
47
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: SuffixTemplateDirective, isStandalone: true, selector: "[kendoSuffixTemplate]", inputs: { showSeparator: "showSeparator" }, ngImport: i0 });
|
|
48
48
|
}
|
|
49
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
49
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SuffixTemplateDirective, decorators: [{
|
|
50
50
|
type: Directive,
|
|
51
51
|
args: [{
|
|
52
52
|
selector: '[kendoSuffixTemplate]',
|
|
53
53
|
standalone: true
|
|
54
54
|
}]
|
|
55
|
-
}], ctorParameters:
|
|
55
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef, decorators: [{
|
|
56
56
|
type: Optional
|
|
57
|
-
}] }]
|
|
57
|
+
}] }], propDecorators: { showSeparator: [{
|
|
58
58
|
type: Input
|
|
59
59
|
}] } });
|
|
@@ -48,16 +48,16 @@ export class DraggableDirective {
|
|
|
48
48
|
this.draggable = undefined;
|
|
49
49
|
}
|
|
50
50
|
}
|
|
51
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
52
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
51
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DraggableDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
|
|
52
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: DraggableDirective, isStandalone: true, selector: "[kendoDraggable]", inputs: { enableDrag: "enableDrag" }, outputs: { kendoPress: "kendoPress", kendoDrag: "kendoDrag", kendoRelease: "kendoRelease" }, usesOnChanges: true, ngImport: i0 });
|
|
53
53
|
}
|
|
54
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
54
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DraggableDirective, decorators: [{
|
|
55
55
|
type: Directive,
|
|
56
56
|
args: [{
|
|
57
57
|
selector: '[kendoDraggable]',
|
|
58
58
|
standalone: true
|
|
59
59
|
}]
|
|
60
|
-
}], ctorParameters:
|
|
60
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { enableDrag: [{
|
|
61
61
|
type: Input
|
|
62
62
|
}], kendoPress: [{
|
|
63
63
|
type: Output
|
|
@@ -41,16 +41,16 @@ export class EventsOutsideAngularDirective {
|
|
|
41
41
|
this.subscriptions = null;
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
45
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
44
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EventsOutsideAngularDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
|
|
45
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: EventsOutsideAngularDirective, isStandalone: true, selector: "[kendoEventsOutsideAngular]", inputs: { events: ["kendoEventsOutsideAngular", "events"], scope: "scope" }, ngImport: i0 });
|
|
46
46
|
}
|
|
47
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
47
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EventsOutsideAngularDirective, decorators: [{
|
|
48
48
|
type: Directive,
|
|
49
49
|
args: [{
|
|
50
50
|
selector: '[kendoEventsOutsideAngular]',
|
|
51
51
|
standalone: true
|
|
52
52
|
}]
|
|
53
|
-
}], ctorParameters:
|
|
53
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.Renderer2 }], propDecorators: { events: [{
|
|
54
54
|
type: Input,
|
|
55
55
|
args: ['kendoEventsOutsideAngular']
|
|
56
56
|
}], scope: [{
|
|
@@ -58,12 +58,12 @@ export class ResizeBatchService {
|
|
|
58
58
|
this.scheduled = [];
|
|
59
59
|
this.unsubscribe();
|
|
60
60
|
}
|
|
61
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
62
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
61
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ResizeBatchService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
62
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ResizeBatchService, providedIn: 'root' });
|
|
63
63
|
}
|
|
64
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
64
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ResizeBatchService, decorators: [{
|
|
65
65
|
type: Injectable,
|
|
66
66
|
args: [{
|
|
67
67
|
providedIn: 'root'
|
|
68
68
|
}]
|
|
69
|
-
}], ctorParameters:
|
|
69
|
+
}], ctorParameters: () => [{ type: i0.NgZone }] });
|
|
@@ -54,17 +54,17 @@ export class ResizeSensorComponent {
|
|
|
54
54
|
acceptSize(size) {
|
|
55
55
|
this.resizeService.acceptSize(size);
|
|
56
56
|
}
|
|
57
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
58
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
57
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ResizeSensorComponent, deps: [{ token: i1.ResizeBatchService }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
|
|
58
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ResizeSensorComponent, isStandalone: true, selector: "kendo-resize-sensor", inputs: { rateLimit: "rateLimit" }, outputs: { resize: "resize" }, ngImport: i0, template: '', isInline: true });
|
|
59
59
|
}
|
|
60
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
60
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ResizeSensorComponent, decorators: [{
|
|
61
61
|
type: Component,
|
|
62
62
|
args: [{
|
|
63
63
|
selector: 'kendo-resize-sensor',
|
|
64
64
|
template: '',
|
|
65
65
|
standalone: true
|
|
66
66
|
}]
|
|
67
|
-
}], ctorParameters:
|
|
67
|
+
}], ctorParameters: () => [{ type: i1.ResizeBatchService }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { rateLimit: [{
|
|
68
68
|
type: Input
|
|
69
69
|
}], resize: [{
|
|
70
70
|
type: Output
|
|
@@ -22,16 +22,16 @@ export class TemplateContextDirective {
|
|
|
22
22
|
constructor(viewContainerRef) {
|
|
23
23
|
this.viewContainerRef = viewContainerRef;
|
|
24
24
|
}
|
|
25
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
26
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
25
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TemplateContextDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
26
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: TemplateContextDirective, isStandalone: true, selector: "[templateContext]", inputs: { templateContext: "templateContext" }, ngImport: i0 });
|
|
27
27
|
}
|
|
28
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
28
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TemplateContextDirective, decorators: [{
|
|
29
29
|
type: Directive,
|
|
30
30
|
args: [{
|
|
31
31
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
32
32
|
selector: '[templateContext]',
|
|
33
33
|
standalone: true
|
|
34
34
|
}]
|
|
35
|
-
}], ctorParameters:
|
|
35
|
+
}], ctorParameters: () => [{ type: i0.ViewContainerRef }], propDecorators: { templateContext: [{
|
|
36
36
|
type: Input
|
|
37
37
|
}] } });
|
|
@@ -107,10 +107,17 @@ export class ToggleButtonTabStopDirective {
|
|
|
107
107
|
return;
|
|
108
108
|
}
|
|
109
109
|
if (changes['active']) {
|
|
110
|
-
changes['active'].currentValue
|
|
110
|
+
if (changes['active'].currentValue) {
|
|
111
|
+
this.activateButton();
|
|
112
|
+
}
|
|
113
|
+
else {
|
|
114
|
+
this.deactivateButton();
|
|
115
|
+
}
|
|
111
116
|
}
|
|
112
117
|
if (changes['toggleButtonAriaLabel']) {
|
|
113
|
-
|
|
118
|
+
if (this.button) {
|
|
119
|
+
this.renderer.setAttribute(this.button, 'aria-label', changes['toggleButtonAriaLabel'].currentValue);
|
|
120
|
+
}
|
|
114
121
|
}
|
|
115
122
|
}
|
|
116
123
|
ngOnDestroy() {
|
|
@@ -121,9 +128,11 @@ export class ToggleButtonTabStopDirective {
|
|
|
121
128
|
const el = this.hostEl.nativeElement;
|
|
122
129
|
const tabindex = el.querySelector('button:not([tabindex^="-"]), input:not([tabindex^="-"])')?.getAttribute('tabindex');
|
|
123
130
|
this.button = el.querySelector('.k-input-button, .k-split-button-arrow');
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
131
|
+
if (this.button) {
|
|
132
|
+
this.renderer.removeAttribute(this.button, 'role');
|
|
133
|
+
this.renderer.setAttribute(this.button, 'tabindex', tabindex);
|
|
134
|
+
this.renderer.setAttribute(this.button, 'aria-label', this.toggleButtonAriaLabel);
|
|
135
|
+
}
|
|
127
136
|
if (!this.observer) {
|
|
128
137
|
this.initializeObserver(el);
|
|
129
138
|
}
|
|
@@ -131,11 +140,15 @@ export class ToggleButtonTabStopDirective {
|
|
|
131
140
|
this.addListeners();
|
|
132
141
|
}
|
|
133
142
|
deactivateButton() {
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
143
|
+
if (this.button) {
|
|
144
|
+
this.renderer.setAttribute(this.button, 'role', 'presentation');
|
|
145
|
+
this.renderer.setAttribute(this.button, 'tabindex', '-1');
|
|
146
|
+
this.renderer.removeAttribute(this.button, 'aria-label');
|
|
147
|
+
}
|
|
137
148
|
this.removeListeners();
|
|
138
|
-
|
|
149
|
+
if (this.observer) {
|
|
150
|
+
this.observer.disconnect();
|
|
151
|
+
}
|
|
139
152
|
this.observer = null;
|
|
140
153
|
}
|
|
141
154
|
onFocus = () => {
|
|
@@ -148,7 +161,9 @@ export class ToggleButtonTabStopDirective {
|
|
|
148
161
|
const code = normalizeNumpadKeys(e);
|
|
149
162
|
const splitButtonToggleEnter = e instanceof KeyboardEvent && code === Keys.Enter;
|
|
150
163
|
const isClick = e instanceof PointerEvent;
|
|
151
|
-
(splitButtonToggleEnter || isClick)
|
|
164
|
+
if (splitButtonToggleEnter || isClick) {
|
|
165
|
+
this.focusButton = true;
|
|
166
|
+
}
|
|
152
167
|
};
|
|
153
168
|
onKeyDown = (e) => {
|
|
154
169
|
const code = normalizeNumpadKeys(e);
|
|
@@ -163,7 +178,9 @@ export class ToggleButtonTabStopDirective {
|
|
|
163
178
|
this.zone.runOutsideAngular(() => this.button.addEventListener('focus', this.onFocus));
|
|
164
179
|
this.zone.runOutsideAngular(() => this.button.addEventListener('blur', this.onBlur));
|
|
165
180
|
this.zone.runOutsideAngular(() => this.button.addEventListener('click', this.onClick));
|
|
166
|
-
this.isSplitButton
|
|
181
|
+
if (this.isSplitButton) {
|
|
182
|
+
this.zone.runOutsideAngular(() => this.button.addEventListener('keyup', this.onClick));
|
|
183
|
+
}
|
|
167
184
|
this.zone.runOutsideAngular(() => this.button.addEventListener('keydown', this.onKeyDown, true));
|
|
168
185
|
}
|
|
169
186
|
}
|
|
@@ -172,12 +189,16 @@ export class ToggleButtonTabStopDirective {
|
|
|
172
189
|
this.zone.runOutsideAngular(() => this.button.removeEventListener('focus', this.onFocus));
|
|
173
190
|
this.zone.runOutsideAngular(() => this.button.removeEventListener('blur', this.onBlur));
|
|
174
191
|
this.zone.runOutsideAngular(() => this.button.removeEventListener('click', this.onClick));
|
|
175
|
-
this.isSplitButton
|
|
192
|
+
if (this.isSplitButton) {
|
|
193
|
+
this.zone.runOutsideAngular(() => this.button.removeEventListener('keyup', this.onClick));
|
|
194
|
+
}
|
|
176
195
|
this.zone.runOutsideAngular(() => this.button.removeEventListener('keydown', this.onKeyDown));
|
|
177
196
|
}
|
|
178
197
|
}
|
|
179
198
|
focusToggleButton() {
|
|
180
|
-
this.focusButton
|
|
199
|
+
if (this.focusButton) {
|
|
200
|
+
this.zone.runOutsideAngular(() => this.button.focus());
|
|
201
|
+
}
|
|
181
202
|
this.focusButton = false;
|
|
182
203
|
}
|
|
183
204
|
returnFocusToToggleButton() {
|
|
@@ -196,8 +217,12 @@ export class ToggleButtonTabStopDirective {
|
|
|
196
217
|
const mainFocusableElement = element.querySelector('.k-split-button > .k-button:first-child, .k-input-inner');
|
|
197
218
|
const initialExpanded = mainFocusableElement.getAttribute('aria-expanded');
|
|
198
219
|
const initialControls = mainFocusableElement.getAttribute('aria-controls');
|
|
199
|
-
|
|
200
|
-
|
|
220
|
+
if (this.button) {
|
|
221
|
+
this.renderer.setAttribute(this.button, 'aria-expanded', initialExpanded);
|
|
222
|
+
if (initialControls) {
|
|
223
|
+
this.renderer.setAttribute(this.button, 'aria-controls', initialControls);
|
|
224
|
+
}
|
|
225
|
+
}
|
|
201
226
|
this.zone.runOutsideAngular(() => {
|
|
202
227
|
const mutationConfig = { attributes: true };
|
|
203
228
|
const callback = (mutationList) => {
|
|
@@ -207,7 +232,12 @@ export class ToggleButtonTabStopDirective {
|
|
|
207
232
|
}
|
|
208
233
|
else if (mutation.attributeName === 'aria-controls') {
|
|
209
234
|
const controlsRef = mainFocusableElement.getAttribute('aria-controls');
|
|
210
|
-
!this.isSplitButton && controlsRef
|
|
235
|
+
if (!this.isSplitButton && controlsRef) {
|
|
236
|
+
this.renderer.setAttribute(this.button, 'aria-controls', controlsRef);
|
|
237
|
+
}
|
|
238
|
+
else {
|
|
239
|
+
this.renderer.removeAttribute(this.button, 'aria-controls');
|
|
240
|
+
}
|
|
211
241
|
}
|
|
212
242
|
}
|
|
213
243
|
};
|
|
@@ -215,16 +245,16 @@ export class ToggleButtonTabStopDirective {
|
|
|
215
245
|
this.observer.observe(mainFocusableElement, mutationConfig);
|
|
216
246
|
});
|
|
217
247
|
}
|
|
218
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
219
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
248
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToggleButtonTabStopDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i1.MultiTabStop }], target: i0.ɵɵFactoryTarget.Directive });
|
|
249
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: ToggleButtonTabStopDirective, isStandalone: true, selector: "[kendoToggleButtonTabStop]", inputs: { active: ["kendoToggleButtonTabStop", "active"], toggleButtonAriaLabel: "toggleButtonAriaLabel" }, usesOnChanges: true, ngImport: i0 });
|
|
220
250
|
}
|
|
221
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
251
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToggleButtonTabStopDirective, decorators: [{
|
|
222
252
|
type: Directive,
|
|
223
253
|
args: [{
|
|
224
254
|
selector: '[kendoToggleButtonTabStop]',
|
|
225
255
|
standalone: true
|
|
226
256
|
}]
|
|
227
|
-
}], ctorParameters:
|
|
257
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i1.MultiTabStop }], propDecorators: { active: [{
|
|
228
258
|
type: Input,
|
|
229
259
|
args: ['kendoToggleButtonTabStop']
|
|
230
260
|
}], toggleButtonAriaLabel: [{
|
|
@@ -8,9 +8,14 @@ import { take } from "rxjs/operators";
|
|
|
8
8
|
* @hidden
|
|
9
9
|
*/
|
|
10
10
|
export const setHTMLAttributes = (attributes, renderer, element, zone) => {
|
|
11
|
-
|
|
11
|
+
if (zone) {
|
|
12
|
+
zone.onStable.pipe(take(1)).subscribe(() => {
|
|
13
|
+
applyAttributes(attributes, renderer, element);
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
else {
|
|
12
17
|
applyAttributes(attributes, renderer, element);
|
|
13
|
-
}
|
|
18
|
+
}
|
|
14
19
|
};
|
|
15
20
|
/**
|
|
16
21
|
* @hidden
|
|
@@ -32,12 +32,12 @@ export class ScrollbarWidthService {
|
|
|
32
32
|
document.body.style.setProperty(propName, `${scrollbarWidth()}px`);
|
|
33
33
|
}
|
|
34
34
|
}
|
|
35
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
36
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
35
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScrollbarWidthService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
36
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScrollbarWidthService, providedIn: 'root' });
|
|
37
37
|
}
|
|
38
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
38
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScrollbarWidthService, decorators: [{
|
|
39
39
|
type: Injectable,
|
|
40
40
|
args: [{
|
|
41
41
|
providedIn: 'root'
|
|
42
42
|
}]
|
|
43
|
-
}], ctorParameters:
|
|
43
|
+
}], ctorParameters: () => [] });
|
|
@@ -42,8 +42,8 @@ export class WatermarkOverlayComponent {
|
|
|
42
42
|
get isBannerRendered() {
|
|
43
43
|
return isDocumentAvailable() && !!this.banner?.nativeElement;
|
|
44
44
|
}
|
|
45
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
46
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
45
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WatermarkOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
46
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: WatermarkOverlayComponent, isStandalone: true, selector: "div[kendoWatermarkOverlay]", inputs: { licenseMessage: "licenseMessage" }, host: { properties: { "style": "this.watermarkStyle" } }, viewQueries: [{ propertyName: "banner", first: true, predicate: ["banner"], descendants: true }], ngImport: i0, template: `
|
|
47
47
|
<div #banner *ngIf="isOpen && bannerMounted" [ngStyle]="bannerStyles">
|
|
48
48
|
<span [ngStyle]="{ display: 'flex', alignSelf: 'center', marginRight: '8px' }">
|
|
49
49
|
<svg width="16" height="16" viewBox="0 0 16 16" fill="none">
|
|
@@ -67,7 +67,7 @@ export class WatermarkOverlayComponent {
|
|
|
67
67
|
</div>
|
|
68
68
|
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
69
69
|
}
|
|
70
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
70
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WatermarkOverlayComponent, decorators: [{
|
|
71
71
|
type: Component,
|
|
72
72
|
args: [{
|
|
73
73
|
selector: 'div[kendoWatermarkOverlay]',
|
|
@@ -155,9 +155,14 @@ const parseArrayClassNames = (value) => {
|
|
|
155
155
|
* @hidden
|
|
156
156
|
*/
|
|
157
157
|
const setHTMLAttributes = (attributes, renderer, element, zone) => {
|
|
158
|
-
|
|
158
|
+
if (zone) {
|
|
159
|
+
zone.onStable.pipe(take(1)).subscribe(() => {
|
|
160
|
+
applyAttributes(attributes, renderer, element);
|
|
161
|
+
});
|
|
162
|
+
}
|
|
163
|
+
else {
|
|
159
164
|
applyAttributes(attributes, renderer, element);
|
|
160
|
-
}
|
|
165
|
+
}
|
|
161
166
|
};
|
|
162
167
|
/**
|
|
163
168
|
* @hidden
|
|
@@ -271,16 +276,16 @@ class DraggableDirective {
|
|
|
271
276
|
this.draggable = undefined;
|
|
272
277
|
}
|
|
273
278
|
}
|
|
274
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
275
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
279
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DraggableDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
|
|
280
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: DraggableDirective, isStandalone: true, selector: "[kendoDraggable]", inputs: { enableDrag: "enableDrag" }, outputs: { kendoPress: "kendoPress", kendoDrag: "kendoDrag", kendoRelease: "kendoRelease" }, usesOnChanges: true, ngImport: i0 });
|
|
276
281
|
}
|
|
277
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
282
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DraggableDirective, decorators: [{
|
|
278
283
|
type: Directive,
|
|
279
284
|
args: [{
|
|
280
285
|
selector: '[kendoDraggable]',
|
|
281
286
|
standalone: true
|
|
282
287
|
}]
|
|
283
|
-
}], ctorParameters:
|
|
288
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { enableDrag: [{
|
|
284
289
|
type: Input
|
|
285
290
|
}], kendoPress: [{
|
|
286
291
|
type: Output
|
|
@@ -456,16 +461,16 @@ class EventsOutsideAngularDirective {
|
|
|
456
461
|
this.subscriptions = null;
|
|
457
462
|
}
|
|
458
463
|
}
|
|
459
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
460
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
464
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EventsOutsideAngularDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
|
|
465
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: EventsOutsideAngularDirective, isStandalone: true, selector: "[kendoEventsOutsideAngular]", inputs: { events: ["kendoEventsOutsideAngular", "events"], scope: "scope" }, ngImport: i0 });
|
|
461
466
|
}
|
|
462
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
467
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EventsOutsideAngularDirective, decorators: [{
|
|
463
468
|
type: Directive,
|
|
464
469
|
args: [{
|
|
465
470
|
selector: '[kendoEventsOutsideAngular]',
|
|
466
471
|
standalone: true
|
|
467
472
|
}]
|
|
468
|
-
}], ctorParameters:
|
|
473
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.Renderer2 }], propDecorators: { events: [{
|
|
469
474
|
type: Input,
|
|
470
475
|
args: ['kendoEventsOutsideAngular']
|
|
471
476
|
}], scope: [{
|
|
@@ -720,15 +725,15 @@ class ResizeBatchService {
|
|
|
720
725
|
this.scheduled = [];
|
|
721
726
|
this.unsubscribe();
|
|
722
727
|
}
|
|
723
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
724
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
728
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ResizeBatchService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
729
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ResizeBatchService, providedIn: 'root' });
|
|
725
730
|
}
|
|
726
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
731
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ResizeBatchService, decorators: [{
|
|
727
732
|
type: Injectable,
|
|
728
733
|
args: [{
|
|
729
734
|
providedIn: 'root'
|
|
730
735
|
}]
|
|
731
|
-
}], ctorParameters:
|
|
736
|
+
}], ctorParameters: () => [{ type: i0.NgZone }] });
|
|
732
737
|
|
|
733
738
|
/**
|
|
734
739
|
* Emit up to 10 resize events per second by default.
|
|
@@ -775,17 +780,17 @@ class ResizeSensorComponent {
|
|
|
775
780
|
acceptSize(size) {
|
|
776
781
|
this.resizeService.acceptSize(size);
|
|
777
782
|
}
|
|
778
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
779
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
783
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ResizeSensorComponent, deps: [{ token: ResizeBatchService }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
|
|
784
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ResizeSensorComponent, isStandalone: true, selector: "kendo-resize-sensor", inputs: { rateLimit: "rateLimit" }, outputs: { resize: "resize" }, ngImport: i0, template: '', isInline: true });
|
|
780
785
|
}
|
|
781
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
786
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ResizeSensorComponent, decorators: [{
|
|
782
787
|
type: Component,
|
|
783
788
|
args: [{
|
|
784
789
|
selector: 'kendo-resize-sensor',
|
|
785
790
|
template: '',
|
|
786
791
|
standalone: true
|
|
787
792
|
}]
|
|
788
|
-
}], ctorParameters:
|
|
793
|
+
}], ctorParameters: () => [{ type: ResizeBatchService }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { rateLimit: [{
|
|
789
794
|
type: Input
|
|
790
795
|
}], resize: [{
|
|
791
796
|
type: Output
|
|
@@ -1058,8 +1063,8 @@ class WatermarkOverlayComponent {
|
|
|
1058
1063
|
get isBannerRendered() {
|
|
1059
1064
|
return isDocumentAvailable() && !!this.banner?.nativeElement;
|
|
1060
1065
|
}
|
|
1061
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1062
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1066
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WatermarkOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1067
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: WatermarkOverlayComponent, isStandalone: true, selector: "div[kendoWatermarkOverlay]", inputs: { licenseMessage: "licenseMessage" }, host: { properties: { "style": "this.watermarkStyle" } }, viewQueries: [{ propertyName: "banner", first: true, predicate: ["banner"], descendants: true }], ngImport: i0, template: `
|
|
1063
1068
|
<div #banner *ngIf="isOpen && bannerMounted" [ngStyle]="bannerStyles">
|
|
1064
1069
|
<span [ngStyle]="{ display: 'flex', alignSelf: 'center', marginRight: '8px' }">
|
|
1065
1070
|
<svg width="16" height="16" viewBox="0 0 16 16" fill="none">
|
|
@@ -1083,7 +1088,7 @@ class WatermarkOverlayComponent {
|
|
|
1083
1088
|
</div>
|
|
1084
1089
|
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
1085
1090
|
}
|
|
1086
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1091
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WatermarkOverlayComponent, decorators: [{
|
|
1087
1092
|
type: Component,
|
|
1088
1093
|
args: [{
|
|
1089
1094
|
selector: 'div[kendoWatermarkOverlay]',
|
|
@@ -1174,18 +1179,18 @@ class PrefixTemplateDirective {
|
|
|
1174
1179
|
constructor(templateRef) {
|
|
1175
1180
|
this.templateRef = templateRef;
|
|
1176
1181
|
}
|
|
1177
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1178
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1182
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PrefixTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1183
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: PrefixTemplateDirective, isStandalone: true, selector: "[kendoPrefixTemplate]", inputs: { showSeparator: "showSeparator" }, ngImport: i0 });
|
|
1179
1184
|
}
|
|
1180
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1185
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PrefixTemplateDirective, decorators: [{
|
|
1181
1186
|
type: Directive,
|
|
1182
1187
|
args: [{
|
|
1183
1188
|
selector: '[kendoPrefixTemplate]',
|
|
1184
1189
|
standalone: true
|
|
1185
1190
|
}]
|
|
1186
|
-
}], ctorParameters:
|
|
1191
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef, decorators: [{
|
|
1187
1192
|
type: Optional
|
|
1188
|
-
}] }]
|
|
1193
|
+
}] }], propDecorators: { showSeparator: [{
|
|
1189
1194
|
type: Input
|
|
1190
1195
|
}] } });
|
|
1191
1196
|
|
|
@@ -1228,18 +1233,18 @@ class SuffixTemplateDirective {
|
|
|
1228
1233
|
constructor(templateRef) {
|
|
1229
1234
|
this.templateRef = templateRef;
|
|
1230
1235
|
}
|
|
1231
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1232
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1236
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SuffixTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1237
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: SuffixTemplateDirective, isStandalone: true, selector: "[kendoSuffixTemplate]", inputs: { showSeparator: "showSeparator" }, ngImport: i0 });
|
|
1233
1238
|
}
|
|
1234
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1239
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SuffixTemplateDirective, decorators: [{
|
|
1235
1240
|
type: Directive,
|
|
1236
1241
|
args: [{
|
|
1237
1242
|
selector: '[kendoSuffixTemplate]',
|
|
1238
1243
|
standalone: true
|
|
1239
1244
|
}]
|
|
1240
|
-
}], ctorParameters:
|
|
1245
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef, decorators: [{
|
|
1241
1246
|
type: Optional
|
|
1242
|
-
}] }]
|
|
1247
|
+
}] }], propDecorators: { showSeparator: [{
|
|
1243
1248
|
type: Input
|
|
1244
1249
|
}] } });
|
|
1245
1250
|
|
|
@@ -1285,10 +1290,10 @@ class SeparatorComponent {
|
|
|
1285
1290
|
* @hidden
|
|
1286
1291
|
*/
|
|
1287
1292
|
hostClass = true;
|
|
1288
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1289
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1293
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1294
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: SeparatorComponent, isStandalone: true, selector: "kendo-separator", inputs: { orientation: "orientation" }, host: { properties: { "class.k-input-separator-vertical": "this.vertical", "class.k-input-separator-horizontal": "this.horizontal", "class.k-input-separator": "this.hostClass" } }, ngImport: i0, template: ``, isInline: true });
|
|
1290
1295
|
}
|
|
1291
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1296
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SeparatorComponent, decorators: [{
|
|
1292
1297
|
type: Component,
|
|
1293
1298
|
args: [{
|
|
1294
1299
|
selector: 'kendo-separator',
|
|
@@ -1354,15 +1359,15 @@ class ScrollbarWidthService {
|
|
|
1354
1359
|
document.body.style.setProperty(propName, `${scrollbarWidth()}px`);
|
|
1355
1360
|
}
|
|
1356
1361
|
}
|
|
1357
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1358
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1362
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScrollbarWidthService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1363
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScrollbarWidthService, providedIn: 'root' });
|
|
1359
1364
|
}
|
|
1360
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1365
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ScrollbarWidthService, decorators: [{
|
|
1361
1366
|
type: Injectable,
|
|
1362
1367
|
args: [{
|
|
1363
1368
|
providedIn: 'root'
|
|
1364
1369
|
}]
|
|
1365
|
-
}], ctorParameters:
|
|
1370
|
+
}], ctorParameters: () => [] });
|
|
1366
1371
|
|
|
1367
1372
|
/**
|
|
1368
1373
|
* @hidden
|
|
@@ -1467,10 +1472,17 @@ class ToggleButtonTabStopDirective {
|
|
|
1467
1472
|
return;
|
|
1468
1473
|
}
|
|
1469
1474
|
if (changes['active']) {
|
|
1470
|
-
changes['active'].currentValue
|
|
1475
|
+
if (changes['active'].currentValue) {
|
|
1476
|
+
this.activateButton();
|
|
1477
|
+
}
|
|
1478
|
+
else {
|
|
1479
|
+
this.deactivateButton();
|
|
1480
|
+
}
|
|
1471
1481
|
}
|
|
1472
1482
|
if (changes['toggleButtonAriaLabel']) {
|
|
1473
|
-
|
|
1483
|
+
if (this.button) {
|
|
1484
|
+
this.renderer.setAttribute(this.button, 'aria-label', changes['toggleButtonAriaLabel'].currentValue);
|
|
1485
|
+
}
|
|
1474
1486
|
}
|
|
1475
1487
|
}
|
|
1476
1488
|
ngOnDestroy() {
|
|
@@ -1481,9 +1493,11 @@ class ToggleButtonTabStopDirective {
|
|
|
1481
1493
|
const el = this.hostEl.nativeElement;
|
|
1482
1494
|
const tabindex = el.querySelector('button:not([tabindex^="-"]), input:not([tabindex^="-"])')?.getAttribute('tabindex');
|
|
1483
1495
|
this.button = el.querySelector('.k-input-button, .k-split-button-arrow');
|
|
1484
|
-
|
|
1485
|
-
|
|
1486
|
-
|
|
1496
|
+
if (this.button) {
|
|
1497
|
+
this.renderer.removeAttribute(this.button, 'role');
|
|
1498
|
+
this.renderer.setAttribute(this.button, 'tabindex', tabindex);
|
|
1499
|
+
this.renderer.setAttribute(this.button, 'aria-label', this.toggleButtonAriaLabel);
|
|
1500
|
+
}
|
|
1487
1501
|
if (!this.observer) {
|
|
1488
1502
|
this.initializeObserver(el);
|
|
1489
1503
|
}
|
|
@@ -1491,11 +1505,15 @@ class ToggleButtonTabStopDirective {
|
|
|
1491
1505
|
this.addListeners();
|
|
1492
1506
|
}
|
|
1493
1507
|
deactivateButton() {
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1508
|
+
if (this.button) {
|
|
1509
|
+
this.renderer.setAttribute(this.button, 'role', 'presentation');
|
|
1510
|
+
this.renderer.setAttribute(this.button, 'tabindex', '-1');
|
|
1511
|
+
this.renderer.removeAttribute(this.button, 'aria-label');
|
|
1512
|
+
}
|
|
1497
1513
|
this.removeListeners();
|
|
1498
|
-
|
|
1514
|
+
if (this.observer) {
|
|
1515
|
+
this.observer.disconnect();
|
|
1516
|
+
}
|
|
1499
1517
|
this.observer = null;
|
|
1500
1518
|
}
|
|
1501
1519
|
onFocus = () => {
|
|
@@ -1508,7 +1526,9 @@ class ToggleButtonTabStopDirective {
|
|
|
1508
1526
|
const code = normalizeNumpadKeys(e);
|
|
1509
1527
|
const splitButtonToggleEnter = e instanceof KeyboardEvent && code === Keys.Enter;
|
|
1510
1528
|
const isClick = e instanceof PointerEvent;
|
|
1511
|
-
(splitButtonToggleEnter || isClick)
|
|
1529
|
+
if (splitButtonToggleEnter || isClick) {
|
|
1530
|
+
this.focusButton = true;
|
|
1531
|
+
}
|
|
1512
1532
|
};
|
|
1513
1533
|
onKeyDown = (e) => {
|
|
1514
1534
|
const code = normalizeNumpadKeys(e);
|
|
@@ -1523,7 +1543,9 @@ class ToggleButtonTabStopDirective {
|
|
|
1523
1543
|
this.zone.runOutsideAngular(() => this.button.addEventListener('focus', this.onFocus));
|
|
1524
1544
|
this.zone.runOutsideAngular(() => this.button.addEventListener('blur', this.onBlur));
|
|
1525
1545
|
this.zone.runOutsideAngular(() => this.button.addEventListener('click', this.onClick));
|
|
1526
|
-
this.isSplitButton
|
|
1546
|
+
if (this.isSplitButton) {
|
|
1547
|
+
this.zone.runOutsideAngular(() => this.button.addEventListener('keyup', this.onClick));
|
|
1548
|
+
}
|
|
1527
1549
|
this.zone.runOutsideAngular(() => this.button.addEventListener('keydown', this.onKeyDown, true));
|
|
1528
1550
|
}
|
|
1529
1551
|
}
|
|
@@ -1532,12 +1554,16 @@ class ToggleButtonTabStopDirective {
|
|
|
1532
1554
|
this.zone.runOutsideAngular(() => this.button.removeEventListener('focus', this.onFocus));
|
|
1533
1555
|
this.zone.runOutsideAngular(() => this.button.removeEventListener('blur', this.onBlur));
|
|
1534
1556
|
this.zone.runOutsideAngular(() => this.button.removeEventListener('click', this.onClick));
|
|
1535
|
-
this.isSplitButton
|
|
1557
|
+
if (this.isSplitButton) {
|
|
1558
|
+
this.zone.runOutsideAngular(() => this.button.removeEventListener('keyup', this.onClick));
|
|
1559
|
+
}
|
|
1536
1560
|
this.zone.runOutsideAngular(() => this.button.removeEventListener('keydown', this.onKeyDown));
|
|
1537
1561
|
}
|
|
1538
1562
|
}
|
|
1539
1563
|
focusToggleButton() {
|
|
1540
|
-
this.focusButton
|
|
1564
|
+
if (this.focusButton) {
|
|
1565
|
+
this.zone.runOutsideAngular(() => this.button.focus());
|
|
1566
|
+
}
|
|
1541
1567
|
this.focusButton = false;
|
|
1542
1568
|
}
|
|
1543
1569
|
returnFocusToToggleButton() {
|
|
@@ -1556,8 +1582,12 @@ class ToggleButtonTabStopDirective {
|
|
|
1556
1582
|
const mainFocusableElement = element.querySelector('.k-split-button > .k-button:first-child, .k-input-inner');
|
|
1557
1583
|
const initialExpanded = mainFocusableElement.getAttribute('aria-expanded');
|
|
1558
1584
|
const initialControls = mainFocusableElement.getAttribute('aria-controls');
|
|
1559
|
-
|
|
1560
|
-
|
|
1585
|
+
if (this.button) {
|
|
1586
|
+
this.renderer.setAttribute(this.button, 'aria-expanded', initialExpanded);
|
|
1587
|
+
if (initialControls) {
|
|
1588
|
+
this.renderer.setAttribute(this.button, 'aria-controls', initialControls);
|
|
1589
|
+
}
|
|
1590
|
+
}
|
|
1561
1591
|
this.zone.runOutsideAngular(() => {
|
|
1562
1592
|
const mutationConfig = { attributes: true };
|
|
1563
1593
|
const callback = (mutationList) => {
|
|
@@ -1567,7 +1597,12 @@ class ToggleButtonTabStopDirective {
|
|
|
1567
1597
|
}
|
|
1568
1598
|
else if (mutation.attributeName === 'aria-controls') {
|
|
1569
1599
|
const controlsRef = mainFocusableElement.getAttribute('aria-controls');
|
|
1570
|
-
!this.isSplitButton && controlsRef
|
|
1600
|
+
if (!this.isSplitButton && controlsRef) {
|
|
1601
|
+
this.renderer.setAttribute(this.button, 'aria-controls', controlsRef);
|
|
1602
|
+
}
|
|
1603
|
+
else {
|
|
1604
|
+
this.renderer.removeAttribute(this.button, 'aria-controls');
|
|
1605
|
+
}
|
|
1571
1606
|
}
|
|
1572
1607
|
}
|
|
1573
1608
|
};
|
|
@@ -1575,16 +1610,16 @@ class ToggleButtonTabStopDirective {
|
|
|
1575
1610
|
this.observer.observe(mainFocusableElement, mutationConfig);
|
|
1576
1611
|
});
|
|
1577
1612
|
}
|
|
1578
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1579
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1613
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToggleButtonTabStopDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: MultiTabStop }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1614
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: ToggleButtonTabStopDirective, isStandalone: true, selector: "[kendoToggleButtonTabStop]", inputs: { active: ["kendoToggleButtonTabStop", "active"], toggleButtonAriaLabel: "toggleButtonAriaLabel" }, usesOnChanges: true, ngImport: i0 });
|
|
1580
1615
|
}
|
|
1581
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1616
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ToggleButtonTabStopDirective, decorators: [{
|
|
1582
1617
|
type: Directive,
|
|
1583
1618
|
args: [{
|
|
1584
1619
|
selector: '[kendoToggleButtonTabStop]',
|
|
1585
1620
|
standalone: true
|
|
1586
1621
|
}]
|
|
1587
|
-
}], ctorParameters:
|
|
1622
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: MultiTabStop }], propDecorators: { active: [{
|
|
1588
1623
|
type: Input,
|
|
1589
1624
|
args: ['kendoToggleButtonTabStop']
|
|
1590
1625
|
}], toggleButtonAriaLabel: [{
|
|
@@ -1609,17 +1644,17 @@ class TemplateContextDirective {
|
|
|
1609
1644
|
constructor(viewContainerRef) {
|
|
1610
1645
|
this.viewContainerRef = viewContainerRef;
|
|
1611
1646
|
}
|
|
1612
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1613
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1647
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TemplateContextDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1648
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: TemplateContextDirective, isStandalone: true, selector: "[templateContext]", inputs: { templateContext: "templateContext" }, ngImport: i0 });
|
|
1614
1649
|
}
|
|
1615
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1650
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TemplateContextDirective, decorators: [{
|
|
1616
1651
|
type: Directive,
|
|
1617
1652
|
args: [{
|
|
1618
1653
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
1619
1654
|
selector: '[templateContext]',
|
|
1620
1655
|
standalone: true
|
|
1621
1656
|
}]
|
|
1622
|
-
}], ctorParameters:
|
|
1657
|
+
}], ctorParameters: () => [{ type: i0.ViewContainerRef }], propDecorators: { templateContext: [{
|
|
1623
1658
|
type: Input
|
|
1624
1659
|
}] } });
|
|
1625
1660
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-angular-common",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "21.0.0-develop.3",
|
|
4
4
|
"description": "Kendo UI for Angular - Utility Package",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
6
6
|
"author": "Progress",
|
|
@@ -14,16 +14,16 @@
|
|
|
14
14
|
"Progress"
|
|
15
15
|
],
|
|
16
16
|
"peerDependencies": {
|
|
17
|
-
"@angular/animations": "
|
|
18
|
-
"@angular/common": "
|
|
19
|
-
"@angular/core": "
|
|
17
|
+
"@angular/animations": "18 - 20",
|
|
18
|
+
"@angular/common": "18 - 20",
|
|
19
|
+
"@angular/core": "18 - 20",
|
|
20
20
|
"rxjs": "^6.5.3 || ^7.0.0"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"@progress/kendo-common": "^1.0.1",
|
|
24
24
|
"@progress/kendo-draggable": "^3.0.2",
|
|
25
25
|
"tslib": "^2.3.1",
|
|
26
|
-
"@progress/kendo-angular-schematics": "
|
|
26
|
+
"@progress/kendo-angular-schematics": "21.0.0-develop.3"
|
|
27
27
|
},
|
|
28
28
|
"publishConfig": {
|
|
29
29
|
"access": "public"
|