Fixed #4728 - Change slot parameter function name on* to *CallBack

pull/4806/head
tugcekucukoglu 2023-10-31 15:52:10 +03:00
parent 6f342ad243
commit 2cc5e637ae
14 changed files with 69 additions and 7 deletions

View File

@ -222,16 +222,31 @@ export interface ConfirmDialogSlots {
message: any; message: any;
/** /**
* Close dialog function. * Close dialog function.
* @deprecated since v3.39.0. Use 'closeCallback' property instead.
*/ */
onClose: () => void; onClose: () => void;
/** /**
* Accept function of the component * Accept function of the component
* @deprecated since v3.39.0. Use 'acceptCallback' property instead.
*/ */
onAccept: () => void; onAccept: () => void;
/** /**
* Reject function of the component * Reject function of the component
* @deprecated since v3.39.0. Use 'rejectCallback' property instead.
*/ */
onReject: () => void; onReject: () => void;
/**
* Close dialog function.
*/
closeCallback: () => void;
/**
* Accept function of the component
*/
acceptCallback: () => void;
/**
* Reject function of the component
*/
rejectCallback: () => void;
}): VNode[]; }): VNode[];
} }

View File

@ -15,7 +15,7 @@
:unstyled="unstyled" :unstyled="unstyled"
> >
<template v-if="$slots.container" #container="slotProps"> <template v-if="$slots.container" #container="slotProps">
<slot name="container" :message="confirmation" :onClose="slotProps.onClose" :onAccept="accept" :onReject="reject" /> <slot name="container" :message="confirmation" :onClose="slotProps.onClose" :onAccept="accept" :onReject="reject" :closeCallback="slotProps.onclose" :acceptCallback="accept" :rejectCallback="reject" />
</template> </template>
<template v-if="!$slots.container"> <template v-if="!$slots.container">
<template v-if="!$slots.message"> <template v-if="!$slots.message">

View File

@ -176,12 +176,22 @@ export interface ConfirmPopupSlots {
message: any; message: any;
/** /**
* Accept function of the component * Accept function of the component
* @deprecated since v3.39.0. Use 'acceptCallback' property instead.
*/ */
onAccept: () => void; onAccept: () => void;
/** /**
* Reject function of the component * Reject function of the component
* @deprecated since v3.39.0. Use 'rejectCallback' property instead.
*/ */
onReject: () => void; onReject: () => void;
/**
* Accept function of the component
*/
acceptCallback: () => void;
/**
* Reject function of the component
*/
rejectCallback: () => void;
}): VNode[]; }): VNode[];
} }

View File

@ -2,7 +2,7 @@
<Portal> <Portal>
<transition name="p-confirm-popup" @enter="onEnter" @after-enter="onAfterEnter" @leave="onLeave" @after-leave="onAfterLeave" v-bind="ptm('transition')"> <transition name="p-confirm-popup" @enter="onEnter" @after-enter="onAfterEnter" @leave="onLeave" @after-leave="onAfterLeave" v-bind="ptm('transition')">
<div v-if="visible" :ref="containerRef" v-focustrap role="alertdialog" :class="cx('root')" :aria-modal="visible" @click="onOverlayClick" @keydown="onOverlayKeydown" v-bind="{ ...$attrs, ...ptm('root') }"> <div v-if="visible" :ref="containerRef" v-focustrap role="alertdialog" :class="cx('root')" :aria-modal="visible" @click="onOverlayClick" @keydown="onOverlayKeydown" v-bind="{ ...$attrs, ...ptm('root') }">
<slot v-if="$slots.container" name="container" :message="confirmation" :onAccept="accept" :onReject="reject"></slot> <slot v-if="$slots.container" name="container" :message="confirmation" :onAccept="accept" :onReject="reject" :acceptCallback="accept" :rejectCallback="reject"></slot>
<template v-else> <template v-else>
<template v-if="!$slots.message"> <template v-if="!$slots.message">
<div :class="cx('content')" v-bind="ptm('content')"> <div :class="cx('content')" v-bind="ptm('content')">

View File

@ -339,13 +339,24 @@ export interface DialogSlots {
container(scope: { container(scope: {
/** /**
* Close dialog function. * Close dialog function.
* @deprecated since v3.39.0. Use 'closeCallback' property instead.
*/ */
onClose: () => void; onClose: () => void;
/** /**
* Maximize/minimize dialog function. * Maximize/minimize dialog function.
* @param {Event} event - Browser event * @param {Event} event - Browser event
* @deprecated since v3.39.0. Use 'maximizeCallback' property instead.
*/ */
onMaximize: (event: Event) => void; onMaximize: (event: Event) => void;
/**
* Close dialog function.
*/
closeCallback: () => void;
/**
* Maximize/minimize dialog function.
* @param {Event} event - Browser event
*/
maximizeCallback: (event: Event) => void;
}): VNode[]; }): VNode[];
} }

