UNPKG

vue-sidebar-bootstrap

Version:

Create a mobile friendly sidebar layout for Bootstrap Vue.

1 lines 7.93 kB
var VueSidebarBootstrap=function(e){"use strict";function t(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function n(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,i)}return n}function i(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(e)))return;var n=[],i=!0,r=!1,o=void 0;try{for(var s,a=e[Symbol.iterator]();!(i=(s=a.next()).done)&&(n.push(s.value),!t||n.length!==t);i=!0);}catch(e){r=!0,o=e}finally{try{i||null==a.return||a.return()}finally{if(r)throw o}}return n}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return r(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,i=new Array(t);n<t;n++)i[n]=e[n];return i}function o(e,t,n,i,r,o,s,a,l,c){"boolean"!=typeof s&&(l=a,a=s,s=!1);const d="function"==typeof n?n.options:n;let u;if(e&&e.render&&(d.render=e.render,d.staticRenderFns=e.staticRenderFns,d._compiled=!0,r&&(d.functional=!0)),i&&(d._scopeId=i),o?(u=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),t&&t.call(this,l(e)),e&&e._registeredComponents&&e._registeredComponents.add(o)},d._ssrRegister=u):t&&(u=s?function(e){t.call(this,c(e,this.$root.$options.shadowRoot))}:function(e){t.call(this,a(e))}),u)if(d.functional){const e=d.render;d.render=function(t,n){return u.call(n),e(t,n)}}else{const e=d.beforeCreate;d.beforeCreate=e?[].concat(e,u):[u]}return n}var s=o({render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return e.icon&&Object.keys(e.icon).length?n(e.icon.tag?e.icon.tag:"b-icon",e._b({tag:"component",attrs:{icon:e.icon.tag?e.icon.attributes.icon:e.icon}},"component",e.icon.attributes,!1)):e._e()},staticRenderFns:[]},void 0,{name:"VsbSidebarItemIcon",props:{icon:{type:[Object,String],default:function(){}}}},void 0,!1,void 0,!1,void 0,void 0,void 0),a=o({render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("b-list-group-item",{directives:[{name:"b-toggle",rawName:"v-b-toggle",value:e.item.children?"nav-item-"+e.index:null,expression:"item.children ? `nav-item-${index}` : null"}],staticClass:"d-flex justify-content-between align-items-center",attrs:{to:e.item.link,"active-class":"active",exact:"",disabled:e.item.disabled||e.sectionDisabled}},[n("span",[n("vsb-sidebar-item-icon",{staticClass:"mr-3",attrs:{icon:e.item.icon}}),e._v(" "),n("span",{class:{small:e.textSmall}},[e._v(e._s(e.item.text))])],1),e._v(" "),e._t("default")],2)},staticRenderFns:[]},void 0,{name:"SidebarItem",props:{item:{type:Object,default:function(){return{}}},index:{type:Number,default:null},textSmall:{type:Boolean,default:!1},sectionDisabled:{type:Boolean,default:!1}},components:{VsbSidebarItemIcon:s}},void 0,!1,void 0,!1,void 0,void 0,void 0),l=o({render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"align-self-end"},[e._t("toggle-icon",[n("b-icon",{directives:[{name:"b-toggle",rawName:"v-b-toggle.sidebar",modifiers:{sidebar:!0}}],staticClass:"h3 m-2 d-md-none",attrs:{icon:"list"}})]),e._v(" "),n("b-sidebar",e._b({attrs:{id:"sidebar",shadow:e.shadow,"no-close-on-esc":!e.isMobile,"no-close-on-backdrop":!e.isMobile,"no-close-on-route-change":!e.isMobile,"no-header-close":!e.isMobile,backdrop:e.isMobile&&e.backdrop,width:e.isMobile&&e.mobileFullscreen?"100vh":e.width},on:{change:function(t){return e.$emit("change",t)}},scopedSlots:e._u([{key:"title",fn:function(){return[e._t("title",[n("div",{staticClass:"p-2"},[n("h5",[e._v("Sidebar Title")])])])]},proxy:!0},{key:"default",fn:function(){return e._l(e.sections,(function(t){return n("b-list-group",{key:t.name,staticClass:"mb-3",attrs:{flush:""}},[e._t("section-title",[n("h6",{class:["ml-2",{"text-muted":t.disabled}]},[e._v("\n "+e._s(t.name)+"\n ")])]),e._v(" "),e._l(t.children,(function(i,r){return n("div",{key:i.text},[n("vsb-sidebar-item",{attrs:{"section-disabled":t.disabled,item:i,index:r}},[e._t("dropdown-icon",[i.children?n("vsb-sidebar-item-icon",{directives:[{name:"b-toggle",rawName:"v-b-toggle",value:"nav-item-"+r,expression:"`nav-item-${index}`"}],staticStyle:{width:"0.7em"},attrs:{icon:"chevron-right"}}):e._e()],{item:i,index:r})],2),e._v(" "),i.children?n("b-collapse",{staticClass:"pl-3",attrs:{id:"nav-item-"+r}},[n("b-list-group",{attrs:{flush:""}},e._l(i.children,(function(e){return n("vsb-sidebar-item",{key:e.text,attrs:{item:e,"text-small":!0}})})),1)],1):e._e()],1)}))],2)}))},proxy:!0},{key:"footer",fn:function(){return[e._t("footer")]},proxy:!0}],null,!0),model:{value:e.showSidebar,callback:function(t){e.showSidebar=t},expression:"showSidebar"}},"b-sidebar",e.$attrs,!1))],2)},staticRenderFns:[]},void 0,{name:"VsbSidebar",props:{items:{type:Array,default:function(){return[]}},width:{type:String,default:"320px"},mobileFullscreen:{type:Boolean,default:!1}},components:{VsbSidebarItem:a,VsbSidebarItemIcon:s},data:function(){return{showSidebar:!0,isMobile:!1}},mounted:function(){this.onResize(),window.addEventListener("resize",this.onResize)},methods:{onResize:function(){this.isMobile=window.innerWidth<=768}},watch:{isMobile:function(e){this.$emit("is-mobile",e),this.showSidebar=!e}},computed:{sections:function(){var e=[],i={name:null,children:[]};return this.items.forEach((function(r){if(!r.name)return i.children.push(r);i.children.length&&(e.push(function(e){for(var i=1;i<arguments.length;i++){var r=null!=arguments[i]?arguments[i]:{};i%2?n(Object(r),!0).forEach((function(n){t(e,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):n(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({},i)),i.children=[]),e.push(r)})),e}}},void 0,!1,void 0,!1,void 0,void 0,void 0),c=o({render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{style:e.sidebarStyling,attrs:{id:"layout"}},[n("b-navbar",{class:e.navbarClass,attrs:{id:"navbar"}},[n("vsb-sidebar",e._b({on:{change:function(t){return e.sidebarOpen=t},"is-mobile":function(t){return e.isMobile=t}},scopedSlots:e._u([e._l(e.$scopedSlots,(function(t,n){return{key:n,fn:function(t){return[e._t(n,null,null,t)]}}}))],null,!0)},"vsb-sidebar",e.$attrs,!1)),e._v(" "),e._t("navbar-content")],2),e._v(" "),e._t("default",[n("b-container",{staticClass:"py-5"},[n("router-view")],1)])],2)},staticRenderFns:[]},void 0,{name:"VsbLayout",components:{VsbSidebar:l},props:{navbarClass:{type:String,default:null}},data:function(){return{sidebarOpen:!0,isMobile:!1}},computed:{sidebarStyling:function(){if(this.sidebarOpen&&!this.isMobile){var e=this.$attrs.width||"320px";return{"margin-left":e,width:"calc(100vw - ".concat(e,")")}}}}},void 0,!1,void 0,!1,void 0,void 0,void 0),d=Object.freeze({__proto__:null,VsbLayout:c,VsbSidebar:l,VsbSidebarItem:a,VsbSidebarItemIcon:s}),u=function(e){u.installed||(u.installed=!0,Object.entries(d).forEach((function(t){var n=i(t,2),r=n[0],o=n[1];e.component(r,o)})))},b={install:u},f=null;return"undefined"!=typeof window?f=window.Vue:"undefined"!=typeof global&&(f=global.Vue),f&&f.use(b),e.VsbLayout=c,e.VsbSidebar=l,e.VsbSidebarItem=a,e.VsbSidebarItemIcon=s,e.default=b,Object.defineProperty(e,"__esModule",{value:!0}),e}({});