markmap-toolbar 0.1.6 → 0.13.0

package/dist/index.esm.js

@@ -1,15 +1,36 @@
-/*! markmap-toolbar v0.1.6 | MIT License */
-import * as React from '@gera2ld/jsx-dom';
+/*! markmap-toolbar v0.13.0 | MIT License */
+import { mountDom } from '@gera2ld/jsx-dom';
+import { jsx, jsxs } from '@gera2ld/jsx-dom/jsx-runtime';
+
+function _extends() {
+  _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends.apply(this, arguments);
+}
 
 function renderBrand() {
-  return /*#__PURE__*/React.createElement("div", {
-    className: "mm-toolbar-brand"
-  }, /*#__PURE__*/React.createElement("img", {
-    alt: "markmap",
-    src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAACoFBMVEUAAAAAAAD//wAAAACAgAD//wAAAABVVQCqqgBAQACAQACAgABmZgBtbQAAAABgQABgYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaFQAAAAAAAAAAAAAAAAAHAAARBQIdGAIYEwI/OgJYUQUfHQI+OgJDPgJJRARBPQRJQgRRSwRRTQRIQQRUTgRUUARZUgRSTQRPSQRjWgZORQRfWQZsZAhTTQRNRwRWUAZkXAZOSARUTgZPRwRRSQRoYwZWUQZWTgRbUwZmXQZoXghmXwdqYwdsYwdfVwVmXQdqYgdiWgVpYAl3bgl6cgl4cAqLggw8OAOWjA2Uig1OSAR2bQihlg55cAh5cAh6cQmMgwyOhAyUjA2QhQ2Uiw2Viw2soBCflA+voxGwpRGhlg+hlg+snxGroBGjmBCpnBC0pxKyphKxpRG2qhK0qBK5rBK5rBP/7h3/8B7/8R3/8h3/8R7/8h786x397B3+7R3EtxT66Rz66hz76hz86xz96xz97Bz+7Rz45xz56Bz76hz97Bz97B3MvRX15Rv25Rv45xz66Rz76hz97B3+7R3IuxX05Bv15Bv25Rz56Bz66Ry/sxPAsxPCtRTCthTNvxbZyxfczxfi0xjl1Rnn2Bnr2xrr3Brs3Rru3Rru3xrv3hrw3xrx4Bvx4Rvy4hvz4hvz4xv04xv05Bv14xv15Bv15Rv25Bv25Rv25Rz25hv35hv35xv45xv45xz55xz56Bv56Bz66Rv66Rz76Rv76Rz76hz86hv86xz+7h3/7R3/7h3/7x3/8B3/8B7/8R3/8R4Yqhj5AAAAq3RSTlMAAQECAgIDAwMEBAQFBwgICAwQERITFRYXGBkbHB0eHyQlJyguNTg8RUZISU5PV2FiY2RlZmdqa2xubnJzc3R2d3d3eXl5eXp7fH1+gIGCgoKDg4SEhIWGh4eHiYmJjIyMjZSUlJ+sra+zt7i4uru8ztHV1tbW2d7g4OHi4uPk5ufp7Ozv9fX29/f3+Pj6+vr7+/v7+/v7+/z8/Pz8/f39/f39/f3+/v7+/v7K6J1dAAACHklEQVQ4y2NgwAoYWdi5uLm5GXHIcrLCmMzYpDmAhKCKjoGtp40MFhVsDAwSxmmVEzZu2XvqSLkchjw3g0h445Ybd24vmTN1Usd5X3R5DgaNqgN35sycP2/GxMkTMRVwMOivvtO3YsWUm3duX790EcMKdgbNNXdnnJh1+9T6ipzU+FB0RzIyiFYB5WdfaElUF8TmTQ6GwH39J2bvypMHcpg4MAKKkUGo5s6KWRfyGRh4WJClGEGBCgS8DLobliy/3abMwM8NBYwQjXDgf3ryxOspyKYyg+RFTFwdnYDAzbrw+oLFm9Ot3J3AwNHFTBykQrhg++GDh48cOXzk4P6VZy8s230MyAGCwwcP7iyRBJpiur1n8hQIWHX27NkLi6bAwOSuow5ABeY7OydOhoCFIAULe6E8YFCf8QAqEC86evniZTA4tfLsuRXHr0E4ly9ePF0uC3KnpH1MZBQQxPoVgxyZ5RMdBQaRMc6yIEcihWbQGaA3k9G8CfQoN0pAtSoxCMACihk9qGtBQZ2LHtRIkRUMiqwd2TJADiswsrjQlAGju/o+MLrPNkWo8mFN1ewMWmvBCebQ0rKMJG87QzF0FRwMRuvugpLcrXu3rp7Zs61UCtMZ2nVHbk+fMX/+jMmTp3Sf9MLiULG45q237txaPG3yxPYrYQzYMo60RWbD3E27Ll68Uq+AK+uJqOlZBiSEKGLNnMA0iDfzwrI/NKgBOivk9piPdtUAAAAASUVORK5CYII="
-  }), /*#__PURE__*/React.createElement("a", {
-    href: "https://markmap.js.org/"
-  }, "markmap"));
+  return jsxs("div", {
+    className: "mm-toolbar-brand",
+    children: [jsx("img", {
+      alt: "markmap",
+      src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAACoFBMVEUAAAAAAAD//wAAAACAgAD//wAAAABVVQCqqgBAQACAQACAgABmZgBtbQAAAABgQABgYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaFQAAAAAAAAAAAAAAAAAHAAARBQIdGAIYEwI/OgJYUQUfHQI+OgJDPgJJRARBPQRJQgRRSwRRTQRIQQRUTgRUUARZUgRSTQRPSQRjWgZORQRfWQZsZAhTTQRNRwRWUAZkXAZOSARUTgZPRwRRSQRoYwZWUQZWTgRbUwZmXQZoXghmXwdqYwdsYwdfVwVmXQdqYgdiWgVpYAl3bgl6cgl4cAqLggw8OAOWjA2Uig1OSAR2bQihlg55cAh5cAh6cQmMgwyOhAyUjA2QhQ2Uiw2Viw2soBCflA+voxGwpRGhlg+hlg+snxGroBGjmBCpnBC0pxKyphKxpRG2qhK0qBK5rBK5rBP/7h3/8B7/8R3/8h3/8R7/8h786x397B3+7R3EtxT66Rz66hz76hz86xz96xz97Bz+7Rz45xz56Bz76hz97Bz97B3MvRX15Rv25Rv45xz66Rz76hz97B3+7R3IuxX05Bv15Bv25Rz56Bz66Ry/sxPAsxPCtRTCthTNvxbZyxfczxfi0xjl1Rnn2Bnr2xrr3Brs3Rru3Rru3xrv3hrw3xrx4Bvx4Rvy4hvz4hvz4xv04xv05Bv14xv15Bv15Rv25Bv25Rv25Rz25hv35hv35xv45xv45xz55xz56Bv56Bz66Rv66Rz76Rv76Rz76hz86hv86xz+7h3/7R3/7h3/7x3/8B3/8B7/8R3/8R4Yqhj5AAAAq3RSTlMAAQECAgIDAwMEBAQFBwgICAwQERITFRYXGBkbHB0eHyQlJyguNTg8RUZISU5PV2FiY2RlZmdqa2xubnJzc3R2d3d3eXl5eXp7fH1+gIGCgoKDg4SEhIWGh4eHiYmJjIyMjZSUlJ+sra+zt7i4uru8ztHV1tbW2d7g4OHi4uPk5ufp7Ozv9fX29/f3+Pj6+vr7+/v7+/v7+/z8/Pz8/f39/f39/f3+/v7+/v7K6J1dAAACHklEQVQ4y2NgwAoYWdi5uLm5GXHIcrLCmMzYpDmAhKCKjoGtp40MFhVsDAwSxmmVEzZu2XvqSLkchjw3g0h445Ybd24vmTN1Usd5X3R5DgaNqgN35sycP2/GxMkTMRVwMOivvtO3YsWUm3duX790EcMKdgbNNXdnnJh1+9T6ipzU+FB0RzIyiFYB5WdfaElUF8TmTQ6GwH39J2bvypMHcpg4MAKKkUGo5s6KWRfyGRh4WJClGEGBCgS8DLobliy/3abMwM8NBYwQjXDgf3ryxOspyKYyg+RFTFwdnYDAzbrw+oLFm9Ot3J3AwNHFTBykQrhg++GDh48cOXzk4P6VZy8s230MyAGCwwcP7iyRBJpiur1n8hQIWHX27NkLi6bAwOSuow5ABeY7OydOhoCFIAULe6E8YFCf8QAqEC86evniZTA4tfLsuRXHr0E4ly9ePF0uC3KnpH1MZBQQxPoVgxyZ5RMdBQaRMc6yIEcihWbQGaA3k9G8CfQoN0pAtSoxCMACihk9qGtBQZ2LHtRIkRUMiqwd2TJADiswsrjQlAGju/o+MLrPNkWo8mFN1ewMWmvBCebQ0rKMJG87QzF0FRwMRuvugpLcrXu3rp7Zs61UCtMZ2nVHbk+fMX/+jMmTp3Sf9MLiULG45q237txaPG3yxPYrYQzYMo60RWbD3E27Ll68Uq+AK+uJqOlZBiSEKGLNnMA0iDfzwrI/NKgBOivk9piPdtUAAAAASUVORK5CYII="
+    }), jsx("a", {
+      href: "https://markmap.js.org/",
+      children: "markmap"
+    })]
+  });
 }
 
 function renderItem({
@@ -17,11 +38,11 @@ function renderItem({
   content,
   onClick
 }) {
-  return /*#__PURE__*/React.createElement("div", {
+  return jsx("div", {
     className: "mm-toolbar-item",
     title: title,
-    innerHTML: content,
-    onClick: onClick
+    onClick: onClick,
+    children: content
   });
 }
 
@@ -47,8 +68,20 @@ class Toolbar {
     return toolbar.render();
   }
 
-  static icon(path) {
-    return `<svg width="20" height="20" viewBox="0 0 20 20" on:click={onZoomIn}><path fill="none" stroke-width="2" stroke="currentColor" d="${path}"/></svg>`;
+  static icon(path, attrs = {}) {
+    attrs = _extends({
+      stroke: 'none',
+      fill: 'currentColor',
+      'fill-rule': 'evenodd'
+    }, attrs);
+    return jsx("svg", {
+      width: "20",
+      height: "20",
+      viewBox: "0 0 20 20",
+      children: jsx("path", _extends({}, attrs, {
+        d: path
+      }))
+    });
   }
 
   constructor() {
@@ -59,19 +92,19 @@ class Toolbar {
     this.register({
       id: 'zoomIn',
       title: 'Zoom in',
-      content: Toolbar.icon('M10 6 v8 M6 10 h8'),
+      content: Toolbar.icon('M9 5v4h-4v2h4v4h2v-4h4v-2h-4v-4z'),
       onClick: this.getHandler(mm => mm.rescale(1.25))
     });
     this.register({
       id: 'zoomOut',
       title: 'Zoom out',
-      content: Toolbar.icon('M6 10 h8'),
+      content: Toolbar.icon('M5 9h10v2h-10z'),
       onClick: this.getHandler(mm => mm.rescale(0.8))
     });
     this.register({
       id: 'fit',
       title: 'Fit window size',
-      content: Toolbar.icon('M4 8 h3 v-3 M4 12 h3 v3 M16 8 h-3 v-3 M16 12 h-3 v3'),
+      content: Toolbar.icon('M4 7h2v-2h2v4h-4zM4 13h2v2h2v-4h-4zM16 7h-2v-2h-2v4h4zM16 13h-2v2h-2v-4h4z'),
       onClick: this.getHandler(mm => mm.fit())
     });
   }
@@ -86,7 +119,7 @@ class Toolbar {
 
   getHandler(handle) {
     handle = safeCaller(handle);
-    return e => {
+    return () => {
       if (this.markmap) handle(this.markmap);
     };
   }
@@ -109,9 +142,10 @@ class Toolbar {
 
       return item;
     }).filter(Boolean);
-    return /*#__PURE__*/React.createElement("div", {
-      className: "mm-toolbar"
-    }, this.showBrand && renderBrand(), items.map(renderItem));
+    return mountDom(jsxs("div", {
+      className: "mm-toolbar",
+      children: [this.showBrand && renderBrand(), items.map(renderItem)]
+    }));
   }
 
 }

package/dist/index.umd.js

@@ -1,119 +1,271 @@
-/*! markmap-toolbar v0.1.6 | MIT License */
+/*! markmap-toolbar v0.13.0 | MIT License */
 (function (global, factory) {
 typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
 typeof define === 'function' && define.amd ? define(['exports'], factory) :
 (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.markmap = global.markmap || {}));
-}(this, (function (exports) { 'use strict';
-
-/*! @gera2ld/jsx-dom v1.2.1 | ISC License */
-var propRules = ['innerHTML', 'innerText', 'textContent', {
-  key: 'value',
-  tag: 'textarea'
-}];
-var Fragment = {
-  name: 'Fragment'
-};
+})(this, (function (exports) { 'use strict';
 
-function createElement(tag, props) {
-  var result;
-  var ref;
+function _extends() {
+  _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
 
-  if (tag === Fragment) {
-    result = document.createDocumentFragment();
-  } else if (typeof tag !== 'string') {
-    throw new Error("Invalid element type: " + tag);
-  } else {
-    var _el = createElement.createElement(tag);
-
-    result = _el;
-
-    if (props) {
-      Object.keys(props).forEach(function (key) {
-        var value = props[key];
-        if (value == null) return;
-
-        if (key.startsWith('on')) {
-          _el.addEventListener(key.slice(2).toLowerCase(), value);
-        } else if (key === 'children') {
-          renderChildren(_el, value);
-        } else if (key === 'style' && typeof value === 'object') {
-          renderStyle(_el, value);
-        } else if (key === 'dangerouslySetInnerHTML' && value) {
-          _el.innerHTML = value.__html || ''; // eslint-disable-line no-underscore-dangle
-        } else if (key === 'ref' && typeof value === 'function') {
-          ref = value;
-        } else if (typeof value === 'boolean') {
-          if (value) _el.setAttribute(key, key);else _el.removeAttribute(key);
-        } else if (isProp(tag, key)) {
-          _el[key] = value;
-        } else {
-          if (key === 'className') key = 'class';else if (key === 'labelFor') key = 'for';
-
-          _el.setAttribute(key, "" + value);
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
         }
-      });
+      }
     }
-  }
 
-  for (var _len = arguments.length, children = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
-    children[_key - 2] = arguments[_key];
-  }
+    return target;
+  };
 
-  renderChildren(result, children);
-  if (ref) ref(result);
-  return result;
+  return _extends.apply(this, arguments);
 }
 
-createElement.createElement = function (tag) {
-  return document.createElement(tag);
+/*! @gera2ld/jsx-dom v2.1.1 | ISC License */
+var VTYPE_ELEMENT = 1;
+var VTYPE_FUNCTION = 2;
+var MOUNT_SINGLE = 1;
+var MOUNT_ARRAY = 4;
+var SVG_NS = 'http://www.w3.org/2000/svg';
+var XLINK_NS = 'http://www.w3.org/1999/xlink';
+var NS_ATTRS = {
+  show: XLINK_NS,
+  actuate: XLINK_NS,
+  href: XLINK_NS
+};
+
+var isLeaf = function isLeaf(c) {
+  return typeof c === 'string' || typeof c === 'number';
+};
+
+var isElement = function isElement(c) {
+  return (c == null ? void 0 : c.vtype) === VTYPE_ELEMENT;
 };
 
-function isProp(tag, key) {
-  var ctx = {
-    tag: tag,
-    key: key
+var isRenderFunction = function isRenderFunction(c) {
+  return (c == null ? void 0 : c.vtype) === VTYPE_FUNCTION;
+};
+
+function jsx(type, props) {
+  var 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: vtype,
+    type: type,
+    props: props
   };
-  return propRules.some(function (rule) {
-    if (typeof rule === 'string') return key === rule;
-    return Object.keys(rule).every(function (rk) {
-      return rule[rk] === ctx[rk];
+}
+
+var jsxs = jsx;
+
+function Fragment(props) {
+  return props.children;
+}
+
+var DEFAULT_ENV = {
+  isSvg: false
+};
+
+function insertDom(parent, ref) {
+  if (ref.type === MOUNT_SINGLE) {
+    if (ref.node != null) parent.append(ref.node);
+  } else if (ref.type === MOUNT_ARRAY) {
+    ref.children.forEach(function (ch) {
+      insertDom(parent, ch);
     });
-  });
+  } else {
+    throw new Error("Unkown ref type " + JSON.stringify(ref));
+  }
 }
 
-function renderChildren(el, children) {
-  children.forEach(function (child) {
-    if (child == null || child === false) return;
+function mountAttributes(domElement, props, env) {
+  for (var key in props) {
+    if (key === 'key' || key === 'children' || key === 'ref') continue;
 
-    if (Array.isArray(child)) {
-      renderChildren(el, child);
-      return;
+    if (key === 'dangerouslySetInnerHTML') {
+      domElement.innerHTML = props[key].__html;
+    } else if (key === 'innerHTML' || key === 'textContent' || key === 'innerText') {
+      domElement[key] = props[key];
+    } else if (key.startsWith('on')) {
+      domElement[key.toLowerCase()] = props[key];
+    } else {
+      setDOMAttribute(domElement, key, props[key], env.isSvg);
     }
+  }
+}
+
+var attrMap = {
+  className: 'class',
+  labelFor: 'for'
+};
 
-    if (typeof child !== 'object') {
-      el.appendChild(document.createTextNode("" + child));
+function setDOMAttribute(el, attr, value, isSVG) {
+  attr = attrMap[attr] || attr;
+
+  if (value === true) {
+    el.setAttribute(attr, '');
+  } else if (value === false) {
+    el.removeAttribute(attr);
+  } else {
+    var namespace = isSVG ? NS_ATTRS[attr] : undefined;
+
+    if (namespace !== undefined) {
+      el.setAttributeNS(namespace, attr, value);
     } else {
-      el.appendChild(child);
+      el.setAttribute(attr, value);
     }
-  });
+  }
 }
 
-function renderStyle(el, style) {
-  Object.keys(style).forEach(function (key) {
-    var value = style[key];
-    if (typeof value === 'number') el.style[key] = value + "px";else el.style[key] = value;
-  });
+function mount(vnode, env) {
+  if (env === void 0) {
+    env = DEFAULT_ENV;
+  }
+
+  if (vnode == null || typeof vnode === 'boolean') {
+    return {
+      type: MOUNT_SINGLE,
+      node: null
+    };
+  }
+
+  if (vnode instanceof Node) {
+    return {
+      type: MOUNT_SINGLE,
+      node: vnode
+    };
+  }
+
+  if (isRenderFunction(vnode)) {
+    var _ref = vnode,
+        type = _ref.type,
+        props = _ref.props;
+
+    if (type === Fragment) {
+      var node = document.createDocumentFragment();
+
+      if (props.children) {
+        var childrenRef = mount(props.children, env);
+        insertDom(node, childrenRef);
+      }
+
+      return {
+        type: MOUNT_SINGLE,
+        node: node
+      };
+    }
+
+    var childVNode = type(props);
+    return mount(childVNode, env);
+  }
+
+  if (isLeaf(vnode)) {
+    return {
+      type: MOUNT_SINGLE,
+      node: document.createTextNode("" + vnode)
+    };
+  }
+
+  if (isElement(vnode)) {
+    var _node;
+
+    var _ref2 = vnode,
+        _type = _ref2.type,
+        _props = _ref2.props;
+
+    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);
+
+    var _childrenRef;
+
+    if (_props.children) {
+      var childEnv = env;
+
+      if (env.isSvg && _type === 'foreignObject') {
+        childEnv = Object.assign({}, childEnv, {
+          isSvg: false
+        });
+      }
+
+      _childrenRef = mount(_props.children, childEnv);
+    }
+
+    if (_childrenRef != null) insertDom(_node, _childrenRef);
+    var ref = _props.ref;
+    if (typeof ref === 'function') ref(_node);
+    return {
+      type: MOUNT_SINGLE,
+      node: _node
+    };
+  }
+
+  if (Array.isArray(vnode)) {
+    return {
+      type: MOUNT_ARRAY,
+      children: vnode.map(function (child) {
+        return mount(child, env);
+      })
+    };
+  }
+
+  throw new Error('mount: Invalid Vnode!');
+}
+
+function flattenWithoutNull(array) {
+  var result = [];
+
+  for (var i = 0; i < array.length; i += 1) {
+    var item = array[i];
+    if (Array.isArray(item)) result = result.concat(flattenWithoutNull(item));else if (item != null) result.push(item);
+  }
+
+  return result;
+}
+
+function asDom(result) {
+  if (result.type === MOUNT_SINGLE) {
+    return result.node;
+  }
+
+  return result.children.map(asDom);
+}
+/**
+ * Mount vdom as real DOM nodes.
+ */
+
+
+function mountDom(vnode) {
+  if (Array.isArray(vnode)) {
+    return flattenWithoutNull(vnode.map(mountDom));
+  }
+
+  return asDom(mount(vnode));
 }
 
 function renderBrand() {
-  return /*#__PURE__*/createElement("div", {
-    className: "mm-toolbar-brand"
-  }, /*#__PURE__*/createElement("img", {
-    alt: "markmap",
-    src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAACoFBMVEUAAAAAAAD//wAAAACAgAD//wAAAABVVQCqqgBAQACAQACAgABmZgBtbQAAAABgQABgYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaFQAAAAAAAAAAAAAAAAAHAAARBQIdGAIYEwI/OgJYUQUfHQI+OgJDPgJJRARBPQRJQgRRSwRRTQRIQQRUTgRUUARZUgRSTQRPSQRjWgZORQRfWQZsZAhTTQRNRwRWUAZkXAZOSARUTgZPRwRRSQRoYwZWUQZWTgRbUwZmXQZoXghmXwdqYwdsYwdfVwVmXQdqYgdiWgVpYAl3bgl6cgl4cAqLggw8OAOWjA2Uig1OSAR2bQihlg55cAh5cAh6cQmMgwyOhAyUjA2QhQ2Uiw2Viw2soBCflA+voxGwpRGhlg+hlg+snxGroBGjmBCpnBC0pxKyphKxpRG2qhK0qBK5rBK5rBP/7h3/8B7/8R3/8h3/8R7/8h786x397B3+7R3EtxT66Rz66hz76hz86xz96xz97Bz+7Rz45xz56Bz76hz97Bz97B3MvRX15Rv25Rv45xz66Rz76hz97B3+7R3IuxX05Bv15Bv25Rz56Bz66Ry/sxPAsxPCtRTCthTNvxbZyxfczxfi0xjl1Rnn2Bnr2xrr3Brs3Rru3Rru3xrv3hrw3xrx4Bvx4Rvy4hvz4hvz4xv04xv05Bv14xv15Bv15Rv25Bv25Rv25Rz25hv35hv35xv45xv45xz55xz56Bv56Bz66Rv66Rz76Rv76Rz76hz86hv86xz+7h3/7R3/7h3/7x3/8B3/8B7/8R3/8R4Yqhj5AAAAq3RSTlMAAQECAgIDAwMEBAQFBwgICAwQERITFRYXGBkbHB0eHyQlJyguNTg8RUZISU5PV2FiY2RlZmdqa2xubnJzc3R2d3d3eXl5eXp7fH1+gIGCgoKDg4SEhIWGh4eHiYmJjIyMjZSUlJ+sra+zt7i4uru8ztHV1tbW2d7g4OHi4uPk5ufp7Ozv9fX29/f3+Pj6+vr7+/v7+/v7+/z8/Pz8/f39/f39/f3+/v7+/v7K6J1dAAACHklEQVQ4y2NgwAoYWdi5uLm5GXHIcrLCmMzYpDmAhKCKjoGtp40MFhVsDAwSxmmVEzZu2XvqSLkchjw3g0h445Ybd24vmTN1Usd5X3R5DgaNqgN35sycP2/GxMkTMRVwMOivvtO3YsWUm3duX790EcMKdgbNNXdnnJh1+9T6ipzU+FB0RzIyiFYB5WdfaElUF8TmTQ6GwH39J2bvypMHcpg4MAKKkUGo5s6KWRfyGRh4WJClGEGBCgS8DLobliy/3abMwM8NBYwQjXDgf3ryxOspyKYyg+RFTFwdnYDAzbrw+oLFm9Ot3J3AwNHFTBykQrhg++GDh48cOXzk4P6VZy8s230MyAGCwwcP7iyRBJpiur1n8hQIWHX27NkLi6bAwOSuow5ABeY7OydOhoCFIAULe6E8YFCf8QAqEC86evniZTA4tfLsuRXHr0E4ly9ePF0uC3KnpH1MZBQQxPoVgxyZ5RMdBQaRMc6yIEcihWbQGaA3k9G8CfQoN0pAtSoxCMACihk9qGtBQZ2LHtRIkRUMiqwd2TJADiswsrjQlAGju/o+MLrPNkWo8mFN1ewMWmvBCebQ0rKMJG87QzF0FRwMRuvugpLcrXu3rp7Zs61UCtMZ2nVHbk+fMX/+jMmTp3Sf9MLiULG45q237txaPG3yxPYrYQzYMo60RWbD3E27Ll68Uq+AK+uJqOlZBiSEKGLNnMA0iDfzwrI/NKgBOivk9piPdtUAAAAASUVORK5CYII="
-  }), /*#__PURE__*/createElement("a", {
-    href: "https://markmap.js.org/"
-  }, "markmap"));
+  return jsxs("div", {
+    className: "mm-toolbar-brand",
+    children: [jsx("img", {
+      alt: "markmap",
+      src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAACoFBMVEUAAAAAAAD//wAAAACAgAD//wAAAABVVQCqqgBAQACAQACAgABmZgBtbQAAAABgQABgYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaFQAAAAAAAAAAAAAAAAAHAAARBQIdGAIYEwI/OgJYUQUfHQI+OgJDPgJJRARBPQRJQgRRSwRRTQRIQQRUTgRUUARZUgRSTQRPSQRjWgZORQRfWQZsZAhTTQRNRwRWUAZkXAZOSARUTgZPRwRRSQRoYwZWUQZWTgRbUwZmXQZoXghmXwdqYwdsYwdfVwVmXQdqYgdiWgVpYAl3bgl6cgl4cAqLggw8OAOWjA2Uig1OSAR2bQihlg55cAh5cAh6cQmMgwyOhAyUjA2QhQ2Uiw2Viw2soBCflA+voxGwpRGhlg+hlg+snxGroBGjmBCpnBC0pxKyphKxpRG2qhK0qBK5rBK5rBP/7h3/8B7/8R3/8h3/8R7/8h786x397B3+7R3EtxT66Rz66hz76hz86xz96xz97Bz+7Rz45xz56Bz76hz97Bz97B3MvRX15Rv25Rv45xz66Rz76hz97B3+7R3IuxX05Bv15Bv25Rz56Bz66Ry/sxPAsxPCtRTCthTNvxbZyxfczxfi0xjl1Rnn2Bnr2xrr3Brs3Rru3Rru3xrv3hrw3xrx4Bvx4Rvy4hvz4hvz4xv04xv05Bv14xv15Bv15Rv25Bv25Rv25Rz25hv35hv35xv45xv45xz55xz56Bv56Bz66Rv66Rz76Rv76Rz76hz86hv86xz+7h3/7R3/7h3/7x3/8B3/8B7/8R3/8R4Yqhj5AAAAq3RSTlMAAQECAgIDAwMEBAQFBwgICAwQERITFRYXGBkbHB0eHyQlJyguNTg8RUZISU5PV2FiY2RlZmdqa2xubnJzc3R2d3d3eXl5eXp7fH1+gIGCgoKDg4SEhIWGh4eHiYmJjIyMjZSUlJ+sra+zt7i4uru8ztHV1tbW2d7g4OHi4uPk5ufp7Ozv9fX29/f3+Pj6+vr7+/v7+/v7+/z8/Pz8/f39/f39/f3+/v7+/v7K6J1dAAACHklEQVQ4y2NgwAoYWdi5uLm5GXHIcrLCmMzYpDmAhKCKjoGtp40MFhVsDAwSxmmVEzZu2XvqSLkchjw3g0h445Ybd24vmTN1Usd5X3R5DgaNqgN35sycP2/GxMkTMRVwMOivvtO3YsWUm3duX790EcMKdgbNNXdnnJh1+9T6ipzU+FB0RzIyiFYB5WdfaElUF8TmTQ6GwH39J2bvypMHcpg4MAKKkUGo5s6KWRfyGRh4WJClGEGBCgS8DLobliy/3abMwM8NBYwQjXDgf3ryxOspyKYyg+RFTFwdnYDAzbrw+oLFm9Ot3J3AwNHFTBykQrhg++GDh48cOXzk4P6VZy8s230MyAGCwwcP7iyRBJpiur1n8hQIWHX27NkLi6bAwOSuow5ABeY7OydOhoCFIAULe6E8YFCf8QAqEC86evniZTA4tfLsuRXHr0E4ly9ePF0uC3KnpH1MZBQQxPoVgxyZ5RMdBQaRMc6yIEcihWbQGaA3k9G8CfQoN0pAtSoxCMACihk9qGtBQZ2LHtRIkRUMiqwd2TJADiswsrjQlAGju/o+MLrPNkWo8mFN1ewMWmvBCebQ0rKMJG87QzF0FRwMRuvugpLcrXu3rp7Zs61UCtMZ2nVHbk+fMX/+jMmTp3Sf9MLiULG45q237txaPG3yxPYrYQzYMo60RWbD3E27Ll68Uq+AK+uJqOlZBiSEKGLNnMA0iDfzwrI/NKgBOivk9piPdtUAAAAASUVORK5CYII="
+    }), jsx("a", {
+      href: "https://markmap.js.org/",
+      children: "markmap"
+    })]
+  });
 }
 
 function renderItem({
@@ -121,11 +273,11 @@ function renderItem({
   content,
   onClick
 }) {
-  return /*#__PURE__*/createElement("div", {
+  return jsx("div", {
     className: "mm-toolbar-item",
     title: title,
-    innerHTML: content,
-    onClick: onClick
+    onClick: onClick,
+    children: content
   });
 }
 
@@ -151,8 +303,20 @@ class Toolbar {
     return toolbar.render();
   }
 
-  static icon(path) {
-    return `<svg width="20" height="20" viewBox="0 0 20 20" on:click={onZoomIn}><path fill="none" stroke-width="2" stroke="currentColor" d="${path}"/></svg>`;
+  static icon(path, attrs = {}) {
+    attrs = _extends({
+      stroke: 'none',
+      fill: 'currentColor',
+      'fill-rule': 'evenodd'
+    }, attrs);
+    return jsx("svg", {
+      width: "20",
+      height: "20",
+      viewBox: "0 0 20 20",
+      children: jsx("path", _extends({}, attrs, {
+        d: path
+      }))
+    });
   }
 
   constructor() {
@@ -163,19 +327,19 @@ class Toolbar {
     this.register({
       id: 'zoomIn',
       title: 'Zoom in',
-      content: Toolbar.icon('M10 6 v8 M6 10 h8'),
+      content: Toolbar.icon('M9 5v4h-4v2h4v4h2v-4h4v-2h-4v-4z'),
       onClick: this.getHandler(mm => mm.rescale(1.25))
     });
     this.register({
       id: 'zoomOut',
       title: 'Zoom out',
-      content: Toolbar.icon('M6 10 h8'),
+      content: Toolbar.icon('M5 9h10v2h-10z'),
       onClick: this.getHandler(mm => mm.rescale(0.8))
     });
     this.register({
       id: 'fit',
       title: 'Fit window size',
-      content: Toolbar.icon('M4 8 h3 v-3 M4 12 h3 v3 M16 8 h-3 v-3 M16 12 h-3 v3'),
+      content: Toolbar.icon('M4 7h2v-2h2v4h-4zM4 13h2v2h2v-4h-4zM16 7h-2v-2h-2v4h4zM16 13h-2v2h-2v-4h4z'),
       onClick: this.getHandler(mm => mm.fit())
     });
   }
@@ -190,7 +354,7 @@ class Toolbar {
 
   getHandler(handle) {
     handle = safeCaller(handle);
-    return e => {
+    return () => {
       if (this.markmap) handle(this.markmap);
     };
   }
@@ -213,13 +377,14 @@ class Toolbar {
 
       return item;
     }).filter(Boolean);
-    return /*#__PURE__*/createElement("div", {
-      className: "mm-toolbar"
-    }, this.showBrand && renderBrand(), items.map(renderItem));
+    return mountDom(jsxs("div", {
+      className: "mm-toolbar",
+      children: [this.showBrand && renderBrand(), items.map(renderItem)]
+    }));
   }
 
 }
 
 exports.Toolbar = Toolbar;
 
-})));
+}));

package/dist/index.umd.min.js

@@ -1,3 +1,3 @@
-/*! markmap-toolbar v0.1.6 | MIT License */
-!function(A,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((A="undefined"!=typeof globalThis?globalThis:A||self).markmap=A.markmap||{})}(this,(function(A){"use strict";
-/*! @gera2ld/jsx-dom v1.2.1 | ISC License */var t=["innerHTML","innerText","textContent",{key:"value",tag:"textarea"}],e={name:"Fragment"};function r(A,t){var a,s;if(A===e)a=document.createDocumentFragment();else{if("string"!=typeof A)throw new Error("Invalid element type: "+A);var h=r.createElement(A);a=h,t&&Object.keys(t).forEach((function(e){var r=t[e];null!=r&&(e.startsWith("on")?h.addEventListener(e.slice(2).toLowerCase(),r):"children"===e?i(h,r):"style"===e&&"object"==typeof r?o(h,r):"dangerouslySetInnerHTML"===e&&r?h.innerHTML=r.__html||"":"ref"===e&&"function"==typeof r?s=r:"boolean"==typeof r?r?h.setAttribute(e,e):h.removeAttribute(e):n(A,e)?h[e]=r:("className"===e?e="class":"labelFor"===e&&(e="for"),h.setAttribute(e,""+r)))}))}for(var l=arguments.length,c=new Array(l>2?l-2:0),m=2;m<l;m++)c[m-2]=arguments[m];return i(a,c),s&&s(a),a}function n(A,e){var r={tag:A,key:e};return t.some((function(A){return"string"==typeof A?e===A:Object.keys(A).every((function(t){return A[t]===r[t]}))}))}function i(A,t){t.forEach((function(t){null!=t&&!1!==t&&(Array.isArray(t)?i(A,t):"object"!=typeof t?A.appendChild(document.createTextNode(""+t)):A.appendChild(t))}))}function o(A,t){Object.keys(t).forEach((function(e){var r=t[e];A.style[e]="number"==typeof r?r+"px":r}))}function a({title:A,content:t,onClick:e}){return r("div",{className:"mm-toolbar-item",title:A,innerHTML:t,onClick:e})}let s;r.createElement=function(A){return document.createElement(A)};class h{static create(A){const t=new h;return t.attach(A),t.render()}static icon(A){return`<svg width="20" height="20" viewBox="0 0 20 20" on:click={onZoomIn}><path fill="none" stroke-width="2" stroke="currentColor" d="${A}"/></svg>`}constructor(){this.showBrand=!0,this.registry={},this.markmap=null,this.items=["zoomIn","zoomOut","fit"],this.register({id:"zoomIn",title:"Zoom in",content:h.icon("M10 6 v8 M6 10 h8"),onClick:this.getHandler((A=>A.rescale(1.25)))}),this.register({id:"zoomOut",title:"Zoom out",content:h.icon("M6 10 h8"),onClick:this.getHandler((A=>A.rescale(.8)))}),this.register({id:"fit",title:"Fit window size",content:h.icon("M4 8 h3 v-3 M4 12 h3 v3 M16 8 h-3 v-3 M16 12 h-3 v3"),onClick:this.getHandler((A=>A.fit()))})}setBrand(A){this.showBrand=A}register(A){this.registry[A.id]=A}getHandler(A){var t;return t=A,A=async(...A)=>{if(!s){s=t(...A);try{await s}finally{s=null}}},t=>{this.markmap&&A(this.markmap)}}setItems(A){this.items=[...A]}attach(A){this.markmap=A}render(){const A=this.items.map((A=>{if("string"==typeof A){const t=this.registry[A];return t||console.warn(`[markmap-toolbar] ${A} not found`),t}return A})).filter(Boolean);return r("div",{className:"mm-toolbar"},this.showBrand&&r("div",{className:"mm-toolbar-brand"},r("img",{alt:"markmap",src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAACoFBMVEUAAAAAAAD//wAAAACAgAD//wAAAABVVQCqqgBAQACAQACAgABmZgBtbQAAAABgQABgYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaFQAAAAAAAAAAAAAAAAAHAAARBQIdGAIYEwI/OgJYUQUfHQI+OgJDPgJJRARBPQRJQgRRSwRRTQRIQQRUTgRUUARZUgRSTQRPSQRjWgZORQRfWQZsZAhTTQRNRwRWUAZkXAZOSARUTgZPRwRRSQRoYwZWUQZWTgRbUwZmXQZoXghmXwdqYwdsYwdfVwVmXQdqYgdiWgVpYAl3bgl6cgl4cAqLggw8OAOWjA2Uig1OSAR2bQihlg55cAh5cAh6cQmMgwyOhAyUjA2QhQ2Uiw2Viw2soBCflA+voxGwpRGhlg+hlg+snxGroBGjmBCpnBC0pxKyphKxpRG2qhK0qBK5rBK5rBP/7h3/8B7/8R3/8h3/8R7/8h786x397B3+7R3EtxT66Rz66hz76hz86xz96xz97Bz+7Rz45xz56Bz76hz97Bz97B3MvRX15Rv25Rv45xz66Rz76hz97B3+7R3IuxX05Bv15Bv25Rz56Bz66Ry/sxPAsxPCtRTCthTNvxbZyxfczxfi0xjl1Rnn2Bnr2xrr3Brs3Rru3Rru3xrv3hrw3xrx4Bvx4Rvy4hvz4hvz4xv04xv05Bv14xv15Bv15Rv25Bv25Rv25Rz25hv35hv35xv45xv45xz55xz56Bv56Bz66Rv66Rz76Rv76Rz76hz86hv86xz+7h3/7R3/7h3/7x3/8B3/8B7/8R3/8R4Yqhj5AAAAq3RSTlMAAQECAgIDAwMEBAQFBwgICAwQERITFRYXGBkbHB0eHyQlJyguNTg8RUZISU5PV2FiY2RlZmdqa2xubnJzc3R2d3d3eXl5eXp7fH1+gIGCgoKDg4SEhIWGh4eHiYmJjIyMjZSUlJ+sra+zt7i4uru8ztHV1tbW2d7g4OHi4uPk5ufp7Ozv9fX29/f3+Pj6+vr7+/v7+/v7+/z8/Pz8/f39/f39/f3+/v7+/v7K6J1dAAACHklEQVQ4y2NgwAoYWdi5uLm5GXHIcrLCmMzYpDmAhKCKjoGtp40MFhVsDAwSxmmVEzZu2XvqSLkchjw3g0h445Ybd24vmTN1Usd5X3R5DgaNqgN35sycP2/GxMkTMRVwMOivvtO3YsWUm3duX790EcMKdgbNNXdnnJh1+9T6ipzU+FB0RzIyiFYB5WdfaElUF8TmTQ6GwH39J2bvypMHcpg4MAKKkUGo5s6KWRfyGRh4WJClGEGBCgS8DLobliy/3abMwM8NBYwQjXDgf3ryxOspyKYyg+RFTFwdnYDAzbrw+oLFm9Ot3J3AwNHFTBykQrhg++GDh48cOXzk4P6VZy8s230MyAGCwwcP7iyRBJpiur1n8hQIWHX27NkLi6bAwOSuow5ABeY7OydOhoCFIAULe6E8YFCf8QAqEC86evniZTA4tfLsuRXHr0E4ly9ePF0uC3KnpH1MZBQQxPoVgxyZ5RMdBQaRMc6yIEcihWbQGaA3k9G8CfQoN0pAtSoxCMACihk9qGtBQZ2LHtRIkRUMiqwd2TJADiswsrjQlAGju/o+MLrPNkWo8mFN1ewMWmvBCebQ0rKMJG87QzF0FRwMRuvugpLcrXu3rp7Zs61UCtMZ2nVHbk+fMX/+jMmTp3Sf9MLiULG45q237txaPG3yxPYrYQzYMo60RWbD3E27Ll68Uq+AK+uJqOlZBiSEKGLNnMA0iDfzwrI/NKgBOivk9piPdtUAAAAASUVORK5CYII="}),r("a",{href:"https://markmap.js.org/"},"markmap")),A.map(a))}}A.Toolbar=h}));
+/*! markmap-toolbar v0.13.0 | MIT License */
+!function(A,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((A="undefined"!=typeof globalThis?globalThis:A||self).markmap=A.markmap||{})}(this,(function(A){"use strict";function t(){return t=Object.assign||function(A){for(var t=1;t<arguments.length;t++){var e=arguments[t];for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&(A[r]=e[r])}return A},t.apply(this,arguments)}
+/*! @gera2ld/jsx-dom v2.1.1 | ISC License */var e="http://www.w3.org/1999/xlink",r={show:e,actuate:e,href:e};function n(A,t){var e;if("string"==typeof A)e=1;else{if("function"!=typeof A)throw new Error("Invalid VNode type");e=2}return{vtype:e,type:A,props:t}}var i=n;function o(A){return A.children}var s={isSvg:!1};function a(A,t){if(1===t.type)null!=t.node&&A.append(t.node);else{if(4!==t.type)throw new Error("Unkown ref type "+JSON.stringify(t));t.children.forEach((function(t){a(A,t)}))}}var h={className:"class",labelFor:"for"};function l(A,t,e,n){if(t=h[t]||t,!0===e)A.setAttribute(t,"");else if(!1===e)A.removeAttribute(t);else{var i=n?r[t]:void 0;void 0!==i?A.setAttributeNS(i,t,e):A.setAttribute(t,e)}}function c(A,t){if(void 0===t&&(t=s),null==A||"boolean"==typeof A)return{type:1,node:null};if(A instanceof Node)return{type:1,node:A};if(2===(null==(h=A)?void 0:h.vtype)){var e=A,r=e.type,n=e.props;if(r===o){var i=document.createDocumentFragment();if(n.children)a(i,c(n.children,t));return{type:1,node:i}}return c(r(n),t)}var h;if(function(A){return"string"==typeof A||"number"==typeof A}(A))return{type:1,node:document.createTextNode(""+A)};if(function(A){return 1===(null==A?void 0:A.vtype)}(A)){var v,u,f=A,d=f.type,g=f.props;if(t.isSvg||"svg"!==d||(t=Object.assign({},t,{isSvg:!0})),function(A,t,e){for(var r in t)"key"!==r&&"children"!==r&&"ref"!==r&&("dangerouslySetInnerHTML"===r?A.innerHTML=t[r].__html:"innerHTML"===r||"textContent"===r||"innerText"===r?A[r]=t[r]:r.startsWith("on")?A[r.toLowerCase()]=t[r]:l(A,r,t[r],e.isSvg))}(v=t.isSvg?document.createElementNS("http://www.w3.org/2000/svg",d):document.createElement(d),g,t),g.children){var p=t;t.isSvg&&"foreignObject"===d&&(p=Object.assign({},p,{isSvg:!1})),u=c(g.children,p)}null!=u&&a(v,u);var m=g.ref;return"function"==typeof m&&m(v),{type:1,node:v}}if(Array.isArray(A))return{type:4,children:A.map((function(A){return c(A,t)}))};throw new Error("mount: Invalid Vnode!")}function v(A){for(var t=[],e=0;e<A.length;e+=1){var r=A[e];Array.isArray(r)?t=t.concat(v(r)):null!=r&&t.push(r)}return t}function u(A){return 1===A.type?A.node:A.children.map(u)}function f(A){return Array.isArray(A)?v(A.map(f)):u(c(A))}function d({title:A,content:t,onClick:e}){return n("div",{className:"mm-toolbar-item",title:A,onClick:e,children:t})}let g;class p{static create(A){const t=new p;return t.attach(A),t.render()}static icon(A,e={}){return e=t({stroke:"none",fill:"currentColor","fill-rule":"evenodd"},e),n("svg",{width:"20",height:"20",viewBox:"0 0 20 20",children:n("path",t({},e,{d:A}))})}constructor(){this.showBrand=!0,this.registry={},this.markmap=null,this.items=["zoomIn","zoomOut","fit"],this.register({id:"zoomIn",title:"Zoom in",content:p.icon("M9 5v4h-4v2h4v4h2v-4h4v-2h-4v-4z"),onClick:this.getHandler((A=>A.rescale(1.25)))}),this.register({id:"zoomOut",title:"Zoom out",content:p.icon("M5 9h10v2h-10z"),onClick:this.getHandler((A=>A.rescale(.8)))}),this.register({id:"fit",title:"Fit window size",content:p.icon("M4 7h2v-2h2v4h-4zM4 13h2v2h2v-4h-4zM16 7h-2v-2h-2v4h4zM16 13h-2v2h-2v-4h4z"),onClick:this.getHandler((A=>A.fit()))})}setBrand(A){this.showBrand=A}register(A){this.registry[A.id]=A}getHandler(A){var t;return t=A,A=async(...A)=>{if(!g){g=t(...A);try{await g}finally{g=null}}},()=>{this.markmap&&A(this.markmap)}}setItems(A){this.items=[...A]}attach(A){this.markmap=A}render(){const A=this.items.map((A=>{if("string"==typeof A){const t=this.registry[A];return t||console.warn(`[markmap-toolbar] ${A} not found`),t}return A})).filter(Boolean);return f(i("div",{className:"mm-toolbar",children:[this.showBrand&&i("div",{className:"mm-toolbar-brand",children:[n("img",{alt:"markmap",src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAACoFBMVEUAAAAAAAD//wAAAACAgAD//wAAAABVVQCqqgBAQACAQACAgABmZgBtbQAAAABgQABgYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAaFQAAAAAAAAAAAAAAAAAHAAARBQIdGAIYEwI/OgJYUQUfHQI+OgJDPgJJRARBPQRJQgRRSwRRTQRIQQRUTgRUUARZUgRSTQRPSQRjWgZORQRfWQZsZAhTTQRNRwRWUAZkXAZOSARUTgZPRwRRSQRoYwZWUQZWTgRbUwZmXQZoXghmXwdqYwdsYwdfVwVmXQdqYgdiWgVpYAl3bgl6cgl4cAqLggw8OAOWjA2Uig1OSAR2bQihlg55cAh5cAh6cQmMgwyOhAyUjA2QhQ2Uiw2Viw2soBCflA+voxGwpRGhlg+hlg+snxGroBGjmBCpnBC0pxKyphKxpRG2qhK0qBK5rBK5rBP/7h3/8B7/8R3/8h3/8R7/8h786x397B3+7R3EtxT66Rz66hz76hz86xz96xz97Bz+7Rz45xz56Bz76hz97Bz97B3MvRX15Rv25Rv45xz66Rz76hz97B3+7R3IuxX05Bv15Bv25Rz56Bz66Ry/sxPAsxPCtRTCthTNvxbZyxfczxfi0xjl1Rnn2Bnr2xrr3Brs3Rru3Rru3xrv3hrw3xrx4Bvx4Rvy4hvz4hvz4xv04xv05Bv14xv15Bv15Rv25Bv25Rv25Rz25hv35hv35xv45xv45xz55xz56Bv56Bz66Rv66Rz76Rv76Rz76hz86hv86xz+7h3/7R3/7h3/7x3/8B3/8B7/8R3/8R4Yqhj5AAAAq3RSTlMAAQECAgIDAwMEBAQFBwgICAwQERITFRYXGBkbHB0eHyQlJyguNTg8RUZISU5PV2FiY2RlZmdqa2xubnJzc3R2d3d3eXl5eXp7fH1+gIGCgoKDg4SEhIWGh4eHiYmJjIyMjZSUlJ+sra+zt7i4uru8ztHV1tbW2d7g4OHi4uPk5ufp7Ozv9fX29/f3+Pj6+vr7+/v7+/v7+/z8/Pz8/f39/f39/f3+/v7+/v7K6J1dAAACHklEQVQ4y2NgwAoYWdi5uLm5GXHIcrLCmMzYpDmAhKCKjoGtp40MFhVsDAwSxmmVEzZu2XvqSLkchjw3g0h445Ybd24vmTN1Usd5X3R5DgaNqgN35sycP2/GxMkTMRVwMOivvtO3YsWUm3duX790EcMKdgbNNXdnnJh1+9T6ipzU+FB0RzIyiFYB5WdfaElUF8TmTQ6GwH39J2bvypMHcpg4MAKKkUGo5s6KWRfyGRh4WJClGEGBCgS8DLobliy/3abMwM8NBYwQjXDgf3ryxOspyKYyg+RFTFwdnYDAzbrw+oLFm9Ot3J3AwNHFTBykQrhg++GDh48cOXzk4P6VZy8s230MyAGCwwcP7iyRBJpiur1n8hQIWHX27NkLi6bAwOSuow5ABeY7OydOhoCFIAULe6E8YFCf8QAqEC86evniZTA4tfLsuRXHr0E4ly9ePF0uC3KnpH1MZBQQxPoVgxyZ5RMdBQaRMc6yIEcihWbQGaA3k9G8CfQoN0pAtSoxCMACihk9qGtBQZ2LHtRIkRUMiqwd2TJADiswsrjQlAGju/o+MLrPNkWo8mFN1ewMWmvBCebQ0rKMJG87QzF0FRwMRuvugpLcrXu3rp7Zs61UCtMZ2nVHbk+fMX/+jMmTp3Sf9MLiULG45q237txaPG3yxPYrYQzYMo60RWbD3E27Ll68Uq+AK+uJqOlZBiSEKGLNnMA0iDfzwrI/NKgBOivk9piPdtUAAAAASUVORK5CYII="}),n("a",{href:"https://markmap.js.org/",children:"markmap"})]}),A.map(d)]}))}}A.Toolbar=p}));

package/dist/style.css

@@ -1,61 +1 @@
-.mm-toolbar {
-  display: flex;
-  align-items: center;
-  border-radius: 0.25rem;
-  --bg-opacity: 1;
-  background-color: #fff;
-  background-color: rgba(255, 255, 255, var(--bg-opacity));
-  border-width: 1px;
-  border-style: solid;
-  --border-opacity: 1;
-  border-color: #e2e8f0;
-  border-color: rgba(226, 232, 240, var(--border-opacity));
-  line-height: 1;
-  -moz-user-select: none;
-       user-select: none
-}
-.mm-toolbar:hover {
-    --border-opacity: 1;
-    border-color: #cbd5e0;
-    border-color: rgba(203, 213, 224, var(--border-opacity));
-  }
-.mm-toolbar svg {
-    display: block;
-  }
-.mm-toolbar > * {
-    margin: 0.25rem;
-    cursor: pointer;
-  }
-.mm-toolbar > * > * {
-      --text-opacity: 1;
-      color: #a0aec0;
-      color: rgba(160, 174, 192, var(--text-opacity));
-    }
-.mm-toolbar > *:hover {
-      --bg-opacity: 1;
-      background-color: #edf2f7;
-      background-color: rgba(237, 242, 247, var(--bg-opacity));
-      border-radius: 0.25rem;
-    }
-.mm-toolbar > *:hover > * {
-        --text-opacity: 1;
-        color: #2d3748;
-        color: rgba(45, 55, 72, var(--text-opacity));
-      }
-.mm-toolbar-brand > img {
-      width: 1rem;
-      height: 1rem;
-      vertical-align: middle;
-    }
-.mm-toolbar-brand > a {
-      display: inline-block;
-      font-size: 0.75rem;
-      text-decoration: none;
-      padding-right: 0.25rem;
-    }
-.mm-toolbar-item > * {
-      min-width: 20px;
-      height: 20px;
-      line-height: 20px;
-      text-align: center;
-    }
+.mm-toolbar{--tw-border-opacity:1;--tw-bg-opacity:1;align-items:center;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(209 213 219/var(--tw-border-opacity));border-radius:.25rem;border-style:solid;border-width:1px;display:flex;line-height:1;-moz-user-select:none;user-select:none}.mm-toolbar:hover{--tw-border-opacity:1;border-color:rgb(156 163 175/var(--tw-border-opacity))}.mm-toolbar svg{display:block}.mm-toolbar>*{cursor:pointer;margin:.25rem}.mm-toolbar>*>*{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity))}.mm-toolbar>:hover{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity));border-radius:.25rem}.mm-toolbar>:hover>*{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity))}.mm-toolbar-brand>img{height:1rem;vertical-align:middle;width:1rem}.mm-toolbar-brand>a{display:inline-block;font-size:.75rem;line-height:1rem;padding-right:.25rem;-webkit-text-decoration-line:none;text-decoration-line:none}.mm-toolbar-item>*{height:20px;line-height:20px;min-width:20px;text-align:center}

package/package.json

@@ -1,13 +1,12 @@
 {
   "name": "markmap-toolbar",
-  "version": "0.1.6",
+  "version": "0.13.0",
   "description": "Extensible toolbar for markmap",
   "author": "Gerald <gera2ld@live.com>",
   "license": "MIT",
   "scripts": {
     "dev": "rollup -wc rollup.conf.js",
     "clean": "del-cli dist types",
-    "lint": "eslint --ext .ts,.tsx .",
     "build:types": "tsc",
     "build:js": "rollup -c rollup.conf.js"
   },
@@ -24,9 +23,12 @@
     "registry": "https://registry.npmjs.org/"
   },
   "typings": "types/index.d.ts",
+  "devDependencies": {
+    "markmap-view": "^0.13.0"
+  },
   "dependencies": {
-    "@babel/runtime": "^7.12.1",
-    "@gera2ld/jsx-dom": "^1.2.1"
+    "@babel/runtime": "^7.16.3",
+    "@gera2ld/jsx-dom": "^2.1.1"
   },
-  "gitHead": "cbb56b8ede93b15000a31013a0474891b774a977"
+  "gitHead": "4f5096be2e5ee0d666c0868dbb0d163b19b00ffe"
 }

package/types/index.d.ts

@@ -1 +1 @@
-export * from './toolbar';
+export * from './toolbar';

package/types/toolbar.d.ts

@@ -1,25 +1,27 @@
-import './style.css';
-interface IToolbarItem {
-    id?: string;
-    title?: string;
-    content: string;
-    onClick?: (e: Event) => void;
-}
-export declare class Toolbar {
-    private showBrand;
-    private registry;
-    private markmap;
-    private items;
-    static create(mm: any): any;
-    static icon(path: string): string;
-    constructor();
-    setBrand(show: boolean): void;
-    register(data: IToolbarItem & {
-        id: string;
-    }): void;
-    getHandler(handle: (mm: any) => void): (e: any) => void;
-    setItems(items: (string | IToolbarItem)[]): void;
-    attach(mm: any): void;
-    render(): any;
-}
-export {};
+import { VChildren } from '@gera2ld/jsx-dom';
+import type { Markmap } from 'markmap-view';
+import './style.css';
+interface IToolbarItem {
+    id?: string;
+    title?: string;
+    content: VChildren;
+    onClick?: (e: Event) => void;
+}
+export declare class Toolbar {
+    private showBrand;
+    private registry;
+    private markmap;
+    private items;
+    static create(mm: Markmap): Node;
+    static icon(path: string, attrs?: {}): any;
+    constructor();
+    setBrand(show: boolean): void;
+    register(data: IToolbarItem & {
+        id: string;
+    }): void;
+    getHandler(handle: (mm: Markmap) => Promise<void>): () => void;
+    setItems(items: (string | IToolbarItem)[]): void;
+    attach(mm: Markmap): void;
+    render(): Node;
+}
+export {};

package/dist/style.min.css

@@ -1 +0,0 @@
-.mm-toolbar{display:flex;align-items:center;border-radius:.25rem;--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity));--border-opacity:1;border:1px solid #e2e8f0;border-color:rgba(226,232,240,var(--border-opacity));line-height:1;-moz-user-select:none;user-select:none}.mm-toolbar:hover{--border-opacity:1;border-color:#cbd5e0;border-color:rgba(203,213,224,var(--border-opacity))}.mm-toolbar svg{display:block}.mm-toolbar>*{margin:.25rem;cursor:pointer}.mm-toolbar>*>*{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.mm-toolbar>:hover{--bg-opacity:1;background-color:#edf2f7;background-color:rgba(237,242,247,var(--bg-opacity));border-radius:.25rem}.mm-toolbar>:hover>*{--text-opacity:1;color:#2d3748;color:rgba(45,55,72,var(--text-opacity))}.mm-toolbar-brand>img{width:1rem;height:1rem;vertical-align:middle}.mm-toolbar-brand>a{display:inline-block;font-size:.75rem;text-decoration:none;padding-right:.25rem}.mm-toolbar-item>*{min-width:20px;height:20px;line-height:20px;text-align:center}