View File

@ -3,7 +3,7 @@
<div v-if="containerVisible" :ref="maskRef" :class="cx('mask')" :style="sx('mask', true, { position, modal })" @click="onMaskClick" v-bind="ptm('mask')"> <div v-if="containerVisible" :ref="maskRef" :class="cx('mask')" :style="sx('mask', true, { position, modal })" @click="onMaskClick" v-bind="ptm('mask')">
<transition name="p-dialog" @before-enter="onBeforeEnter" @enter="onEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')"> <transition name="p-dialog" @before-enter="onBeforeEnter" @enter="onEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')">
<div v-if="visible" :ref="containerRef" v-focustrap="{ disabled: !modal }" :class="cx('root')" :style="sx('root')" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" v-bind="{ ...$attrs, ...ptm('root') }"> <div v-if="visible" :ref="containerRef" v-focustrap="{ disabled: !modal }" :class="cx('root')" :style="sx('root')" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" v-bind="{ ...$attrs, ...ptm('root') }">
<slot v-if="$slots.container" name="container" :onClose="close" :onMaximize="(event) => maximize(event)"></slot> <slot v-if="$slots.container" name="container" :onClose="close" :onMaximize="(event) => maximize(event)" :closeCallback="close" :maximizeCallback="(event) => maximize(event)"></slot>
<template v-else> <template v-else>
<div v-if="showHeader" :ref="headerContainerRef" :class="cx('header')" @mousedown="initDrag" v-bind="ptm('header')"> <div v-if="showHeader" :ref="headerContainerRef" :class="cx('header')" @mousedown="initDrag" v-bind="ptm('header')">
<slot name="header" :class="cx('headerTitle')"> <slot name="header" :class="cx('headerTitle')">

View File

@ -195,8 +195,13 @@ export interface MessageSlots {
container(scope: { container(scope: {
/** /**
* Close message function. * Close message function.
* @deprecated since v3.39.0. Use 'closeCallback' property instead.
*/ */
onClose: () => void; onClose: () => void;
/**
* Close message function.
*/
closeCallback: () => void;
}): VNode[]; }): VNode[];
} }

View File

@ -1,7 +1,7 @@
<template> <template>
<transition name="p-message" appear v-bind="ptm('transition')"> <transition name="p-message" appear v-bind="ptm('transition')">
<div v-show="visible" :class="cx('root')" role="alert" aria-live="assertive" aria-atomic="true" v-bind="ptm('root')" data-pc-name="message"> <div v-show="visible" :class="cx('root')" role="alert" aria-live="assertive" aria-atomic="true" v-bind="ptm('root')" data-pc-name="message">
<slot v-if="$slots.container" name="container" :onClose="close"></slot> <slot v-if="$slots.container" name="container" :onClose="close" :closeCallback="close"></slot>
<div v-else :class="cx('wrapper')" v-bind="ptm('wrapper')"> <div v-else :class="cx('wrapper')" v-bind="ptm('wrapper')">
<slot name="messageicon" class="p-message-icon"> <slot name="messageicon" class="p-message-icon">
<component :is="icon ? 'span' : iconComponent" :class="[cx('icon'), icon]" v-bind="ptm('icon')"></component> <component :is="icon ? 'span' : iconComponent" :class="[cx('icon'), icon]" v-bind="ptm('icon')"></component>

View File

@ -203,13 +203,24 @@ export interface OverlayPanelEmits {
container(scope: { container(scope: {
/** /**
* Close overlay panel function. * Close overlay panel function.
* @deprecated since v3.39.0. Use 'closeCallback' property instead.
*/ */
onClose: () => void; onClose: () => void;
/** /**
* Close button keydown function. * Close button keydown function.
* @param {Event} event - Browser event * @param {Event} event - Browser event
* @deprecated since v3.39.0. Use 'keydownCallback' property instead.
*/ */
onKeydown: (event: Event) => void; onKeydown: (event: Event) => void;
/**
* Close overlay panel function.
*/
closeCallback: () => void;
/**
* Close button keydown function.
* @param {Event} event - Browser event
*/
keydownCallback: (event: Event) => void;
}): VNode[]; }): VNode[];
} }

View File

