@progress/kendo-angular-buttons 23.3.0-develop.11 → 23.3.0-develop.13

package/buttons.module.d.ts

@@ -17,6 +17,7 @@ import * as i11 from "./splitbutton/localization/custom-messages.component";
 import * as i12 from "@progress/kendo-angular-common";
 import * as i13 from "./speechtotextbutton/speechtotextbutton.component";
 import * as i14 from "./smartpastebutton/smartpastebutton.component";
+import * as i15 from "./segmentedcontrol/segmented-control.component";
 /**
  * Represents the [NgModule](link:site.data.urls.angular['ngmodules'])
  * definition for the Buttons components.
@@ -40,6 +41,6 @@ import * as i14 from "./smartpastebutton/smartpastebutton.component";
  */
 export declare class ButtonsModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ButtonsModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ButtonsModule, never, [typeof i1.ButtonComponent, typeof i1.ButtonComponent, typeof i2.ButtonGroupComponent, typeof i3.DropDownButtonComponent, typeof i4.ButtonItemTemplateDirective, typeof i5.ChipComponent, typeof i5.ChipComponent, typeof i6.ChipListComponent, typeof i7.FloatingActionButtonComponent, typeof i8.DialItemTemplateDirective, typeof i9.FloatingActionButtonTemplateDirective, typeof i10.SplitButtonComponent, typeof i11.SplitButtonCustomMessagesComponent, typeof i12.ToggleButtonTabStopDirective, typeof i4.ButtonItemTemplateDirective, typeof i13.SpeechToTextButtonComponent, typeof i14.SmartPasteButtonComponent, typeof i12.ToggleButtonTabStopDirective], [typeof i1.ButtonComponent, typeof i1.ButtonComponent, typeof i2.ButtonGroupComponent, typeof i3.DropDownButtonComponent, typeof i4.ButtonItemTemplateDirective, typeof i5.ChipComponent, typeof i5.ChipComponent, typeof i6.ChipListComponent, typeof i7.FloatingActionButtonComponent, typeof i8.DialItemTemplateDirective, typeof i9.FloatingActionButtonTemplateDirective, typeof i10.SplitButtonComponent, typeof i11.SplitButtonCustomMessagesComponent, typeof i12.ToggleButtonTabStopDirective, typeof i4.ButtonItemTemplateDirective, typeof i13.SpeechToTextButtonComponent, typeof i14.SmartPasteButtonComponent, typeof i12.ToggleButtonTabStopDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ButtonsModule, never, [typeof i1.ButtonComponent, typeof i1.ButtonComponent, typeof i2.ButtonGroupComponent, typeof i3.DropDownButtonComponent, typeof i4.ButtonItemTemplateDirective, typeof i5.ChipComponent, typeof i5.ChipComponent, typeof i6.ChipListComponent, typeof i7.FloatingActionButtonComponent, typeof i8.DialItemTemplateDirective, typeof i9.FloatingActionButtonTemplateDirective, typeof i10.SplitButtonComponent, typeof i11.SplitButtonCustomMessagesComponent, typeof i12.ToggleButtonTabStopDirective, typeof i4.ButtonItemTemplateDirective, typeof i13.SpeechToTextButtonComponent, typeof i14.SmartPasteButtonComponent, typeof i15.SegmentedControlComponent, typeof i12.ToggleButtonTabStopDirective], [typeof i1.ButtonComponent, typeof i1.ButtonComponent, typeof i2.ButtonGroupComponent, typeof i3.DropDownButtonComponent, typeof i4.ButtonItemTemplateDirective, typeof i5.ChipComponent, typeof i5.ChipComponent, typeof i6.ChipListComponent, typeof i7.FloatingActionButtonComponent, typeof i8.DialItemTemplateDirective, typeof i9.FloatingActionButtonTemplateDirective, typeof i10.SplitButtonComponent, typeof i11.SplitButtonCustomMessagesComponent, typeof i12.ToggleButtonTabStopDirective, typeof i4.ButtonItemTemplateDirective, typeof i13.SpeechToTextButtonComponent, typeof i14.SmartPasteButtonComponent, typeof i15.SegmentedControlComponent, typeof i12.ToggleButtonTabStopDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ButtonsModule>;
 }

package/directives.d.ts

@@ -16,6 +16,7 @@ import { SplitButtonComponent } from './splitbutton/splitbutton.component';
 import { ButtonItemTemplateDirective } from './listbutton/button-item-template.directive';
 import { SpeechToTextButtonComponent } from './speechtotextbutton/speechtotextbutton.component';
 import { SmartPasteButtonComponent } from './smartpastebutton/smartpastebutton.component';
+import { SegmentedControlComponent } from './segmentedcontrol/segmented-control.component';
 /**
  * Use the `KENDO_BUTTON` utility array to add all Button-related components and directives to a standalone Angular component.
  *
@@ -142,6 +143,20 @@ export declare const KENDO_SPEECHTOTEXTBUTTON: readonly [typeof SpeechToTextButt
  * ```
  */
 export declare const KENDO_SMARTPASTEBUTTON: readonly [typeof SmartPasteButtonComponent];
+/**
+ * Use the `KENDO_SEGMENTEDCONTROL` utility array to add all SegmentedControl-related components and directives to a standalone Angular component.
+ *
+ * @example
+ * ```typescript
+ * @Component({
+ *   standalone: true,
+ *   imports: [KENDO_SEGMENTEDCONTROL],
+ *   // ...
+ * })
+ * export class MyComponent {}
+ * ```
+ */
+export declare const KENDO_SEGMENTEDCONTROL: readonly [typeof SegmentedControlComponent];
 /**
  * Use the `KENDO_BUTTONS` utility array to add all `@progress/kendo-angular-buttons`-related components and directives to a standalone Angular component.
  *
@@ -155,4 +170,4 @@ export declare const KENDO_SMARTPASTEBUTTON: readonly [typeof SmartPasteButtonCo
  * export class MyComponent {}
  * ```
  */
-export declare const KENDO_BUTTONS: readonly [typeof ButtonComponent, typeof ButtonComponent, typeof ButtonGroupComponent, typeof DropDownButtonComponent, typeof ButtonItemTemplateDirective, typeof ChipComponent, typeof ChipComponent, typeof ChipListComponent, typeof FloatingActionButtonComponent, typeof DialItemTemplateDirective, typeof FloatingActionButtonTemplateDirective, typeof SplitButtonComponent, typeof SplitButtonCustomMessagesComponent, typeof ToggleButtonTabStopDirective, typeof ButtonItemTemplateDirective, typeof SpeechToTextButtonComponent, typeof SmartPasteButtonComponent];
+export declare const KENDO_BUTTONS: readonly [typeof ButtonComponent, typeof ButtonComponent, typeof ButtonGroupComponent, typeof DropDownButtonComponent, typeof ButtonItemTemplateDirective, typeof ChipComponent, typeof ChipComponent, typeof ChipListComponent, typeof FloatingActionButtonComponent, typeof DialItemTemplateDirective, typeof FloatingActionButtonTemplateDirective, typeof SplitButtonComponent, typeof SplitButtonCustomMessagesComponent, typeof ToggleButtonTabStopDirective, typeof ButtonItemTemplateDirective, typeof SpeechToTextButtonComponent, typeof SmartPasteButtonComponent, typeof SegmentedControlComponent];

package/fesm2022/progress-kendo-angular-buttons.mjs

@@ -3,7 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from '@angular/core';
-import { Injectable, isDevMode, EventEmitter, Input, HostListener, HostBinding, Output, Optional, Component, ContentChildren, Directive, InjectionToken, Inject, ElementRef, ViewContainerRef, ViewChild, ContentChild, forwardRef, SkipSelf, NgModule } from '@angular/core';
+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';
 import { Subject, Subscription, fromEvent, merge, of, Observable, from } from 'rxjs';
 import * as i12 from '@progress/kendo-angular-common';
 import { isDocumentAvailable, isFirefox, isSafari, isChanged, hasObservers, normalizeKeys, Keys, TemplateContextDirective, MultiTabStop, guid, parseCSSClassNames, isPresent as isPresent$1, EventsOutsideAngularDirective, replaceMessagePlaceholder, anyChanged, PreventableEvent as PreventableEvent$1, ToggleButtonTabStopDirective, ResizeBatchService, KENDO_TOGGLEBUTTONTABSTOP } from '@progress/kendo-angular-common';
@@ -49,8 +49,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1774361676,
-    version: '23.3.0-develop.11',
+    publishDate: 1774449930,
+    version: '23.3.0-develop.13',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -6609,6 +6609,257 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 args: ['blur']
             }] } });
 
+const SIZES_MAP = {
+    small: 'sm',
+    medium: 'md',
+    large: 'lg'
+};
+/**
+ * Represents the Kendo UI SegmentedControl component for Angular.
+ *
+ * Renders a group of buttons where only one can be selected at a time,
+ * with a sliding selection indicator.
+ */
+class SegmentedControlComponent {
+    renderer;
+    wrapper;
+    cdr;
+    zone;
+    hostClass = true;
+    get stretchedClass() {
+        return this._layoutMode === 'stretch';
+    }
+    get direction() {
+        return this._direction;
+    }
+    hostRole = 'group';
+    thumb;
+    /**
+     * Specifies the collection of items to render in the SegmentedControl.
+     */
+    set items(value) {
+        this._items = value;
+        this.showSelectionIndicator();
+    }
+    get items() {
+        return this._items;
+    }
+    /**
+     * Specifies the layout mode of the SegmentedControl.
+     *
+     * @default 'compact'
+     */
+    set layoutMode(value) {
+        this._layoutMode = value;
+        this.showSelectionIndicator();
+    }
+    get layoutMode() {
+        return this._layoutMode;
+    }
+    /**
+     * Specifies the size of the SegmentedControl.
+     */
+    set size(size) {
+        const newSize = size;
+        this.handleSizeClass(newSize, this._size);
+        this._size = newSize;
+        this.showSelectionIndicator();
+    }
+    get size() {
+        return this._size;
+    }
+    /**
+     * Specifies the index of the selected button in the `items` array.
+     *
+     * @default 0
+     */
+    set selected(value) {
+        this.selectedButtonIndex = value;
+        this.showSelectionIndicator();
+    }
+    get selected() {
+        return this.selectedButtonIndex;
+    }
+    /**
+     * Fires when the selected button changes. Emits the index of the selected button.
+     */
+    selectedChange = new EventEmitter();
+    /**
+     * @hidden
+     */
+    selectedButtonIndex = 0;
+    _items = [];
+    _size;
+    _layoutMode = 'compact';
+    _direction;
+    subs = new Subscription();
+    constructor(renderer, wrapper, cdr, zone, localization) {
+        this.renderer = renderer;
+        this.wrapper = wrapper;
+        this.cdr = cdr;
+        this.zone = zone;
+        validatePackage(packageMetadata);
+        this._direction = localization.rtl ? 'rtl' : 'ltr';
+        this.subs.add(localization.changes.subscribe(({ rtl }) => {
+            this._direction = rtl ? 'rtl' : 'ltr';
+        }));
+    }
+    ngAfterViewInit() {
+        this.handleSizeClass(this._size, null);
+    }
+    ngOnDestroy() {
+        this.subs.unsubscribe();
+    }
+    /**
+     * @hidden
+     */
+    handleClick(button, index) {
+        if (button.disabled || index === this.selectedButtonIndex) {
+            return;
+        }
+        this.selectedButtonIndex = index;
+        this.selectedChange.emit(index);
+        this.showSelectionIndicator();
+    }
+    /**
+     * @hidden
+     */
+    handleKeydown(event, button) {
+        if (button.disabled && (event.code === Keys.Enter || event.code === Keys.NumpadEnter || event.code === Keys.Space)) {
+            event.preventDefault();
+        }
+    }
+    handleSizeClass(newValue, prevValue) {
+        if (!this.wrapper) {
+            return;
+        }
+        const elem = this.wrapper.nativeElement;
+        const classToRemove = prevValue ? `k-segmented-control-${SIZES_MAP[prevValue]}` : null;
+        const classToAdd = newValue ? `k-segmented-control-${SIZES_MAP[newValue]}` : null;
+        classToRemove && this.renderer.removeClass(elem, classToRemove);
+        classToAdd && this.renderer.addClass(elem, classToAdd);
+    }
+    /**
+     * Updates the thumb position to reflect the currently selected button.
+     */
+    showSelectionIndicator() {
+        this.zone.onStable.pipe(take(1)).subscribe(() => {
+            const element = this.wrapper.nativeElement;
+            const controlRect = element.getBoundingClientRect();
+            const selectedItem = element.querySelector('.k-segmented-control-button.k-selected');
+            const selectionIndicator = this.thumb ? this.thumb.nativeElement : null;
+            if (!selectedItem || !selectionIndicator) {
+                return;
+            }
+            const itemRect = selectedItem.getBoundingClientRect();
+            const left = itemRect.left - controlRect.left;
+            const right = controlRect.right - itemRect.right;
+            this.renderer.setStyle(selectionIndicator, 'left', `${left}px`);
+            this.renderer.setStyle(selectionIndicator, 'right', `${right}px`);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SegmentedControlComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: SegmentedControlComponent, isStandalone: true, selector: "kendo-segmented-control", inputs: { items: "items", layoutMode: "layoutMode", size: "size", selected: "selected" }, outputs: { selectedChange: "selectedChange" }, host: { properties: { "class.k-segmented-control": "this.hostClass", "class.k-segmented-control-stretched": "this.stretchedClass", "attr.dir": "this.direction", "attr.role": "this.hostRole" } }, providers: [
+            LocalizationService,
+            {
+                provide: L10N_PREFIX,
+                useValue: 'kendo.segmentedcontrol'
+            }
+        ], viewQueries: [{ propertyName: "thumb", first: true, predicate: ["thumb"], descendants: true }], ngImport: i0, template: `
+        <div class="k-segmented-control-thumb" #thumb [attr.aria-hidden]="true"></div>
+        @for (button of items; track $index; let idx = $index) {
+            <button type="button"
+                class="k-segmented-control-button"
+                [class.k-disabled]="button.disabled"
+                [attr.aria-disabled]="button.disabled ? true : null"
+                [attr.title]="button.title"
+                [attr.aria-label]="button.title && !button.text ? button.title : null"
+                (click)="handleClick(button, idx)"
+                (keydown)="handleKeydown($event, button)"
+                [class.k-selected]="selectedButtonIndex === idx"
+                [attr.aria-pressed]="selectedButtonIndex === idx ? 'true' : 'false'">
+                @if (button.icon || button.svgIcon) {
+                    <kendo-icon-wrapper
+                        [innerCssClass]="button['iconInnerCssClass'] ? 'k-segmented-control-button-icon ' + button['iconInnerCssClass'] : 'k-segmented-control-button-icon'"
+                        [name]="button.icon"
+                        [svgIcon]="button.svgIcon">
+                    </kendo-icon-wrapper>
+                }
+                @if (button.text) {
+                    <span class="k-segmented-control-button-text">{{button.text}}</span>
+                }
+            </button>
+        }
+    `, isInline: true, dependencies: [{ kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SegmentedControlComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kendo-segmented-control',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [IconWrapperComponent],
+                    providers: [
+                        LocalizationService,
+                        {
+                            provide: L10N_PREFIX,
+                            useValue: 'kendo.segmentedcontrol'
+                        }
+                    ],
+                    template: `
+        <div class="k-segmented-control-thumb" #thumb [attr.aria-hidden]="true"></div>
+        @for (button of items; track $index; let idx = $index) {
+            <button type="button"
+                class="k-segmented-control-button"
+                [class.k-disabled]="button.disabled"
+                [attr.aria-disabled]="button.disabled ? true : null"
+                [attr.title]="button.title"
+                [attr.aria-label]="button.title && !button.text ? button.title : null"
+                (click)="handleClick(button, idx)"
+                (keydown)="handleKeydown($event, button)"
+                [class.k-selected]="selectedButtonIndex === idx"
+                [attr.aria-pressed]="selectedButtonIndex === idx ? 'true' : 'false'">
+                @if (button.icon || button.svgIcon) {
+                    <kendo-icon-wrapper
+                        [innerCssClass]="button['iconInnerCssClass'] ? 'k-segmented-control-button-icon ' + button['iconInnerCssClass'] : 'k-segmented-control-button-icon'"
+                        [name]="button.icon"
+                        [svgIcon]="button.svgIcon">
+                    </kendo-icon-wrapper>
+                }
+                @if (button.text) {
+                    <span class="k-segmented-control-button-text">{{button.text}}</span>
+                }
+            </button>
+        }
+    `
+                }]
+        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i1.LocalizationService }], propDecorators: { hostClass: [{
+                type: HostBinding,
+                args: ['class.k-segmented-control']
+            }], stretchedClass: [{
+                type: HostBinding,
+                args: ['class.k-segmented-control-stretched']
+            }], direction: [{
+                type: HostBinding,
+                args: ['attr.dir']
+            }], hostRole: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], thumb: [{
+                type: ViewChild,
+                args: ['thumb']
+            }], items: [{
+                type: Input
+            }], layoutMode: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], selected: [{
+                type: Input
+            }], selectedChange: [{
+                type: Output
+            }] } });
+
 /**
  * Use the `KENDO_BUTTON` utility array to add all Button-related components and directives to a standalone Angular component.
  *
@@ -6761,6 +7012,22 @@ const KENDO_SPEECHTOTEXTBUTTON = [
 const KENDO_SMARTPASTEBUTTON = [
     SmartPasteButtonComponent
 ];
+/**
+ * Use the `KENDO_SEGMENTEDCONTROL` utility array to add all SegmentedControl-related components and directives to a standalone Angular component.
+ *
+ * @example
+ * ```typescript
+ * @Component({
+ *   standalone: true,
+ *   imports: [KENDO_SEGMENTEDCONTROL],
+ *   // ...
+ * })
+ * export class MyComponent {}
+ * ```
+ */
+const KENDO_SEGMENTEDCONTROL = [
+    SegmentedControlComponent
+];
 /**
  * Use the `KENDO_BUTTONS` utility array to add all `@progress/kendo-angular-buttons`-related components and directives to a standalone Angular component.
  *
@@ -6783,7 +7050,8 @@ const KENDO_BUTTONS = [
     ...KENDO_FLOATINGACTIONBUTTON,
     ...KENDO_SPLITBUTTON,
     ...KENDO_SPEECHTOTEXTBUTTON,
-    ...KENDO_SMARTPASTEBUTTON
+    ...KENDO_SMARTPASTEBUTTON,
+    ...KENDO_SEGMENTEDCONTROL
 ];
 
 //IMPORTANT: NgModule export kept for backwards compatibility
@@ -6886,8 +7154,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
  */
 class ButtonsModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ButtonsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.20", ngImport: i0, type: ButtonsModule, imports: [ButtonComponent, ButtonComponent, ButtonGroupComponent, DropDownButtonComponent, ButtonItemTemplateDirective, ChipComponent, ChipComponent, ChipListComponent, FloatingActionButtonComponent, DialItemTemplateDirective, FloatingActionButtonTemplateDirective, SplitButtonComponent, SplitButtonCustomMessagesComponent, i12.ToggleButtonTabStopDirective, ButtonItemTemplateDirective, SpeechToTextButtonComponent, SmartPasteButtonComponent, i12.ToggleButtonTabStopDirective], exports: [ButtonComponent, ButtonComponent, ButtonGroupComponent, DropDownButtonComponent, ButtonItemTemplateDirective, ChipComponent, ChipComponent, ChipListComponent, FloatingActionButtonComponent, DialItemTemplateDirective, FloatingActionButtonTemplateDirective, SplitButtonComponent, SplitButtonCustomMessagesComponent, i12.ToggleButtonTabStopDirective, ButtonItemTemplateDirective, SpeechToTextButtonComponent, SmartPasteButtonComponent, i12.ToggleButtonTabStopDirective] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ButtonsModule, providers: [IconsService, PopupService, ResizeBatchService], imports: [ButtonComponent, ButtonComponent, DropDownButtonComponent, ChipComponent, ChipComponent, FloatingActionButtonComponent, SplitButtonComponent, SpeechToTextButtonComponent, SmartPasteButtonComponent] });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.20", ngImport: i0, type: ButtonsModule, imports: [ButtonComponent, ButtonComponent, ButtonGroupComponent, DropDownButtonComponent, ButtonItemTemplateDirective, ChipComponent, ChipComponent, ChipListComponent, FloatingActionButtonComponent, DialItemTemplateDirective, FloatingActionButtonTemplateDirective, SplitButtonComponent, SplitButtonCustomMessagesComponent, i12.ToggleButtonTabStopDirective, ButtonItemTemplateDirective, SpeechToTextButtonComponent, SmartPasteButtonComponent, SegmentedControlComponent, i12.ToggleButtonTabStopDirective], exports: [ButtonComponent, ButtonComponent, ButtonGroupComponent, DropDownButtonComponent, ButtonItemTemplateDirective, ChipComponent, ChipComponent, ChipListComponent, FloatingActionButtonComponent, DialItemTemplateDirective, FloatingActionButtonTemplateDirective, SplitButtonComponent, SplitButtonCustomMessagesComponent, i12.ToggleButtonTabStopDirective, ButtonItemTemplateDirective, SpeechToTextButtonComponent, SmartPasteButtonComponent, SegmentedControlComponent, i12.ToggleButtonTabStopDirective] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ButtonsModule, providers: [IconsService, PopupService, ResizeBatchService], imports: [ButtonComponent, ButtonComponent, DropDownButtonComponent, ChipComponent, ChipComponent, FloatingActionButtonComponent, SplitButtonComponent, SpeechToTextButtonComponent, SmartPasteButtonComponent, SegmentedControlComponent] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ButtonsModule, decorators: [{
             type: NgModule,
@@ -7084,9 +7352,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 }]
         }] });
 
