Refactor #3832 Refactor #3833 - For ConfirmPopup & ConfirmDialog

pull/3892/head
Tuğçe Küçükoğlu 2023-04-19 09:49:03 +03:00
parent 3339f1f194
commit c7f2bf5383
4 changed files with 26 additions and 6 deletions

View File

@ -61,11 +61,21 @@ export interface ConfirmDialogSlots {
* Custom message template. * Custom message template.
* @param {Object} scope - message slot's params. * @param {Object} scope - message slot's params.
*/ */
message(scope: { message: ConfirmationOptions }): VNode[]; message(scope: {
/**
* Message of the component
*/
message: ConfirmationOptions;
}): VNode[];
/** /**
* Custom icon template. * Custom icon template.
*/ */
icon(): VNode[]; icon(scope: {
/**
* Style class of the icon template
*/
class: any;
}): VNode[];
/** /**
* Custom icon template. * Custom icon template.
*/ */

View File

@ -13,7 +13,7 @@
@update:visible="onHide" @update:visible="onHide"
> >
<template v-if="!$slots.message"> <template v-if="!$slots.message">
<slot name="icon"> <slot name="icon" class="p-confirm-dialog-icon">
<component v-if="$slots.icon" :is="$slots.icon" class="p-confirm-dialog-icon" /> <component v-if="$slots.icon" :is="$slots.icon" class="p-confirm-dialog-icon" />
<span v-else-if="confirmation.icon" :class="iconClass" /> <span v-else-if="confirmation.icon" :class="iconClass" />
</slot> </slot>

View File

@ -29,11 +29,21 @@ export interface ConfirmPopupSlots {
* Custom message template. * Custom message template.
* @param {Object} scope - message slot's params. * @param {Object} scope - message slot's params.
*/ */
message(scope: { message: ConfirmationOptions }): VNode[]; message(scope: {
/**
* Message of the component
*/
message: ConfirmationOptions;
}): VNode[];
/** /**
* Custom icon template. * Custom icon template.
*/ */
icon(): VNode[]; icon(scope: {
/**
* Style class of the icon template
*/
class: any;
}): VNode[];
/** /**
* Custom icon template. * Custom icon template.
*/ */

View File

@ -4,7 +4,7 @@
<div v-if="visible" :ref="containerRef" v-focustrap role="alertdialog" :class="containerClass" :aria-modal="visible" @click="onOverlayClick" @keydown="onOverlayKeydown" v-bind="$attrs"> <div v-if="visible" :ref="containerRef" v-focustrap role="alertdialog" :class="containerClass" :aria-modal="visible" @click="onOverlayClick" @keydown="onOverlayKeydown" v-bind="$attrs">
<template v-if="!$slots.message"> <template v-if="!$slots.message">
<div class="p-confirm-popup-content"> <div class="p-confirm-popup-content">
<slot name="icon"> <slot name="icon" class="p-confirm-popup-icon">
<component v-if="$slots.icon" :is="$slots.icon" class="p-confirm-popup-icon" /> <component v-if="$slots.icon" :is="$slots.icon" class="p-confirm-popup-icon" />
<span v-else-if="confirmation.icon" :class="iconClass" /> <span v-else-if="confirmation.icon" :class="iconClass" />
</slot> </slot>