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

package/esm2022/layout.module.mjs

@@ -1,89 +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_LAYOUT } from './directives';
-import * as i0 from "@angular/core";
-import * as i1 from "./avatar/avatar.component";
-import * as i2 from "./avatar/l10n/custom-messages.component";
-import * as i3 from "./card/card.component";
-import * as i4 from "./card/card-actions.component";
-import * as i5 from "./card/card-body.component";
-import * as i6 from "./card/card-footer.component";
-import * as i7 from "./card/card-header.component";
-import * as i8 from "./card/directives/card-media.directive";
-import * as i9 from "./card/directives/card-separator.directive";
-import * as i10 from "./card/directives/card-subtitle.directive";
-import * as i11 from "./card/directives/card-title.directive";
-import * as i12 from "./drawer/drawer.component";
-import * as i13 from "./drawer/drawer-container.component";
-import * as i14 from "./drawer/drawer-content.component";
-import * as i15 from "./drawer/template-directives/drawer-template.directive";
-import * as i16 from "./drawer/template-directives/footer-template.directive";
-import * as i17 from "./drawer/template-directives/header-template.directive";
-import * as i18 from "./drawer/template-directives/item-template.directive";
-import * as i19 from "./expansionpanel/expansionpanel.component";
-import * as i20 from "./expansionpanel/expansionpanel-title.directive";
-import * as i21 from "./layouts/grid-layout.component";
-import * as i22 from "./layouts/gridlayout-item.component";
-import * as i23 from "./panelbar/panelbar.component";
-import * as i24 from "./panelbar/panelbar-item.component";
-import * as i25 from "./panelbar/panelbar-content.directive";
-import * as i26 from "./panelbar/panelbar-item-template.directive";
-import * as i27 from "./panelbar/panelbar-item-title.directive";
-import * as i28 from "./splitter/splitter.component";
-import * as i29 from "./splitter/splitter-pane.component";
-import * as i30 from "./layouts/stack-layout.component";
-import * as i31 from "./stepper/stepper.component";
-import * as i32 from "./stepper/localization/custom-messages.component";
-import * as i33 from "./stepper/template-directives/indicator-template.directive";
-import * as i34 from "./stepper/template-directives/label-template.directive";
-import * as i35 from "./stepper/template-directives/step-template.directive";
-import * as i36 from "./tabstrip/tabstrip.component";
-import * as i37 from "./tabstrip/models/tabstrip-tab.component";
-import * as i38 from "./tabstrip/directives/tab-content.directive";
-import * as i39 from "./tabstrip/directives/tab-title.directive";
-import * as i40 from "./tabstrip/localization/custom-messages.component";
-import * as i41 from "./tilelayout/tilelayout.component";
-import * as i42 from "./tilelayout/tilelayout-item-body.component";
-import * as i43 from "./tilelayout/tilelayout-item.component";
-import * as i44 from "./tilelayout/tilelayout-item-header.component";
-import * as i45 from "./timeline/timeline.component";
-import * as i46 from "./timeline/localization/custom-messages.component";
-import * as i47 from "./timeline/templates/timeline-card-actions.directive";
-import * as i48 from "./timeline/templates/timeline-card-body.directive";
-import * as i49 from "./timeline/templates/timeline-card-header.directive";
-// IMPORTANT: NgModule export kept for backwards compatibility
-/**
- * Defines the [`NgModule`](link:site.data.urls.angular['ngmoduleapi']) for the Layout components.
- *
- * Use this module to add all Layout package components to your NgModule-based Angular application.
- *
- * @example
- * ```typescript
- * import { LayoutModule } from '@progress/kendo-angular-layout';
- * import { NgModule } from '@angular/core';
- * import { BrowserModule } from '@angular/platform-browser';
- * import { AppComponent } from './app.component';
- *
- * @NgModule({
- *   declarations: [AppComponent],
- *   imports: [BrowserModule, LayoutModule],
- *   bootstrap: [AppComponent]
- * })
- * export class AppModule { }
- * ```
- */
-export class LayoutModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: LayoutModule, imports: [i1.AvatarComponent, i2.AvatarCustomMessagesComponent, i3.CardComponent, i4.CardActionsComponent, i5.CardBodyComponent, i6.CardFooterComponent, i7.CardHeaderComponent, i8.CardMediaDirective, i9.CardSeparatorDirective, i10.CardSubtitleDirective, i11.CardTitleDirective, i12.DrawerComponent, i13.DrawerContainerComponent, i14.DrawerContentComponent, i15.DrawerTemplateDirective, i16.DrawerFooterTemplateDirective, i17.DrawerHeaderTemplateDirective, i18.DrawerItemTemplateDirective, i19.ExpansionPanelComponent, i20.ExpansionPanelTitleDirective, i21.GridLayoutComponent, i22.GridLayoutItemComponent, i23.PanelBarComponent, i24.PanelBarItemComponent, i25.PanelBarContentDirective, i26.PanelBarItemTemplateDirective, i27.PanelBarItemTitleDirective, i28.SplitterComponent, i29.SplitterPaneComponent, i30.StackLayoutComponent, i31.StepperComponent, i32.StepperCustomMessagesComponent, i33.StepperIndicatorTemplateDirective, i34.StepperLabelTemplateDirective, i35.StepperStepTemplateDirective, i36.TabStripComponent, i37.TabStripTabComponent, i38.TabContentDirective, i39.TabTitleDirective, i40.TabStripCustomMessagesComponent, i41.TileLayoutComponent, i42.TileLayoutItemBodyComponent, i43.TileLayoutItemComponent, i44.TileLayoutItemHeaderComponent, i45.TimelineComponent, i46.TimelineCustomMessagesComponent, i47.TimelineCardActionsTemplateDirective, i48.TimelineCardBodyTemplateDirective, i49.TimelineCardHeaderTemplateDirective], exports: [i1.AvatarComponent, i2.AvatarCustomMessagesComponent, i3.CardComponent, i4.CardActionsComponent, i5.CardBodyComponent, i6.CardFooterComponent, i7.CardHeaderComponent, i8.CardMediaDirective, i9.CardSeparatorDirective, i10.CardSubtitleDirective, i11.CardTitleDirective, i12.DrawerComponent, i13.DrawerContainerComponent, i14.DrawerContentComponent, i15.DrawerTemplateDirective, i16.DrawerFooterTemplateDirective, i17.DrawerHeaderTemplateDirective, i18.DrawerItemTemplateDirective, i19.ExpansionPanelComponent, i20.ExpansionPanelTitleDirective, i21.GridLayoutComponent, i22.GridLayoutItemComponent, i23.PanelBarComponent, i24.PanelBarItemComponent, i25.PanelBarContentDirective, i26.PanelBarItemTemplateDirective, i27.PanelBarItemTitleDirective, i28.SplitterComponent, i29.SplitterPaneComponent, i30.StackLayoutComponent, i31.StepperComponent, i32.StepperCustomMessagesComponent, i33.StepperIndicatorTemplateDirective, i34.StepperLabelTemplateDirective, i35.StepperStepTemplateDirective, i36.TabStripComponent, i37.TabStripTabComponent, i38.TabContentDirective, i39.TabTitleDirective, i40.TabStripCustomMessagesComponent, i41.TileLayoutComponent, i42.TileLayoutItemBodyComponent, i43.TileLayoutItemComponent, i44.TileLayoutItemHeaderComponent, i45.TimelineComponent, i46.TimelineCustomMessagesComponent, i47.TimelineCardActionsTemplateDirective, i48.TimelineCardBodyTemplateDirective, i49.TimelineCardHeaderTemplateDirective] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LayoutModule, imports: [i1.AvatarComponent, i12.DrawerComponent, i19.ExpansionPanelComponent, i23.PanelBarComponent, i24.PanelBarItemComponent, i28.SplitterComponent, i31.StepperComponent, i36.TabStripComponent, i41.TileLayoutComponent, i45.TimelineComponent] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LayoutModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    exports: [...KENDO_LAYOUT],
-                    imports: [...KENDO_LAYOUT]
-                }]
-        }] });

