Refactor #5257

components/lib/password/Password.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" :style="sx('root')" v-bind="ptm('root')">
+    <div :class="cx('root')" :style="sx('root')" v-bind="ptmi('root')">
         <PInputText
             ref="input"
             :id="inputId"
@@ -64,6 +64,7 @@ import BasePassword from './BasePassword.vue';
 export default {
     name: 'Password',
     extends: BasePassword,
+    inheritAttrs: false,
     emits: ['update:modelValue', 'change', 'focus', 'blur', 'invalid'],
     data() {
         return {

components/lib/picklist/PickList.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="showSourceControls" :class="cx('sourceControls')" v-bind="ptm('sourceControls')" data-pc-group-section="controls">
             <slot name="sourcecontrolsstart"></slot>
             <PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveUp($event, 0)" v-bind="moveUpButtonProps" :pt="ptm('sourceMoveUpButton')" :unstyled="unstyled">
@@ -201,6 +201,7 @@ import BasePickList from './BasePickList.vue';
 export default {
     name: 'PickList',
     extends: BasePickList,
+    inheritAttrs: false,
     emits: ['update:modelValue', 'reorder', 'update:selection', 'selection-change', 'move-to-target', 'move-to-source', 'move-all-to-target', 'move-all-to-source', 'focus', 'blur'],
     itemTouched: false,
     reorderDirection: null,

components/lib/progressbar/ProgressBar.vue

@@ -1,5 +1,5 @@
 <template>
-    <div role="progressbar" :class="cx('root')" aria-valuemin="0" :aria-valuenow="value" aria-valuemax="100" v-bind="ptm('root')">
+    <div role="progressbar" :class="cx('root')" aria-valuemin="0" :aria-valuenow="value" aria-valuemax="100" v-bind="ptmi('root')">
         <div v-if="determinate" :class="cx('value')" :style="progressStyle" v-bind="ptm('value')">
             <div v-if="value != null && value !== 0 && showValue" :class="cx('label')" v-bind="ptm('label')">
                 <slot>{{ value + '%' }}</slot>
@@ -17,6 +17,7 @@ import BaseProgressBar from './BaseProgressBar.vue';
 export default {
     name: 'ProgressBar',
     extends: BaseProgressBar,
+    inheritAttrs: false,
     computed: {
         progressStyle() {
             return {

components/lib/progressspinner/ProgressSpinner.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" role="progressbar" v-bind="ptm('root')">
+    <div :class="cx('root')" role="progressbar" v-bind="ptmi('root')">
         <svg :class="cx('spinner')" viewBox="25 25 50 50" :style="svgStyle" v-bind="ptm('spinner')">
             <circle :class="cx('circle')" cx="50" cy="50" r="20" :fill="fill" :stroke-width="strokeWidth" strokeMiterlimit="10" v-bind="ptm('circle')" />
         </svg>
@@ -12,6 +12,7 @@ import BaseProgressSpinner from './BaseProgressSpinner.vue';
 export default {
     name: 'ProgressSpinner',
     extends: BaseProgressSpinner,
+    inheritAttrs: false,
     computed: {
         svgStyle() {
             return {

components/lib/radiobutton/RadioButton.vue

@@ -31,10 +31,13 @@ import BaseRadioButton from './BaseRadioButton.vue';
 export default {
     name: 'RadioButton',
     extends: BaseRadioButton,
+    inheritAttrs: false,
     emits: ['update:modelValue', 'change', 'focus', 'blur'],
     methods: {
         getPTOptions(key) {
-            return this.ptm(key, {
+            const _ptm = key === 'root' ? this.ptmi : this.ptm;
+
+            return _ptm(key, {
                 context: {
                     checked: this.checked,
                     disabled: this.disabled

components/lib/rating/Rating.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="cancel" :class="cx('cancelItem')" @click="onOptionClick($event, 0)" v-bind="getPTOptions('cancelItem', 0)" :data-p-focused="focusedOptionIndex === 0">
             <span class="p-hidden-accessible" v-bind="ptm('hiddenCancelInputWrapper')" :data-p-hidden-accessible="true">
                 <input
@@ -58,6 +58,7 @@ import BaseRating from './BaseRating.vue';
 export default {
     name: 'Rating',
     extends: BaseRating,
+    inheritAttrs: false,
     emits: ['update:modelValue', 'change', 'focus', 'blur'],
     data() {
         return {

components/lib/scrollpanel/ScrollPanel.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('wrapper')" v-bind="ptm('wrapper')">
             <div ref="content" :id="contentId" :class="cx('content')" @scroll="onScroll" @mouseenter="moveBar" v-bind="ptm('content')">
                 <slot></slot>
@@ -46,6 +46,7 @@ import BaseScrollPanel from './BaseScrollPanel.vue';
 export default {
     name: 'ScrollPanel',
     extends: BaseScrollPanel,
+    inheritAttrs: false,
     initialized: false,
     documentResizeListener: null,
     documentMouseMoveListener: null,

components/lib/scrolltop/ScrollTop.vue

@@ -1,6 +1,6 @@
 <template>
     <transition name="p-scrolltop" appear @enter="onEnter" @after-leave="onAfterLeave" v-bind="ptm('transition')">
-        <button v-if="visible" :ref="containerRef" :class="cx('root')" @click="onClick" type="button" :aria-label="scrollTopAriaLabel" v-bind="ptm('root')">
+        <button v-if="visible" :ref="containerRef" :class="cx('root')" @click="onClick" type="button" :aria-label="scrollTopAriaLabel" v-bind="ptmi('root')">
             <slot name="icon" :class="cx('icon')">
                 <component :is="icon ? 'span' : 'ChevronUpIcon'" :class="[cx('icon'), icon]" v-bind="ptm('icon')" />
             </slot>
@@ -16,6 +16,7 @@ import BaseScrollTop from './BaseScrollTop.vue';
 export default {
     name: 'ScrollTop',
     extends: BaseScrollTop,
+    inheritAttrs: false,
     scrollListener: null,
     container: null,
     data() {