primevue 3.26.1 → 3.28.0

package/avatar/Avatar.vue

@@ -1,16 +1,20 @@
 <template>
-    <div :class="containerClass" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel">
+    <div :class="containerClass" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" v-bind="ptm('root')">
         <slot>
-            <span v-if="label" class="p-avatar-text">{{ label }}</span>
-            <span v-else-if="icon" :class="iconClass"></span>
-            <img v-else-if="image" :src="image" :alt="ariaLabel" @error="onError" />
+            <span v-if="label" class="p-avatar-text" v-bind="ptm('label')">{{ label }}</span>
+            <component v-else-if="$slots.icon" :is="$slots.icon" class="p-avatar-icon" v-bind="ptm('icon')" />
+            <span v-else-if="icon" :class="['p-avatar-icon', icon]" v-bind="ptm('icon')" />
+            <img v-else-if="image" :src="image" :alt="ariaLabel" @error="onError" v-bind="ptm('image')" />
         </slot>
     </div>
 </template>
 
 <script>
+import BaseComponent from 'primevue/basecomponent';
+
 export default {
     name: 'Avatar',
+    extends: BaseComponent,
     emits: ['error'],
     props: {
         label: {
@@ -58,9 +62,6 @@ export default {
                     'p-avatar-xl': this.size === 'xlarge'
                 }
             ];
-        },
-        iconClass() {
-            return ['p-avatar-icon', this.icon];
         }
     }
 };

package/avatar/avatar.cjs.js

@@ -1,9 +1,15 @@
 'use strict';
 
+var BaseComponent = require('primevue/basecomponent');
 var vue = require('vue');
 
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
+
 var script = {
     name: 'Avatar',
+    extends: BaseComponent__default["default"],
     emits: ['error'],
     props: {
         label: {
@@ -51,44 +57,45 @@ var script = {
                     'p-avatar-xl': this.size === 'xlarge'
                 }
             ];
-        },
-        iconClass() {
-            return ['p-avatar-icon', this.icon];
         }
     }
 };
 
 const _hoisted_1 = ["aria-labelledby", "aria-label"];
-const _hoisted_2 = {
-  key: 0,
-  class: "p-avatar-text"
-};
-const _hoisted_3 = ["src", "alt"];
+const _hoisted_2 = ["src", "alt"];
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", {
-    class: vue.normalizeClass($options.containerClass),
+  return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+    class: $options.containerClass,
     "aria-labelledby": _ctx.ariaLabelledby,
     "aria-label": _ctx.ariaLabel
-  }, [
+  }, _ctx.ptm('root')), [
     vue.renderSlot(_ctx.$slots, "default", {}, () => [
       ($props.label)
-        ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2, vue.toDisplayString($props.label), 1))
-        : ($props.icon)
-          ? (vue.openBlock(), vue.createElementBlock("span", {
+        ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+            key: 0,
+            class: "p-avatar-text"
+          }, _ctx.ptm('label')), vue.toDisplayString($props.label), 17))
+        : (_ctx.$slots.icon)
+          ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.$slots.icon), vue.mergeProps({
               key: 1,
-              class: vue.normalizeClass($options.iconClass)
-            }, null, 2))
-          : ($props.image)
-            ? (vue.openBlock(), vue.createElementBlock("img", {
+              class: "p-avatar-icon"
+            }, _ctx.ptm('icon')), null, 16))
+          : ($props.icon)
+            ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
                 key: 2,
-                src: $props.image,
-                alt: _ctx.ariaLabel,
-                onError: _cache[0] || (_cache[0] = (...args) => ($options.onError && $options.onError(...args)))
-              }, null, 40, _hoisted_3))
-            : vue.createCommentVNode("", true)
+                class: ['p-avatar-icon', $props.icon]
+              }, _ctx.ptm('icon')), null, 16))
+            : ($props.image)
+              ? (vue.openBlock(), vue.createElementBlock("img", vue.mergeProps({
+                  key: 3,
+                  src: $props.image,
+                  alt: _ctx.ariaLabel,
+                  onError: _cache[0] || (_cache[0] = (...args) => ($options.onError && $options.onError(...args)))
+                }, _ctx.ptm('image')), null, 16, _hoisted_2))
+              : vue.createCommentVNode("", true)
     ])
