@progress/kendo-angular-buttons 21.4.1 → 22.0.0-develop.1

package/esm2022/dropdownbutton/dropdownbutton.module.mjs

@@ -1,50 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { NgModule } from '@angular/core';
-import { KENDO_DROPDOWNBUTTON } from '../directives';
-import { PopupService } from '@progress/kendo-angular-popup';
-import { IconsService } from '@progress/kendo-angular-icons';
-import { ResizeBatchService } from '@progress/kendo-angular-common';
-import * as i0 from "@angular/core";
-import * as i1 from "./dropdownbutton.component";
-import * as i2 from "../listbutton/button-item-template.directive";
-//IMPORTANT: NgModule export kept for backwards compatibility
-/**
- * Exports the package module.
- *
- * Required for adding DropDownButton features in NgModule-based Angular applications.
- *
- * The module includes:
- * - `DropDownButtonComponent`—The component class for the DropDownButton.
- * - `ButtonItemTemplateDirective`—The directive for the button item template.
- *
- * @example
- * ```typescript
- * import { DropDownButtonModule } from '@progress/kendo-angular-buttons';
- * import { NgModule } from '@angular/core';
- * import { BrowserModule } from '@angular/platform-browser';
- * import { AppComponent } from './app.component';
- *
- * @NgModule({
- *   declarations: [AppComponent],
- *   imports: [BrowserModule, DropDownButtonModule],
- *   bootstrap: [AppComponent]
- * })
- * export class AppModule {}
- * ```
- */
-export class DropDownButtonModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DropDownButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: DropDownButtonModule, imports: [i1.DropDownButtonComponent, i2.ButtonItemTemplateDirective], exports: [i1.DropDownButtonComponent, i2.ButtonItemTemplateDirective] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DropDownButtonModule, providers: [IconsService, PopupService, ResizeBatchService], imports: [i1.DropDownButtonComponent] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DropDownButtonModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    exports: [...KENDO_DROPDOWNBUTTON],
-                    imports: [...KENDO_DROPDOWNBUTTON],
-                    providers: [IconsService, PopupService, ResizeBatchService]
-                }]
-        }] });

package/esm2022/floatingactionbutton/animations/animations.mjs

@@ -1,33 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { animate, query, sequence, stagger, style } from '@angular/animations';
-/**
- * @hidden
- */
-export function openAnimation(animationSettings) {
-    const isBottom = animationSettings.align.vertical === 'bottom';
-    const duration = animationSettings.duration;
-    const gap = animationSettings.gap;
-    return sequence([
-        query(`.k-fab-item`, [
-            style({ opacity: 0, transform: `translateY(${isBottom ? '8px' : '-8px'})` }),
-            stagger(gap, [animate(`${duration}ms ease-in`, style({ opacity: '*', transform: 'translateY(0)' }))])
-        ], { optional: true })
-    ]);
-}
-/**
- * @hidden
- */
-export function closeAnimation(animationSettings) {
-    const isBottom = animationSettings.align.vertical === 'bottom';
-    const duration = animationSettings.duration;
-    const gap = animationSettings.gap;
-    return sequence([
-        query(`.k-fab-item`, [
-            style({ opacity: '*', transform: 'translateY(0)' }),
-            stagger(-gap, [animate(`${duration}ms ease-in`, style({ opacity: 0, transform: `translateY(${isBottom ? '8px' : '-8px'})` }))])
-        ], { optional: true })
-    ]);
-}

package/esm2022/floatingactionbutton/dial-item.component.mjs

