@progress/kendo-angular-layout/expansionpanel/expansionpanel.component.d.ts

Kendo UI for Angular Layout Package - a collection of components to create professional application layoyts

/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { AnimationBuilder } from '@angular/animations';
import { EventEmitter, ElementRef, Renderer2, NgZone, OnDestroy, OnInit, AfterViewInit } from '@angular/core';
import { ExpansionPanelTitleDirective } from './expansionpanel-title.directive';
import { LocalizationService } from '@progress/kendo-angular-l10n';
import { ExpansionPanelActionEvent } from './events/action-event';
import { SVGIcon } from '@progress/kendo-svg-icons';
import * as i0 from "@angular/core";
/**
 * Represents the Kendo UI ExpansionPanel component for Angular. Provides an expandable and collapsible content container with customizable header and animation ([see overview]({% slug overview_expansionpanel %})).
 *
 * @example
 * ```html
 * <kendo-expansionpanel
 *   title="Chile"
 *   subtitle="South America"
 *   [expanded]="isExpanded">
 *   There are various theories about the origin of the word Chile.
 * </kendo-expansionpanel>
 * ```
 */
export declare class ExpansionPanelComponent implements OnInit, AfterViewInit, OnDestroy {
    private renderer;
    private hostElement;
    private ngZone;
    private localizationService;
    private builder;
    /**
     * Specifies the primary text in the header of the ExpansionPanel
     * ([see example](slug:title_expansionpanel#toc-titles-and-subtitles)).
     */
    title: string;
    /**
     * Specifies the secondary text in the header of the ExpansionPanel, which renders next to the collapse/expand icon
     * ([see example](slug:title_expansionpanel#toc-titles-and-subtitles)).
     */
    subtitle: string;
    /**
     * Specifies whether the ExpansionPanel is disabled. If disabled, the ExpansionPanel can be neither expanded nor collapsed
     * ([see example]({% slug disabled_expansionpanel %})).
     *
     * @default false
     */
    disabled: boolean;
    /**
     * Specifies whether the ExpansionPanel is expanded. The property supports two-way binding
     * ([see example]({% slug interaction_expansionpanel %}#toc-setting-the-initial-state)).
     *
     * @default false
     */
    set expanded(value: boolean);
    get expanded(): boolean;
    /**
     * Defines an SVG icon for the expanded state of the component.
     * You can use either an [existing Kendo SVG icon](slug:svgicon_list) or a custom one.
     */
    set svgExpandIcon(icon: SVGIcon);
    get svgExpandIcon(): SVGIcon;
    /**
     * Defines an SVG icon for the collapsed state of the component.
     * You can use either an [existing Kendo SVG icon](slug:svgicon_list) or a custom one.
     */
    set svgCollapseIcon(icon: SVGIcon);
    get svgCollapseIcon(): SVGIcon;
    /**
     * Sets a custom icon via CSS class(es) for the collapsed state of the component
     * ([see example]({% slug icons_expansionpanel %}#toc-icons)).
     */
    expandIcon: string;
    /**
     * Sets a custom icon via CSS class(es) for the expanded state of the component
     * ([see example]({% slug icons_expansionpanel %}#toc-icons)).
     */
    collapseIcon: string;
    /**
     * Specifies the animation settings of the ExpansionPanel
     * ([see example]({% slug animations_expansionpanel %})).
     *
     * @default true
     */
    animation?: boolean | number;
    /**
     * Fires when the `expanded` property of the component is updated.
     * Used to provide a two-way binding for the `expanded` property
     * ([see example](slug:events_expansionpanel)).
     */
    expandedChange: EventEmitter<boolean>;
    /**
     * Fires when the expanded state of the ExpansionPanel is about to change. This event is preventable
     * ([see example](slug:events_expansionpanel)).
     */
    action: EventEmitter<ExpansionPanelActionEvent>;
    /**
     * Fires when the ExpansionPanel is expanded. If there is animation it fires when the animation is complete
     * ([see example](slug:events_expansionpanel)).
     */
    expand: EventEmitter<any>;
    /**
     * Fires when the ExpansionPanel is collapsed. If there is animation it fires when the animation is complete
     * ([see example](slug:events_expansionpanel)).
     */
    collapse: EventEmitter<any>;
    /**
     * @hidden
     */
    titleTemplate: ExpansionPanelTitleDirective;
    content: ElementRef;
    header: ElementRef;
    hostClass: boolean;
    get expandedClass(): boolean;
    direction: string;
    /**
     * @hidden
     */
    focused: boolean;
    private animationEnd;
    private subscriptions;
    private _expanded;
    private _svgExpandIcon;
    private _svgCollapseIcon;
    constructor(renderer: Renderer2, hostElement: ElementRef, ngZone: NgZone, localizationService: LocalizationService, builder: AnimationBuilder);
    ngOnInit(): void;
    ngAfterViewInit(): void;
    ngOnDestroy(): void;
    /**
     * @hidden
     */
    initDomEvents(): void;
    /**
     * @hidden
     */
    keyDownHandler(ev: any): void;
    /**
     * @hidden
     */
    onHeaderClick(ev: any): void;
    /**
     * @hidden
     */
    onHeaderAction(): void;
    /**
     * @hidden
     */
    get expanderIndicatorClasses(): string;
    /**
     * @hidden
     */
    get customExpanderIndicatorClasses(): string;
    /**
     * @hidden
     */
    get expanderSvgIcon(): SVGIcon;
    /**
     * Toggles the visibility of the ExpansionPanel
     * ([see example](slug:interaction_expansionpanel#toggling-between-states)).
     *
     * @param expanded Specifies whether the ExpansionPanel will be expanded or collapsed.
     */
    toggle(expanded?: boolean): void;
    private focusExpansionPanel;
    private blurExpansionPanel;
    private setExpanded;
    private animateContent;
    private createPlayer;
    private emitExpandCollapseEvent;
    private addContentHiddenClass;
    private removeContentHiddenClass;
    static ɵfac: i0.ɵɵFactoryDeclaration<ExpansionPanelComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<ExpansionPanelComponent, "kendo-expansionpanel", ["kendoExpansionPanel"], { "title": { "alias": "title"; "required": false; }; "subtitle": { "alias": "subtitle"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "expanded": { "alias": "expanded"; "required": false; }; "svgExpandIcon": { "alias": "svgExpandIcon"; "required": false; }; "svgCollapseIcon": { "alias": "svgCollapseIcon"; "required": false; }; "expandIcon": { "alias": "expandIcon"; "required": false; }; "collapseIcon": { "alias": "collapseIcon"; "required": false; }; "animation": { "alias": "animation"; "required": false; }; }, { "expandedChange": "expandedChange"; "action": "action"; "expand": "expand"; "collapse": "collapse"; }, ["titleTemplate"], ["*"], true, never>;
}