package/esm2022/layouts/grid-layout.component.mjs

@@ -1,179 +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, HostBinding, Input, Renderer2, ElementRef, isDevMode } from '@angular/core';
-import { validatePackage } from '@progress/kendo-licensing';
-import { packageMetadata } from '../package-metadata';
-import { ALIGN_PREFIX, generateGapStyle, generateGridStyle, GRID_JUSTIFY_PREFIX, normalizeGap, VERTICAL_SUFFIX, validateGridLayoutRowsCols } from './util';
-import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
-import { isPresent } from '../common/util';
-import { isChanged } from '@progress/kendo-angular-common';
-import * as i0 from "@angular/core";
-import * as i1 from "@progress/kendo-angular-l10n";
-/**
- * Represents the Kendo UI GridLayout component for Angular.
- * Arranges child components in a two-dimensional grid layout with customizable rows, columns, and gaps ([see overview]({% slug overview_gridlayout %})).
- *
- * @example
- * ```html
- * <kendo-gridlayout [rows]="[100, 200]" [cols]="['1fr', '2fr']" [gap]="10">
- *   <kendo-gridlayout-item [row]="1" [col]="1">
- *     <p>Item 1</p>
- *   </kendo-gridlayout-item>
- *   <kendo-gridlayout-item [row]="1" [col]="2">
- *     <p>Item 2</p>
- *   </kendo-gridlayout-item>
- * </kendo-gridlayout>
- * ```
- *
- * @remarks
- * Supported children components are: {@link GridLayoutItemComponent}.
- */
-export class GridLayoutComponent {
-    renderer;
-    element;
-    localization;
-    hostClass = true;
-    get dir() {
-        return this.direction;
-    }
-    /**
-     * Specifies the number of rows and their height
-     * ([More details](slug:layout_gridlayout#toc-rows-and-columns)).
-     *
-     * You can define rows by passing an array where the number of elements determines the number of rows or each element defines the size of the corresponding row.
-     * For example, you can use CSS units like `px`, `%`, `fr`, or `auto` to define the row sizes.
-     */
-    rows;
-    /**
-     * Specifies the number of columns and their widths
-     * ([More details](slug:layout_gridlayout#toc-rows-and-columns)).
-     *
-     * You can define columns by passing an array where the number of elements determines the number of columns or each element defines the size of the corresponding column.
-     * For example, you can use CSS units like `px`, `%`, `fr`, or `auto` to define the column sizes.
-     */
-    cols;
-    /**
-     * Specifies the gaps between the elements ([see example](slug:layout_gridlayout#toc-gap)).
-     *
-     * @default 0
-     */
-    gap = 0;
-    /**
-     * Specifies the horizontal and vertical alignment of the inner GridLayout elements
-     * ([see example]({% slug layout_gridlayout %}#toc-alignment)).
-     */
-    set align(align) {
-        this._align = Object.assign({}, this._align, align);
-        this.handleAlignClasses();
-    }
-    get align() {
-        return this._align;
-    }
-    _align = {
-        horizontal: 'stretch',
-        vertical: 'stretch'
-    };
-    justifyClass;
-    alignClass;
-    constructor(renderer, element, localization) {
-        this.renderer = renderer;
-        this.element = element;
-        this.localization = localization;
-        validatePackage(packageMetadata);
-    }
-    ngAfterViewInit() {
-        this.handleAlignClasses();
-        this.handleGridTemplateStyling('rows');
-        this.handleGridTemplateStyling('cols');
-        this.setGap();
-    }
-    ngOnChanges(changes) {
-        if (isChanged('gap', changes)) {
-            this.setGap();
-        }
-        if (isChanged('rows', changes)) {
-            this.handleGridTemplateStyling('rows');
-        }
-        if (isChanged('cols', changes)) {
-            this.handleGridTemplateStyling('cols');
-        }
-    }
-    handleAlignClasses() {
-        const elem = this.element.nativeElement;
-        if (isPresent(this.justifyClass)) {
-            this.renderer.removeClass(elem, this.justifyClass);
-        }
-        if (isPresent(this.alignClass)) {
-            this.renderer.removeClass(elem, this.alignClass);
-        }
-        this.justifyClass = `${GRID_JUSTIFY_PREFIX}-${this.align.horizontal}`;
-        this.alignClass = `${ALIGN_PREFIX}-${VERTICAL_SUFFIX[this.align.vertical]}`;
-        this.renderer.addClass(elem, this.justifyClass);
-        this.renderer.addClass(elem, this.alignClass);
-    }
-    setGap() {
-        const parsedGap = normalizeGap(this.gap);
-        const gapStyle = generateGapStyle(parsedGap);
-        this.renderer.setStyle(this.element.nativeElement, 'gap', gapStyle);
-    }
-    handleGridTemplateStyling(type) {
-        if (!isPresent(this[type])) {
-            return;
-        }
-        const isValid = validateGridLayoutRowsCols(this[type]);
-        if (!isValid && isDevMode()) {
-            const valueType = type === 'rows' ? 'GridLayoutRowSize' : 'GridLayoutColSize';
-            throw new Error(`The provided ${type} value contains invalid elements. The array supports values of type number, string or ${valueType}.`);
-        }
-        const gridTemplateStyle = type === 'rows' ? 'grid-template-rows' : 'grid-template-columns';
-        const gridStyle = generateGridStyle(this[type], type);
-        this.renderer.setStyle(this.element.nativeElement, gridTemplateStyle, gridStyle.join(' '));
-    }
-    get direction() {
-        return this.localization.rtl ? 'rtl' : 'ltr';
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GridLayoutComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: GridLayoutComponent, isStandalone: true, selector: "kendo-gridlayout", inputs: { rows: "rows", cols: "cols", gap: "gap", align: "align" }, host: { properties: { "class.k-grid-layout": "this.hostClass", "attr.dir": "this.dir" } }, providers: [
-            LocalizationService,
-            {
-                provide: L10N_PREFIX,
-                useValue: 'kendo.gridlayout'
-            }
-        ], exportAs: ["kendoGridLayout"], usesOnChanges: true, ngImport: i0, template: `
-        <ng-content></ng-content>
-    `, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GridLayoutComponent, decorators: [{
-            type: Component,
-            args: [{
-                    exportAs: 'kendoGridLayout',
-                    selector: 'kendo-gridlayout',
-                    providers: [
-                        LocalizationService,
-                        {
-                            provide: L10N_PREFIX,
-                            useValue: 'kendo.gridlayout'
-                        }
-                    ],
-                    template: `
-        <ng-content></ng-content>
-    `,
-                    standalone: true
-                }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i1.LocalizationService }], propDecorators: { hostClass: [{
-                type: HostBinding,
-                args: ['class.k-grid-layout']
-            }], dir: [{
-                type: HostBinding,
-                args: ['attr.dir']
-            }], rows: [{
-                type: Input
-            }], cols: [{
-                type: Input
-            }], gap: [{
-                type: Input
-            }], align: [{
-                type: Input
-            }] } });

package/esm2022/layouts/gridlayout-item.component.mjs

@@ -1,82 +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, Input, Renderer2, ElementRef } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * Represents the GridLayout item component. Defines the positioning and spanning of individual items within a GridLayout.
- *
- * @example
- * ```html
- * <kendo-gridlayout-item [row]="1" [col]="2" [rowSpan]="2" [colSpan]="1">
- *   <div>Grid item content</div>
- * </kendo-gridlayout-item>
- * ```
- */
-export class GridLayoutItemComponent {
-    renderer;
-    element;
-    /**
-     * Sets the row of the item in the GridLayout
-     * ([see example]({% slug items_gridlayout %}#toc-size-and-position)).
-     */
-    row;
-    /**
-     * Sets the column of the item in the GridLayout
-     * ([see example]({% slug items_gridlayout %}#toc-size-and-position)).
-     */
-    col;
-    /**
-     * Specifies how many rows the item spans ([see example]({% slug items_gridlayout %}#toc-size-and-position)).
-     *
-     * @default 1
-     */
-    rowSpan;
-    /**
-     * Specifies how many columns the item spans ([see example]({% slug items_gridlayout %}#toc-size-and-position)).
-     *
-     * @default 1
-     */
-    colSpan;
-    constructor(renderer, element) {
-        this.renderer = renderer;
-        this.element = element;
-    }
-    ngOnInit() {
-        this.setItemStyle();
-    }
-    ngOnChanges() {
-        this.setItemStyle();
-    }
-    setItemStyle() {
-        const row = this.row || 'auto';
-        const col = this.col || 'auto';
-        const rowSpan = this.rowSpan ? `span ${this.rowSpan}` : 'auto';
-        const colSpan = this.colSpan ? `span ${this.colSpan}` : 'auto';
-        const gridAreaStyle = `${row} / ${col} / ${rowSpan} / ${colSpan}`;
-        this.renderer.setStyle(this.element.nativeElement, 'grid-area', gridAreaStyle);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GridLayoutItemComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: GridLayoutItemComponent, isStandalone: true, selector: "kendo-gridlayout-item", inputs: { row: "row", col: "col", rowSpan: "rowSpan", colSpan: "colSpan" }, usesOnChanges: true, ngImport: i0, template: `
-        <ng-content></ng-content>
-    `, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GridLayoutItemComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-gridlayout-item',
-                    template: `
-        <ng-content></ng-content>
-    `,
-                    standalone: true
-                }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { row: [{
-                type: Input
-            }], col: [{
-                type: Input
-            }], rowSpan: [{
-                type: Input
-            }], colSpan: [{
-                type: Input
-            }] } });

