@progress/kendo-angular-buttons 24.0.0-develop.3 → 24.0.0-develop.31

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.
@@ -128,7 +128,7 @@ export declare class ButtonComponent implements OnInit, OnDestroy, OnChanges {
128
128
  click: EventEmitter<any>;
129
129
  element: HTMLElement;
130
130
  isDisabled: boolean;
131
- caretAltDownIcon: SVGIcon;
131
+ chevronDownIcon: SVGIcon;
132
132
  private _size;
133
133
  private _rounded;
134
134
  private _fillMode;
@@ -142,8 +142,6 @@ export declare class ButtonComponent implements OnInit, OnDestroy, OnChanges {
142
142
  private _svgIcon;
143
143
  set isFocused(isFocused: boolean);
144
144
  get isFocused(): boolean;
145
- get classButton(): boolean;
146
- get isToggleable(): boolean;
147
145
  get iconButtonClass(): boolean;
148
146
  get classDisabled(): boolean;
149
147
  get classActive(): boolean;
@@ -156,14 +154,6 @@ export declare class ButtonComponent implements OnInit, OnDestroy, OnChanges {
156
154
  * @hidden
157
155
  */
158
156
  onBlur(): void;
159
- /**
160
- * @hidden
161
- */
162
- set primary(value: boolean);
163
- /**
164
- * @hidden
165
- */
166
- set look(value: 'flat' | 'outline' | 'clear' | 'default');
167
157
  /**
168
158
  * Alias for ElementRef.nativeElement to workaround
169
159
  * ViewChild() selectors that used to return the host element before v11.
@@ -206,5 +196,5 @@ export declare class ButtonComponent implements OnInit, OnDestroy, OnChanges {
206
196
  private handleClasses;
207
197
  private handleThemeColor;
208
198
  static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, [null, null, { optional: true; }, null, null]>;
209
- static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "button[kendoButton]", ["kendoButton"], { "arrowIcon": { "alias": "arrowIcon"; "required": false; }; "toggleable": { "alias": "toggleable"; "required": false; }; "togglable": { "alias": "togglable"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "imageUrl": { "alias": "imageUrl"; "required": false; }; "iconPosition": { "alias": "iconPosition"; "required": false; }; "iconClass": { "alias": "iconClass"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "size": { "alias": "size"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "fillMode": { "alias": "fillMode"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; "svgIcon": { "alias": "svgIcon"; "required": false; }; "primary": { "alias": "primary"; "required": false; }; "look": { "alias": "look"; "required": false; }; }, { "selectedChange": "selectedChange"; "click": "click"; }, never, ["*"], true, never>;
199
+ static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "button[kendoButton]", ["kendoButton"], { "arrowIcon": { "alias": "arrowIcon"; "required": false; }; "toggleable": { "alias": "toggleable"; "required": false; }; "togglable": { "alias": "togglable"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "imageUrl": { "alias": "imageUrl"; "required": false; }; "iconPosition": { "alias": "iconPosition"; "required": false; }; "iconClass": { "alias": "iconClass"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "size": { "alias": "size"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "fillMode": { "alias": "fillMode"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; "svgIcon": { "alias": "svgIcon"; "required": false; }; }, { "selectedChange": "selectedChange"; "click": "click"; }, never, ["*"], true, never>;
210
200
  }
@@ -57,7 +57,6 @@ export declare class ChipListComponent implements OnInit, AfterViewInit, AfterCo
57
57
  */
58
58
  remove: EventEmitter<ChipListRemoveEvent>;
59
59
  chips: QueryList<ChipComponent>;
60
- get single(): boolean;
61
60
  get multiple(): boolean;
62
61
  /**
63
62
  * @hidden
@@ -133,8 +133,7 @@ export declare class ChipComponent implements OnInit, AfterViewInit, OnChanges {
133
133
  contentClick: EventEmitter<ChipContentClickEvent>;
134
134
  tabIndex: number;
135
135
  hostClass: boolean;
136
- get hasIconClass(): boolean;
137
- get disabledClass(): boolean;
136
+ get disabledClass(): boolean | null;
138
137
  get selectedClass(): boolean;
139
138
  get focusedClass(): boolean;
140
139
  /**
@@ -5,8 +5,20 @@
5
5
  /**
6
6
  * Specifies the possible sizes for the buttons.
7
7
  */
8
- export type ButtonSize = 'small' | 'medium' | 'large';
8
+ export type ButtonSize = 'xsmall' | 'small' | 'medium' | 'large';
9
9
  /**
10
10
  * Specifies the possible sizes for the Chip.
11
11
  */
12
12
  export type ChipSize = 'small' | 'medium' | 'large';
13
+ /**
14
+ * Specifies the possible sizes for the SplitButton.
15
+ */
16
+ export type SplitButtonSize = 'small' | 'medium' | 'large';
17
+ /**
18
+ * Specifies the possible sizes for the DropDownButton.
19
+ */
20
+ export type DropDownButtonSize = 'small' | 'medium' | 'large';
21
+ /**
22
+ * Specifies the possible sizes for the FloatingActionButton.
23
+ */
24
+ export type FloatingActionButtonSize = 'small' | 'medium' | 'large';
@@ -14,11 +14,9 @@
14
14
  * * `success`&mdash;Applies the `success` theme color.
15
15
  * * `warning`&mdash;Applies the `warning` theme color.
16
16
  * * `error`&mdash;Applies the `error` theme color.
17
- * * `dark`&mdash;Applies the `dark` theme color.
18
- * * `light`&mdash;Applies the `light` theme color.
19
17
  * * `inverse`&mdash;Applies the `inverse` theme color.
20
18
  */
21
- export type ButtonThemeColor = 'base' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse';
19
+ export type ButtonThemeColor = 'base' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'inverse';
22
20
  /**
23
21
  * Specifies the possible theme colors for the Chip.
24
22
  *
@@ -30,3 +28,13 @@ export type ButtonThemeColor = 'base' | 'primary' | 'secondary' | 'tertiary' | '
30
28
  * * `error`&mdash;Applies the `error` theme color.
31
29
  */
32
30
  export type ChipThemeColor = 'base' | 'info' | 'success' | 'warning' | 'error';
31
+ /**
32
+ * Specifies the possible theme colors for the FloatingActionButton component.
33
+ *
34
+ * The possible values are:
35
+ * * `base`&mdash;Applies the `base` theme color.
36
+ * * `primary`&mdash;Applies the `primary` theme color.
37
+ * * `secondary`&mdash;Applies the `secondary` theme color.
38
+ * * `tertiary`&mdash;Applies the `tertiary` theme color.
39
+ */
40
+ export type FloatingActionButtonThemeColor = 'base' | 'primary' | 'secondary' | 'tertiary';
@@ -10,7 +10,7 @@ import { Direction } from '../direction';
10
10
  import { ListButton } from '../listbutton/list-button';
11
11
  import { FocusService } from '../focusable/focus.service';
12
12
  import { NavigationService } from '../navigation/navigation.service';
13
- import { ArrowIconSettings, ButtonFillMode, ButtonRounded, ButtonSize, ButtonThemeColor } from '../common/models';
13
+ import { ArrowIconSettings, ButtonFillMode, ButtonRounded, ButtonThemeColor, DropDownButtonSize } from '../common/models';
14
14
  import { PopupContainerService } from '../listbutton/container.service';
15
15
  import { SVGIcon } from '@progress/kendo-svg-icons';
16
16
  import * as i0 from "@angular/core";
@@ -77,7 +77,7 @@ export declare class DropDownButtonComponent extends ListButton implements After
77
77
  /**
78
78
  * Specifies the padding of the DropDownButton. See [DropDownButton Appearance](https://www.telerik.com/kendo-angular-ui/components/buttons/dropdownbutton/appearance#size). The default value is set by the Kendo theme.
79
79
  */
80
- size: ButtonSize;
80
+ size: DropDownButtonSize;
81
81
  /**
82
82
  * Specifies the border radius of the DropDownButton. See [DropDownButton Appearance](https://www.telerik.com/kendo-angular-ui/components/buttons/dropdownbutton/appearance#roundness). The default value is set by the Kendo theme.
83
83
  */
@@ -3,12 +3,12 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  import * as i0 from '@angular/core';
6
- import { Injectable, isDevMode, EventEmitter, Input, HostListener, HostBinding, Output, Optional, Component, ContentChildren, Directive, InjectionToken, Inject, ElementRef, ViewContainerRef, ViewChild, ContentChild, forwardRef, SkipSelf, ChangeDetectionStrategy, NgModule } from '@angular/core';
6
+ import { Injectable, isDevMode, EventEmitter, HostListener, HostBinding, Output, Input, Optional, Component, ContentChildren, Directive, InjectionToken, Inject, ElementRef, ViewContainerRef, ViewChild, ContentChild, forwardRef, SkipSelf, ChangeDetectionStrategy, NgModule } from '@angular/core';
7
7
  import { Subject, Subscription, fromEvent, merge, of, Observable, from } from 'rxjs';
8
8
  import * as i12 from '@progress/kendo-angular-common';
9
9
  import { isDocumentAvailable, isFirefox, isSafari, isChanged, hasObservers, normalizeKeys, Keys, TemplateContextDirective, MultiTabStop, guid, parseCSSClassNames, isPresent as isPresent$1, EventsOutsideAngularDirective, replaceMessagePlaceholder, anyChanged, PreventableEvent as PreventableEvent$1, ResizeSensorComponent, ToggleButtonTabStopDirective, ResizeBatchService, KENDO_TOGGLEBUTTONTABSTOP } from '@progress/kendo-angular-common';
10
10
  export { ToggleButtonTabStopDirective } from '@progress/kendo-angular-common';
11
- import { caretAltDownIcon, xCircleIcon, moreVerticalIcon, microphoneOutlineIcon, stopSmIcon, pasteSparkleIcon } from '@progress/kendo-svg-icons';
11
+ import { chevronDownIcon, xCircleIcon, moreVerticalIcon, microphoneIcon, stopIcon, pasteSparkleIcon } from '@progress/kendo-svg-icons';
12
12
  import * as i1 from '@progress/kendo-angular-l10n';
13
13
  import { LocalizationService, L10N_PREFIX, ComponentMessages } from '@progress/kendo-angular-l10n';
14
14
  import { validatePackage } from '@progress/kendo-licensing';
@@ -49,8 +49,8 @@ const packageMetadata = {
49
49
  productName: 'Kendo UI for Angular',
50
50
  productCode: 'KENDOUIANGULAR',
51
51
  productCodes: ['KENDOUIANGULAR'],
52
- publishDate: 1776940371,
53
- version: '24.0.0-develop.3',
52
+ publishDate: 1778841557,
53
+ version: '24.0.0-develop.31',
54
54
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
55
55
  };
56
56
 
@@ -94,6 +94,7 @@ function closest(element, selector) {
94
94
  * @hidden
95
95
  */
96
96
  const SIZES = {
97
+ xsmall: 'xs',
97
98
  small: 'sm',
98
99
  medium: 'md',
99
100
  large: 'lg'
@@ -353,7 +354,7 @@ class ButtonComponent {
353
354
  click = new EventEmitter();
354
355
  element;
355
356
  isDisabled = false;
356
- caretAltDownIcon = caretAltDownIcon;
357
+ chevronDownIcon = chevronDownIcon;
357
358
  _size = undefined;
358
359
  _rounded = undefined;
359
360
  _fillMode = undefined;
@@ -372,12 +373,6 @@ class ButtonComponent {
372
373
  get isFocused() {
373
374
  return this._focused;
374
375
  }
375
- get classButton() {
376
- return true;
377
- }
378
- get isToggleable() {
379
- return this.toggleable;
380
- }
381
376
  get iconButtonClass() {
382
377
  const hasIcon = this.icon || this.iconClass || this.imageUrl || this.svgIcon;
383
378
  return hasIcon && !this.hasText;
@@ -403,18 +398,6 @@ class ButtonComponent {
403
398
  onBlur() {
404
399
  this.isFocused = false;
405
400
  }
406
- /**
407
- * @hidden
408
- */
409
- set primary(value) {
410
- this.themeColor = value ? 'primary' : 'base';
411
- }
412
- /**
413
- * @hidden
414
- */
415
- set look(value) {
416
- this.fillMode = (value === 'default') ? 'solid' : value;
417
- }
418
401
  /**
419
402
  * Alias for ElementRef.nativeElement to workaround
420
403
  * ViewChild() selectors that used to return the host element before v11.
@@ -434,6 +417,7 @@ class ButtonComponent {
434
417
  this.element = element.nativeElement;
435
418
  }
436
419
  ngOnInit() {
420
+ this.renderer.addClass(this.element, 'k-button');
437
421
  if (!this.element.hasAttribute('role') && this.togglable) {
438
422
  this.toggleAriaPressed(this.toggleable);
439
423
  }
@@ -553,7 +537,7 @@ class ButtonComponent {
553
537
  }
554
538
  }
555
539
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ButtonComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: KendoButtonService, optional: true }, { token: i1.LocalizationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
556
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ButtonComponent, isStandalone: true, selector: "button[kendoButton]", inputs: { arrowIcon: "arrowIcon", toggleable: "toggleable", togglable: "togglable", selected: "selected", tabIndex: "tabIndex", imageUrl: "imageUrl", iconPosition: "iconPosition", iconClass: "iconClass", icon: "icon", disabled: "disabled", size: "size", rounded: "rounded", fillMode: "fillMode", themeColor: "themeColor", svgIcon: "svgIcon", primary: "primary", look: "look" }, outputs: { selectedChange: "selectedChange", click: "click" }, host: { listeners: { "focus": "onFocus()", "blur": "onBlur()" }, properties: { "class.k-button": "this.classButton", "class.k-toggle-button": "this.isToggleable", "class.k-icon-button": "this.iconButtonClass", "class.k-disabled": "this.classDisabled", "class.k-selected": "this.classActive", "attr.dir": "this.getDirection" } }, providers: [
540
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ButtonComponent, isStandalone: true, selector: "button[kendoButton]", inputs: { arrowIcon: "arrowIcon", toggleable: "toggleable", togglable: "togglable", selected: "selected", tabIndex: "tabIndex", imageUrl: "imageUrl", iconPosition: "iconPosition", iconClass: "iconClass", icon: "icon", disabled: "disabled", size: "size", rounded: "rounded", fillMode: "fillMode", themeColor: "themeColor", svgIcon: "svgIcon" }, outputs: { selectedChange: "selectedChange", click: "click" }, host: { listeners: { "focus": "onFocus()", "blur": "onBlur()" }, properties: { "class.k-icon-button": "this.iconButtonClass", "class.k-disabled": "this.classDisabled", "class.k-selected": "this.classActive", "attr.dir": "this.getDirection" } }, providers: [
557
541
  LocalizationService,
558
542
  {
559
543
  provide: L10N_PREFIX,
@@ -592,8 +576,8 @@ class ButtonComponent {
592
576
  @if (arrowIcon && !$any(arrowIcon).iconClass) {
593
577
  <span class="k-button-arrow">
594
578
  <kendo-icon-wrapper
595
- [name]="$any(arrowIcon).icon || 'caret-alt-down'"
596
- [svgIcon]="$any(arrowIcon).svgIcon || caretAltDownIcon">
579
+ [name]="$any(arrowIcon).icon || 'chevron-down'"
580
+ [svgIcon]="$any(arrowIcon).svgIcon || chevronDownIcon">
597
581
  </kendo-icon-wrapper>
598
582
  </span>
599
583
  }
@@ -645,8 +629,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
645
629
  @if (arrowIcon && !$any(arrowIcon).iconClass) {
646
630
  <span class="k-button-arrow">
647
631
  <kendo-icon-wrapper
648
- [name]="$any(arrowIcon).icon || 'caret-alt-down'"
649
- [svgIcon]="$any(arrowIcon).svgIcon || caretAltDownIcon">
632
+ [name]="$any(arrowIcon).icon || 'chevron-down'"
633
+ [svgIcon]="$any(arrowIcon).svgIcon || chevronDownIcon">
650
634
  </kendo-icon-wrapper>
651
635
  </span>
652
636
  }
@@ -691,12 +675,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
691
675
  type: Output
692
676
  }], click: [{
693
677
  type: Output
694
- }], classButton: [{
695
- type: HostBinding,
696
- args: ['class.k-button']
697
- }], isToggleable: [{
698
- type: HostBinding,
699
- args: ['class.k-toggle-button']
700
678
  }], iconButtonClass: [{
701
679
  type: HostBinding,
702
680
  args: ['class.k-icon-button']
@@ -715,10 +693,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
715
693
  }], onBlur: [{
716
694
  type: HostListener,
717
695
  args: ['blur']
718
- }], primary: [{
719
- type: Input
720
- }], look: [{
721
- type: Input
722
696
  }] } });
723
697
 
724
698
  /**
@@ -1215,11 +1189,8 @@ class ChipComponent {
1215
1189
  contentClick = new EventEmitter();
1216
1190
  tabIndex = 0;
1217
1191
  hostClass = true;
1218
- get hasIconClass() {
1219
- return Boolean(this.icon || this.iconClass || (this.avatarSettings && !isObjectEmpty(this.avatarSettings)));
1220
- }
1221
1192
  get disabledClass() {
1222
- return this.disabled;
1193
+ return this.disabled || null;
1223
1194
  }
1224
1195
  get selectedClass() {
1225
1196
  return this.selected;
@@ -1261,6 +1232,7 @@ class ChipComponent {
1261
1232
  this.subs.add(this.localizationService.changes
1262
1233
  .subscribe(({ rtl }) => this.direction = rtl ? 'rtl' : 'ltr'));
1263
1234
  this.renderer.setAttribute(this.element.nativeElement, 'role', 'button');
1235
+ this.renderer.setAttribute(this.element.nativeElement, 'aria-pressed', `${this.selected}`);
1264
1236
  }
1265
1237
  ngOnDestroy() {
1266
1238
  this.subs.unsubscribe();
@@ -1401,7 +1373,7 @@ class ChipComponent {
1401
1373
  }
1402
1374
  }
1403
1375
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ChipComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
1404
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ChipComponent, isStandalone: true, selector: "kendo-chip", inputs: { label: "label", icon: "icon", svgIcon: "svgIcon", iconClass: "iconClass", avatarSettings: "avatarSettings", selected: "selected", removable: "removable", removeIcon: "removeIcon", removeSvgIcon: "removeSvgIcon", hasMenu: "hasMenu", menuIcon: "menuIcon", menuSvgIcon: "menuSvgIcon", disabled: "disabled", size: "size", rounded: "rounded", fillMode: "fillMode", themeColor: "themeColor" }, outputs: { remove: "remove", menuToggle: "menuToggle", contentClick: "contentClick" }, host: { properties: { "attr.tabindex": "this.tabIndex", "class.k-chip": "this.hostClass", "class.k-chip-has-icon": "this.hasIconClass", "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "class.k-selected": "this.selectedClass", "class.k-focus": "this.focusedClass", "attr.dir": "this.direction" } }, providers: [
1376
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ChipComponent, isStandalone: true, selector: "kendo-chip", inputs: { label: "label", icon: "icon", svgIcon: "svgIcon", iconClass: "iconClass", avatarSettings: "avatarSettings", selected: "selected", removable: "removable", removeIcon: "removeIcon", removeSvgIcon: "removeSvgIcon", hasMenu: "hasMenu", menuIcon: "menuIcon", menuSvgIcon: "menuSvgIcon", disabled: "disabled", size: "size", rounded: "rounded", fillMode: "fillMode", themeColor: "themeColor" }, outputs: { remove: "remove", menuToggle: "menuToggle", contentClick: "contentClick" }, host: { properties: { "attr.tabindex": "this.tabIndex", "class.k-chip": "this.hostClass", "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "class.k-selected": "this.selectedClass", "class.k-focus": "this.focusedClass", "attr.dir": "this.direction" } }, providers: [
1405
1377
  LocalizationService,
1406
1378
  {
1407
1379
  provide: L10N_PREFIX,
@@ -1424,7 +1396,7 @@ class ChipComponent {
1424
1396
  }
1425
1397
  @if (avatarSettings) {
1426
1398
  <span
1427
- class="k-chip-avatar k-avatar k-avatar-sm k-avatar-solid k-avatar-solid-primary k-rounded-full"
1399
+ class="k-chip-avatar k-avatar"
1428
1400
  [ngStyle]="avatarSettings.cssStyle">
1429
1401
  @if (avatarSettings?.imageSrc) {
1430
1402
  <span class="k-avatar-image">
@@ -1495,7 +1467,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
1495
1467
  }
1496
1468
  @if (avatarSettings) {
1497
1469
  <span
1498
- class="k-chip-avatar k-avatar k-avatar-sm k-avatar-solid k-avatar-solid-primary k-rounded-full"
1470
+ class="k-chip-avatar k-avatar"
1499
1471
  [ngStyle]="avatarSettings.cssStyle">
1500
1472
  @if (avatarSettings?.imageSrc) {
1501
1473
  <span class="k-avatar-image">
@@ -1600,9 +1572,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
1600
1572
  }], hostClass: [{
1601
1573
  type: HostBinding,
1602
1574
  args: ['class.k-chip']
1603
- }], hasIconClass: [{
1604
- type: HostBinding,
1605
- args: ['class.k-chip-has-icon']
1606
1575
  }], disabledClass: [{
1607
1576
  type: HostBinding,
1608
1577
  args: ['attr.aria-disabled']
@@ -1674,9 +1643,6 @@ class ChipListComponent {
1674
1643
  */
1675
1644
  remove = new EventEmitter();
1676
1645
  chips;
1677
- get single() {
1678
- return this.selection === 'single';
1679
- }
1680
1646
  get multiple() {
1681
1647
  return this.selection === 'multiple' ? true : undefined;
1682
1648
  }
@@ -1861,11 +1827,11 @@ class ChipListComponent {
1861
1827
  this.chips.forEach((chip, idx) => {
1862
1828
  const chipEl = chip.element.nativeElement;
1863
1829
  this.renderer.removeAttribute(chipEl, 'aria-pressed');
1864
- if (this.selection !== 'none') {
1865
- this.renderer.setAttribute(chipEl, 'aria-selected', `${chip.selected}`);
1866
- }
1867
1830
  if (this.role === 'listbox') {
1868
1831
  this.renderer.setAttribute(chipEl, 'role', 'option');
1832
+ if (this.selection !== 'none') {
1833
+ this.renderer.setAttribute(chipEl, 'aria-selected', `${chip.selected}`);
1834
+ }
1869
1835
  }
1870
1836
  if (!this.navigable) {
1871
1837
  return;
@@ -1898,7 +1864,7 @@ class ChipListComponent {
1898
1864
  }
1899
1865
  }
1900
1866
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ChipListComponent, deps: [{ token: i1.LocalizationService }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
1901
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ChipListComponent, isStandalone: true, selector: "kendo-chiplist, kendo-chip-list", inputs: { orientation: "orientation", selection: "selection", size: "size", role: "role", navigable: "navigable" }, outputs: { selectedChange: "selectedChange", remove: "remove" }, host: { listeners: { "click": "onClick($event)" }, properties: { "class.k-chip-list": "this.hostClass", "attr.aria-orientation": "this.orientation", "attr.dir": "this.direction", "class.k-selection-single": "this.single", "attr.aria-multiselectable": "this.multiple", "class.k-selection-multiple": "this.multiple", "attr.role": "this.role" } }, providers: [
1867
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ChipListComponent, isStandalone: true, selector: "kendo-chiplist, kendo-chip-list", inputs: { orientation: "orientation", selection: "selection", size: "size", role: "role", navigable: "navigable" }, outputs: { selectedChange: "selectedChange", remove: "remove" }, host: { listeners: { "click": "onClick($event)" }, properties: { "class.k-chip-list": "this.hostClass", "attr.aria-orientation": "this.orientation", "attr.dir": "this.direction", "attr.aria-multiselectable": "this.multiple", "attr.role": "this.role" } }, providers: [
1902
1868
  LocalizationService,
1903
1869
  {
1904
1870
  provide: L10N_PREFIX,
@@ -1946,15 +1912,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
1946
1912
  }], chips: [{
1947
1913
  type: ContentChildren,
1948
1914
  args: [ChipComponent]
1949
- }], single: [{
1950
- type: HostBinding,
1951
- args: ['class.k-selection-single']
1952
1915
  }], multiple: [{
1953
1916
  type: HostBinding,
1954
1917
  args: ['attr.aria-multiselectable']
1955
- }, {
1956
- type: HostBinding,
1957
- args: ['class.k-selection-multiple']
1958
1918
  }], role: [{
1959
1919
  type: HostBinding,
1960
1920
  args: ['attr.role']
@@ -2286,14 +2246,16 @@ class ListComponent {
2286
2246
  }
2287
2247
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2288
2248
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ListComponent, isStandalone: true, selector: "kendo-button-list", inputs: { data: "data", textField: "textField", itemTemplate: "itemTemplate", size: "size" }, outputs: { onItemClick: "onItemClick", onItemBlur: "onItemBlur" }, ngImport: i0, template: `
2289
- <ul class="k-group k-menu-group k-reset" role="list" [ngClass]="sizeClass">
2290
- @for (dataItem of data; track dataItem; let index = $index) {
2249
+ <ul class="k-menu-group" role="list" [ngClass]="sizeClass">
2250
+ @for (dataItem of data; track dataItem; let index = $index; let isFirst = $first; let isLast = $last) {
2291
2251
  <li kendoButtonFocusable
2292
2252
  [index]="index"
2293
2253
  tabindex="-1"
2294
2254
  class="k-item k-menu-item"
2255
+ [class.k-first]="isFirst"
2256
+ [class.k-last]="isLast"
2295
2257
  role="listitem"
2296
- [attr.aria-disabled]="dataItem.disabled ? true : false"
2258
+ [attr.aria-disabled]="dataItem.disabled || null"
2297
2259
  (click)="$event.stopImmediatePropagation(); onClick(index);"
2298
2260
  (blur)="onBlur()">
2299
2261
  @if (itemTemplate?.templateRef) {
@@ -2342,14 +2304,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
2342
2304
  args: [{
2343
2305
  selector: 'kendo-button-list',
2344
2306
  template: `
2345
- <ul class="k-group k-menu-group k-reset" role="list" [ngClass]="sizeClass">
2346
- @for (dataItem of data; track dataItem; let index = $index) {
2307
+ <ul class="k-menu-group" role="list" [ngClass]="sizeClass">
2308
+ @for (dataItem of data; track dataItem; let index = $index; let isFirst = $first; let isLast = $last) {
2347
2309
  <li kendoButtonFocusable
2348
2310
  [index]="index"
2349
2311
  tabindex="-1"
2350
2312
  class="k-item k-menu-item"
2313
+ [class.k-first]="isFirst"
2314
+ [class.k-last]="isLast"
2351
2315
  role="listitem"
2352
- [attr.aria-disabled]="dataItem.disabled ? true : false"
2316
+ [attr.aria-disabled]="dataItem.disabled || null"
2353
2317
  (click)="$event.stopImmediatePropagation(); onClick(index);"
2354
2318
  (blur)="onBlur()">
2355
2319
  @if (itemTemplate?.templateRef) {
@@ -3151,7 +3115,7 @@ class DropDownButtonComponent extends ListButton {
3151
3115
  (click)="openPopup()"
3152
3116
  (focus)="handleFocus($event)"
3153
3117
  (blur)="onButtonBlur()"
3154
- [attr.aria-disabled]="disabled"
3118
+ [attr.aria-disabled]="disabled || null"
3155
3119
  [attr.aria-expanded]="openState"
3156
3120
  [attr.aria-controls]="openState ? listId : null"
3157
3121
  >
@@ -3174,7 +3138,7 @@ class DropDownButtonComponent extends ListButton {
3174
3138
  </kendo-button-list>
3175
3139
  </ng-template>
3176
3140
  <ng-container #container></ng-container>
3177
- `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ListComponent, selector: "kendo-button-list", inputs: ["data", "textField", "itemTemplate", "size"], outputs: ["onItemClick", "onItemBlur"] }] });
3141
+ `, isInline: true, dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ListComponent, selector: "kendo-button-list", inputs: ["data", "textField", "itemTemplate", "size"], outputs: ["onItemClick", "onItemBlur"] }] });
3178
3142
  }
3179
3143
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: DropDownButtonComponent, decorators: [{
3180
3144
  type: Component,
@@ -3213,7 +3177,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
3213
3177
  (click)="openPopup()"
3214
3178
  (focus)="handleFocus($event)"
3215
3179
  (blur)="onButtonBlur()"
3216
- [attr.aria-disabled]="disabled"
3180
+ [attr.aria-disabled]="disabled || null"
3217
3181
  [attr.aria-expanded]="openState"
3218
3182
  [attr.aria-controls]="openState ? listId : null"
3219
3183
  >
@@ -4378,7 +4342,7 @@ class FloatingActionButtonComponent {
4378
4342
  [class.k-disabled]="disabled"
4379
4343
  [ngClass]="buttonClass"
4380
4344
  [disabled]="disabled"
4381
- [attr.aria-disabled]="disabled"
4345
+ [attr.aria-disabled]="disabled || null"
4382
4346
  [attr.aria-expanded]="ariaExpanded"
4383
4347
  [attr.aria-haspopup]="ariaHasPopup"
4384
4348
  [attr.aria-controls]="ariaControls"
@@ -4456,7 +4420,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
4456
4420
  [class.k-disabled]="disabled"
4457
4421
  [ngClass]="buttonClass"
4458
4422
  [disabled]="disabled"
4459
- [attr.aria-disabled]="disabled"
4423
+ [attr.aria-disabled]="disabled || null"
4460
4424
  [attr.aria-expanded]="ariaExpanded"
4461
4425
  [attr.aria-haspopup]="ariaHasPopup"
4462
4426
  [attr.aria-controls]="ariaControls"
@@ -4830,11 +4794,11 @@ class SplitButtonComponent extends ListButton {
4830
4794
  /**
4831
4795
  * Specifies the name of the font icon displayed on the button that opens the popup.
4832
4796
  */
4833
- arrowButtonIcon = 'caret-alt-down';
4797
+ arrowButtonIcon = 'chevron-down';
4834
4798
  /**
4835
4799
  * Specifies the [`SVGIcon`](https://www.telerik.com/kendo-angular-ui/components/icons/api/svgiconcomponent) displayed on the button that opens the popup.
4836
4800
  */
4837
- arrowButtonSvgIcon = caretAltDownIcon;
4801
+ arrowButtonSvgIcon = chevronDownIcon;
4838
4802
  /**
4839
4803
  * Sets attributes for the main button.
4840
4804
  */
@@ -5200,8 +5164,6 @@ class SplitButtonComponent extends ListButton {
5200
5164
  (blur)="onButtonBlur()"
5201
5165
  (mousedown)="toggleButtonActiveState(true)"
5202
5166
  (mouseup)="toggleButtonActiveState(false)"
5203
- [attr.aria-expanded]="openState"
5204
- [attr.aria-controls]="openState ? listId : null"
5205
5167
  [attr.aria-label]="ariaLabel"
5206
5168
  >
5207
5169
  @if (text) {
@@ -5222,6 +5184,8 @@ class SplitButtonComponent extends ListButton {
5222
5184
  [themeColor]="themeColor"
5223
5185
  [tabindex]="-1"
5224
5186
  [attr.aria-label]="messageFor('toggleButtonLabel')"
5187
+ [attr.aria-expanded]="openState"
5188
+ [attr.aria-controls]="openState ? listId : null"
5225
5189
  (click)="onArrowButtonClick()"
5226
5190
  (mousedown)="toggleArrowButtonActiveState(true)"
5227
5191
  (mouseup)="toggleArrowButtonActiveState(false)"
@@ -5241,7 +5205,7 @@ class SplitButtonComponent extends ListButton {
5241
5205
  </kendo-button-list>
5242
5206
  </ng-template>
5243
5207
  <ng-container #container></ng-container>
5244
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedSplitButtonMessagesDirective, selector: "[kendoSplitButtonLocalizedMessages]" }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ListComponent, selector: "kendo-button-list", inputs: ["data", "textField", "itemTemplate", "size"], outputs: ["onItemClick", "onItemBlur"] }] });
5208
+ `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedSplitButtonMessagesDirective, selector: "[kendoSplitButtonLocalizedMessages]" }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ListComponent, selector: "kendo-button-list", inputs: ["data", "textField", "itemTemplate", "size"], outputs: ["onItemClick", "onItemBlur"] }] });
5245
5209
  }
5246
5210
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SplitButtonComponent, decorators: [{
5247
5211
  type: Component,
@@ -5291,8 +5255,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
5291
5255
  (blur)="onButtonBlur()"
5292
5256
  (mousedown)="toggleButtonActiveState(true)"
5293
5257
  (mouseup)="toggleButtonActiveState(false)"
5294
- [attr.aria-expanded]="openState"
5295
- [attr.aria-controls]="openState ? listId : null"
5296
5258
  [attr.aria-label]="ariaLabel"
5297
5259
  >
5298
5260
  @if (text) {
@@ -5313,6 +5275,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
5313
5275
  [themeColor]="themeColor"
5314
5276
  [tabindex]="-1"
5315
5277
  [attr.aria-label]="messageFor('toggleButtonLabel')"
5278
+ [attr.aria-expanded]="openState"
5279
+ [attr.aria-controls]="openState ? listId : null"
5316
5280
  (click)="onArrowButtonClick()"
5317
5281
  (mousedown)="toggleArrowButtonActiveState(true)"
5318
5282
  (mouseup)="toggleArrowButtonActiveState(false)"
@@ -5544,9 +5508,6 @@ class SpeechToTextButtonComponent {
5544
5508
  get getDirection() {
5545
5509
  return this.direction;
5546
5510
  }
5547
- get ariaPressed() {
5548
- return this.isListening;
5549
- }
5550
5511
  /**
5551
5512
  * @hidden
5552
5513
  */
@@ -5691,7 +5652,7 @@ class SpeechToTextButtonComponent {
5691
5652
  * @hidden
5692
5653
  */
5693
5654
  get buttonIcon() {
5694
- return this.isListening ? 'stop-sm' : 'microphone-outline';
5655
+ return this.isListening ? 'stop' : 'microphone';
5695
5656
  }
5696
5657
  /**
5697
5658
  * @hidden
@@ -5705,8 +5666,8 @@ class SpeechToTextButtonComponent {
5705
5666
  * @hidden
5706
5667
  */
5707
5668
  subs = new Subscription();
5708
- microphoneSvgIcon = microphoneOutlineIcon;
5709
- stopSvgIcon = stopSmIcon;
5669
+ microphoneSvgIcon = microphoneIcon;
5670
+ stopSvgIcon = stopIcon;
5710
5671
  speechRecognition;
5711
5672
  _size = undefined;
5712
5673
  _rounded = undefined;
@@ -5801,7 +5762,7 @@ class SpeechToTextButtonComponent {
5801
5762
  });
5802
5763
  }
5803
5764
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SpeechToTextButtonComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
5804
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SpeechToTextButtonComponent, isStandalone: true, selector: "button[kendoSpeechToTextButton]", inputs: { disabled: "disabled", size: "size", rounded: "rounded", fillMode: "fillMode", themeColor: "themeColor", integrationMode: "integrationMode", lang: "lang", continuous: "continuous", interimResults: "interimResults", maxAlternatives: "maxAlternatives" }, outputs: { start: "start", end: "end", result: "result", error: "error", click: "click" }, host: { listeners: { "focus": "onFocus()", "blur": "onBlur()" }, properties: { "class.k-icon-button": "this.iconButtonClass", "class.k-listening": "this.listeningClass", "class.k-speech-to-text-button": "this.speechToTextButtonClass", "class.k-button": "this.classButton", "class.k-disabled": "this.classDisabled", "attr.dir": "this.getDirection", "attr.aria-pressed": "this.ariaPressed" } }, providers: [
5765
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SpeechToTextButtonComponent, isStandalone: true, selector: "button[kendoSpeechToTextButton]", inputs: { disabled: "disabled", size: "size", rounded: "rounded", fillMode: "fillMode", themeColor: "themeColor", integrationMode: "integrationMode", lang: "lang", continuous: "continuous", interimResults: "interimResults", maxAlternatives: "maxAlternatives" }, outputs: { start: "start", end: "end", result: "result", error: "error", click: "click" }, host: { listeners: { "focus": "onFocus()", "blur": "onBlur()" }, properties: { "class.k-icon-button": "this.iconButtonClass", "class.k-listening": "this.listeningClass", "class.k-speech-to-text-button": "this.speechToTextButtonClass", "class.k-button": "this.classButton", "class.k-disabled": "this.classDisabled", "attr.dir": "this.getDirection" } }, providers: [
5805
5766
  LocalizationService,
5806
5767
  {
5807
5768
  provide: L10N_PREFIX,
@@ -5887,9 +5848,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
5887
5848
  }], getDirection: [{
5888
5849
  type: HostBinding,
5889
5850
  args: ['attr.dir']
5890
- }], ariaPressed: [{
5891
- type: HostBinding,
5892
- args: ['attr.aria-pressed']
5893
5851
  }], onFocus: [{
5894
5852
  type: HostListener,
5895
5853
  args: ['focus']
@@ -13,8 +13,8 @@ import { FabOffset } from './models/offset';
13
13
  import { DialItemAnimation } from './models/item-animation.interface';
14
14
  import { FabPositionMode } from './models/position-mode';
15
15
  import { DialItemClickEvent } from './models/item-click.event';
16
- import { ButtonSize } from '../common/models/size';
17
- import { ButtonThemeColor } from '../common/models/theme-color';
16
+ import { FloatingActionButtonSize } from '../common/models/size';
17
+ import { FloatingActionButtonThemeColor } from '../common/models/theme-color';
18
18
  import { PreventableEvent } from '../preventable-event';
19
19
  import { DialItemTemplateDirective } from './templates/dial-item-template.directive';
20
20
  import { FloatingActionButtonTemplateDirective } from './templates/fab-template.directive';
@@ -54,13 +54,13 @@ export declare class FloatingActionButtonComponent implements AfterViewInit, OnD
54
54
  /**
55
55
  * Specifies the theme color of the FloatingActionButton ([see example](https://www.telerik.com/kendo-angular-ui/components/buttons/floatingactionbutton/appearance#theme-colors)). The default value is set by the Kendo theme.
56
56
  */
57
- set themeColor(themeColor: ButtonThemeColor);
58
- get themeColor(): ButtonThemeColor;
57
+ set themeColor(themeColor: FloatingActionButtonThemeColor);
58
+ get themeColor(): FloatingActionButtonThemeColor;
59
59
  /**
60
60
  * Specifies the size of the FloatingActionButton ([see example](https://www.telerik.com/kendo-angular-ui/components/buttons/floatingactionbutton/appearance#size)). The default value is set by the Kendo theme.
61
61
  */
62
- set size(size: ButtonSize);
63
- get size(): ButtonSize;
62
+ set size(size: FloatingActionButtonSize);
63
+ get size(): FloatingActionButtonSize;
64
64
  /**
65
65
  * Specifies the border radius of the FloatingActionButton ([see example](https://www.telerik.com/kendo-angular-ui/components/buttons/floatingactionbutton/appearance#roundness)). The default value is set by the Kendo theme.
66
66
  */
package/index.d.ts CHANGED
@@ -49,8 +49,8 @@ export { SmartPasteButtonModule } from './smartpastebutton/smartpastebutton.modu
49
49
  export { SmartPasteFormField, SmartPasteType, SmartPasteAIRequestData, SmartPasteAIResponse, SmartPasteAIRequestOptions, SmartPasteRequestStartEvent, SmartPasteRequestEndEvent } from './smartpastebutton/models';
50
50
  export { SegmentedControlComponent } from './segmentedcontrol/segmented-control.component';
51
51
  export { SegmentedControlModule } from './segmentedcontrol/segmented-control.module';
52
- export { SegmentedItemSettings, SegmentedControlLayout } from './segmentedcontrol/models';
53
- export { ButtonSize, ChipSize, ButtonRounded, ChipRounded, ButtonFillMode, ChipFillMode, ButtonThemeColor, ChipThemeColor, ArrowIconSettings, ButtonIconPosition } from './common/models';
52
+ export { SegmentedItemSettings, SegmentedControlLayout, SegmentedControlSize } from './segmentedcontrol/models';
53
+ export { ButtonSize, SplitButtonSize, DropDownButtonSize, FloatingActionButtonSize, ChipSize, ButtonRounded, ChipRounded, ButtonFillMode, ChipFillMode, ButtonThemeColor, ChipThemeColor, FloatingActionButtonThemeColor, ArrowIconSettings, ButtonIconPosition } from './common/models';
54
54
  export { FocusableDirective } from './focusable/focusable.directive';
55
55
  export { PreventableEvent } from './preventable-event';
56
56
  export { ToggleButtonTabStopDirective } from '@progress/kendo-angular-common';
@@ -7,7 +7,7 @@ export const packageMetadata = {
7
7
  "productCodes": [
8
8
  "KENDOUIANGULAR"
9
9
  ],
10
- "publishDate": 1776940371,
11
- "version": "24.0.0-develop.3",
10
+ "publishDate": 1778841557,
11
+ "version": "24.0.0-develop.31",
12
12
  "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
13
13
  };