markmap-view 0.18.8 → 0.18.10-alpha.2

package/dist/browser/index.js

@@ -1199,7 +1199,8 @@
       const getOriginTargetRect = (node) => (nodeMap[originMap[node.state.id]] || rootNode).state.rect;
       sourceRectMap[rootNode.state.id] = rootNode.state.rect;
       if (originData) setOriginNode(originData);
-      const { highlight } = this.state;
+      let { highlight } = this.state;
+      if (highlight && !nodeMap[highlight.state.id]) highlight = void 0;
       let highlightNodes = this.g.selectAll(childSelector(SELECTOR_HIGHLIGHT)).selectAll(childSelector("rect")).data(highlight ? [this._getHighlightRect(highlight)] : []).join("rect").attr("x", (d) => d.x).attr("y", (d) => d.y).attr("width", (d) => d.width).attr("height", (d) => d.height);
       const mmG = this.g.selectAll(childSelector(SELECTOR_NODE)).each((d) => {
         sourceRectMap[d.state.id] = d.state.rect;

package/dist/constants.d.ts

@@ -1,4 +1,5 @@
-import { IMarkmapOptions, INode } from 'markmap-common';
+import { INode } from 'markmap-common';
+import { IMarkmapOptions } from './types';
 export declare const isMacintosh: boolean;
 export declare const defaultColorFn: import("d3").ScaleOrdinal<string, string, never>;
 export declare const lineWidthFactory: (baseWidth?: number, deltaWidth?: number, k?: number) => (node: INode) => number;

package/dist/index.js

@@ -72,7 +72,7 @@ function Et(e) {
     t = (t << 5) - t + e.charCodeAt(i) | 0;
   return (t >>> 0).toString(36);
 }
-function k(e) {
+function v(e) {
   if (typeof e == "string") {
     const i = e;
     e = (n) => n.matches(i);
@@ -367,9 +367,9 @@ function tt(e) {
       });
       const x = h(g) || [];
       return m.children = x.length === 0 ? null : x.map((y) => d(y, m)), m.children && Object.assign(m, m.children.reduce(
-        (y, v) => ({
-          height: Math.max(y.height, v.height + 1),
-          length: y.length + v.length
+        (y, k) => ({
+          height: Math.max(y.height, k.height + 1),
+          length: y.length + k.length
         }),
         m
       )), m;
@@ -392,8 +392,8 @@ function tt(e) {
     },
     dump(o) {
       const l = i("nodeSize"), h = (d) => (g) => {
-        const u = d + "  ", m = d + "    ", { x, y } = g, v = l(g), b = g.children || [], z = b.length === 0 ? " " : `,${u}children: [${m}${b.map(h(m)).join(m)}${u}],${d}`;
-        return `{ size: [${v.join(", ")}],${u}x: ${x}, y: ${y}${z}},`;
+        const u = d + "  ", m = d + "    ", { x, y } = g, k = l(g), b = g.children || [], z = b.length === 0 ? " " : `,${u}children: [${m}${b.map(h(m)).join(m)}${u}],${d}`;
+        return `{ size: [${k.join(", ")}],${u}x: ${x}, y: ${y}${z}},`;
       };
       return h(`
 `)(o);
@@ -553,8 +553,8 @@ class it {
   }
   _relayout() {
     if (!this.state.data) return;
-    this.g.selectAll(k(M)).selectAll(
-      k("foreignObject")
+    this.g.selectAll(v(M)).selectAll(
+      v("foreignObject")
     ).each(function(l) {
       var g;
       const h = (g = this.firstChild) == null ? void 0 : g.firstChild, d = [h.scrollWidth, h.scrollHeight];
@@ -622,9 +622,10 @@ class it {
       });
     }, x = (r) => u[g[r.state.id]] || o.state.rect, y = (r) => (l[g[r.state.id]] || o).state.rect;
     u[o.state.id] = o.state.rect, t && m(t);
-    const { highlight: v } = this.state;
-    let b = this.g.selectAll(k(ge)).selectAll(k("rect")).data(v ? [this._getHighlightRect(v)] : []).join("rect").attr("x", (r) => r.x).attr("y", (r) => r.y).attr("width", (r) => r.width).attr("height", (r) => r.height);
-    const z = this.g.selectAll(k(M)).each((r) => {
+    let { highlight: k } = this.state;
+    k && !l[k.state.id] && (k = void 0);
+    let b = this.g.selectAll(v(ge)).selectAll(v("rect")).data(k ? [this._getHighlightRect(k)] : []).join("rect").attr("x", (r) => r.x).attr("y", (r) => r.y).attr("width", (r) => r.width).attr("height", (r) => r.height);
+    const z = this.g.selectAll(v(M)).each((r) => {
       u[r.state.id] = r.state.rect;
     }).data(d, (r) => r.state.key), B = z.enter().append("g").attr("data-depth", (r) => r.state.depth).attr("data-path", (r) => r.state.path).each((r) => {
       m(l[h[r.state.id]]);
@@ -636,10 +637,10 @@ class it {
         var p;
         return ["markmap-node", ((p = r.payload) == null ? void 0 : p.fold) && "markmap-fold"].filter(Boolean).join(" ");
       }
-    ), F = S.selectAll(k("line")).data(
+    ), F = S.selectAll(v("line")).data(
       (r) => [r],
       (r) => r.state.key
-    ), L = F.enter().append("line").attr("stroke", (r) => s(r)).attr("stroke-width", 0), D = F.merge(L), $ = S.selectAll(k("circle")).data(
+    ), L = F.enter().append("line").attr("stroke", (r) => s(r)).attr("stroke-width", 0), D = F.merge(L), $ = S.selectAll(v("circle")).data(
       (r) => {
         var p;
         return (p = r.children) != null && p.length ? [r] : [];
@@ -651,7 +652,7 @@ class it {
         var p;
         return (p = r.payload) != null && p.fold && r.children ? s(r) : "var(--markmap-circle-open-bg)";
       }
-    ), W = this._observer, I = S.selectAll(k("foreignObject")).data(
+    ), W = this._observer, I = S.selectAll(v("foreignObject")).data(
       (r) => [r],
       (r) => r.state.key
     ), _ = I.enter().append("foreignObject").attr("class", "markmap-foreign").attr("x", i).attr("y", 0).style("opacity", 0).on("mousedown", T).on("dblclick", T);
@@ -661,7 +662,7 @@ class it {
       W.observe(r);
     });
     const P = C.selectAll(
-      k("foreignObject")
+      v("foreignObject")
     );
     P.each(function() {
       var p;
@@ -673,7 +674,7 @@ class it {
         var p;
         return (p = r.payload) != null && p.fold ? [] : r.children.map((f) => ({ source: r, target: f }));
       }
-    ), O = this.g.selectAll(k(pe)).data(st, (r) => r.target.state.key), ot = O.exit(), at = O.enter().insert("path", "g").attr("class", "markmap-link").attr("data-depth", (r) => r.target.state.depth).attr("data-path", (r) => r.target.state.path).attr("d", (r) => {
+    ), O = this.g.selectAll(v(pe)).data(st, (r) => r.target.state.key), ot = O.exit(), at = O.enter().insert("path", "g").attr("class", "markmap-link").attr("data-depth", (r) => r.target.state.depth).attr("data-path", (r) => r.target.state.path).attr("d", (r) => {
       const p = x(r.target), f = [
         p.x + p.width,
         p.y + p.height
@@ -683,7 +684,7 @@ class it {
     this.svg.style(
       "--markmap-max-width",
       a ? `${a}px` : null
-    ), await new Promise(requestAnimationFrame), this._relayout(), b = b.data(v ? [this._getHighlightRect(v)] : []).join("rect"), this.transition(b).attr("x", (r) => r.x).attr("y", (r) => r.y).attr("width", (r) => r.width).attr("height", (r) => r.height), B.attr("transform", (r) => {
+    ), await new Promise(requestAnimationFrame), this._relayout(), b = b.data(k ? [this._getHighlightRect(k)] : []).join("rect"), this.transition(b).attr("x", (r) => r.x).attr("y", (r) => r.y).attr("width", (r) => r.width).attr("height", (r) => r.height), B.attr("transform", (r) => {
       const p = x(r);
       return `translate(${p.x + p.width - r.state.rect.width},${p.y + p.height - r.state.rect.height})`;
     }), this.transition(C).attr("transform", (r) => {
@@ -694,11 +695,11 @@ class it {
       (r) => `translate(${r.state.rect.x},${r.state.rect.y})`
     );
     const lt = C.selectAll(
-      k("line")
+      v("line")
     );
     this.transition(lt).attr("x1", (r) => r.state.rect.width).attr("stroke-width", 0), L.attr("x1", (r) => r.state.rect.width).attr("x2", (r) => r.state.rect.width), D.attr("y1", (r) => r.state.rect.height + c(r) / 2).attr("y2", (r) => r.state.rect.height + c(r) / 2), this.transition(D).attr("x1", -1).attr("x2", (r) => r.state.rect.width + 2).attr("stroke", (r) => s(r)).attr("stroke-width", c);
     const ct = C.selectAll(
-      k("circle")
+      v("circle")
     );
     this.transition(ct).attr("r", 0).attr("stroke-width", 0), N.attr("cx", (r) => r.state.rect.width).attr("cy", (r) => r.state.rect.height + c(r) / 2), this.transition(N).attr("r", 6).attr("stroke-width", "1.5"), this.transition(P).style("opacity", 0), K.attr("width", (r) => Math.max(0, r.state.rect.width - i * 2)).attr("height", (r) => r.state.rect.height), this.transition(K).style("opacity", 1), this.transition(ot).attr("d", (r) => {
       const p = y(r.target), f = [
@@ -737,7 +738,7 @@ class it {
   }
   findElement(t) {
     let i;
-    return this.g.selectAll(k(M)).each(function(s) {
+    return this.g.selectAll(v(M)).each(function(s) {
       s === t && (i = {
         data: s,
         g: this
@@ -748,8 +749,8 @@ class it {
    * Pan the content to make the provided node visible in the viewport.
    */
   async ensureVisible(t, i) {
-    var v;
-    const n = (v = this.findElement(t)) == null ? void 0 : v.data;
+    var k;
+    const n = (k = this.findElement(t)) == null ? void 0 : k.data;
     if (!n) return;
     const s = this.svg.node(), a = s.getBoundingClientRect(), c = w(s), [o, l] = [
       n.state.rect.x,
@@ -809,7 +810,7 @@ class it {
 }
 export {
   it as Markmap,
-  k as childSelector,
+  v as childSelector,
   bt as defaultColorFn,
   J as defaultOptions,
   ke as deriveOptions,

package/dist/types.d.ts

@@ -10,6 +10,9 @@ export interface IMarkmapState {
         y2: number;
     };
 }
+/**
+ * Portable options that can be derived into `IMarkmapOptions`.
+ */
 export interface IMarkmapJSONOptions {
     color: string[];
     colorFreezeLevel: number;
@@ -28,6 +31,27 @@ export interface IMarkmapJSONOptions {
     zoom: boolean;
     lineWidth: number | number[];
 }
+export interface IMarkmapOptions {
+    autoFit: boolean;
+    duration: number;
+    embedGlobalCSS: boolean;
+    fitRatio: number;
+    id?: string;
+    initialExpandLevel: number;
+    maxInitialScale: number;
+    pan: boolean;
+    scrollForPan: boolean;
+    style?: (id: string) => string;
+    toggleRecursively: boolean;
+    zoom: boolean;
+    color: (node: INode) => string;
+    lineWidth: (node: INode) => number;
+    maxWidth: number;
+    nodeMinHeight: number;
+    paddingX: number;
+    spacingHorizontal: number;
+    spacingVertical: number;
+}
 export interface IPadding {
     left: number;
     right: number;

package/dist/util.d.ts

@@ -1,5 +1,4 @@
-import { IMarkmapOptions } from 'markmap-common';
-import { IMarkmapJSONOptions } from './types';
+import { IMarkmapJSONOptions, IMarkmapOptions } from './types';
 export declare function deriveOptions(jsonOptions?: Partial<IMarkmapJSONOptions>): Partial<IMarkmapOptions>;
 /**
  * Credit: https://gist.github.com/jlevy/c246006675becc446360a798e2b2d781?permalink_comment_id=4738050#gistcomment-4738050

package/dist/view.d.ts

@@ -1,6 +1,6 @@
 import type * as d3 from 'd3';
-import { Hook, IMarkmapOptions, INode, IPureNode } from 'markmap-common';
-import { ID3SVGElement, IMarkmapState, IPadding } from './types';
+import { Hook, INode, IPureNode } from 'markmap-common';
+import { ID3SVGElement, IMarkmapOptions, IMarkmapState, IPadding } from './types';
 export declare const globalCSS: string;
 /**
  * A global hook to refresh all markmaps when called.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "markmap-view",
-  "version": "0.18.8",
+  "version": "0.18.10-alpha.2+9487f11",
   "description": "View markmaps in browser",
   "author": "Gerald <gera2ld@live.com>",
   "license": "MIT",
@@ -46,10 +46,10 @@
     "@types/d3": "^7.4.0",
     "@types/d3-flextree": "^2.1.1",
     "d3-flextree": "^2.1.2",
-    "markmap-common": "0.18.8"
+    "markmap-common": "0.18.9"
   },
   "peerDependencies": {
     "markmap-common": "*"
   },
-  "gitHead": "476d2e8abb528af6f6f0c468c6c63791b7c1911a"
+  "gitHead": "9487f115b82c8eaee934c7f848faf67f05c700b1"
 }