primevue 3.26.1 → 3.27.0

package/accordion/accordion.esm.min.js

@@ -1 +1 @@
-import e from"primevue/ripple";import{UniqueComponentId as t,DomHandler as n}from"primevue/utils";import{openBlock as a,createElementBlock as i,Fragment as d,renderList as o,normalizeClass as r,createElementVNode as s,mergeProps as c,toDisplayString as l,createCommentVNode as h,createBlock as p,resolveDynamicComponent as b,createVNode as u,Transition as g,withCtx as T,withDirectives as v,vShow as f}from"vue";var m={name:"Accordion",emits:["update:activeIndex","tab-open","tab-close","tab-click"],props:{multiple:{type:Boolean,default:!1},activeIndex:{type:[Number,Array],default:null},lazy:{type:Boolean,default:!1},expandIcon:{type:String,default:"pi pi-chevron-right"},collapseIcon:{type:String,default:"pi pi-chevron-down"},tabindex:{type:Number,default:0},selectOnFocus:{type:Boolean,default:!1}},data(){return{id:this.$attrs.id,d_activeIndex:this.activeIndex}},watch:{"$attrs.id":function(e){this.id=e||t()},activeIndex(e){this.d_activeIndex=e}},mounted(){this.id=this.id||t()},methods:{isAccordionTab:e=>"AccordionTab"===e.type.name,isTabActive(e){return this.multiple?this.d_activeIndex&&this.d_activeIndex.includes(e):this.d_activeIndex===e},getTabProp:(e,t)=>e.props?e.props[t]:void 0,getKey(e,t){return this.getTabProp(e,"header")||t},getTabHeaderActionId(e){return`${this.id}_${e}_header_action`},getTabContentId(e){return`${this.id}_${e}_content`},onTabClick(e,t,n){this.changeActiveIndex(e,t,n),this.$emit("tab-click",{originalEvent:e,index:n})},onTabKeyDown(e,t,n){switch(e.code){case"ArrowDown":this.onTabArrowDownKey(e);break;case"ArrowUp":this.onTabArrowUpKey(e);break;case"Home":this.onTabHomeKey(e);break;case"End":this.onTabEndKey(e);break;case"Enter":case"Space":this.onTabEnterKey(e,t,n)}},onTabArrowDownKey(e){const t=this.findNextHeaderAction(e.target.parentElement.parentElement);t?this.changeFocusedTab(e,t):this.onTabHomeKey(e),e.preventDefault()},onTabArrowUpKey(e){const t=this.findPrevHeaderAction(e.target.parentElement.parentElement);t?this.changeFocusedTab(e,t):this.onTabEndKey(e),e.preventDefault()},onTabHomeKey(e){const t=this.findFirstHeaderAction();this.changeFocusedTab(e,t),e.preventDefault()},onTabEndKey(e){const t=this.findLastHeaderAction();this.changeFocusedTab(e,t),e.preventDefault()},onTabEnterKey(e,t,n){this.changeActiveIndex(e,t,n),e.preventDefault()},findNextHeaderAction(e,t=!1){const a=t?e:e.nextElementSibling,i=n.findSingle(a,".p-accordion-header");return i?n.hasClass(i,"p-disabled")?this.findNextHeaderAction(i.parentElement):n.findSingle(i,".p-accordion-header-action"):null},findPrevHeaderAction(e,t=!1){const a=t?e:e.previousElementSibling,i=n.findSingle(a,".p-accordion-header");return i?n.hasClass(i,"p-disabled")?this.findPrevHeaderAction(i.parentElement):n.findSingle(i,".p-accordion-header-action"):null},findFirstHeaderAction(){return this.findNextHeaderAction(this.$el.firstElementChild,!0)},findLastHeaderAction(){return this.findPrevHeaderAction(this.$el.lastElementChild,!0)},changeActiveIndex(e,t,n){if(!this.getTabProp(t,"disabled")){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})}},changeFocusedTab(e,t){if(t&&(n.focus(t),this.selectOnFocus)){const n=parseInt(t.parentElement.parentElement.dataset.index,10),a=this.tabs[n];this.changeActiveIndex(e,a,n)}},getTabClass(e){return["p-accordion-tab",{"p-accordion-tab-active":this.isTabActive(e)}]},getTabHeaderClass(e,t){return["p-accordion-header",this.getTabProp(e,"headerClass"),{"p-highlight":this.isTabActive(t),"p-disabled":this.getTabProp(e,"disabled")}]},getTabHeaderIconClass(e){return["p-accordion-toggle-icon",this.isTabActive(e)?this.collapseIcon:this.expandIcon]},getTabContentClass(e){return["p-toggleable-content",this.getTabProp(e,"contentClass")]}},computed:{tabs(){return this.$slots.default().reduce(((e,t)=>(this.isAccordionTab(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isAccordionTab(t)&&e.push(t)})),e)),[])}},directives:{ripple:e}};const x={class:"p-accordion p-component"},y=["data-index"],A=["id","tabindex","aria-disabled","aria-expanded","aria-controls","onClick","onKeydown"],I={key:0,class:"p-accordion-header-text"},C=["id","aria-labelledby"],E={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-action {\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    user-select: none;\n    position: relative;\n    text-decoration: none;\n}\n.p-accordion-header-action:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),m.render=function(e,t,n,m,H,P){return a(),i("div",x,[(a(!0),i(d,null,o(P.tabs,((e,t)=>(a(),i("div",{key:P.getKey(e,t),class:r(P.getTabClass(t)),"data-index":t},[s("div",c({style:P.getTabProp(e,"headerStyle"),class:P.getTabHeaderClass(e,t)},P.getTabProp(e,"headerProps")),[s("a",c({id:P.getTabHeaderActionId(t),class:"p-accordion-header-link p-accordion-header-action",tabindex:P.getTabProp(e,"disabled")?-1:n.tabindex,role:"button","aria-disabled":P.getTabProp(e,"disabled"),"aria-expanded":P.isTabActive(t),"aria-controls":P.getTabContentId(t),onClick:n=>P.onTabClick(n,e,t),onKeydown:n=>P.onTabKeyDown(n,e,t)},P.getTabProp(e,"headerActionProps")),[s("span",{class:r(P.getTabHeaderIconClass(t)),"aria-hidden":"true"},null,2),e.props&&e.props.header?(a(),i("span",I,l(e.props.header),1)):h("",!0),e.children&&e.children.header?(a(),p(b(e.children.header),{key:1})):h("",!0)],16,A)],16),u(g,{name:"p-toggleable-content"},{default:T((()=>[!n.lazy||P.isTabActive(t)?v((a(),i("div",c({key:0,id:P.getTabContentId(t),style:P.getTabProp(e,"contentStyle"),class:P.getTabContentClass(e),role:"region","aria-labelledby":P.getTabHeaderActionId(t)},P.getTabProp(e,"contentProps")),[s("div",E,[(a(),p(b(e)))])],16,C)),[[f,!!n.lazy||P.isTabActive(t)]]):h("",!0)])),_:2},1024)],10,y)))),128))])};export{m as default};
+import e from"primevue/basecomponent";import t from"primevue/icons/chevrondown";import n from"primevue/icons/chevronright";import a from"primevue/ripple";import{UniqueComponentId as i,DomHandler as o}from"primevue/utils";import{openBlock as r,createElementBlock as d,mergeProps as s,Fragment as c,renderList as l,createElementVNode as h,createBlock as p,resolveDynamicComponent as b,toDisplayString as u,createCommentVNode as T,createVNode as g,Transition as v,withCtx as m,withDirectives as f,vShow as x}from"vue";var y={name:"Accordion",extends:e,emits:["update:activeIndex","tab-open","tab-close","tab-click"],props:{multiple:{type:Boolean,default:!1},activeIndex:{type:[Number,Array],default:null},lazy:{type:Boolean,default:!1},expandIcon:{type:String,default:void 0},collapseIcon:{type:String,default:void 0},tabindex:{type:Number,default:0},selectOnFocus:{type:Boolean,default:!1}},data(){return{id:this.$attrs.id,d_activeIndex:this.activeIndex}},watch:{"$attrs.id":function(e){this.id=e||i()},activeIndex(e){this.d_activeIndex=e}},mounted(){this.id=this.id||i()},methods:{isAccordionTab:e=>"AccordionTab"===e.type.name,isTabActive(e){return this.multiple?this.d_activeIndex&&this.d_activeIndex.includes(e):this.d_activeIndex===e},getTabProp:(e,t)=>e.props?e.props[t]:void 0,getKey(e,t){return this.getTabProp(e,"header")||t},getTabHeaderActionId(e){return`${this.id}_${e}_header_action`},getTabContentId(e){return`${this.id}_${e}_content`},getTabPT(e,t){return this.ptmo(this.getTabProp(e,"pt"),t,{props:e.props,parent:{props:this.$props,state:this.$data}})},onTabClick(e,t,n){this.changeActiveIndex(e,t,n),this.$emit("tab-click",{originalEvent:e,index:n})},onTabKeyDown(e,t,n){switch(e.code){case"ArrowDown":this.onTabArrowDownKey(e);break;case"ArrowUp":this.onTabArrowUpKey(e);break;case"Home":this.onTabHomeKey(e);break;case"End":this.onTabEndKey(e);break;case"Enter":case"Space":this.onTabEnterKey(e,t,n)}},onTabArrowDownKey(e){const t=this.findNextHeaderAction(e.target.parentElement.parentElement);t?this.changeFocusedTab(e,t):this.onTabHomeKey(e),e.preventDefault()},onTabArrowUpKey(e){const t=this.findPrevHeaderAction(e.target.parentElement.parentElement);t?this.changeFocusedTab(e,t):this.onTabEndKey(e),e.preventDefault()},onTabHomeKey(e){const t=this.findFirstHeaderAction();this.changeFocusedTab(e,t),e.preventDefault()},onTabEndKey(e){const t=this.findLastHeaderAction();this.changeFocusedTab(e,t),e.preventDefault()},onTabEnterKey(e,t,n){this.changeActiveIndex(e,t,n),e.preventDefault()},findNextHeaderAction(e,t=!1){const n=t?e:e.nextElementSibling,a=o.findSingle(n,".p-accordion-header");return a?o.hasClass(a,"p-disabled")?this.findNextHeaderAction(a.parentElement):o.findSingle(a,".p-accordion-header-action"):null},findPrevHeaderAction(e,t=!1){const n=t?e:e.previousElementSibling,a=o.findSingle(n,".p-accordion-header");return a?o.hasClass(a,"p-disabled")?this.findPrevHeaderAction(a.parentElement):o.findSingle(a,".p-accordion-header-action"):null},findFirstHeaderAction(){return this.findNextHeaderAction(this.$el.firstElementChild,!0)},findLastHeaderAction(){return this.findPrevHeaderAction(this.$el.lastElementChild,!0)},changeActiveIndex(e,t,n){if(!this.getTabProp(t,"disabled")){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})}},changeFocusedTab(e,t){if(t&&(o.focus(t),this.selectOnFocus)){const n=parseInt(t.parentElement.parentElement.dataset.index,10),a=this.tabs[n];this.changeActiveIndex(e,a,n)}},getTabClass(e){return["p-accordion-tab",{"p-accordion-tab-active":this.isTabActive(e)}]},getTabHeaderClass(e,t){return["p-accordion-header",this.getTabProp(e,"headerClass"),{"p-highlight":this.isTabActive(t),"p-disabled":this.getTabProp(e,"disabled")}]},getTabContentClass(e){return["p-toggleable-content",this.getTabProp(e,"contentClass")]}},computed:{tabs(){return this.$slots.default().reduce(((e,t)=>(this.isAccordionTab(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isAccordionTab(t)&&e.push(t)})),e)),[])}},components:{ChevronDownIcon:t,ChevronRightIcon:n},directives:{ripple:a}};const A=["data-index"],I=["id","tabindex","aria-disabled","aria-expanded","aria-controls","onClick","onKeydown"],C=["id","aria-labelledby"];!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-action {\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    user-select: none;\n    position: relative;\n    text-decoration: none;\n}\n.p-accordion-header-action:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),y.render=function(e,t,n,a,i,o){return r(),d("div",s({class:"p-accordion p-component"},e.ptm("root")),[(r(!0),d(c,null,l(o.tabs,((e,t)=>(r(),d("div",s({key:o.getKey(e,t),class:o.getTabClass(t),"data-index":t},o.getTabPT(e,"root")),[h("div",s({style:o.getTabProp(e,"headerStyle"),class:o.getTabHeaderClass(e,t)},{...o.getTabProp(e,"headerProps"),...o.getTabPT(e,"header")}),[h("a",s({id:o.getTabHeaderActionId(t),class:"p-accordion-header-link p-accordion-header-action",tabindex:o.getTabProp(e,"disabled")?-1:n.tabindex,role:"button","aria-disabled":o.getTabProp(e,"disabled"),"aria-expanded":o.isTabActive(t),"aria-controls":o.getTabContentId(t),onClick:n=>o.onTabClick(n,e,t),onKeydown:n=>o.onTabKeyDown(n,e,t)},{...o.getTabProp(e,"headeractionprops"),...o.getTabPT(e,"headeraction")}),[e.children&&e.children.headericon?(r(),p(b(e.children.headericon),{key:0,isTabActive:o.isTabActive(t),index:t},null,8,["isTabActive","index"])):o.isTabActive(t)?(r(),p(b(n.collapseIcon?"span":"ChevronDownIcon"),s({key:1,class:["p-accordion-toggle-icon",n.collapseIcon],"aria-hidden":"true"},o.getTabPT(e,"headericon")),null,16,["class"])):(r(),p(b(n.expandIcon?"span":"ChevronRightIcon"),s({key:2,class:["p-accordion-toggle-icon",n.expandIcon],"aria-hidden":"true"},o.getTabPT(e,"headericon")),null,16,["class"])),e.props&&e.props.header?(r(),d("span",s({key:3,class:"p-accordion-header-text"},o.getTabPT(e,"headertitle")),u(e.props.header),17)):T("",!0),e.children&&e.children.header?(r(),p(b(e.children.header),{key:4})):T("",!0)],16,I)],16),g(v,{name:"p-toggleable-content"},{default:m((()=>[!n.lazy||o.isTabActive(t)?f((r(),d("div",s({key:0,id:o.getTabContentId(t),style:o.getTabProp(e,"contentStyle"),class:o.getTabContentClass(e),role:"region","aria-labelledby":o.getTabHeaderActionId(t)},{...o.getTabProp(e,"contentProps"),...o.getTabPT(e,"toggleablecontent")}),[h("div",s({class:"p-accordion-content"},o.getTabPT(e,"content")),[(r(),p(b(e)))],16)],16,C)),[[x,!!n.lazy||o.isTabActive(t)]]):T("",!0)])),_:2},1024)],16,A)))),128))],16)};export{y as default};

