Fixed #4159 - Rename button and buttonIcon pt options with closeButton and closeIcon options in Message
parent
ee4dfdcdd4
commit
822d217a87
|
@ -53,8 +53,8 @@ const classes = {
|
||||||
wrapper: 'p-message-wrapper',
|
wrapper: 'p-message-wrapper',
|
||||||
icon: 'p-message-icon',
|
icon: 'p-message-icon',
|
||||||
text: 'p-message-text',
|
text: 'p-message-text',
|
||||||
button: 'p-message-close p-link',
|
closeButton: 'p-message-close p-link',
|
||||||
buttonIcon: 'p-message-close-icon'
|
closeIcon: 'p-message-close-icon'
|
||||||
};
|
};
|
||||||
|
|
||||||
const { load: loadStyle } = useStyle(styles, { name: 'message', manual: true });
|
const { load: loadStyle } = useStyle(styles, { name: 'message', manual: true });
|
||||||
|
|
|
@ -45,12 +45,22 @@ export interface MessagePassThroughOptions {
|
||||||
text?: MessagePassThroughOptionType;
|
text?: MessagePassThroughOptionType;
|
||||||
/**
|
/**
|
||||||
* Uses to pass attributes to the button's DOM element.
|
* Uses to pass attributes to the button's DOM element.
|
||||||
|
* @deprecated since v3.30.2. Use 'closeButton' option.
|
||||||
*/
|
*/
|
||||||
button?: MessagePassThroughOptionType;
|
button?: MessagePassThroughOptionType;
|
||||||
|
/**
|
||||||
|
* Uses to pass attributes to the button's DOM element.
|
||||||
|
*/
|
||||||
|
closeButton?: MessagePassThroughOptionType;
|
||||||
/**
|
/**
|
||||||
* Uses to pass attributes to the button icon's DOM element.
|
* Uses to pass attributes to the button icon's DOM element.
|
||||||
|
* @deprecated since v3.30.2. Use 'closeIcon' option.
|
||||||
*/
|
*/
|
||||||
buttonIcon?: MessagePassThroughOptionType;
|
buttonIcon?: MessagePassThroughOptionType;
|
||||||
|
/**
|
||||||
|
* Uses to pass attributes to the button icon's DOM element.
|
||||||
|
*/
|
||||||
|
closeIcon?: MessagePassThroughOptionType;
|
||||||
/**
|
/**
|
||||||
* Uses to manage all lifecycle hooks
|
* Uses to manage all lifecycle hooks
|
||||||
* @see {@link BaseComponent.ComponentHooks}
|
* @see {@link BaseComponent.ComponentHooks}
|
||||||
|
|
|
@ -8,10 +8,10 @@
|
||||||
<div class="p-message-text" :class="cx('text')" v-bind="ptm('text')">
|
<div class="p-message-text" :class="cx('text')" v-bind="ptm('text')">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
<button v-if="closable" v-ripple :class="cx('button')" :aria-label="closeAriaLabel" type="button" @click="close($event)" v-bind="{ ...closeButtonProps, ...ptm('button') }">
|
<button v-if="closable" v-ripple :class="cx('closeButton')" :aria-label="closeAriaLabel" type="button" @click="close($event)" v-bind="{ ...closeButtonProps, ...ptm('button'), ...ptm('closeButton') }">
|
||||||
<slot name="closeicon">
|
<slot name="closeicon">
|
||||||
<i v-if="closeIcon" :class="[cx('buttonIcon'), closeIcon]" v-bind="ptm('buttonIcon')" />
|
<i v-if="closeIcon" :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...ptm('buttonIcon'), ...ptm('closeIcon') }" />
|
||||||
<TimesIcon v-else :class="[cx('buttonIcon'), closeIcon]" v-bind="ptm('buttonIcon')" />
|
<TimesIcon v-else :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...ptm('buttonIcon'), ...ptm('closeIcon') }" />
|
||||||
</slot>
|
</slot>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue