@progress/kendo-angular-buttons 20.1.0-develop.9 → 20.1.1-develop.1

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.
@@ -10,7 +10,7 @@ export const packageMetadata = {
10
10
  productName: 'Kendo UI for Angular',
11
11
  productCode: 'KENDOUIANGULAR',
12
12
  productCodes: ['KENDOUIANGULAR'],
13
- publishDate: 1759490600,
14
- version: '20.1.0-develop.9',
13
+ publishDate: 1761222610,
14
+ version: '20.1.1-develop.1',
15
15
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
16
16
  };
@@ -30,8 +30,12 @@ export class Messages extends ComponentMessages {
30
30
  * ```
31
31
  */
32
32
  splitButtonLabel;
33
+ /**
34
+ * Specifies the text for the SplitButton toggle button `aria-label`.
35
+ */
36
+ toggleButtonLabel;
33
37
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
34
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: Messages, selector: "kendo-splitbutton-messages-base", inputs: { splitButtonLabel: "splitButtonLabel" }, usesInheritance: true, ngImport: i0 });
38
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: Messages, selector: "kendo-splitbutton-messages-base", inputs: { splitButtonLabel: "splitButtonLabel", toggleButtonLabel: "toggleButtonLabel" }, usesInheritance: true, ngImport: i0 });
35
39
  }
36
40
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: Messages, decorators: [{
37
41
  type: Directive,
@@ -41,4 +45,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
41
45
  }]
42
46
  }], propDecorators: { splitButtonLabel: [{
43
47
  type: Input
48
+ }], toggleButtonLabel: [{
49
+ type: Input
44
50
  }] } });
@@ -263,9 +263,15 @@ export class SplitButtonComponent extends ListButton {
263
263
  * @hidden
264
264
  */
265
265
  get ariaLabel() {
266
- const localizationMsg = this.localization.get('splitButtonLabel') || '';
266
+ const localizationMsg = this.messageFor('splitButtonLabel') || '';
267
267
  return replaceMessagePlaceholder(localizationMsg, 'buttonText', this.buttonText);
268
268
  }
269
+ /**
270
+ * @hidden
271
+ */
272
+ messageFor(key) {
273
+ return this.localization.get(key);
274
+ }
269
275
  /**
270
276
  * @hidden
271
277
  */
@@ -336,19 +342,15 @@ export class SplitButtonComponent extends ListButton {
336
342
  this.keyUpHandler(event);
337
343
  }
338
344
  }
339
- /**
340
- * @hidden
341
- */
345
+ ngDoCheck() {
346
+ this.updateButtonText();
347
+ }
342
348
  ngAfterViewInit() {
343
349
  this.containerService.container = this.container;
344
350
  this.containerService.template = this.popupTemplate;
345
- this.updateButtonText();
346
351
  this.handleClasses(this.rounded, 'rounded');
347
352
  this.handleButtonAttributes(this.buttonAttributes);
348
353
  }
349
- /**
350
- * @hidden
351
- */
352
354
  ngOnChanges(changes) {
353
355
  if (changes.hasOwnProperty('text')) {
354
356
  this.updateButtonText();
@@ -466,12 +468,13 @@ export class SplitButtonComponent extends ListButton {
466
468
  }
467
469
  updateButtonText() {
468
470
  if (isDocumentAvailable()) {
469
- const innerText = this.wrapper.innerText
471
+ const innerText = this.wrapper?.innerText
470
472
  .split('\n')
471
473
  .join('')
472
474
  .trim();
473
- //setTimeout is needed because of `Expression has changed after it was checked.` error;
474
- setTimeout(() => (this.buttonText = innerText), 0);
475
+ if (innerText !== this.buttonText) {
476
+ this.buttonText = innerText;
477
+ }
475
478
  }
476
479
  }
477
480
  handleClasses(value, input) {
@@ -488,7 +491,7 @@ export class SplitButtonComponent extends ListButton {
488
491
  this.button.nativeElement.classList[this.isIconButton ? 'add' : 'remove']('k-button-icon');
489
492
  }
490
493
  handleButtonAttributes(newButtonAttributes) {
491
- const mainButton = this.button.nativeElement;
494
+ const mainButton = this.button?.nativeElement;
492
495
  if (isPresent(this.buttonAttributes) && isPresent(mainButton)) {
493
496
  for (const attr in this.buttonAttributes) {
494
497
  this.renderer.removeAttribute(mainButton, attr, this.buttonAttributes[attr]);
@@ -519,8 +522,9 @@ export class SplitButtonComponent extends ListButton {
519
522
  <ng-container kendoSplitButtonLocalizedMessages
520
523
  i18n-splitButtonLabel="kendo.splitbutton.splitButtonLabel|The text for the SplitButton aria-label"
521
524
  splitButtonLabel="{{ '{buttonText} splitbutton' }}"
522
- >
523
- </ng-container>
525
+ i18n-toggleButtonLabel="kendo.splitbutton.toggleButtonLabel|The text for the SplitButton toggle button aria-label"
526
+ toggleButtonLabel="Toggle options"
527
+ ></ng-container>
524
528
  <button
525
529
  kendoButton
526
530
  #button
@@ -561,7 +565,7 @@ export class SplitButtonComponent extends ListButton {
561
565
  [fillMode]="fillMode"
562
566
  [themeColor]="themeColor"
563
567
  [tabindex]="-1"
564
- aria-hidden="true"
568
+ [attr.aria-label]="messageFor('toggleButtonLabel')"
565
569
  (click)="onArrowButtonClick()"
566
570
  (mousedown)="toggleArrowButtonActiveState(true)"
567
571
  (mouseup)="toggleArrowButtonActiveState(false)"
@@ -608,8 +612,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
608
612
  <ng-container kendoSplitButtonLocalizedMessages
609
613
  i18n-splitButtonLabel="kendo.splitbutton.splitButtonLabel|The text for the SplitButton aria-label"
610
614
  splitButtonLabel="{{ '{buttonText} splitbutton' }}"
611
- >
612
- </ng-container>
615
+ i18n-toggleButtonLabel="kendo.splitbutton.toggleButtonLabel|The text for the SplitButton toggle button aria-label"
616
+ toggleButtonLabel="Toggle options"
617
+ ></ng-container>
613
618
  <button
614
619
  kendoButton
615
620
  #button
@@ -650,7 +655,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
650
655
  [fillMode]="fillMode"
651
656
  [themeColor]="themeColor"
652
657
  [tabindex]="-1"
653
- aria-hidden="true"
658
+ [attr.aria-label]="messageFor('toggleButtonLabel')"
654
659
  (click)="onArrowButtonClick()"
655
660
  (mousedown)="toggleArrowButtonActiveState(true)"
656
661
  (mouseup)="toggleArrowButtonActiveState(false)"
@@ -45,8 +45,8 @@ const packageMetadata = {
45
45
  productName: 'Kendo UI for Angular',
46
46
  productCode: 'KENDOUIANGULAR',
47
47
  productCodes: ['KENDOUIANGULAR'],
48
- publishDate: 1759490600,
49
- version: '20.1.0-develop.9',
48
+ publishDate: 1761222610,
49
+ version: '20.1.1-develop.1',
50
50
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
51
51
  };
52
52
 
@@ -4517,8 +4517,12 @@ class Messages extends ComponentMessages {
4517
4517
  * ```
4518
4518
  */
4519
4519
  splitButtonLabel;
4520
+ /**
4521
+ * Specifies the text for the SplitButton toggle button `aria-label`.
4522
+ */
4523
+ toggleButtonLabel;
4520
4524
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
4521
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: Messages, selector: "kendo-splitbutton-messages-base", inputs: { splitButtonLabel: "splitButtonLabel" }, usesInheritance: true, ngImport: i0 });
4525
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: Messages, selector: "kendo-splitbutton-messages-base", inputs: { splitButtonLabel: "splitButtonLabel", toggleButtonLabel: "toggleButtonLabel" }, usesInheritance: true, ngImport: i0 });
4522
4526
  }