package/accordion/accordion.js

@@ -1,13 +1,17 @@
 this.primevue = this.primevue || {};
-this.primevue.accordion = (function (Ripple, utils, vue) {
+this.primevue.accordion = (function (BaseComponent, ChevronDownIcon, ChevronRightIcon, Ripple, utils, vue) {
     'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+    var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
+    var ChevronDownIcon__default = /*#__PURE__*/_interopDefaultLegacy(ChevronDownIcon);
+    var ChevronRightIcon__default = /*#__PURE__*/_interopDefaultLegacy(ChevronRightIcon);
     var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
 
     var script = {
         name: 'Accordion',
+        extends: BaseComponent__default["default"],
         emits: ['update:activeIndex', 'tab-open', 'tab-close', 'tab-click'],
         props: {
             multiple: {
@@ -24,11 +28,11 @@ this.primevue.accordion = (function (Ripple, utils, vue) {
             },
             expandIcon: {
                 type: String,
-                default: 'pi pi-chevron-right'
+                default: undefined
             },
             collapseIcon: {
                 type: String,
-                default: 'pi pi-chevron-down'
+                default: undefined
             },
             tabindex: {
                 type: Number,
@@ -75,6 +79,15 @@ this.primevue.accordion = (function (Ripple, utils, vue) {
             getTabContentId(index) {
                 return `${this.id}_${index}_content`;
             },
+            getTabPT(tab, key) {
+                return this.ptmo(this.getTabProp(tab, 'pt'), key, {
+                    props: tab.props,
+                    parent: {
+                        props: this.$props,
+                        state: this.$data
+                    }
+                });
+            },
             onTabClick(event, tab, index) {
                 this.changeActiveIndex(event, tab, index);
                 this.$emit('tab-click', { originalEvent: event, index });
@@ -200,9 +213,6 @@ this.primevue.accordion = (function (Ripple, utils, vue) {
                     }
                 ];
             },
-            getTabHeaderIconClass(i) {
-                return ['p-accordion-toggle-icon', this.isTabActive(i) ? this.collapseIcon : this.expandIcon];
-            },
             getTabContentClass(tab) {
                 return ['p-toggleable-content', this.getTabProp(tab, 'contentClass')];
             }
@@ -224,33 +234,31 @@ this.primevue.accordion = (function (Ripple, utils, vue) {
                 }, []);
             }
         },
+        components: {
+            ChevronDownIcon: ChevronDownIcon__default["default"],
+            ChevronRightIcon: ChevronRightIcon__default["default"]
+        },
         directives: {
             ripple: Ripple__default["default"]
         }
     };
 
-    const _hoisted_1 = { class: "p-accordion p-component" };
-    const _hoisted_2 = ["data-index"];
-    const _hoisted_3 = ["id", "tabindex", "aria-disabled", "aria-expanded", "aria-controls", "onClick", "onKeydown"];
-    const _hoisted_4 = {
-      key: 0,
-      class: "p-accordion-header-text"
-    };
-    const _hoisted_5 = ["id", "aria-labelledby"];
-    const _hoisted_6 = { class: "p-accordion-content" };
+    const _hoisted_1 = ["data-index"];
+    const _hoisted_2 = ["id", "tabindex", "aria-disabled", "aria-expanded", "aria-controls", "onClick", "onKeydown"];
+    const _hoisted_3 = ["id", "aria-labelledby"];
 
     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-accordion p-component" }, _ctx.ptm('root')), [
         (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.tabs, (tab, i) => {
-          return (vue.openBlock(), vue.createElementBlock("div", {
+          return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
             key: $options.getKey(tab, i),
-            class: vue.normalizeClass($options.getTabClass(i)),
+            class: $options.getTabClass(i),
             "data-index": i
-          }, [
+          }, $options.getTabPT(tab, 'root')), [
             vue.createElementVNode("div", vue.mergeProps({
               style: $options.getTabProp(tab, 'headerStyle'),
               class: $options.getTabHeaderClass(tab, i)
-            }, $options.getTabProp(tab, 'headerProps')), [
+            }, { ...$options.getTabProp(tab, 'headerProps'), ...$options.getTabPT(tab, 'header') }), [
               vue.createElementVNode("a", vue.mergeProps({
                 id: $options.getTabHeaderActionId(i),
                 class: "p-accordion-header-link p-accordion-header-action",
@@ -261,18 +269,34 @@ this.primevue.accordion = (function (Ripple, utils, vue) {
                 "aria-controls": $options.getTabContentId(i),
                 onClick: $event => ($options.onTabClick($event, tab, i)),
                 onKeydown: $event => ($options.onTabKeyDown($event, tab, i))
-              }, $options.getTabProp(tab, 'headerActionProps')), [
-                vue.createElementVNode("span", {
-                  class: vue.normalizeClass($options.getTabHeaderIconClass(i)),
-                  "aria-hidden": "true"
-                }, null, 2),
+              }, { ...$options.getTabProp(tab, 'headeractionprops'), ...$options.getTabPT(tab, 'headeraction') }), [
+                (tab.children && tab.children.headericon)
+                  ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tab.children.headericon), {
+                      key: 0,
+                      isTabActive: $options.isTabActive(i),
+                      index: i
+                    }, null, 8, ["isTabActive", "index"]))
+                  : ($options.isTabActive(i))
+                    ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.collapseIcon ? 'span' : 'ChevronDownIcon'), vue.mergeProps({
+                        key: 1,
+                        class: ['p-accordion-toggle-icon', $props.collapseIcon],
+                        "aria-hidden": "true"
+                      }, $options.getTabPT(tab, 'headericon')), null, 16, ["class"]))
+                    : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.expandIcon ? 'span' : 'ChevronRightIcon'), vue.mergeProps({
+                        key: 2,
+                        class: ['p-accordion-toggle-icon', $props.expandIcon],
+                        "aria-hidden": "true"
+                      }, $options.getTabPT(tab, 'headericon')), null, 16, ["class"])),
                 (tab.props && tab.props.header)
-                  ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4, vue.toDisplayString(tab.props.header), 1))
+                  ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+                      key: 3,
+                      class: "p-accordion-header-text"
+                    }, $options.getTabPT(tab, 'headertitle')), vue.toDisplayString(tab.props.header), 17))
                   : vue.createCommentVNode("", true),
                 (tab.children && tab.children.header)
-                  ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tab.children.header), { key: 1 }))
+                  ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tab.children.header), { key: 4 }))
                   : vue.createCommentVNode("", true)
