primevue 3.14.0 → 3.15.0

package/tabview/TabView.vue

@@ -0,0 +1,252 @@
+<template>
+    <div :class="contentClasses">
+        <div class="p-tabview-nav-container">
+            <button v-if="scrollable && !backwardIsDisabled" ref="prevBtn" :class="prevButtonClasses" @click="navBackward" type="button" v-ripple>
+				<span class="pi pi-chevron-left"></span>
+			</button>
+            <div ref="content" class="p-tabview-nav-content" @scroll="onScroll">
+                <ul ref="nav" class="p-tabview-nav" role="tablist">
+                    <li role="presentation" v-for="(tab, i) of tabs" :key="getKey(tab,i)" :class="[{'p-highlight': (d_activeIndex === i), 'p-disabled': isTabDisabled(tab)}]">
+                        <a role="tab" class="p-tabview-nav-link" @click="onTabClick($event, i)" @keydown="onTabKeydown($event, i)" :tabindex="isTabDisabled(tab) ? null : '0'" :aria-selected="d_activeIndex === i" v-ripple>
+                            <span class="p-tabview-title" v-if="tab.props && tab.props.header">{{tab.props.header}}</span>
+                            <component :is="tab.children.header" v-if="tab.children && tab.children.header"></component>
+                        </a>
+                    </li>
+                    <li ref="inkbar" class="p-tabview-ink-bar"></li>
+                </ul>
+            </div>
+            <button v-if="scrollable && !forwardIsDisabled" ref="nextBtn" :class="nextButtonClasses" @click="navForward" type="button" v-ripple>
+				<span class="pi pi-chevron-right"></span>
+			</button>
+        </div>
+        <div class="p-tabview-panels">
+            <template v-for="(tab, i) of tabs" :key="getKey(tab,i)">
+                <div  class="p-tabview-panel" role="tabpanel" v-if="lazy ? (d_activeIndex === i) : true" v-show="lazy ? true: (d_activeIndex === i)">
+                    <component :is="tab"></component>
+                </div>
+            </template>
+        </div>
+    </div>
+</template>
+
+<script>
+import {DomHandler} from 'primevue/utils';
+import Ripple from 'primevue/ripple';
+
+export default {
+    name: 'TabView',
+    emits: ['update:activeIndex', 'tab-change', 'tab-click'],
+    props: {
+        activeIndex: {
+            type: Number,
+            default: 0
+        },
+        lazy: {
+            type: Boolean,
+            default: false
+        },
+        scrollable: {
+            type: Boolean,
+            default: false
+        }
+    },
+    data() {
+        return {
+            d_activeIndex: this.activeIndex,
+            backwardIsDisabled: true,
+            forwardIsDisabled: false
+        }
+    },
+    watch: {
+        activeIndex(newValue) {
+            this.d_activeIndex = newValue;
+
+            this.updateScrollBar(newValue);
+        }
+    },
+    updated() {
+        this.updateInkBar();
+    },
+    mounted() {
+        this.updateInkBar();
+    },
+    methods: {
+        onTabClick(event, i) {
+            if (!this.isTabDisabled(this.tabs[i]) && i !== this.d_activeIndex) {
+                this.d_activeIndex = i;
+                this.$emit('update:activeIndex', this.d_activeIndex);
+
+                this.$emit('tab-change', {
+                    originalEvent: event,
+                    index: i
+                });
+
+                this.updateScrollBar(i);
+            }
+
+            this.$emit('tab-click', {
+                originalEvent: event,
+                index: i
+            });
+        },
+        onTabKeydown(event, i) {
+            if (event.which === 13) {
+                this.onTabClick(event, i);
+            }
+        },
+        updateInkBar() {
+            let tabHeader = this.$refs.nav.children[this.d_activeIndex];
+            this.$refs.inkbar.style.width = DomHandler.getWidth(tabHeader) + 'px';
+            this.$refs.inkbar.style.left =  DomHandler.getOffset(tabHeader).left - DomHandler.getOffset(this.$refs.nav).left + 'px';
+        },
+        updateScrollBar(index) {
+            let tabHeader = this.$refs.nav.children[index];
+            tabHeader.scrollIntoView({ block: 'nearest' })
+        },
+        updateButtonState() {
+            const content = this.$refs.content;
+            const { scrollLeft, scrollWidth } = content;
+            const width = DomHandler.getWidth(content);
+
+            this.backwardIsDisabled = scrollLeft === 0;
+            this.forwardIsDisabled = parseInt(scrollLeft) === scrollWidth - width;
+        },
+        getKey(tab, i) {
+            return (tab.props && tab.props.header) ? tab.props.header : i;
+        },
+        isTabDisabled(tab) {
+            return (tab.props && tab.props.disabled);
+        },
+        isTabPanel(child) {
+            return child.type.name === 'TabPanel'
+        },
+        onScroll(event) {
+            this.scrollable && this.updateButtonState();
+
+            event.preventDefault();
+        },
+        getVisibleButtonWidths() {
+            const { prevBtn, nextBtn } = this.$refs;
+
+            return [prevBtn, nextBtn].reduce((acc, el) => el ? acc + DomHandler.getWidth(el) : acc, 0);
+        },
+        navBackward() {
+            const content = this.$refs.content;
+            const width = DomHandler.getWidth(content) - this.getVisibleButtonWidths();
+            const pos = content.scrollLeft - width;
+            content.scrollLeft = pos <= 0 ? 0 : pos;
+        },
+        navForward() {
+            const content = this.$refs.content;
+            const width = DomHandler.getWidth(content) - this.getVisibleButtonWidths();
+            const pos = content.scrollLeft + width;
+            const lastPos = content.scrollWidth - width;
+
+            content.scrollLeft = pos >= lastPos ? lastPos : pos;
+        }
+    },
+    computed: {
+        contentClasses() {
+			return ['p-tabview p-component', {'p-tabview-scrollable': this.scrollable}];
+		},
+        prevButtonClasses() {
+            return ['p-tabview-nav-prev p-tabview-nav-btn p-link']
+        },
+        nextButtonClasses() {
+            return ['p-tabview-nav-next p-tabview-nav-btn p-link']
+        },
+        tabs() {
+            const tabs = []
+            this.$slots.default().forEach(child => {
+                    if (this.isTabPanel(child)) {
+                        tabs.push(child);
+                    }
+                    else if (child.children && child.children instanceof Array) {
+                        child.children.forEach(nestedChild => {
+                            if (this.isTabPanel(nestedChild)) {
+                                tabs.push(nestedChild)
+                            }
+                        });
+                    }
+                }
+            )
+            return tabs;
+        }
+    },
+    directives: {
+        'ripple': Ripple
+    }
+}
+</script>
+
+<style>
+.p-tabview-nav-container {
+    position: relative;
+}
+
+.p-tabview-scrollable .p-tabview-nav-container {
+    overflow: hidden;
+}
+
+.p-tabview-nav-content {
+    overflow-x: auto;
+    overflow-y: hidden;
+    scroll-behavior: smooth;
+    scrollbar-width: none;
+    overscroll-behavior: contain auto;
+}
+
+.p-tabview-nav {
+    display: flex;
+    margin: 0;
+    padding: 0;
+    list-style-type: none;
+    flex: 1 1 auto;
+}
+
+.p-tabview-nav-link {
+    cursor: pointer;
+    user-select: none;
+    display: flex;
+    align-items: center;
+    position: relative;
+    text-decoration: none;
+    overflow: hidden;
+}
+
+.p-tabview-ink-bar {
+    display: none;
+    z-index: 1;
+}
+
+.p-tabview-nav-link:focus {
+    z-index: 1;
+}
+
+.p-tabview-title {
+    line-height: 1;
+    white-space: nowrap;
+}
+
+.p-tabview-nav-btn {
+    position: absolute;
+    top: 0;
+    z-index: 2;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.p-tabview-nav-prev {
+    left: 0;
+}
+
+.p-tabview-nav-next {
+    right: 0;
+}
+
+.p-tabview-nav-content::-webkit-scrollbar {
+    display: none;
+}
+</style>

package/tabview/package.json

@@ -0,0 +1,9 @@
+{
+  "main": "./tabview.cjs.js",
+  "module": "./tabview.esm.js",
+  "unpkg": "./tabview.min.js",
+  "types": "./TabView.d.ts",
+  "browser": {
+    "./sfc": "./TabView.vue"
+  }
+}

package/tabview/tabview.cjs.js

@@ -0,0 +1,300 @@
+'use strict';
+
+var utils = require('primevue/utils');
+var Ripple = require('primevue/ripple');
+var vue = require('vue');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
+
+var script = {
+    name: 'TabView',
+    emits: ['update:activeIndex', 'tab-change', 'tab-click'],
+    props: {
+        activeIndex: {
+            type: Number,
+            default: 0
+        },
+        lazy: {
+            type: Boolean,
+            default: false
+        },
+        scrollable: {
+            type: Boolean,
+            default: false
+        }
+    },
+    data() {
+        return {
+            d_activeIndex: this.activeIndex,
+            backwardIsDisabled: true,
+            forwardIsDisabled: false
+        }
+    },
+    watch: {
+        activeIndex(newValue) {
+            this.d_activeIndex = newValue;
+
+            this.updateScrollBar(newValue);
+        }
+    },
+    updated() {
+        this.updateInkBar();
+    },
+    mounted() {
+        this.updateInkBar();
+    },
+    methods: {
+        onTabClick(event, i) {
+            if (!this.isTabDisabled(this.tabs[i]) && i !== this.d_activeIndex) {
+                this.d_activeIndex = i;
+                this.$emit('update:activeIndex', this.d_activeIndex);
+
+                this.$emit('tab-change', {
+                    originalEvent: event,
+                    index: i
+                });
+
+                this.updateScrollBar(i);
+            }
+
+            this.$emit('tab-click', {
+                originalEvent: event,
+                index: i
+            });
+        },
+        onTabKeydown(event, i) {
+            if (event.which === 13) {
+                this.onTabClick(event, i);
+            }
+        },
+        updateInkBar() {
+            let tabHeader = this.$refs.nav.children[this.d_activeIndex];
+            this.$refs.inkbar.style.width = utils.DomHandler.getWidth(tabHeader) + 'px';
+            this.$refs.inkbar.style.left =  utils.DomHandler.getOffset(tabHeader).left - utils.DomHandler.getOffset(this.$refs.nav).left + 'px';
+        },
+        updateScrollBar(index) {
+            let tabHeader = this.$refs.nav.children[index];
+            tabHeader.scrollIntoView({ block: 'nearest' });
+        },
+        updateButtonState() {
+            const content = this.$refs.content;
+            const { scrollLeft, scrollWidth } = content;
+            const width = utils.DomHandler.getWidth(content);
+
+            this.backwardIsDisabled = scrollLeft === 0;
+            this.forwardIsDisabled = parseInt(scrollLeft) === scrollWidth - width;
+        },
+        getKey(tab, i) {
+            return (tab.props && tab.props.header) ? tab.props.header : i;
+        },
+        isTabDisabled(tab) {
+            return (tab.props && tab.props.disabled);
+        },
+        isTabPanel(child) {
+            return child.type.name === 'TabPanel'
+        },
+        onScroll(event) {
+            this.scrollable && this.updateButtonState();
+
+            event.preventDefault();
+        },
+        getVisibleButtonWidths() {
+            const { prevBtn, nextBtn } = this.$refs;
+
+            return [prevBtn, nextBtn].reduce((acc, el) => el ? acc + utils.DomHandler.getWidth(el) : acc, 0);
+        },
+        navBackward() {
+            const content = this.$refs.content;
+            const width = utils.DomHandler.getWidth(content) - this.getVisibleButtonWidths();
+            const pos = content.scrollLeft - width;
+            content.scrollLeft = pos <= 0 ? 0 : pos;
+        },
+        navForward() {
+            const content = this.$refs.content;
+            const width = utils.DomHandler.getWidth(content) - this.getVisibleButtonWidths();
+            const pos = content.scrollLeft + width;
+            const lastPos = content.scrollWidth - width;
+
+            content.scrollLeft = pos >= lastPos ? lastPos : pos;
+        }
+    },
+    computed: {
+        contentClasses() {
+			return ['p-tabview p-component', {'p-tabview-scrollable': this.scrollable}];
+		},
+        prevButtonClasses() {
+            return ['p-tabview-nav-prev p-tabview-nav-btn p-link']
+        },
+        nextButtonClasses() {
+            return ['p-tabview-nav-next p-tabview-nav-btn p-link']
+        },
+        tabs() {
+            const tabs = [];
+            this.$slots.default().forEach(child => {
+                    if (this.isTabPanel(child)) {
+                        tabs.push(child);
+                    }
+                    else if (child.children && child.children instanceof Array) {
+                        child.children.forEach(nestedChild => {
+                            if (this.isTabPanel(nestedChild)) {
+                                tabs.push(nestedChild);
+                            }
+                        });
+                    }
+                }
+            );
+            return tabs;
+        }
+    },
+    directives: {
+        'ripple': Ripple__default["default"]
+    }
+};
+
+const _hoisted_1 = { class: "p-tabview-nav-container" };
+const _hoisted_2 = /*#__PURE__*/vue.createElementVNode("span", { class: "pi pi-chevron-left" }, null, -1);
+const _hoisted_3 = [
+  _hoisted_2
+];
+const _hoisted_4 = {
+  ref: "nav",
+  class: "p-tabview-nav",
+  role: "tablist"
+};
+const _hoisted_5 = ["onClick", "onKeydown", "tabindex", "aria-selected"];
+const _hoisted_6 = {
+  key: 0,
+  class: "p-tabview-title"
+};
+const _hoisted_7 = {
+  ref: "inkbar",
+  class: "p-tabview-ink-bar"
+};
+const _hoisted_8 = /*#__PURE__*/vue.createElementVNode("span", { class: "pi pi-chevron-right" }, null, -1);
+const _hoisted_9 = [
+  _hoisted_8
+];
+const _hoisted_10 = { class: "p-tabview-panels" };
+const _hoisted_11 = {
+  key: 0,
+  class: "p-tabview-panel",
+  role: "tabpanel"
+};
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _directive_ripple = vue.resolveDirective("ripple");
+
+  return (vue.openBlock(), vue.createElementBlock("div", {
+    class: vue.normalizeClass($options.contentClasses)
+  }, [
+    vue.createElementVNode("div", _hoisted_1, [
+      ($props.scrollable && !$data.backwardIsDisabled)
+        ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", {
+            key: 0,
+            ref: "prevBtn",
+            class: vue.normalizeClass($options.prevButtonClasses),
+            onClick: _cache[0] || (_cache[0] = (...args) => ($options.navBackward && $options.navBackward(...args))),
+            type: "button"
+          }, _hoisted_3, 2)), [
+            [_directive_ripple]
+          ])
+        : vue.createCommentVNode("", true),
+      vue.createElementVNode("div", {
+        ref: "content",
+        class: "p-tabview-nav-content",
+        onScroll: _cache[1] || (_cache[1] = (...args) => ($options.onScroll && $options.onScroll(...args)))
+      }, [
+        vue.createElementVNode("ul", _hoisted_4, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.tabs, (tab, i) => {
+            return (vue.openBlock(), vue.createElementBlock("li", {
+              role: "presentation",
+              key: $options.getKey(tab,i),
+              class: vue.normalizeClass([{'p-highlight': ($data.d_activeIndex === i), 'p-disabled': $options.isTabDisabled(tab)}])
+            }, [
+              vue.withDirectives((vue.openBlock(), vue.createElementBlock("a", {
+                role: "tab",
+                class: "p-tabview-nav-link",
+                onClick: $event => ($options.onTabClick($event, i)),
+                onKeydown: $event => ($options.onTabKeydown($event, i)),
+                tabindex: $options.isTabDisabled(tab) ? null : '0',
+                "aria-selected": $data.d_activeIndex === i
+              }, [
+                (tab.props && tab.props.header)
+                  ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_6, 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, _hoisted_5)), [
+                [_directive_ripple]
+              ])
+            ], 2))
+          }), 128)),
+          vue.createElementVNode("li", _hoisted_7, null, 512)
+        ], 512)
+      ], 544),
+      ($props.scrollable && !$data.forwardIsDisabled)
+        ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", {
+            key: 1,
+            ref: "nextBtn",
+            class: vue.normalizeClass($options.nextButtonClasses),
+            onClick: _cache[2] || (_cache[2] = (...args) => ($options.navForward && $options.navForward(...args))),
+            type: "button"
+          }, _hoisted_9, 2)), [
+            [_directive_ripple]
+          ])
+        : vue.createCommentVNode("", true)
+    ]),
+    vue.createElementVNode("div", _hoisted_10, [
+      (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.tabs, (tab, i) => {
+        return (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
+          key: $options.getKey(tab,i)
+        }, [
+          ($props.lazy ? ($data.d_activeIndex === i) : true)
+            ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_11, [
+                (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tab)))
+              ], 512)), [
+                [vue.vShow, $props.lazy ? true: ($data.d_activeIndex === i)]
+              ])
+            : vue.createCommentVNode("", true)
+        ], 64))
+      }), 128))
+    ])
+  ], 2))
+}
+
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z = "\n.p-tabview-nav-container {\n    position: relative;\n}\n.p-tabview-scrollable .p-tabview-nav-container {\n    overflow: hidden;\n}\n.p-tabview-nav-content {\n    overflow-x: auto;\n    overflow-y: hidden;\n    scroll-behavior: smooth;\n    scrollbar-width: none;\n    -ms-scroll-chaining: contain auto;\n        overscroll-behavior: contain auto;\n}\n.p-tabview-nav {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1 auto;\n            flex: 1 1 auto;\n}\n.p-tabview-nav-link {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\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    position: relative;\n    text-decoration: none;\n    overflow: hidden;\n}\n.p-tabview-ink-bar {\n    display: none;\n    z-index: 1;\n}\n.p-tabview-nav-link:focus {\n    z-index: 1;\n}\n.p-tabview-title {\n    line-height: 1;\n    white-space: nowrap;\n}\n.p-tabview-nav-btn {\n    position: absolute;\n    top: 0;\n    z-index: 2;\n    height: 100%;\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-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-tabview-nav-prev {\n    left: 0;\n}\n.p-tabview-nav-next {\n    right: 0;\n}\n.p-tabview-nav-content::-webkit-scrollbar {\n    display: none;\n}\n";
+styleInject(css_248z);
+
+script.render = render;
+
+module.exports = script;

