Dialog d.ts updated

pull/3689/head
Tuğçe Küçükoğlu 2023-03-01 13:18:34 +03:00
parent 9ffe57ba25
commit fa22064990
1 changed files with 68 additions and 47 deletions

View File

@ -1,10 +1,18 @@
/**
*
* Dialog is a container to display content in an overlay window.
*
* [Live Demo](https://www.primevue.org/dialog)
*
* @module dialog
*
*/
import { HTMLAttributes, VNode } from 'vue'; import { HTMLAttributes, VNode } from 'vue';
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers'; import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
type DialogPositionType = 'center' | 'top' | 'bottom' | 'left' | 'right' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright' | undefined; /**
* Custom breakpoint metadata.
type DialogAppendToType = 'body' | 'self' | string | undefined | HTMLElement; */
export interface DialogBreakpoints { export interface DialogBreakpoints {
/** /**
* Breakpoint for responsive mode. * Breakpoint for responsive mode.
@ -24,6 +32,9 @@ export interface DialogBreakpoints {
[key: string]: string; [key: string]: string;
} }
/**
* Defines valid properties in Dialog component.
*/
export interface DialogProps { export interface DialogProps {
/** /**
* Title content of the dialog. * Title content of the dialog.
@ -35,10 +46,12 @@ export interface DialogProps {
footer?: string | undefined; footer?: string | undefined;
/** /**
* Specifies the visibility of the dialog. * Specifies the visibility of the dialog.
* @defaultValue false
*/ */
visible?: boolean | undefined; visible?: boolean | undefined;
/** /**
* Defines if background should be blocked when dialog is displayed. * Defines if background should be blocked when dialog is displayed.
* @defaultValue false
*/ */
modal?: boolean | undefined; modal?: boolean | undefined;
/** /**
@ -55,150 +68,167 @@ export interface DialogProps {
contentProps?: HTMLAttributes | undefined; contentProps?: HTMLAttributes | undefined;
/** /**
* When enabled dialog is displayed in RTL direction. * When enabled dialog is displayed in RTL direction.
* @defaultValue false
*/ */
rtl?: boolean | undefined; rtl?: boolean | undefined;
/** /**
* Adds a close icon to the header to hide the dialog. * Adds a close icon to the header to hide the dialog.
* Default value is true. * @defaultValue true
*/ */
closable?: boolean | undefined; closable?: boolean | undefined;
/** /**
* Specifies if clicking the modal background should hide the dialog. * Specifies if clicking the modal background should hide the dialog.
* @defaultValue false
*/ */
dismissableMask?: boolean | undefined; dismissableMask?: boolean | undefined;
/** /**
* Specifies if pressing escape key should hide the dialog. * Specifies if pressing escape key should hide the dialog.
* Default value is true. * @defaultValue true
*/ */
closeOnEscape?: boolean | undefined; closeOnEscape?: boolean | undefined;
/** /**
* Whether to show the header or not. * Whether to show the header or not.
* Default value is true. * @defaultValue true
*/ */
showHeader?: boolean | undefined; showHeader?: boolean | undefined;
/** /**
* Base zIndex value to use in layering. * Base zIndex value to use in layering.
* Default value is 0. * @defaultValue 0
*/ */
baseZIndex?: number | undefined; baseZIndex?: number | undefined;
/** /**
* Whether to automatically manage layering. * Whether to automatically manage layering.
* Default value is true. * @defaultValue true
*/ */
autoZIndex?: boolean | undefined; autoZIndex?: boolean | undefined;
/** /**
* Position of the dialog, options are 'center', 'top', 'bottom', 'left', 'right', 'topleft', 'topright', 'bottomleft' or 'bottomright'. * Position of the dialog.
* @see DialogPositionType * @defaultValue center
* Default value is 'center'.
*/ */
position?: DialogPositionType; position?: 'center' | 'top' | 'bottom' | 'left' | 'right' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright' | undefined;
/** /**
* Whether the dialog can be displayed full screen. * Whether the dialog can be displayed full screen.
* @defaultValue false
*/ */
maximizable?: boolean | undefined; maximizable?: boolean | undefined;
/** /**
* Object literal to define widths per screen size. * Object literal to define widths per screen size.
* @see DialogBreakpoints
*/ */
breakpoints?: DialogBreakpoints; breakpoints?: DialogBreakpoints;
/** /**
* Enables dragging to change the position using header. * Enables dragging to change the position using header.
* Default value is true. * @defaultValue true
*/ */
draggable?: boolean | undefined; draggable?: boolean | undefined;
/** /**
* Keeps dialog in the viewport when dragging. * Keeps dialog in the viewport when dragging.
* Default value is true. * @defaultValue true
*/ */
keepInViewPort?: boolean | undefined; keepInViewPort?: boolean | undefined;
/** /**
* Minimum value for the left coordinate of dialog in dragging. * Minimum value for the left coordinate of dialog in dragging.
* Default value is 0. * @defaultValue 0.
*/ */
minX?: number | undefined; minX?: number | undefined;
/** /**
* Minimum value for the top coordinate of dialog in dragging. * Minimum value for the top coordinate of dialog in dragging.
* Default value is 0. * @defaultValue 0
*/ */
minY?: number | undefined; minY?: number | undefined;
/** /**
* A valid query selector or an HTMLElement to specify where the dialog gets attached. Special keywords are 'body' for document body and 'self' for the element itself. * A valid query selector or an HTMLElement to specify where the dialog gets attached.
* @see DialogAppendToType * @defaultValue body
* Default value is 'body'.
*/ */
appendTo?: DialogAppendToType; appendTo?: 'body' | 'self' | string | undefined | HTMLElement;
/** /**
* Style of the dynamic dialog. * Style of the dynamic dialog.
*/ */
style?: any; style?: any;
/** /**
* Icon to display in the dialog close button. * Icon to display in the dialog close button.
* Default value is 'pi pi-times'. * @defaultValue pi pi-times
*/ */
closeIcon?: string | undefined; closeIcon?: string | undefined;
/** /**
* Icon to display in the dialog maximize button when dialog is not maximized. * Icon to display in the dialog maximize button when dialog is not maximized.
* Default value is 'pi pi-window-maximize'. * @defaultValue pi pi-window-maximize
*/ */
maximizeIcon?: string | undefined; maximizeIcon?: string | undefined;
/** /**
* Icon to display in the dialog maximize button when dialog is maximized. * Icon to display in the dialog maximize button when dialog is maximized.
* Default value is 'pi pi-window-minimize'. * @defaultValue pi pi-window-minimize
*/ */
minimizeIcon?: string | undefined; minimizeIcon?: string | undefined;
} }
/**
* Defines valid slots in Dialog component.
*/
export interface DialogSlots { export interface DialogSlots {
/** /**
* Default content slot. * Default content slot.
*/ */
default: () => VNode[]; default(): VNode[];
/** /**
* Custom header template. * Custom header template.
*/ */
header: () => VNode[]; header(): VNode[];
/** /**
* Custom footer template. * Custom footer template.
*/ */
footer: () => VNode[]; footer(): VNode[];
} }
export declare type DialogEmits = { /**
* Defines valid emits in Dialog component.
*/
export interface DialogEmits {
/** /**
* Emitted when the visible changes. * Emitted when the visible changes.
* @param {boolean} value - New value. * @param {boolean} value - New value.
*/ */
'update:visible': (value: boolean) => void; 'update:visible'(value: boolean): void;
/** /**
* Callback to invoke when dialog is hidden. * Callback to invoke when dialog is hidden.
*/ */
hide: () => void; hide(): void;
/** /**
* Callback to invoke after dialog is hidden. * Callback to invoke after dialog is hidden.
*/ */
'after-hide': () => void; 'after-hide'(): void;
/** /**
* Callback to invoke when dialog is shown. * Callback to invoke when dialog is shown.
*/ */
show: () => void; show(): void;
/** /**
* Fired when a dialog gets maximized. * Fired when a dialog gets maximized.
* @param {event} event - Browser event. * @param {event} event - Browser event.
*/ */
maximize: (event: Event) => void; maximize(event: Event): void;
/** /**
* Fired when a dialog gets unmaximized. * Fired when a dialog gets unmaximized.
* @param {event} event - Browser event. * @param {event} event - Browser event.
*/ */
unmaximize: (event: Event) => void; unmaximize(event: Event): void;
/** /**
* Fired when a dialog drag completes. * Fired when a dialog drag completes.
* @param {event} event - Browser event. * @param {event} event - Browser event.
*/ */
dragend: (event: Event) => void; dragend(event: Event): void;
}; }
declare class Dialog extends ClassComponent<DialogProps, DialogSlots, DialogEmits> {} /**
* **PrimeVue - Dialog**
*
* _Dialog is a container to display content in an overlay window._
*
* [Live Demo](https://www.primevue.org/dialog/)
* --- ---
* ![PrimeVue](https://primefaces.org/cdn/primevue/images/logo-100.png)
*
* @group Component
*/
export declare class Dialog extends ClassComponent<DialogProps, DialogSlots, DialogEmits> {}
declare module '@vue/runtime-core' { declare module '@vue/runtime-core' {
interface GlobalComponents { interface GlobalComponents {
@ -206,13 +236,4 @@ declare module '@vue/runtime-core' {
} }
} }
/**
*
* Dialog is a container to display content in an overlay window.
*
* Demos:
*
* - [Dialog](https://www.primefaces.org/primevue/dialog)
*
*/
export default Dialog; export default Dialog;