@progress/kendo-angular-gantt 24.0.0-develop.2 → 24.0.0-develop.21

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

@@ -24,7 +24,7 @@ import { ComponentMessages, LocalizationService, L10N_PREFIX } from '@progress/k
 import * as i4 from '@angular/forms';
 import { FormArray, FormGroup, FormControl, Validators, ReactiveFormsModule } from '@angular/forms';
 import { GridComponent, SelectionDirective, ToolbarTemplateDirective as ToolbarTemplateDirective$1, ColumnComponent as ColumnComponent$1, CellTemplateDirective as CellTemplateDirective$1 } from '@progress/kendo-angular-grid';
-import { ButtonComponent, ButtonGroupComponent, DropDownButtonComponent } from '@progress/kendo-angular-buttons';
+import { ButtonComponent, SegmentedControlComponent, DropDownButtonComponent } from '@progress/kendo-angular-buttons';
 import { DropDownListComponent } from '@progress/kendo-angular-dropdowns';
 import { FormFieldComponent, TextBoxDirective, NumericTextBoxComponent } from '@progress/kendo-angular-inputs';
 import { LabelComponent } from '@progress/kendo-angular-label';
@@ -44,8 +44,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1776936293,
-    version: '24.0.0-develop.2',
+    publishDate: 1778161167,
+    version: '24.0.0-develop.21',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };
 