package/tabview/tabview.cjs.min.js

@@ -0,0 +1 @@
+"use strict";var e=require("primevue/utils"),t=require("primevue/ripple"),n=require("vue");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l={name:"TabView",emits:["update:activeIndex","tab-change","tab-click"],props:{activeIndex:{type:Number,default:0},lazy:{type:Boolean,default:!1},scrollable:{type:Boolean,default:!1}},data(){return{d_activeIndex:this.activeIndex,backwardIsDisabled:!0,forwardIsDisabled:!1}},watch:{activeIndex(e){this.d_activeIndex=e,this.updateScrollBar(e)}},updated(){this.updateInkBar()},mounted(){this.updateInkBar()},methods:{onTabClick(e,t){this.isTabDisabled(this.tabs[t])||t===this.d_activeIndex||(this.d_activeIndex=t,this.$emit("update:activeIndex",this.d_activeIndex),this.$emit("tab-change",{originalEvent:e,index:t}),this.updateScrollBar(t)),this.$emit("tab-click",{originalEvent:e,index:t})},onTabKeydown(e,t){13===e.which&&this.onTabClick(e,t)},updateInkBar(){let t=this.$refs.nav.children[this.d_activeIndex];this.$refs.inkbar.style.width=e.DomHandler.getWidth(t)+"px",this.$refs.inkbar.style.left=e.DomHandler.getOffset(t).left-e.DomHandler.getOffset(this.$refs.nav).left+"px"},updateScrollBar(e){this.$refs.nav.children[e].scrollIntoView({block:"nearest"})},updateButtonState(){const t=this.$refs.content,{scrollLeft:n,scrollWidth:a}=t,l=e.DomHandler.getWidth(t);this.backwardIsDisabled=0===n,this.forwardIsDisabled=parseInt(n)===a-l},getKey:(e,t)=>e.props&&e.props.header?e.props.header:t,isTabDisabled:e=>e.props&&e.props.disabled,isTabPanel:e=>"TabPanel"===e.type.name,onScroll(e){this.scrollable&&this.updateButtonState(),e.preventDefault()},getVisibleButtonWidths(){const{prevBtn:t,nextBtn:n}=this.$refs;return[t,n].reduce(((t,n)=>n?t+e.DomHandler.getWidth(n):t),0)},navBackward(){const t=this.$refs.content,n=e.DomHandler.getWidth(t)-this.getVisibleButtonWidths(),a=t.scrollLeft-n;t.scrollLeft=a<=0?0:a},navForward(){const t=this.$refs.content,n=e.DomHandler.getWidth(t)-this.getVisibleButtonWidths(),a=t.scrollLeft+n,l=t.scrollWidth-n;t.scrollLeft=a>=l?l:a}},computed:{contentClasses(){return["p-tabview p-component",{"p-tabview-scrollable":this.scrollable}]},prevButtonClasses:()=>["p-tabview-nav-prev p-tabview-nav-btn p-link"],nextButtonClasses:()=>["p-tabview-nav-next p-tabview-nav-btn p-link"],tabs(){const e=[];return this.$slots.default().forEach((t=>{this.isTabPanel(t)?e.push(t):t.children&&t.children instanceof Array&&t.children.forEach((t=>{this.isTabPanel(t)&&e.push(t)}))})),e}},directives:{ripple:a(t).default}};const i={class:"p-tabview-nav-container"},o=[n.createElementVNode("span",{class:"pi pi-chevron-left"},null,-1)],s={ref:"nav",class:"p-tabview-nav",role:"tablist"},r=["onClick","onKeydown","tabindex","aria-selected"],c={key:0,class:"p-tabview-title"},d={ref:"inkbar",class:"p-tabview-ink-bar"},p=[n.createElementVNode("span",{class:"pi pi-chevron-right"},null,-1)],b={class:"p-tabview-panels"},v={key:0,class:"p-tabview-panel",role:"tabpanel"};!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var a=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===n&&a.firstChild?a.insertBefore(l,a.firstChild):a.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-tabview-nav-container {\n    position: relative;\n}\n.p-tabview-scrollable .p-tabview-nav-container {\n    overflow: hidden;\n}\n.p-tabview-nav-content {\n    overflow-x: auto;\n    overflow-y: hidden;\n    scroll-behavior: smooth;\n    scrollbar-width: none;\n    -ms-scroll-chaining: contain auto;\n        overscroll-behavior: contain auto;\n}\n.p-tabview-nav {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1 auto;\n            flex: 1 1 auto;\n}\n.p-tabview-nav-link {\n    cursor: pointer;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\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    position: relative;\n    text-decoration: none;\n    overflow: hidden;\n}\n.p-tabview-ink-bar {\n    display: none;\n    z-index: 1;\n}\n.p-tabview-nav-link:focus {\n    z-index: 1;\n}\n.p-tabview-title {\n    line-height: 1;\n    white-space: nowrap;\n}\n.p-tabview-nav-btn {\n    position: absolute;\n    top: 0;\n    z-index: 2;\n    height: 100%;\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-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-tabview-nav-prev {\n    left: 0;\n}\n.p-tabview-nav-next {\n    right: 0;\n}\n.p-tabview-nav-content::-webkit-scrollbar {\n    display: none;\n}\n"),l.render=function(e,t,a,l,h,u){const m=n.resolveDirective("ripple");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(u.contentClasses)},[n.createElementVNode("div",i,[a.scrollable&&!h.backwardIsDisabled?n.withDirectives((n.openBlock(),n.createElementBlock("button",{key:0,ref:"prevBtn",class:n.normalizeClass(u.prevButtonClasses),onClick:t[0]||(t[0]=(...e)=>u.navBackward&&u.navBackward(...e)),type:"button"},o,2)),[[m]]):n.createCommentVNode("",!0),n.createElementVNode("div",{ref:"content",class:"p-tabview-nav-content",onScroll:t[1]||(t[1]=(...e)=>u.onScroll&&u.onScroll(...e))},[n.createElementVNode("ul",s,[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(u.tabs,((e,t)=>(n.openBlock(),n.createElementBlock("li",{role:"presentation",key:u.getKey(e,t),class:n.normalizeClass([{"p-highlight":h.d_activeIndex===t,"p-disabled":u.isTabDisabled(e)}])},[n.withDirectives((n.openBlock(),n.createElementBlock("a",{role:"tab",class:"p-tabview-nav-link",onClick:e=>u.onTabClick(e,t),onKeydown:e=>u.onTabKeydown(e,t),tabindex:u.isTabDisabled(e)?null:"0","aria-selected":h.d_activeIndex===t},[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)],40,r)),[[m]])],2)))),128)),n.createElementVNode("li",d,null,512)],512)],544),a.scrollable&&!h.forwardIsDisabled?n.withDirectives((n.openBlock(),n.createElementBlock("button",{key:1,ref:"nextBtn",class:n.normalizeClass(u.nextButtonClasses),onClick:t[2]||(t[2]=(...e)=>u.navForward&&u.navForward(...e)),type:"button"},p,2)),[[m]]):n.createCommentVNode("",!0)]),n.createElementVNode("div",b,[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(u.tabs,((e,t)=>(n.openBlock(),n.createElementBlock(n.Fragment,{key:u.getKey(e,t)},[a.lazy&&h.d_activeIndex!==t?n.createCommentVNode("",!0):n.withDirectives((n.openBlock(),n.createElementBlock("div",v,[(n.openBlock(),n.createBlock(n.resolveDynamicComponent(e)))],512)),[[n.vShow,!!a.lazy||h.d_activeIndex===t]])],64)))),128))])],2)},module.exports=l;