@ -2,7 +2,7 @@
<Portal :appendTo="appendTo"> <Portal :appendTo="appendTo">
<transition name="p-overlaypanel" @enter="onEnter" @leave="onLeave" @after-leave="onAfterLeave" v-bind="ptm('transition')"> <transition name="p-overlaypanel" @enter="onEnter" @leave="onLeave" @after-leave="onAfterLeave" v-bind="ptm('transition')">
<div v-if="visible" :ref="containerRef" v-focustrap role="dialog" :aria-modal="visible" @click="onOverlayClick" :class="cx('root')" v-bind="{ ...$attrs, ...ptm('root') }"> <div v-if="visible" :ref="containerRef" v-focustrap role="dialog" :aria-modal="visible" @click="onOverlayClick" :class="cx('root')" v-bind="{ ...$attrs, ...ptm('root') }">
<slot v-if="$slots.container" name="container" :onClose="hide" :onKeydown="(event) => onButtonKeydown(event)"></slot> <slot v-if="$slots.container" name="container" :onClose="hide" :onKeydown="(event) => onButtonKeydown(event)" :closeCallback="hide" :keydownCallback="(event) => onButtonKeydown(event)"></slot>
<template v-else> <template v-else>
<div :class="cx('content')" @click="onContentClick" @mousedown="onContentClick" @keydown="onContentKeydown" v-bind="ptm('content')"> <div :class="cx('content')" @click="onContentClick" @mousedown="onContentClick" @keydown="onContentKeydown" v-bind="ptm('content')">
<slot></slot> <slot></slot>

View File

@ -195,8 +195,13 @@ export interface SidebarSlots {
container(scope: { container(scope: {
/** /**
* Close sidebar function. * Close sidebar function.
* @deprecated since v3.39.0. Use 'closeCallback' property instead.
*/ */
onClose: () => void; onClose: () => void;
/**
* Close sidebar function.
*/
closeCallback: () => void;
}): VNode[]; }): VNode[];
} }

View File

@ -3,7 +3,7 @@
<div v-if="containerVisible" :ref="maskRef" @mousedown="onMaskClick" :class="cx('mask')" :style="sx('mask', true, { position })" v-bind="ptm('mask')"> <div v-if="containerVisible" :ref="maskRef" @mousedown="onMaskClick" :class="cx('mask')" :style="sx('mask', true, { position })" v-bind="ptm('mask')">
<transition name="p-sidebar" @enter="onEnter" @after-enter="onAfterEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')"> <transition name="p-sidebar" @enter="onEnter" @after-enter="onAfterEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')">
<div v-if="visible" :ref="containerRef" v-focustrap :class="cx('root')" role="complementary" :aria-modal="modal" @keydown="onKeydown" v-bind="{ ...$attrs, ...ptm('root') }"> <div v-if="visible" :ref="containerRef" v-focustrap :class="cx('root')" role="complementary" :aria-modal="modal" @keydown="onKeydown" v-bind="{ ...$attrs, ...ptm('root') }">
<slot v-if="$slots.container" name="container" :onClose="hide"></slot> <slot v-if="$slots.container" name="container" :onClose="hide" :closeCallback="hide"></slot>
<template v-else> <template v-else>
<div :ref="headerContainerRef" :class="cx('header')" v-bind="ptm('header')"> <div :ref="headerContainerRef" :class="cx('header')" v-bind="ptm('header')">
<div v-if="$slots.header" :class="cx('headerContent')" v-bind="ptm('headerContent')"> <div v-if="$slots.header" :class="cx('headerContent')" v-bind="ptm('headerContent')">

View File

@ -305,8 +305,13 @@ export interface ToastSlots {
message: any; message: any;
/** /**
* Close toast function * Close toast function
* @deprecated since v3.39.0. Use 'closeCallback' property instead.
*/ */
onClose: () => void; onClose: () => void;
/**
* Close sidebar function.
*/
closeCallback: () => void;
}): VNode[]; }): VNode[];
} }

View File

@ -1,6 +1,6 @@
<template> <template>
<div :class="[cx('container'), message.styleClass]" role="alert" aria-live="assertive" aria-atomic="true" v-bind="ptm('container')"> <div :class="[cx('container'), message.styleClass]" role="alert" aria-live="assertive" aria-atomic="true" v-bind="ptm('container')">
<component v-if="templates.container" :is="templates.container" :message="message" :onClose="onCloseClick" /> <component v-if="templates.container" :is="templates.container" :message="message" :onClose="onCloseClick" :closeCallback="onCloseClick" />
<div v-else :class="[cx('content'), message.contentStyleClass]" v-bind="ptm('content')"> <div v-else :class="[cx('content'), message.contentStyleClass]" v-bind="ptm('content')">
<template v-if="!templates.message"> <template v-if="!templates.message">
<component :is="templates.icon ? templates.icon : iconComponent && iconComponent.name ? iconComponent : 'span'" :class="cx('icon')" v-bind="ptm('icon')" /> <component :is="templates.icon ? templates.icon : iconComponent && iconComponent.name ? iconComponent : 'span'" :class="cx('icon')" v-bind="ptm('icon')" />