UNPKG

igniteui-angular

Version:

Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps

806 lines (797 loc) 27.4 kB
import * as i0 from '@angular/core'; import { ElementRef, OnChanges, OnInit, AfterContentInit, OnDestroy, EventEmitter, TemplateRef, SimpleChanges, ChangeDetectorRef, AfterViewInit, Renderer2 } from '@angular/core'; import { IBaseEventArgs, IBaseCancelableBrowserEventArgs, PlatformUtil } from 'igniteui-angular/core'; import { IgxCarouselComponentBase, CarouselAnimationDirection, IgxSlideComponentBase } from 'igniteui-angular/carousel'; import { ToggleAnimationSettings, ToggleAnimationPlayer } from 'igniteui-angular/expansion-panel'; /** * Allows a custom element to be added as an active step indicator. * * @igxModule IgxStepperModule * @igxTheme igx-stepper-theme * @igxKeywords stepper * @igxGroup Layouts * * @example * <igx-stepper> * <ng-template igxStepActiveIndicator> * <igx-icon>edit</igx-icon> * </ng-template> * </igx-stepper> */ declare class IgxStepActiveIndicatorDirective { static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepActiveIndicatorDirective, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<IgxStepActiveIndicatorDirective, "[igxStepActiveIndicator]", never, {}, {}, never, never, true, never>; } /** * Allows a custom element to be added as a complete step indicator. * * @igxModule IgxStepperModule * @igxTheme igx-stepper-theme * @igxKeywords stepper * @igxGroup Layouts * * @example * <igx-stepper> * <ng-template igxStepCompletedIndicator> * <igx-icon>check</igx-icon> * </ng-template> * </igx-stepper> */ declare class IgxStepCompletedIndicatorDirective { static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepCompletedIndicatorDirective, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<IgxStepCompletedIndicatorDirective, "[igxStepCompletedIndicator]", never, {}, {}, never, never, true, never>; } /** * Allows a custom element to be added as an invalid step indicator. * * @igxModule IgxStepperModule * @igxTheme igx-stepper-theme * @igxKeywords stepper * @igxGroup Layouts * * @example * <igx-stepper> * <ng-template igxStepInvalidIndicator> * <igx-icon>error</igx-icon> * </ng-template> * </igx-stepper> */ declare class IgxStepInvalidIndicatorDirective { static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepInvalidIndicatorDirective, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<IgxStepInvalidIndicatorDirective, "[igxStepInvalidIndicator]", never, {}, {}, never, never, true, never>; } /** * Allows a custom element to be added as a step indicator. * * @igxModule IgxStepperModule * @igxTheme igx-stepper-theme * @igxKeywords stepper * @igxGroup Layouts * * @example * <igx-stepper> * <igx-step> * <igx-icon igxStepIndicator>home</igx-icon> * </igx-step> * </igx-stepper> */ declare class IgxStepIndicatorDirective { static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepIndicatorDirective, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<IgxStepIndicatorDirective, "[igxStepIndicator]", never, {}, {}, never, never, true, never>; } /** * Allows a custom element to be added as a step title. * * @igxModule IgxStepperModule * @igxTheme igx-stepper-theme * @igxKeywords stepper * @igxGroup Layouts * * @example * <igx-stepper> * <igx-step> * <p igxStepTitle>Home</p> * </igx-step> * </igx-stepper> */ declare class IgxStepTitleDirective { defaultClass: boolean; static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepTitleDirective, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<IgxStepTitleDirective, "[igxStepTitle]", never, {}, {}, never, never, true, never>; } /** * Allows a custom element to be added as a step subtitle. * * @igxModule IgxStepperModule * @igxTheme igx-stepper-theme * @igxKeywords stepper * @igxGroup Layouts * * @example * <igx-stepper> * <igx-step> * <p igxStepSubtitle>Home Subtitle</p> * </igx-step> * </igx-stepper> */ declare class IgxStepSubtitleDirective { defaultClass: boolean; static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepSubtitleDirective, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<IgxStepSubtitleDirective, "[igxStepSubtitle]", never, {}, {}, never, never, true, never>; } /** * Allows a custom element to be added as a step content. * * @igxModule IgxStepperModule * @igxTheme igx-stepper-theme * @igxKeywords stepper * @igxGroup Layouts * * @example * <igx-stepper> * <igx-step> * <div igxStepContent>...</div> * </igx-step> * </igx-stepper> */ declare class IgxStepContentDirective { private step; private stepperService; elementRef: ElementRef<HTMLElement>; private get target(); defaultClass: boolean; role: string; get stepId(): string; id: string; get tabIndex(): number; set tabIndex(val: number); private _tabIndex; static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepContentDirective, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<IgxStepContentDirective, "[igxStepContent]", never, { "id": { "alias": "id"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, {}, never, never, true, never>; } /** * IgxStepper provides a wizard-like workflow by dividing content into logical steps. * * @igxModule IgxStepperModule * * @igxKeywords stepper * * @igxGroup Layouts * * @remarks * The Ignite UI for Angular Stepper component allows the user to navigate between multiple steps. * It supports horizontal and vertical orientation as well as keyboard navigation and provides API methods to control the active step. * The component offers keyboard navigation and API to control the active step. * * @example * ```html * <igx-stepper> * <igx-step [active]="true"> * <igx-icon igxStepIndicator>home</igx-icon> * <p igxStepTitle>Home</p> * <div igxStepContent> * ... * </div> * </igx-step> * <igx-step [optional]="true"> * <div igxStepContent> * ... * </div> * </igx-step> * <igx-step> * <div igxStepContent> * ... * </div> * </igx-step> * </igx-stepper> * ``` */ declare class IgxStepperComponent extends IgxCarouselComponentBase implements IgxStepper, OnChanges, OnInit, AfterContentInit, OnDestroy { private stepperService; private element; /** * Get/Set the animation type of the stepper when the orientation direction is vertical. * * @remarks * Default value is `grow`. Other possible values are `fade` and `none`. * * ```html * <igx-stepper verticalAnimationType="none"> * <igx-stepper> * ``` */ get verticalAnimationType(): VerticalAnimationType; set verticalAnimationType(value: VerticalAnimationType); /** * Get/Set the animation type of the stepper when the orientation direction is horizontal. * * @remarks * Default value is `grow`. Other possible values are `fade` and `none`. * * ```html * <igx-stepper animationType="none"> * <igx-stepper> * ``` */ get horizontalAnimationType(): HorizontalAnimationType; set horizontalAnimationType(value: HorizontalAnimationType); /** * Get/Set the animation duration. * ```html * <igx-stepper [animationDuration]="500"> * <igx-stepper> * ``` */ get animationDuration(): number; set animationDuration(value: number); /** * Get/Set whether the stepper is linear. * * @remarks * If the stepper is in linear mode and if the active step is valid only then the user is able to move forward. * * ```html * <igx-stepper [linear]="true"></igx-stepper> * ``` */ get linear(): boolean; set linear(value: boolean); /** * Get/Set the stepper orientation. * * ```typescript * this.stepper.orientation = IgxStepperOrientation.Vertical; * ``` */ get orientation(): IgxStepperOrientation; set orientation(value: IgxStepperOrientation); /** * Get/Set the type of the steps. * * ```typescript * this.stepper.stepType = IgxStepType.Indicator; * ``` */ stepType: IgxStepType; /** * Get/Set whether the content is displayed above the steps. * * @remarks * Default value is `false` and the content is below the steps. * * ```typescript * this.stepper.contentTop = true; * ``` */ contentTop: boolean; /** * Get/Set the position of the steps title. * * @remarks * The default value when the stepper is horizontally orientated is `bottom`. * In vertical layout the default title position is `end`. * * ```typescript * this.stepper.titlePosition = IgxStepperTitlePosition.Top; * ``` */ titlePosition: IgxStepperTitlePosition; /** @hidden @internal **/ cssClass: string; /** @hidden @internal **/ role: string; /** @hidden @internal **/ get directionClass(): boolean; /** * Emitted when the stepper's active step is changing. * *```html * <igx-stepper (activeStepChanging)="handleActiveStepChanging($event)"> * </igx-stepper> * ``` * *```typescript * public handleActiveStepChanging(event: IStepChangingEventArgs) { * if (event.newIndex < event.oldIndex) { * event.cancel = true; * } * } *``` */ activeStepChanging: EventEmitter<IStepChangingEventArgs>; /** * Emitted when the active step is changed. * * @example * ``` * <igx-stepper (activeStepChanged)="handleActiveStepChanged($event)"></igx-stepper> * ``` */ activeStepChanged: EventEmitter<IStepChangedEventArgs>; /** @hidden @internal */ invalidIndicatorTemplate: TemplateRef<IgxStepInvalidIndicatorDirective>; /** @hidden @internal */ completedIndicatorTemplate: TemplateRef<IgxStepCompletedIndicatorDirective>; /** @hidden @internal */ activeIndicatorTemplate: TemplateRef<IgxStepActiveIndicatorDirective>; /** @hidden @internal */ private _steps; /** * Get all steps. * * ```typescript * const steps: IgxStepComponent[] = this.stepper.steps; * ``` */ get steps(): IgxStepComponent[]; /** @hidden @internal */ get nativeElement(): HTMLElement; /** @hidden @internal */ verticalAnimationSettings: ToggleAnimationSettings; /** @hidden @internal */ _defaultTitlePosition: IgxStepperTitlePosition; private destroy$; private _orientation; private _verticalAnimationType; private _linear; private readonly _defaultAnimationDuration; constructor(); /** @hidden @internal */ ngOnChanges(changes: SimpleChanges): void; /** @hidden @internal */ ngOnInit(): void; /** @hidden @internal */ ngAfterContentInit(): void; /** @hidden @internal */ ngOnDestroy(): void; /** * Activates the step at a given index. * *```typescript * this.stepper.navigateTo(1); *``` */ navigateTo(index: number): void; /** * Activates the next enabled step. * *```typescript * this.stepper.next(); *``` */ next(): void; /** * Activates the previous enabled step. * *```typescript * this.stepper.prev(); *``` */ prev(): void; /** * Resets the stepper to its initial state i.e. activates the first step. * * @remarks * The steps' content will not be automatically reset. *```typescript * this.stepper.reset(); *``` */ reset(): void; /** @hidden @internal */ playHorizontalAnimations(): void; protected getPreviousElement(): HTMLElement; protected getCurrentElement(): HTMLElement; private updateVerticalAnimationSettings; private updateStepAria; private handleStepChanges; private activateFirstStep; private activateStep; private moveToNextStep; static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepperComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<IgxStepperComponent, "igx-stepper", never, { "verticalAnimationType": { "alias": "verticalAnimationType"; "required": false; }; "horizontalAnimationType": { "alias": "horizontalAnimationType"; "required": false; }; "animationDuration": { "alias": "animationDuration"; "required": false; }; "linear": { "alias": "linear"; "required": false; }; "orientation": { "alias": "orientation"; "required": false; }; "stepType": { "alias": "stepType"; "required": false; }; "contentTop": { "alias": "contentTop"; "required": false; }; "titlePosition": { "alias": "titlePosition"; "required": false; }; }, { "activeStepChanging": "activeStepChanging"; "activeStepChanged": "activeStepChanged"; }, ["invalidIndicatorTemplate", "completedIndicatorTemplate", "activeIndicatorTemplate", "_steps"], ["igx-step"], true, never>; static ngAcceptInputType_linear: unknown; static ngAcceptInputType_contentTop: unknown; } interface IgxStepper extends IgxCarouselComponentBase { steps: IgxStepComponent[]; /** @hidden @internal */ nativeElement: HTMLElement; /** @hidden @internal */ invalidIndicatorTemplate: TemplateRef<IgxStepInvalidIndicatorDirective>; /** @hidden @internal */ completedIndicatorTemplate: TemplateRef<IgxStepCompletedIndicatorDirective>; /** @hidden @internal */ activeIndicatorTemplate: TemplateRef<IgxStepActiveIndicatorDirective>; verticalAnimationType: VerticalAnimationType; horizontalAnimationType: HorizontalAnimationType; animationDuration: number; linear: boolean; orientation: IgxStepperOrientation; stepType: IgxStepType; contentTop: boolean; titlePosition: IgxStepperTitlePosition; /** @hidden @internal */ verticalAnimationSettings: ToggleAnimationSettings; /** @hidden @internal */ _defaultTitlePosition: IgxStepperTitlePosition; activeStepChanging: EventEmitter<IStepChangingEventArgs>; activeStepChanged: EventEmitter<IStepChangedEventArgs>; navigateTo(index: number): void; next(): void; prev(): void; reset(): void; /** @hidden @internal */ playHorizontalAnimations(): void; } interface IgxStep extends ToggleAnimationPlayer { id: string; /** @hidden @internal */ contentTemplate: TemplateRef<any>; /** @hidden @internal */ customIndicatorTemplate: TemplateRef<any>; /** @hidden @internal */ contentContainer: ElementRef; /** @hidden @internal */ indicator: IgxStepIndicatorDirective; /** @hidden @internal */ content: IgxStepContentDirective; /** @hidden @internal */ indicatorTemplate: TemplateRef<any>; index: number; disabled: boolean; completed: boolean; isValid: boolean; optional: boolean; active: boolean; tabIndex: number; /** @hidden @internal */ contentId: string; /** @hidden @internal */ generalDisabled: boolean; /** @hidden @internal */ titlePositionTop: string; /** @hidden @internal */ direction: CarouselAnimationDirection; /** @hidden @internal */ isAccessible: boolean; /** @hidden @internal */ isHorizontal: boolean; /** @hidden @internal */ isTitleVisible: boolean; /** @hidden @internal */ isIndicatorVisible: boolean; /** @hidden @internal */ titlePosition: string; /** @hidden @internal */ linearDisabled: boolean; /** @hidden @internal */ collapsing: boolean; /** @hidden @internal */ animationSettings: ToggleAnimationSettings; /** @hidden @internal */ contentClasses: any; /** @hidden @internal */ stepHeaderClasses: any; /** @hidden @internal */ nativeElement: HTMLElement; /** @hidden @internal */ previous: boolean; cdr: ChangeDetectorRef; activeChange: EventEmitter<boolean>; } interface IStepChangingEventArgs extends IBaseEventArgs, IBaseCancelableBrowserEventArgs { newIndex: number; oldIndex: number; owner: IgxStepper; } interface IStepChangedEventArgs extends IBaseEventArgs { index: number; owner: IgxStepper; } declare const IgxStepperOrientation: { readonly Horizontal: "horizontal"; readonly Vertical: "vertical"; }; type IgxStepperOrientation = (typeof IgxStepperOrientation)[keyof typeof IgxStepperOrientation]; declare const IgxStepType: { readonly Indicator: "indicator"; readonly Title: "title"; readonly Full: "full"; }; type IgxStepType = (typeof IgxStepType)[keyof typeof IgxStepType]; declare const IgxStepperTitlePosition: { readonly Bottom: "bottom"; readonly Top: "top"; readonly End: "end"; readonly Start: "start"; }; type IgxStepperTitlePosition = (typeof IgxStepperTitlePosition)[keyof typeof IgxStepperTitlePosition]; declare const VerticalAnimationType: { readonly Grow: "grow"; readonly Fade: "fade"; readonly None: "none"; }; type VerticalAnimationType = (typeof VerticalAnimationType)[keyof typeof VerticalAnimationType]; declare const HorizontalAnimationType: { readonly none: "none"; readonly slide: "slide"; readonly fade: "fade"; }; type HorizontalAnimationType = (typeof HorizontalAnimationType)[keyof typeof HorizontalAnimationType]; /** @hidden @internal */ declare class IgxStepperService { activeStep: IgxStepComponent; previousActiveStep: IgxStepComponent; focusedStep: IgxStepComponent; collapsingSteps: Set<IgxStepComponent>; linearDisabledSteps: Set<IgxStepComponent>; visitedSteps: Set<IgxStepComponent>; stepper: IgxStepper; /** * Activates the step, fires the steps change event and plays animations. */ expand(step: IgxStepComponent): void; /** * Activates the step and fires the steps change event without playing animations. */ expandThroughApi(step: IgxStepComponent): void; /** * Collapses the currently active step and fires the change event. */ collapse(step: IgxStepComponent): void; /** * Determines the steps that should be marked as visited based on the active step. */ calculateVisitedSteps(): void; /** * Determines the steps that should be disabled in linear mode based on the validity of the active step. */ calculateLinearDisabledSteps(): void; emitActivatingEvent(step: IgxStepComponent): boolean; /** * Updates the linearDisabled steps from the current active step to the next required invalid step. * * @param toIndex the index of the last step that should be enabled. */ private updateLinearDisabledSteps; private getNextRequiredStep; static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepperService, never>; static ɵprov: i0.ɵɵInjectableDeclaration<IgxStepperService>; } /** * The IgxStepComponent is used within the `igx-stepper` element and it holds the content of each step. * It also supports custom indicators, title and subtitle. * * @igxModule IgxStepperModule * * @igxKeywords step * * @example * ```html * <igx-stepper> * ... * <igx-step [active]="true" [completed]="true"> * ... * </igx-step> * ... * </igx-stepper> * ``` */ declare class IgxStepComponent extends ToggleAnimationPlayer implements IgxStep, AfterViewInit, OnDestroy, IgxSlideComponentBase { stepper: IgxStepper; cdr: ChangeDetectorRef; renderer: Renderer2; protected platform: PlatformUtil; protected stepperService: IgxStepperService; private element; private dir; /** * Get/Set the `id` of the step component. * Default value is `"igx-step-0"`; * ```html * <igx-step id="my-first-step"></igx-step> * ``` * ```typescript * const stepId = this.step.id; * ``` */ id: string; /** * Get/Set whether the step is interactable. * * ```html * <igx-stepper> * ... * <igx-step [disabled]="true"></igx-step> * ... * </igx-stepper> * ``` * * ```typescript * this.stepper.steps[1].disabled = true; * ``` */ set disabled(value: boolean); get disabled(): boolean; /** * Get/Set whether the step is completed. * * @remarks * When set to `true` the following separator is styled `solid`. * * ```html * <igx-stepper> * ... * <igx-step [completed]="true"></igx-step> * ... * </igx-stepper> * ``` * * ```typescript * this.stepper.steps[1].completed = true; * ``` */ completed: boolean; /** * Get/Set whether the step is valid. *```html * <igx-step [isValid]="form.form.valid"> * ... * <div igxStepContent> * <form #form="ngForm"> * ... * </form> * </div> * </igx-step> * ``` */ get isValid(): boolean; set isValid(value: boolean); /** * Get/Set whether the step is optional. * * @remarks * Optional steps validity does not affect the default behavior when the stepper is in linear mode i.e. * if optional step is invalid the user could still move to the next step. * * ```html * <igx-step [optional]="true"></igx-step> * ``` * ```typescript * this.stepper.steps[1].optional = true; * ``` */ optional: boolean; /** * Get/Set the active state of the step * * ```html * <igx-step [active]="true"></igx-step> * ``` * * ```typescript * this.stepper.steps[1].active = true; * ``` * * @param value: boolean */ set active(value: boolean); get active(): boolean; /** @hidden @internal */ set tabIndex(value: number); get tabIndex(): number; /** @hidden @internal **/ role: string; /** @hidden @internal */ get contentId(): string; /** @hidden @internal */ cssClass: boolean; /** @hidden @internal */ get generalDisabled(): boolean; /** @hidden @internal */ get titlePositionTop(): string; /** * Emitted when the step's `active` property changes. Can be used for two-way binding. * * ```html * <igx-step [(active)]="this.isActive"> * </igx-step> * ``` * * ```typescript * const step: IgxStepComponent = this.stepper.step[0]; * step.activeChange.subscribe((e: boolean) => console.log("Step active state change to ", e)) * ``` */ activeChange: EventEmitter<boolean>; /** @hidden @internal */ contentTemplate: TemplateRef<any>; /** @hidden @internal */ customIndicatorTemplate: TemplateRef<any>; /** @hidden @internal */ contentContainer: ElementRef; /** @hidden @internal */ indicator: IgxStepIndicatorDirective; /** @hidden @internal */ content: IgxStepContentDirective; /** * Get the step index inside of the stepper. * * ```typescript * const step = this.stepper.steps[1]; * const stepIndex: number = step.index; * ``` */ get index(): number; /** @hidden @internal */ get indicatorTemplate(): TemplateRef<any>; /** @hidden @internal */ get direction(): CarouselAnimationDirection; /** @hidden @internal */ get isAccessible(): boolean; /** @hidden @internal */ get isHorizontal(): boolean; /** @hidden @internal */ get isTitleVisible(): boolean; /** @hidden @internal */ get isIndicatorVisible(): boolean; /** @hidden @internal */ get titlePosition(): string; /** @hidden @internal */ get linearDisabled(): boolean; /** @hidden @internal */ get collapsing(): boolean; /** @hidden @internal */ get animationSettings(): ToggleAnimationSettings; /** @hidden @internal */ get contentClasses(): any; /** @hidden @internal */ get stepHeaderClasses(): any; /** @hidden @internal */ get nativeElement(): HTMLElement; /** @hidden @internal */ previous: boolean; /** @hidden @internal */ _index: number; private _tabIndex; private _valid; private _focused; private _disabled; /** @hidden @internal */ onFocus(): void; /** @hidden @internal */ onBlur(): void; /** @hidden @internal */ handleKeydown(event: KeyboardEvent): void; /** @hidden @internal */ ngAfterViewInit(): void; /** @hidden @internal */ onPointerDown(event: MouseEvent): void; /** @hidden @internal */ handleNavigation(key: string): void; /** @hidden @internal */ changeHorizontalActiveStep(): void; private get nextStep(); private get previousStep(); private changeVerticalActiveStep; static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<IgxStepComponent, "igx-step", never, { "id": { "alias": "id"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "completed": { "alias": "completed"; "required": false; }; "isValid": { "alias": "isValid"; "required": false; }; "optional": { "alias": "optional"; "required": false; }; "active": { "alias": "active"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "activeChange": "activeChange"; }, ["indicator", "content"], ["[igxStepTitle]", "[igxStepSubtitle]", "[igxStepContent]", "[igxStepIndicator]"], true, never>; static ngAcceptInputType_disabled: unknown; static ngAcceptInputType_completed: unknown; static ngAcceptInputType_isValid: unknown; static ngAcceptInputType_optional: unknown; static ngAcceptInputType_active: unknown; } declare const IGX_STEPPER_DIRECTIVES: readonly [typeof IgxStepComponent, typeof IgxStepperComponent, typeof IgxStepTitleDirective, typeof IgxStepSubtitleDirective, typeof IgxStepIndicatorDirective, typeof IgxStepContentDirective, typeof IgxStepActiveIndicatorDirective, typeof IgxStepCompletedIndicatorDirective, typeof IgxStepInvalidIndicatorDirective]; /** * @hidden * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components */ declare class IgxStepperModule { static ɵfac: i0.ɵɵFactoryDeclaration<IgxStepperModule, never>; static ɵmod: i0.ɵɵNgModuleDeclaration<IgxStepperModule, never, [typeof IgxStepComponent, typeof IgxStepperComponent, typeof IgxStepTitleDirective, typeof IgxStepSubtitleDirective, typeof IgxStepIndicatorDirective, typeof IgxStepContentDirective, typeof IgxStepActiveIndicatorDirective, typeof IgxStepCompletedIndicatorDirective, typeof IgxStepInvalidIndicatorDirective], [typeof IgxStepComponent, typeof IgxStepperComponent, typeof IgxStepTitleDirective, typeof IgxStepSubtitleDirective, typeof IgxStepIndicatorDirective, typeof IgxStepContentDirective, typeof IgxStepActiveIndicatorDirective, typeof IgxStepCompletedIndicatorDirective, typeof IgxStepInvalidIndicatorDirective]>; static ɵinj: i0.ɵɵInjectorDeclaration<IgxStepperModule>; } export { HorizontalAnimationType, IGX_STEPPER_DIRECTIVES, IgxStepActiveIndicatorDirective, IgxStepCompletedIndicatorDirective, IgxStepComponent, IgxStepContentDirective, IgxStepIndicatorDirective, IgxStepInvalidIndicatorDirective, IgxStepSubtitleDirective, IgxStepTitleDirective, IgxStepType, IgxStepperComponent, IgxStepperModule, IgxStepperOrientation, IgxStepperTitlePosition, VerticalAnimationType }; export type { IStepChangedEventArgs, IStepChangingEventArgs };