Refactor #5257

components/lib/accordion/Accordion.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" v-bind="ptm('root')">
+    <div :class="cx('root')" v-bind="ptmi('root')">
         <div v-for="(tab, i) of tabs" :key="getKey(tab, i)" :class="cx('tab.root', { tab, index: i })" v-bind="getTabPT(tab, 'root', i)" data-pc-name="accordiontab" :data-pc-index="i" :data-p-active="isTabActive(i)">
             <div
                 :style="getTabProp(tab, 'headerStyle')"
@@ -64,6 +64,7 @@ import BaseAccordion from './BaseAccordion.vue';
 export default {
     name: 'Accordion',
     extends: BaseAccordion,
+    inheritAttrs: false,
     emits: ['update:activeIndex', 'tab-open', 'tab-close', 'tab-click'],
     data() {
         return {

components/lib/accordiontab/AccordionTab.vue

@@ -7,6 +7,7 @@ import BaseAccordionTab from './BaseAccordionTab.vue';
 
 export default {
     name: 'AccordionTab',
-    extends: BaseAccordionTab
+    extends: BaseAccordionTab,
+    inheritAttrs: false
 };
 </script>

components/lib/column/Column.vue

@@ -4,6 +4,7 @@ import BaseColumn from './BaseColumn.vue';
 export default {
     name: 'Column',
     extends: BaseColumn,
+    inheritAttrs: false,
     inject: ['$columns'],
     mounted() {
         this.$columns?.add(this.$);

components/lib/columngroup/ColumnGroup.vue

@@ -4,6 +4,7 @@ import BaseColumnGroup from './BaseColumnGroup.vue';
 export default {
     name: 'ColumnGroup',
     extends: BaseColumnGroup,
+    inheritAttrs: false,
     inject: ['$columnGroups'],
     mounted() {
         this.$columnGroups?.add(this.$);

components/lib/confirmpopup/ConfirmPopup.vue

@@ -1,7 +1,7 @@
 <template>
     <Portal>
         <transition name="p-confirm-popup" @enter="onEnter" @after-enter="onAfterEnter" @leave="onLeave" @after-leave="onAfterLeave" v-bind="ptm('transition')">
-            <div v-if="visible" :ref="containerRef" v-focustrap role="alertdialog" :class="cx('root')" :aria-modal="visible" @click="onOverlayClick" @keydown="onOverlayKeydown" v-bind="{ ...$attrs, ...ptm('root') }">
+            <div v-if="visible" :ref="containerRef" v-focustrap role="alertdialog" :class="cx('root')" :aria-modal="visible" @click="onOverlayClick" @keydown="onOverlayKeydown" v-bind="ptmi('root')">
                 <slot v-if="$slots.container" name="container" :message="confirmation" :onAccept="accept" :onReject="reject" :acceptCallback="accept" :rejectCallback="reject"></slot>
                 <template v-else>
                     <template v-if="!$slots.message">

components/lib/contextmenu/ContextMenu.vue

@@ -1,7 +1,7 @@
 <template>
     <Portal :appendTo="appendTo">
         <transition name="p-contextmenu" @enter="onEnter" @after-enter="onAfterEnter" @leave="onLeave" @after-leave="onAfterLeave" v-bind="ptm('transition')">
-            <div v-if="visible" :ref="containerRef" :class="cx('root')" v-bind="{ ...$attrs, ...ptm('root') }">
+            <div v-if="visible" :ref="containerRef" :class="cx('root')" v-bind="ptmi('root')">
                 <ContextMenuSub
                     :ref="listRef"
                     :id="id + '_list'"

components/lib/datatable/DataTable.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" data-scrollselectors=".p-datatable-wrapper" v-bind="ptm('root')">
+    <div :class="cx('root')" data-scrollselectors=".p-datatable-wrapper" v-bind="ptmi('root')">
         <slot></slot>
         <div v-if="loading" :class="cx('loadingOverlay')" v-bind="ptm('loadingOverlay')">
             <slot v-if="$slots.loading" name="loading"></slot>
@@ -293,6 +293,7 @@ import TableHeader from './TableHeader.vue';
 export default {
     name: 'DataTable',
     extends: BaseDataTable,
+    inheritAttrs: false,
     emits: [
         'value-change',
         'update:first',

components/lib/dataview/DataView.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" v-bind="ptm('root')">
+    <div :class="cx('root')" v-bind="ptmi('root')">
         <div v-if="$slots.header" :class="cx('header')" v-bind="ptm('header')">
             <slot name="header"></slot>
         </div>
@@ -72,6 +72,7 @@ import BaseDataView from './BaseDataView.vue';
 export default {
     name: 'DataView',
     extends: BaseDataView,
+    inheritAttrs: false,
     emits: ['update:first', 'update:rows', 'page'],
     data() {
         return {

components/lib/dataviewlayoutoptions/DataViewLayoutOptions.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" role="group" v-bind="ptm('root')">
+    <div :class="cx('root')" role="group" v-bind="ptmi('root')">
         <button :aria-label="listViewAriaLabel" :class="cx('listButton')" @click="changeLayout('list')" type="button" :aria-pressed="isListButtonPressed" v-bind="ptm('listButton')">
             <slot name="listicon">
                 <BarsIcon v-bind="ptm('listIcon')" />
@@ -21,6 +21,7 @@ import BaseDataViewLayoutOptions from './BaseDataViewLayoutOptions.vue';
 export default {
     name: 'DataViewLayoutOptions',
     extends: BaseDataViewLayoutOptions,
+    inheritAttrs: false,
     emits: ['update:modelValue'],
     data() {
         return {

components/lib/deferredcontent/DeferredContent.vue

@@ -1,5 +1,5 @@
 <template>
-    <div ref="container" v-bind="ptm('root')">
+    <div ref="container" v-bind="ptmi('root')">
         <slot v-if="loaded"></slot>
     </div>
 </template>
@@ -11,6 +11,7 @@ import DeferredContentStyle from 'primevue/deferredcontent/style';
 export default {
     name: 'DeferredContent',
     extends: BaseComponent,
+    inheritAttrs: false,
     emits: ['load'],
     style: DeferredContentStyle,
     data() {

components/lib/dialog/Dialog.vue

@@ -2,7 +2,7 @@
     <Portal :appendTo="appendTo">
         <div v-if="containerVisible" :ref="maskRef" :class="cx('mask')" :style="sx('mask', true, { position, modal })" @click="onMaskClick" v-bind="ptm('mask')">
             <transition name="p-dialog" @before-enter="onBeforeEnter" @enter="onEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')">
-                <div v-if="visible" :ref="containerRef" v-focustrap="{ disabled: !modal }" :class="cx('root')" :style="sx('root')" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" v-bind="{ ...$attrs, ...ptm('root') }">
+                <div v-if="visible" :ref="containerRef" v-focustrap="{ disabled: !modal }" :class="cx('root')" :style="sx('root')" role="dialog" :aria-labelledby="ariaLabelledById" :aria-modal="modal" v-bind="ptmi('root')">
                     <slot v-if="$slots.container" name="container" :onClose="close" :onMaximize="(event) => maximize(event)" :closeCallback="close" :maximizeCallback="(event) => maximize(event)"></slot>
                     <template v-else>
                         <div v-if="showHeader" :ref="headerContainerRef" :class="cx('header')" @mousedown="initDrag" v-bind="ptm('header')">

components/lib/divider/Divider.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" :style="sx('root')" role="separator" :aria-orientation="layout" v-bind="ptm('root')">
+    <div :class="cx('root')" :style="sx('root')" role="separator" :aria-orientation="layout" v-bind="ptmi('root')">
         <div v-if="$slots.default" :class="cx('content')" v-bind="ptm('content')">
             <slot></slot>
         </div>
@@ -11,6 +11,7 @@ import BaseDivider from './BaseDivider.vue';
 
 export default {
     name: 'Divider',
-    extends: BaseDivider
+    extends: BaseDivider,
+    inheritAttrs: false
 };
 </script>