-              ], 16, _hoisted_3)
+              ], 16, _hoisted_2)
             ], 16),
             vue.createVNode(vue.Transition, { name: "p-toggleable-content" }, {
               default: vue.withCtx(() => [
@@ -284,20 +308,20 @@ this.primevue.accordion = (function (Ripple, utils, vue) {
                       class: $options.getTabContentClass(tab),
                       role: "region",
                       "aria-labelledby": $options.getTabHeaderActionId(i)
-                    }, $options.getTabProp(tab, 'contentProps')), [
-                      vue.createElementVNode("div", _hoisted_6, [
+                    }, { ...$options.getTabProp(tab, 'contentProps'), ...$options.getTabPT(tab, 'toggleablecontent') }), [
+                      vue.createElementVNode("div", vue.mergeProps({ class: "p-accordion-content" }, $options.getTabPT(tab, 'content')), [
                         (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tab)))
-                      ])
-                    ], 16, _hoisted_5)), [
+                      ], 16)
+                    ], 16, _hoisted_3)), [
                       [vue.vShow, $props.lazy ? true : $options.isTabActive(i)]
                     ])
                   : vue.createCommentVNode("", true)
               ]),
               _: 2
             }, 1024)
-          ], 10, _hoisted_2))
+          ], 16, _hoisted_1))
         }), 128))
