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,
344 lines (340 loc) • 14.9 kB
TypeScript
import * as _angular_core from '@angular/core';
import { TemplateRef } from '@angular/core';
import { MotionOptions } from '@primeuix/motion';
import * as i2 from 'primeng/api';
import { ConfirmEventType, Footer, Confirmation } from 'primeng/api';
import { BaseComponent } from 'primeng/basecomponent';
import * as i1 from 'primeng/bind';
import { Bind } from 'primeng/bind';
import { Dialog } from 'primeng/dialog';
import { CSSProperties, AppendTo } from 'primeng/types/shared';
import { Nullable } from 'primeng/ts-helpers';
import { ConfirmDialogPassThrough, ConfirmDialogDefaultFocus, ConfirmDialogMessageTemplateContext, ConfirmDialogHeadlessTemplateContext } from 'primeng/types/confirmdialog';
export * from 'primeng/types/confirmdialog';
import { DialogPosition } from 'primeng/types/dialog';
import { Subscription } from 'rxjs';
import { BaseStyle } from 'primeng/base';
/**
*
* ConfirmDialog uses a Dialog UI with confirmDialog method or <ConfirmDialog> tag.
*
* [Live Demo](https://www.primeng.org/confirmdialog)
*
* @module confirmdialogstyle
*
*/
declare enum ConfirmDialogClasses {
/**
* Class name of the root element
*/
root = "p-confirmdialog",
/**
* Class name of the icon element
*/
icon = "p-confirmdialog-icon",
/**
* Class name of the message element
*/
message = "p-confirmdialog-message",
/**
* Class name of the reject button element
*/
pcRejectButton = "p-confirmdialog-reject-button",
/**
* Class name of the accept button element
*/
pcAcceptButton = "p-confirmdialog-accept-button"
}
declare class ConfirmDialogStyle extends BaseStyle {
name: string;
style: string;
classes: {
root: string;
icon: string;
message: string;
pcRejectButton: string;
pcAcceptButton: string;
};
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ConfirmDialogStyle, never>;
static ɵprov: _angular_core.ɵɵInjectableDeclaration<ConfirmDialogStyle>;
}
interface ConfirmDialogStyle extends BaseStyle {
}
/**
* ConfirmDialog uses a Dialog UI that is integrated with the Confirmation API.
* @group Components
*/
declare class ConfirmDialog extends BaseComponent<ConfirmDialogPassThrough> {
componentName: string;
$pcConfirmDialog: ConfirmDialog | undefined;
bindDirectiveInstance: Bind;
onAfterViewChecked(): void;
/**
* Title text of the dialog.
* @group Props
*/
header: _angular_core.InputSignal<string | undefined>;
/**
* Icon to display next to message.
* @group Props
*/
icon: _angular_core.InputSignal<string | undefined>;
/**
* Message of the confirmation.
* @group Props
*/
message: _angular_core.InputSignal<string | undefined>;
/**
* Inline style of the element.
* @group Props
*/
style: _angular_core.InputSignal<CSSProperties>;
/**
* Class of the element.
* @group Props
*/
styleClass: _angular_core.InputSignal<string | undefined>;
/**
* Specify the CSS class(es) for styling the mask element
* @group Props
*/
maskStyleClass: _angular_core.InputSignal<string | undefined>;
/**
* Icon of the accept button.
* @group Props
*/
acceptIcon: _angular_core.InputSignal<string | undefined>;
/**
* Label of the accept button.
* @group Props
*/
acceptLabel: _angular_core.InputSignal<string | undefined>;
/**
* Defines a string that labels the close button for accessibility.
* @group Props
*/
closeAriaLabel: _angular_core.InputSignal<string | undefined>;
/**
* Defines a string that labels the accept button for accessibility.
* @group Props
*/
acceptAriaLabel: _angular_core.InputSignal<string | undefined>;
/**
* Visibility of the accept button.
* @group Props
*/
acceptVisible: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Icon of the reject button.
* @group Props
*/
rejectIcon: _angular_core.InputSignal<string | undefined>;
/**
* Label of the reject button.
* @group Props
*/
rejectLabel: _angular_core.InputSignal<string | undefined>;
/**
* Defines a string that labels the reject button for accessibility.
* @group Props
*/
rejectAriaLabel: _angular_core.InputSignal<string | undefined>;
/**
* Visibility of the reject button.
* @group Props
*/
rejectVisible: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Style class of the accept button.
* @group Props
*/
acceptButtonStyleClass: _angular_core.InputSignal<string | undefined>;
/**
* Style class of the reject button.
* @group Props
*/
rejectButtonStyleClass: _angular_core.InputSignal<string | undefined>;
/**
* Specifies if pressing escape key should hide the dialog.
* @group Props
*/
closeOnEscape: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Specifies if clicking the modal background should hide the dialog.
* @group Props
*/
dismissableMask: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
/**
* Determines whether scrolling behavior should be blocked within the component.
* @group Props
*/
blockScroll: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* When enabled dialog is displayed in RTL direction.
* @group Props
*/
rtl: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Adds a close icon to the header to hide the dialog.
* @group Props
*/
closable: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* 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 'body'
* @group Props
*/
appendTo: _angular_core.InputSignal<AppendTo>;
/**
* Optional key to match the key of confirm object, necessary to use when component tree has multiple confirm dialogs.
* @group Props
*/
key: _angular_core.InputSignal<string | undefined>;
/**
* Whether to automatically manage layering.
* @group Props
*/
autoZIndex: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Base zIndex value to use in layering.
* @group Props
*/
baseZIndex: _angular_core.InputSignalWithTransform<number, unknown>;
/**
* The motion options.
* @group Props
*/
motionOptions: _angular_core.InputSignal<MotionOptions | undefined>;
/**
* The motion options for the mask.
* @group Props
*/
maskMotionOptions: _angular_core.InputSignal<MotionOptions | undefined>;
/**
* When enabled, can only focus on elements inside the confirm dialog.
* @group Props
*/
focusTrap: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Element to receive the focus when the dialog gets visible.
* @group Props
*/
defaultFocus: _angular_core.InputSignal<ConfirmDialogDefaultFocus>;
/**
* Object literal to define widths per screen size.
* @group Props
*/
breakpoints: _angular_core.InputSignal<Record<string, string> | undefined>;
/**
* Defines if background should be blocked when dialog is displayed.
* @group Props
*/
modal: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Current visible state as a boolean.
* @group Props
*/
visible: _angular_core.ModelSignal<boolean>;
/**
* Allows getting the position of the component.
* @group Props
*/
position: _angular_core.InputSignal<DialogPosition>;
/**
* Enables dragging to change the position using header.
* @group Props
*/
draggable: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Callback to invoke when dialog is hidden.
* @param {ConfirmEventType} enum - Custom confirm event.
* @group Emits
*/
onHide: _angular_core.OutputEmitterRef<ConfirmEventType | undefined>;
footer: _angular_core.Signal<Footer | undefined>;
_componentStyle: ConfirmDialogStyle;
/**
* Custom header template.
* @group Templates
*/
headerTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
/**
* Custom footer template.
* @group Templates
*/
footerTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
/**
* Custom reject icon template.
* @group Templates
*/
rejectIconTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
/**
* Custom accept icon template.
* @group Templates
*/
acceptIconTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
/**
* Custom message template.
* @group Templates
*/
messageTemplate: _angular_core.Signal<TemplateRef<ConfirmDialogMessageTemplateContext> | undefined>;
/**
* Custom icon template.
* @group Templates
*/
iconTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
/**
* Custom headless template.
* @group Templates
*/
headlessTemplate: _angular_core.Signal<TemplateRef<ConfirmDialogHeadlessTemplateContext> | undefined>;
private onAcceptCallback;
private onRejectCallback;
headlessContext: _angular_core.Signal<ConfirmDialogHeadlessTemplateContext>;
messageContext: _angular_core.Signal<ConfirmDialogMessageTemplateContext>;
$appendTo: _angular_core.Signal<AppendTo>;
computedMotionOptions: _angular_core.Signal<MotionOptions>;
computedMaskMotionOptions: _angular_core.Signal<MotionOptions>;
get focusTarget(): ConfirmDialogDefaultFocus;
get autoFocusAccept(): boolean;
get autoFocusReject(): boolean;
confirmation: _angular_core.WritableSignal<Nullable<Confirmation>>;
maskVisible: _angular_core.WritableSignal<boolean>;
dialog: Nullable<Dialog>;
wrapper: Nullable<HTMLElement>;
contentContainer: Nullable<HTMLDivElement>;
subscription: Subscription;
preWidth: number | undefined;
styleElement: HTMLStyleElement | null;
id: string;
ariaLabelledBy: string | null;
translationSubscription: Subscription | undefined;
private confirmationService;
constructor();
onInit(): void;
getAriaLabelledBy(): string | null;
option(name: string, k?: string): any;
getButtonStyleClass(cx: string, opt: string): string;
createStyle(): void;
close(): void;
hide(type?: ConfirmEventType): void;
onDialogHide(): void;
destroyStyle(): void;
onDestroy(): void;
onVisibleChange(value: boolean): void;
onAccept(): void;
onReject(): void;
unsubscribeConfirmationEvents(): void;
get acceptButtonLabel(): string;
get rejectButtonLabel(): string;
getAcceptButtonProps(): any;
getRejectButtonProps(): any;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ConfirmDialog, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ConfirmDialog, "p-confirmdialog, p-confirm-dialog", never, { "header": { "alias": "header"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "message": { "alias": "message"; "required": false; "isSignal": true; }; "style": { "alias": "style"; "required": false; "isSignal": true; }; "styleClass": { "alias": "styleClass"; "required": false; "isSignal": true; }; "maskStyleClass": { "alias": "maskStyleClass"; "required": false; "isSignal": true; }; "acceptIcon": { "alias": "acceptIcon"; "required": false; "isSignal": true; }; "acceptLabel": { "alias": "acceptLabel"; "required": false; "isSignal": true; }; "closeAriaLabel": { "alias": "closeAriaLabel"; "required": false; "isSignal": true; }; "acceptAriaLabel": { "alias": "acceptAriaLabel"; "required": false; "isSignal": true; }; "acceptVisible": { "alias": "acceptVisible"; "required": false; "isSignal": true; }; "rejectIcon": { "alias": "rejectIcon"; "required": false; "isSignal": true; }; "rejectLabel": { "alias": "rejectLabel"; "required": false; "isSignal": true; }; "rejectAriaLabel": { "alias": "rejectAriaLabel"; "required": false; "isSignal": true; }; "rejectVisible": { "alias": "rejectVisible"; "required": false; "isSignal": true; }; "acceptButtonStyleClass": { "alias": "acceptButtonStyleClass"; "required": false; "isSignal": true; }; "rejectButtonStyleClass": { "alias": "rejectButtonStyleClass"; "required": false; "isSignal": true; }; "closeOnEscape": { "alias": "closeOnEscape"; "required": false; "isSignal": true; }; "dismissableMask": { "alias": "dismissableMask"; "required": false; "isSignal": true; }; "blockScroll": { "alias": "blockScroll"; "required": false; "isSignal": true; }; "rtl": { "alias": "rtl"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "appendTo": { "alias": "appendTo"; "required": false; "isSignal": true; }; "key": { "alias": "key"; "required": false; "isSignal": true; }; "autoZIndex": { "alias": "autoZIndex"; "required": false; "isSignal": true; }; "baseZIndex": { "alias": "baseZIndex"; "required": false; "isSignal": true; }; "motionOptions": { "alias": "motionOptions"; "required": false; "isSignal": true; }; "maskMotionOptions": { "alias": "maskMotionOptions"; "required": false; "isSignal": true; }; "focusTrap": { "alias": "focusTrap"; "required": false; "isSignal": true; }; "defaultFocus": { "alias": "defaultFocus"; "required": false; "isSignal": true; }; "breakpoints": { "alias": "breakpoints"; "required": false; "isSignal": true; }; "modal": { "alias": "modal"; "required": false; "isSignal": true; }; "visible": { "alias": "visible"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "draggable": { "alias": "draggable"; "required": false; "isSignal": true; }; }, { "visible": "visibleChange"; "onHide": "onHide"; }, ["footer", "headerTemplate", "footerTemplate", "rejectIconTemplate", "acceptIconTemplate", "messageTemplate", "iconTemplate", "headlessTemplate"], ["p-footer"], true, [{ directive: typeof i1.Bind; inputs: {}; outputs: {}; }]>;
}
declare class ConfirmDialogModule {
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ConfirmDialogModule, never>;
static ɵmod: _angular_core.ɵɵNgModuleDeclaration<ConfirmDialogModule, never, [typeof ConfirmDialog, typeof i2.SharedModule], [typeof ConfirmDialog, typeof i2.SharedModule]>;
static ɵinj: _angular_core.ɵɵInjectorDeclaration<ConfirmDialogModule>;
}
export { ConfirmDialog, ConfirmDialogClasses, ConfirmDialogModule, ConfirmDialogStyle };