primevue 3.12.4 → 3.13.0

package/README.md

@@ -54,7 +54,7 @@ app.component('Dialog', Dialog);
 
 Finally you'll be able to utilize the component in your application. See the Styles section to apply styling.
 
-```
+```vue
 <Dialog></Dialog>
 ```
 
@@ -123,7 +123,7 @@ Other alternative is utilizing the components directly within the browser with t
 
 The css dependencies are as follows, note that you may change the theme with another one of your choice.
 
-```
+```css
 primevue/resources/themes/saga-blue/theme.css       //theme
 primevue/resources/primevue.min.css                 //core css
 primeicons/primeicons.css                           //icons
@@ -192,7 +192,7 @@ dependencies: {
 
 Component prop names are described as camel case throughout the documentation however camel-case is also fully supported. Events on the other hand should always be camel-case.
 
-```
+```vue
 <Dialog :showHeader="false"></Dialog>
 
 <!-- can be written as -->
@@ -204,7 +204,7 @@ Component prop names are described as camel case throughout the documentation ho
 
 Ripple is an optional animation for the supported components such as buttons. It is disabled by default and needs to be enabled at your app's entry file (e.g. main.js) during the PrimeVue setup. 
 
-```
+```javascript
 import {createApp} from 'vue';
 import PrimeVue from 'primevue/config';
 const app = createApp(App);

package/accordion/accordion.cjs.js

@@ -128,23 +128,25 @@ var script = {
 };
 
 const _hoisted_1 = { class: "p-accordion p-component" };
-const _hoisted_2 = {
+const _hoisted_2 = ["onClick", "onKeydown", "tabindex", "aria-expanded", "id", "aria-controls"];
+const _hoisted_3 = {
   key: 0,
   class: "p-accordion-header-text"
 };
-const _hoisted_3 = { class: "p-accordion-content" };
+const _hoisted_4 = ["id", "aria-labelledby"];
+const _hoisted_5 = { class: "p-accordion-content" };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createBlock("div", _hoisted_1, [
-    (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($options.tabs, (tab, i) => {
-      return (vue.openBlock(), vue.createBlock("div", {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.tabs, (tab, i) => {
+      return (vue.openBlock(), vue.createElementBlock("div", {
         key: $options.getKey(tab,i),
-        class: $options.getTabClass(i)
+        class: vue.normalizeClass($options.getTabClass(i))
       }, [
-        vue.createVNode("div", {
-          class: $options.getTabHeaderClass(tab, i)
+        vue.createElementVNode("div", {
+          class: vue.normalizeClass($options.getTabHeaderClass(tab, i))
         }, [
-          vue.createVNode("a", {
+          vue.createElementVNode("a", {
             role: "tab",
             class: "p-accordion-header-link",
             onClick: $event => ($options.onTabClick($event, tab, i)),
@@ -154,31 +156,31 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             id: $options.getTabAriaId(i) + '_header',
             "aria-controls": $options.getTabAriaId(i) + '_content'
           }, [
-            vue.createVNode("span", {
-              class: $options.isTabActive(i) ? $options.getHeaderCollapseIcon() : $options.getHeaderExpandIcon()
+            vue.createElementVNode("span", {
+              class: vue.normalizeClass($options.isTabActive(i) ? $options.getHeaderCollapseIcon() : $options.getHeaderExpandIcon())
             }, null, 2),
             (tab.props && tab.props.header)
-              ? (vue.openBlock(), vue.createBlock("span", _hoisted_2, vue.toDisplayString(tab.props.header), 1))
+              ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3, vue.toDisplayString(tab.props.header), 1))
               : vue.createCommentVNode("", true),
             (tab.children && tab.children.header)
               ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tab.children.header), { key: 1 }))
               : vue.createCommentVNode("", true)
-          ], 40, ["onClick", "onKeydown", "tabindex", "aria-expanded", "id", "aria-controls"])
+          ], 40, _hoisted_2)
         ], 2),
         vue.createVNode(vue.Transition, { name: "p-toggleable-content" }, {
           default: vue.withCtx(() => [
             ($props.lazy ? $options.isTabActive(i) : true)
-              ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
+              ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
                   key: 0,
                   class: "p-toggleable-content",
                   role: "region",
                   id: $options.getTabAriaId(i) + '_content',
                   "aria-labelledby": $options.getTabAriaId(i) + '_header'
                 }, [
-                  vue.createVNode("div", _hoisted_3, [
+                  vue.createElementVNode("div", _hoisted_5, [
                     (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tab)))
                   ])
-                ], 8, ["id", "aria-labelledby"])), [
+                ], 8, _hoisted_4)), [
                   [vue.vShow, $props.lazy ? true: $options.isTabActive(i)]
                 ])
               : vue.createCommentVNode("", true)

package/accordion/accordion.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/utils"),t=require("vue"),a={name:"Accordion",emits:["tab-close","tab-open","update:activeIndex"],props:{multiple:{type:Boolean,default:!1},activeIndex:{type:[Number,Array],default:null},lazy:{type:Boolean,default:!1},expandIcon:{type:String,default:"pi-chevron-right"},collapseIcon:{type:String,default:"pi-chevron-down"}},data(){return{d_activeIndex:this.activeIndex}},watch:{activeIndex(e){this.d_activeIndex=e}},methods:{onTabClick(e,t,a){if(!this.isTabDisabled(t)){const t=this.isTabActive(a),n=t?"tab-close":"tab-open";this.multiple?t?this.d_activeIndex=this.d_activeIndex.filter((e=>e!==a)):this.d_activeIndex?this.d_activeIndex.push(a):this.d_activeIndex=[a]:this.d_activeIndex=this.d_activeIndex===a?null:a,this.$emit("update:activeIndex",this.d_activeIndex),this.$emit(n,{originalEvent:e,index:a})}},onTabKeydown(e,t,a){13===e.which&&this.onTabClick(e,t,a)},isTabActive(e){return this.multiple?this.d_activeIndex&&this.d_activeIndex.includes(e):e===this.d_activeIndex},getKey:(e,t)=>e.props&&e.props.header?e.props.header:t,isTabDisabled:e=>e.props&&e.props.disabled,getTabClass(e){return["p-accordion-tab",{"p-accordion-tab-active":this.isTabActive(e)}]},getTabHeaderClass(e,t){return["p-accordion-header",{"p-highlight":this.isTabActive(t),"p-disabled":this.isTabDisabled(e)}]},getTabAriaId(e){return this.ariaId+"_"+e},getHeaderCollapseIcon(){return["p-accordion-toggle-icon pi",this.collapseIcon]},getHeaderExpandIcon(){return["p-accordion-toggle-icon pi",this.expandIcon]},isAccordionTab:e=>"AccordionTab"===e.type.name},computed:{tabs(){const e=[];return this.$slots.default().forEach((t=>{this.isAccordionTab(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isAccordionTab(t)&&e.push(t)}))})),e},ariaId:()=>e.UniqueComponentId()}};const n={class:"p-accordion p-component"},i={key:0,class:"p-accordion-header-text"},o={class:"p-accordion-content"};!function(e,t){void 0===t&&(t={});var a=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===a&&n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}("\n.p-accordion-header-link {\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    position: relative;\n    text-decoration: none;\n}\n.p-accordion-header-link:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),a.render=function(e,a,c,d,r,s){return t.openBlock(),t.createBlock("div",n,[(t.openBlock(!0),t.createBlock(t.Fragment,null,t.renderList(s.tabs,((e,a)=>(t.openBlock(),t.createBlock("div",{key:s.getKey(e,a),class:s.getTabClass(a)},[t.createVNode("div",{class:s.getTabHeaderClass(e,a)},[t.createVNode("a",{role:"tab",class:"p-accordion-header-link",onClick:t=>s.onTabClick(t,e,a),onKeydown:t=>s.onTabKeydown(t,e,a),tabindex:s.isTabDisabled(e)?null:"0","aria-expanded":s.isTabActive(a),id:s.getTabAriaId(a)+"_header","aria-controls":s.getTabAriaId(a)+"_content"},[t.createVNode("span",{class:s.isTabActive(a)?s.getHeaderCollapseIcon():s.getHeaderExpandIcon()},null,2),e.props&&e.props.header?(t.openBlock(),t.createBlock("span",i,t.toDisplayString(e.props.header),1)):t.createCommentVNode("",!0),e.children&&e.children.header?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.children.header),{key:1})):t.createCommentVNode("",!0)],40,["onClick","onKeydown","tabindex","aria-expanded","id","aria-controls"])],2),t.createVNode(t.Transition,{name:"p-toggleable-content"},{default:t.withCtx((()=>[!c.lazy||s.isTabActive(a)?t.withDirectives((t.openBlock(),t.createBlock("div",{key:0,class:"p-toggleable-content",role:"region",id:s.getTabAriaId(a)+"_content","aria-labelledby":s.getTabAriaId(a)+"_header"},[t.createVNode("div",o,[(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e)))])],8,["id","aria-labelledby"])),[[t.vShow,!!c.lazy||s.isTabActive(a)]]):t.createCommentVNode("",!0)])),_:2},1024)],2)))),128))])},module.exports=a;
+"use strict";var e=require("primevue/utils"),t=require("vue"),n={name:"Accordion",emits:["tab-close","tab-open","update:activeIndex"],props:{multiple:{type:Boolean,default:!1},activeIndex:{type:[Number,Array],default:null},lazy:{type:Boolean,default:!1},expandIcon:{type:String,default:"pi-chevron-right"},collapseIcon:{type:String,default:"pi-chevron-down"}},data(){return{d_activeIndex:this.activeIndex}},watch:{activeIndex(e){this.d_activeIndex=e}},methods:{onTabClick(e,t,n){if(!this.isTabDisabled(t)){const t=this.isTabActive(n),a=t?"tab-close":"tab-open";this.multiple?t?this.d_activeIndex=this.d_activeIndex.filter((e=>e!==n)):this.d_activeIndex?this.d_activeIndex.push(n):this.d_activeIndex=[n]:this.d_activeIndex=this.d_activeIndex===n?null:n,this.$emit("update:activeIndex",this.d_activeIndex),this.$emit(a,{originalEvent:e,index:n})}},onTabKeydown(e,t,n){13===e.which&&this.onTabClick(e,t,n)},isTabActive(e){return this.multiple?this.d_activeIndex&&this.d_activeIndex.includes(e):e===this.d_activeIndex},getKey:(e,t)=>e.props&&e.props.header?e.props.header:t,isTabDisabled:e=>e.props&&e.props.disabled,getTabClass(e){return["p-accordion-tab",{"p-accordion-tab-active":this.isTabActive(e)}]},getTabHeaderClass(e,t){return["p-accordion-header",{"p-highlight":this.isTabActive(t),"p-disabled":this.isTabDisabled(e)}]},getTabAriaId(e){return this.ariaId+"_"+e},getHeaderCollapseIcon(){return["p-accordion-toggle-icon pi",this.collapseIcon]},getHeaderExpandIcon(){return["p-accordion-toggle-icon pi",this.expandIcon]},isAccordionTab:e=>"AccordionTab"===e.type.name},computed:{tabs(){const e=[];return this.$slots.default().forEach((t=>{this.isAccordionTab(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isAccordionTab(t)&&e.push(t)}))})),e},ariaId:()=>e.UniqueComponentId()}};const a={class:"p-accordion p-component"},i=["onClick","onKeydown","tabindex","aria-expanded","id","aria-controls"],o={key:0,class:"p-accordion-header-text"},c=["id","aria-labelledby"],d={class:"p-accordion-content"};!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var a=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&a.firstChild?a.insertBefore(i,a.firstChild):a.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}("\n.p-accordion-header-link {\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    position: relative;\n    text-decoration: none;\n}\n.p-accordion-header-link:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),n.render=function(e,n,r,s,l,p){return t.openBlock(),t.createElementBlock("div",a,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(p.tabs,((e,n)=>(t.openBlock(),t.createElementBlock("div",{key:p.getKey(e,n),class:t.normalizeClass(p.getTabClass(n))},[t.createElementVNode("div",{class:t.normalizeClass(p.getTabHeaderClass(e,n))},[t.createElementVNode("a",{role:"tab",class:"p-accordion-header-link",onClick:t=>p.onTabClick(t,e,n),onKeydown:t=>p.onTabKeydown(t,e,n),tabindex:p.isTabDisabled(e)?null:"0","aria-expanded":p.isTabActive(n),id:p.getTabAriaId(n)+"_header","aria-controls":p.getTabAriaId(n)+"_content"},[t.createElementVNode("span",{class:t.normalizeClass(p.isTabActive(n)?p.getHeaderCollapseIcon():p.getHeaderExpandIcon())},null,2),e.props&&e.props.header?(t.openBlock(),t.createElementBlock("span",o,t.toDisplayString(e.props.header),1)):t.createCommentVNode("",!0),e.children&&e.children.header?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.children.header),{key:1})):t.createCommentVNode("",!0)],40,i)],2),t.createVNode(t.Transition,{name:"p-toggleable-content"},{default:t.withCtx((()=>[!r.lazy||p.isTabActive(n)?t.withDirectives((t.openBlock(),t.createElementBlock("div",{key:0,class:"p-toggleable-content",role:"region",id:p.getTabAriaId(n)+"_content","aria-labelledby":p.getTabAriaId(n)+"_header"},[t.createElementVNode("div",d,[(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e)))])],8,c)),[[t.vShow,!!r.lazy||p.isTabActive(n)]]):t.createCommentVNode("",!0)])),_:2},1024)],2)))),128))])},module.exports=n;

package/accordion/accordion.esm.js

@@ -1,5 +1,5 @@
 import { UniqueComponentId } from 'primevue/utils';
-import { openBlock, createBlock, Fragment, renderList, createVNode, toDisplayString, createCommentVNode, resolveDynamicComponent, Transition, withCtx, withDirectives, vShow } from 'vue';
+import { openBlock, createElementBlock, Fragment, renderList, normalizeClass, createElementVNode, toDisplayString, createCommentVNode, createBlock, resolveDynamicComponent, createVNode, Transition, withCtx, withDirectives, vShow } from 'vue';
 
 var script = {
     name: 'Accordion',
@@ -126,23 +126,25 @@ var script = {
 };
 
 const _hoisted_1 = { class: "p-accordion p-component" };
-const _hoisted_2 = {
+const _hoisted_2 = ["onClick", "onKeydown", "tabindex", "aria-expanded", "id", "aria-controls"];
+const _hoisted_3 = {
   key: 0,
   class: "p-accordion-header-text"
 };
-const _hoisted_3 = { class: "p-accordion-content" };
+const _hoisted_4 = ["id", "aria-labelledby"];
+const _hoisted_5 = { class: "p-accordion-content" };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (openBlock(), createBlock("div", _hoisted_1, [
-    (openBlock(true), createBlock(Fragment, null, renderList($options.tabs, (tab, i) => {
-      return (openBlock(), createBlock("div", {
+  return (openBlock(), createElementBlock("div", _hoisted_1, [
+    (openBlock(true), createElementBlock(Fragment, null, renderList($options.tabs, (tab, i) => {
+      return (openBlock(), createElementBlock("div", {
         key: $options.getKey(tab,i),
-        class: $options.getTabClass(i)
+        class: normalizeClass($options.getTabClass(i))
       }, [
-        createVNode("div", {
-          class: $options.getTabHeaderClass(tab, i)
+        createElementVNode("div", {
+          class: normalizeClass($options.getTabHeaderClass(tab, i))
         }, [
-          createVNode("a", {
+          createElementVNode("a", {
             role: "tab",
             class: "p-accordion-header-link",
             onClick: $event => ($options.onTabClick($event, tab, i)),
@@ -152,31 +154,31 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             id: $options.getTabAriaId(i) + '_header',
             "aria-controls": $options.getTabAriaId(i) + '_content'
           }, [
-            createVNode("span", {
-              class: $options.isTabActive(i) ? $options.getHeaderCollapseIcon() : $options.getHeaderExpandIcon()
+            createElementVNode("span", {
+              class: normalizeClass($options.isTabActive(i) ? $options.getHeaderCollapseIcon() : $options.getHeaderExpandIcon())
             }, null, 2),
             (tab.props && tab.props.header)
-              ? (openBlock(), createBlock("span", _hoisted_2, toDisplayString(tab.props.header), 1))
+              ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(tab.props.header), 1))
               : createCommentVNode("", true),
             (tab.children && tab.children.header)
               ? (openBlock(), createBlock(resolveDynamicComponent(tab.children.header), { key: 1 }))
               : createCommentVNode("", true)
-          ], 40, ["onClick", "onKeydown", "tabindex", "aria-expanded", "id", "aria-controls"])
+          ], 40, _hoisted_2)
         ], 2),
         createVNode(Transition, { name: "p-toggleable-content" }, {
           default: withCtx(() => [
             ($props.lazy ? $options.isTabActive(i) : true)
-              ? withDirectives((openBlock(), createBlock("div", {
+              ? withDirectives((openBlock(), createElementBlock("div", {
                   key: 0,
                   class: "p-toggleable-content",
                   role: "region",
                   id: $options.getTabAriaId(i) + '_content',
                   "aria-labelledby": $options.getTabAriaId(i) + '_header'
                 }, [
-                  createVNode("div", _hoisted_3, [
+                  createElementVNode("div", _hoisted_5, [
                     (openBlock(), createBlock(resolveDynamicComponent(tab)))
                   ])
-                ], 8, ["id", "aria-labelledby"])), [
+                ], 8, _hoisted_4)), [
                   [vShow, $props.lazy ? true: $options.isTabActive(i)]
                 ])
               : createCommentVNode("", true)
@@ -220,4 +222,4 @@ styleInject(css_248z);
 
 script.render = render;
 
-export default script;
+export { script as default };

package/accordion/accordion.esm.min.js

@@ -1 +1 @@
-import{UniqueComponentId as e}from"primevue/utils";import{openBlock as t,createBlock as a,Fragment as i,renderList as n,createVNode as d,toDisplayString as o,createCommentVNode as s,resolveDynamicComponent as c,Transition as r,withCtx as l,withDirectives as p,vShow as h}from"vue";var b={name:"Accordion",emits:["tab-close","tab-open","update:activeIndex"],props:{multiple:{type:Boolean,default:!1},activeIndex:{type:[Number,Array],default:null},lazy:{type:Boolean,default:!1},expandIcon:{type:String,default:"pi-chevron-right"},collapseIcon:{type:String,default:"pi-chevron-down"}},data(){return{d_activeIndex:this.activeIndex}},watch:{activeIndex(e){this.d_activeIndex=e}},methods:{onTabClick(e,t,a){if(!this.isTabDisabled(t)){const t=this.isTabActive(a),i=t?"tab-close":"tab-open";this.multiple?t?this.d_activeIndex=this.d_activeIndex.filter((e=>e!==a)):this.d_activeIndex?this.d_activeIndex.push(a):this.d_activeIndex=[a]:this.d_activeIndex=this.d_activeIndex===a?null:a,this.$emit("update:activeIndex",this.d_activeIndex),this.$emit(i,{originalEvent:e,index:a})}},onTabKeydown(e,t,a){13===e.which&&this.onTabClick(e,t,a)},isTabActive(e){return this.multiple?this.d_activeIndex&&this.d_activeIndex.includes(e):e===this.d_activeIndex},getKey:(e,t)=>e.props&&e.props.header?e.props.header:t,isTabDisabled:e=>e.props&&e.props.disabled,getTabClass(e){return["p-accordion-tab",{"p-accordion-tab-active":this.isTabActive(e)}]},getTabHeaderClass(e,t){return["p-accordion-header",{"p-highlight":this.isTabActive(t),"p-disabled":this.isTabDisabled(e)}]},getTabAriaId(e){return this.ariaId+"_"+e},getHeaderCollapseIcon(){return["p-accordion-toggle-icon pi",this.collapseIcon]},getHeaderExpandIcon(){return["p-accordion-toggle-icon pi",this.expandIcon]},isAccordionTab:e=>"AccordionTab"===e.type.name},computed:{tabs(){const e=[];return this.$slots.default().forEach((t=>{this.isAccordionTab(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isAccordionTab(t)&&e.push(t)}))})),e},ariaId:()=>e()}};const u={class:"p-accordion p-component"},v={key:0,class:"p-accordion-header-text"},x={class:"p-accordion-content"};!function(e,t){void 0===t&&(t={});var a=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===a&&i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-accordion-header-link {\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    position: relative;\n    text-decoration: none;\n}\n.p-accordion-header-link:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),b.render=function(e,b,g,I,T,y){return t(),a("div",u,[(t(!0),a(i,null,n(y.tabs,((e,i)=>(t(),a("div",{key:y.getKey(e,i),class:y.getTabClass(i)},[d("div",{class:y.getTabHeaderClass(e,i)},[d("a",{role:"tab",class:"p-accordion-header-link",onClick:t=>y.onTabClick(t,e,i),onKeydown:t=>y.onTabKeydown(t,e,i),tabindex:y.isTabDisabled(e)?null:"0","aria-expanded":y.isTabActive(i),id:y.getTabAriaId(i)+"_header","aria-controls":y.getTabAriaId(i)+"_content"},[d("span",{class:y.isTabActive(i)?y.getHeaderCollapseIcon():y.getHeaderExpandIcon()},null,2),e.props&&e.props.header?(t(),a("span",v,o(e.props.header),1)):s("",!0),e.children&&e.children.header?(t(),a(c(e.children.header),{key:1})):s("",!0)],40,["onClick","onKeydown","tabindex","aria-expanded","id","aria-controls"])],2),d(r,{name:"p-toggleable-content"},{default:l((()=>[!g.lazy||y.isTabActive(i)?p((t(),a("div",{key:0,class:"p-toggleable-content",role:"region",id:y.getTabAriaId(i)+"_content","aria-labelledby":y.getTabAriaId(i)+"_header"},[d("div",x,[(t(),a(c(e)))])],8,["id","aria-labelledby"])),[[h,!!g.lazy||y.isTabActive(i)]]):s("",!0)])),_:2},1024)],2)))),128))])};export default b;
+import{UniqueComponentId as e}from"primevue/utils";import{openBlock as t,createElementBlock as a,Fragment as i,renderList as n,normalizeClass as d,createElementVNode as o,toDisplayString as s,createCommentVNode as c,createBlock as r,resolveDynamicComponent as l,createVNode as p,Transition as h,withCtx as b,withDirectives as u,vShow as v}from"vue";var x={name:"Accordion",emits:["tab-close","tab-open","update:activeIndex"],props:{multiple:{type:Boolean,default:!1},activeIndex:{type:[Number,Array],default:null},lazy:{type:Boolean,default:!1},expandIcon:{type:String,default:"pi-chevron-right"},collapseIcon:{type:String,default:"pi-chevron-down"}},data(){return{d_activeIndex:this.activeIndex}},watch:{activeIndex(e){this.d_activeIndex=e}},methods:{onTabClick(e,t,a){if(!this.isTabDisabled(t)){const t=this.isTabActive(a),i=t?"tab-close":"tab-open";this.multiple?t?this.d_activeIndex=this.d_activeIndex.filter((e=>e!==a)):this.d_activeIndex?this.d_activeIndex.push(a):this.d_activeIndex=[a]:this.d_activeIndex=this.d_activeIndex===a?null:a,this.$emit("update:activeIndex",this.d_activeIndex),this.$emit(i,{originalEvent:e,index:a})}},onTabKeydown(e,t,a){13===e.which&&this.onTabClick(e,t,a)},isTabActive(e){return this.multiple?this.d_activeIndex&&this.d_activeIndex.includes(e):e===this.d_activeIndex},getKey:(e,t)=>e.props&&e.props.header?e.props.header:t,isTabDisabled:e=>e.props&&e.props.disabled,getTabClass(e){return["p-accordion-tab",{"p-accordion-tab-active":this.isTabActive(e)}]},getTabHeaderClass(e,t){return["p-accordion-header",{"p-highlight":this.isTabActive(t),"p-disabled":this.isTabDisabled(e)}]},getTabAriaId(e){return this.ariaId+"_"+e},getHeaderCollapseIcon(){return["p-accordion-toggle-icon pi",this.collapseIcon]},getHeaderExpandIcon(){return["p-accordion-toggle-icon pi",this.expandIcon]},isAccordionTab:e=>"AccordionTab"===e.type.name},computed:{tabs(){const e=[];return this.$slots.default().forEach((t=>{this.isAccordionTab(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isAccordionTab(t)&&e.push(t)}))})),e},ariaId:()=>e()}};const g={class:"p-accordion p-component"},I=["onClick","onKeydown","tabindex","aria-expanded","id","aria-controls"],T={key:0,class:"p-accordion-header-text"},y=["id","aria-labelledby"],m={class:"p-accordion-content"};!function(e,t){void 0===t&&(t={});var a=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===a&&i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-accordion-header-link {\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    position: relative;\n    text-decoration: none;\n}\n.p-accordion-header-link:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),x.render=function(e,x,f,A,_,k){return t(),a("div",g,[(t(!0),a(i,null,n(k.tabs,((e,i)=>(t(),a("div",{key:k.getKey(e,i),class:d(k.getTabClass(i))},[o("div",{class:d(k.getTabHeaderClass(e,i))},[o("a",{role:"tab",class:"p-accordion-header-link",onClick:t=>k.onTabClick(t,e,i),onKeydown:t=>k.onTabKeydown(t,e,i),tabindex:k.isTabDisabled(e)?null:"0","aria-expanded":k.isTabActive(i),id:k.getTabAriaId(i)+"_header","aria-controls":k.getTabAriaId(i)+"_content"},[o("span",{class:d(k.isTabActive(i)?k.getHeaderCollapseIcon():k.getHeaderExpandIcon())},null,2),e.props&&e.props.header?(t(),a("span",T,s(e.props.header),1)):c("",!0),e.children&&e.children.header?(t(),r(l(e.children.header),{key:1})):c("",!0)],40,I)],2),p(h,{name:"p-toggleable-content"},{default:b((()=>[!f.lazy||k.isTabActive(i)?u((t(),a("div",{key:0,class:"p-toggleable-content",role:"region",id:k.getTabAriaId(i)+"_content","aria-labelledby":k.getTabAriaId(i)+"_header"},[o("div",m,[(t(),r(l(e)))])],8,y)),[[v,!!f.lazy||k.isTabActive(i)]]):c("",!0)])),_:2},1024)],2)))),128))])};export{x as default};

package/accordion/accordion.js

@@ -127,23 +127,25 @@ this.primevue.accordion = (function (utils, vue) {
     };
 
     const _hoisted_1 = { class: "p-accordion p-component" };
-    const _hoisted_2 = {
+    const _hoisted_2 = ["onClick", "onKeydown", "tabindex", "aria-expanded", "id", "aria-controls"];
+    const _hoisted_3 = {
       key: 0,
       class: "p-accordion-header-text"
     };
-    const _hoisted_3 = { class: "p-accordion-content" };
+    const _hoisted_4 = ["id", "aria-labelledby"];
+    const _hoisted_5 = { class: "p-accordion-content" };
 
     function render(_ctx, _cache, $props, $setup, $data, $options) {
-      return (vue.openBlock(), vue.createBlock("div", _hoisted_1, [
-        (vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($options.tabs, (tab, i) => {
-          return (vue.openBlock(), vue.createBlock("div", {
+      return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.tabs, (tab, i) => {
+          return (vue.openBlock(), vue.createElementBlock("div", {
             key: $options.getKey(tab,i),
-            class: $options.getTabClass(i)
+            class: vue.normalizeClass($options.getTabClass(i))
           }, [
-            vue.createVNode("div", {
-              class: $options.getTabHeaderClass(tab, i)
+            vue.createElementVNode("div", {
+              class: vue.normalizeClass($options.getTabHeaderClass(tab, i))
             }, [
-              vue.createVNode("a", {
+              vue.createElementVNode("a", {
                 role: "tab",
                 class: "p-accordion-header-link",
                 onClick: $event => ($options.onTabClick($event, tab, i)),
@@ -153,31 +155,31 @@ this.primevue.accordion = (function (utils, vue) {
                 id: $options.getTabAriaId(i) + '_header',
                 "aria-controls": $options.getTabAriaId(i) + '_content'
               }, [
-                vue.createVNode("span", {
-                  class: $options.isTabActive(i) ? $options.getHeaderCollapseIcon() : $options.getHeaderExpandIcon()
+                vue.createElementVNode("span", {
+                  class: vue.normalizeClass($options.isTabActive(i) ? $options.getHeaderCollapseIcon() : $options.getHeaderExpandIcon())
                 }, null, 2),
                 (tab.props && tab.props.header)
-                  ? (vue.openBlock(), vue.createBlock("span", _hoisted_2, vue.toDisplayString(tab.props.header), 1))
+                  ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3, vue.toDisplayString(tab.props.header), 1))
                   : vue.createCommentVNode("", true),
                 (tab.children && tab.children.header)
                   ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tab.children.header), { key: 1 }))
                   : vue.createCommentVNode("", true)
-              ], 40, ["onClick", "onKeydown", "tabindex", "aria-expanded", "id", "aria-controls"])
+              ], 40, _hoisted_2)
             ], 2),
             vue.createVNode(vue.Transition, { name: "p-toggleable-content" }, {
               default: vue.withCtx(() => [
                 ($props.lazy ? $options.isTabActive(i) : true)
-                  ? vue.withDirectives((vue.openBlock(), vue.createBlock("div", {
+                  ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
                       key: 0,
                       class: "p-toggleable-content",
                       role: "region",
                       id: $options.getTabAriaId(i) + '_content',
                       "aria-labelledby": $options.getTabAriaId(i) + '_header'
                     }, [
-                      vue.createVNode("div", _hoisted_3, [
+                      vue.createElementVNode("div", _hoisted_5, [
                         (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tab)))
                       ])
-                    ], 8, ["id", "aria-labelledby"])), [
+                    ], 8, _hoisted_4)), [
                       [vue.vShow, $props.lazy ? true: $options.isTabActive(i)]
                     ])
                   : vue.createCommentVNode("", true)
@@ -223,4 +225,4 @@ this.primevue.accordion = (function (utils, vue) {
 
     return script;
 
-}(primevue.utils, Vue));
+})(primevue.utils, Vue);

package/accordion/accordion.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.accordion=function(e,t){"use strict";var n={name:"Accordion",emits:["tab-close","tab-open","update:activeIndex"],props:{multiple:{type:Boolean,default:!1},activeIndex:{type:[Number,Array],default:null},lazy:{type:Boolean,default:!1},expandIcon:{type:String,default:"pi-chevron-right"},collapseIcon:{type:String,default:"pi-chevron-down"}},data(){return{d_activeIndex:this.activeIndex}},watch:{activeIndex(e){this.d_activeIndex=e}},methods:{onTabClick(e,t,n){if(!this.isTabDisabled(t)){const t=this.isTabActive(n),a=t?"tab-close":"tab-open";this.multiple?t?this.d_activeIndex=this.d_activeIndex.filter((e=>e!==n)):this.d_activeIndex?this.d_activeIndex.push(n):this.d_activeIndex=[n]:this.d_activeIndex=this.d_activeIndex===n?null:n,this.$emit("update:activeIndex",this.d_activeIndex),this.$emit(a,{originalEvent:e,index:n})}},onTabKeydown(e,t,n){13===e.which&&this.onTabClick(e,t,n)},isTabActive(e){return this.multiple?this.d_activeIndex&&this.d_activeIndex.includes(e):e===this.d_activeIndex},getKey:(e,t)=>e.props&&e.props.header?e.props.header:t,isTabDisabled:e=>e.props&&e.props.disabled,getTabClass(e){return["p-accordion-tab",{"p-accordion-tab-active":this.isTabActive(e)}]},getTabHeaderClass(e,t){return["p-accordion-header",{"p-highlight":this.isTabActive(t),"p-disabled":this.isTabDisabled(e)}]},getTabAriaId(e){return this.ariaId+"_"+e},getHeaderCollapseIcon(){return["p-accordion-toggle-icon pi",this.collapseIcon]},getHeaderExpandIcon(){return["p-accordion-toggle-icon pi",this.expandIcon]},isAccordionTab:e=>"AccordionTab"===e.type.name},computed:{tabs(){const e=[];return this.$slots.default().forEach((t=>{this.isAccordionTab(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isAccordionTab(t)&&e.push(t)}))})),e},ariaId:()=>e.UniqueComponentId()}};const a={class:"p-accordion p-component"},i={key:0,class:"p-accordion-header-text"},o={class:"p-accordion-content"};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],i=document.createElement("style");i.type="text/css","top"===n&&a.firstChild?a.insertBefore(i,a.firstChild):a.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}("\n.p-accordion-header-link {\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    position: relative;\n    text-decoration: none;\n}\n.p-accordion-header-link:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),n.render=function(e,n,c,d,r,s){return t.openBlock(),t.createBlock("div",a,[(t.openBlock(!0),t.createBlock(t.Fragment,null,t.renderList(s.tabs,((e,n)=>(t.openBlock(),t.createBlock("div",{key:s.getKey(e,n),class:s.getTabClass(n)},[t.createVNode("div",{class:s.getTabHeaderClass(e,n)},[t.createVNode("a",{role:"tab",class:"p-accordion-header-link",onClick:t=>s.onTabClick(t,e,n),onKeydown:t=>s.onTabKeydown(t,e,n),tabindex:s.isTabDisabled(e)?null:"0","aria-expanded":s.isTabActive(n),id:s.getTabAriaId(n)+"_header","aria-controls":s.getTabAriaId(n)+"_content"},[t.createVNode("span",{class:s.isTabActive(n)?s.getHeaderCollapseIcon():s.getHeaderExpandIcon()},null,2),e.props&&e.props.header?(t.openBlock(),t.createBlock("span",i,t.toDisplayString(e.props.header),1)):t.createCommentVNode("",!0),e.children&&e.children.header?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.children.header),{key:1})):t.createCommentVNode("",!0)],40,["onClick","onKeydown","tabindex","aria-expanded","id","aria-controls"])],2),t.createVNode(t.Transition,{name:"p-toggleable-content"},{default:t.withCtx((()=>[!c.lazy||s.isTabActive(n)?t.withDirectives((t.openBlock(),t.createBlock("div",{key:0,class:"p-toggleable-content",role:"region",id:s.getTabAriaId(n)+"_content","aria-labelledby":s.getTabAriaId(n)+"_header"},[t.createVNode("div",o,[(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e)))])],8,["id","aria-labelledby"])),[[t.vShow,!!c.lazy||s.isTabActive(n)]]):t.createCommentVNode("",!0)])),_:2},1024)],2)))),128))])},n}(primevue.utils,Vue);
+this.primevue=this.primevue||{},this.primevue.accordion=function(e,t){"use strict";var n={name:"Accordion",emits:["tab-close","tab-open","update:activeIndex"],props:{multiple:{type:Boolean,default:!1},activeIndex:{type:[Number,Array],default:null},lazy:{type:Boolean,default:!1},expandIcon:{type:String,default:"pi-chevron-right"},collapseIcon:{type:String,default:"pi-chevron-down"}},data(){return{d_activeIndex:this.activeIndex}},watch:{activeIndex(e){this.d_activeIndex=e}},methods:{onTabClick(e,t,n){if(!this.isTabDisabled(t)){const t=this.isTabActive(n),a=t?"tab-close":"tab-open";this.multiple?t?this.d_activeIndex=this.d_activeIndex.filter((e=>e!==n)):this.d_activeIndex?this.d_activeIndex.push(n):this.d_activeIndex=[n]:this.d_activeIndex=this.d_activeIndex===n?null:n,this.$emit("update:activeIndex",this.d_activeIndex),this.$emit(a,{originalEvent:e,index:n})}},onTabKeydown(e,t,n){13===e.which&&this.onTabClick(e,t,n)},isTabActive(e){return this.multiple?this.d_activeIndex&&this.d_activeIndex.includes(e):e===this.d_activeIndex},getKey:(e,t)=>e.props&&e.props.header?e.props.header:t,isTabDisabled:e=>e.props&&e.props.disabled,getTabClass(e){return["p-accordion-tab",{"p-accordion-tab-active":this.isTabActive(e)}]},getTabHeaderClass(e,t){return["p-accordion-header",{"p-highlight":this.isTabActive(t),"p-disabled":this.isTabDisabled(e)}]},getTabAriaId(e){return this.ariaId+"_"+e},getHeaderCollapseIcon(){return["p-accordion-toggle-icon pi",this.collapseIcon]},getHeaderExpandIcon(){return["p-accordion-toggle-icon pi",this.expandIcon]},isAccordionTab:e=>"AccordionTab"===e.type.name},computed:{tabs(){const e=[];return this.$slots.default().forEach((t=>{this.isAccordionTab(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isAccordionTab(t)&&e.push(t)}))})),e},ariaId:()=>e.UniqueComponentId()}};const a={class:"p-accordion p-component"},i=["onClick","onKeydown","tabindex","aria-expanded","id","aria-controls"],o={key:0,class:"p-accordion-header-text"},c=["id","aria-labelledby"],d={class:"p-accordion-content"};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],i=document.createElement("style");i.type="text/css","top"===n&&a.firstChild?a.insertBefore(i,a.firstChild):a.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}("\n.p-accordion-header-link {\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    position: relative;\n    text-decoration: none;\n}\n.p-accordion-header-link:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),n.render=function(e,n,r,s,l,p){return t.openBlock(),t.createElementBlock("div",a,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(p.tabs,((e,n)=>(t.openBlock(),t.createElementBlock("div",{key:p.getKey(e,n),class:t.normalizeClass(p.getTabClass(n))},[t.createElementVNode("div",{class:t.normalizeClass(p.getTabHeaderClass(e,n))},[t.createElementVNode("a",{role:"tab",class:"p-accordion-header-link",onClick:t=>p.onTabClick(t,e,n),onKeydown:t=>p.onTabKeydown(t,e,n),tabindex:p.isTabDisabled(e)?null:"0","aria-expanded":p.isTabActive(n),id:p.getTabAriaId(n)+"_header","aria-controls":p.getTabAriaId(n)+"_content"},[t.createElementVNode("span",{class:t.normalizeClass(p.isTabActive(n)?p.getHeaderCollapseIcon():p.getHeaderExpandIcon())},null,2),e.props&&e.props.header?(t.openBlock(),t.createElementBlock("span",o,t.toDisplayString(e.props.header),1)):t.createCommentVNode("",!0),e.children&&e.children.header?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.children.header),{key:1})):t.createCommentVNode("",!0)],40,i)],2),t.createVNode(t.Transition,{name:"p-toggleable-content"},{default:t.withCtx((()=>[!r.lazy||p.isTabActive(n)?t.withDirectives((t.openBlock(),t.createElementBlock("div",{key:0,class:"p-toggleable-content",role:"region",id:p.getTabAriaId(n)+"_content","aria-labelledby":p.getTabAriaId(n)+"_header"},[t.createElementVNode("div",d,[(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e)))])],8,c)),[[t.vShow,!!r.lazy||p.isTabActive(n)]]):t.createCommentVNode("",!0)])),_:2},1024)],2)))),128))])},n}(primevue.utils,Vue);

package/accordiontab/accordiontab.esm.js

@@ -14,4 +14,4 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
 
 script.render = render;
 
-export default script;
+export { script as default };

package/accordiontab/accordiontab.esm.min.js

@@ -1 +1 @@
-import{renderSlot as e}from"vue";var r={name:"AccordionTab",props:{header:null,disabled:Boolean}};r.render=function(r,o,a,n,d,l){return e(r.$slots,"default")};export default r;
+import{renderSlot as e}from"vue";var r={name:"AccordionTab",props:{header:null,disabled:Boolean}};r.render=function(r,o,a,n,d,l){return e(r.$slots,"default")};export{r as default};

package/accordiontab/accordiontab.js

@@ -18,4 +18,4 @@ this.primevue.accordiontab = (function (vue) {
 
     return script;
 
-}(Vue));
+})(Vue);

package/api/api.js

@@ -519,4 +519,4 @@ this.primevue.api = (function (exports, utils) {
 
     return exports;
 
-}({}, primevue.utils));
+})({}, primevue.utils);

package/autocomplete/AutoComplete.d.ts

@@ -135,6 +135,11 @@ export interface AutoCompleteProps {
      * Style class of the overlay panel.
      */
     panelClass?: any;
+    /**
+     * Icon to display in loading state.
+     * Default value is 'pi pi-spinner pi-spin'.
+     */
+    loadingIcon?: string | undefined;
     /**
      * Whether to use the virtualScroller feature. The properties of VirtualScroller component can be used like an object in it.
      * @see VirtualScroller.VirtualScrollerProps

package/autocomplete/AutoComplete.vue

@@ -14,9 +14,9 @@
                     role="searchbox" aria-autocomplete="list" :aria-controls="listId">
             </li>
         </ul>
-        <i class="p-autocomplete-loader pi pi-spinner pi-spin" v-if="searching"></i>
+        <i :class="loadingIconClass" v-if="searching"></i>
         <Button ref="dropdownButton" type="button" icon="pi pi-chevron-down" class="p-autocomplete-dropdown" :disabled="$attrs.disabled" @click="onDropdownClick" v-if="dropdown"/>
-        <Teleport :to="appendTarget" :disabled="appendDisabled">
+        <Portal :appendTo="appendTo">
             <transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
                 <div :ref="overlayRef" :class="panelStyleClass" :style="{'max-height': virtualScrollerDisabled ? scrollHeight : ''}" v-if="overlayVisible" @click="onOverlayClick">
                     <slot name="header" :value="modelValue" :suggestions="suggestions"></slot>
@@ -47,7 +47,7 @@
                     <slot name="footer" :value="modelValue" :suggestions="suggestions"></slot>
                 </div>
             </transition>
-        </Teleport>
+        </Portal>
     </span>
 </template>
 
@@ -57,6 +57,7 @@ import OverlayEventBus from 'primevue/overlayeventbus';
 import Button from 'primevue/button';
 import Ripple from 'primevue/ripple';
 import VirtualScroller from 'primevue/virtualscroller';
+import Portal from 'primevue/portal';
 
 export default {
     name: 'AutoComplete',
@@ -122,6 +123,10 @@ export default {
         virtualScrollerOptions: {
             type: Object,
             default: null
+        },
+        loadingIcon: {
+            type: String,
+            default: 'pi pi-spinner'
         }
     },
     timeout: null,
@@ -208,7 +213,7 @@ export default {
         },
         alignOverlay() {
             let target = this.multiple ? this.$refs.multiContainer : this.$refs.input;
-            if (this.appendDisabled) {
+            if (this.appendTo === 'self') {
                 DomHandler.relativePosition(this.overlay, target);
             }
             else {
@@ -245,7 +250,7 @@ export default {
         bindResizeListener() {
             if (!this.resizeListener) {
                 this.resizeListener = () => {
-                    if (this.overlayVisible) {
+                    if (this.overlayVisible && !DomHandler.isTouchDevice()) {
                         this.hideOverlay();
                     }
                 };
@@ -597,6 +602,9 @@ export default {
                 'p-ripple-disabled': this.$primevue.config.ripple === false
             }];
         },
+        loadingIconClass() {
+            return ['p-autocomplete-loader pi-spin', this.loadingIcon];
+        },
         inputValue() {
             if (this.modelValue) {
                 if (this.field && typeof this.modelValue === 'object') {
@@ -613,19 +621,14 @@ export default {
         listId() {
             return UniqueComponentId() + '_list';
         },
-        appendDisabled() {
-            return this.appendTo === 'self';
-        },
-        appendTarget() {
-            return this.appendDisabled ? null : this.appendTo;
-        },
         virtualScrollerDisabled() {
             return !this.virtualScrollerOptions;
         }
     },
     components: {
         'Button': Button,
-        'VirtualScroller': VirtualScroller
+        'VirtualScroller': VirtualScroller,
+        'Portal': Portal
     },
     directives: {
         'ripple': Ripple