-  ], 10, _hoisted_1))
+  ], 16, _hoisted_1))
 }
 
 function styleInject(css, ref) {

package/avatar/avatar.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("vue"),a={name:"Avatar",emits:["error"],props:{label:{type:String,default:null},icon:{type:String,default:null},image:{type:String,default:null},size:{type:String,default:"normal"},shape:{type:String,default:"square"},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},methods:{onError(){this.$emit("error")}},computed:{containerClass(){return["p-avatar p-component",{"p-avatar-image":null!=this.image,"p-avatar-circle":"circle"===this.shape,"p-avatar-lg":"large"===this.size,"p-avatar-xl":"xlarge"===this.size}]},iconClass(){return["p-avatar-icon",this.icon]}}};const t=["aria-labelledby","aria-label"],r={key:0,class:"p-avatar-text"},n=["src","alt"];!function(e,a){void 0===a&&(a={});var t=a.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===t&&r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 2rem;\n    height: 2rem;\n    font-size: 1rem;\n}\n.p-avatar.p-avatar-image {\n    background-color: transparent;\n}\n.p-avatar.p-avatar-circle {\n    border-radius: 50%;\n}\n.p-avatar-circle img {\n    border-radius: 50%;\n}\n.p-avatar .p-avatar-icon {\n    font-size: 1rem;\n}\n.p-avatar img {\n    width: 100%;\n    height: 100%;\n}\n"),a.render=function(a,l,i,o,s,c){return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(c.containerClass),"aria-labelledby":a.ariaLabelledby,"aria-label":a.ariaLabel},[e.renderSlot(a.$slots,"default",{},(()=>[i.label?(e.openBlock(),e.createElementBlock("span",r,e.toDisplayString(i.label),1)):i.icon?(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(c.iconClass)},null,2)):i.image?(e.openBlock(),e.createElementBlock("img",{key:2,src:i.image,alt:a.ariaLabel,onError:l[0]||(l[0]=(...e)=>c.onError&&c.onError(...e))},null,40,n)):e.createCommentVNode("",!0)]))],10,t)},module.exports=a;
+"use strict";var e=require("primevue/basecomponent"),a=require("vue");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r={name:"Avatar",extends:t(e).default,emits:["error"],props:{label:{type:String,default:null},icon:{type:String,default:null},image:{type:String,default:null},size:{type:String,default:"normal"},shape:{type:String,default:"square"},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},methods:{onError(){this.$emit("error")}},computed:{containerClass(){return["p-avatar p-component",{"p-avatar-image":null!=this.image,"p-avatar-circle":"circle"===this.shape,"p-avatar-lg":"large"===this.size,"p-avatar-xl":"xlarge"===this.size}]}}};const n=["aria-labelledby","aria-label"],l=["src","alt"];!function(e,a){void 0===a&&(a={});var t=a.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===t&&r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 2rem;\n    height: 2rem;\n    font-size: 1rem;\n}\n.p-avatar.p-avatar-image {\n    background-color: transparent;\n}\n.p-avatar.p-avatar-circle {\n    border-radius: 50%;\n}\n.p-avatar-circle img {\n    border-radius: 50%;\n}\n.p-avatar .p-avatar-icon {\n    font-size: 1rem;\n}\n.p-avatar img {\n    width: 100%;\n    height: 100%;\n}\n"),r.render=function(e,t,r,i,o,s){return a.openBlock(),a.createElementBlock("div",a.mergeProps({class:s.containerClass,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel},e.ptm("root")),[a.renderSlot(e.$slots,"default",{},(()=>[r.label?(a.openBlock(),a.createElementBlock("span",a.mergeProps({key:0,class:"p-avatar-text"},e.ptm("label")),a.toDisplayString(r.label),17)):e.$slots.icon?(a.openBlock(),a.createBlock(a.resolveDynamicComponent(e.$slots.icon),a.mergeProps({key:1,class:"p-avatar-icon"},e.ptm("icon")),null,16)):r.icon?(a.openBlock(),a.createElementBlock("span",a.mergeProps({key:2,class:["p-avatar-icon",r.icon]},e.ptm("icon")),null,16)):r.image?(a.openBlock(),a.createElementBlock("img",a.mergeProps({key:3,src:r.image,alt:e.ariaLabel,onError:t[0]||(t[0]=(...e)=>s.onError&&s.onError(...e))},e.ptm("image")),null,16,l)):a.createCommentVNode("",!0)]))],16,n)},module.exports=r;

package/avatar/avatar.esm.js

@@ -1,7 +1,9 @@
-import { openBlock, createElementBlock, normalizeClass, renderSlot, toDisplayString, createCommentVNode } from 'vue';
+import BaseComponent from 'primevue/basecomponent';
+import { openBlock, createElementBlock, mergeProps, renderSlot, toDisplayString, createBlock, resolveDynamicComponent, createCommentVNode } from 'vue';
 
 var script = {
     name: 'Avatar',
+    extends: BaseComponent,
     emits: ['error'],
     props: {
         label: {
@@ -49,44 +51,45 @@ var script = {
                     'p-avatar-xl': this.size === 'xlarge'
                 }
             ];
-        },
-        iconClass() {
-            return ['p-avatar-icon', this.icon];
         }
     }
 };
 
 const _hoisted_1 = ["aria-labelledby", "aria-label"];