+//IMPORTANT: NgModule export kept for backwards compatibility
+/**
+ * Represents the exported package module.
+ *
+ * Required for adding SegmentedControl features in NgModule-based Angular applications.
+ *
+ * The package exports:
+ * - `SegmentedControlComponent`&mdash;The SegmentedControl component class.
+ */
+class SegmentedControlModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SegmentedControlModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.20", ngImport: i0, type: SegmentedControlModule, imports: [SegmentedControlComponent], exports: [SegmentedControlComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SegmentedControlModule, providers: [IconsService], imports: [KENDO_SEGMENTEDCONTROL] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SegmentedControlModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    exports: [...KENDO_SEGMENTEDCONTROL],
+                    imports: [...KENDO_SEGMENTEDCONTROL],
+                    providers: [IconsService]
+                }]
+        }] });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { ButtonComponent as Button, ButtonComponent, ButtonComponent as ButtonDirective, ButtonGroupComponent as ButtonGroup, ButtonGroupComponent, ButtonGroupModule, ButtonItemTemplateDirective, ButtonModule, ButtonsModule, ChipComponent, ChipListComponent, ChipModule, DialItemTemplateDirective, DropDownButtonComponent as DropDownButton, DropDownButtonComponent, DropDownButtonModule, FloatingActionButtonComponent, FloatingActionButtonModule, FloatingActionButtonTemplateDirective, FocusableDirective, KENDO_BUTTON, KENDO_BUTTONGROUP, KENDO_BUTTONS, KENDO_CHIP, KENDO_CHIPLIST, KENDO_DROPDOWNBUTTON, KENDO_FLOATINGACTIONBUTTON, KENDO_SMARTPASTEBUTTON, KENDO_SPEECHTOTEXTBUTTON, KENDO_SPLITBUTTON, KendoButtonService, ListComponent, LocalizedSplitButtonMessagesDirective, PreventableEvent, SmartPasteButtonComponent, SmartPasteButtonModule, SmartPasteRequestEndEvent, SmartPasteRequestStartEvent, SpeechToTextButtonComponent, SpeechToTextButtonModule, SplitButtonComponent as SplitButton, SplitButtonComponent, SplitButtonCustomMessagesComponent, SplitButtonModule };
+export { ButtonComponent as Button, ButtonComponent, ButtonComponent as ButtonDirective, ButtonGroupComponent as ButtonGroup, ButtonGroupComponent, ButtonGroupModule, ButtonItemTemplateDirective, ButtonModule, ButtonsModule, ChipComponent, ChipListComponent, ChipModule, DialItemTemplateDirective, DropDownButtonComponent as DropDownButton, DropDownButtonComponent, DropDownButtonModule, FloatingActionButtonComponent, FloatingActionButtonModule, FloatingActionButtonTemplateDirective, FocusableDirective, KENDO_BUTTON, KENDO_BUTTONGROUP, KENDO_BUTTONS, KENDO_CHIP, KENDO_CHIPLIST, KENDO_DROPDOWNBUTTON, KENDO_FLOATINGACTIONBUTTON, KENDO_SEGMENTEDCONTROL, KENDO_SMARTPASTEBUTTON, KENDO_SPEECHTOTEXTBUTTON, KENDO_SPLITBUTTON, KendoButtonService, ListComponent, LocalizedSplitButtonMessagesDirective, PreventableEvent, SegmentedControlComponent, SegmentedControlModule, SmartPasteButtonComponent, SmartPasteButtonModule, SmartPasteRequestEndEvent, SmartPasteRequestStartEvent, SpeechToTextButtonComponent, SpeechToTextButtonModule, SplitButtonComponent as SplitButton, SplitButtonComponent, SplitButtonCustomMessagesComponent, SplitButtonModule };
 