-      ]))
+      ], 16))
     }
 
     function styleInject(css, ref) {
@@ -334,4 +358,4 @@ this.primevue.accordion = (function (Ripple, utils, vue) {
 
     return script;
 
-})(primevue.ripple, primevue.utils, Vue);
+})(primevue.basecomponent, primevue.icons.chevrondown, primevue.icons.chevronright, primevue.ripple, primevue.utils, Vue);

package/accordion/accordion.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.accordion=function(e,t,n){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i={name:"Accordion",emits:["update:activeIndex","tab-open","tab-close","tab-click"],props:{multiple:{type:Boolean,default:!1},activeIndex:{type:[Number,Array],default:null},lazy:{type:Boolean,default:!1},expandIcon:{type:String,default:"pi pi-chevron-right"},collapseIcon:{type:String,default:"pi pi-chevron-down"},tabindex:{type:Number,default:0},selectOnFocus:{type:Boolean,default:!1}},data(){return{id:this.$attrs.id,d_activeIndex:this.activeIndex}},watch:{"$attrs.id":function(e){this.id=e||t.UniqueComponentId()},activeIndex(e){this.d_activeIndex=e}},mounted(){this.id=this.id||t.UniqueComponentId()},methods:{isAccordionTab:e=>"AccordionTab"===e.type.name,isTabActive(e){return this.multiple?this.d_activeIndex&&this.d_activeIndex.includes(e):this.d_activeIndex===e},getTabProp:(e,t)=>e.props?e.props[t]:void 0,getKey(e,t){return this.getTabProp(e,"header")||t},getTabHeaderActionId(e){return`${this.id}_${e}_header_action`},getTabContentId(e){return`${this.id}_${e}_content`},onTabClick(e,t,n){this.changeActiveIndex(e,t,n),this.$emit("tab-click",{originalEvent:e,index:n})},onTabKeyDown(e,t,n){switch(e.code){case"ArrowDown":this.onTabArrowDownKey(e);break;case"ArrowUp":this.onTabArrowUpKey(e);break;case"Home":this.onTabHomeKey(e);break;case"End":this.onTabEndKey(e);break;case"Enter":case"Space":this.onTabEnterKey(e,t,n)}},onTabArrowDownKey(e){const t=this.findNextHeaderAction(e.target.parentElement.parentElement);t?this.changeFocusedTab(e,t):this.onTabHomeKey(e),e.preventDefault()},onTabArrowUpKey(e){const t=this.findPrevHeaderAction(e.target.parentElement.parentElement);t?this.changeFocusedTab(e,t):this.onTabEndKey(e),e.preventDefault()},onTabHomeKey(e){const t=this.findFirstHeaderAction();this.changeFocusedTab(e,t),e.preventDefault()},onTabEndKey(e){const t=this.findLastHeaderAction();this.changeFocusedTab(e,t),e.preventDefault()},onTabEnterKey(e,t,n){this.changeActiveIndex(e,t,n),e.preventDefault()},findNextHeaderAction(e,n=!1){const a=n?e:e.nextElementSibling,i=t.DomHandler.findSingle(a,".p-accordion-header");return i?t.DomHandler.hasClass(i,"p-disabled")?this.findNextHeaderAction(i.parentElement):t.DomHandler.findSingle(i,".p-accordion-header-action"):null},findPrevHeaderAction(e,n=!1){const a=n?e:e.previousElementSibling,i=t.DomHandler.findSingle(a,".p-accordion-header");return i?t.DomHandler.hasClass(i,"p-disabled")?this.findPrevHeaderAction(i.parentElement):t.DomHandler.findSingle(i,".p-accordion-header-action"):null},findFirstHeaderAction(){return this.findNextHeaderAction(this.$el.firstElementChild,!0)},findLastHeaderAction(){return this.findPrevHeaderAction(this.$el.lastElementChild,!0)},changeActiveIndex(e,t,n){if(!this.getTabProp(t,"disabled")){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})}},changeFocusedTab(e,n){if(n&&(t.DomHandler.focus(n),this.selectOnFocus)){const t=parseInt(n.parentElement.parentElement.dataset.index,10),a=this.tabs[t];this.changeActiveIndex(e,a,t)}},getTabClass(e){return["p-accordion-tab",{"p-accordion-tab-active":this.isTabActive(e)}]},getTabHeaderClass(e,t){return["p-accordion-header",this.getTabProp(e,"headerClass"),{"p-highlight":this.isTabActive(t),"p-disabled":this.getTabProp(e,"disabled")}]},getTabHeaderIconClass(e){return["p-accordion-toggle-icon",this.isTabActive(e)?this.collapseIcon:this.expandIcon]},getTabContentClass(e){return["p-toggleable-content",this.getTabProp(e,"contentClass")]}},computed:{tabs(){return this.$slots.default().reduce(((e,t)=>(this.isAccordionTab(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isAccordionTab(t)&&e.push(t)})),e)),[])}},directives:{ripple:a(e).default}};const o={class:"p-accordion p-component"},r=["data-index"],d=["id","tabindex","aria-disabled","aria-expanded","aria-controls","onClick","onKeydown"],c={key:0,class:"p-accordion-header-text"},s=["id","aria-labelledby"],l={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-action {\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    user-select: none;\n    position: relative;\n    text-decoration: none;\n}\n.p-accordion-header-action:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),i.render=function(e,t,a,i,p,h){return n.openBlock(),n.createElementBlock("div",o,[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(h.tabs,((e,t)=>(n.openBlock(),n.createElementBlock("div",{key:h.getKey(e,t),class:n.normalizeClass(h.getTabClass(t)),"data-index":t},[n.createElementVNode("div",n.mergeProps({style:h.getTabProp(e,"headerStyle"),class:h.getTabHeaderClass(e,t)},h.getTabProp(e,"headerProps")),[n.createElementVNode("a",n.mergeProps({id:h.getTabHeaderActionId(t),class:"p-accordion-header-link p-accordion-header-action",tabindex:h.getTabProp(e,"disabled")?-1:a.tabindex,role:"button","aria-disabled":h.getTabProp(e,"disabled"),"aria-expanded":h.isTabActive(t),"aria-controls":h.getTabContentId(t),onClick:n=>h.onTabClick(n,e,t),onKeydown:n=>h.onTabKeyDown(n,e,t)},h.getTabProp(e,"headerActionProps")),[n.createElementVNode("span",{class:n.normalizeClass(h.getTabHeaderIconClass(t)),"aria-hidden":"true"},null,2),e.props&&e.props.header?(n.openBlock(),n.createElementBlock("span",c,n.toDisplayString(e.props.header),1)):n.createCommentVNode("",!0),e.children&&e.children.header?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(e.children.header),{key:1})):n.createCommentVNode("",!0)],16,d)],16),n.createVNode(n.Transition,{name:"p-toggleable-content"},{default:n.withCtx((()=>[!a.lazy||h.isTabActive(t)?n.withDirectives((n.openBlock(),n.createElementBlock("div",n.mergeProps({key:0,id:h.getTabContentId(t),style:h.getTabProp(e,"contentStyle"),class:h.getTabContentClass(e),role:"region","aria-labelledby":h.getTabHeaderActionId(t)},h.getTabProp(e,"contentProps")),[n.createElementVNode("div",l,[(n.openBlock(),n.createBlock(n.resolveDynamicComponent(e)))])],16,s)),[[n.vShow,!!a.lazy||h.isTabActive(t)]]):n.createCommentVNode("",!0)])),_:2},1024)],10,r)))),128))])},i}(primevue.ripple,primevue.utils,Vue);
+this.primevue=this.primevue||{},this.primevue.accordion=function(e,t,n,a,i,o){"use strict";function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=r(e),d=r(t),s=r(n),l=r(a),p={name:"Accordion",extends:c.default,emits:["update:activeIndex","tab-open","tab-close","tab-click"],props:{multiple:{type:Boolean,default:!1},activeIndex:{type:[Number,Array],default:null},lazy:{type:Boolean,default:!1},expandIcon:{type:String,default:void 0},collapseIcon:{type:String,default:void 0},tabindex:{type:Number,default:0},selectOnFocus:{type:Boolean,default:!1}},data(){return{id:this.$attrs.id,d_activeIndex:this.activeIndex}},watch:{"$attrs.id":function(e){this.id=e||i.UniqueComponentId()},activeIndex(e){this.d_activeIndex=e}},mounted(){this.id=this.id||i.UniqueComponentId()},methods:{isAccordionTab:e=>"AccordionTab"===e.type.name,isTabActive(e){return this.multiple?this.d_activeIndex&&this.d_activeIndex.includes(e):this.d_activeIndex===e},getTabProp:(e,t)=>e.props?e.props[t]:void 0,getKey(e,t){return this.getTabProp(e,"header")||t},getTabHeaderActionId(e){return`${this.id}_${e}_header_action`},getTabContentId(e){return`${this.id}_${e}_content`},getTabPT(e,t){return this.ptmo(this.getTabProp(e,"pt"),t,{props:e.props,parent:{props:this.$props,state:this.$data}})},onTabClick(e,t,n){this.changeActiveIndex(e,t,n),this.$emit("tab-click",{originalEvent:e,index:n})},onTabKeyDown(e,t,n){switch(e.code){case"ArrowDown":this.onTabArrowDownKey(e);break;case"ArrowUp":this.onTabArrowUpKey(e);break;case"Home":this.onTabHomeKey(e);break;case"End":this.onTabEndKey(e);break;case"Enter":case"Space":this.onTabEnterKey(e,t,n)}},onTabArrowDownKey(e){const t=this.findNextHeaderAction(e.target.parentElement.parentElement);t?this.changeFocusedTab(e,t):this.onTabHomeKey(e),e.preventDefault()},onTabArrowUpKey(e){const t=this.findPrevHeaderAction(e.target.parentElement.parentElement);t?this.changeFocusedTab(e,t):this.onTabEndKey(e),e.preventDefault()},onTabHomeKey(e){const t=this.findFirstHeaderAction();this.changeFocusedTab(e,t),e.preventDefault()},onTabEndKey(e){const t=this.findLastHeaderAction();this.changeFocusedTab(e,t),e.preventDefault()},onTabEnterKey(e,t,n){this.changeActiveIndex(e,t,n),e.preventDefault()},findNextHeaderAction(e,t=!1){const n=t?e:e.nextElementSibling,a=i.DomHandler.findSingle(n,".p-accordion-header");return a?i.DomHandler.hasClass(a,"p-disabled")?this.findNextHeaderAction(a.parentElement):i.DomHandler.findSingle(a,".p-accordion-header-action"):null},findPrevHeaderAction(e,t=!1){const n=t?e:e.previousElementSibling,a=i.DomHandler.findSingle(n,".p-accordion-header");return a?i.DomHandler.hasClass(a,"p-disabled")?this.findPrevHeaderAction(a.parentElement):i.DomHandler.findSingle(a,".p-accordion-header-action"):null},findFirstHeaderAction(){return this.findNextHeaderAction(this.$el.firstElementChild,!0)},findLastHeaderAction(){return this.findPrevHeaderAction(this.$el.lastElementChild,!0)},changeActiveIndex(e,t,n){if(!this.getTabProp(t,"disabled")){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})}},changeFocusedTab(e,t){if(t&&(i.DomHandler.focus(t),this.selectOnFocus)){const n=parseInt(t.parentElement.parentElement.dataset.index,10),a=this.tabs[n];this.changeActiveIndex(e,a,n)}},getTabClass(e){return["p-accordion-tab",{"p-accordion-tab-active":this.isTabActive(e)}]},getTabHeaderClass(e,t){return["p-accordion-header",this.getTabProp(e,"headerClass"),{"p-highlight":this.isTabActive(t),"p-disabled":this.getTabProp(e,"disabled")}]},getTabContentClass(e){return["p-toggleable-content",this.getTabProp(e,"contentClass")]}},computed:{tabs(){return this.$slots.default().reduce(((e,t)=>(this.isAccordionTab(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isAccordionTab(t)&&e.push(t)})),e)),[])}},components:{ChevronDownIcon:d.default,ChevronRightIcon:s.default},directives:{ripple:l.default}};const h=["data-index"],b=["id","tabindex","aria-disabled","aria-expanded","aria-controls","onClick","onKeydown"],u=["id","aria-labelledby"];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-action {\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    user-select: none;\n    position: relative;\n    text-decoration: none;\n}\n.p-accordion-header-action:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),p.render=function(e,t,n,a,i,r){return o.openBlock(),o.createElementBlock("div",o.mergeProps({class:"p-accordion p-component"},e.ptm("root")),[(o.openBlock(!0),o.createElementBlock(o.Fragment,null,o.renderList(r.tabs,((e,t)=>(o.openBlock(),o.createElementBlock("div",o.mergeProps({key:r.getKey(e,t),class:r.getTabClass(t),"data-index":t},r.getTabPT(e,"root")),[o.createElementVNode("div",o.mergeProps({style:r.getTabProp(e,"headerStyle"),class:r.getTabHeaderClass(e,t)},{...r.getTabProp(e,"headerProps"),...r.getTabPT(e,"header")}),[o.createElementVNode("a",o.mergeProps({id:r.getTabHeaderActionId(t),class:"p-accordion-header-link p-accordion-header-action",tabindex:r.getTabProp(e,"disabled")?-1:n.tabindex,role:"button","aria-disabled":r.getTabProp(e,"disabled"),"aria-expanded":r.isTabActive(t),"aria-controls":r.getTabContentId(t),onClick:n=>r.onTabClick(n,e,t),onKeydown:n=>r.onTabKeyDown(n,e,t)},{...r.getTabProp(e,"headeractionprops"),...r.getTabPT(e,"headeraction")}),[e.children&&e.children.headericon?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e.children.headericon),{key:0,isTabActive:r.isTabActive(t),index:t},null,8,["isTabActive","index"])):r.isTabActive(t)?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(n.collapseIcon?"span":"ChevronDownIcon"),o.mergeProps({key:1,class:["p-accordion-toggle-icon",n.collapseIcon],"aria-hidden":"true"},r.getTabPT(e,"headericon")),null,16,["class"])):(o.openBlock(),o.createBlock(o.resolveDynamicComponent(n.expandIcon?"span":"ChevronRightIcon"),o.mergeProps({key:2,class:["p-accordion-toggle-icon",n.expandIcon],"aria-hidden":"true"},r.getTabPT(e,"headericon")),null,16,["class"])),e.props&&e.props.header?(o.openBlock(),o.createElementBlock("span",o.mergeProps({key:3,class:"p-accordion-header-text"},r.getTabPT(e,"headertitle")),o.toDisplayString(e.props.header),17)):o.createCommentVNode("",!0),e.children&&e.children.header?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e.children.header),{key:4})):o.createCommentVNode("",!0)],16,b)],16),o.createVNode(o.Transition,{name:"p-toggleable-content"},{default:o.withCtx((()=>[!n.lazy||r.isTabActive(t)?o.withDirectives((o.openBlock(),o.createElementBlock("div",o.mergeProps({key:0,id:r.getTabContentId(t),style:r.getTabProp(e,"contentStyle"),class:r.getTabContentClass(e),role:"region","aria-labelledby":r.getTabHeaderActionId(t)},{...r.getTabProp(e,"contentProps"),...r.getTabPT(e,"toggleablecontent")}),[o.createElementVNode("div",o.mergeProps({class:"p-accordion-content"},r.getTabPT(e,"content")),[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e)))],16)],16,u)),[[o.vShow,!!n.lazy||r.isTabActive(t)]]):o.createCommentVNode("",!0)])),_:2},1024)],16,h)))),128))],16)},p}(primevue.basecomponent,primevue.icons.chevrondown,primevue.icons.chevronright,primevue.ripple,primevue.utils,Vue);

