primeng
Version:
PrimeNG is a premium UI library for Angular featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock,
301 lines (297 loc) • 13.9 kB
TypeScript
import * as _angular_core from '@angular/core';
import { ElementRef, TemplateRef } from '@angular/core';
import { MotionOptions, MotionEvent } from '@primeuix/motion';
import * as i2 from 'primeng/api';
import { ResponsiveOverlayOptions, OverlayOptions, OverlayOnBeforeShowEvent, OverlayOnShowEvent, OverlayOnBeforeHideEvent, OverlayOnHideEvent, OverlayService } from 'primeng/api';
import { BaseComponent } from 'primeng/basecomponent';
import * as i1 from 'primeng/bind';
import { Bind } from 'primeng/bind';
import { CSSProperties, AppendTo } from 'primeng/types/shared';
import { OverlayContentTemplateContext } from 'primeng/types/overlay';
import { BaseStyle } from 'primeng/base';
declare class OverlayStyle extends BaseStyle {
name: string;
style: string;
classes: {
host: string;
root: ({ instance }: {
instance: any;
}) => (string | {
'p-overlay-modal p-overlay-mask p-overlay-mask-enter-active': any;
'p-overlay-center': any;
'p-overlay-top': any;
'p-overlay-top-start': any;
'p-overlay-top-end': any;
'p-overlay-bottom': any;
'p-overlay-bottom-start': any;
'p-overlay-bottom-end': any;
'p-overlay-left': any;
'p-overlay-left-start': any;
'p-overlay-left-end': any;
'p-overlay-right': any;
'p-overlay-right-start': any;
'p-overlay-right-end': any;
})[];
content: string;
};
inlineStyles: {
root: ({ instance }: {
instance: any;
}) => any;
content: ({ instance }: {
instance: any;
}) => any;
};
static ɵfac: _angular_core.ɵɵFactoryDeclaration<OverlayStyle, never>;
static ɵprov: _angular_core.ɵɵInjectableDeclaration<OverlayStyle>;
}
/**
* This API allows overlay components to be controlled from the PrimeNG. In this way, all overlay components in the application can have the same behavior.
* @group Components
*/
declare class Overlay extends BaseComponent {
componentName: string;
$pcOverlay: Overlay | undefined;
hostName: _angular_core.InputSignal<string>;
/**
* The visible property is an input that determines the visibility of the component.
* @defaultValue false
* @group Props
*/
visible: _angular_core.ModelSignal<boolean>;
/**
* The mode property is an input that determines the overlay mode type or string.
* @defaultValue null
* @group Props
*/
mode: _angular_core.InputSignal<string | undefined>;
/**
* The style property is an input that determines the style object for the component.
* @defaultValue null
* @group Props
*/
style: _angular_core.InputSignal<CSSProperties>;
/**
* The styleClass property is an input that determines the CSS class(es) for the component.
* @defaultValue null
* @group Props
*/
styleClass: _angular_core.InputSignal<string | undefined>;
/**
* The contentStyle property is an input that determines the style object for the content of the component.
* @defaultValue null
* @group Props
*/
contentStyle: _angular_core.InputSignal<CSSProperties>;
/**
* The contentStyleClass property is an input that determines the CSS class(es) for the content of the component.
* @defaultValue null
* @group Props
*/
contentStyleClass: _angular_core.InputSignal<string | undefined>;
/**
* The target property is an input that specifies the target element or selector for the component.
* @defaultValue null
* @group Props
*/
target: _angular_core.InputSignal<string | null | undefined>;
/**
* The autoZIndex determines whether to automatically manage layering. Its default value is 'false'.
* @defaultValue false
* @group Props
*/
autoZIndex: _angular_core.InputSignal<boolean | undefined>;
/**
* The baseZIndex is base zIndex value to use in layering.
* @defaultValue null
* @group Props
*/
baseZIndex: _angular_core.InputSignal<number | undefined>;
/**
* The listener property is an input that specifies the listener object for the component.
* @defaultValue null
* @group Props
*/
listener: _angular_core.InputSignal<any>;
/**
* It is the option used to determine in which mode it should appear according to the given media or breakpoint.
* @defaultValue null
* @group Props
*/
responsive: _angular_core.InputSignal<ResponsiveOverlayOptions | undefined>;
/**
* The options property is an input that specifies the overlay options for the component.
* @defaultValue null
* @group Props
*/
options: _angular_core.InputSignal<OverlayOptions | undefined>;
/**
* Target element to attach the overlay, valid values are "body" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name).
* @defaultValue 'self'
* @group Props
*/
appendTo: _angular_core.InputSignal<AppendTo>;
/**
* Specifies whether the overlay should be rendered inline within the current component's template.
* @defaultValue false
* @group Props
*/
inline: _angular_core.InputSignal<boolean>;
/**
* The motion options.
* @group Props
*/
motionOptions: _angular_core.InputSignal<MotionOptions | undefined>;
/**
* Callback to invoke before the overlay is shown.
* @param {OverlayOnBeforeShowEvent} event - Custom overlay before show event.
* @group Emits
*/
onBeforeShow: _angular_core.OutputEmitterRef<OverlayOnBeforeShowEvent>;
/**
* Callback to invoke when the overlay is shown.
* @param {OverlayOnShowEvent} event - Custom overlay show event.
* @group Emits
*/
onShow: _angular_core.OutputEmitterRef<OverlayOnShowEvent>;
/**
* Callback to invoke before the overlay is hidden.
* @param {OverlayOnBeforeHideEvent} event - Custom overlay before hide event.
* @group Emits
*/
onBeforeHide: _angular_core.OutputEmitterRef<OverlayOnBeforeHideEvent>;
/**
* Callback to invoke when the overlay is hidden
* @param {OverlayOnHideEvent} event - Custom hide event.
* @group Emits
*/
onHide: _angular_core.OutputEmitterRef<OverlayOnHideEvent>;
/**
* Callback to invoke when the animation is started.
* @param {AnimationEvent} event - Animation event.
* @group Emits
* @deprecated since v21.0.0. Use onOverlayBeforeEnter and onOverlayBeforeLeave instead.
*/
onAnimationStart: _angular_core.OutputEmitterRef<AnimationEvent>;
/**
* Callback to invoke when the animation is done.
* @param {AnimationEvent} event - Animation event.
* @group Emits
* @deprecated since v21.0.0. Use onOverlayAfterEnter and onOverlayAfterLeave instead.
*/
onAnimationDone: _angular_core.OutputEmitterRef<AnimationEvent>;
/**
* Callback to invoke before the overlay enters.
* @param {MotionEvent} event - Event before enter.
* @group Emits
*/
onBeforeEnter: _angular_core.OutputEmitterRef<MotionEvent>;
/**
* Callback to invoke when the overlay enters.
* @param {MotionEvent} event - Event on enter.
* @group Emits
*/
onEnter: _angular_core.OutputEmitterRef<MotionEvent>;
/**
* Callback to invoke after the overlay has entered.
* @param {MotionEvent} event - Event after enter.
* @group Emits
*/
onAfterEnter: _angular_core.OutputEmitterRef<MotionEvent>;
/**
* Callback to invoke before the overlay leaves.
* @param {MotionEvent} event - Event before leave.
* @group Emits
*/
onBeforeLeave: _angular_core.OutputEmitterRef<MotionEvent>;
/**
* Callback to invoke when the overlay leaves.
* @param {MotionEvent} event - Event on leave.
* @group Emits
*/
onLeave: _angular_core.OutputEmitterRef<MotionEvent>;
/**
* Callback to invoke after the overlay has left.
* @param {MotionEvent} event - Event after leave.
* @group Emits
*/
onAfterLeave: _angular_core.OutputEmitterRef<MotionEvent>;
overlayViewChild: _angular_core.Signal<ElementRef<any> | undefined>;
contentViewChild: _angular_core.Signal<ElementRef<any> | undefined>;
/**
* Content template of the component.
* @param {OverlayContentTemplateContext} context - content context.
* @see {@link OverlayContentTemplateContext}
* @group Templates
*/
contentTemplate: _angular_core.Signal<TemplateRef<OverlayContentTemplateContext> | undefined>;
hostAttrSelector: _angular_core.InputSignal<string | undefined>;
$appendTo: _angular_core.Signal<AppendTo>;
$overlayOptions: _angular_core.Signal<OverlayOptions>;
$overlayResponsiveOptions: _angular_core.Signal<ResponsiveOverlayOptions>;
overlayResponsiveDirection: _angular_core.Signal<"center" | "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end">;
$mode: _angular_core.Signal<string | undefined>;
mergedStyleClass: _angular_core.Signal<string>;
mergedContentStyleClass: _angular_core.Signal<string>;
$target: _angular_core.Signal<any>;
$autoZIndex: _angular_core.Signal<boolean>;
$baseZIndex: _angular_core.Signal<number>;
$listener: _angular_core.Signal<any>;
modal: _angular_core.Signal<boolean | undefined>;
overlayMode: _angular_core.Signal<string>;
overlayEl: _angular_core.Signal<any>;
contentEl: _angular_core.Signal<any>;
targetEl: _angular_core.Signal<any>;
computedMotionOptions: _angular_core.Signal<MotionOptions>;
modalVisible: _angular_core.WritableSignal<boolean>;
isOverlayClicked: boolean;
isOverlayContentClicked: boolean;
scrollHandler: any;
documentClickListener: any;
documentResizeListener: any;
_componentStyle: OverlayStyle;
bindDirectiveInstance: Bind;
private documentKeyboardListener;
private parentDragSubscription;
protected transformOptions: any;
overlayService: OverlayService;
constructor();
onAfterViewChecked(): void;
show(overlay?: HTMLElement, isFocus?: boolean): void;
hide(overlay?: HTMLElement, isFocus?: boolean): void;
onVisibleChange(visible: boolean): void;
onOverlayClick(): void;
onOverlayContentClick(event: MouseEvent): void;
container: _angular_core.WritableSignal<any>;
onOverlayBeforeEnter(event: MotionEvent): void;
onOverlayEnter(event: MotionEvent): void;
onOverlayAfterEnter(event: MotionEvent): void;
onOverlayBeforeLeave(event: MotionEvent): void;
onOverlayLeave(event: MotionEvent): void;
onOverlayAfterLeave(event: MotionEvent): void;
handleEvents(name: string, params: any): void;
setZIndex(): void;
appendOverlay(): void;
alignOverlay(): void;
bindListeners(): void;
unbindListeners(): void;
bindParentDragListener(): void;
unbindParentDragListener(): void;
bindScrollListener(): void;
unbindScrollListener(): void;
bindDocumentClickListener(): void;
unbindDocumentClickListener(): void;
bindDocumentResizeListener(): void;
unbindDocumentResizeListener(): void;
bindDocumentKeyboardListener(): void;
unbindDocumentKeyboardListener(): void;
onDestroy(): void;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<Overlay, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<Overlay, "p-overlay", never, { "hostName": { "alias": "hostName"; "required": false; "isSignal": true; }; "visible": { "alias": "visible"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "style": { "alias": "style"; "required": false; "isSignal": true; }; "styleClass": { "alias": "styleClass"; "required": false; "isSignal": true; }; "contentStyle": { "alias": "contentStyle"; "required": false; "isSignal": true; }; "contentStyleClass": { "alias": "contentStyleClass"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "autoZIndex": { "alias": "autoZIndex"; "required": false; "isSignal": true; }; "baseZIndex": { "alias": "baseZIndex"; "required": false; "isSignal": true; }; "listener": { "alias": "listener"; "required": false; "isSignal": true; }; "responsive": { "alias": "responsive"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "appendTo": { "alias": "appendTo"; "required": false; "isSignal": true; }; "inline": { "alias": "inline"; "required": false; "isSignal": true; }; "motionOptions": { "alias": "motionOptions"; "required": false; "isSignal": true; }; "hostAttrSelector": { "alias": "hostAttrSelector"; "required": false; "isSignal": true; }; }, { "visible": "visibleChange"; "onBeforeShow": "onBeforeShow"; "onShow": "onShow"; "onBeforeHide": "onBeforeHide"; "onHide": "onHide"; "onAnimationStart": "onAnimationStart"; "onAnimationDone": "onAnimationDone"; "onBeforeEnter": "onBeforeEnter"; "onEnter": "onEnter"; "onAfterEnter": "onAfterEnter"; "onBeforeLeave": "onBeforeLeave"; "onLeave": "onLeave"; "onAfterLeave": "onAfterLeave"; }, ["contentTemplate"], ["*", "*"], true, [{ directive: typeof i1.Bind; inputs: {}; outputs: {}; }]>;
}
declare class OverlayModule {
static ɵfac: _angular_core.ɵɵFactoryDeclaration<OverlayModule, never>;
static ɵmod: _angular_core.ɵɵNgModuleDeclaration<OverlayModule, never, [typeof Overlay, typeof i2.SharedModule], [typeof Overlay, typeof i2.SharedModule]>;
static ɵinj: _angular_core.ɵɵInjectorDeclaration<OverlayModule>;
}
export { Overlay, OverlayModule, OverlayStyle };