Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

vue-tree-navigation

Package Overview
Dependencies
Maintainers
1
Versions
10
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

vue-tree-navigation - npm Package Compare versions

Comparing version 2.1.2 to 3.0.0

2

dist/vue-tree-navigation.js

@@ -1,2 +0,2 @@

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.VueTreeNavigation=t():e.VueTreeNavigation=t()}(window,function(){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:r})},n.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=19)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default={props:{isClosed:{type:Boolean,required:!0}},computed:{classes:function(){return{closed:this.isClosed}}}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r,o=n(12),a=(r=o)&&r.__esModule?r:{default:r};t.default={data:function(){return{closed:this.level>this.defaultOpenLevel}},props:{level:{type:Number,required:!0},defaultOpenLevel:{type:Number,required:!0}},computed:{classes:function(){return{closed:this.closed}}},watch:{defaultOpenLevel:function(){this.closed=this.level>this.defaultOpenLevel}},methods:{toggle:function(){this.closed=!this.closed}},components:{"navigation-toggle":a.default}}},function(e,t,n){"use strict";function r(e,t,n,r,o,a,i,s){var u=typeof(e=e||{}).default;"object"!==u&&"function"!==u||(e=e.default);var l,d="function"==typeof e?e.options:e;if(t&&(d.render=t,d.staticRenderFns=n,d._compiled=!0),r&&(d.functional=!0),a&&(d._scopeId=a),i?(l=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__),o&&o.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(i)},d._ssrRegister=l):o&&(l=s?function(){o.call(this,this.$root.$options.shadowRoot)}:o),l)if(d.functional){d._injectStyles=l;var c=d.render;d.render=function(e,t){return l.call(t),c(e,t)}}else{var f=d.beforeCreate;d.beforeCreate=f?[].concat(f,l):[l]}return{exports:e,options:d}}n.d(t,"a",function(){return r})},function(e,t,n){"use strict";function r(e,t){for(var n=[],r={},o=0;o<t.length;o++){var a=t[o],i=a[0],s={id:e+":"+o,css:a[1],media:a[2],sourceMap:a[3]};r[i]?r[i].parts.push(s):n.push(r[i]={id:i,parts:[s]})}return n}n.r(t),n.d(t,"default",function(){return v});var o="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!o)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var a={},i=o&&(document.head||document.getElementsByTagName("head")[0]),s=null,u=0,l=!1,d=function(){},c=null,f="data-vue-ssr-id",p="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());function v(e,t,n,o){l=n,c=o||{};var i=r(e,t);return h(i),function(t){for(var n=[],o=0;o<i.length;o++){var s=i[o];(u=a[s.id]).refs--,n.push(u)}t?h(i=r(e,t)):i=[];for(o=0;o<n.length;o++){var u;if(0===(u=n[o]).refs){for(var l=0;l<u.parts.length;l++)u.parts[l]();delete a[u.id]}}}}function h(e){for(var t=0;t<e.length;t++){var n=e[t],r=a[n.id];if(r){r.refs++;for(var o=0;o<r.parts.length;o++)r.parts[o](n.parts[o]);for(;o<n.parts.length;o++)r.parts.push(m(n.parts[o]));r.parts.length>n.parts.length&&(r.parts.length=n.parts.length)}else{var i=[];for(o=0;o<n.parts.length;o++)i.push(m(n.parts[o]));a[n.id]={id:n.id,refs:1,parts:i}}}}function g(){var e=document.createElement("style");return e.type="text/css",i.appendChild(e),e}function m(e){var t,n,r=document.querySelector("style["+f+'~="'+e.id+'"]');if(r){if(l)return d;r.parentNode.removeChild(r)}if(p){var o=u++;r=s||(s=g()),t=T.bind(null,r,o,!1),n=T.bind(null,r,o,!0)}else r=g(),t=function(e,t){var n=t.css,r=t.media,o=t.sourceMap;r&&e.setAttribute("media",r);c.ssrId&&e.setAttribute(f,t.id);o&&(n+="\n/*# sourceURL="+o.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */");if(e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}.bind(null,r),n=function(){r.parentNode.removeChild(r)};return t(e),function(r){if(r){if(r.css===e.css&&r.media===e.media&&r.sourceMap===e.sourceMap)return;t(e=r)}else n()}}var y,_=(y=[],function(e,t){return y[e]=t,y.filter(Boolean).join("\n")});function T(e,t,n,r){var o=n?"":r.css;if(e.styleSheet)e.styleSheet.cssText=_(t,o);else{var a=document.createTextNode(o),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(a,i[t]):e.appendChild(a)}}},function(e,t){e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var n=function(e,t){var n=e[1]||"",r=e[3];if(!r)return n;if(t&&"function"==typeof btoa){var o=(i=r,"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(i))))+" */"),a=r.sources.map(function(e){return"/*# sourceURL="+r.sourceRoot+e+" */"});return[n].concat(a).concat([o]).join("\n")}var i;return[n].join("\n")}(t,e);return t[2]?"@media "+t[2]+"{"+n+"}":n}).join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var r={},o=0;o<this.length;o++){var a=this[o][0];"number"==typeof a&&(r[a]=!0)}for(o=0;o<e.length;o++){var i=e[o];"number"==typeof i[0]&&r[i[0]]||(n&&!i[2]?i[2]=n:n&&(i[2]="("+i[2]+") and ("+n+")"),t.push(i))}},t}},function(e,t,n){"use strict";n.d(t,"a",function(){return r}),n.d(t,"b",function(){return o});var r=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("ul",{staticClass:"navigation-list",class:e.classes},[n("navigation-toggle",{attrs:{isClosed:e.closed},nativeOn:{click:function(t){return e.toggle(t)}}}),e._v(" "),e._t("default")],2)},o=[]},function(e,t,n){"use strict";n.d(t,"a",function(){return r}),n.d(t,"b",function(){return o});var r=function(){var e=this.$createElement,t=this._self._c||e;return t("span",{staticClass:"navigation-toggle",class:this.classes},[t("span",{staticClass:"navigation-toggle-icon"})])},o=[]},function(e,t,n){(e.exports=n(4)(!1)).push([e.i,".tree-navigation{display:inline-block}.tree-navigation ul{padding-left:15px;font-weight:700;line-height:30px;text-align:left;list-style-type:none}.tree-navigation ul li{padding-left:40px;font-weight:400}.tree-navigation>ul{padding-left:0}",""])},function(e,t,n){var r=n(7);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);(0,n(3).default)("0965e660",r,!0,{})},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default={PATH_TYPE_NONE:"none",PATH_TYPE_ELEMENT:"element",PATH_TYPE_ROUTE:"route"}},function(e,t,n){(e.exports=n(4)(!1)).push([e.i,".navigation-toggle{position:relative;top:-3px;padding:6px;cursor:pointer}.navigation-toggle .navigation-toggle-icon{display:inline-block;padding:3px;border:solid #000;border-width:0 2px 2px 0;transform:rotate(45deg)}.navigation-toggle.closed .navigation-toggle-icon{transform:rotate(-45deg)}",""])},function(e,t,n){var r=n(10);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);(0,n(3).default)("13a093fa",r,!0,{})},function(e,t,n){"use strict";n.r(t);var r=n(0),o=n.n(r);for(var a in r)"default"!==a&&function(e){n.d(t,e,function(){return r[e]})}(a);var i=n(6),s=n(2);var u=function(e){n(11)},l=Object(s.a)(o.a,i.a,i.b,!1,u,null,null);t.default=l.exports},function(e,t,n){(e.exports=n(4)(!1)).push([e.i,".navigation-list.closed li,.navigation-list.closed ul{display:none}",""])},function(e,t,n){var r=n(13);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);(0,n(3).default)("15f9f40e",r,!0,{})},function(e,t,n){"use strict";n.r(t);var r=n(1),o=n.n(r);for(var a in r)"default"!==a&&function(e){n.d(t,e,function(){return r[e]})}(a);var i=n(5),s=n(2);var u=function(e){n(14)},l=Object(s.a)(o.a,i.a,i.b,!1,u,null,null);t.default=l.exports},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=a(n(15)),o=a(n(9));function a(e){return e&&e.__esModule?e:{default:e}}var i=o.default.PATH_TYPE_NONE,s=o.default.PATH_TYPE_ELEMENT,u=o.default.PATH_TYPE_ROUTE;function l(e){var t=e.indexOf("#");return-1===t?e:e.slice(0,t)}function d(e){if(void 0!==e)return"/"!==e[0]&&(e="/"+e),"/"===e[e.length-1]&&(e=e.slice(0,-1)),e}function c(e){if(void 0!==e)return"#"!==e[0]&&(e="#"+e),e}function f(e,t){var n=c(e.element),r=d(e.route);if(void 0===t){if(void 0===n&&void 0===r)return{path:void 0,pathType:i};if(void 0!==r)return{path:r,pathType:u};if(void 0!==n)return{path:n,pathType:s}}return t.meta.pathType===u&&void 0!==r?{path:l(t.meta.path)+r,pathType:u}:t.meta.pathType===u&&void 0!==n?{path:l(t.meta.path)+n,pathType:u}:t.meta.pathType===u&&void 0===n&&void 0===r?{path:l(t.meta.path),pathType:u}:t.meta.pathType===s&&void 0!==r?{path:r,pathType:u}:t.meta.pathType===s&&void 0!==n?{path:n,pathType:s}:t.meta.pathType===s&&void 0===n&&void 0===r?{path:void 0,pathType:i}:t.meta.pathType===i&&void 0!==r?{path:r,pathType:u}:t.meta.pathType===i&&void 0!==n?{path:n,pathType:s}:t.meta.pathType===i&&void 0===n&&void 0===r?{path:void 0,pathType:i}:void 0}t.default={sanitizeRoute:d,sanitizeElement:c,removeElementFromPath:l,getItemMetadata:f,insertMetadataToItems:function e(t,n){return t.forEach(function(t){t.meta=f(t,n),t.hasOwnProperty("children")&&(t.children=e(t.children,t))}),t},generateLevel:function e(t,n,o,a){var i=[];return n.forEach(function(n){var l=function(e,t){if(void 0===t.route&&void 0===t.element)return t.name;var n=void 0,r=void 0,o=void 0,a=void 0;return t.meta.pathType===s&&(n="a",r={href:t.meta.path},o={},a=[]),t.meta.pathType===u&&(n="router-link",r={},o={to:t.meta.path},a=["router-link"]),e(n,{attrs:r,props:o,class:a},[t.name])}(t,n);n.hasOwnProperty("children")?i.push(t(r.default,{props:{level:o,defaultOpenLevel:a}},[l].concat(function(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)}(e(t,n.children,o+1,a))))):i.push(t("li",[l]))}),i}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r,o=n(16),a=(r=o)&&r.__esModule?r:{default:r};n(8);var i={name:"vue-tree-navigation",data:function(){return{classes:["tree-navigation"]}},props:{items:{type:Array,required:!0},defaultOpenLevel:{type:Number,default:0}},computed:{itemsWithMetadata:function(){var e=JSON.parse(JSON.stringify(this.items));return a.default.insertMetadataToItems(e)}},render:function(e){var t=e("ul",a.default.generateLevel(e,this.itemsWithMetadata,1,this.defaultOpenLevel));return e("div",{class:this.classes},[t])}};t.default=i},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r,o=n(17),a=(r=o)&&r.__esModule?r:{default:r};a.default.install=function(e){e.component(a.default.name,a.default)},t.default=a.default},function(e,t,n){"use strict";var r,o=n(18),a=(r=o)&&r.__esModule?r:{default:r};e.exports={install:function(e,t){e.component("vue-tree-navigation",a.default)}}}])});
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.VueTreeNavigation=t():e.VueTreeNavigation=t()}(window,function(){return function(e){var t={};function n(i){if(t[i])return t[i].exports;var r=t[i]={i:i,l:!1,exports:{}};return e[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=e,n.c=t,n.d=function(e,t,i){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:i})},n.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=23)}([function(e,t,n){"use strict";function i(e,t,n,i,r,a,o,s){var u=typeof(e=e||{}).default;"object"!==u&&"function"!==u||(e=e.default);var l,c="function"==typeof e?e.options:e;if(t&&(c.render=t,c.staticRenderFns=n,c._compiled=!0),i&&(c.functional=!0),a&&(c._scopeId=a),o?(l=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__),r&&r.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},c._ssrRegister=l):r&&(l=s?function(){r.call(this,this.$root.$options.shadowRoot)}:r),l)if(c.functional){c._injectStyles=l;var f=c.render;c.render=function(e,t){return l.call(t),f(e,t)}}else{var d=c.beforeCreate;c.beforeCreate=d?[].concat(d,l):[l]}return{exports:e,options:c}}n.d(t,"a",function(){return i})},function(e,t,n){"use strict";function i(e,t){for(var n=[],i={},r=0;r<t.length;r++){var a=t[r],o=a[0],s={id:e+":"+r,css:a[1],media:a[2],sourceMap:a[3]};i[o]?i[o].parts.push(s):n.push(i[o]={id:o,parts:[s]})}return n}n.r(t),n.d(t,"default",function(){return v});var r="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!r)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var a={},o=r&&(document.head||document.getElementsByTagName("head")[0]),s=null,u=0,l=!1,c=function(){},f=null,d="data-vue-ssr-id",p="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());function v(e,t,n,r){l=n,f=r||{};var o=i(e,t);return h(o),function(t){for(var n=[],r=0;r<o.length;r++){var s=o[r];(u=a[s.id]).refs--,n.push(u)}t?h(o=i(e,t)):o=[];for(r=0;r<n.length;r++){var u;if(0===(u=n[r]).refs){for(var l=0;l<u.parts.length;l++)u.parts[l]();delete a[u.id]}}}}function h(e){for(var t=0;t<e.length;t++){var n=e[t],i=a[n.id];if(i){i.refs++;for(var r=0;r<i.parts.length;r++)i.parts[r](n.parts[r]);for(;r<n.parts.length;r++)i.parts.push(m(n.parts[r]));i.parts.length>n.parts.length&&(i.parts.length=n.parts.length)}else{var o=[];for(r=0;r<n.parts.length;r++)o.push(m(n.parts[r]));a[n.id]={id:n.id,refs:1,parts:o}}}}function g(){var e=document.createElement("style");return e.type="text/css",o.appendChild(e),e}function m(e){var t,n,i=document.querySelector("style["+d+'~="'+e.id+'"]');if(i){if(l)return c;i.parentNode.removeChild(i)}if(p){var r=u++;i=s||(s=g()),t=b.bind(null,i,r,!1),n=b.bind(null,i,r,!0)}else i=g(),t=function(e,t){var n=t.css,i=t.media,r=t.sourceMap;i&&e.setAttribute("media",i);f.ssrId&&e.setAttribute(d,t.id);r&&(n+="\n/*# sourceURL="+r.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */");if(e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}.bind(null,i),n=function(){i.parentNode.removeChild(i)};return t(e),function(i){if(i){if(i.css===e.css&&i.media===e.media&&i.sourceMap===e.sourceMap)return;t(e=i)}else n()}}var _,y=(_=[],function(e,t){return _[e]=t,_.filter(Boolean).join("\n")});function b(e,t,n,i){var r=n?"":i.css;if(e.styleSheet)e.styleSheet.cssText=y(t,r);else{var a=document.createTextNode(r),o=e.childNodes;o[t]&&e.removeChild(o[t]),o.length?e.insertBefore(a,o[t]):e.appendChild(a)}}},function(e,t){e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var n=function(e,t){var n=e[1]||"",i=e[3];if(!i)return n;if(t&&"function"==typeof btoa){var r=(o=i,"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */"),a=i.sources.map(function(e){return"/*# sourceURL="+i.sourceRoot+e+" */"});return[n].concat(a).concat([r]).join("\n")}var o;return[n].join("\n")}(t,e);return t[2]?"@media "+t[2]+"{"+n+"}":n}).join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var i={},r=0;r<this.length;r++){var a=this[r][0];"number"==typeof a&&(i[a]=!0)}for(r=0;r<e.length;r++){var o=e[r];"number"==typeof o[0]&&i[o[0]]||(n&&!o[2]?o[2]=n:n&&(o[2]="("+o[2]+") and ("+n+")"),t.push(o))}},t}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default={data:function(){return{active:!1}},props:{item:Object,required:!0},methods:{isActive:function(){return""!==this.item.meta.target&&(this.$route?this.$route.path+this.$route.hash===this.item.meta.target:window.location.href.endsWith(this.item.meta.target))}},computed:{showLabel:function(){return void 0===this.item.route&&void 0===this.item.element&&void 0===this.item.external},showRouterLink:function(){return this.showLink&&void 0!==this.$router},showHyperLink:function(){return this.showLink&&void 0===this.$router},showExternalHyperLink:function(){return void 0!==this.item.external},showLink:function(){return void 0!==this.item.route||void 0!==this.item.element},classes:function(){return{"NavigationItem--active":this.active}}},watch:{item:function(){this.active=this.isActive()},$route:function(){this.active=this.isActive()}},mounted:function(){var e=this;this.active=this.isActive(),this.$router||window.addEventListener("hashchange",function(){e.active=e.isActive()})}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default={props:{open:{type:Boolean,required:!1,default:!1}}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=a(n(17)),r=a(n(9));function a(e){return e&&e.__esModule?e:{default:e}}t.default={data:function(){return{isOpen:this.open}},props:{parentItem:{type:Object,required:!0},level:{type:Number,required:!0},open:{type:Boolean,required:!1,default:!1}},computed:{classes:function(){return e={"NavigationLevel--closed":!this.isOpen},t="NavigationLevel--level-"+this.level,n=!0,t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e;var e,t,n}},methods:{onToggleClick:function(){this.isOpen=!this.isOpen},onItemClick:function(){!1===this.isOpen&&(this.isOpen=!0)}},components:{NavigationItem:r.default,NavigationToggle:i.default}}},function(e,t,n){"use strict";n.d(t,"a",function(){return i}),n.d(t,"b",function(){return r});var i=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"NavigationLevel",class:e.classes},[n("div",{staticClass:"NavigationLevel__parent"},[n("NavigationToggle",{attrs:{open:e.isOpen},nativeOn:{click:function(t){return e.onToggleClick(t)}}}),e._v(" "),n("NavigationItem",{attrs:{item:e.parentItem},nativeOn:{click:function(t){return e.onItemClick(t)}}})],1),e._v(" "),n("ul",{staticClass:"NavigationLevel__children"},[e._t("default")],2)])},r=[]},function(e,t,n){"use strict";n.d(t,"a",function(){return i}),n.d(t,"b",function(){return r});var i=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("span",{staticClass:"NavigationItem",class:e.classes},[e.showLabel?n("span",{staticClass:"NavigationItem__label"},[e._v(e._s(e.item.name))]):e._e(),e._v(" "),e.showRouterLink?n("router-link",{staticClass:"NavigationItem__router-link",attrs:{to:e.item.meta.target}},[e._v(e._s(e.item.name))]):e._e(),e._v(" "),e.showHyperLink?n("a",{staticClass:"NavigationItem__link",attrs:{href:e.item.meta.target}},[e._v(e._s(e.item.name))]):e._e(),e._v(" "),e.showExternalHyperLink?n("a",{staticClass:"NavigationItem__external-link",attrs:{href:e.item.meta.target,target:"_blank"}},[e._v(e._s(e.item.name))]):e._e()],1)},r=[]},function(e,t,n){"use strict";n.d(t,"a",function(){return i}),n.d(t,"b",function(){return r});var i=function(){var e=this.$createElement,t=this._self._c||e;return t("span",{staticClass:"NavigationToggle",class:{"NavigationToggle--closed":!this.open}},[t("span",{staticClass:"NavigationToggle__icon",class:{"NavigationToggle__icon--closed":!this.open}})])},r=[]},function(e,t,n){"use strict";n.r(t);var i=n(3),r=n.n(i);for(var a in i)"default"!==a&&function(e){n.d(t,e,function(){return i[e]})}(a);var o=n(7),s=n(0);var u=function(e){n(14)},l=Object(s.a)(r.a,o.a,o.b,!1,u,null,null);t.default=l.exports},function(e,t,n){(e.exports=n(2)(!1)).push([e.i,".TreeNavigation{display:inline-block;padding:0;margin:0}.TreeNavigation ul{padding:0;margin:0;list-style-type:none}.TreeNavigation li{padding-left:20px}",""])},function(e,t,n){var i=n(10);"string"==typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);(0,n(1).default)("0965e660",i,!0,{})},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.getRelativeUrl=function(e,t){var n=e.replace("/#/","/");return"/"===t[t.length-1]&&(t=t.slice(0,-1)),n=n.replace(t,""),r(n)};var i=t.removeElementFromPath=function(e){for(var t=void 0;-1!==t;){if(-1===(t=e.lastIndexOf("#")))return e;if(t===e.indexOf("#/"))return e;e=e.slice(0,t)}},r=(t.sanitizeElement=function(e){return void 0===e||""===e?e:("#"!==e[0]&&(e="#"+e),e)},t.sanitizeRoute=function(e){if(void 0!==e)return"/"!==e[0]&&(e="/"+e),"/"===e[e.length-1]&&(e=e.slice(0,-1)),e});t.startsWithUrl=function(e,t){return t.startsWith("/#")||(t=i(t)),!!e.startsWith(t)}},function(e,t,n){(e.exports=n(2)(!1)).push([e.i,".NavigationItem{display:inline-block;padding-top:5px;padding-bottom:5px}.NavigationItem span{cursor:pointer}",""])},function(e,t,n){var i=n(13);"string"==typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);(0,n(1).default)("14573478",i,!0,{})},function(e,t,n){(e.exports=n(2)(!1)).push([e.i,".NavigationToggle{position:relative;top:-3px;padding:5px 5px 5px 3px;cursor:pointer}.NavigationToggle__icon{display:inline-block;padding:3px;border:solid #000;border-width:0 2px 2px 0;transform:rotate(45deg)}.NavigationToggle__icon--closed{transform:rotate(-45deg)}",""])},function(e,t,n){var i=n(15);"string"==typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);(0,n(1).default)("13a093fa",i,!0,{})},function(e,t,n){"use strict";n.r(t);var i=n(4),r=n.n(i);for(var a in i)"default"!==a&&function(e){n.d(t,e,function(){return i[e]})}(a);var o=n(8),s=n(0);var u=function(e){n(16)},l=Object(s.a)(r.a,o.a,o.b,!1,u,null,null);t.default=l.exports},function(e,t,n){(e.exports=n(2)(!1)).push([e.i,".NavigationLevel--closed ul{display:none}",""])},function(e,t,n){var i=n(18);"string"==typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);(0,n(1).default)("486a06cd",i,!0,{})},function(e,t,n){"use strict";n.r(t);var i=n(5),r=n.n(i);for(var a in i)"default"!==a&&function(e){n.d(t,e,function(){return i[e]})}(a);var o=n(6),s=n(0);var u=function(e){n(19)},l=Object(s.a)(r.a,o.a,o.b,!1,u,null,null);t.default=l.exports},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.getItemMetadata=t.insertMetadataToItems=t.renderLevelAsOpen=t.generateLevel=void 0;var i=o(n(20)),r=o(n(9)),a=n(12);function o(e){return e&&e.__esModule?e:{default:e}}t.generateLevel=function e(t,n,a,o){var u=[];return n.forEach(function(n){if(n.hasOwnProperty("children")){var l=t(i.default,{props:{parentItem:n,level:a,open:s(n,a,o)}},[].concat(function(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)}(e(t,n.children,a+1,o))));u.push(t("li",[l]))}else{var c=t(r.default,{props:{item:n}});u.push(t("li",[c]))}}),u};var s=t.renderLevelAsOpen=function(e,t,n){if(n>=t)return!0;var i=(0,a.getRelativeUrl)(window.location.href,window.location.origin);if(""!==e.meta.target&&!0===(0,a.startsWithUrl)(i,e.meta.target))return!0;for(var r=0;r<e.children.length;r++){var o=e.children[r];if(""!==o.meta.target&&!0===(0,a.startsWithUrl)(i,o.meta.target))return!0}return!1},u=(t.insertMetadataToItems=function e(t,n){return t.forEach(function(t){t.meta=u(t,n),t.hasOwnProperty("children")&&(t.children=e(t.children,t))}),t},t.getItemMetadata=function(e,t){var n=(0,a.sanitizeElement)(e.element),i=(0,a.sanitizeRoute)(e.route),r=e.external;if(void 0===t){if(void 0===n&&void 0===i&&void 0===r)return{path:"",target:""};if(void 0!==r)return{path:"",target:r};if(void 0!==i)return{path:i,target:i};if(void 0!==n)return{path:"",target:"/"+n}}var o=(0,a.sanitizeRoute)(t.meta.path);return void 0!==r?{path:o,target:r}:void 0!==i?{path:o+i,target:o+i}:void 0!==n?{path:o,target:(0,a.sanitizeRoute)(o+n)}:{path:o,target:""}})},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=n(21);n(11);var r={props:{items:{type:Array,required:!0},defaultOpenLevel:{type:Number,default:0}},computed:{itemsWithMetadata:function(){var e=JSON.parse(JSON.stringify(this.items));return(0,i.insertMetadataToItems)(e)}},render:function(e){return e("div",{class:"TreeNavigation"},[e("div",{class:["NavigationLevel","NavigationLevel--level-0"]},[e("ul",(0,i.generateLevel)(e,this.itemsWithMetadata,1,this.defaultOpenLevel))])])}};t.default=r},function(e,t,n){"use strict";var i,r=n(22),a=(i=r)&&i.__esModule?i:{default:i};e.exports={install:function(e,t){e.component("vue-tree-navigation",a.default)}}}])});
//# sourceMappingURL=vue-tree-navigation.js.map

39

package.json
{
"name": "vue-tree-navigation",
"version": "2.1.2",
"version": "3.0.0",
"description": "Vue.js 2 tree navigation",

@@ -11,3 +11,4 @@ "keywords": [

"component",
"plugin"
"plugin",
"menu"
],

@@ -21,3 +22,3 @@ "homepage": "https://github.com/MisRob/vue-tree-navigation",

],
"main": "dist/index.js",
"main": "dist/vue-tree-navigation.js",
"repository": {

@@ -35,11 +36,12 @@ "type": "git",

"prettier": "prettier --write '**/*.{js,vue}' --ignore-path .eslintignore",
"unit": "jest"
"unit": "jest",
"unit-ci": "jest --coverage && cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js"
},
"dependencies": {
"vue": "^2.5.11",
"webpack-merge": "^4.1.2"
"vue": "^2.5.11"
},
"devDependencies": {
"@vue/test-utils": "^1.0.0-beta.14",
"babel-core": "^6.26.0",
"babel-eslint": "^8.0.3",
"babel-eslint": "^8.2.3",
"babel-jest": "^22.0.4",

@@ -49,2 +51,3 @@ "babel-loader": "^7.1.2",

"babel-preset-stage-3": "^6.24.1",
"coveralls": "^3.0.0",
"cross-env": "^5.0.5",

@@ -63,7 +66,10 @@ "css-loader": "^0.28.7",

"jest": "^22.0.4",
"jest-each": "^0.3.1",
"jest-environment-jsdom": "^22.4.3",
"jest-environment-jsdom-global": "^1.0.3",
"jest-plugin-context": "^2.6.0",
"jest-serializer-vue": "^1.0.0",
"node-sass": "^4.5.3",
"prettier": "1.12.0",
"sass-loader": "^6.0.6",
"prettier": "1.12.1",
"sass-loader": "^7.0.1",
"stylelint": "^9.2.0",

@@ -73,9 +79,8 @@ "stylelint-config-recess-order": "^2.0.0",

"stylelint-processor-html": "^1.0.0",
"stylelint-scss": "^3.0.0",
"vue-jest": "^2.4.1",
"stylelint-scss": "^3.0.1",
"vue-jest": "^2.5.0",
"vue-loader": "^14.2.2",
"vue-router": "^3.0.1",
"vue-template-compiler": "^2.4.4",
"vue-test-utils": "^1.0.0-beta.8",
"webpack": "^4.5.0",
"webpack": "^4.6.0",
"webpack-cli": "^2.0.14",

@@ -102,4 +107,10 @@ "webpack-dev-server": "^3.1.3"

"jest-plugin-context/setup"
]
],
"collectCoverageFrom": [
"src/**/*.{js,vue}",
"!src/index.js",
"!src/plugin.js"
],
"testEnvironment": "jest-environment-jsdom-global"
}
}

67

README.md

@@ -1,2 +0,2 @@

# vue-tree-navigation
# vue-tree-navigation [![Version](https://img.shields.io/npm/v/vue-tree-navigation.svg)](https://www.npmjs.com/package/vue-tree-navigation) [![Coverage Status](https://coveralls.io/repos/github/MisRob/vue-tree-navigation/badge.svg?branch=master)](https://coveralls.io/github/MisRob/vue-tree-navigation?branch=master) [![License](https://img.shields.io/npm/l/vue-tree-navigation.svg)](https://www.npmjs.com/package/vue-tree-navigation)

@@ -7,2 +7,12 @@ > Vue.js 2 tree navigation with vue-router support

## Features
- unlimited number of levels
- optional [vue-router](https://router.vuejs.org/en/) support (v2.0.0 or higher)
- a possibility to define a default open level
- auto-open a level when a corresponding URL visited
- focused on core functionality, only necessary styles included
- elements are provided with meaningful classes to make customizations comfortable (for example `NavigationItem--active`, `NavigationLevel--level-1`, `NavigationLevel--closed`)
- external URLs support
## Example

@@ -21,10 +31,11 @@

{ name: 'Products', children: [ // category label
{ name: 'Shoes', route: 'shoes' } // #/shoes
{ name: 'Shoes', route: 'shoes' } // /shoes
]},
{ name: 'About', route: 'about', children: [ // #/about
{ name: 'Contact', route: 'contact', children: [ // #/about/contact
{ name: 'E-mail', element: 'email' }, // #/about/contact#email
{ name: 'Phone', element: 'phone' } // #/about/contact#phone
{ name: 'About', route: 'about', children: [ // /about
{ name: 'Contact', route: 'contact', children: [ // /about/contact
{ name: 'E-mail', element: 'email' }, // /about/contact#email
{ name: 'Phone', element: 'phone' } // /about/contact#phone
]},
]},
{ name: 'Github', external: 'https://github.com' }, // https://github.com
],

@@ -37,12 +48,22 @@ };

## Demo
## Installation
You can visit this [codepen](https://codepen.io/MisRob/pen/ZxNGrd) for a simple demo. Please see [documentation/demo](https://vue-tree-navigation.misrob.cz) for more examples including vue-router.
### NPM
## Installation
```console
$ npm install vue-tree-navigation
```
*main.js*
```javascript
import VueTreeNavigation from 'vue-tree-navigation';
Vue.use(VueTreeNavigation);
```
### Include with a script tag
```html
<script src="https://unpkg.com/vue-tree-navigation@2.1.2/dist/vue-tree-navigation.js"></script>
<script src="https://unpkg.com/vue-tree-navigation@3.0.0/dist/vue-tree-navigation.js"></script>

@@ -54,14 +75,21 @@ <script>

### NPM
*Example*
```console
$ npm install vue-tree-navigation
```
```html
<div id="app">
<vue-tree-navigation :items="items" :defaultOpenLevel="1" />
</div>
*main.js*
<script>
Vue.use(VueTreeNavigation)
```javascript
import VueTreeNavigation from 'vue-tree-navigation';
Vue.use(VueTreeNavigation);
const app = new Vue({
el: '#app',
data: {
items: [
...
],
}
})
</script>
```

@@ -72,3 +100,2 @@

- [Vue.js](https://vuejs.org/)
- [vue-router](https://router.vuejs.org/en/) (optional, only when you wish to use router links)

@@ -75,0 +102,0 @@ ## Developers

dist/index.js
dist/index.js.map
dist/vue-tree-navigation.js.map

Sorry, the diff of this file is not supported yet

LICENSE

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc