vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-08 16:37:15 +00:00
Code Issues Projects Releases Packages Wiki Activity

Refactor #3911 - For Message

Browse source
This commit is contained in:
Tuğçe Küçükoğlu 2023-04-28 14:56:49 +03:00
parent c7bc9450f8
commit 6ec5a5c8b3
3 changed files with 74 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

16
components/lib/message/Message.vue
View file

@ -1,17 +1,17 @@
<template>
<transition name="p-message" appear>
<div v-show="visible" :class="containerClass" role="alert" aria-live="assertive" aria-atomic="true">
<div class="p-message-wrapper">
<div v-show="visible" :class="containerClass" role="alert" aria-live="assertive" aria-atomic="true" v-bind="ptm('root')">
<div class="p-message-wrapper" v-bind="ptm('wrapper')">
<slot name="messageicon" class="p-message-icon">
<component :is="icon ? 'span' : iconComponent" :class="['p-message-icon', icon]"></component>
<component :is="icon ? 'span' : iconComponent" :class="['p-message-icon', icon]" v-bind="ptm('icon')"></component>
</slot>
<div class="p-message-text">
<div class="p-message-text" v-bind="ptm('text')">
<slot></slot>
</div>
<button v-if="closable" v-ripple class="p-message-close p-link" :aria-label="closeAriaLabel" type="button" @click="close($event)" v-bind="closeButtonProps">
<button v-if="closable" v-ripple class="p-message-close p-link" :aria-label="closeAriaLabel" type="button" @click="close($event)" v-bind="{ ...closeButtonProps, ...ptm('button') }">
<slot name="closeicon" class="p-message-close-icon">
<i v-if="closeIcon" :class="['p-message-close-icon', closeIcon]" />
<TimesIcon v-else class="p-message-close-icon" />
<i v-if="closeIcon" :class="['p-message-close-icon', closeIcon]" v-bind="ptm('buttonIcon')" />
<TimesIcon v-else class="p-message-close-icon" v-bind="ptm('buttonIcon')" />
</slot>
</button>
</div>
@ -20,6 +20,7 @@
</template>
<script>
import BaseComponent from 'primevue/basecomponent';
import CheckIcon from 'primevue/icons/check';
import ExclamationTriangleIcon from 'primevue/icons/exclamationtriangle';
import InfoCircleIcon from 'primevue/icons/infocircle';
@ -29,6 +30,7 @@ import Ripple from 'primevue/ripple';
export default {
name: 'Message',
extends: BaseComponent,
emits: ['close'],
props: {
severity: {