package/index.d.ts

@@ -47,6 +47,9 @@ export { SpeechToTextButtonModule } from './speechtotextbutton/speechtotextbutto
 export { SmartPasteButtonComponent } from './smartpastebutton/smartpastebutton.component';
 export { SmartPasteButtonModule } from './smartpastebutton/smartpastebutton.module';
 export { SmartPasteFormField, SmartPasteType, SmartPasteAIRequestData, SmartPasteAIResponse, SmartPasteAIRequestOptions, SmartPasteRequestStartEvent, SmartPasteRequestEndEvent } from './smartpastebutton/models';
+export { SegmentedControlComponent } from './segmentedcontrol/segmented-control.component';
+export { SegmentedControlModule } from './segmentedcontrol/segmented-control.module';
+export { SegmentedItemSettings, SegmentedControlLayout } from './segmentedcontrol/models';
 export { ButtonSize, ChipSize, ButtonRounded, ChipRounded, ButtonFillMode, ChipFillMode, ButtonThemeColor, ChipThemeColor, ArrowIconSettings, ButtonIconPosition } from './common/models';
 export { FocusableDirective } from './focusable/focusable.directive';
 export { PreventableEvent } from './preventable-event';

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = {
   "productCodes": [
     "KENDOUIANGULAR"
   ],
-  "publishDate": 1774361676,
-  "version": "23.3.0-develop.11",
+  "publishDate": 1774449930,
+  "version": "23.3.0-develop.13",
   "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-buttons",
-  "version": "23.3.0-develop.11",
+  "version": "23.3.0-develop.13",
   "description": "Buttons Package for Angular",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -21,7 +21,7 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1774361676,
+      "publishDate": 1774449930,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
     }
   },
@@ -31,15 +31,15 @@
     "@angular/core": "19 - 21",
     "@angular/platform-browser": "19 - 21",
     "@progress/kendo-licensing": "^1.10.0",
-    "@progress/kendo-angular-common": "23.3.0-develop.11",
-    "@progress/kendo-angular-l10n": "23.3.0-develop.11",
-    "@progress/kendo-angular-popup": "23.3.0-develop.11",
-    "@progress/kendo-angular-icons": "23.3.0-develop.11",
+    "@progress/kendo-angular-common": "23.3.0-develop.13",
+    "@progress/kendo-angular-l10n": "23.3.0-develop.13",
+    "@progress/kendo-angular-popup": "23.3.0-develop.13",
+    "@progress/kendo-angular-icons": "23.3.0-develop.13",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "23.3.0-develop.11",
+    "@progress/kendo-angular-schematics": "23.3.0-develop.13",
     "@progress/kendo-common": "^1.0.1",
     "@progress/kendo-webspeech-common": "1.0.1",
     "@progress/kendo-smartpaste-common": "1.0.0"

package/segmentedcontrol/models.d.ts

@@ -0,0 +1,37 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2026 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { SVGIcon } from '@progress/kendo-svg-icons';
+/**
+ * Specifies how the items are sized within the SegmentedControl.
+ * - `compact`—Items take up only the space they need.
+ * - `stretch`—Items stretch to fill the full width of the control.
+ */
+export type SegmentedControlLayout = 'compact' | 'stretch';
+/**
+ * Represents the settings for an item in the `SegmentedControlComponent`.
+ */
+export interface SegmentedItemSettings {
+    /**
+     * Specifies the name of an existing font icon in the Kendo UI theme.
+     */
+    icon?: string;
+    /**
+     * Defines the SVG icon to render inside the button.
+     */
+    svgIcon?: SVGIcon;
+    /**
+     * Specifies the text content of the button.
+     */
+    text?: string;
+    /**
+     * Determines whether the button is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Sets the `title` attribute of the button. When no `text` is provided,
+     * the `title` value also renders as the `aria-label` attribute.
+     */
+    title?: string;
+}