@@ -1,161 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { Component, ElementRef, HostBinding, Input, Renderer2, TemplateRef } from "@angular/core";
-import { LocalizationService } from '@progress/kendo-angular-l10n';
-import { IconWrapperComponent } from "@progress/kendo-angular-icons";
-import { NgTemplateOutlet } from "@angular/common";
-import * as i0 from "@angular/core";
-import * as i1 from "@progress/kendo-angular-l10n";
-/**
- * @hidden
- */
-export class DialItemComponent {
-    element;
-    renderer;
-    localisationService;
-    hostClass = true;
-    role = 'menuitem';
-    get disabledClass() {
-        return this.item.disabled;
-    }
-    get title() {
-        const label = this.item.label;
-        return label || this.itemTitle;
-    }
-    get indexAttr() {
-        return this.index;
-    }
-    cssClass;
-    cssStyle;
-    isFocused;
-    index;
-    item;
-    dialItemTemplate;
-    align;
-    constructor(element, renderer, localisationService) {
-        this.element = element;
-        this.renderer = renderer;
-        this.localisationService = localisationService;
-    }
-    get iconClasses() {
-        const classes = [];
-        if (this.item.iconClass) {
-            classes.push(`${this.item.iconClass}`);
-        }
-        if (this.item.icon) {
-            classes.push(`k-fab-item-icon k-icon k-i-${this.item.icon}`);
-        }
-        return classes;
-    }
-    get itemTitle() {
-        const icon = this.item.icon;
-        const itemTitle = this.item.itemTitle;
-        return (icon && itemTitle) ? itemTitle : icon;
-    }
-    ngAfterViewInit() {
-        const element = this.element.nativeElement;
-        const rtl = this.localisationService.rtl;
-        const hAlign = this.align.horizontal;
-        this.renderer.addClass(element, this.getTextDirectionClass(rtl, hAlign));
-    }
-    getTextDirectionClass(rtl, hAlign) {
-        const dir = rtl ? 'rtl' : 'ltr';
-        const align = hAlign === 'end' ? 'end' : 'start';
-        const directions = {
-            rtl: { end: 'k-text-left', start: 'k-text-right' },
-            ltr: { start: 'k-text-left', end: 'k-text-right' }
-        };
-        return directions[dir][align];
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DialItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: DialItemComponent, isStandalone: true, selector: "[kendoDialItem]", inputs: { cssClass: "cssClass", cssStyle: "cssStyle", isFocused: "isFocused", index: "index", item: "item", dialItemTemplate: "dialItemTemplate", align: "align" }, host: { properties: { "class.k-fab-item": "this.hostClass", "attr.role": "this.role", "attr.aria-disabled": "this.disabledClass", "class.k-disabled": "this.disabledClass", "attr.title": "this.title", "attr.aria-label": "this.title", "attr.data-fab-item-index": "this.indexAttr" } }, ngImport: i0, template: `
-        @if (dialItemTemplate) {
-          <ng-template
-            [ngTemplateOutlet]="dialItemTemplate"
-            [ngTemplateOutletContext]="{ $implicit: item, index: index, isFocused: isFocused }"
-            >
-          </ng-template>
-        }
-        
-        @if (!dialItemTemplate) {
-          @if (item.label) {
-            <span class="k-fab-item-text">{{ item.label }}</span>
-          }
-          @if (item.icon || item.iconClass || item.svgIcon) {
-            <kendo-icon-wrapper
-              [name]="item.icon"
-              innerCssClass="k-fab-item-icon"
-              [customFontClass]="item.iconClass"
-            [svgIcon]="item.svgIcon"></kendo-icon-wrapper>
-          }
-        }
-        `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DialItemComponent, decorators: [{
-            type: Component,
-            args: [{
-                    // eslint-disable-next-line @angular-eslint/component-selector
-                    selector: '[kendoDialItem]',
-                    template: `
-        @if (dialItemTemplate) {
-          <ng-template
-            [ngTemplateOutlet]="dialItemTemplate"
-            [ngTemplateOutletContext]="{ $implicit: item, index: index, isFocused: isFocused }"
-            >
-          </ng-template>
-        }
-        
-        @if (!dialItemTemplate) {
-          @if (item.label) {
-            <span class="k-fab-item-text">{{ item.label }}</span>
-          }
-          @if (item.icon || item.iconClass || item.svgIcon) {
-            <kendo-icon-wrapper
-              [name]="item.icon"
-              innerCssClass="k-fab-item-icon"
-              [customFontClass]="item.iconClass"
-            [svgIcon]="item.svgIcon"></kendo-icon-wrapper>
-          }
-        }
-        `,
-                    standalone: true,
-                    imports: [NgTemplateOutlet, IconWrapperComponent]
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.LocalizationService }], propDecorators: { hostClass: [{
-                type: HostBinding,
-                args: ['class.k-fab-item']
-            }], role: [{
-                type: HostBinding,
-                args: ['attr.role']
-            }], disabledClass: [{
-                type: HostBinding,
-                args: ['attr.aria-disabled']
-            }, {
-                type: HostBinding,
-                args: ['class.k-disabled']
-            }], title: [{
-                type: HostBinding,
-                args: ['attr.title']
-            }, {
-                type: HostBinding,
-                args: ['attr.aria-label']
-            }], indexAttr: [{
-                type: HostBinding,
-                args: ['attr.data-fab-item-index']
-            }], cssClass: [{
-                type: Input
-            }], cssStyle: [{
-                type: Input
-            }], isFocused: [{
-                type: Input
-            }], index: [{
-                type: Input
-            }], item: [{
-                type: Input
-            }], dialItemTemplate: [{
-                type: Input
-            }], align: [{
-                type: Input
-            }] } });

package/esm2022/floatingactionbutton/dial-list.component.mjs

@@ -1,98 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { ChangeDetectorRef, Component, HostBinding, Input, TemplateRef } from "@angular/core";
-import { Subscription } from 'rxjs';
-import { FocusService } from '../focusable/focus.service';
-import { DialItemComponent } from "./dial-item.component";
-import { FocusableDirective } from "../focusable/focusable.directive";
-import { NgClass, NgStyle } from "@angular/common";
-import * as i0 from "@angular/core";
-import * as i1 from "../focusable/focus.service";
-/**
- * @hidden
- */
-export class DialListComponent {
-    focusService;
-    cdr;
-    hostClass = true;
-    get bottomClass() {
-        return this.align.vertical === 'top' || this.align.vertical === 'middle';
-    }
-    get topClass() {
-        return this.align.vertical === 'bottom';
-    }
-    dialItems;
-    dialItemTemplate;
-    align;
-    subscriptions = new Subscription();
-    constructor(focusService, cdr) {
-        this.focusService = focusService;
-        this.cdr = cdr;
-        this.subscriptions.add(this.focusService.onFocus.subscribe(() => this.cdr.detectChanges()));
-    }
-    isFocused(index) {
-        return this.focusService.isFocused(index);
-    }
-    ngOnDestroy() {
-        this.subscriptions.unsubscribe();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DialListComponent, deps: [{ token: i1.FocusService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: DialListComponent, isStandalone: true, selector: "[kendoDialList]", inputs: { dialItems: "dialItems", dialItemTemplate: "dialItemTemplate", align: "align" }, host: { properties: { "class.k-fab-items": "this.hostClass", "class.k-fab-items-bottom": "this.bottomClass", "class.k-fab-items-top": "this.topClass" } }, ngImport: i0, template: `
-        @for (item of dialItems; track item; let idx = $index) {
-          <li
-            kendoButtonFocusable
-            kendoDialItem
-            [item]="dialItems[idx]"
-            [index]="idx"
-            [dialItemTemplate]="dialItemTemplate"
-            [isFocused]="isFocused(idx)"
-            [ngClass]='item.cssClass'
-            [ngStyle]='item.cssStyle'
-            [align]="align"
-            >
-          </li>
-        }
-        `, isInline: true, dependencies: [{ kind: "directive", type: FocusableDirective, selector: "[kendoButtonFocusable]", inputs: ["index"] }, { kind: "component", type: DialItemComponent, selector: "[kendoDialItem]", inputs: ["cssClass", "cssStyle", "isFocused", "index", "item", "dialItemTemplate", "align"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DialListComponent, decorators: [{
-            type: Component,
-            args: [{
-                    // eslint-disable-next-line @angular-eslint/component-selector
-                    selector: '[kendoDialList]',
-                    template: `
-        @for (item of dialItems; track item; let idx = $index) {
-          <li
-            kendoButtonFocusable
-            kendoDialItem
-            [item]="dialItems[idx]"
-            [index]="idx"
-            [dialItemTemplate]="dialItemTemplate"
-            [isFocused]="isFocused(idx)"
-            [ngClass]='item.cssClass'
-            [ngStyle]='item.cssStyle'
-            [align]="align"
-            >
-          </li>
-        }
-        `,
-                    standalone: true,
-                    imports: [FocusableDirective, DialItemComponent, NgClass, NgStyle]
-                }]
-        }], ctorParameters: () => [{ type: i1.FocusService }, { type: i0.ChangeDetectorRef }], propDecorators: { hostClass: [{
-                type: HostBinding,
-                args: ['class.k-fab-items']
-            }], bottomClass: [{
-                type: HostBinding,
-                args: ['class.k-fab-items-bottom']
-            }], topClass: [{
-                type: HostBinding,
-                args: ['class.k-fab-items-top']
-            }], dialItems: [{
-                type: Input
-            }], dialItemTemplate: [{
-                type: Input
-            }], align: [{
-                type: Input
-            }] } });