UNPKG

igniteui-angular

Version:

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

275 lines (274 loc) 8.16 kB
import { ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, OnInit } from '@angular/core'; import { CancelableBrowserEventArgs, IBaseEventArgs, PlatformUtil } from '../../core/utils'; import { IgxNavigationService, IToggleView } from '../../core/navigation'; import { IgxOverlayService } from '../../services/overlay/overlay'; import { OffsetMode, OverlaySettings } from '../../services/overlay/utilities'; import { Subject } from 'rxjs'; import * as i0 from "@angular/core"; export interface ToggleViewEventArgs extends IBaseEventArgs { /** Id of the toggle view */ id: string; event?: Event; } export interface ToggleViewCancelableEventArgs extends ToggleViewEventArgs, CancelableBrowserEventArgs { } export declare class IgxToggleDirective implements IToggleView, OnInit, OnDestroy { private elementRef; private cdr; protected overlayService: IgxOverlayService; private navigationService; private platform?; /** * Emits an event after the toggle container is opened. * * ```typescript * onToggleOpened(event) { * alert("Toggle opened!"); * } * ``` * * ```html * <div * igxToggle * (opened)='onToggleOpened($event)'> * </div> * ``` */ opened: EventEmitter<ToggleViewEventArgs>; /** * Emits an event before the toggle container is opened. * * ```typescript * onToggleOpening(event) { * alert("Toggle opening!"); * } * ``` * * ```html * <div * igxToggle * (opening)='onToggleOpening($event)'> * </div> * ``` */ opening: EventEmitter<ToggleViewCancelableEventArgs>; /** * Emits an event after the toggle container is closed. * * ```typescript * onToggleClosed(event) { * alert("Toggle closed!"); * } * ``` * * ```html * <div * igxToggle * (closed)='onToggleClosed($event)'> * </div> * ``` */ closed: EventEmitter<ToggleViewEventArgs>; /** * Emits an event before the toggle container is closed. * * ```typescript * onToggleClosing(event) { * alert("Toggle closing!"); * } * ``` * * ```html * <div * igxToggle * (closing)='onToggleClosing($event)'> * </div> * ``` */ closing: EventEmitter<ToggleViewCancelableEventArgs>; /** * Emits an event after the toggle element is appended to the overlay container. * * ```typescript * onAppended() { * alert("Content appended!"); * } * ``` * * ```html * <div * igxToggle * (appended)='onToggleAppended()'> * </div> * ``` */ appended: EventEmitter<ToggleViewEventArgs>; /** * @hidden */ get collapsed(): boolean; /** * Identifier which is registered into `IgxNavigationService` * * ```typescript * let myToggleId = this.toggle.id; * ``` */ id: string; /** * @hidden */ get element(): HTMLElement; /** * @hidden */ get hiddenClass(): boolean; get hiddenWebkitClass(): boolean; /** * @hidden */ get defaultClass(): boolean; protected _overlayId: string; private _collapsed; protected destroy$: Subject<boolean>; private _overlaySubFilter; private _overlayOpenedSub; private _overlayClosingSub; private _overlayClosedSub; private _overlayContentAppendedSub; /** * @hidden */ constructor(elementRef: ElementRef, cdr: ChangeDetectorRef, overlayService: IgxOverlayService, navigationService: IgxNavigationService, platform?: PlatformUtil); /** * Opens the toggle. * * ```typescript * this.myToggle.open(); * ``` */ open(overlaySettings?: OverlaySettings): void; /** * Closes the toggle. * * ```typescript * this.myToggle.close(); * ``` */ close(event?: Event): void; /** * Opens or closes the toggle, depending on its current state. * * ```typescript * this.myToggle.toggle(); * ``` */ toggle(overlaySettings?: OverlaySettings): void; /** @hidden @internal */ get isClosing(): boolean; /** * Returns the id of the overlay the content is rendered in. * ```typescript * this.myToggle.overlayId; * ``` */ get overlayId(): string; /** * Repositions the toggle. * ```typescript * this.myToggle.reposition(); * ``` */ reposition(): void; /** * Offsets the content along the corresponding axis by the provided amount with optional * offsetMode that determines whether to add (by default) or set the offset values with OffsetMode.Add and OffsetMode.Set */ setOffset(deltaX: number, deltaY: number, offsetMode?: OffsetMode): void; /** * @hidden */ ngOnInit(): void; /** * @hidden */ ngOnDestroy(): void; private overlayClosed; private subscribe; private unsubscribe; private clearSubscription; static ɵfac: i0.ɵɵFactoryDeclaration<IgxToggleDirective, [null, null, null, { optional: true; }, { optional: true; }]>; static ɵdir: i0.ɵɵDirectiveDeclaration<IgxToggleDirective, "[igxToggle]", ["toggle"], { "id": { "alias": "id"; "required": false; }; }, { "opened": "opened"; "opening": "opening"; "closed": "closed"; "closing": "closing"; "appended": "appended"; }, never, never, true, never>; } export declare class IgxToggleActionDirective implements OnInit { private element; private navigationService; /** * Provide settings that control the toggle overlay positioning, interaction and scroll behavior. * ```typescript * const settings: OverlaySettings = { * closeOnOutsideClick: false, * modal: false * } * ``` * --- * ```html * <!--set--> * <div igxToggleAction [overlaySettings]="settings"></div> * ``` */ overlaySettings: OverlaySettings; /** * Determines where the toggle element overlay should be attached. * * ```html * <!--set--> * <div igxToggleAction [igxToggleOutlet]="outlet"></div> * ``` * Where `outlet` in an instance of `IgxOverlayOutletDirective` or an `ElementRef` */ outlet: IgxOverlayOutletDirective | ElementRef; /** * @hidden */ set target(target: any); /** * @hidden */ get target(): any; protected _overlayDefaults: OverlaySettings; protected _target: IToggleView | string; constructor(element: ElementRef, navigationService: IgxNavigationService); /** * @hidden */ onClick(): void; /** * @hidden */ ngOnInit(): void; /** * Updates provided overlay settings * * @param settings settings to update * @returns returns updated copy of provided overlay settings */ protected updateOverlaySettings(settings: OverlaySettings): OverlaySettings; static ɵfac: i0.ɵɵFactoryDeclaration<IgxToggleActionDirective, [null, { optional: true; }]>; static ɵdir: i0.ɵɵDirectiveDeclaration<IgxToggleActionDirective, "[igxToggleAction]", ["toggle-action"], { "overlaySettings": { "alias": "overlaySettings"; "required": false; }; "outlet": { "alias": "igxToggleOutlet"; "required": false; }; "target": { "alias": "igxToggleAction"; "required": false; }; }, {}, never, never, true, never>; } /** * Mark an element as an igxOverlay outlet container. * Directive instance is exported as `overlay-outlet` to be assigned to templates variables: * ```html * <div igxOverlayOutlet #outlet="overlay-outlet"></div> * ``` */ export declare class IgxOverlayOutletDirective { element: ElementRef<HTMLElement>; constructor(element: ElementRef<HTMLElement>); /** @hidden */ get nativeElement(): HTMLElement; static ɵfac: i0.ɵɵFactoryDeclaration<IgxOverlayOutletDirective, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<IgxOverlayOutletDirective, "[igxOverlayOutlet]", ["overlay-outlet"], {}, {}, never, never, true, never>; }