package/segmentedcontrol/segmented-control.component.d.ts

@@ -0,0 +1,81 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2026 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, NgZone, OnDestroy, Renderer2 } from '@angular/core';
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { ButtonSize } from '../common/models';
+import { SegmentedItemSettings, SegmentedControlLayout } from './models';
+import * as i0 from "@angular/core";
+/**
+ * Represents the Kendo UI SegmentedControl component for Angular.
+ *
+ * Renders a group of buttons where only one can be selected at a time,
+ * with a sliding selection indicator.
+ */
+export declare class SegmentedControlComponent implements AfterViewInit, OnDestroy {
+    private renderer;
+    private wrapper;
+    private cdr;
+    private zone;
+    hostClass: boolean;
+    get stretchedClass(): boolean;
+    get direction(): string;
+    hostRole: string;
+    thumb: ElementRef;
+    /**
+     * Specifies the collection of items to render in the SegmentedControl.
+     */
+    set items(value: Array<SegmentedItemSettings>);
+    get items(): Array<SegmentedItemSettings>;
+    /**
+     * Specifies the layout mode of the SegmentedControl.
+     *
+     * @default 'compact'
+     */
+    set layoutMode(value: SegmentedControlLayout);
+    get layoutMode(): SegmentedControlLayout;
+    /**
+     * Specifies the size of the SegmentedControl.
+     */
+    set size(size: ButtonSize);
+    get size(): ButtonSize;
+    /**
+     * Specifies the index of the selected button in the `items` array.
+     *
+     * @default 0
+     */
+    set selected(value: number);
+    get selected(): number;
+    /**
+     * Fires when the selected button changes. Emits the index of the selected button.
+     */
+    selectedChange: EventEmitter<number>;
+    /**
+     * @hidden
+     */
+    selectedButtonIndex: number;
+    private _items;
+    private _size;
+    private _layoutMode;
+    private _direction;
+    private subs;
+    constructor(renderer: Renderer2, wrapper: ElementRef, cdr: ChangeDetectorRef, zone: NgZone, localization: LocalizationService);
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    /**
+     * @hidden
+     */
+    handleClick(button: SegmentedItemSettings, index: number): void;
+    /**
+     * @hidden
+     */
+    handleKeydown(event: KeyboardEvent, button: SegmentedItemSettings): void;
+    private handleSizeClass;
+    /**
+     * Updates the thumb position to reflect the currently selected button.
+     */
+    private showSelectionIndicator;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SegmentedControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SegmentedControlComponent, "kendo-segmented-control", never, { "items": { "alias": "items"; "required": false; }; "layoutMode": { "alias": "layoutMode"; "required": false; }; "size": { "alias": "size"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; }, { "selectedChange": "selectedChange"; }, never, never, true, never>;
+}

package/segmentedcontrol/segmented-control.module.d.ts

@@ -0,0 +1,19 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2026 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import * as i0 from "@angular/core";
+import * as i1 from "./segmented-control.component";
+/**
+ * Represents the exported package module.
+ *
+ * Required for adding SegmentedControl features in NgModule-based Angular applications.
+ *
+ * The package exports:
+ * - `SegmentedControlComponent`—The SegmentedControl component class.
+ */
+export declare class SegmentedControlModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SegmentedControlModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SegmentedControlModule, never, [typeof i1.SegmentedControlComponent], [typeof i1.SegmentedControlComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SegmentedControlModule>;
+}