Refactor #5257

components/lib/menubar/Menubar.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :ref="containerRef" :class="cx('root')" v-bind="ptm('root')">
+    <div :ref="containerRef" :class="cx('root')" v-bind="ptmi('root')">
         <div v-if="$slots.start" :class="cx('start')" v-bind="ptm('start')">
             <slot name="start"></slot>
         </div>
@@ -62,6 +62,7 @@ import MenubarSub from './MenubarSub.vue';
 export default {
     name: 'Menubar',
     extends: BaseMenubar,
+    inheritAttrs: false,
     emits: ['focus', 'blur'],
     matchMediaListener: null,
     data() {

components/lib/message/Message.vue

@@ -1,5 +1,5 @@
 <template>
-    <transition name="p-message" appear v-bind="ptm('transition')">
+    <transition name="p-message" appear v-bind="ptmi('transition')">
         <div v-show="visible" :class="cx('root')" role="alert" aria-live="assertive" aria-atomic="true" v-bind="ptm('root')">
             <slot v-if="$slots.container" name="container" :onClose="close" :closeCallback="close"></slot>
             <div v-else :class="cx('wrapper')" v-bind="ptm('wrapper')">
@@ -32,6 +32,7 @@ import BaseMessage from './BaseMessage.vue';
 export default {
     name: 'Message',
     extends: BaseMessage,
+    inheritAttrs: false,
     emits: ['close', 'life-end'],
     timeout: null,
     data() {

components/lib/metergroup/MeterGroup.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" role="meter" :aria-valuemin="min" :aria-valuemax="max" :aria-valuenow="totalPercent" v-bind="ptm('root')">
+    <div :class="cx('root')" role="meter" :aria-valuemin="min" :aria-valuemax="max" :aria-valuenow="totalPercent" v-bind="ptmi('root')">
         <slot v-if="labelPosition === 'start'" name="label" :value="value" :totalPercent="totalPercent" :percentages="percentages">
             <MeterGroupLabel :value="value" :labelPosition="labelPosition" :labelOrientation="labelOrientation" :unstyled="unstyled" :pt="pt" />
         </slot>
@@ -25,6 +25,7 @@ import MeterGroupLabel from './MeterGroupLabel.vue';
 export default {
     name: 'MeterGroup',
     extends: BaseMeterGroup,
+    inheritAttrs: false,
     methods: {
         getPTOptions(key, value, index) {
             return this.ptm(key, {

components/lib/multiselect/MultiSelect.vue

@@ -1,5 +1,5 @@
 <template>
-    <div ref="container" :class="cx('root')" @click="onContainerClick" v-bind="ptm('root')">
+    <div ref="container" :class="cx('root')" @click="onContainerClick" v-bind="ptmi('root')">
         <div class="p-hidden-accessible" v-bind="ptm('hiddenInputWrapper')" :data-p-hidden-accessible="true">
             <input
                 ref="focusInput"
@@ -214,6 +214,7 @@ import BaseMultiSelect from './BaseMultiSelect.vue';
 export default {
     name: 'MultiSelect',
     extends: BaseMultiSelect,
+    inheritAttrs: false,
     emits: ['update:modelValue', 'change', 'focus', 'blur', 'before-show', 'before-hide', 'show', 'hide', 'filter', 'selectall-change'],
     outsideClickListener: null,
     scrollHandler: null,

components/lib/orderlist/OrderList.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" v-bind="ptm('root')">
+    <div :class="cx('root')" v-bind="ptmi('root')">
         <div :class="cx('controls')" v-bind="ptm('controls')">
             <slot name="controlsstart"></slot>
             <OLButton type="button" @click="moveUp" :aria-label="moveUpAriaLabel" :disabled="moveDisabled()" v-bind="moveUpButtonProps" :pt="ptm('moveUpButton')" :unstyled="unstyled">
@@ -90,6 +90,7 @@ import BaseOrderList from './BaseOrderList.vue';
 export default {
     name: 'OrderList',
     extends: BaseOrderList,
+    inheritAttrs: false,
     emits: ['update:modelValue', 'reorder', 'update:selection', 'selection-change', 'focus', 'blur'],
     itemTouched: false,
     reorderDirection: null,

components/lib/organizationchart/OrganizationChart.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" v-bind="ptm('root')">
+    <div :class="cx('root')" v-bind="ptmi('root')">
         <OrganizationChartNode
             :node="value"
             :templates="$slots"
@@ -22,6 +22,7 @@ import OrganizationChartNode from './OrganizationChartNode.vue';
 export default {
     name: 'OrganizationChart',
     extends: BaseOrganizationChart,
+    inheritAttrs: false,
     emits: ['node-unselect', 'node-select', 'update:selectionKeys', 'node-expand', 'node-collapse', 'update:collapsedKeys'],
     data() {
         return {

components/lib/overlaypanel/OverlayPanel.vue

@@ -1,7 +1,7 @@
 <template>
     <Portal :appendTo="appendTo">
         <transition name="p-overlaypanel" @enter="onEnter" @leave="onLeave" @after-leave="onAfterLeave" v-bind="ptm('transition')">
-            <div v-if="visible" :ref="containerRef" v-focustrap role="dialog" :aria-modal="visible" @click="onOverlayClick" :class="cx('root')" v-bind="{ ...$attrs, ...ptm('root') }">
+            <div v-if="visible" :ref="containerRef" v-focustrap role="dialog" :aria-modal="visible" @click="onOverlayClick" :class="cx('root')" v-bind="ptmi('root')">
                 <slot v-if="$slots.container" name="container" :onClose="hide" :onKeydown="(event) => onButtonKeydown(event)" :closeCallback="hide" :keydownCallback="(event) => onButtonKeydown(event)"></slot>
                 <template v-else>
                     <div :class="cx('content')" @click="onContentClick" @mousedown="onContentClick" @keydown="onContentKeydown" v-bind="ptm('content')">

components/lib/paginator/Paginator.vue

@@ -1,5 +1,5 @@
 <template>
-    <nav v-if="alwaysShow ? true : pageLinks && pageLinks.length > 1" v-bind="ptm('paginatorWrapper')">
+    <nav v-if="alwaysShow ? true : pageLinks && pageLinks.length > 1" v-bind="ptmi('paginatorWrapper')">
         <div v-for="(value, key) in templateItems" :key="key" ref="paginator" :class="cx('paginator', { key })" v-bind="ptm('root')">
             <div v-if="$slots.start" :class="cx('start')" v-bind="ptm('start')">
                 <slot name="start" :state="currentState"></slot>
@@ -70,6 +70,7 @@ import RowsPerPageDropdown from './RowsPerPageDropdown.vue';
 export default {
     name: 'Paginator',
     extends: BasePaginator,
+    inheritAttrs: false,
     emits: ['update:first', 'update:rows', 'page'],
     data() {
         return {

components/lib/panelmenu/PanelMenu.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :id="id" :class="cx('root')" v-bind="ptm('root')">
+    <div :id="id" :class="cx('root')" v-bind="ptmi('root')">
         <template v-for="(item, index) of model" :key="getPanelKey(index)">
             <div v-if="isItemVisible(item)" :style="getItemProp(item, 'style')" :class="[cx('panel'), getItemProp(item, 'class')]" v-bind="ptm('panel')">
                 <div
@@ -63,6 +63,7 @@ import PanelMenuList from './PanelMenuList.vue';
 export default {
     name: 'PanelMenu',
     extends: BasePanelMenu,
+    inheritAttrs: false,
     emits: ['update:expandedKeys', 'panel-open', 'panel-close'],
     data() {
         return {