primevue-mirror/packages/primevue/scripts/components/dialog.js

228 lines
5.8 KiB
JavaScript
Raw Normal View History

const DialogProps = [
{
2022-09-14 14:26:41 +00:00
name: 'header',
type: 'any',
default: 'null',
description: 'Title content of the dialog.'
},
{
2022-09-14 14:26:41 +00:00
name: 'footer',
type: 'any',
default: 'null',
description: 'Footer content of the dialog.'
},
{
2022-09-14 14:26:41 +00:00
name: 'visible',
type: 'boolean',
default: 'false',
description: 'Specifies the visibility of the dialog.'
},
{
2022-09-14 14:26:41 +00:00
name: 'modal',
type: 'boolean',
default: 'null',
description: 'Defines if background should be blocked when dialog is displayed.'
},
{
2022-09-14 14:26:41 +00:00
name: 'closeOnEscape',
type: 'boolean',
default: 'true',
description: 'Specifies if pressing escape key should hide the dialog.'
},
{
2022-09-14 14:26:41 +00:00
name: 'dismissableMask',
type: 'boolean',
default: 'false',
description: 'Specifies if clicking the modal background should hide the dialog.'
},
{
2022-09-14 14:26:41 +00:00
name: 'position',
type: 'string',
default: 'center',
description: 'Position of the dialog, options are "center", "top", "bottom", "left", "right", "topleft", "topright", "bottomleft" or "bottomright".'
},
{
2022-09-14 14:26:41 +00:00
name: 'contentStyle',
type: 'object',
default: 'null',
description: 'Style of the content section.'
},
{
2022-09-14 14:26:41 +00:00
name: 'contentClass',
type: 'string',
default: 'null',
description: 'Style class of the content section.'
},
{
2022-09-14 14:26:41 +00:00
name: 'closable',
type: 'boolean',
default: 'true',
description: 'Adds a close icon to the header to hide the dialog.'
},
{
2022-09-14 14:26:41 +00:00
name: 'showHeader',
type: 'boolean',
default: 'true',
description: 'Whether to show the header or not.'
},
{
name: 'blockScroll',
type: 'boolean',
default: 'false',
description: 'Whether background scroll should be blocked when dialog is visible.'
},
{
2022-09-14 14:26:41 +00:00
name: 'baseZIndex',
type: 'number',
default: '0',
description: 'Base zIndex value to use in layering.'
},
{
2022-09-14 14:26:41 +00:00
name: 'autoZIndex',
type: 'boolean',
default: 'true',
description: 'Whether to automatically manage layering.'
},
{
2022-09-14 14:26:41 +00:00
name: 'ariaCloseLabel',
type: 'string',
default: 'close',
description: 'Aria label of the close icon.'
},
{
2022-09-14 14:26:41 +00:00
name: 'maximizable',
type: 'boolean',
default: 'false',
description: 'Whether the dialog can be displayed full screen.'
},
{
2022-09-14 14:26:41 +00:00
name: 'breakpoints',
type: 'object',
default: 'null',
description: 'Object literal to define widths per screen size.'
},
{
2022-09-14 14:26:41 +00:00
name: 'draggable',
type: 'boolean',
default: 'true',
description: 'Whether the dialog can be relocated by dragging.'
},
{
2022-09-14 14:26:41 +00:00
name: 'minX',
type: 'number',
default: '0',
description: 'Minimum value for the left coordinate of dialog in dragging.'
},
{
2022-09-14 14:26:41 +00:00
name: 'minY',
type: 'number',
default: '0',
description: 'Minimum value for the top coordinate of dialog in dragging.'
},
{
2022-09-14 14:26:41 +00:00
name: 'keepInViewport',
type: 'boolean',
default: 'true',
description: 'Keeps dialog in the viewport when dragging.'
},
{
2022-09-14 14:26:41 +00:00
name: 'appendTo',
type: 'string',
default: 'body',
description: '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.'
2023-04-24 09:59:20 +00:00
},
{
name: 'pt',
type: 'any',
default: 'null',
2023-08-01 14:01:12 +00:00
description: 'Used to pass attributes to DOM elements inside the component.'
2023-07-06 13:20:37 +00:00
},
{
name: 'unstyled',
type: 'boolean',
default: 'false',
description: 'When enabled, it removes component related styles in the core.'
}
];
const DialogEvents = [
{
2022-09-14 14:26:41 +00:00
name: 'hide',
description: 'Callback to invoke when dialog is hidden.'
},
{
2022-09-14 14:26:41 +00:00
name: 'after-hide',
description: 'Callback to invoke after dialog is hidden.'
},
{
2022-09-14 14:26:41 +00:00
name: 'show',
description: 'Callback to invoke when dialog is showed.'
},
{
2022-09-14 14:26:41 +00:00
name: 'maximize',
description: 'Fired when a dialog gets maximized.',
arguments: [
{
2022-09-14 14:26:41 +00:00
name: 'event',
type: 'object',
description: 'Event Object'
}
]
},
{
2022-09-14 14:26:41 +00:00
name: 'unmaximize',
description: 'Fired when a dialog gets unmaximized.',
arguments: [
{
2022-09-14 14:26:41 +00:00
name: 'event',
type: 'object',
description: 'Event Object'
}
]
},
{
2022-09-14 14:26:41 +00:00
name: 'dragend',
description: 'Fired when a dialog drag completes.',
arguments: [
{
2022-09-14 14:26:41 +00:00
name: 'event',
type: 'object',
description: 'Event Object'
}
]
}
];
const DialogSlots = [
{
2022-09-14 14:26:41 +00:00
name: 'header',
description: "Custom content for the component's header"
},
{
2022-09-14 14:26:41 +00:00
name: 'footer',
description: "Custom content for the component's footer"
},
{
name: 'closeicon',
description: 'Custom close icon template.'
},
{
name: 'maximizeicon',
description: 'Custom maximizeicon icon template of dialog.'
},
{
name: 'container',
description: 'Custom container template.'
}
];
module.exports = {
dialog: {
2022-09-14 14:26:41 +00:00
name: 'Dialog',
description: 'Dialog is a container to display content in an overlay window.',
props: DialogProps,
events: DialogEvents,
slots: DialogSlots
}
};