buefy/dist/components/tabs/index.min.js

Lightweight UI components for Vue.js (v3) based on Bulma

/*! Buefy v3.0.7 | MIT License | github.com/buefy/buefy */
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Tabs={},e.Vue)}(this,(function(e,t){"use strict";let i="mdi",n=null,s=!1,o=!0,a=null;function l(e,t){return(e&t)===t}function r(e,t,i){return Math.max(t,Math.min(i,e))}const c={sizes:{default:"mdi-24px","is-small":null,"is-medium":"mdi-36px","is-large":"mdi-48px"},iconPrefix:"mdi-"},u=()=>{const e="fa-";return{sizes:{default:null,"is-small":null,"is-medium":e+"lg","is-large":e+"2x"},iconPrefix:e,internalIcons:{information:"info-circle",alert:"exclamation-triangle","alert-circle":"exclamation-circle","chevron-right":"angle-right","chevron-left":"angle-left","chevron-down":"angle-down","eye-off":"eye-slash","menu-down":"caret-down","menu-up":"caret-up","close-circle":"times-circle"}}},d={checkboxOn:{type:"svg",viewBox:"0 0 1 1",path:"M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z"},checkboxIndeterminate:{type:"svg",viewBox:"0 0 1 1",path:"M 0.15,0.4 L 0.85,0.4 L 0.85,0.6 L 0.15,0.6 Z"},chevronLeft:{type:"svg",path:"M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z"},chevronRight:{type:"svg",path:"M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z"},chevronDown:{type:"svg",path:"M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"},chevronUp:{type:"svg",path:"M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z"},menuDown:{type:"svg",path:"M7,10L12,15L17,10H7Z"},menuUp:{type:"svg",path:"M7,14L12,9L17,14H7Z"},check:{type:"svg",path:"M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"},alertCircle:{type:"svg",path:"M13,13H11V7H13M13,17H11V15H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"},alert:{type:"svg",path:"M13,14H11V10H13M13,18H11V16H13M1,21H23L12,2L1,21Z"},information:{type:"svg",path:"M13,9H11V7H13M13,17H11V11H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"},close:{type:"svg",path:"M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z"},closeCircle:{type:"svg",path:"M12,2C17.53,2 22,6.47 22,12C22,17.53 17.53,22 12,22C6.47,22 2,17.53 2,12C2,6.47 6.47,2 12,2M15.59,7L12,10.59L8.41,7L7,8.41L10.59,12L7,15.59L8.41,17L12,13.41L15.59,17L17,15.59L13.41,12L17,8.41L15.59,7Z"},eye:{type:"svg",path:"M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17M12,4.5C7,4.5 2.73,7.61 1,12C2.73,16.39 7,19.5 12,19.5C17,19.5 21.27,16.39 23,12C21.27,7.61 17,4.5 12,4.5Z"},eyeOff:{type:"svg",path:"M11.83,9L15,12.16C15,12.11 15,12.05 15,12A3,3 0 0,0 12,9C11.94,9 11.89,9 11.83,9M7.53,9.8L9.08,11.35C9.03,11.56 9,11.77 9,12A3,3 0 0,0 12,15C12.22,15 12.44,14.97 12.65,14.92L14.2,16.47C13.53,16.8 12.79,17 12,17A5,5 0 0,1 7,12C7,11.21 7.2,10.47 7.53,9.8M2,4.27L4.28,6.55L4.73,7C3.08,8.3 1.78,10 1,12C2.73,16.39 7,19.5 12,19.5C13.55,19.5 15.03,19.18 16.38,18.6L16.81,19L19.73,22L21,20.73L3.27,3M12,7A5,5 0 0,1 17,12C17,12.64 16.87,13.26 16.64,13.82L19.57,16.75C21.07,15.5 22.27,13.86 23,12C21.27,7.61 17,4.5 12,4.5C10.6,4.5 9.26,4.75 8,5.2L10.17,7.35C10.74,7.13 11.35,7 12,7Z"}};function h(e){return d[e]}var p=t.defineComponent({name:"BIcon",props:{type:[String,Object],component:String,pack:String,icon:{type:String,required:!1,default:void 0},alias:String,size:String,customSize:String,customClass:String,both:Boolean},computed:{resolvedAlias(){var e;return this.alias&&null!=(e=h(this.alias))?e:null},isSvgAlias(){var e;return"svg"===(null==(e=this.resolvedAlias)?void 0:e.type)},isComponentAlias(){var e;return"component"===(null==(e=this.resolvedAlias)?void 0:e.type)},resolvedAliasSvg(){return this.resolvedAlias},resolvedAliasComponent(){return this.resolvedAlias},iconConfig(){return{mdi:c,fa:u(),fas:u(),far:u(),fad:u(),fab:u(),fal:u(),"fa-solid":u(),"fa-regular":u(),"fa-light":u(),"fa-thin":u(),"fa-duotone":u(),"fa-brands":u()}[this.newPack]},iconPrefix(){return this.iconConfig&&this.iconConfig.iconPrefix?this.iconConfig.iconPrefix:""},newIcon(){var e;return`${this.iconPrefix}${this.getEquivalentIconOf(null!=(e=this.icon)?e:"")}`},newPack(){return this.pack||i},newType(){if(!this.type)return;let e=[];if("string"==typeof this.type)e=this.type.split("-");else for(const t in this.type)if(this.type[t]){e=t.split("-");break}if(e.length<=1)return;const[,...t]=e;return`has-text-${t.join("-")}`},newCustomSize(){return this.customSize||this.customSizeByPack},customSizeByPack(){if(this.iconConfig&&this.iconConfig.sizes){if(this.size&&void 0!==this.iconConfig.sizes[this.size])return this.iconConfig.sizes[this.size];if(this.iconConfig.sizes.default)return this.iconConfig.sizes.default}return null},useIconComponent(){return this.component||n}},methods:{getEquivalentIconOf(e){if(!this.both)return e;if(null==this.iconConfig)return e;const t=this.iconConfig;return t&&t.internalIcons&&t.internalIcons[e]?t.internalIcons[e]:e}}}),m=(e,t)=>{const i=e.__vccOpts||e;for(const[e,n]of t)i[e]=n;return i};const f=["viewBox"],v=["d"];var g=m(p,[["render",function(e,i,n,s,o,a){return t.openBlock(),t.createElementBlock("span",{class:t.normalizeClass(["icon",[e.newType,e.size]])},[e.isSvgAlias?(t.openBlock(),t.createElementBlock("svg",{key:0,viewBox:e.resolvedAliasSvg.viewBox||"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",class:t.normalizeClass(e.customClass),"aria-hidden":"true"},[t.createElementVNode("path",{fill:"currentColor",d:e.resolvedAliasSvg.path},null,8,v)],10,f)):e.isComponentAlias?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.resolvedAliasComponent.component),{key:1,icon:e.resolvedAliasComponent.icon,class:t.normalizeClass(e.customClass)},null,8,["icon","class"])):e.useIconComponent?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.useIconComponent),{key:3,icon:[e.newPack,e.newIcon],size:e.newCustomSize,class:t.normalizeClass([e.customClass])},null,8,["icon","size","class"])):(t.openBlock(),t.createElementBlock("i",{key:2,class:t.normalizeClass([e.newPack,e.newIcon,e.newCustomSize,e.customClass])},null,2))],2)}]]),y=t.defineComponent({name:"BSlotComponent",props:{component:{type:Object,required:!0},name:{type:String,default:"default"},scoped:{type:Boolean},props:{type:Object},tag:{type:[String,Object],default:"div"}},methods:{refresh(){this.$forceUpdate()}},render(){return t.h(this.tag,{},this.component.$slots?this.scoped?this.component.$slots[this.name](this.props):this.component.$slots[this.name]():void 0)}}),b=Object.defineProperty,C=Object.getOwnPropertySymbols,L=Object.prototype.hasOwnProperty,x=Object.prototype.propertyIsEnumerable,I=(e,t,i)=>t in e?b(e,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[t]=i;var w,k=(e,t)=>{const i={provide(){return{["b"+e]:this}}};return l(t,1)&&(i.data=function(){return((e,t)=>{for(var i in t||(t={}))L.call(t,i)&&I(e,i,t[i]);if(C)for(var i of C(t))x.call(t,i)&&I(e,i,t[i]);return e})({childItems:[]},l(t,3)?{nextIndex:0}:{})},i.methods={_registerItem(e){l(t,3)&&(e.dynamicIndex=this.nextIndex,++this.nextIndex),this.childItems.push(e)},_unregisterItem(e){this.childItems=this.childItems.filter((t=>t.uniqueValue!==e.uniqueValue))}},l(t,3)&&(i.computed={sortedItems(){return this.childItems.slice().sort(((e,t)=>e.index-t.index))}})),i},B=t.defineComponent({name:"BTabs",components:{BIcon:g,BSlotComponent:y},mixins:[(w="tab",t.defineComponent({components:{BIcon:g,BSlotComponent:y},mixins:[k(w,3)],props:{modelValue:{type:[String,Number,null],default:void 0},size:String,animated:{type:Boolean,default:!0},animation:String,animateInitially:Boolean,vertical:{type:Boolean,default:!1},position:String,destroyOnHide:{type:Boolean,default:!1}},emits:{"update:modelValue":e=>!0},data(){return{activeId:this.modelValue,defaultSlots:[],contentHeight:0,isTransitioning:!1}},computed:{activeItem(){const e=this.childItems;return void 0===this.activeId?this.items[0]:null===this.activeId?null:e.find((e=>e.uniqueValue===this.activeId))},items(){return this.sortedItems}},watch:{modelValue(e){"number"==typeof e?(e=r(e,0,this.items.length-1),this.activeId=this.items[e].uniqueValue):this.activeId=e},activeId(e,t){const i=null!=t?this.childItems.find((e=>e.uniqueValue===t)):null;i&&this.activeItem&&(i.deactivate(this.activeItem.index),this.activeItem.activate(i.index)),(e=this.activeItem?"number"==typeof this.modelValue?this.items.indexOf(this.activeItem):this.activeItem.uniqueValue:void 0)!==this.modelValue&&this.$emit("update:modelValue",e)}},methods:{childClick(e){this.activeId=e.uniqueValue},getNextItemIdx(e,t=!1){let i=null;for(let n=0;n<this.items.length;n++){const s=this.items[n];if(e<s.index&&s.visible&&(!t||t&&!s.disabled)){i=s.index;break}}return i},getPrevItemIdx(e,t=!1){let i=null;for(let n=this.items.length-1;n>=0;n--){const s=this.items[n];if(s.index<e&&s.visible&&(!t||t&&!s.disabled)){i=s.index;break}}return i}},mounted(){if("number"==typeof this.modelValue){const e=r(this.modelValue,0,this.items.length-1);this.activeId=this.items[e].uniqueValue}else this.activeId=this.modelValue}}))],props:{expanded:{type:Boolean,default:()=>s},type:{type:[String,Object],default:()=>a},animated:{type:Boolean,default:()=>o},multiline:Boolean},data:()=>({currentFocus:null}),computed:{mainClasses(){return{"is-fullwidth":this.expanded,"is-vertical":this.vertical,"is-multiline":this.multiline,[this.position]:this.position&&this.vertical}},navClasses(){return[this.type,this.size,{[this.position]:this.position&&!this.vertical,"is-fullwidth":this.expanded,"is-toggle":"is-toggle-rounded"===this.type}]}},methods:{giveFocusToTab(e){Array.isArray(e)&&null==(e=e[0])||(e.$el&&e.$el.focus?e.$el.focus():e.focus&&e.focus())},manageTablistKeydown(e){const{key:t}=e;switch(t){case this.vertical?"ArrowUp":"ArrowLeft":case this.vertical?"Up":"Left":{let t=this.getPrevItemIdx(this.currentFocus,!0);null===t&&(t=this.getPrevItemIdx(1/0,!0));const i=this.items.find((e=>e.index===t));i&&this.$refs[`tabLink${t}`]&&!i.disabled&&this.giveFocusToTab(this.$refs[`tabLink${t}`]),e.preventDefault();break}case this.vertical?"ArrowDown":"ArrowRight":case this.vertical?"Down":"Right":{let t=this.getNextItemIdx(this.currentFocus,!0);null===t&&(t=this.getNextItemIdx(-1,!0));const i=this.items.find((e=>e.index===t));i&&this.$refs[`tabLink${t}`]&&!i.disabled&&this.giveFocusToTab(this.$refs[`tabLink${t}`]),e.preventDefault();break}}},manageTabKeydown(e,t){const{key:i}=e;switch(i){case" ":case"Space":case"Spacebar":case"Enter":this.childClick(t),e.preventDefault()}}}});const A=["aria-orientation"],S=["aria-controls","aria-selected"],z=["id","tabindex","onFocus","onClick","onKeydown"];var V=m(B,[["render",function(e,i,n,s,o,a){const l=t.resolveComponent("b-slot-component"),r=t.resolveComponent("b-icon");return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["b-tabs",e.mainClasses])},[t.createElementVNode("nav",{class:t.normalizeClass(["tabs",e.navClasses]),onKeydown:i[0]||(i[0]=(...t)=>e.manageTablistKeydown&&e.manageTablistKeydown(...t))},[t.renderSlot(e.$slots,"start"),t.createElementVNode("ul",{"aria-orientation":e.vertical?"vertical":"horizontal",role:"tablist"},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.items,(i=>t.withDirectives((t.openBlock(),t.createElementBlock("li",{key:i.uniqueValue,class:t.normalizeClass([i.headerClass,{"is-active":i.isActive,"is-disabled":i.disabled}]),role:"tab","aria-controls":`${i.uniqueValue}-content`,"aria-selected":`${i.isActive}`},[i.$slots.header?(t.openBlock(),t.createBlock(l,{key:0,ref_for:!0,ref:`tabLink${i.index}`,component:i,name:"header",tag:"a",id:`${i.uniqueValue}-label`,tabindex:i.isActive?0:-1,onFocus:t=>e.currentFocus=i.index,onClick:t=>e.childClick(i),onKeydown:t=>e.manageTabKeydown(t,i)},null,8,["component","id","tabindex","onFocus","onClick","onKeydown"])):(t.openBlock(),t.createElementBlock("a",{key:1,ref_for:!0,ref:`tabLink${i.index}`,id:`${i.uniqueValue}-label`,tabindex:i.isActive?0:-1,onFocus:t=>e.currentFocus=i.index,onClick:t=>e.childClick(i),onKeydown:t=>e.manageTabKeydown(t,i)},[i.icon?(t.openBlock(),t.createBlock(r,{key:0,icon:i.icon,pack:i.iconPack,size:e.size},null,8,["icon","pack","size"])):t.createCommentVNode("v-if",!0),t.createElementVNode("span",null,t.toDisplayString(i.label),1)],40,z))],10,S)),[[t.vShow,i.visible]]))),128))],8,A),t.renderSlot(e.$slots,"end")],34),t.createElementVNode("section",{class:t.normalizeClass(["tab-content",{"is-transitioning":e.isTransitioning}])},[t.renderSlot(e.$slots,"default")],2)],2)}]]),$=Object.defineProperty,M=Object.defineProperties,O=Object.getOwnPropertyDescriptors,P=Object.getOwnPropertySymbols,T=Object.prototype.hasOwnProperty,q=Object.prototype.propertyIsEnumerable,E=(e,t,i)=>t in e?$(e,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[t]=i,j=(e,t)=>{for(var i in t||(t={}))T.call(t,i)&&E(e,i,t[i]);if(P)for(var i of P(t))q.call(t,i)&&E(e,i,t[i]);return e},H=(e,t)=>M(e,O(t));var N,Z=(e,t)=>{const i={inject:{parent:{from:"b"+e,default:""}},props:{value:{type:String,default:null}},computed:{uniqueValue(){return null!=this.value?this.value:this.$.uid}},created(){if(this.parent)this.parent._registerItem&&this.parent._registerItem(this);else if(!l(t,2))throw new Error("You should wrap "+this.$options.name+" in a "+e)},beforeUnmount(){this.parent&&this.parent._unregisterItem&&this.parent._unregisterItem(this)}};return l(t,1)&&(i.props=H(j({},i.props),{order:{type:Number,required:!1}}),i.data=()=>({dynamicIndex:void 0}),i.computed=H(j({},i.computed),{index(){return null!=this.order?this.order:this.dynamicIndex}})),i},D=t.defineComponent({name:"BTabItem",mixins:[(N="tab",t.defineComponent({mixins:[Z(N,1)],props:{label:String,icon:String,iconPack:String,visible:{type:Boolean,default:!0},headerClass:{type:[String,Array,Object],default:null}},data:()=>({transitionName:null,elementClass:"item",elementRole:null}),computed:{isActive(){return this.parent.activeItem===this}},methods:{activate(e){this.transitionName=this.index<e?this.parent.vertical?"slide-down":"slide-next":this.parent.vertical?"slide-up":"slide-prev"},deactivate(e){this.transitionName=e<this.index?this.parent.vertical?"slide-down":"slide-next":this.parent.vertical?"slide-up":"slide-prev"}},render(){var e;if(this.parent.destroyOnHide&&(!this.isActive||!this.visible))return;const i=t.withDirectives(t.h("div",{class:this.elementClass,role:this.elementRole,id:`${this.uniqueValue}-content`,"aria-labelledby":this.elementRole?`${this.uniqueValue}-label`:null,tabindex:this.isActive?0:-1},this.$slots),[[t.vShow,this.isActive&&this.visible]]);return this.parent.animated?t.h(t.Transition,{name:null!=(e=this.parent.animation||this.transitionName)?e:void 0,appear:!0===this.parent.animateInitially||void 0,onBeforeEnter:()=>{this.parent.isTransitioning=!0},onAfterEnter:()=>{this.parent.isTransitioning=!1}},{default:()=>i}):i}}))],props:{disabled:Boolean},data:()=>({elementClass:"tab-item",elementRole:"tabpanel"})});const F=(e,t,i)=>{const n=t.name;if(null==n)throw new Error("Buefy.registerComponent: missing component name");e.component(n,t)},_={install(e){F(e,V),F(e,D)}};e.BTabItem=D,e.BTabs=V,e.default=_,Object.defineProperty(e,"__esModule",{value:!0})}));