vue-mermaid - npm Package Compare versions

Comparing version 0.0.7 to 0.0.8

CHANGELOG.md

@@ -5,3 +5,13 @@ # vue-mermaid Change Log
 
+## 0.0.8
+
+- Add node style support
+
+## 0.0.7
+
+- Change mermaid version to 8.0.0
+- Fix init bug
+
 ## 0.0.6
+
 - Added support for all mermaid edge types.
@@ -13,5 +23,7 @@ - Added support for custom links.
 ## 0.0.5
+
 - Fix refresh issue.
 
 ## 0.0.4
-- Started project baseline.
+
+- Started project baseline.

dist/vue-mermaid.js

@@ -1,1 +0,1 @@
-define(["mermaid"],function(n){"use strict";function e(n,e,t){return e in n?Object.defineProperty(n,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):n[e]=t,n}function t(n){return i(n)||r(n)||o()}function i(n){if(Array.isArray(n)){for(var e=0,t=new Array(n.length);e<n.length;e++)t[e]=n[e];return t}}function r(n){if(Symbol.iterator in Object(n)||"[object Arguments]"===Object.prototype.toString.call(n))return Array.from(n)}function o(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function a(){const n=document.head||document.getElementsByTagName("head")[0],e=a.styles||(a.styles={}),t="undefined"!=typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(i,r){if(!document.querySelector('style[data-vue-ssr-id~="'+i+'"]')){const o=t?r.media||"default":i,a=e[o]||(e[o]={ids:[],parts:[],element:void 0});if(!a.ids.includes(i)){let e=r.source,d=a.ids.length;if(a.ids.push(i),t&&(a.element=a.element||document.querySelector("style[data-group="+o+"]")),!a.element){const e=a.element=document.createElement("style");e.type="text/css",r.media&&e.setAttribute("media",r.media),t&&(e.setAttribute("data-group",o),e.setAttribute("data-next-index","0")),n.appendChild(e)}if(t&&(d=parseInt(a.element.getAttribute("data-next-index")),a.element.setAttribute("data-next-index",d+1)),a.element.styleSheet)a.parts.push(e),a.element.styleSheet.cssText=a.parts.filter(Boolean).join("\n");else{const n=document.createTextNode(e),t=a.element.childNodes;t[d]&&a.element.removeChild(t[d]),t.length?a.element.insertBefore(n,t[d]):a.element.appendChild(n)}}}}}function d(n){n.component("vue-mermaid",l)}n=n&&n.hasOwnProperty("default")?n.default:n;const c={name:"VueMermaid",props:{type:{type:String,default:"graph TD"},nodes:{type:Array,required:!0},styles:{type:Array,default:function(){return[]}},config:{type:Object,default:function(){return{theme:"default",startOnLoad:!1}}}},data:function(){return{edges:[{type:"default",open:"[",close:"]"},{type:"round",open:"(",close:")"},{type:"circle",open:"((",close:"))"},{type:"asymetric",open:">",close:"]"},{type:"rhombus",open:"{",close:"}"}]}},mounted:function(){this.init(),this.loadNodes()},computed:{nodeObject:function(){var n=this.nodes;if(Array.isArray(n)&&n.length>0){return function(n,i){return Object.assign.apply(Object,[{}].concat(t(n.map(function(n){return e({},n[i],n)}))))}(n,"id")}return{}},parseCode:function(){var n=this,e=this.nodes,t=this.styles;if(Array.isArray(e)&&e.length>0){var i=this.type+"\n",r=i+e.map(function(e){return e.next&&e.next.length>0?e.next.map(function(t){var i=n.nodeObject[t]||n.nodeObject[t.id];return null!=i&&void 0!==i?"".concat(n.buildNode(e)).concat(n.buildLink(e)).concat(n.buildNode(i)):"".concat(n.buildNode(e))}).join("\n"):"".concat(n.buildNode(e),"\n                    click ").concat(e.id," clickTest\n                    ")}).join("\n")+"\n"+t.join(" \n")+"\n"+e.filter(function(n){return n.editable}).map(function(n){return"click ".concat(n.id,' mermaidClick "edit"')}).join("\n");return this.load(r),r}return""}},methods:{buildNode:function(n){var e=n.edgeType?this.edges.find(function(e){return e.type===n.edgeType}):this.edges.find(function(n){return"default"===n.type});return"".concat(n.id).concat(e.open).concat(n.text).concat(e.close)},buildLink:function(n){return n.link?n.link:"--\x3e"},loadNodes:function(){this.load(this.parseCode)},init:function(){var e=this;window.mermaidClick=function(n){e.edit(n)},n.initialize(this.config)},load:function(e){if(e){var t=document.getElementById("mermaid");t&&(t.removeAttribute("data-processed"),t.replaceChild(document.createTextNode(e),t.firstChild),n.init(e,t))}},edit:function(n){this.$emit("nodeClick",n)}}};var s=function(){var n=this,e=n.$createElement;return(n._self._c||e)("div",{staticClass:"mermaid",attrs:{id:"mermaid"}},[n._v(n._s(n.parseCode))])},u=[];s._withStripped=!0;var l=function(n,e,t,i,r,o,a,d){const c=("function"==typeof t?t.options:t)||{};c.__file="/Users/liu/githome/vue-mermaid/src/vue-mermaid.vue",c.render||(c.render=n.render,c.staticRenderFns=n.staticRenderFns,c._compiled=!0,r&&(c.functional=!0)),c._scopeId=i;{let n;if(e&&(n=function(n){e.call(this,a(n))}),void 0!==n)if(c.functional){const e=c.render;c.render=function(t,i){return n.call(i),e(t,i)}}else{const e=c.beforeCreate;c.beforeCreate=e?[].concat(e,n):[n]}}return c}({render:s,staticRenderFns:u},function(n){n&&n("data-v-76177c3f_0",{source:"\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n",map:{version:3,sources:[],names:[],mappings:"",file:"vue-mermaid.vue"},media:void 0})},c,void 0,!1,void 0,a,void 0);return{install:d}});
+define(["mermaid"],function(n){"use strict";function e(n,e,t){return e in n?Object.defineProperty(n,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):n[e]=t,n}function t(n){return i(n)||r(n)||o()}function i(n){if(Array.isArray(n)){for(var e=0,t=new Array(n.length);e<n.length;e++)t[e]=n[e];return t}}function r(n){if(Symbol.iterator in Object(n)||"[object Arguments]"===Object.prototype.toString.call(n))return Array.from(n)}function o(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function a(){const n=document.head||document.getElementsByTagName("head")[0],e=a.styles||(a.styles={}),t="undefined"!=typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());return function(i,r){if(!document.querySelector('style[data-vue-ssr-id~="'+i+'"]')){const o=t?r.media||"default":i,a=e[o]||(e[o]={ids:[],parts:[],element:void 0});if(!a.ids.includes(i)){let e=r.source,c=a.ids.length;if(a.ids.push(i),t&&(a.element=a.element||document.querySelector("style[data-group="+o+"]")),!a.element){const e=a.element=document.createElement("style");e.type="text/css",r.media&&e.setAttribute("media",r.media),t&&(e.setAttribute("data-group",o),e.setAttribute("data-next-index","0")),n.appendChild(e)}if(t&&(c=parseInt(a.element.getAttribute("data-next-index")),a.element.setAttribute("data-next-index",c+1)),a.element.styleSheet)a.parts.push(e),a.element.styleSheet.cssText=a.parts.filter(Boolean).join("\n");else{const n=document.createTextNode(e),t=a.element.childNodes;t[c]&&a.element.removeChild(t[c]),t.length?a.element.insertBefore(n,t[c]):a.element.appendChild(n)}}}}}function c(n){n.component("vue-mermaid",l)}n=n&&n.hasOwnProperty("default")?n.default:n;const d={name:"VueMermaid",props:{type:{type:String,default:"graph TD"},nodes:{type:Array,required:!0},styles:{type:Array,default:function(){return[]}},config:{type:Object,default:function(){return{theme:"default",startOnLoad:!1}}}},data:function(){return{edges:[{type:"default",open:"[",close:"]"},{type:"round",open:"(",close:")"},{type:"circle",open:"((",close:"))"},{type:"asymetric",open:">",close:"]"},{type:"rhombus",open:"{",close:"}"}]}},mounted:function(){this.init(),this.loadNodes()},computed:{nodeObject:function(){var n=this.nodes;if(Array.isArray(n)&&n.length>0){return function(n,i){return Object.assign.apply(Object,[{}].concat(t(n.map(function(n){return e({},n[i],n)}))))}(n,"id")}return{}},customStyle:function(){var n=this.nodes,e=this.styles;return n.filter(function(n){return n.style}).map(function(n){return"style ".concat(n.id," ").concat(n.style)}).concat(e)},parseCode:function(){var n=this,e=this.nodes;if(Array.isArray(e)&&e.length>0){var t=this.type+"\n",i=t+e.map(function(e){return e.next&&e.next.length>0?e.next.map(function(t){var i=n.nodeObject[t]||n.nodeObject[t.id];return null!=i&&void 0!==i?"".concat(n.buildNode(e)).concat(n.buildLink(e)).concat(n.buildNode(i)):"".concat(n.buildNode(e))}).join("\n"):"".concat(n.buildNode(e),"\n                    click ").concat(e.id," clickTest\n                    ")}).join("\n")+"\n"+this.customStyle.join(" \n")+"\n"+e.filter(function(n){return n.editable}).map(function(n){return"click ".concat(n.id," mermaidClick")}).join("\n");return this.load(i),i}return""}},methods:{buildNode:function(n){var e=n.edgeType?this.edges.find(function(e){return e.type===n.edgeType}):this.edges.find(function(n){return"default"===n.type});return"".concat(n.id).concat(e.open).concat(n.text).concat(e.close)},buildLink:function(n){return n.link?n.link:"--\x3e"},loadNodes:function(){this.load(this.parseCode)},init:function(){var e=this;window.mermaidClick=function(n){e.edit(n)},n.initialize(this.config)},load:function(e){if(e){var t=document.getElementById("mermaid");t&&(t.removeAttribute("data-processed"),t.replaceChild(document.createTextNode(e),t.firstChild),n.init(e,t))}},edit:function(n){this.$emit("nodeClick",n)}}};var s=function(){var n=this,e=n.$createElement;return(n._self._c||e)("div",{staticClass:"mermaid",attrs:{id:"mermaid"}},[n._v(n._s(n.parseCode))])},u=[];s._withStripped=!0;var l=function(n,e,t,i,r,o,a,c){const d=("function"==typeof t?t.options:t)||{};d.__file="/Users/liu/githome/vue-mermaid/src/vue-mermaid.vue",d.render||(d.render=n.render,d.staticRenderFns=n.staticRenderFns,d._compiled=!0,r&&(d.functional=!0)),d._scopeId=i;{let n;if(e&&(n=function(n){e.call(this,a(n))}),void 0!==n)if(d.functional){const e=d.render;d.render=function(t,i){return n.call(i),e(t,i)}}else{const e=d.beforeCreate;d.beforeCreate=e?[].concat(e,n):[n]}}return d}({render:s,staticRenderFns:u},function(n){n&&n("data-v-3dd39724_0",{source:"\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n",map:{version:3,sources:[],names:[],mappings:"",file:"vue-mermaid.vue"},media:void 0})},d,void 0,!1,void 0,a,void 0);return{install:c}});

package.json

 {
   "name": "vue-mermaid",
   "description": "flowchart of mermaid with vue componet",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "main": "dist/vue-mermaid.js",
@@ -6,0 +6,0 @@ "author": "mark_tun <[e-mail]>",

README.md

@@ -12,3 +12,3 @@ # vue-mermaid
 
-``` bash
+```bash
 # install dependencies
@@ -24,4 +24,4 @@ npm install --save vue-mermaid
 ```js
-import VueMermaid from 'vue-mermaid'
-Vue.use(VueMermaid)
+import VueMermaid from "vue-mermaid";
+Vue.use(VueMermaid);
 ```
@@ -33,25 +33,33 @@
 export default {
-  data:function(){
+  data: function() {
     return {
-      data:[
-        {id:'1',text:'A',link:'---',next:['2'],editable:true},
-        {id:'2',text:'B',edgeType:'circle',next:['3']},
-        {id:'3',text:'C',next:['4','6']},
-        {id:'4',text:'D',link:'-- This is the text ---',next:['5']},
-        {id:'5',text:'E'},
-        {id:'6',text:'F'}
+      data: [
+        {
+          id: "1",
+          text: "A",
+          link: "---",
+          next: ["2"],
+          editable: true,
+          style: "fill:#f9f,stroke:#333,stroke-width:4px"
+        },
+        { id: "2", text: "B", edgeType: "circle", next: ["3"] },
+        { id: "3", text: "C", next: ["4", "6"] },
+        { id: "4", text: "D", link: "-- This is the text ---", next: ["5"] },
+        { id: "5", text: "E" },
+        { id: "6", text: "F" }
       ]
-    }
+    };
   },
-  methods:{
+  methods: {
     editNode(nodeId) {
-     alert(nodeId);
-    },
+      alert(nodeId);
+    }
   }
-}
+};
 ```
+
 #### Possible edgeType values:
+
 ![edge.default](./img/edge_types.png)
 
-
 ### Template
@@ -61,3 +69,7 @@
 <template>
-  <vue-mermaid :nodes="data" type="graph LR" @nodeClick="editNode"></vue-mermaid>
+  <vue-mermaid
+    :nodes="data"
+    type="graph LR"
+    @nodeClick="editNode"
+  ></vue-mermaid>
 </template>
@@ -72,3 +84,3 @@ ```
 
-``` bash
+```bash
 # install dependencies
@@ -75,0 +87,0 @@ npm install

No alert changes

Improved metrics

Total package byte prevSize

13047

increased by5.61%

Lines of code

26

increased by4%

Number of lines in readme file

87

increased by16%

No dependency changes