package/accordiontab/AccordionTab.d.ts

@@ -8,8 +8,61 @@
  *
  */
 import { AnchorHTMLAttributes, HTMLAttributes, VNode } from 'vue';
+import { AccordionPassThroughOptions } from '../accordion';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
+export declare type AccordionTabPassThroughOptionType = AccordionTabPassThroughAttributes | ((options: AccordionTabPassThroughMethodOptions) => AccordionTabPassThroughAttributes) | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface AccordionTabPassThroughMethodOptions {
+    props: AccordionTabProps;
+    parent: AccordionPassThroughOptions;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link AccordionTabProps.pt}
+ */
+export interface AccordionTabPassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: AccordionTabPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the header's DOM element.
+     */
+    header?: AccordionTabPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the headeraction's DOM element.
+     */
+    headerAction?: AccordionTabPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the headericon's DOM element.
+     */
+    headerIcon?: AccordionTabPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the headertitle's DOM element.
+     */
+    headerTitle?: AccordionTabPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the toggleablecontent's DOM element.
+     */
+    toggleableContent?: AccordionTabPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the content's DOM element.
+     */
+    content?: AccordionTabPassThroughOptionType;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface AccordionTabPassThroughAttributes {
+    [key: string]: any;
+}
+
 /**
  * Defines valid properties in AccordionTab component.
  */
