import * as i0 from '@angular/core'; import { AfterContentInit, AfterViewInit, OnDestroy, EventEmitter } from '@angular/core'; import * as i2 from 'igniteui-angular/expansion-panel'; import { IExpansionPanelEventArgs, ToggleAnimationSettings, IExpansionPanelCancelableEventArgs, IgxExpansionPanelBase, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelBodyComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelTitleDirective, IgxExpansionPanelIconDirective } from 'igniteui-angular/expansion-panel'; interface IAccordionEventArgs extends IExpansionPanelEventArgs { owner: IgxAccordionComponent; /** Provides a reference to the `IgxExpansionPanelComponent` which was expanded/collapsed. */ panel: IgxExpansionPanelBase; } interface IAccordionCancelableEventArgs extends IExpansionPanelCancelableEventArgs { owner: IgxAccordionComponent; /** Provides a reference to the `IgxExpansionPanelComponent` which is currently expanding/collapsing. */ panel: IgxExpansionPanelBase; /** Enables canceling the expansion/collapse operation. */ cancel: boolean; } /** * IgxAccordion is a container-based component that contains that can house multiple expansion panels. * * @igxModule IgxAccordionModule * * @igxKeywords accordion * * @igxGroup Layouts * * @remarks * The Ignite UI for Angular Accordion component enables the user to navigate among multiple collapsing panels * displayed in a single container. * The accordion offers keyboard navigation and API to control the underlying panels' expansion state. * * @example * ```html * * * ... * * * ``` */ declare class IgxAccordionComponent implements AfterContentInit, AfterViewInit, OnDestroy { private cdr; /** * Get/Set the `id` of the accordion component. * Default value is `"igx-accordion-0"`; * ```html * * ``` * ```typescript * const accordionId = this.accordion.id; * ``` */ id: string; /** @hidden @internal **/ cssClass: string; /** @hidden @internal **/ displayStyle: string; /** * Get/Set the animation settings that panels should use when expanding/collpasing. * * ```html * * ``` * * ```typescript * const customAnimationSettings: ToggleAnimationSettings = { * openAnimation: growVerIn, * closeAnimation: growVerOut * }; * * this.accordion.animationSettings = customAnimationSettings; * ``` */ get animationSettings(): ToggleAnimationSettings; set animationSettings(value: ToggleAnimationSettings); /** * Get/Set how the accordion handles the expansion of the projected expansion panels. * If set to `true`, only a single panel can be expanded at a time, collapsing all others * * ```html * * ... * * ``` * * ```typescript * this.accordion.singleBranchExpand = false; * ``` */ get singleBranchExpand(): boolean; set singleBranchExpand(val: boolean); /** * Emitted before a panel is expanded. * * @remarks * This event is cancelable. * * ```html * * * ``` * *```typescript * public handlePanelExpanding(event: IExpansionPanelCancelableEventArgs){ * const expandedPanel: IgxExpansionPanelComponent = event.panel; * if (expandedPanel.disabled) { * event.cancel = true; * } * } *``` */ panelExpanding: EventEmitter; /** * Emitted after a panel has been expanded. * * ```html * * * ``` * *```typescript * public handlePanelExpanded(event: IExpansionPanelCancelableEventArgs) { * const expandedPanel: IgxExpansionPanelComponent = event.panel; * console.log("Panel is expanded: ", expandedPanel.id); * } *``` */ panelExpanded: EventEmitter; /** * Emitted before a panel is collapsed. * * @remarks * This event is cancelable. * * ```html * * * ``` */ panelCollapsing: EventEmitter; /** * Emitted after a panel has been collapsed. * * ```html * * * ``` */ panelCollapsed: EventEmitter; /** * Get all panels. * * ```typescript * const panels: IgxExpansionPanelComponent[] = this.accordion.panels; * ``` */ get panels(): IgxExpansionPanelComponent[]; private _panels; private _animationSettings; private _expandedPanels; private _expandingPanels; private _destroy$; private _unsubChildren$; private _enabledPanels; private _singleBranchExpand; /** @hidden @internal **/ ngAfterContentInit(): void; /** @hidden @internal **/ ngAfterViewInit(): void; /** @hidden @internal */ ngOnDestroy(): void; /** * Expands all collapsed expansion panels. * * ```typescript * accordion.expandAll(); * ``` */ expandAll(): void; /** * Collapses all expanded expansion panels. * * ```typescript * accordion.collapseAll(); * ``` */ collapseAll(): void; private collapseAllExceptLast; private handleKeydown; private handleNavigation; private handleUpDownArrow; private getNextPanel; private subToChanges; private updatePanelsAnimation; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; static ngAcceptInputType_singleBranchExpand: unknown; } declare const IGX_ACCORDION_DIRECTIVES: readonly [typeof IgxAccordionComponent, typeof IgxExpansionPanelComponent, typeof IgxExpansionPanelHeaderComponent, typeof IgxExpansionPanelBodyComponent, typeof IgxExpansionPanelDescriptionDirective, typeof IgxExpansionPanelTitleDirective, typeof IgxExpansionPanelIconDirective]; /** * @hidden * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components */ declare class IgxAccordionModule { static ɵfac: i0.ɵɵFactoryDeclaration; static ɵmod: i0.ɵɵNgModuleDeclaration; static ɵinj: i0.ɵɵInjectorDeclaration; } export { IGX_ACCORDION_DIRECTIVES, IgxAccordionComponent, IgxAccordionModule }; export type { IAccordionCancelableEventArgs, IAccordionEventArgs };