vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

refactor: #7090 for Fieldset

pull/7007/merge
Mert Sincan 2025-01-14 11:11:12 +00:00
parent 733d2d8f37
commit 2b97123737
1 changed files with 4 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
packages/primevue/src/fieldset/Fieldset.vue
View File

@ -2,13 +2,13 @@
<fieldset :class="cx('root')" v-bind="ptmi('root')">
<legend :class="cx('legend')" v-bind="ptm('legend')">
<slot name="legend" :toggleCallback="toggle">
<span v-if="!toggleable" :id="id + '_header'" :class="cx('legendLabel')" v-bind="ptm('legendLabel')">{{ legend }}</span>
<span v-if="!toggleable" :id="$id + '_header'" :class="cx('legendLabel')" v-bind="ptm('legendLabel')">{{ legend }}</span>
<button
v-if="toggleable"
:id="id + '_header'"
:id="$id + '_header'"
v-ripple
type="button"
:aria-controls="id + '_content'"
:aria-controls="$id + '_content'"
:aria-expanded="!d_collapsed"
:aria-label="buttonAriaLabel"
:class="cx('toggleButton')"
@ -25,7 +25,7 @@
</slot>
</legend>
<transition name="p-toggleable-content" v-bind="ptm('transition')">
<div v-show="!d_collapsed" :id="id + '_content'" :class="cx('contentContainer')" role="region" :aria-labelledby="id + '_header'" v-bind="ptm('contentContainer')">
<div v-show="!d_collapsed" :id="$id + '_content'" :class="cx('contentContainer')" role="region" :aria-labelledby="$id + '_header'" v-bind="ptm('contentContainer')">
<div :class="cx('content')" v-bind="ptm('content')">
<slot></slot>
</div>
@ -35,7 +35,6 @@
</template>
<script>
import { UniqueComponentId } from '@primevue/core/utils';
import MinusIcon from '@primevue/icons/minus';
import PlusIcon from '@primevue/icons/plus';
import Ripple from 'primevue/ripple';
@ -48,21 +47,14 @@ export default {
emits: ['update:collapsed', 'toggle'],
data() {
return {
id: this.$attrs.id,
d_collapsed: this.collapsed
};
},
watch: {
'$attrs.id': function (newValue) {
this.id = newValue || UniqueComponentId();
},
collapsed(newValue) {
this.d_collapsed = newValue;
}
},
mounted() {
this.id = this.id || UniqueComponentId();
},
methods: {
toggle(event) {
this.d_collapsed = !this.d_collapsed;