4523
4527
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: Messages, decorators: [{
4524
4528
  type: Directive,
@@ -4528,6 +4532,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
4528
4532
  }]
4529
4533
  }], propDecorators: { splitButtonLabel: [{
4530
4534
  type: Input
4535
+ }], toggleButtonLabel: [{
4536
+ type: Input
4531
4537
  }] } });
4532
4538
 
4533
4539
  /**
@@ -4830,9 +4836,15 @@ class SplitButtonComponent extends ListButton {
4830
4836
  * @hidden
4831
4837
  */
4832
4838
  get ariaLabel() {
4833
- const localizationMsg = this.localization.get('splitButtonLabel') || '';
4839
+ const localizationMsg = this.messageFor('splitButtonLabel') || '';
4834
4840
  return replaceMessagePlaceholder(localizationMsg, 'buttonText', this.buttonText);
4835
4841
  }
4842
+ /**
4843
+ * @hidden
4844
+ */
4845
+ messageFor(key) {
4846
+ return this.localization.get(key);
4847
+ }
4836
4848
  /**
4837
4849
  * @hidden
4838
4850
  */
@@ -4903,19 +4915,15 @@ class SplitButtonComponent extends ListButton {
4903
4915
  this.keyUpHandler(event);
4904
4916
  }
4905
4917
  }