@@ -3649,7 +3649,7 @@ class GanttTimelineComponent {
           </div>
         </div>
 
-        `, isInline: true, dependencies: [{ kind: "component", type: GanttHeaderTableBodyComponent, selector: "[kendoGanttHeaderTableBody]", inputs: ["groupSlots", "slots"] }, { kind: "directive", type: TimelineScrollableDirective, selector: "[kendoGanttTimelineScrollable]", inputs: ["scrollSettings"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "component", type: GanttTasksTableBodyComponent, selector: "[kendoGanttTasksTableBody]", inputs: ["selectable", "rows", "activeView", "taskContentTemplate", "taskTemplate", "summaryTaskTemplate", "taskClass", "isExpanded", "isTaskSelected", "renderDependencyDragClues"], outputs: ["taskPointerEnter", "taskPointerLeave"] }, { kind: "directive", type: GanttDependencyDirective, selector: "[kendoGanttDependency]", inputs: ["dependency"] }, { kind: "directive", type: i6.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "titleTemplate", "showOn", "showAfter", "callout", "closable", "offset", "tooltipWidth", "tooltipHeight", "tooltipClass", "tooltipContentClass", "collision", "closeTitle", "tooltipTemplate"], exportAs: ["kendoTooltip"] }, { kind: "pipe", type: DatePipe, name: "kendoDate" }, { kind: "pipe", type: NumberPipe, name: "kendoNumber" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None });
+        `, isInline: true, dependencies: [{ kind: "component", type: GanttHeaderTableBodyComponent, selector: "[kendoGanttHeaderTableBody]", inputs: ["groupSlots", "slots"] }, { kind: "directive", type: TimelineScrollableDirective, selector: "[kendoGanttTimelineScrollable]", inputs: ["scrollSettings"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "component", type: GanttTasksTableBodyComponent, selector: "[kendoGanttTasksTableBody]", inputs: ["selectable", "rows", "activeView", "taskContentTemplate", "taskTemplate", "summaryTaskTemplate", "taskClass", "isExpanded", "isTaskSelected", "renderDependencyDragClues"], outputs: ["taskPointerEnter", "taskPointerLeave"] }, { kind: "directive", type: GanttDependencyDirective, selector: "[kendoGanttDependency]", inputs: ["dependency"] }, { kind: "directive", type: i6.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "titleTemplate", "showOn", "showAfter", "callout", "closable", "offset", "tooltipWidth", "tooltipHeight", "tooltipClass", "themeColor", "tooltipContentClass", "collision", "closeTitle", "tooltipTemplate"], exportAs: ["kendoTooltip"] }, { kind: "pipe", type: DatePipe, name: "kendoDate" }, { kind: "pipe", type: NumberPipe, name: "kendoNumber" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: GanttTimelineComponent, decorators: [{
             type: Component,
@@ -4863,7 +4863,7 @@ class DependenciesTableComponent {
                 </ng-template>
             </kendo-grid-column>
         </kendo-grid>
-    `, isInline: true, dependencies: [{ kind: "component", type: GridComponent, selector: "kendo-grid", inputs: ["data", "pageSize", "height", "rowHeight", "adaptiveMode", "detailRowHeight", "skip", "scrollable", "selectable", "sort", "size", "trackBy", "filter", "group", "virtualColumns", "filterable", "sortable", "pageable", "groupable", "gridResizable", "rowReorderable", "navigable", "autoSize", "rowClass", "rowSticky", "rowSelected", "isRowSelectable", "cellSelected", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "showInactiveTools", "isDetailExpanded", "isGroupExpanded", "dataLayoutMode"], outputs: ["filterChange", "pageChange", "groupChange", "sortChange", "selectionChange", "rowReorder", "dataStateChange", "gridStateChange", "groupExpand", "groupCollapse", "detailExpand", "detailCollapse", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "csvExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "columnStickyChange", "scrollBottom", "contentScroll"], exportAs: ["kendoGrid"] }, { kind: "directive", type: SelectionDirective, selector: "[kendoGridSelectBy]" }, { kind: "directive", type: ToolbarTemplateDirective$1, selector: "[kendoGridToolbarTemplate]", inputs: ["position"] }, { 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: "component", type: ColumnComponent$1, selector: "kendo-grid-column", inputs: ["field", "format", "sortable", "groupable", "editor", "filter", "filterVariant", "filterable", "editable"] }, { kind: "directive", type: CellTemplateDirective$1, selector: "[kendoGridCellTemplate]" }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
+    `, isInline: true, dependencies: [{ kind: "component", type: GridComponent, selector: "kendo-grid", inputs: ["data", "pageSize", "height", "rowHeight", "adaptiveMode", "detailRowHeight", "skip", "scrollable", "selectable", "sort", "size", "trackBy", "filter", "group", "virtualColumns", "filterable", "sortable", "pageable", "groupable", "gridResizable", "rowReorderable", "navigable", "autoSize", "rowClass", "rowSticky", "rowSelected", "isRowSelectable", "cellSelected", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "showInactiveTools", "isDetailExpanded", "isGroupExpanded", "dataLayoutMode", "pinnable", "pinnedTopRows", "pinnedBottomRows", "isRowPinnable"], outputs: ["filterChange", "pageChange", "groupChange", "sortChange", "selectionChange", "rowReorder", "rowPinChange", "dataStateChange", "gridStateChange", "groupExpand", "groupCollapse", "detailExpand", "detailCollapse", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "csvExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "columnStickyChange", "scrollBottom", "contentScroll"], exportAs: ["kendoGrid"] }, { kind: "directive", type: SelectionDirective, selector: "[kendoGridSelectBy]" }, { kind: "directive", type: ToolbarTemplateDirective$1, selector: "[kendoGridToolbarTemplate]", inputs: ["position"] }, { 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: "component", type: ColumnComponent$1, selector: "kendo-grid-column", inputs: ["field", "format", "sortable", "groupable", "editor", "filter", "filterVariant", "filterable", "editable"] }, { kind: "directive", type: CellTemplateDirective$1, selector: "[kendoGridCellTemplate]" }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: DependenciesTableComponent, decorators: [{
             type: Component,
@@ -5165,7 +5165,7 @@ class EditDialogComponent {
                 </button>
             </kendo-dialog-actions>
         </kendo-dialog>
-    `, isInline: true, dependencies: [{ kind: "component", type: DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "closable", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "animation", "themeColor"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { kind: "directive", type: CustomMessagesComponent$1, selector: "kendo-dialog-messages, kendo-window-messages" }, { kind: "component", type: TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "size", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "component", type: TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: TabContentDirective, selector: "[kendoTabContent]" }, { kind: "component", type: TaskFieldsComponent, selector: "kendo-gantt-task-fields" }, { kind: "component", type: DependenciesTableComponent, selector: "kendo-gantt-dependencies-table", inputs: ["tasks", "dependencies", "dependencyType"], outputs: ["dependenciesChange"] }, { kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { 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: "component", type: TreeListSpacerComponent, selector: "kendo-treelist-spacer", inputs: ["width"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
+    `, isInline: true, dependencies: [{ kind: "component", type: DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "closable", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "animation"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { kind: "directive", type: CustomMessagesComponent$1, selector: "kendo-dialog-messages, kendo-window-messages" }, { kind: "component", type: TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "size", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "component", type: TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: TabContentDirective, selector: "[kendoTabContent]" }, { kind: "component", type: TaskFieldsComponent, selector: "kendo-gantt-task-fields" }, { kind: "component", type: DependenciesTableComponent, selector: "kendo-gantt-dependencies-table", inputs: ["tasks", "dependencies", "dependencyType"], outputs: ["dependenciesChange"] }, { kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { 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: "component", type: TreeListSpacerComponent, selector: "kendo-treelist-spacer", inputs: ["width"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: EditDialogComponent, decorators: [{
             type: Component,
@@ -5283,7 +5283,13 @@ class ViewSelectorComponent {
     /**
      * Lists the timeline view types in the current Gantt configuration.
      */
-    views;
+    set views(value) {
+        this._views = value;
+        this.updateSegmentedItems();
+    }
+    get views() {
+        return this._views;
+    }
     /**
      * Sets the current view type.
      * @default 'week'
@@ -5293,14 +5299,27 @@ class ViewSelectorComponent {
      * Fires when the user selects a different view type. The event data contains the type of the new view.
      */
     activeViewChange = new EventEmitter();
+    /**
+     * @hidden
+     */
+    segmentedItems = [];
+    _views = [];
     constructor(localizationService) {
         this.localizationService = localizationService;
     }
     /**
      * @hidden
      */
-    onClick(viewType) {
-        if (viewType !== this.activeView) {
+    get selectedIndex() {
+        const index = this._views.indexOf(this.activeView);
+        return index === -1 ? 0 : index;
+    }
+    /**
+     * @hidden
+     */
+    onSelectedChange(index) {
+        const viewType = this._views[index];
+        if (viewType && viewType !== this.activeView) {
             this.activeViewChange.emit(viewType);
         }
     }
@@ -5316,6 +5335,9 @@ class ViewSelectorComponent {
     onActiveViewChange(event) {
         this.activeViewChange.emit(event.target.value);
     }
+    updateSegmentedItems() {
+        this.segmentedItems = (this._views || []).map(view => ({ text: this.getViewTypeText(view) }));
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ViewSelectorComponent, deps: [{ token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ViewSelectorComponent, isStandalone: true, selector: "kendo-gantt-view-selector", inputs: { views: "views", activeView: "activeView" }, outputs: { activeViewChange: "activeViewChange" }, host: { properties: { "class.k-gantt-views-wrapper": "this.hostClass" } }, ngImport: i0, template: `
         <select
@@ -5327,16 +5349,13 @@ class ViewSelectorComponent {
             <option [value]="view">{{getViewTypeText(view)}}</option>
           }
         </select>
-        <kendo-buttongroup class="k-gantt-views" selection="single" [navigable]="false">
-          @for (view of views; track view) {
-            <button
-              kendoButton
-              type="button"
-              [selected]="view === activeView"
-            (click)="onClick(view)">{{getViewTypeText(view)}}</button>
-          }
-        </kendo-buttongroup>
-        `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex", "navigable"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }, { 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"] }] });
+        <kendo-segmented-control
+          class="k-gantt-views"
+          [items]="segmentedItems"
+          [selected]="selectedIndex"
+          (selectedChange)="onSelectedChange($event)">
+        </kendo-segmented-control>
+        `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: SegmentedControlComponent, selector: "kendo-segmented-control", inputs: ["items", "layoutMode", "size", "selected"], outputs: ["selectedChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ViewSelectorComponent, decorators: [{
             type: Component,
@@ -5352,18 +5371,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
             <option [value]="view">{{getViewTypeText(view)}}</option>
           }
         </select>
-        <kendo-buttongroup class="k-gantt-views" selection="single" [navigable]="false">
-          @for (view of views; track view) {
-            <button
-              kendoButton
-              type="button"
-              [selected]="view === activeView"
-            (click)="onClick(view)">{{getViewTypeText(view)}}</button>
-          }
-        </kendo-buttongroup>
+        <kendo-segmented-control
+          class="k-gantt-views"
+          [items]="segmentedItems"
+          [selected]="selectedIndex"
+          (selectedChange)="onSelectedChange($event)">
+        </kendo-segmented-control>
         `,
                     standalone: true,
-                    imports: [ReactiveFormsModule, ButtonGroupComponent, ButtonComponent]
+                    imports: [ReactiveFormsModule, SegmentedControlComponent]
                 }]
         }], ctorParameters: () => [{ type: i1$1.LocalizationService }], propDecorators: { hostClass: [{
                 type: HostBinding,
@@ -5770,7 +5786,6 @@ class Messages extends ComponentMessages {
      */
     monthViewText;
     /**
-     * @hidden
      * The text of the year view in the ViewSelector component.
      */
     yearViewText;
@@ -7581,7 +7596,7 @@ class GanttComponent {
           i18n-monthViewText="kendo.gantt.monthViewText|The text of the month view in the ViewSelector component"
           monthViewText="Month"
 
-          i18n-yearViewText-disabled="kendo.gantt.yearViewText|The text of the year view in the ViewSelector component"
+          i18n-yearViewText="kendo.gantt.yearViewText|The text of the year view in the ViewSelector component"
           yearViewText="Year"
 
           i18n-addTaskText="kendo.gantt.addTaskText|The text of the DropDownButton in the AddTask component"
@@ -7890,7 +7905,7 @@ class GanttComponent {
             <span>{{ getText('confirmationDialogContent') }}</span>
             <kendo-dialog-actions layout="start">
               <kendo-treelist-spacer></kendo-treelist-spacer>
-              <button kendoButton [primary]="true" (click)="handleDeleteConfirmation()">{{ getText('deleteButtonText') }}</button>
+              <button kendoButton themeColor="primary" (click)="handleDeleteConfirmation()">{{ getText('deleteButtonText') }}</button>
               <button kendoButton (click)="handleConfirmationDialogClose()">{{ getText('cancelButtonText') }}</button>
             </kendo-dialog-actions>
           </kendo-dialog>
@@ -7899,7 +7914,7 @@ class GanttComponent {
         @if (showLicenseWatermark) {
           <div kendoWatermarkOverlay [licenseMessage]="licenseMessage"></div>
         }
-        `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoGanttLocalizedMessages]" }, { kind: "component", type: ToolbarComponent, selector: "kendo-gantt-toolbar", inputs: ["showAddTask", "showViewSelector", "views", "activeView", "toolbarTemplate", "navigable", "position"], outputs: ["activeViewChange"] }, { kind: "component", type: SplitterComponent, selector: "kendo-splitter", inputs: ["orientation", "splitbarWidth", "resizeStep", "splitterBarClass"], outputs: ["layoutChange"], exportAs: ["kendoSplitter"] }, { kind: "component", type: SplitterPaneComponent, selector: "kendo-splitter-pane", inputs: ["order", "size", "splitterBarAttributes", "splitterBarClass", "min", "max", "resizable", "collapsible", "scrollable", "collapsed", "orientation", "containsSplitter", "overlayContent"], outputs: ["sizeChange", "collapsedChange"], exportAs: ["kendoSplitterPane"] }, { kind: "component", type: TreeListComponent, selector: "kendo-treelist", inputs: ["aria-label", "data", "pageSize", "height", "rowHeight", "skip", "scrollable", "sort", "trackBy", "filter", "virtualColumns", "filterable", "sortable", "pageable", "navigable", "autoSize", "rowClass", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "idField", "selectable", "isSelected", "rowReorderable", "columns", "fetchChildren", "hasChildren", "isExpanded"], outputs: ["selectionChange", "filterChange", "pageChange", "sortChange", "dataStateChange", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "scrollBottom", "contentScroll", "expand", "collapse", "expandStateChange", "rowReorder"], exportAs: ["kendoTreeList"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: CustomMessagesComponent$2, selector: "kendo-treelist-messages" }, { kind: "component", type: GanttTimelineComponent, selector: "kendo-gantt-timeline", inputs: ["rows", "slots", "groupSlots", "tableWidth", "activeView", "taskContentTemplate", "taskTemplate", "summaryTaskTemplate", "taskClass", "renderDependencyDragClues", "dragScrollSettings", "currentTimeMarker", "customTooltipTemplate", "customDragTooltipTemplate", "tooltipOptions", "selectable", "isTaskSelected", "isExpanded", "dependencies"], outputs: ["timelineContainerPress", "timelineContainerDrag", "timelineContainerRelease"] }, { kind: "component", type: EditDialogComponent, selector: "kendo-gantt-edit-dialog", inputs: ["data"] }, { kind: "component", type: DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "closable", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "animation", "themeColor"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: TreeListSpacerComponent, selector: "kendo-treelist-spacer", inputs: ["width"] }, { 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: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay], kendo-watermark-overlay", inputs: ["licenseMessage"] }] });
+        `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoGanttLocalizedMessages]" }, { kind: "component", type: ToolbarComponent, selector: "kendo-gantt-toolbar", inputs: ["showAddTask", "showViewSelector", "views", "activeView", "toolbarTemplate", "navigable", "position"], outputs: ["activeViewChange"] }, { kind: "component", type: SplitterComponent, selector: "kendo-splitter", inputs: ["orientation", "splitbarWidth", "resizeStep", "splitterBarClass"], outputs: ["layoutChange"], exportAs: ["kendoSplitter"] }, { kind: "component", type: SplitterPaneComponent, selector: "kendo-splitter-pane", inputs: ["order", "size", "splitterBarAttributes", "splitterBarClass", "min", "max", "resizable", "collapsible", "scrollable", "collapsed", "orientation", "containsSplitter", "overlayContent"], outputs: ["sizeChange", "collapsedChange"], exportAs: ["kendoSplitterPane"] }, { kind: "component", type: TreeListComponent, selector: "kendo-treelist", inputs: ["aria-label", "data", "pageSize", "height", "rowHeight", "skip", "scrollable", "sort", "trackBy", "filter", "virtualColumns", "filterable", "sortable", "pageable", "navigable", "autoSize", "rowClass", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "idField", "selectable", "isSelected", "rowReorderable", "columns", "fetchChildren", "hasChildren", "isExpanded"], outputs: ["selectionChange", "filterChange", "pageChange", "sortChange", "dataStateChange", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "scrollBottom", "contentScroll", "expand", "collapse", "expandStateChange", "rowReorder"], exportAs: ["kendoTreeList"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: CustomMessagesComponent$2, selector: "kendo-treelist-messages" }, { kind: "component", type: GanttTimelineComponent, selector: "kendo-gantt-timeline", inputs: ["rows", "slots", "groupSlots", "tableWidth", "activeView", "taskContentTemplate", "taskTemplate", "summaryTaskTemplate", "taskClass", "renderDependencyDragClues", "dragScrollSettings", "currentTimeMarker", "customTooltipTemplate", "customDragTooltipTemplate", "tooltipOptions", "selectable", "isTaskSelected", "isExpanded", "dependencies"], outputs: ["timelineContainerPress", "timelineContainerDrag", "timelineContainerRelease"] }, { kind: "component", type: EditDialogComponent, selector: "kendo-gantt-edit-dialog", inputs: ["data"] }, { kind: "component", type: DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "closable", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "animation"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: TreeListSpacerComponent, selector: "kendo-treelist-spacer", inputs: ["width"] }, { 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: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay], kendo-watermark-overlay", inputs: ["licenseMessage"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: GanttComponent, decorators: [{
             type: Component,
@@ -8006,7 +8021,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
           i18n-monthViewText="kendo.gantt.monthViewText|The text of the month view in the ViewSelector component"
           monthViewText="Month"
 
-          i18n-yearViewText-disabled="kendo.gantt.yearViewText|The text of the year view in the ViewSelector component"
+          i18n-yearViewText="kendo.gantt.yearViewText|The text of the year view in the ViewSelector component"
           yearViewText="Year"
 
           i18n-addTaskText="kendo.gantt.addTaskText|The text of the DropDownButton in the AddTask component"
@@ -8315,7 +8330,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
             <span>{{ getText('confirmationDialogContent') }}</span>
             <kendo-dialog-actions layout="start">
               <kendo-treelist-spacer></kendo-treelist-spacer>
-              <button kendoButton [primary]="true" (click)="handleDeleteConfirmation()">{{ getText('deleteButtonText') }}</button>
+              <button kendoButton themeColor="primary" (click)="handleDeleteConfirmation()">{{ getText('deleteButtonText') }}</button>
               <button kendoButton (click)="handleConfirmationDialogClose()">{{ getText('cancelButtonText') }}</button>
             </kendo-dialog-actions>
           </kendo-dialog>

package/localization/messages.d.ts

@@ -117,7 +117,6 @@ export declare class Messages extends ComponentMessages {
      */
     monthViewText: string;
     /**
-     * @hidden
      * The text of the year view in the ViewSelector component.
      */
     yearViewText: string;

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = {
   "productCodes": [
     "KENDOUIANGULAR"
   ],
-  "publishDate": 1776936293,
-  "version": "24.0.0-develop.2",
+  "publishDate": 1778161167,
+  "version": "24.0.0-develop.21",
   "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-gantt",
-  "version": "24.0.0-develop.2",
+  "version": "24.0.0-develop.21",
   "description": "Kendo UI Angular Gantt",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -34,7 +34,7 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1776936293,
+      "publishDate": 1778161167,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"
     }
   },
@@ -46,25 +46,25 @@
     "@angular/platform-browser": "19 - 21",
     "@progress/kendo-data-query": "^1.7.3",
     "@progress/kendo-licensing": "^1.11.0",
-    "@progress/kendo-angular-buttons": "24.0.0-develop.2",
-    "@progress/kendo-angular-common": "24.0.0-develop.2",
-    "@progress/kendo-angular-dialog": "24.0.0-develop.2",
-    "@progress/kendo-angular-dropdowns": "24.0.0-develop.2",
-    "@progress/kendo-angular-grid": "24.0.0-develop.2",
-    "@progress/kendo-angular-icons": "24.0.0-develop.2",
-    "@progress/kendo-angular-inputs": "24.0.0-develop.2",
-    "@progress/kendo-angular-intl": "24.0.0-develop.2",
-    "@progress/kendo-angular-l10n": "24.0.0-develop.2",
-    "@progress/kendo-angular-label": "24.0.0-develop.2",
-    "@progress/kendo-angular-layout": "24.0.0-develop.2",
-    "@progress/kendo-angular-popup": "24.0.0-develop.2",
-    "@progress/kendo-angular-tooltip": "24.0.0-develop.2",
-    "@progress/kendo-angular-treelist": "24.0.0-develop.2",
+    "@progress/kendo-angular-buttons": "24.0.0-develop.21",
+    "@progress/kendo-angular-common": "24.0.0-develop.21",
+    "@progress/kendo-angular-dialog": "24.0.0-develop.21",
+    "@progress/kendo-angular-dropdowns": "24.0.0-develop.21",
+    "@progress/kendo-angular-grid": "24.0.0-develop.21",
+    "@progress/kendo-angular-icons": "24.0.0-develop.21",
+    "@progress/kendo-angular-inputs": "24.0.0-develop.21",
+    "@progress/kendo-angular-intl": "24.0.0-develop.21",
+    "@progress/kendo-angular-l10n": "24.0.0-develop.21",
+    "@progress/kendo-angular-label": "24.0.0-develop.21",
+    "@progress/kendo-angular-layout": "24.0.0-develop.21",
+    "@progress/kendo-angular-popup": "24.0.0-develop.21",
+    "@progress/kendo-angular-tooltip": "24.0.0-develop.21",
+    "@progress/kendo-angular-treelist": "24.0.0-develop.21",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "24.0.0-develop.2",
+    "@progress/kendo-angular-schematics": "24.0.0-develop.21",
     "@progress/kendo-common": "^1.0.1",
     "@progress/kendo-date-math": "^1.5.2",
     "@progress/kendo-draggable": "^3.0.0"

package/schematics/ngAdd/index.js

@@ -12,16 +12,16 @@ function default_1(options) {
         // See https://github.com/telerik/kendo-schematics/issues/28
         peerDependencies: {
             // peer deps of the treelist
-            '@progress/kendo-angular-dateinputs': '24.0.0-develop.2',
-            '@progress/kendo-angular-excel-export': '24.0.0-develop.2',
-            '@progress/kendo-angular-pdf-export': '24.0.0-develop.2',
-            '@progress/kendo-angular-utils': '24.0.0-develop.2',
+            '@progress/kendo-angular-dateinputs': '24.0.0-develop.21',
+            '@progress/kendo-angular-excel-export': '24.0.0-develop.21',
+            '@progress/kendo-angular-pdf-export': '24.0.0-develop.21',
+            '@progress/kendo-angular-utils': '24.0.0-develop.21',
             '@progress/kendo-drawing': '^1.0.0',
             // peer deps of the dropdowns
-            '@progress/kendo-angular-treeview': '24.0.0-develop.2',
-            '@progress/kendo-angular-navigation': '24.0.0-develop.2',
+            '@progress/kendo-angular-treeview': '24.0.0-develop.21',
+            '@progress/kendo-angular-navigation': '24.0.0-develop.21',
             // peer dep of the layout
-            '@progress/kendo-angular-progressbar': '24.0.0-develop.2',
+            '@progress/kendo-angular-progressbar': '24.0.0-develop.21',
             // peer dep of the icons
             '@progress/kendo-svg-icons': '^4.0.0'
         } });

package/toolbar/view-selector.component.d.ts

@@ -5,6 +5,7 @@
 import { EventEmitter } from '@angular/core';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { TimelineViewType } from './../models/timeline-view';
+import { SegmentedItemSettings } from '@progress/kendo-angular-buttons';
 import * as i0 from "@angular/core";
 /**
  * The Gantt ViewSelector component. Shows the current view type and lets you switch to another view type.
@@ -15,7 +16,8 @@ export declare class ViewSelectorComponent {
     /**
      * Lists the timeline view types in the current Gantt configuration.
      */
-    views: TimelineViewType[];
+    set views(value: TimelineViewType[]);
+    get views(): TimelineViewType[];
     /**
      * Sets the current view type.
      * @default 'week'
@@ -25,11 +27,20 @@ export declare class ViewSelectorComponent {
      * Fires when the user selects a different view type. The event data contains the type of the new view.
      */
     activeViewChange: EventEmitter<TimelineViewType>;
+    /**
+     * @hidden
+     */
+    segmentedItems: SegmentedItemSettings[];
+    private _views;
     constructor(localizationService: LocalizationService);
     /**
      * @hidden
      */
-    onClick(viewType: TimelineViewType): void;
+    get selectedIndex(): number;
+    /**
+     * @hidden
+     */
+    onSelectedChange(index: number): void;
     /**
      * @hidden
      */
@@ -38,6 +49,7 @@ export declare class ViewSelectorComponent {
      * @hidden
      */
     onActiveViewChange(event: Event): void;
+    private updateSegmentedItems;
     static ɵfac: i0.ɵɵFactoryDeclaration<ViewSelectorComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ViewSelectorComponent, "kendo-gantt-view-selector", never, { "views": { "alias": "views"; "required": false; }; "activeView": { "alias": "activeView"; "required": false; }; }, { "activeViewChange": "activeViewChange"; }, never, never, true, never>;
 }