2023-03-31 21:45:03 +00:00
|
|
|
<script>
|
2023-11-09 23:19:31 +00:00
|
|
|
import BaseComponent from 'primevue/basecomponent';
|
2023-10-02 10:46:09 +00:00
|
|
|
import BaseIconStyle from 'primevue/baseicon/style';
|
2024-01-23 09:33:54 +00:00
|
|
|
import { ObjectUtils, UniqueComponentId } from 'primevue/utils';
|
2023-03-31 21:45:03 +00:00
|
|
|
|
|
|
|
export default {
|
|
|
|
name: 'BaseIcon',
|
2023-11-09 23:19:31 +00:00
|
|
|
extends: BaseComponent,
|
2024-01-23 09:33:54 +00:00
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
id: this.$attrs.id
|
|
|
|
};
|
|
|
|
},
|
2023-03-31 21:45:03 +00:00
|
|
|
props: {
|
|
|
|
label: {
|
|
|
|
type: String,
|
2023-04-26 08:57:02 +00:00
|
|
|
default: undefined
|
2023-03-31 21:45:03 +00:00
|
|
|
},
|
|
|
|
spin: {
|
|
|
|
type: Boolean,
|
2023-04-26 08:57:02 +00:00
|
|
|
default: false
|
2023-03-31 21:45:03 +00:00
|
|
|
}
|
|
|
|
},
|
2023-11-09 23:19:31 +00:00
|
|
|
style: BaseIconStyle,
|
2024-01-23 09:33:54 +00:00
|
|
|
mounted() {
|
|
|
|
this.id = this.id || UniqueComponentId();
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
'$attrs.id': function (newValue) {
|
|
|
|
this.id = newValue || UniqueComponentId();
|
|
|
|
}
|
|
|
|
},
|
2023-03-31 21:45:03 +00:00
|
|
|
methods: {
|
|
|
|
pti() {
|
|
|
|
const isLabelEmpty = ObjectUtils.isEmpty(this.label);
|
|
|
|
|
|
|
|
return {
|
2023-12-20 13:23:24 +00:00
|
|
|
...(!this.isUnstyled && {
|
|
|
|
class: [
|
|
|
|
'p-icon',
|
|
|
|
{
|
|
|
|
'p-icon-spin': this.spin
|
|
|
|
}
|
|
|
|
]
|
|
|
|
}),
|
2024-01-23 09:33:54 +00:00
|
|
|
id: this.id,
|
2023-03-31 21:45:03 +00:00
|
|
|
role: !isLabelEmpty ? 'img' : undefined,
|
2023-04-03 08:26:51 +00:00
|
|
|
'aria-label': !isLabelEmpty ? this.label : undefined,
|
2023-03-31 21:45:03 +00:00
|
|
|
'aria-hidden': isLabelEmpty
|
|
|
|
};
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
</script>
|