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 #3965 - For InlineMessage

Browse source
This commit is contained in:
Bahadır Sofuoğlu 2023-05-25 17:15:19 +03:00
parent 34d2b65236
commit 0d3816522a
3 changed files with 66 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

41
components/lib/inlinemessage/InlineMessage.vue
View file

@ -1,16 +1,16 @@
<template>
<div aria-live="polite" :class="containerClass" v-bind="ptm('root')">
<div aria-live="polite" :class="cx('root')" v-bind="ptm('root')">
<slot name="icon">
<component :is="icon ? 'span' : iconComponent" :class="['p-inline-message-icon', icon]" v-bind="ptm('icon')"></component>
<component :is="icon ? 'span' : iconComponent" :class="cx('icon')" v-bind="ptm('icon')"></component>
</slot>
<span class="p-inline-message-text" v-bind="ptm('text')">
<span :class="cx('text')" v-bind="ptm('text')">
<slot>&nbsp;</slot>
</span>
</div>
</template>
<script>
import BaseComponent from 'primevue/basecomponent';
import BaseInlineMessage from './BaseInlineMessage.vue';
import CheckIcon from 'primevue/icons/check';
import ExclamationTriangleIcon from 'primevue/icons/exclamationtriangle';
import InfoCircleIcon from 'primevue/icons/infocircle';
@ -18,17 +18,7 @@ import TimesCircleIcon from 'primevue/icons/timescircle';
export default {
name: 'InlineMessage',
extends: BaseComponent,
props: {
severity: {
type: String,
default: 'error'
},
icon: {
type: String,
default: undefined
}
},
extends: BaseInlineMessage,
timeout: null,
data() {
return {
@ -43,9 +33,6 @@ export default {
}
},
computed: {
containerClass() {
return ['p-inline-message p-component p-inline-message-' + this.severity, { 'p-inline-message-icon-only': !this.$slots.default }];
},
iconComponent() {
return {
info: InfoCircleIcon,
@ -57,21 +44,3 @@ export default {
}
};
</script>
<style>
.p-inline-message {
display: inline-flex;
align-items: center;
justify-content: center;
vertical-align: top;
}
.p-inline-message-icon-only .p-inline-message-text {
visibility: hidden;
width: 0;
}
.p-fluid .p-inline-message {
display: flex;
}
</style>