@@ -28,10 +81,12 @@ export interface AccordionTabProps {
     headerClass?: any;
     /**
      * Uses to pass all properties of the HTMLDivElement to the tab header.
+     * @deprecated since v3.26.0. Use 'pt' property instead.
      */
     headerProps?: HTMLAttributes | undefined;
     /**
      * Uses to pass all properties of the HTMLAnchorElement to the focusable anchor element inside the tab header.
+     * @deprecated since v3.26.0. Use 'pt' property instead.
      */
     headerActionProps?: AnchorHTMLAttributes | undefined;
     /**
@@ -44,6 +99,7 @@ export interface AccordionTabProps {
     contentClass?: any;
     /**
      * Uses to pass all properties of the HTMLDivElement to the tab content.
+     * @deprecated since v3.26.0. Use 'pt' property instead.
      */
     contentProps?: HTMLAttributes | undefined;
     /**
@@ -51,6 +107,11 @@ export interface AccordionTabProps {
      * @defaultValue false
      */
     disabled?: boolean | undefined;
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {AccordionTabPassThroughOptions}
+     */
+    pt?: AccordionTabPassThroughOptions;
 }
 
 /**
@@ -62,9 +123,23 @@ export interface AccordionTabSlots {
      */
     default(): VNode[];
     /**
-     * Custom content for the title section of a panel is defined using the header template.
+     * Custom content for the title section of a AccordionTab is defined using the header template.
      */
     header(): VNode[];