4906
- /**
4907
- * @hidden
4908
- */
4918
+ ngDoCheck() {
4919
+ this.updateButtonText();
4920
+ }
4909
4921
  ngAfterViewInit() {
4910
4922
  this.containerService.container = this.container;
4911
4923
  this.containerService.template = this.popupTemplate;
4912
- this.updateButtonText();
4913
4924
  this.handleClasses(this.rounded, 'rounded');
4914
4925
  this.handleButtonAttributes(this.buttonAttributes);
4915
4926
  }
4916
- /**
4917
- * @hidden
4918
- */
4919
4927
  ngOnChanges(changes) {
4920
4928
  if (changes.hasOwnProperty('text')) {
4921
4929
  this.updateButtonText();
@@ -5033,12 +5041,13 @@ class SplitButtonComponent extends ListButton {
5033
5041
  }
5034
5042
  updateButtonText() {
5035
5043
  if (isDocumentAvailable()) {
5036
- const innerText = this.wrapper.innerText
5044
+ const innerText = this.wrapper?.innerText
5037
5045
  .split('\n')
5038
5046
  .join('')
5039
5047
  .trim();
5040
- //setTimeout is needed because of `Expression has changed after it was checked.` error;
5041
- setTimeout(() => (this.buttonText = innerText), 0);
5048
+ if (innerText !== this.buttonText) {
5049
+ this.buttonText = innerText;
5050
+ }
5042
5051
  }
5043
5052
  }
5044
5053
  handleClasses(value, input) {
@@ -5055,7 +5064,7 @@ class SplitButtonComponent extends ListButton {
5055
5064
  this.button.nativeElement.classList[this.isIconButton ? 'add' : 'remove']('k-button-icon');
5056
5065
  }
5057
5066
  handleButtonAttributes(newButtonAttributes) {
5058
- const mainButton = this.button.nativeElement;
5067
+ const mainButton = this.button?.nativeElement;
5059
5068
  if (isPresent(this.buttonAttributes) && isPresent(mainButton)) {
5060
5069
  for (const attr in this.buttonAttributes) {
5061
5070
  this.renderer.removeAttribute(mainButton, attr, this.buttonAttributes[attr]);
@@ -5086,8 +5095,9 @@ class SplitButtonComponent extends ListButton {
5086
5095
  <ng-container kendoSplitButtonLocalizedMessages
5087
5096
  i18n-splitButtonLabel="kendo.splitbutton.splitButtonLabel|The text for the SplitButton aria-label"
5088
5097
  splitButtonLabel="{{ '{buttonText} splitbutton' }}"
5089
- >
5090
- </ng-container>
5098
+ i18n-toggleButtonLabel="kendo.splitbutton.toggleButtonLabel|The text for the SplitButton toggle button aria-label"
5099
+ toggleButtonLabel="Toggle options"
5100
+ ></ng-container>
5091
5101
  <button
5092
5102
  kendoButton
5093
5103
  #button
@@ -5128,7 +5138,7 @@ class SplitButtonComponent extends ListButton {
5128
5138
  [fillMode]="fillMode"
5129
5139
  [themeColor]="themeColor"
5130
5140
  [tabindex]="-1"
5131
- aria-hidden="true"
5141
+ [attr.aria-label]="messageFor('toggleButtonLabel')"
5132
5142
  (click)="onArrowButtonClick()"
5133
5143
  (mousedown)="toggleArrowButtonActiveState(true)"
5134
5144
  (mouseup)="toggleArrowButtonActiveState(false)"
@@ -5175,8 +5185,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
5175
5185
  <ng-container kendoSplitButtonLocalizedMessages
5176
5186
  i18n-splitButtonLabel="kendo.splitbutton.splitButtonLabel|The text for the SplitButton aria-label"
5177
5187
  splitButtonLabel="{{ '{buttonText} splitbutton' }}"
5178
- >
5179
- </ng-container>
5188
+ i18n-toggleButtonLabel="kendo.splitbutton.toggleButtonLabel|The text for the SplitButton toggle button aria-label"
5189
+ toggleButtonLabel="Toggle options"
5190
+ ></ng-container>
5180
5191
  <button
5181
5192
  kendoButton
5182
5193
  #button
@@ -5217,7 +5228,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
5217
5228
  [fillMode]="fillMode"
5218
5229
  [themeColor]="themeColor"
5219
5230
  [tabindex]="-1"
5220
- aria-hidden="true"
5231
+ [attr.aria-label]="messageFor('toggleButtonLabel')"
5221
5232
  (click)="onArrowButtonClick()"
5222
5233
  (mousedown)="toggleArrowButtonActiveState(true)"
5223
5234
  (mouseup)="toggleArrowButtonActiveState(false)"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-buttons",
3
- "version": "20.1.0-develop.9",
3
+ "version": "20.1.1-develop.1",
4
4
  "description": "Buttons Package for Angular",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "author": "Progress",
@@ -21,7 +21,7 @@
21
21
  "package": {
22
22
  "productName": "Kendo UI for Angular",
23
23
  "productCode": "KENDOUIANGULAR",
24
- "publishDate": 1759490600,
24
+ "publishDate": 1761222610,
25
25
  "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
26
26
  }
27
27
  },
@@ -31,15 +31,15 @@
31
31
  "@angular/core": "16 - 20",
32
32
  "@angular/platform-browser": "16 - 20",
33
33
  "@progress/kendo-licensing": "^1.7.0",
34
- "@progress/kendo-angular-common": "20.1.0-develop.9",
35
- "@progress/kendo-angular-l10n": "20.1.0-develop.9",
36
- "@progress/kendo-angular-popup": "20.1.0-develop.9",
37
- "@progress/kendo-angular-icons": "20.1.0-develop.9",
34
+ "@progress/kendo-angular-common": "20.1.1-develop.1",
35
+ "@progress/kendo-angular-l10n": "20.1.1-develop.1",
36
+ "@progress/kendo-angular-popup": "20.1.1-develop.1",
37
+ "@progress/kendo-angular-icons": "20.1.1-develop.1",
38
38
  "rxjs": "^6.5.3 || ^7.0.0"
39
39
  },
40
40
  "dependencies": {
41
41
  "tslib": "^2.3.1",
42
- "@progress/kendo-angular-schematics": "20.1.0-develop.9",
42
+ "@progress/kendo-angular-schematics": "20.1.1-develop.1",
43
43
  "@progress/kendo-common": "^1.0.1",
44
44
  "@progress/kendo-webspeech-common": "1.0.1"
45
45
  },
@@ -29,6 +29,10 @@ export declare class Messages extends ComponentMessages {
29
29
  * ```
30
30
  */
31
31
  splitButtonLabel: string;
32
+ /**
33
+ * Specifies the text for the SplitButton toggle button `aria-label`.
34
+ */
35
+ toggleButtonLabel: string;
32
36
  static ɵfac: i0.ɵɵFactoryDeclaration<Messages, never>;
33
- static ɵdir: i0.ɵɵDirectiveDeclaration<Messages, "kendo-splitbutton-messages-base", never, { "splitButtonLabel": { "alias": "splitButtonLabel"; "required": false; }; }, {}, never, never, false, never>;
37
+ static ɵdir: i0.ɵɵDirectiveDeclaration<Messages, "kendo-splitbutton-messages-base", never, { "splitButtonLabel": { "alias": "splitButtonLabel"; "required": false; }; "toggleButtonLabel": { "alias": "toggleButtonLabel"; "required": false; }; }, {}, never, never, false, never>;
34
38
  }
@@ -2,7 +2,7 @@
2
2
  * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { ElementRef, EventEmitter, AfterViewInit, OnChanges, SimpleChanges, NgZone, ChangeDetectorRef, Renderer2, OnDestroy } from '@angular/core';
5
+ import { ElementRef, EventEmitter, AfterViewInit, OnChanges, SimpleChanges, NgZone, ChangeDetectorRef, Renderer2, OnDestroy, DoCheck } from '@angular/core';
6
6
  import { LocalizationService } from '@progress/kendo-angular-l10n';
7
7
  import { Align, PopupService } from '@progress/kendo-angular-popup';
8
8
  import { ListButton } from './../listbutton/list-button';
@@ -44,7 +44,7 @@ import * as i0 from "@angular/core";
44
44
  * }
45
45
  * ```
46
46
  */
47
- export declare class SplitButtonComponent extends ListButton implements AfterViewInit, OnChanges, OnDestroy {
47
+ export declare class SplitButtonComponent extends ListButton implements AfterViewInit, OnChanges, OnDestroy, DoCheck {
48
48
  private localization;
49
49
  private renderer;
50
50
  /**
@@ -198,6 +198,10 @@ export declare class SplitButtonComponent extends ListButton implements AfterVie
198
198
  * @hidden
199
199
  */
200
200
  get ariaLabel(): string;
201
+ /**
202
+ * @hidden
203
+ */
204
+ messageFor(key: string): string;
201
205
  /**
202
206
  * @hidden
203
207
  */
@@ -230,13 +234,8 @@ export declare class SplitButtonComponent extends ListButton implements AfterVie
230
234
  * @hidden
231
235
  */
232
236
  keyup(event: any): void;
233
- /**
234
- * @hidden
235
- */
237
+ ngDoCheck(): void;
236
238
  ngAfterViewInit(): void;
237
- /**
238
- * @hidden
239
- */
240
239
  ngOnChanges(changes: SimpleChanges): void;
241
240
  /**
242
241
  * @hidden