{"version":3,"file":"primeng-dialog.mjs","sources":["../../src/app/components/dialog/dialog.ts","../../src/app/components/dialog/primeng-dialog.ts"],"sourcesContent":["import { AnimationEvent, animate, animation, style, transition, trigger, useAnimation } from '@angular/animations';\nimport { CommonModule, DOCUMENT, isPlatformBrowser } from '@angular/common';\nimport {\n AfterContentInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ContentChild,\n ContentChildren,\n ElementRef,\n EventEmitter,\n Inject,\n Input,\n NgModule,\n NgZone,\n OnDestroy,\n OnInit,\n Output,\n PLATFORM_ID,\n QueryList,\n Renderer2,\n SimpleChanges,\n TemplateRef,\n ViewChild,\n ViewEncapsulation,\n ViewRef\n} from '@angular/core';\nimport { Footer, Header, PrimeNGConfig, PrimeTemplate, SharedModule } from 'primeng/api';\nimport { DomHandler } from 'primeng/dom';\nimport { FocusTrapModule } from 'primeng/focustrap';\nimport { TimesIcon } from 'primeng/icons/times';\nimport { WindowMaximizeIcon } from 'primeng/icons/windowmaximize';\nimport { WindowMinimizeIcon } from 'primeng/icons/windowminimize';\nimport { RippleModule } from 'primeng/ripple';\nimport { Nullable, VoidListener } from 'primeng/ts-helpers';\nimport { UniqueComponentId, ZIndexUtils } from 'primeng/utils';\n\nconst showAnimation = animation([style({ transform: '{{transform}}', opacity: 0 }), animate('{{transition}}')]);\n\nconst hideAnimation = animation([animate('{{transition}}', style({ transform: '{{transform}}', opacity: 0 }))]);\n/**\n * Dialog is a container to display content in an overlay window.\n * @group Components\n */\n@Component({\n selector: 'p-dialog',\n template: `\n \n \n \n \n \n\n \n
\n
\n {{ header }}\n \n \n \n \n
\n \n \n \n \n \n \n \n \n \n \n
\n
\n
\n \n \n
\n
\n \n \n
\n \n \n \n `,\n animations: [trigger('animation', [transition('void => visible', [useAnimation(showAnimation)]), transition('visible => void', [useAnimation(hideAnimation)])])],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n styleUrls: ['../dialog/dialog.css'],\n host: {\n class: 'p-element'\n }\n})\nexport class Dialog implements AfterContentInit, OnInit, OnDestroy {\n /**\n * Title text of the dialog.\n * @group Props\n */\n @Input() header: string | undefined;\n /**\n * Enables dragging to change the position using header.\n * @group Props\n */\n @Input() draggable: boolean = true;\n /**\n * Enables resizing of the content.\n * @group Props\n */\n @Input() resizable: boolean = true;\n /**\n * Defines the left offset of dialog.\n * @group Props\n * @deprecated positionLeft property is deprecated.\n */\n @Input() get positionLeft(): number {\n return 0;\n }\n set positionLeft(_positionLeft: number) {\n console.log('positionLeft property is deprecated.');\n }\n /**\n * Defines the top offset of dialog.\n * @group Props\n * @deprecated positionTop property is deprecated.\n */\n @Input() get positionTop(): number {\n return 0;\n }\n set positionTop(_positionTop: number) {\n console.log('positionTop property is deprecated.');\n }\n /**\n * Style of the content section.\n * @group Props\n */\n @Input() contentStyle: any;\n /**\n * Style class of the content.\n * @group Props\n */\n @Input() contentStyleClass: string | undefined;\n /**\n * Defines if background should be blocked when dialog is displayed.\n * @group Props\n */\n @Input() modal: boolean = false;\n /**\n * Specifies if pressing escape key should hide the dialog.\n * @group Props\n */\n @Input() closeOnEscape: boolean = true;\n /**\n * Specifies if clicking the modal background should hide the dialog.\n * @group Props\n */\n @Input() dismissableMask: boolean = false;\n /**\n * When enabled dialog is displayed in RTL direction.\n * @group Props\n */\n @Input() rtl: boolean = false;\n /**\n * Adds a close icon to the header to hide the dialog.\n * @group Props\n */\n @Input() closable: boolean = true;\n /**\n * Defines if the component is responsive.\n * @group Props\n * @deprecated Responsive property is deprecated.\n */\n @Input() get responsive(): boolean {\n return false;\n }\n set responsive(_responsive: boolean) {\n console.log('Responsive property is deprecated.');\n }\n /**\n * Target element to attach the dialog, 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).\n * @group Props\n */\n @Input() appendTo: HTMLElement | ElementRef | TemplateRef | string | null | undefined | any;\n /**\n * Object literal to define widths per screen size.\n * @group Props\n */\n @Input() breakpoints: any;\n /**\n * Style class of the component.\n * @group Props\n */\n @Input() styleClass: string | undefined;\n /**\n * Style class of the mask.\n * @group Props\n */\n @Input() maskStyleClass: string | undefined;\n /**\n * Style of the mask.\n * @group Props\n */\n @Input() maskStyle: string | undefined;\n /**\n * Whether to show the header or not.\n * @group Props\n */\n @Input() showHeader: boolean = true;\n /**\n * Defines the breakpoint of the component responsive.\n * @group Props\n * @deprecated Breakpoint property is not utilized and deprecated. Use breakpoints or CSS media queries instead.\n */\n @Input() get breakpoint(): number {\n return 649;\n }\n set breakpoint(_breakpoint: number) {\n console.log('Breakpoint property is not utilized and deprecated, use breakpoints or CSS media queries instead.');\n }\n /**\n * Whether background scroll should be blocked when dialog is visible.\n * @group Props\n */\n @Input() blockScroll: boolean = false;\n /**\n * Whether to automatically manage layering.\n * @group Props\n */\n @Input() autoZIndex: boolean = true;\n /**\n * Base zIndex value to use in layering.\n * @group Props\n */\n @Input() baseZIndex: number = 0;\n /**\n * Minimum value for the left coordinate of dialog in dragging.\n * @group Props\n */\n @Input() minX: number = 0;\n /**\n * Minimum value for the top coordinate of dialog in dragging.\n * @group Props\n */\n @Input() minY: number = 0;\n /**\n * When enabled, first button receives focus on show.\n * @group Props\n */\n @Input() focusOnShow: boolean = true;\n /**\n * Whether the dialog can be displayed full screen.\n * @group Props\n */\n @Input() maximizable: boolean = false;\n /**\n * Keeps dialog in the viewport.\n * @group Props\n */\n @Input() keepInViewport: boolean = true;\n /**\n * When enabled, can only focus on elements inside the dialog.\n * @group Props\n */\n @Input() focusTrap: boolean = true;\n /**\n * Transition options of the animation.\n * @group Props\n */\n @Input() transitionOptions: string = '150ms cubic-bezier(0, 0, 0.2, 1)';\n /**\n * Name of the close icon.\n * @group Props\n */\n @Input() closeIcon: string | undefined;\n /**\n * Defines a string that labels the close button for accessibility.\n * @group Props\n */\n @Input() closeAriaLabel: string | undefined;\n /**\n * Index of the close button in tabbing order.\n * @group Props\n */\n @Input() closeTabindex: string = '-1';\n /**\n * Name of the minimize icon.\n * @group Props\n */\n @Input() minimizeIcon: string | undefined;\n /**\n * Name of the maximize icon.\n * @group Props\n */\n @Input() maximizeIcon: string | undefined;\n /**\n * Specifies the visibility of the dialog.\n * @group Props\n */\n @Input() get visible(): boolean {\n return this._visible;\n }\n set visible(value: boolean) {\n this._visible = value;\n\n if (this._visible && !this.maskVisible) {\n this.maskVisible = true;\n }\n }\n /**\n * Inline style of the component.\n * @group Props\n */\n @Input() get style(): any {\n return this._style;\n }\n set style(value: any) {\n if (value) {\n this._style = { ...value };\n this.originalStyle = value;\n }\n }\n /**\n * Position of the dialog.\n * @group Props\n */\n @Input() get position(): 'center' | 'top' | 'bottom' | 'left' | 'right' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright' {\n return this._position;\n }\n set position(value: 'center' | 'top' | 'bottom' | 'left' | 'right' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright') {\n this._position = value;\n\n switch (value) {\n case 'topleft':\n case 'bottomleft':\n case 'left':\n this.transformOptions = 'translate3d(-100%, 0px, 0px)';\n break;\n case 'topright':\n case 'bottomright':\n case 'right':\n this.transformOptions = 'translate3d(100%, 0px, 0px)';\n break;\n case 'bottom':\n this.transformOptions = 'translate3d(0px, 100%, 0px)';\n break;\n case 'top':\n this.transformOptions = 'translate3d(0px, -100%, 0px)';\n break;\n default:\n this.transformOptions = 'scale(0.7)';\n break;\n }\n }\n /**\n * Callback to invoke when dialog is shown.\n * @group Emits\n */\n @Output() onShow: EventEmitter = new EventEmitter();\n /**\n * Callback to invoke when dialog is hidden.\n * @group Emits\n */\n @Output() onHide: EventEmitter = new EventEmitter();\n /**\n * This EventEmitter is used to notify changes in the visibility state of a component.\n * @param {boolean} value - New value.\n * @group Emits\n */\n @Output() visibleChange: EventEmitter = new EventEmitter();\n /**\n * Callback to invoke when dialog resizing is initiated.\n * @param {MouseEvent} event - Mouse event.\n * @group Emits\n */\n @Output() onResizeInit: EventEmitter = new EventEmitter();\n /**\n * Callback to invoke when dialog resizing is completed.\n * @param {MouseEvent} event - Mouse event.\n * @group Emits\n */\n @Output() onResizeEnd: EventEmitter = new EventEmitter();\n /**\n * Callback to invoke when dialog dragging is completed.\n * @param {DragEvent} event - Drag event.\n * @group Emits\n */\n @Output() onDragEnd: EventEmitter = new EventEmitter();\n /**\n * Callback to invoke when dialog maximized or unmaximized.\n * @group Emits\n */\n @Output() onMaximize: EventEmitter = new EventEmitter();\n\n @ContentChild(Header) headerFacet: QueryList
| undefined;\n\n @ContentChild(Footer) footerFacet: QueryList