+    /**
+     * Custom icon for the header section of a AccordionTab is defined using the headericon template.
+     * @param {Object} scope - header slot's params.
+     */
+    headericon(scope: {
+        /**
+         * Index of the tab
+         */
+        index: number;
+        /**
+         * Whether the tab is active
+         */
+        isTabActive(i: number): void;
+    }): VNode[];
 }
 
 /**

package/accordiontab/AccordionTab.vue

@@ -3,8 +3,11 @@
 </template>
 
 <script>
+import BaseComponent from 'primevue/basecomponent';
+
 export default {
     name: 'AccordionTab',
+    extends: BaseComponent,
     props: {
         header: null,
         headerStyle: null,

package/accordiontab/accordiontab.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: 'AccordionTab',
+    extends: BaseComponent__default["default"],
     props: {
         header: null,
         headerStyle: null,

package/accordiontab/accordiontab.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("vue"),l={name:"AccordionTab",props:{header:null,headerStyle:null,headerClass:null,headerProps:null,headerActionProps:null,contentStyle:null,contentClass:null,contentProps:null,disabled:Boolean}};l.render=function(l,n,r,o,t,u){return e.renderSlot(l.$slots,"default")},module.exports=l;
+"use strict";var e=require("primevue/basecomponent"),n=require("vue");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r={name:"AccordionTab",extends:l(e).default,props:{header:null,headerStyle:null,headerClass:null,headerProps:null,headerActionProps:null,contentStyle:null,contentClass:null,contentProps:null,disabled:Boolean}};r.render=function(e,l,r,t,o,u){return n.renderSlot(e.$slots,"default")},module.exports=r;

package/accordiontab/accordiontab.esm.js

@@ -1,7 +1,9 @@
+import BaseComponent from 'primevue/basecomponent';
 import { renderSlot } from 'vue';
 
 var script = {
     name: 'AccordionTab',
+    extends: BaseComponent,
     props: {
         header: null,
         headerStyle: null,

package/accordiontab/accordiontab.esm.min.js

@@ -1 +1 @@
-import{renderSlot as e}from"vue";var l={name:"AccordionTab",props:{header:null,headerStyle:null,headerClass:null,headerProps:null,headerActionProps:null,contentStyle:null,contentClass:null,contentProps:null,disabled:Boolean}};l.render=function(l,n,r,o,t,a){return e(l.$slots,"default")};export{l as default};
+import e from"primevue/basecomponent";import{renderSlot as l}from"vue";var n={name:"AccordionTab",extends:e,props:{header:null,headerStyle:null,headerClass:null,headerProps:null,headerActionProps:null,contentStyle:null,contentClass:null,contentProps:null,disabled:Boolean}};n.render=function(e,n,o,r,t,a){return l(e.$slots,"default")};export{n as default};

package/accordiontab/accordiontab.js

@@ -1,9 +1,14 @@
 this.primevue = this.primevue || {};
-this.primevue.accordiontab = (function (vue) {
+this.primevue.accordiontab = (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: 'AccordionTab',
+        extends: BaseComponent__default["default"],
         props: {
             header: null,
             headerStyle: null,
@@ -25,4 +30,4 @@ this.primevue.accordiontab = (function (vue) {
 
     return script;
 
-})(Vue);
+})(primevue.basecomponent, Vue);

package/accordiontab/accordiontab.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.accordiontab=function(e){"use strict";var n={name:"AccordionTab",props:{header:null,headerStyle:null,headerClass:null,headerProps:null,headerActionProps:null,contentStyle:null,contentClass:null,contentProps:null,disabled:Boolean}};return n.render=function(n,l,r,t,o,u){return e.renderSlot(n.$slots,"default")},n}(Vue);
+this.primevue=this.primevue||{},this.primevue.accordiontab=function(e,n){"use strict";function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l={name:"AccordionTab",extends:t(e).default,props:{header:null,headerStyle:null,headerClass:null,headerProps:null,headerActionProps:null,contentStyle:null,contentClass:null,contentProps:null,disabled:Boolean}};return l.render=function(e,t,l,r,u,o){return n.renderSlot(e.$slots,"default")},l}(primevue.basecomponent,Vue);

package/autocomplete/AutoComplete.d.ts

@@ -206,7 +206,7 @@ export interface AutoCompleteProps {
     panelProps?: HTMLAttributes | undefined;
     /**
      * Icon to display in the dropdown.
-     * @defaultValue pi pi-chevron-down
+     * @deprecated since v3.27.0. Use 'dropdownicon' slot.
      */
     dropdownIcon?: string | undefined;
     /**
@@ -215,12 +215,12 @@ export interface AutoCompleteProps {
     dropdownClass?: string | object | undefined;
     /**
      * Icon to display in loading state.
-     * @defaultValue pi pi-spinner pi-spin
+     * @deprecated since v3.27.0. Use 'loadingicon' slot.
      */
     loadingIcon?: string | undefined;
     /**
      * Icon to display in chip remove action.
-     * @defaultValue pi pi-times-circle
+     * @deprecated since v3.27.0. Use 'removetokenicon' slot.
      */
     removeTokenIcon?: string | undefined;
     /**
@@ -406,6 +406,18 @@ export interface AutoCompleteSlots {
      * Custom empty template when there is no data to display.
      */
     empty(): VNode[];
