primeng
Version:
[](https://badge.fury.io/js/primeng) [](https://www.npmjs.com/package/primeng) [ • 9.13 kB
TypeScript
import { AfterContentInit, ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, QueryList, TemplateRef } from '@angular/core';
import { BlockableUI, Header, PrimeTemplate } from 'primeng/api';
import { Subscription } from 'rxjs';
import { AccordionTabCloseEvent, AccordionTabOpenEvent } from './accordion.interface';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "primeng/icons/chevronright";
import * as i3 from "primeng/icons/chevrondown";
import * as i4 from "primeng/api";
/**
* AccordionTab is a helper component for Accordion.
* @group Components
*/
export declare class AccordionTab implements AfterContentInit, OnDestroy {
el: ElementRef;
changeDetector: ChangeDetectorRef;
/**
* Current id state as a string.
* @group Props
*/
id: string | undefined;
/**
* Used to define the header of the tab.
* @group Props
*/
header: string | undefined;
/**
* Inline style of the tab header.
* @group Props
*/
headerStyle: {
[klass: string]: any;
} | null | undefined;
/**
* Inline style of the tab.
* @group Props
*/
tabStyle: {
[klass: string]: any;
} | null | undefined;
/**
* Inline style of the tab content.
* @group Props
*/
contentStyle: {
[klass: string]: any;
} | null | undefined;
/**
* Style class of the tab.
* @group Props
*/
tabStyleClass: string | undefined;
/**
* Style class of the tab header.
* @group Props
*/
headerStyleClass: string | undefined;
/**
* Style class of the tab content.
* @group Props
*/
contentStyleClass: string | undefined;
/**
* Whether the tab is disabled.
* @group Props
*/
disabled: boolean | undefined;
/**
* Whether a lazy loaded panel should avoid getting loaded again on reselection.
* @group Props
*/
cache: boolean;
/**
* Transition options of the animation.
* @group Props
*/
transitionOptions: string;
/**
* Position of the icon.
* @group Props
*/
iconPos: 'end' | 'start';
/**
* The value that returns the selection.
* @group Props
*/
get selected(): boolean;
set selected(val: boolean);
/**
* The aria-level that each accordion header will have. The default value is 2 as per W3C specifications
* @group Props
*/
headerAriaLevel: number;
/**
* Event triggered by changing the choice.
* @param {boolean} value - Boolean value indicates that the option is changed.
* @group Emits
*/
selectedChange: EventEmitter<boolean>;
headerFacet: QueryList<Header>;
templates: QueryList<PrimeTemplate>;
private _selected;
get iconClass(): "p-accordion-toggle-icon-end" | "p-accordion-toggle-icon";
contentTemplate: TemplateRef<any> | undefined;
headerTemplate: TemplateRef<any> | undefined;
iconTemplate: TemplateRef<any> | undefined;
loaded: boolean;
accordion: Accordion;
constructor(accordion: Accordion, el: ElementRef, changeDetector: ChangeDetectorRef);
ngAfterContentInit(): void;
toggle(event?: MouseEvent | KeyboardEvent): boolean;
findTabIndex(): number;
get hasHeaderFacet(): boolean;
onKeydown(event: KeyboardEvent): void;
getTabHeaderActionId(tabId: any): string;
getTabContentId(tabId: any): string;
ngOnDestroy(): void;
static ɵfac: i0.ɵɵFactoryDeclaration<AccordionTab, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<AccordionTab, "p-accordionTab", never, { "id": { "alias": "id"; "required": false; }; "header": { "alias": "header"; "required": false; }; "headerStyle": { "alias": "headerStyle"; "required": false; }; "tabStyle": { "alias": "tabStyle"; "required": false; }; "contentStyle": { "alias": "contentStyle"; "required": false; }; "tabStyleClass": { "alias": "tabStyleClass"; "required": false; }; "headerStyleClass": { "alias": "headerStyleClass"; "required": false; }; "contentStyleClass": { "alias": "contentStyleClass"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "cache": { "alias": "cache"; "required": false; }; "transitionOptions": { "alias": "transitionOptions"; "required": false; }; "iconPos": { "alias": "iconPos"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "headerAriaLevel": { "alias": "headerAriaLevel"; "required": false; }; }, { "selectedChange": "selectedChange"; }, ["headerFacet", "templates"], ["p-header", "*"], false, never>;
static ngAcceptInputType_disabled: unknown;
static ngAcceptInputType_cache: unknown;
static ngAcceptInputType_headerAriaLevel: unknown;
}
/**
* Accordion groups a collection of contents in tabs.
* @group Components
*/
export declare class Accordion implements BlockableUI, AfterContentInit, OnDestroy {
el: ElementRef;
changeDetector: ChangeDetectorRef;
/**
* When enabled, multiple tabs can be activated at the same time.
* @group Props
*/
multiple: boolean;
/**
* Inline style of the tab header and content.
* @group Props
*/
style: {
[klass: string]: any;
} | null | undefined;
/**
* Class of the element.
* @group Props
*/
styleClass: string | undefined;
/**
* Icon of a collapsed tab.
* @group Props
*/
expandIcon: string | undefined;
/**
* Icon of an expanded tab.
* @group Props
*/
collapseIcon: string | undefined;
/**
* Index of the active tab or an array of indexes in multiple mode.
* @group Props
*/
get activeIndex(): number | number[] | null | undefined;
set activeIndex(val: number | number[] | null | undefined);
/**
* When enabled, the focused tab is activated.
* @group Props
*/
selectOnFocus: boolean;
/**
* The aria-level that each accordion header will have. The default value is 2 as per W3C specifications
* @group Props
*/
get headerAriaLevel(): number;
set headerAriaLevel(val: number);
/**
* Callback to invoke when an active tab is collapsed by clicking on the header.
* @param {AccordionTabCloseEvent} event - Custom tab close event.
* @group Emits
*/
onClose: EventEmitter<AccordionTabCloseEvent>;
/**
* Callback to invoke when a tab gets expanded.
* @param {AccordionTabOpenEvent} event - Custom tab open event.
* @group Emits
*/
onOpen: EventEmitter<AccordionTabOpenEvent>;
/**
* Returns the active index.
* @param {number | number[]} value - New index.
* @group Emits
*/
activeIndexChange: EventEmitter<number | number[]>;
tabList: QueryList<AccordionTab> | undefined;
tabListSubscription: Subscription | null;
private _activeIndex;
private _headerAriaLevel;
preventActiveIndexPropagation: boolean;
tabs: AccordionTab[];
constructor(el: ElementRef, changeDetector: ChangeDetectorRef);
onKeydown(event: any): void;
isInput(event: any): boolean;
isTextArea(event: any): boolean;
onTabArrowDownKey(event: any): void;
onTabArrowUpKey(event: any): void;
onTabHomeKey(event: any): void;
changeFocusedTab(element: any): void;
findNextHeaderAction(tabElement: any, selfCheck?: boolean): any;
findPrevHeaderAction(tabElement: any, selfCheck?: boolean): any;
findFirstHeaderAction(): any;
findLastHeaderAction(): any;
onTabEndKey(event: any): void;
ngAfterContentInit(): void;
initTabs(): void;
getBlockableElement(): HTMLElement;
updateSelectionState(): void;
isTabActive(index: any): boolean;
getTabProp(tab: any, name: any): any;
updateActiveIndex(): void;
ngOnDestroy(): void;
static ɵfac: i0.ɵɵFactoryDeclaration<Accordion, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<Accordion, "p-accordion", never, { "multiple": { "alias": "multiple"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "expandIcon": { "alias": "expandIcon"; "required": false; }; "collapseIcon": { "alias": "collapseIcon"; "required": false; }; "activeIndex": { "alias": "activeIndex"; "required": false; }; "selectOnFocus": { "alias": "selectOnFocus"; "required": false; }; "headerAriaLevel": { "alias": "headerAriaLevel"; "required": false; }; }, { "onClose": "onClose"; "onOpen": "onOpen"; "activeIndexChange": "activeIndexChange"; }, ["tabList"], ["*"], false, never>;
static ngAcceptInputType_multiple: unknown;
static ngAcceptInputType_selectOnFocus: unknown;
}
export declare class AccordionModule {
static ɵfac: i0.ɵɵFactoryDeclaration<AccordionModule, never>;
static ɵmod: i0.ɵɵNgModuleDeclaration<AccordionModule, [typeof Accordion, typeof AccordionTab], [typeof i1.CommonModule, typeof i2.ChevronRightIcon, typeof i3.ChevronDownIcon], [typeof Accordion, typeof AccordionTab, typeof i4.SharedModule]>;
static ɵinj: i0.ɵɵInjectorDeclaration<AccordionModule>;
}