markmap-autoloader 0.14.5-alpha.13 → 0.14.5-alpha.15

package/README.md

@@ -12,18 +12,23 @@ HTML:
 
 ```html
 <style>
-.markmap > svg {
-  width: 100%;
-  height: 300px;
-}
+  .markmap {
+    position: relative;
+  }
+  .markmap > svg {
+    width: 100%;
+    height: 300px;
+  }
 </style>
 
-<div class="markmap"><script type="text/template">
-- markmap
-  - autoloader
-  - transformer
-  - view
-</script></div>
+<div class="markmap">
+  <script type="text/template">
+    - markmap
+      - autoloader
+      - transformer
+      - view
+  </script>
+</div>
 ```
 
 Note that `<script type="text/template">` is optional, for the content inside to be invisible before the markmap is rendered.
@@ -44,16 +49,16 @@ Load manually:
 
 ```html
 <script>
-window.markmap = {
-  autoLoader: { manual: true },
-};
+  window.markmap = {
+    autoLoader: { manual: true },
+  };
 </script>
 <script src="https://cdn.jsdelivr.net/npm/markmap-autoloader"></script>
 <script>
-// Render in 5s
-setTimeout(() => {
-  markmap.autoLoader.renderAll();
-}, 5000);
+  // Render in 5s
+  setTimeout(() => {
+    markmap.autoLoader.renderAll();
+  }, 5000);
 </script>
 ```
 
@@ -61,11 +66,11 @@ Disable built-in plugins:
 
 ```html
 <script>
-window.markmap = {
-  autoLoader: {
-    transformPlugins: [],
-  },
-};
+  window.markmap = {
+    autoLoader: {
+      transformPlugins: [],
+    },
+  };
 </script>
 <script src="https://cdn.jsdelivr.net/npm/markmap-autoloader"></script>
 ```
