markmap-view 0.18.4-alpha.4 → 0.18.4

package/dist/browser/index.js

@@ -1,5 +1,342 @@
 (function(exports, d32) {
   "use strict";
+  class Hook {
+    constructor() {
+      this.listeners = [];
+    }
+    tap(fn) {
+      this.listeners.push(fn);
+      return () => this.revoke(fn);
+    }
+    revoke(fn) {
+      const i = this.listeners.indexOf(fn);
+      if (i >= 0) this.listeners.splice(i, 1);
+    }
+    revokeAll() {
+      this.listeners.splice(0);
+    }
+    call(...args) {
+      for (const fn of this.listeners) {
+        fn(...args);
+      }
+    }
+  }
+  const uniqId = Math.random().toString(36).slice(2, 8);
+  let globalIndex = 0;
+  function getId() {
+    globalIndex += 1;
+    return `mm-${uniqId}-${globalIndex}`;
+  }
+  function noop() {
+  }
+  function walkTree(tree, callback) {
+    const walk = (item, parent) => callback(
+      item,
+      () => {
+        var _a;
+        return (_a = item.children) == null ? void 0 : _a.map((child) => walk(child, item));
+      },
+      parent
+    );
+    return walk(tree);
+  }
+  function addClass(className, ...rest) {
+    const classList = (className || "").split(" ").filter(Boolean);
+    rest.forEach((item) => {
+      if (item && classList.indexOf(item) < 0) classList.push(item);
+    });
+    return classList.join(" ");
+  }
+  function childSelector(filter) {
+    if (typeof filter === "string") {
+      const tagName = filter;
+      filter = (el) => el.tagName === tagName;
+    }
+    const filterFn = filter;
+    return function selector() {
+      let nodes = Array.from(this.childNodes);
+      if (filterFn) nodes = nodes.filter((node) => filterFn(node));
+      return nodes;
+    };
+  }
+  function defer() {
+    const obj = {};
+    obj.promise = new Promise((resolve, reject) => {
+      obj.resolve = resolve;
+      obj.reject = reject;
+    });
+    return obj;
+  }
+  function memoize(fn) {
+    const cache = {};
+    return function memoized(...args) {
+      const key = `${args[0]}`;
+      let data = cache[key];
+      if (!data) {
+        data = {
+          value: fn(...args)
+        };
+        cache[key] = data;
+      }
+      return data.value;
+    };
+  }
+  function debounce(fn, time) {
+    const state = {
+      timer: 0
+    };
+    function reset() {
+      if (state.timer) {
+        window.clearTimeout(state.timer);
+        state.timer = 0;
+      }
+    }
+    function run() {
+      reset();
+      if (state.args) state.result = fn(...state.args);
+    }
+    return function debounced(...args) {
+      reset();
+      state.args = args;
+      state.timer = window.setTimeout(run, time);
+      return state.result;
+    };
+  }
+  /*! @gera2ld/jsx-dom v2.2.2 | ISC License */
+  const VTYPE_ELEMENT = 1;
+  const VTYPE_FUNCTION = 2;
+  const SVG_NS = "http://www.w3.org/2000/svg";
+  const XLINK_NS = "http://www.w3.org/1999/xlink";
+  const NS_ATTRS = {
+    show: XLINK_NS,
+    actuate: XLINK_NS,
+    href: XLINK_NS
+  };
+  const isLeaf = (c) => typeof c === "string" || typeof c === "number";
+  const isElement = (c) => (c == null ? void 0 : c.vtype) === VTYPE_ELEMENT;
+  const isRenderFunction = (c) => (c == null ? void 0 : c.vtype) === VTYPE_FUNCTION;
+  function h(type, props, ...children) {
+    props = Object.assign({}, props, {
+      children: children.length === 1 ? children[0] : children
+    });
+    return jsx(type, props);
+  }
+  function jsx(type, props) {
+    let vtype;
+    if (typeof type === "string") vtype = VTYPE_ELEMENT;
+    else if (typeof type === "function") vtype = VTYPE_FUNCTION;
+    else throw new Error("Invalid VNode type");
+    return {
+      vtype,
+      type,
+      props
+    };
+  }
+  function Fragment(props) {
+    return props.children;
+  }
+  const DEFAULT_ENV = {
+    isSvg: false
+  };
+  function insertDom(parent, nodes) {
+    if (!Array.isArray(nodes)) nodes = [nodes];
+    nodes = nodes.filter(Boolean);
+    if (nodes.length) parent.append(...nodes);
+  }
+  function mountAttributes(domElement, props, env) {
+    for (const key in props) {
+      if (key === "key" || key === "children" || key === "ref") continue;
+      if (key === "dangerouslySetInnerHTML") {
+        domElement.innerHTML = props[key].__html;
+      } else if (key === "innerHTML" || key === "textContent" || key === "innerText" || key === "value" && ["textarea", "select"].includes(domElement.tagName)) {
+        const value = props[key];
+        if (value != null) domElement[key] = value;
+      } else if (key.startsWith("on")) {
+        domElement[key.toLowerCase()] = props[key];
+      } else {
+        setDOMAttribute(domElement, key, props[key], env.isSvg);
+      }
+    }
+  }
+  const attrMap = {
+    className: "class",
+    labelFor: "for"
+  };
+  function setDOMAttribute(el, attr, value, isSVG) {
+    attr = attrMap[attr] || attr;
+    if (value === true) {
+      el.setAttribute(attr, "");
+    } else if (value === false) {
+      el.removeAttribute(attr);
+    } else {
+      const namespace = isSVG ? NS_ATTRS[attr] : void 0;
+      if (namespace !== void 0) {
+        el.setAttributeNS(namespace, attr, value);
+      } else {
+        el.setAttribute(attr, value);
+      }
+    }
+  }
+  function flatten(arr) {
+    return arr.reduce((prev, item) => prev.concat(item), []);
+  }
+  function mountChildren(children, env) {
+    return Array.isArray(children) ? flatten(children.map((child) => mountChildren(child, env))) : mount(children, env);
+  }
+  function mount(vnode, env = DEFAULT_ENV) {
+    if (vnode == null || typeof vnode === "boolean") {
+      return null;
+    }
+    if (vnode instanceof Node) {
+      return vnode;
+    }
+    if (isRenderFunction(vnode)) {
+      const {
+        type,
+        props
+      } = vnode;
+      if (type === Fragment) {
+        const node = document.createDocumentFragment();
+        if (props.children) {
+          const children = mountChildren(props.children, env);
+          insertDom(node, children);
+        }
+        return node;
+      }
+      const childVNode = type(props);
+      return mount(childVNode, env);
+    }
+    if (isLeaf(vnode)) {
+      return document.createTextNode(`${vnode}`);
+    }
+    if (isElement(vnode)) {
+      let node;
+      const {
+        type,
+        props
+      } = vnode;
+      if (!env.isSvg && type === "svg") {
+        env = Object.assign({}, env, {
+          isSvg: true
+        });
+      }
+      if (!env.isSvg) {
+        node = document.createElement(type);
+      } else {
+        node = document.createElementNS(SVG_NS, type);
+      }
+      mountAttributes(node, props, env);
+      if (props.children) {
+        let childEnv = env;
+        if (env.isSvg && type === "foreignObject") {
+          childEnv = Object.assign({}, childEnv, {
+            isSvg: false
+          });
+        }
+        const children = mountChildren(props.children, childEnv);
+        if (children != null) insertDom(node, children);
+      }
+      const {
+        ref
+      } = props;
+      if (typeof ref === "function") ref(node);
+      return node;
+    }
+    throw new Error("mount: Invalid Vnode!");
+  }
+  function mountDom(vnode) {
+    return mount(vnode);
+  }
+  function hm(...args) {
+    return mountDom(h(...args));
+  }
+  const memoizedPreloadJS = memoize((url) => {
+    document.head.append(
+      hm("link", {
+        rel: "preload",
+        as: "script",
+        href: url
+      })
+    );
+  });
+  const jsCache = {};
+  const cssCache = {};
+  async function loadJSItem(item, context) {
+    var _a;
+    const src = item.type === "script" && ((_a = item.data) == null ? void 0 : _a.src) || "";
+    item.loaded || (item.loaded = jsCache[src]);
+    if (!item.loaded) {
+      const deferred = defer();
+      item.loaded = deferred.promise;
+      if (item.type === "script") {
+        document.head.append(
+          hm("script", {
+            ...item.data,
+            onLoad: () => deferred.resolve(),
+            onError: deferred.reject
+          })
+        );
+        if (!src) {
+          deferred.resolve();
+        } else {
+          jsCache[src] = item.loaded;
+        }
+      }
+      if (item.type === "iife") {
+        const { fn, getParams } = item.data;
+        fn(...(getParams == null ? void 0 : getParams(context)) || []);
+        deferred.resolve();
+      }
+    }
+    await item.loaded;
+  }
+  async function loadCSSItem(item) {
+    const url = item.type === "stylesheet" && item.data.href || "";
+    item.loaded || (item.loaded = cssCache[url]);
+    if (!item.loaded) {
+      const deferred = defer();
+      item.loaded = deferred.promise;
+      if (url) cssCache[url] = item.loaded;
+      if (item.type === "style") {
+        document.head.append(
+          hm("style", {
+            textContent: item.data
+          })
+        );
+        deferred.resolve();
+      } else if (url) {
+        document.head.append(
+          hm("link", {
+            rel: "stylesheet",
+            ...item.data
+          })
+        );
+        fetch(url).then((res) => {
+          if (res.ok) return res.text();
+          throw res;
+        }).then(() => deferred.resolve(), deferred.reject);
+      }
+    }
+    await item.loaded;
+  }
+  async function loadJS(items, context) {
+    items.forEach((item) => {
+      var _a;
+      if (item.type === "script" && ((_a = item.data) == null ? void 0 : _a.src)) {
+        memoizedPreloadJS(item.data.src);
+      }
+    });
+    context = {
+      getMarkmap: () => window.markmap,
+      ...context
+    };
+    for (const item of items) {
+      await loadJSItem(item, context);
+    }
+  }
+  async function loadCSS(items) {
+    await Promise.all(items.map((item) => loadCSSItem(item)));
+  }
   const isMacintosh = typeof navigator !== "undefined" && navigator.userAgent.includes("Macintosh");
   const defaultColorFn = d32.scaleOrdinal(d32.schemeCategory10);
   const defaultOptions = {
@@ -193,14 +530,14 @@
     return links;
   }
   function hierarchy(data, children) {
-    var root = new Node(data), valued = +data.value && (root.value = data.value), node, nodes = [root], child, childs, i, n;
+    var root = new Node$1(data), valued = +data.value && (root.value = data.value), node, nodes = [root], child, childs, i, n;
     if (children == null) children = defaultChildren;
     while (node = nodes.pop()) {
       if (valued) node.value = +node.data.value;
       if ((childs = children(node.data)) && (n = childs.length)) {
         node.children = new Array(n);
         for (i = n - 1; i >= 0; --i) {
-          nodes.push(child = node.children[i] = new Node(childs[i]));
+          nodes.push(child = node.children[i] = new Node$1(childs[i]));
           child.parent = node;
           child.depth = node.depth + 1;
         }
@@ -223,13 +560,13 @@
       node.height = height;
     while ((node = node.parent) && node.height < ++height);
   }
-  function Node(data) {
+  function Node$1(data) {
     this.data = data;
     this.depth = this.height = 0;
     this.parent = null;
   }
-  Node.prototype = hierarchy.prototype = {
-    constructor: Node,
+  Node$1.prototype = hierarchy.prototype = {
+    constructor: Node$1,
     count: node_count,
     each: node_each,
     eachAfter: node_eachAfter,
@@ -605,86 +942,6 @@
       next: lastLows
     };
   };
-  class Hook {
-    constructor() {
-      this.listeners = [];
-    }
-    tap(fn) {
-      this.listeners.push(fn);
-      return () => this.revoke(fn);
-    }
-    revoke(fn) {
-      const i = this.listeners.indexOf(fn);
-      if (i >= 0) this.listeners.splice(i, 1);
-    }
-    revokeAll() {
-      this.listeners.splice(0);
-    }
-    call(...args) {
-      for (const fn of this.listeners) {
-        fn(...args);
-      }
-    }
-  }
-  const uniqId = Math.random().toString(36).slice(2, 8);
-  let globalIndex = 0;
-  function getId() {
-    globalIndex += 1;
-    return `mm-${uniqId}-${globalIndex}`;
-  }
-  function noop() {
-  }
-  function walkTree(tree, callback) {
-    const walk = (item, parent) => callback(
-      item,
-      () => {
-        var _a;
-        return (_a = item.children) == null ? void 0 : _a.map((child) => walk(child, item));
-      },
-      parent
-    );
-    return walk(tree);
-  }
-  function addClass(className, ...rest) {
-    const classList = (className || "").split(" ").filter(Boolean);
-    rest.forEach((item) => {
-      if (item && classList.indexOf(item) < 0) classList.push(item);
-    });
-    return classList.join(" ");
-  }
-  function childSelector(filter) {
-    if (typeof filter === "string") {
-      const tagName = filter;
-      filter = (el) => el.tagName === tagName;
-    }
-    const filterFn = filter;
-    return function selector() {
-      let nodes = Array.from(this.childNodes);
-      if (filterFn) nodes = nodes.filter((node) => filterFn(node));
-      return nodes;
-    };
-  }
-  function debounce(fn, time) {
-    const state = {
-      timer: 0
-    };
-    function reset() {
-      if (state.timer) {
-        window.clearTimeout(state.timer);
-        state.timer = 0;
-      }
-    }
-    function run() {
-      reset();
-      if (state.args) state.result = fn(...state.args);
-    }
-    return function debounced(...args) {
-      reset();
-      state.args = args;
-      state.timer = window.setTimeout(run, time);
-      return state.result;
-    };
-  }
   const css = ".markmap {\n  --markmap-max-width: 9999px;\n  --markmap-a-color: #0097e6;\n  --markmap-a-hover-color: #00a8ff;\n  --markmap-code-bg: #f0f0f0;\n  --markmap-code-color: #555;\n  --markmap-highlight-bg: #ffeaa7;\n  --markmap-table-border: 1px solid currentColor;\n  --markmap-font: 300 16px/20px sans-serif;\n  --markmap-circle-open-bg: #fff;\n  --markmap-text-color: #333;\n\n  font: var(--markmap-font);\n  color: var(--markmap-text-color);\n}\n\n  .markmap-link {\n    fill: none;\n  }\n\n  .markmap-node > circle {\n      cursor: pointer;\n    }\n\n  .markmap-foreign {\n    display: inline-block;\n  }\n\n  .markmap-foreign p {\n      margin: 0;\n    }\n\n  .markmap-foreign a {\n      color: var(--markmap-a-color);\n    }\n\n  .markmap-foreign a:hover {\n        color: var(--markmap-a-hover-color);\n      }\n\n  .markmap-foreign code {\n      padding: 0.25em;\n      font-size: calc(1em - 2px);\n      color: var(--markmap-code-color);\n      background-color: var(--markmap-code-bg);\n      border-radius: 2px;\n    }\n\n  .markmap-foreign pre {\n      margin: 0;\n    }\n\n  .markmap-foreign pre > code {\n        display: block;\n      }\n\n  .markmap-foreign del {\n      text-decoration: line-through;\n    }\n\n  .markmap-foreign em {\n      font-style: italic;\n    }\n\n  .markmap-foreign strong {\n      font-weight: bold;\n    }\n\n  .markmap-foreign mark {\n      background: var(--markmap-highlight-bg);\n    }\n\n  .markmap-foreign table,\n    .markmap-foreign th,\n    .markmap-foreign td {\n      border-collapse: collapse;\n      border: var(--markmap-table-border);\n    }\n\n  .markmap-foreign img {\n      display: inline-block;\n    }\n\n  .markmap-foreign svg {\n      fill: currentColor;\n    }\n\n  .markmap-foreign > div {\n      width: var(--markmap-max-width);\n      text-align: left;\n    }\n\n  .markmap-foreign > div > div {\n        display: inline-block;\n      }\n\n.markmap-dark .markmap {\n  --markmap-code-bg: #1a1b26;\n  --markmap-code-color: #ddd;\n  --markmap-circle-open-bg: #444;\n  --markmap-text-color: #eee;\n}\n";
   const globalCSS = css;
   const linkShape = d32.linkHorizontal();
@@ -1184,6 +1441,8 @@
   exports.deriveOptions = deriveOptions;
   exports.globalCSS = globalCSS;
   exports.isMacintosh = isMacintosh;
+  exports.loadCSS = loadCSS;
+  exports.loadJS = loadJS;
   exports.refreshHook = refreshHook;
   exports.simpleHash = simpleHash;
   Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+export { loadJS, loadCSS } from 'markmap-common';
 export * from './types';
 export * from './constants';
 export * from './util';

package/dist/index.js

@@ -1,6 +1,7 @@
-import { scaleOrdinal as G, schemeCategory10 as at, linkHorizontal as lt, zoomTransform as w, select as ct, zoom as ht, min as P, max as W, zoomIdentity as dt, minIndex as pt } from "d3";
-import { Hook as ut, getId as mt, debounce as gt, addClass as ft, walkTree as C, childSelector as v, noop as S } from "markmap-common";
-const V = typeof navigator < "u" && navigator.userAgent.includes("Macintosh"), xt = G(at), U = {
+import { Hook as at, getId as lt, debounce as ct, addClass as ht, walkTree as C, childSelector as v, noop as w } from "markmap-common";
+import { loadCSS as xe, loadJS as ye } from "markmap-common";
+import { scaleOrdinal as G, schemeCategory10 as dt, linkHorizontal as pt, zoomTransform as S, select as ut, zoom as mt, min as P, max as W, zoomIdentity as gt, minIndex as ft } from "d3";
+const V = typeof navigator < "u" && navigator.userAgent.includes("Macintosh"), xt = G(dt), U = {
   autoFit: !1,
   color: (e) => {
     var t;
@@ -96,13 +97,13 @@ function Et(e) {
     e(t);
   return this;
 }
-function wt(e) {
+function Ct(e) {
   return this.eachAfter(function(t) {
     for (var s = +e(t.data) || 0, n = t.children, o = n && n.length; --o >= 0; ) s += n[o].value;
     t.value = s;
   });
 }
-function Ct(e) {
+function wt(e) {
   return this.eachBefore(function(t) {
     t.children && t.children.sort(e);
   });
@@ -176,8 +177,8 @@ R.prototype = B.prototype = {
   each: bt,
   eachAfter: Et,
   eachBefore: zt,
-  sum: wt,
-  sort: Ct,
+  sum: Ct,
+  sort: wt,
   path: St,
   ancestors: Xt,
   descendants: Mt,
@@ -446,18 +447,18 @@ const q = (e, t = 0) => (e.y = t, (e.children || []).reduce((s, n) => {
     index: t,
     next: s
   };
-}, Q = ".markmap{--markmap-max-width: 9999px;--markmap-a-color: #0097e6;--markmap-a-hover-color: #00a8ff;--markmap-code-bg: #f0f0f0;--markmap-code-color: #555;--markmap-highlight-bg: #ffeaa7;--markmap-table-border: 1px solid currentColor;--markmap-font: 300 16px/20px sans-serif;--markmap-circle-open-bg: #fff;--markmap-text-color: #333;font:var(--markmap-font);color:var(--markmap-text-color)}.markmap-link{fill:none}.markmap-node>circle{cursor:pointer}.markmap-foreign{display:inline-block}.markmap-foreign p{margin:0}.markmap-foreign a{color:var(--markmap-a-color)}.markmap-foreign a:hover{color:var(--markmap-a-hover-color)}.markmap-foreign code{padding:.25em;font-size:calc(1em - 2px);color:var(--markmap-code-color);background-color:var(--markmap-code-bg);border-radius:2px}.markmap-foreign pre{margin:0}.markmap-foreign pre>code{display:block}.markmap-foreign del{text-decoration:line-through}.markmap-foreign em{font-style:italic}.markmap-foreign strong{font-weight:700}.markmap-foreign mark{background:var(--markmap-highlight-bg)}.markmap-foreign table,.markmap-foreign th,.markmap-foreign td{border-collapse:collapse;border:var(--markmap-table-border)}.markmap-foreign img{display:inline-block}.markmap-foreign svg{fill:currentColor}.markmap-foreign>div{width:var(--markmap-max-width);text-align:left}.markmap-foreign>div>div{display:inline-block}.markmap-dark .markmap{--markmap-code-bg: #1a1b26;--markmap-code-color: #ddd;--markmap-circle-open-bg: #444;--markmap-text-color: #eee}", me = Q, j = lt();
+}, Q = ".markmap{--markmap-max-width: 9999px;--markmap-a-color: #0097e6;--markmap-a-hover-color: #00a8ff;--markmap-code-bg: #f0f0f0;--markmap-code-color: #555;--markmap-highlight-bg: #ffeaa7;--markmap-table-border: 1px solid currentColor;--markmap-font: 300 16px/20px sans-serif;--markmap-circle-open-bg: #fff;--markmap-text-color: #333;font:var(--markmap-font);color:var(--markmap-text-color)}.markmap-link{fill:none}.markmap-node>circle{cursor:pointer}.markmap-foreign{display:inline-block}.markmap-foreign p{margin:0}.markmap-foreign a{color:var(--markmap-a-color)}.markmap-foreign a:hover{color:var(--markmap-a-hover-color)}.markmap-foreign code{padding:.25em;font-size:calc(1em - 2px);color:var(--markmap-code-color);background-color:var(--markmap-code-bg);border-radius:2px}.markmap-foreign pre{margin:0}.markmap-foreign pre>code{display:block}.markmap-foreign del{text-decoration:line-through}.markmap-foreign em{font-style:italic}.markmap-foreign strong{font-weight:700}.markmap-foreign mark{background:var(--markmap-highlight-bg)}.markmap-foreign table,.markmap-foreign th,.markmap-foreign td{border-collapse:collapse;border:var(--markmap-table-border)}.markmap-foreign img{display:inline-block}.markmap-foreign svg{fill:currentColor}.markmap-foreign>div{width:var(--markmap-max-width);text-align:left}.markmap-foreign>div>div{display:inline-block}.markmap-dark .markmap{--markmap-code-bg: #1a1b26;--markmap-code-color: #ddd;--markmap-circle-open-bg: #444;--markmap-text-color: #eee}", me = Q, j = pt();
 function I(e) {
   return Math.max(4 - 2 * e.state.depth, 1.5);
 }
 function K(e, t) {
-  const s = pt(e, t);
+  const s = ft(e, t);
   return e[s];
 }
 function O(e) {
   e.stopPropagation();
 }
-const le = new ut();
+const le = new at();
 class tt {
   constructor(t, s) {
     this.options = U, this.revokers = [], this.handleZoom = (n) => {
@@ -465,7 +466,7 @@ class tt {
       this.g.attr("transform", o);
     }, this.handlePan = (n) => {
       n.preventDefault();
-      const o = w(this.svg.node()), a = o.translate(
+      const o = S(this.svg.node()), a = o.translate(
         -n.deltaX / o.k,
         -n.deltaY / o.k
       );
@@ -473,11 +474,11 @@ class tt {
     }, this.handleClick = (n, o) => {
       let a = this.options.toggleRecursively;
       (V ? n.metaKey : n.ctrlKey) && (a = !a), this.toggleNode(o, a);
-    }, this.ensureView = this.ensureVisible, this.svg = t.datum ? t : ct(t), this.styleNode = this.svg.append("style"), this.zoom = ht().filter((n) => this.options.scrollForPan && n.type === "wheel" ? n.ctrlKey && !n.button : (!n.ctrlKey || n.type === "wheel") && !n.button).on("zoom", this.handleZoom), this.setOptions(s), this.state = {
-      id: this.options.id || this.svg.attr("id") || mt(),
+    }, this.ensureView = this.ensureVisible, this.svg = t.datum ? t : ut(t), this.styleNode = this.svg.append("style"), this.zoom = mt().filter((n) => this.options.scrollForPan && n.type === "wheel" ? n.ctrlKey && !n.button : (!n.ctrlKey || n.type === "wheel") && !n.button).on("zoom", this.handleZoom), this.setOptions(s), this.state = {
+      id: this.options.id || this.svg.attr("id") || lt(),
       rect: { x1: 0, y1: 0, x2: 0, y2: 0 }
     }, this.g = this.svg.append("g"), this.observer = new ResizeObserver(
-      gt(() => {
+      ct(() => {
         this.renderData();
       }, 100)
     ), this.revokers.push(
@@ -495,7 +496,7 @@ class tt {
   updateStyle() {
     this.svg.attr(
       "class",
-      ft(this.svg.attr("class"), "markmap", this.state.id)
+      ht(this.svg.attr("class"), "markmap", this.state.id)
     );
     const t = this.getStyleContent();
     this.styleNode.text(t);
@@ -702,11 +703,11 @@ class tt {
       n / h * a,
       o / u * a,
       t
-    ), g = dt.translate(
+    ), g = gt.translate(
       (n - h * m) / 2 - l * m,
       (o - u * m) / 2 - r * m
     ).scale(m);
-    return this.transition(this.svg).call(this.zoom.transform, g).end().catch(S);
+    return this.transition(this.svg).call(this.zoom.transform, g).end().catch(w);
   }
   findElement(t) {
     let s;
@@ -724,7 +725,7 @@ class tt {
     var b;
     const n = (b = this.findElement(t)) == null ? void 0 : b.data;
     if (!n) return;
-    const o = this.svg.node(), a = o.getBoundingClientRect(), l = w(o), [r, c] = [
+    const o = this.svg.node(), a = o.getBoundingClientRect(), l = S(o), [r, c] = [
       n.state.rect.x,
       n.state.rect.x + n.state.rect.width + 2
     ].map((k) => k * l.k + l.x), [p, h] = [
@@ -739,14 +740,14 @@ class tt {
     }, m = [u.left - r, a.width - u.right - c], g = [u.top - p, a.height - u.bottom - h], y = m[0] * m[1] > 0 ? K(m, Math.abs) / l.k : 0, x = g[0] * g[1] > 0 ? K(g, Math.abs) / l.k : 0;
     if (y || x) {
       const k = l.translate(y, x);
-      return this.transition(this.svg).call(this.zoom.transform, k).end().catch(S);
+      return this.transition(this.svg).call(this.zoom.transform, k).end().catch(w);
     }
   }
   async centerNode(t, s) {
     var y;
     const n = (y = this.findElement(t)) == null ? void 0 : y.data;
     if (!n) return;
-    const o = this.svg.node(), a = o.getBoundingClientRect(), l = w(o), r = (n.state.rect.x + n.state.rect.width / 2) * l.k + l.x, c = (n.state.rect.y + n.state.rect.height / 2) * l.k + l.y, p = {
+    const o = this.svg.node(), a = o.getBoundingClientRect(), l = S(o), r = (n.state.rect.x + n.state.rect.width / 2) * l.k + l.x, c = (n.state.rect.y + n.state.rect.height / 2) * l.k + l.y, p = {
       left: 0,
       right: 0,
       top: 0,
@@ -755,18 +756,18 @@ class tt {
     }, h = (p.left + a.width - p.right) / 2, u = (p.top + a.height - p.bottom) / 2, m = (h - r) / l.k, g = (u - c) / l.k;
     if (m || g) {
       const x = l.translate(m, g);
-      return this.transition(this.svg).call(this.zoom.transform, x).end().catch(S);
+      return this.transition(this.svg).call(this.zoom.transform, x).end().catch(w);
     }
   }
   /**
    * Scale content with it pinned at the center of the viewport.
    */
   async rescale(t) {
-    const s = this.svg.node(), { width: n, height: o } = s.getBoundingClientRect(), a = n / 2, l = o / 2, r = w(s), c = r.translate(
+    const s = this.svg.node(), { width: n, height: o } = s.getBoundingClientRect(), a = n / 2, l = o / 2, r = S(s), c = r.translate(
       (a - r.x) * (1 - t) / r.k,
       (l - r.y) * (1 - t) / r.k
     ).scale(t);
-    return this.transition(this.svg).call(this.zoom.transform, c).end().catch(S);
+    return this.transition(this.svg).call(this.zoom.transform, c).end().catch(w);
   }
   destroy() {
     this.svg.on(".zoom", null), this.svg.html(null), this.revokers.forEach((t) => {
@@ -787,6 +788,8 @@ export {
   ue as deriveOptions,
   me as globalCSS,
   V as isMacintosh,
+  xe as loadCSS,
+  ye as loadJS,
   le as refreshHook,
   yt as simpleHash
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "markmap-view",
-  "version": "0.18.4-alpha.4+8f90d3c",
+  "version": "0.18.4",
   "description": "View markmaps in browser",
   "author": "Gerald <gera2ld@live.com>",
   "license": "MIT",
@@ -46,10 +46,10 @@
   },
   "devDependencies": {
     "@types/d3-flextree": "^2.1.1",
-    "markmap-common": "0.18.0"
+    "markmap-common": "0.18.4"
   },
   "peerDependencies": {
     "markmap-common": "*"
   },
-  "gitHead": "8f90d3cef5816b56ad80fc1db35caea8df330789"
+  "gitHead": "eb77f9eb79a44d60237f9a9cdadf0a7ca7fa9e29"
 }