+    /**
+     * Custom dropdown icon template.
+     */
+    dropdownicon(): VNode[];
+    /**
+     * Custom remove token icon template in multiple mode.
+     */
+    removetokenicon(): VNode[];
+    /**
+     * Custom loading icon template.
+     */
+    loadingicon(): VNode[];
 }
 
 /**

package/autocomplete/AutoComplete.vue

@@ -53,7 +53,9 @@
                 <slot name="chip" :value="option">
                     <span class="p-autocomplete-token-label">{{ getOptionLabel(option) }}</span>
                 </slot>
-                <span :class="['p-autocomplete-token-icon', removeTokenIcon]" @click="removeOption($event, i)" aria-hidden="true"></span>
+                <slot name="removetokenicon">
+                    <component :is="removeTokenIcon ? 'span' : 'TimesCircleIcon'" :class="['p-autocomplete-token-icon', removeTokenIcon]" @click="removeOption($event, i)" aria-hidden="true" />
+                </slot>
             </li>
             <li class="p-autocomplete-input-token" role="option">
                 <input
@@ -83,8 +85,17 @@
                 />
             </li>
         </ul>
-        <i v-if="searching" :class="loadingIconClass" aria-hidden="true"></i>
-        <Button v-if="dropdown" ref="dropdownButton" type="button" :icon="dropdownIcon" :class="['p-autocomplete-dropdown', dropdownClass]" tabindex="-1" :disabled="disabled" aria-hidden="true" @click="onDropdownClick" />
+        <slot v-if="searching" name="loadingicon">
+            <i v-if="loadingIcon" :class="['p-autocomplete-loader pi-spin', loadingIcon]" aria-hidden="true" />
+            <SpinnerIcon v-else class="p-autocomplete-loader" spin aria-hidden="true" />
+        </slot>
+        <Button v-if="dropdown" ref="dropdownButton" type="button" tabindex="-1" :class="['p-autocomplete-dropdown', dropdownClass]" :disabled="disabled" aria-hidden="true" @click="onDropdownClick">
+            <template #icon>
+                <slot name="dropdownicon">
+                    <component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="dropdownIcon" />
+                </slot>
+            </template>
+        </Button>
         <span role="status" aria-live="polite" class="p-hidden-accessible">
             {{ searchResultMessageText }}
         </span>
@@ -140,6 +151,9 @@
 
 <script>
 import Button from 'primevue/button';
+import ChevronDownIcon from 'primevue/icons/chevrondown';
+import SpinnerIcon from 'primevue/icons/spinner';
+import TimesCircleIcon from 'primevue/icons/timescircle';
 import OverlayEventBus from 'primevue/overlayeventbus';
 import Portal from 'primevue/portal';
 import Ripple from 'primevue/ripple';
@@ -247,7 +261,7 @@ export default {
         },
         dropdownIcon: {
             type: String,
-            default: 'pi pi-chevron-down'
+            default: undefined
         },
         dropdownClass: {
             type: [String, Object],
@@ -255,11 +269,11 @@ export default {
         },
         loadingIcon: {
             type: String,
-            default: 'pi pi-spinner'
+            default: undefined
         },
         removeTokenIcon: {
             type: String,
-            default: 'pi pi-times-circle'
+            default: undefined
         },
         virtualScrollerOptions: {
             type: Object,
@@ -475,6 +489,7 @@ export default {
                     break;
 
                 case 'Enter':
+                case 'NumpadEnter':
                     this.onEnterKey(event);
                     break;
 
@@ -1019,9 +1034,6 @@ export default {
                 }
             ];
         },
-        loadingIconClass() {
-            return ['p-autocomplete-loader pi-spin', this.loadingIcon];
-        },
         visibleOptions() {
             return this.optionGroupLabel ? this.flatOptions(this.suggestions) : this.suggestions || [];
         },
@@ -1078,7 +1090,10 @@ export default {
     components: {
         Button: Button,
         VirtualScroller: VirtualScroller,
-        Portal: Portal
+        Portal: Portal,
+        ChevronDownIcon: ChevronDownIcon,
+        SpinnerIcon: SpinnerIcon,
+        TimesCircleIcon: TimesCircleIcon
     },
     directives: {
         ripple: Ripple