@@ -76,17 +81,17 @@ window.markmap = {
 
 If `window.markmap.autoLoader` is defined before this package is loaded, it will be regarded as autoLoader options.
 
-- `autoLoader.manual` *boolean* default as `false`
+- `autoLoader.manual` _boolean_ default as `false`
 
-    Whether to render markmaps manually. If false, all elements matching `.markmap` will be rendered once this package loads or DOMContentLoaded is emitted, whichever later.
+  Whether to render markmaps manually. If false, all elements matching `.markmap` will be rendered once this package loads or DOMContentLoaded is emitted, whichever later.
 
-- `autoLoader.transformPlugins` *ITransformPlugin[]*
+- `autoLoader.transformPlugins` _ITransformPlugin[]_
 
-    Override built-in plugins if provided. Set to `[]` to disable all built-in plugins for auto-loader.
+  Override built-in plugins if provided. Set to `[]` to disable all built-in plugins for auto-loader.
 
-- `autoLoader.onReady` *function*
+- `autoLoader.onReady` _function_
 
-    Callback when markmap-lib/markmap-view and their dependencies are loaded. We can tweak global options in this callback.
+  Callback when markmap-lib/markmap-view and their dependencies are loaded. We can tweak global options in this callback.
 
 ### markmap.autoLoader.renderAll()
 

package/dist/index.js

@@ -1,9 +1,24 @@
-/*! markmap-autoloader v0.14.5-alpha.13+50ca560 | MIT License */
+/*! markmap-autoloader v0.14.5-alpha.15+1fe26c8 | MIT License */
 this.markmap = this.markmap || {};
 (function (exports) {
 'use strict';
 
-/*! markmap-common v0.14.5-alpha.13+50ca560 | MIT License */
+function _extends$1() {
+  _extends$1 = Object.assign ? Object.assign.bind() : 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$1.apply(this, arguments);
+}
+
+/*! markmap-common v0.14.5-alpha.15+1fe26c8 | MIT License */
 function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
@@ -91,6 +106,19 @@ async function loadJSItem(item, context) {
   }
   await item.loaded;
 }
+function loadCSSItem(item) {
+  if (item.loaded) return;
+  item.loaded = true;
+  if (item.type === 'style') {
+    document.head.append(createElement('style', {
+      textContent: item.data
+    }));
+  } else if (item.type === 'stylesheet') {
+    document.head.append(createElement('link', _extends({
+      rel: 'stylesheet'
+    }, item.data)));
+  }
+}
 async function loadJS(items, context) {
   const needPreload = items.filter(item => {
     var _item$data2;
@@ -104,24 +132,42 @@ async function loadJS(items, context) {
     await loadJSItem(item, context);
   }
 }
+function loadCSS(items) {
+  for (const item of items) {
+    loadCSSItem(item);
+  }
+}
 let provider = 'jsdelivr';
-function getFullUrl(path) {
+function getFullUrl(path, overrideProvider = provider) {
   if (path.includes('://')) return path;
-  return cdnUrl(provider, path);
+  return cdnUrl(overrideProvider, path);
 }
-function buildJSItem(path) {
+function buildJSItem(path, overrideProvider) {
   return {
     type: 'script',
     data: {
-      src: getFullUrl(path)
+      src: getFullUrl(path, overrideProvider)
+    }
+  };
+}
+function buildCSSItem(path, overrideProvider) {
+  return {
+    type: 'stylesheet',
+    data: {
+      href: getFullUrl(path, overrideProvider)
     }
   };
 }
 
-var _window$markmap, _window$markmap2;
+var _window$markmap;
 const enabled = {};
-const ready = loadJS(((_window$markmap = window.markmap) == null || (_window$markmap = _window$markmap.autoLoader) == null ? void 0 : _window$markmap.baseJs) || [`d3@${"6.2.0"}`, `markmap-lib@${"0.14.5-alpha.13+50ca560"}`, `markmap-view@${"0.14.5-alpha.13+50ca560"}`].map(buildJSItem)).then(() => {
-  var _markmap$autoLoader;
+const autoLoaderOptions = _extends$1({
+  baseJs: [`d3@${"6.2.0"}`, `markmap-lib@${"0.14.5-alpha.15+1fe26c8"}`, `markmap-view@${"0.14.5-alpha.15+1fe26c8"}`, `markmap-toolbar@${process.env.TOOLBAR_VERSION}`],
+  baseCss: [`markmap-toolbar@${process.env.TOOLBAR_VERSION}/dist/style.css`],
+  manual: false,
+  toolbar: false
+}, (_window$markmap = window.markmap) == null ? void 0 : _window$markmap.autoLoader);
+const ready = Promise.all([loadJS(autoLoaderOptions.baseJs.map(item => typeof item === 'string' ? buildJSItem(item) : item)), loadCSS(autoLoaderOptions.baseCss.map(item => typeof item === 'string' ? buildCSSItem(item) : item))]).then(() => {
   const {
     markmap
   } = window;
@@ -129,7 +175,7 @@ const ready = loadJS(((_window$markmap = window.markmap) == null || (_window$mar
   style.textContent = markmap.globalCSS;
   // Insert global CSS to body so it has higher priority than prism.css, etc.
   document.body.prepend(style);
-  (_markmap$autoLoader = markmap.autoLoader) == null || _markmap$autoLoader.onReady == null ? void 0 : _markmap$autoLoader.onReady();
+  autoLoaderOptions.onReady == null ? void 0 : autoLoaderOptions.onReady();
 });
 function transform(transformer, content) {
   const result = transformer.transform(content);
@@ -152,8 +198,8 @@ function render(el) {
   const {
     Transformer,
     Markmap,
-    autoLoader,
-    deriveOptions
+    deriveOptions,
+    Toolbar
   } = window.markmap;
   const lines = el.textContent.split('\n');
   let indent = Infinity;
@@ -162,12 +208,23 @@ function render(el) {
     if (spaces < line.length) indent = Math.min(indent, spaces);
   });
   const content = lines.map(line => line.slice(indent)).join('\n').trim();
-  const transformer = new Transformer(autoLoader == null ? void 0 : autoLoader.transformPlugins);
+  const transformer = new Transformer(autoLoaderOptions.transformPlugins);
   el.innerHTML = '<svg></svg>';
   const svg = el.firstChild;
   const mm = Markmap.create(svg, {
     embedGlobalCSS: false
   });
+  if (autoLoaderOptions.toolbar) {
+    const {
+      el: toolbar
+    } = Toolbar.create(mm);
+    Object.assign(toolbar.style, {
+      position: 'absolute',
+      right: '20px',
+      bottom: '20px'
+    });
+    el.append(toolbar);
+  }
   const doRender = () => {
     const {
       root,
@@ -188,7 +245,7 @@ async function renderAllUnder(container) {
 function renderAll() {
   return renderAllUnder(document);
 }
-if (!((_window$markmap2 = window.markmap) != null && (_window$markmap2 = _window$markmap2.autoLoader) != null && _window$markmap2.manual)) {
+if (!autoLoaderOptions.manual) {
   if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', () => {
     renderAll();
   });else renderAll();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "markmap-autoloader",
-  "version": "0.14.5-alpha.13+50ca560",
+  "version": "0.14.5-alpha.15+1fe26c8",
   "description": "Load markmaps automatically in HTML",
   "author": "Gerald <gera2ld@live.com>",
   "license": "MIT",
@@ -38,9 +38,10 @@
     "markmap-common": "*"
   },
   "devDependencies": {
-    "markmap-common": "0.14.5-alpha.13+50ca560",
-    "markmap-lib": "0.14.5-alpha.13+50ca560",
-    "markmap-view": "0.14.5-alpha.13+50ca560"
+    "markmap-common": "0.14.5-alpha.15+1fe26c8",
+    "markmap-lib": "0.14.5-alpha.15+1fe26c8",
+    "markmap-toolbar": "0.14.5-alpha.15+1fe26c8",
+    "markmap-view": "0.14.5-alpha.15+1fe26c8"
   },
-  "gitHead": "50ca5603019498f93dba6485c96d0a5630b221e5"
+  "gitHead": "1fe26c8234296e2188e466c7b9dbf3b7e171857d"
 }