-const _hoisted_2 = {
-  key: 0,
-  class: "p-avatar-text"
-};
-const _hoisted_3 = ["src", "alt"];
+const _hoisted_2 = ["src", "alt"];
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (openBlock(), createElementBlock("div", {
-    class: normalizeClass($options.containerClass),
+  return (openBlock(), createElementBlock("div", mergeProps({
+    class: $options.containerClass,
     "aria-labelledby": _ctx.ariaLabelledby,
     "aria-label": _ctx.ariaLabel
-  }, [
+  }, _ctx.ptm('root')), [
     renderSlot(_ctx.$slots, "default", {}, () => [
       ($props.label)
-        ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString($props.label), 1))
-        : ($props.icon)
-          ? (openBlock(), createElementBlock("span", {
+        ? (openBlock(), createElementBlock("span", mergeProps({
+            key: 0,
+            class: "p-avatar-text"
+          }, _ctx.ptm('label')), toDisplayString($props.label), 17))
+        : (_ctx.$slots.icon)
+          ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.$slots.icon), mergeProps({
               key: 1,
-              class: normalizeClass($options.iconClass)
-            }, null, 2))
-          : ($props.image)
-            ? (openBlock(), createElementBlock("img", {
+              class: "p-avatar-icon"
+            }, _ctx.ptm('icon')), null, 16))
+          : ($props.icon)
+            ? (openBlock(), createElementBlock("span", mergeProps({
                 key: 2,
-                src: $props.image,
-                alt: _ctx.ariaLabel,
-                onError: _cache[0] || (_cache[0] = (...args) => ($options.onError && $options.onError(...args)))
-              }, null, 40, _hoisted_3))
-            : createCommentVNode("", true)
+                class: ['p-avatar-icon', $props.icon]
+              }, _ctx.ptm('icon')), null, 16))
+            : ($props.image)
+              ? (openBlock(), createElementBlock("img", mergeProps({
+                  key: 3,
+                  src: $props.image,
+                  alt: _ctx.ariaLabel,
+                  onError: _cache[0] || (_cache[0] = (...args) => ($options.onError && $options.onError(...args)))
+                }, _ctx.ptm('image')), null, 16, _hoisted_2))
+              : createCommentVNode("", true)
     ])
-  ], 10, _hoisted_1))
+  ], 16, _hoisted_1))
 }
 
 function styleInject(css, ref) {

package/avatar/avatar.esm.min.js

@@ -1 +1 @@
-import{openBlock as a,createElementBlock as e,normalizeClass as t,renderSlot as r,toDisplayString as n,createCommentVNode as l}from"vue";var i={name:"Avatar",emits:["error"],props:{label:{type:String,default:null},icon:{type:String,default:null},image:{type:String,default:null},size:{type:String,default:"normal"},shape:{type:String,default:"square"},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},methods:{onError(){this.$emit("error")}},computed:{containerClass(){return["p-avatar p-component",{"p-avatar-image":null!=this.image,"p-avatar-circle":"circle"===this.shape,"p-avatar-lg":"large"===this.size,"p-avatar-xl":"xlarge"===this.size}]},iconClass(){return["p-avatar-icon",this.icon]}}};const s=["aria-labelledby","aria-label"],o={key:0,class:"p-avatar-text"},p=["src","alt"];!function(a,e){void 0===e&&(e={});var t=e.insertAt;if(a&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===t&&r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n),n.styleSheet?n.styleSheet.cssText=a:n.appendChild(document.createTextNode(a))}}("\n.p-avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 2rem;\n    height: 2rem;\n    font-size: 1rem;\n}\n.p-avatar.p-avatar-image {\n    background-color: transparent;\n}\n.p-avatar.p-avatar-circle {\n    border-radius: 50%;\n}\n.p-avatar-circle img {\n    border-radius: 50%;\n}\n.p-avatar .p-avatar-icon {\n    font-size: 1rem;\n}\n.p-avatar img {\n    width: 100%;\n    height: 100%;\n}\n"),i.render=function(i,d,c,u,m,g){return a(),e("div",{class:t(g.containerClass),"aria-labelledby":i.ariaLabelledby,"aria-label":i.ariaLabel},[r(i.$slots,"default",{},(()=>[c.label?(a(),e("span",o,n(c.label),1)):c.icon?(a(),e("span",{key:1,class:t(g.iconClass)},null,2)):c.image?(a(),e("img",{key:2,src:c.image,alt:i.ariaLabel,onError:d[0]||(d[0]=(...a)=>g.onError&&g.onError(...a))},null,40,p)):l("",!0)]))],10,s)};export{i as default};
+import a from"primevue/basecomponent";import{openBlock as e,createElementBlock as t,mergeProps as r,renderSlot as n,toDisplayString as l,createBlock as i,resolveDynamicComponent as o,createCommentVNode as s}from"vue";var p={name:"Avatar",extends:a,emits:["error"],props:{label:{type:String,default:null},icon:{type:String,default:null},image:{type:String,default:null},size:{type:String,default:"normal"},shape:{type:String,default:"square"},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},methods:{onError(){this.$emit("error")}},computed:{containerClass(){return["p-avatar p-component",{"p-avatar-image":null!=this.image,"p-avatar-circle":"circle"===this.shape,"p-avatar-lg":"large"===this.size,"p-avatar-xl":"xlarge"===this.size}]}}};const c=["aria-labelledby","aria-label"],d=["src","alt"];!function(a,e){void 0===e&&(e={});var t=e.insertAt;if(a&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===t&&r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n),n.styleSheet?n.styleSheet.cssText=a:n.appendChild(document.createTextNode(a))}}("\n.p-avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 2rem;\n    height: 2rem;\n    font-size: 1rem;\n}\n.p-avatar.p-avatar-image {\n    background-color: transparent;\n}\n.p-avatar.p-avatar-circle {\n    border-radius: 50%;\n}\n.p-avatar-circle img {\n    border-radius: 50%;\n}\n.p-avatar .p-avatar-icon {\n    font-size: 1rem;\n}\n.p-avatar img {\n    width: 100%;\n    height: 100%;\n}\n"),p.render=function(a,p,m,u,g,v){return e(),t("div",r({class:v.containerClass,"aria-labelledby":a.ariaLabelledby,"aria-label":a.ariaLabel},a.ptm("root")),[n(a.$slots,"default",{},(()=>[m.label?(e(),t("span",r({key:0,class:"p-avatar-text"},a.ptm("label")),l(m.label),17)):a.$slots.icon?(e(),i(o(a.$slots.icon),r({key:1,class:"p-avatar-icon"},a.ptm("icon")),null,16)):m.icon?(e(),t("span",r({key:2,class:["p-avatar-icon",m.icon]},a.ptm("icon")),null,16)):m.image?(e(),t("img",r({key:3,src:m.image,alt:a.ariaLabel,onError:p[0]||(p[0]=(...a)=>v.onError&&v.onError(...a))},a.ptm("image")),null,16,d)):s("",!0)]))],16,c)};export{p as default};

package/avatar/avatar.js

@@ -1,9 +1,14 @@
 this.primevue = this.primevue || {};
-this.primevue.avatar = (function (vue) {
+this.primevue.avatar = (function (BaseComponent, vue) {
     'use strict';
 
+    function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+    var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
+
     var script = {
         name: 'Avatar',
+        extends: BaseComponent__default["default"],
         emits: ['error'],
         props: {
             label: {
@@ -51,44 +56,45 @@ this.primevue.avatar = (function (vue) {
                         'p-avatar-xl': this.size === 'xlarge'
                     }
                 ];
-            },
-            iconClass() {
-                return ['p-avatar-icon', this.icon];
             }
         }
     };
 
     const _hoisted_1 = ["aria-labelledby", "aria-label"];
-    const _hoisted_2 = {
-      key: 0,
-      class: "p-avatar-text"
-    };
-    const _hoisted_3 = ["src", "alt"];
+    const _hoisted_2 = ["src", "alt"];
 
     function render(_ctx, _cache, $props, $setup, $data, $options) {
-      return (vue.openBlock(), vue.createElementBlock("div", {
-        class: vue.normalizeClass($options.containerClass),
+      return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+        class: $options.containerClass,
         "aria-labelledby": _ctx.ariaLabelledby,
         "aria-label": _ctx.ariaLabel
-      }, [
+      }, _ctx.ptm('root')), [
         vue.renderSlot(_ctx.$slots, "default", {}, () => [
           ($props.label)
-            ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2, vue.toDisplayString($props.label), 1))
-            : ($props.icon)
-              ? (vue.openBlock(), vue.createElementBlock("span", {
+            ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+                key: 0,
+                class: "p-avatar-text"
+              }, _ctx.ptm('label')), vue.toDisplayString($props.label), 17))
+            : (_ctx.$slots.icon)
+              ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.$slots.icon), vue.mergeProps({
                   key: 1,
-                  class: vue.normalizeClass($options.iconClass)
-                }, null, 2))
-              : ($props.image)
-                ? (vue.openBlock(), vue.createElementBlock("img", {
+                  class: "p-avatar-icon"
+                }, _ctx.ptm('icon')), null, 16))
+              : ($props.icon)
+                ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
                     key: 2,
-                    src: $props.image,
-                    alt: _ctx.ariaLabel,
-                    onError: _cache[0] || (_cache[0] = (...args) => ($options.onError && $options.onError(...args)))
-                  }, null, 40, _hoisted_3))
-                : vue.createCommentVNode("", true)
+                    class: ['p-avatar-icon', $props.icon]
+                  }, _ctx.ptm('icon')), null, 16))
+                : ($props.image)
+                  ? (vue.openBlock(), vue.createElementBlock("img", vue.mergeProps({
+                      key: 3,
+                      src: $props.image,
+                      alt: _ctx.ariaLabel,
+                      onError: _cache[0] || (_cache[0] = (...args) => ($options.onError && $options.onError(...args)))
+                    }, _ctx.ptm('image')), null, 16, _hoisted_2))
+                  : vue.createCommentVNode("", true)
         ])
-      ], 10, _hoisted_1))
+      ], 16, _hoisted_1))
     }
 
     function styleInject(css, ref) {
@@ -125,4 +131,4 @@ this.primevue.avatar = (function (vue) {
 
     return script;
 
-})(Vue);
+})(primevue.basecomponent, Vue);

package/avatar/avatar.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.avatar=function(e){"use strict";var a={name:"Avatar",emits:["error"],props:{label:{type:String,default:null},icon:{type:String,default:null},image:{type:String,default:null},size:{type:String,default:"normal"},shape:{type:String,default:"square"},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},methods:{onError(){this.$emit("error")}},computed:{containerClass(){return["p-avatar p-component",{"p-avatar-image":null!=this.image,"p-avatar-circle":"circle"===this.shape,"p-avatar-lg":"large"===this.size,"p-avatar-xl":"xlarge"===this.size}]},iconClass(){return["p-avatar-icon",this.icon]}}};const t=["aria-labelledby","aria-label"],r={key:0,class:"p-avatar-text"},n=["src","alt"];return function(e,a){void 0===a&&(a={});var t=a.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===t&&r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 2rem;\n    height: 2rem;\n    font-size: 1rem;\n}\n.p-avatar.p-avatar-image {\n    background-color: transparent;\n}\n.p-avatar.p-avatar-circle {\n    border-radius: 50%;\n}\n.p-avatar-circle img {\n    border-radius: 50%;\n}\n.p-avatar .p-avatar-icon {\n    font-size: 1rem;\n}\n.p-avatar img {\n    width: 100%;\n    height: 100%;\n}\n"),a.render=function(a,l,i,o,s,c){return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(c.containerClass),"aria-labelledby":a.ariaLabelledby,"aria-label":a.ariaLabel},[e.renderSlot(a.$slots,"default",{},(()=>[i.label?(e.openBlock(),e.createElementBlock("span",r,e.toDisplayString(i.label),1)):i.icon?(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(c.iconClass)},null,2)):i.image?(e.openBlock(),e.createElementBlock("img",{key:2,src:i.image,alt:a.ariaLabel,onError:l[0]||(l[0]=(...e)=>c.onError&&c.onError(...e))},null,40,n)):e.createCommentVNode("",!0)]))],10,t)},a}(Vue);
+this.primevue=this.primevue||{},this.primevue.avatar=function(e,a){"use strict";function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r={name:"Avatar",extends:t(e).default,emits:["error"],props:{label:{type:String,default:null},icon:{type:String,default:null},image:{type:String,default:null},size:{type:String,default:"normal"},shape:{type:String,default:"square"},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},methods:{onError(){this.$emit("error")}},computed:{containerClass(){return["p-avatar p-component",{"p-avatar-image":null!=this.image,"p-avatar-circle":"circle"===this.shape,"p-avatar-lg":"large"===this.size,"p-avatar-xl":"xlarge"===this.size}]}}};const n=["aria-labelledby","aria-label"],l=["src","alt"];return function(e,a){void 0===a&&(a={});var t=a.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===t&&r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 2rem;\n    height: 2rem;\n    font-size: 1rem;\n}\n.p-avatar.p-avatar-image {\n    background-color: transparent;\n}\n.p-avatar.p-avatar-circle {\n    border-radius: 50%;\n}\n.p-avatar-circle img {\n    border-radius: 50%;\n}\n.p-avatar .p-avatar-icon {\n    font-size: 1rem;\n}\n.p-avatar img {\n    width: 100%;\n    height: 100%;\n}\n"),r.render=function(e,t,r,i,o,s){return a.openBlock(),a.createElementBlock("div",a.mergeProps({class:s.containerClass,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel},e.ptm("root")),[a.renderSlot(e.$slots,"default",{},(()=>[r.label?(a.openBlock(),a.createElementBlock("span",a.mergeProps({key:0,class:"p-avatar-text"},e.ptm("label")),a.toDisplayString(r.label),17)):e.$slots.icon?(a.openBlock(),a.createBlock(a.resolveDynamicComponent(e.$slots.icon),a.mergeProps({key:1,class:"p-avatar-icon"},e.ptm("icon")),null,16)):r.icon?(a.openBlock(),a.createElementBlock("span",a.mergeProps({key:2,class:["p-avatar-icon",r.icon]},e.ptm("icon")),null,16)):r.image?(a.openBlock(),a.createElementBlock("img",a.mergeProps({key:3,src:r.image,alt:e.ariaLabel,onError:t[0]||(t[0]=(...e)=>s.onError&&s.onError(...e))},e.ptm("image")),null,16,l)):a.createCommentVNode("",!0)]))],16,n)},r}(primevue.basecomponent,Vue);

package/avatargroup/AvatarGroup.d.ts

@@ -9,10 +9,36 @@
  */
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
+export declare type AvatarGroupPassThroughOptionType = AvatarGroupPassThroughAttributes | null | undefined;
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface AvatarGroupPassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link AvatarGroupProps.pt}
+ */
+export interface AvatarGroupPassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: AvatarGroupPassThroughOptionType;
+}
+
 /**
  * Defines valid properties in AvatarGroup component.
  */