package/esm2022/layouts/models/gridlayout-gap-settings.mjs

@@ -1,5 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-export {};

package/esm2022/layouts/models/gridlayout-row-col-size.mjs

@@ -1,5 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-export {};

package/esm2022/layouts/models/layout-align-settings.mjs

@@ -1,5 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-export {};

package/esm2022/layouts/models/layout-horizontal-align.mjs

@@ -1,5 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-export {};

package/esm2022/layouts/models/layout-vertical-align.mjs

@@ -1,5 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-export {};

package/esm2022/layouts/models.mjs

@@ -1,10 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-export * from './models/layout-align-settings';
-export * from './models/layout-horizontal-align';
-export * from './models/layout-vertical-align';
-export * from './models/gridlayout-gap-settings';
-export * from './models/gridlayout-row-col-size';
-export * from '../common/orientation';

package/esm2022/layouts/stack-layout.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, HostBinding, Input, Renderer2, ElementRef } from '@angular/core';
-import { VERTICAL_SUFFIX, ALIGN_PREFIX, JUSTIFY_PREFIX } from './util';
-import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
-import { isNumber, isPresent } from '../common/util';
-import { validatePackage } from '@progress/kendo-licensing';
-import { packageMetadata } from '../package-metadata';
-import { isChanged } from '@progress/kendo-angular-common';
-import * as i0 from "@angular/core";
-import * as i1 from "@progress/kendo-angular-l10n";
-/**
- * Represents the Kendo UI StackLayout component for Angular.
- * Arranges child components in a single row or column with customizable alignment and spacing ([see overview]({% slug overview_stacklayout %})).
- *
- * @example
- * ```html
- * <kendo-stacklayout orientation="horizontal" [gap]="16">
- *   <button class="k-button">Button 1</button>
- *   <button class="k-button">Button 2</button>
- *   <button class="k-button">Button 3</button>
- * </kendo-stacklayout>
- * ```
- */
-export class StackLayoutComponent {
-    renderer;
-    element;
-    localization;
-    hostClass = true;
-    get horizontalClass() {
-        return this.orientation === 'horizontal';
-    }
-    get verticalClass() {
-        return this.orientation === 'vertical';
-    }
-    get dir() {
-        return this.direction;
-    }
-    /**
-     * Specifies the horizontal and vertical alignment of the inner StackLayout elements
-     * ([see example]({% slug layout_stacklayout %}#toc-alignment)).
-     */
-    set align(align) {
-        this._align = Object.assign({}, this._align, align);
-        this.handleAlignClasses();
-    }
-    get align() {
-        return this._align;
-    }
-    /**
-     * Specifies the gap between the inner StackLayout elements ([see example](slug:layout_stacklayout#toc-gap)).
-     *
-     * @default 0
-     */
-    gap = 0;
-    /**
-     * Specifies the orientation of the StackLayout
-     * ([see example]({% slug layout_stacklayout %}#toc-orientation)).
-     *
-     * @default 'horizontal'
-     */
-    orientation = 'horizontal';
-    _align = {
-        horizontal: 'stretch',
-        vertical: 'stretch'
-    };
-    justifyClass;
-    alignClass;
-    constructor(renderer, element, localization) {
-        this.renderer = renderer;
-        this.element = element;
-        this.localization = localization;
-        validatePackage(packageMetadata);
-    }
-    ngAfterViewInit() {
-        this.handleAlignClasses();
-        this.setGap();
-    }
-    ngOnChanges(changes) {
-        if (isChanged('gap', changes)) {
-            this.setGap();
-        }
-        if (isChanged('orientation', changes)) {
-            this.handleAlignClasses();
-        }
-    }
-    handleAlignClasses() {
-        const elem = this.element.nativeElement;
-        if (isPresent(this.justifyClass)) {
-            this.renderer.removeClass(elem, this.justifyClass);
-        }
-        if (isPresent(this.alignClass)) {
-            this.renderer.removeClass(elem, this.alignClass);
-        }
-        if (this.orientation === 'horizontal') {
-            this.justifyClass = `${JUSTIFY_PREFIX}-${this.align.horizontal}`;
-            this.alignClass = `${ALIGN_PREFIX}-${VERTICAL_SUFFIX[this.align.vertical]}`;
-        }
-        else {
-            this.justifyClass = `${JUSTIFY_PREFIX}-${VERTICAL_SUFFIX[this.align.vertical]}`;
-            this.alignClass = `${ALIGN_PREFIX}-${this.align.horizontal}`;
-        }
-        this.renderer.addClass(elem, this.justifyClass);
-        this.renderer.addClass(elem, this.alignClass);
-    }
-    setGap() {
-        const parsedGap = isNumber(this.gap) ? `${this.gap}px` : this.gap;
-        this.renderer.setStyle(this.element.nativeElement, 'gap', parsedGap);
-    }
-    get direction() {
-        return this.localization.rtl ? 'rtl' : 'ltr';
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StackLayoutComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StackLayoutComponent, isStandalone: true, selector: "kendo-stacklayout", inputs: { align: "align", gap: "gap", orientation: "orientation" }, host: { properties: { "class.k-stack-layout": "this.hostClass", "class.k-hstack": "this.horizontalClass", "class.k-vstack": "this.verticalClass", "attr.dir": "this.dir" } }, providers: [
-            LocalizationService,
-            {
-                provide: L10N_PREFIX,
-                useValue: 'kendo.stacklayout'
-            }
-        ], exportAs: ["kendoStackLayout"], usesOnChanges: true, ngImport: i0, template: `
-        <ng-content></ng-content>
-    `, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StackLayoutComponent, decorators: [{
-            type: Component,
-            args: [{
-                    exportAs: 'kendoStackLayout',
-                    selector: 'kendo-stacklayout',
-                    providers: [
-                        LocalizationService,
-                        {
-                            provide: L10N_PREFIX,
-                            useValue: 'kendo.stacklayout'
-                        }
-                    ],
-                    template: `
-        <ng-content></ng-content>
-    `,
-                    standalone: true
-                }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i1.LocalizationService }], propDecorators: { hostClass: [{
-                type: HostBinding,
-                args: ['class.k-stack-layout']
-            }], horizontalClass: [{
-                type: HostBinding,
-                args: ['class.k-hstack']
-            }], verticalClass: [{
-                type: HostBinding,
-                args: ['class.k-vstack']
-            }], dir: [{
-                type: HostBinding,
-                args: ['attr.dir']
-            }], align: [{
-                type: Input
-            }], gap: [{
-                type: Input
-            }], orientation: [{
-                type: Input
-            }] } });

package/esm2022/layouts/util.mjs

@@ -1,101 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-/**
- * @hidden
- */
-export const VERTICAL_SUFFIX = {
-    top: 'start',
-    middle: 'center',
-    bottom: 'end',
-    stretch: 'stretch'
-};
-/**
- * @hidden
- */
-export const JUSTIFY_PREFIX = `k-justify-content`;
-/**
- * @hidden
- */
-export const GRID_JUSTIFY_PREFIX = `k-justify-items`;
-/**
- * @hidden
- */
-export const ALIGN_PREFIX = `k-align-items`;
-/**
- * @hidden
- */
-export const normalizeGap = (gap) => {
-    if (typeof gap === 'number' || typeof gap === 'string') {
-        return { cols: gap, rows: gap };
-    }
-    else {
-        const parsedGap = {};
-        parsedGap.rows = gap.rows ? gap.rows : 0;
-        parsedGap.cols = gap.cols ? gap.cols : 0;
-        return parsedGap;
-    }
-};
-/**
- * @hidden
- */
-export const generateGapStyle = (gap) => {
-    if (gap.rows === gap.cols) {
-        return typeof gap.rows === 'number' ? `${gap.rows}px` : gap.rows;
-    }
-    else {
-        const rowStyle = `${typeof gap.rows === 'number' ? gap.rows + 'px' : gap.rows}`;
-        const colStyle = `${typeof gap.cols === 'number' ? gap.cols + 'px' : gap.cols}`;
-        return `${rowStyle} ${colStyle}`;
-    }
-};
-/**
- * @hidden
- */
-export const generateGridStyle = (items, itemType) => {
-    const styling = [];
-    items.forEach((item) => {
-        if (typeof item === 'number') {
-            styling.push(`${item}px`);
-        }
-        else if (typeof item === 'string') {
-            styling.push(item);
-        }
-        else {
-            if (itemType === 'rows') {
-                const rowHeight = item.height;
-                if (rowHeight) {
-                    styling.push(typeof rowHeight === 'number' ? `${rowHeight}px` : rowHeight);
-                }
-                else {
-                    styling.push('0px');
-                }
-            }
-            else {
-                const colWidth = item.width;
-                if (colWidth) {
-                    styling.push(typeof colWidth === 'number' ? `${colWidth}px` : colWidth);
-                }
-                else {
-                    styling.push('0px');
-                }
-            }
-        }
-    });
-    return styling;
-};
-/**
- * @hidden
- */
-export const validateGridLayoutRowsCols = (arr) => {
-    for (const el of arr) {
-        const isNum = typeof el === 'number';
-        const isStr = typeof el === 'string';
-        const isObject = typeof el === 'object' && el !== null;
-        if (!isNum && !isStr && !isObject) {
-            return false;
-        }
-    }
-    return true;
-};