primevue 3.16.2 → 3.17.0

package/accordion/accordion.esm.js

@@ -1,16 +1,17 @@
-import { UniqueComponentId } from 'primevue/utils';
-import { openBlock, createElementBlock, Fragment, renderList, normalizeClass, createElementVNode, toDisplayString, createCommentVNode, createBlock, resolveDynamicComponent, createVNode, Transition, withCtx, withDirectives, vShow } from 'vue';
+import { DomHandler, UniqueComponentId } from 'primevue/utils';
+import Ripple from 'primevue/ripple';
+import { openBlock, createElementBlock, Fragment, renderList, normalizeClass, createElementVNode, mergeProps, toDisplayString, createCommentVNode, createBlock, resolveDynamicComponent, createVNode, Transition, withCtx, withDirectives, vShow } from 'vue';
 
 var script = {
     name: 'Accordion',
-    emits: ['tab-close', 'tab-open', 'update:activeIndex'],
+    emits: ['update:activeIndex', 'tab-open', 'tab-close', 'tab-click'],
     props: {
         multiple: {
             type: Boolean,
             default: false
         },
         activeIndex: {
-            type: [Number,Array],
+            type: [Number, Array],
             default: null
         },
         lazy: {
@@ -24,12 +25,20 @@ var script = {
         collapseIcon: {
             type: String,
             default: 'pi-chevron-down'
+        },
+        tabindex: {
+            type: Number,
+            default: 0
+        },
+        selectOnFocus: {
+            type: Boolean,
+            default: false
         }
     },
     data() {
         return {
             d_activeIndex: this.activeIndex
-        }
+        };
     },
     watch: {
         activeIndex(newValue) {
@@ -37,155 +46,248 @@ var script = {
         }
     },
     methods: {
-        onTabClick(event, tab, i) {
-            if (!this.isTabDisabled(tab)) {
-                const active = this.isTabActive(i);
+        isAccordionTab(child) {
+            return child.type.name === 'AccordionTab';
+        },
+        isTabActive(index) {
+            return this.multiple ? this.d_activeIndex && this.d_activeIndex.includes(index) : this.d_activeIndex === index;
+        },
+        getTabProp(tab, name) {
+            return tab.props ? tab.props[name] : undefined;
+        },
+        getKey(tab, index) {
+            return this.getTabProp(tab, 'header') || index;
+        },
+        getTabHeaderActionId(index) {
+            return `${this.id}_${index}_header_action`;
+        },
+        getTabContentId(index) {
+            return `${this.id}_${index}_content`;
+        },
+        onTabClick(event, tab, index) {
+            this.changeActiveIndex(event, tab, index);
+            this.$emit('tab-click', { originalEvent: event, index });
+        },
+        onTabKeyDown(event, tab, index) {
+            switch (event.code) {
+                case 'ArrowDown':
+                    this.onTabArrowDownKey(event);
+                    break;
+
+                case 'ArrowUp':
+                    this.onTabArrowUpKey(event);
+                    break;
+
+                case 'Home':
+                    this.onTabHomeKey(event);
+                    break;
+
+                case 'End':
+                    this.onTabEndKey(event);
+                    break;
+
+                case 'Enter':
+                case 'Space':
+                    this.onTabEnterKey(event, tab, index);
+                    break;
+            }
+        },
+        onTabArrowDownKey(event) {
+            const nextHeaderAction = this.findNextHeaderAction(event.target.parentElement.parentElement);
+
+            nextHeaderAction ? this.changeFocusedTab(event, nextHeaderAction) : this.onTabHomeKey(event);
+            event.preventDefault();
+        },
+        onTabArrowUpKey(event) {
+            const prevHeaderAction = this.findPrevHeaderAction(event.target.parentElement.parentElement);
+
+            prevHeaderAction ? this.changeFocusedTab(event, prevHeaderAction) : this.onTabEndKey(event);
+            event.preventDefault();
+        },
+        onTabHomeKey(event) {
+            const firstHeaderAction = this.findFirstHeaderAction();
+
+            this.changeFocusedTab(event, firstHeaderAction);
+            event.preventDefault();
+        },
+        onTabEndKey(event) {
+            const lastHeaderAction = this.findLastHeaderAction();
+
+            this.changeFocusedTab(event, lastHeaderAction);
+            event.preventDefault();
+        },
+        onTabEnterKey(event, tab, index) {
+            this.changeActiveIndex(event, tab, index);
+
+            event.preventDefault();
+        },
+        findNextHeaderAction(tabElement, selfCheck = false) {
+            const nextTabElement = selfCheck ? tabElement : tabElement.nextElementSibling;
+            const headerElement = DomHandler.findSingle(nextTabElement, '.p-accordion-header');
+
+            return headerElement ? (DomHandler.hasClass(headerElement, 'p-disabled') ? this.findNextHeaderAction(headerElement.parentElement) : DomHandler.findSingle(headerElement, '.p-accordion-header-action')) : null;
+        },
+        findPrevHeaderAction(tabElement, selfCheck = false) {
+            const prevTabElement = selfCheck ? tabElement : tabElement.previousElementSibling;
+            const headerElement = DomHandler.findSingle(prevTabElement, '.p-accordion-header');
+
+            return headerElement ? (DomHandler.hasClass(headerElement, 'p-disabled') ? this.findPrevHeaderAction(headerElement.parentElement) : DomHandler.findSingle(headerElement, '.p-accordion-header-action')) : null;
+        },
+        findFirstHeaderAction() {
+            return this.findNextHeaderAction(this.$el.firstElementChild, true);
+        },
+        findLastHeaderAction() {
+            return this.findPrevHeaderAction(this.$el.lastElementChild, true);
+        },
+        changeActiveIndex(event, tab, index) {
+            if (!this.getTabProp(tab, 'disabled')) {
+                const active = this.isTabActive(index);
                 const eventName = active ? 'tab-close' : 'tab-open';
 
                 if (this.multiple) {
                     if (active) {
-                        this.d_activeIndex = this.d_activeIndex.filter(index => index !== i);
-                    }
-                    else {
-                        if (this.d_activeIndex)
-                            this.d_activeIndex.push(i);
-                        else
-                            this.d_activeIndex = [i];
+                        this.d_activeIndex = this.d_activeIndex.filter((i) => i !== index);
+                    } else {
+                        if (this.d_activeIndex) this.d_activeIndex.push(index);
+                        else this.d_activeIndex = [index];
                     }
-                }
-                else {
-                    this.d_activeIndex = this.d_activeIndex === i ? null : i;
+                } else {
+                    this.d_activeIndex = this.d_activeIndex === index ? null : index;
                 }
 
                 this.$emit('update:activeIndex', this.d_activeIndex);
-
-                this.$emit(eventName, {
-                    originalEvent: event,
-                    index: i
-                });
+                this.$emit(eventName, { originalEvent: event, index });
             }
         },
-        onTabKeydown(event, tab, i) {
-            if (event.which === 13) {
-                this.onTabClick(event, tab, i);
+        changeFocusedTab(event, element) {
+            if (element) {
+                DomHandler.focus(element);
+
+                if (this.selectOnFocus) {
+                    const index = parseInt(element.parentElement.parentElement.dataset.index, 10);
+                    const tab = this.tabs[index];
+
+                    this.changeActiveIndex(event, tab, index);
+                }
             }
         },
-        isTabActive(index) {
-            if (this.multiple)
-                return this.d_activeIndex && this.d_activeIndex.includes(index);
-            else
-                return index === this.d_activeIndex;
-        },
-        getKey(tab, i) {
-            return (tab.props && tab.props.header) ? tab.props.header : i;
-        },
-        isTabDisabled(tab) {
-            return tab.props && tab.props.disabled;
-        },
         getTabClass(i) {
-            return ['p-accordion-tab', {'p-accordion-tab-active': this.isTabActive(i)}];
+            return [
+                'p-accordion-tab',
+                {
+                    'p-accordion-tab-active': this.isTabActive(i)
+                }
+            ];
         },
         getTabHeaderClass(tab, i) {
-            return ['p-accordion-header', {'p-highlight': this.isTabActive(i), 'p-disabled': this.isTabDisabled(tab)}];
-        },
-        getTabAriaId(i) {
-            return this.ariaId + '_' + i;
-        },
-        getHeaderCollapseIcon() {
-            return ['p-accordion-toggle-icon pi', this.collapseIcon];
+            return [
+                'p-accordion-header',
+                this.getTabProp(tab, 'headerClass'),
+                {
+                    'p-highlight': this.isTabActive(i),
+                    'p-disabled': this.getTabProp(tab, 'disabled')
+                }
+            ];
         },
-        getHeaderExpandIcon() {
-            return ['p-accordion-toggle-icon pi', this.expandIcon];
+        getTabHeaderIconClass(i) {
+            return ['p-accordion-toggle-icon pi', this.isTabActive(i) ? this.collapseIcon : this.expandIcon];
         },
-        isAccordionTab(child) {
-            return child.type.name === 'AccordionTab';
+        getTabContentClass(tab) {
+            return ['p-toggleable-content', this.getTabProp(tab, 'contentClass')];
         }
     },
     computed: {
         tabs() {
-            const tabs = [];
-            this.$slots.default().forEach(child => {
-                    if (this.isAccordionTab(child)) {
-                        tabs.push(child);
-                    }
-                    else if (child.children && child.children instanceof Array) {
-                        child.children.forEach(nestedChild => {
-                            if (this.isAccordionTab(nestedChild)) {
-                                tabs.push(nestedChild);
-                            }
-                        });
-                    }
+            return this.$slots.default().reduce((tabs, child) => {
+                if (this.isAccordionTab(child)) {
+                    tabs.push(child);
+                } else if (child.children && child.children instanceof Array) {
+                    child.children.forEach((nestedChild) => {
+                        if (this.isAccordionTab(nestedChild)) {
+                            tabs.push(nestedChild);
+                        }
+                    });
                 }
-            );
-            return tabs;
+
+                return tabs;
+            }, []);
         },
-        ariaId() {
-            return UniqueComponentId();
+        id() {
+            return this.$attrs.id || UniqueComponentId();
         }
+    },
+    directives: {
+        ripple: Ripple
     }
 };
 
 const _hoisted_1 = { class: "p-accordion p-component" };
-const _hoisted_2 = ["onClick", "onKeydown", "tabindex", "aria-expanded", "id", "aria-controls"];
-const _hoisted_3 = {
+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_4 = ["id", "aria-labelledby"];
-const _hoisted_5 = { class: "p-accordion-content" };
+const _hoisted_5 = ["id", "aria-labelledby"];
+const _hoisted_6 = { class: "p-accordion-content" };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   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: normalizeClass($options.getTabClass(i))
+        key: $options.getKey(tab, i),
+        class: normalizeClass($options.getTabClass(i)),
+        "data-index": i
       }, [
-        createElementVNode("div", {
-          class: normalizeClass($options.getTabHeaderClass(tab, i))
-        }, [
-          createElementVNode("a", {
-            role: "tab",
-            class: "p-accordion-header-link",
-            onClick: $event => ($options.onTabClick($event, tab, i)),
-            onKeydown: $event => ($options.onTabKeydown($event, tab, i)),
-            tabindex: $options.isTabDisabled(tab) ? null : '0',
+        createElementVNode("div", mergeProps({
+          style: $options.getTabProp(tab, 'headerStyle'),
+          class: $options.getTabHeaderClass(tab, i)
+        }, $options.getTabProp(tab, 'headerProps')), [
+          createElementVNode("a", mergeProps({
+            id: $options.getTabHeaderActionId(i),
+            class: "p-accordion-header-link p-accordion-header-action",
+            tabindex: $options.getTabProp(tab, 'disabled') ? -1 : $props.tabindex,
+            role: "button",
+            "aria-disabled": $options.getTabProp(tab, 'disabled'),
             "aria-expanded": $options.isTabActive(i),
-            id: $options.getTabAriaId(i) + '_header',
-            "aria-controls": $options.getTabAriaId(i) + '_content'
-          }, [
+            "aria-controls": $options.getTabContentId(i),
+            onClick: $event => ($options.onTabClick($event, tab, i)),
+            onKeydown: $event => ($options.onTabKeyDown($event, tab, i))
+          }, $options.getTabProp(tab, 'headerActionProps')), [
             createElementVNode("span", {
-              class: normalizeClass($options.isTabActive(i) ? $options.getHeaderCollapseIcon() : $options.getHeaderExpandIcon())
+              class: normalizeClass($options.getTabHeaderIconClass(i)),
+              "aria-hidden": "true"
             }, null, 2),
             (tab.props && tab.props.header)
-              ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(tab.props.header), 1))
+              ? (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(tab.props.header), 1))
               : createCommentVNode("", true),
             (tab.children && tab.children.header)
               ? (openBlock(), createBlock(resolveDynamicComponent(tab.children.header), { key: 1 }))
               : createCommentVNode("", true)
-          ], 40, _hoisted_2)
-        ], 2),
+          ], 16, _hoisted_3)
+        ], 16),
         createVNode(Transition, { name: "p-toggleable-content" }, {
           default: withCtx(() => [
             ($props.lazy ? $options.isTabActive(i) : true)
-              ? withDirectives((openBlock(), createElementBlock("div", {
+              ? withDirectives((openBlock(), createElementBlock("div", mergeProps({
                   key: 0,
-                  class: "p-toggleable-content",
+                  id: $options.getTabContentId(i),
+                  style: $options.getTabProp(tab, 'contentStyle'),
+                  class: $options.getTabContentClass(tab),
                   role: "region",
-                  id: $options.getTabAriaId(i) + '_content',
-                  "aria-labelledby": $options.getTabAriaId(i) + '_header'
-                }, [
-                  createElementVNode("div", _hoisted_5, [
+                  "aria-labelledby": $options.getTabHeaderActionId(i)
+                }, $options.getTabProp(tab, 'contentProps')), [
+                  createElementVNode("div", _hoisted_6, [
                     (openBlock(), createBlock(resolveDynamicComponent(tab)))
                   ])
-                ], 8, _hoisted_4)), [
-                  [vShow, $props.lazy ? true: $options.isTabActive(i)]
+                ], 16, _hoisted_5)), [
+                  [vShow, $props.lazy ? true : $options.isTabActive(i)]
                 ])
               : createCommentVNode("", true)
           ]),
           _: 2
         }, 1024)
-      ], 2))
+      ], 10, _hoisted_2))
     }), 128))
   ]))
 }
@@ -217,7 +319,7 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = "\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";
+var css_248z = "\n.p-accordion-header-action {\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-action:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n";
 styleInject(css_248z);
 
 script.render = render;

package/accordion/accordion.esm.min.js

@@ -1 +1 @@
-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};
+import{DomHandler as e,UniqueComponentId as t}from"primevue/utils";import n from"primevue/ripple";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 x}from"vue";var f={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-chevron-right"},collapseIcon:{type:String,default:"pi-chevron-down"},tabindex:{type:Number,default:0},selectOnFocus:{type:Boolean,default:!1}},data(){return{d_activeIndex:this.activeIndex}},watch:{activeIndex(e){this.d_activeIndex=e}},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(t,n=!1){const a=n?t:t.nextElementSibling,i=e.findSingle(a,".p-accordion-header");return i?e.hasClass(i,"p-disabled")?this.findNextHeaderAction(i.parentElement):e.findSingle(i,".p-accordion-header-action"):null},findPrevHeaderAction(t,n=!1){const a=n?t:t.previousElementSibling,i=e.findSingle(a,".p-accordion-header");return i?e.hasClass(i,"p-disabled")?this.findPrevHeaderAction(i.parentElement):e.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(t,n){if(n&&(e.focus(n),this.selectOnFocus)){const e=parseInt(n.parentElement.parentElement.dataset.index,10),a=this.tabs[e];this.changeActiveIndex(t,a,e)}},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 pi",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)),[])},id(){return this.$attrs.id||t()}},directives:{ripple:n}};const m={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: -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-action:focus {\n    z-index: 1;\n}\n.p-accordion-header-text {\n    line-height: 1;\n}\n"),f.render=function(e,t,n,f,H,P){return a(),i("div",m,[(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)),[[x,!!n.lazy||P.isTabActive(t)]]):h("",!0)])),_:2},1024)],10,y)))),128))])};export{f as default};