-export interface AvatarGroupProps {}
+export interface AvatarGroupProps {
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {AvatarGroupPassThroughOptions}
+     */
+    pt?: AvatarGroupPassThroughOptions;
+}
 
 /**
  * Defines valid slots in AvatarGroup component.

package/avatargroup/AvatarGroup.vue

@@ -1,12 +1,15 @@
 <template>
-    <div class="p-avatar-group p-component">
+    <div class="p-avatar-group p-component" v-bind="ptm('root')">
         <slot></slot>
     </div>
 </template>
 
 <script>
+import BaseComponent from 'primevue/basecomponent';
+
 export default {
-    name: 'AvatarGroup'
+    name: 'AvatarGroup',
+    extends: BaseComponent
 };
 </script>
 

package/avatargroup/avatargroup.cjs.js

@@ -1,17 +1,21 @@
 'use strict';
 
+var BaseComponent = require('primevue/basecomponent');
 var vue = require('vue');
 
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
+
 var script = {
-    name: 'AvatarGroup'
+    name: 'AvatarGroup',
+    extends: BaseComponent__default["default"]
 };
 
-const _hoisted_1 = { class: "p-avatar-group p-component" };
-
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+  return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({ class: "p-avatar-group p-component" }, _ctx.ptm('root')), [
     vue.renderSlot(_ctx.$slots, "default")
-  ]))
+  ], 16))
 }
 
 function styleInject(css, ref) {

package/avatargroup/avatargroup.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("vue"),t={name:"AvatarGroup"};const n={class:"p-avatar-group p-component"};!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var a=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===n&&a.firstChild?a.insertBefore(r,a.firstChild):a.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}("\n.p-avatar-group .p-avatar + .p-avatar {\n    margin-left: -1rem;\n}\n.p-avatar-group {\n    display: flex;\n    align-items: center;\n}\n"),t.render=function(t,a,r,o,d,s){return e.openBlock(),e.createElementBlock("div",n,[e.renderSlot(t.$slots,"default")])},module.exports=t;
+"use strict";var e=require("primevue/basecomponent"),t=require("vue");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r={name:"AvatarGroup",extends:n(e).default};!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===n&&r.firstChild?r.insertBefore(a,r.firstChild):r.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}("\n.p-avatar-group .p-avatar + .p-avatar {\n    margin-left: -1rem;\n}\n.p-avatar-group {\n    display: flex;\n    align-items: center;\n}\n"),r.render=function(e,n,r,a,o,d){return t.openBlock(),t.createElementBlock("div",t.mergeProps({class:"p-avatar-group p-component"},e.ptm("root")),[t.renderSlot(e.$slots,"default")],16)},module.exports=r;

package/avatargroup/avatargroup.esm.js

@@ -1,15 +1,15 @@
-import { openBlock, createElementBlock, renderSlot } from 'vue';
+import BaseComponent from 'primevue/basecomponent';
+import { openBlock, createElementBlock, mergeProps, renderSlot } from 'vue';
 
 var script = {
-    name: 'AvatarGroup'
+    name: 'AvatarGroup',
+    extends: BaseComponent
 };
 
-const _hoisted_1 = { class: "p-avatar-group p-component" };
-
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (openBlock(), createElementBlock("div", _hoisted_1, [
+  return (openBlock(), createElementBlock("div", mergeProps({ class: "p-avatar-group p-component" }, _ctx.ptm('root')), [
     renderSlot(_ctx.$slots, "default")
-  ]))
+  ], 16))
 }
 
 function styleInject(css, ref) {

package/avatargroup/avatargroup.esm.min.js

@@ -1 +1 @@
-import{openBlock as e,createElementBlock as t,renderSlot as a}from"vue";var n={name:"AvatarGroup"};const r={class:"p-avatar-group p-component"};!function(e,t){void 0===t&&(t={});var a=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===a&&n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}("\n.p-avatar-group .p-avatar + .p-avatar {\n    margin-left: -1rem;\n}\n.p-avatar-group {\n    display: flex;\n    align-items: center;\n}\n"),n.render=function(n,o,d,p,s,i){return e(),t("div",r,[a(n.$slots,"default")])};export{n as default};
+import e from"primevue/basecomponent";import{openBlock as t,createElementBlock as a,mergeProps as n,renderSlot as r}from"vue";var o={name:"AvatarGroup",extends:e};!function(e,t){void 0===t&&(t={});var a=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===a&&n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}("\n.p-avatar-group .p-avatar + .p-avatar {\n    margin-left: -1rem;\n}\n.p-avatar-group {\n    display: flex;\n    align-items: center;\n}\n"),o.render=function(e,o,p,d,i,s){return t(),a("div",n({class:"p-avatar-group p-component"},e.ptm("root")),[r(e.$slots,"default")],16)};export{o as default};

package/avatargroup/avatargroup.js

@@ -1,17 +1,20 @@
 this.primevue = this.primevue || {};
-this.primevue.avatargroup = (function (vue) {
+this.primevue.avatargroup = (function (BaseComponent, vue) {
     'use strict';
 
+    function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+    var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
+
     var script = {
-        name: 'AvatarGroup'
+        name: 'AvatarGroup',
+        extends: BaseComponent__default["default"]
     };
 
-    const _hoisted_1 = { class: "p-avatar-group p-component" };
-
     function render(_ctx, _cache, $props, $setup, $data, $options) {
-      return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+      return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({ class: "p-avatar-group p-component" }, _ctx.ptm('root')), [
         vue.renderSlot(_ctx.$slots, "default")
-      ]))
+      ], 16))
     }
 
     function styleInject(css, ref) {
@@ -48,4 +51,4 @@ this.primevue.avatargroup = (function (vue) {
 
     return script;
 
-})(Vue);
+})(primevue.basecomponent, Vue);

package/avatargroup/avatargroup.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.avatargroup=function(e){"use strict";var t={name:"AvatarGroup"};const n={class:"p-avatar-group p-component"};return function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var a=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===n&&a.firstChild?a.insertBefore(r,a.firstChild):a.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}("\n.p-avatar-group .p-avatar + .p-avatar {\n    margin-left: -1rem;\n}\n.p-avatar-group {\n    display: flex;\n    align-items: center;\n}\n"),t.render=function(t,a,r,i,o,p){return e.openBlock(),e.createElementBlock("div",n,[e.renderSlot(t.$slots,"default")])},t}(Vue);
+this.primevue=this.primevue||{},this.primevue.avatargroup=function(e,t){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r={name:"AvatarGroup",extends:n(e).default};return function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===n&&r.firstChild?r.insertBefore(a,r.firstChild):r.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}("\n.p-avatar-group .p-avatar + .p-avatar {\n    margin-left: -1rem;\n}\n.p-avatar-group {\n    display: flex;\n    align-items: center;\n}\n"),r.render=function(e,n,r,a,o,i){return t.openBlock(),t.createElementBlock("div",t.mergeProps({class:"p-avatar-group p-component"},e.ptm("root")),[t.renderSlot(e.$slots,"default")],16)},r}(primevue.basecomponent,Vue);

package/badge/Badge.d.ts

@@ -10,6 +10,33 @@
 import { VNode } from 'vue';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
+export declare type BadgePassThroughOptionType = BadgePassThroughAttributes | ((options: BadgePassThroughMethodOptions) => BadgePassThroughAttributes) | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface BadgePassThroughMethodOptions {
+    props: BadgeProps;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface BadgePassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link BadgeProps.pt}
+ */
+export interface BadgePassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: BadgePassThroughOptionType;
+}
+
 /**
  * Defines valid properties in Badge component.
  */
@@ -26,6 +53,11 @@ export interface BadgeProps {
      * Size of the badge, valid options are 'large' and 'xlarge'.
      */
     size?: 'large' | 'xlarge' | null | undefined;
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {BadgePassThroughOptions}
+     */
+    pt?: BadgePassThroughOptions;
 }
 
 /**

package/badge/Badge.vue

@@ -1,14 +1,16 @@
 <template>
-    <span :class="badgeClass">
+    <span :class="badgeClass" v-bind="ptm('root')">
         <slot>{{ value }}</slot>
     </span>
 </template>
 
 <script>
+import BaseComponent from 'primevue/basecomponent';
 import { ObjectUtils } from 'primevue/utils';
 
 export default {
     name: 'Badge',
+    extends: BaseComponent,
     props: {
         value: {
             type: [String, Number],

package/badge/badge.cjs.js

@@ -1,10 +1,16 @@
 'use strict';
 
+var BaseComponent = require('primevue/basecomponent');
 var utils = require('primevue/utils');
 var vue = require('vue');
 
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
+
 var script = {
     name: 'Badge',
+    extends: BaseComponent__default["default"],
     props: {
         value: {
             type: [String, Number],
@@ -42,13 +48,11 @@ var script = {
 };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("span", {
-    class: vue.normalizeClass($options.badgeClass)
-  }, [
+  return (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({ class: $options.badgeClass }, _ctx.ptm('root')), [
     vue.renderSlot(_ctx.$slots, "default", {}, () => [
       vue.createTextVNode(vue.toDisplayString($props.value), 1)
     ])
-  ], 2))
+  ], 16))
 }
 
 script.render = render;

package/badge/badge.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/utils"),t=require("vue"),s={name:"Badge",props:{value:{type:[String,Number],default:null},severity:{type:String,default:null},size:{type:String,default:null}},computed:{containerClass(){return this.$slots.default?"p-overlay-badge":this.badgeClass},badgeClass(){return["p-badge p-component",{"p-badge-no-gutter":e.ObjectUtils.isNotEmpty(this.value)&&1===String(this.value).length,"p-badge-dot":e.ObjectUtils.isEmpty(this.value)&&!this.$slots.default,"p-badge-lg":"large"===this.size,"p-badge-xl":"xlarge"===this.size,"p-badge-info":"info"===this.severity,"p-badge-success":"success"===this.severity,"p-badge-warning":"warning"===this.severity,"p-badge-danger":"danger"===this.severity}]}}};s.render=function(e,s,a,i,l,r){return t.openBlock(),t.createElementBlock("span",{class:t.normalizeClass(r.badgeClass)},[t.renderSlot(e.$slots,"default",{},(()=>[t.createTextVNode(t.toDisplayString(a.value),1)]))],2)},module.exports=s;
+"use strict";var e=require("primevue/basecomponent"),t=require("primevue/utils"),s=require("vue");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a={name:"Badge",extends:r(e).default,props:{value:{type:[String,Number],default:null},severity:{type:String,default:null},size:{type:String,default:null}},computed:{containerClass(){return this.$slots.default?"p-overlay-badge":this.badgeClass},badgeClass(){return["p-badge p-component",{"p-badge-no-gutter":t.ObjectUtils.isNotEmpty(this.value)&&1===String(this.value).length,"p-badge-dot":t.ObjectUtils.isEmpty(this.value)&&!this.$slots.default,"p-badge-lg":"large"===this.size,"p-badge-xl":"xlarge"===this.size,"p-badge-info":"info"===this.severity,"p-badge-success":"success"===this.severity,"p-badge-warning":"warning"===this.severity,"p-badge-danger":"danger"===this.severity}]}}};a.render=function(e,t,r,a,i,l){return s.openBlock(),s.createElementBlock("span",s.mergeProps({class:l.badgeClass},e.ptm("root")),[s.renderSlot(e.$slots,"default",{},(()=>[s.createTextVNode(s.toDisplayString(r.value),1)]))],16)},module.exports=a;