Refactor #4159
parent
6578e42e19
commit
093562f217
|
@ -112,8 +112,8 @@ const classes = {
|
||||||
text: 'p-toast-message-text',
|
text: 'p-toast-message-text',
|
||||||
summary: 'p-toast-summary',
|
summary: 'p-toast-summary',
|
||||||
detail: 'p-toast-detail',
|
detail: 'p-toast-detail',
|
||||||
button: 'p-toast-icon-close p-link',
|
closeButton: 'p-toast-icon-close p-link',
|
||||||
buttonIcon: 'p-toast-icon-close-icon'
|
closeIcon: 'p-toast-icon-close-icon'
|
||||||
};
|
};
|
||||||
|
|
||||||
const { load: loadStyle } = useStyle(styles, { name: 'toast', manual: true });
|
const { load: loadStyle } = useStyle(styles, { name: 'toast', manual: true });
|
||||||
|
|
|
@ -65,12 +65,22 @@ export interface ToastPassThroughOptions {
|
||||||
buttonContainer?: ToastPassThroughOptionType;
|
buttonContainer?: ToastPassThroughOptionType;
|
||||||
/**
|
/**
|
||||||
* 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?: ToastPassThroughOptionType;
|
button?: ToastPassThroughOptionType;
|
||||||
|
/**
|
||||||
|
* Uses to pass attributes to the button's DOM element.
|
||||||
|
*/
|
||||||
|
closeButton?: ToastPassThroughOptionType;
|
||||||
/**
|
/**
|
||||||
* 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?: ToastPassThroughOptionType;
|
buttonIcon?: ToastPassThroughOptionType;
|
||||||
|
/**
|
||||||
|
* Uses to pass attributes to the button icon's DOM element.
|
||||||
|
*/
|
||||||
|
closeIcon?: ToastPassThroughOptionType;
|
||||||
/**
|
/**
|
||||||
* Uses to manage all lifecycle hooks
|
* Uses to manage all lifecycle hooks
|
||||||
* @see {@link BaseComponent.ComponentHooks}
|
* @see {@link BaseComponent.ComponentHooks}
|
||||||
|
|
|
@ -10,8 +10,8 @@
|
||||||
</template>
|
</template>
|
||||||
<component v-else :is="templates.message" :message="message"></component>
|
<component v-else :is="templates.message" :message="message"></component>
|
||||||
<div v-if="message.closable !== false" v-bind="ptm('buttonContainer')">
|
<div v-if="message.closable !== false" v-bind="ptm('buttonContainer')">
|
||||||
<button v-ripple :class="cx('button')" type="button" :aria-label="closeAriaLabel" @click="onCloseClick" autofocus v-bind="{ ...closeButtonProps, ...ptm('button') }">
|
<button v-ripple :class="cx('closeButton')" type="button" :aria-label="closeAriaLabel" @click="onCloseClick" autofocus v-bind="{ ...closeButtonProps, ...ptm('button'), ...ptm('closeButton') }">
|
||||||
<component :is="templates.closeicon || 'TimesIcon'" :class="[cx('buttonIcon'), closeIcon]" v-bind="ptm('buttonIcon')" />
|
<component :is="templates.closeicon || 'TimesIcon'" :class="[cx('closeIcon'), closeIcon]" v-bind="{ ...ptm('buttonIcon'), ...ptm('closeIcon') }" />
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue