markmap-view 0.14.4 → 0.14.5-alpha.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,267 +1,57 @@
1
- /*! markmap-view v0.14.4 | MIT License */
2
- (function (exports, d3) {
1
+ /*! markmap-view v0.14.5-alpha.15+1fe26c8 | MIT License */
3
2
  'use strict';
4
3
 
5
- function _interopNamespace(e) {
6
- if (e && e.__esModule) return e;
4
+ var markmapCommon = require('markmap-common');
5
+ var d3 = require('d3');
6
+
7
+ function _interopNamespaceDefault(e) {
7
8
  var n = Object.create(null);
8
9
  if (e) {
9
10
  for (var k in e) {
10
11
  n[k] = e[k];
11
12
  }
12
13
  }
13
- n["default"] = e;
14
+ n.default = e;
14
15
  return Object.freeze(n);
15
16
  }
16
17
 
17
- var d3__namespace = /*#__PURE__*/_interopNamespace(d3);
18
-
19
- /*! markmap-common v0.14.2 | MIT License */
20
- class Hook {
21
- constructor() {
22
- this.listeners = [];
23
- }
24
-
25
- tap(fn) {
26
- this.listeners.push(fn);
27
- return () => this.revoke(fn);
28
- }
29
-
30
- revoke(fn) {
31
- const i = this.listeners.indexOf(fn);
32
- if (i >= 0) this.listeners.splice(i, 1);
33
- }
34
-
35
- revokeAll() {
36
- this.listeners.splice(0);
37
- }
38
-
39
- call(...args) {
40
- for (const fn of this.listeners) {
41
- fn(...args);
42
- }
43
- }
44
-
45
- }
46
-
47
- function _extends$1() {
48
- _extends$1 = Object.assign || function (target) {
49
- for (var i = 1; i < arguments.length; i++) {
50
- var source = arguments[i];
51
-
52
- for (var key in source) {
53
- if (Object.prototype.hasOwnProperty.call(source, key)) {
54
- target[key] = source[key];
55
- }
56
- }
57
- }
58
-
59
- return target;
60
- };
61
-
62
- return _extends$1.apply(this, arguments);
63
- }
64
-
65
- const uniqId = Math.random().toString(36).slice(2, 8);
66
- let globalIndex = 0;
67
- function getId() {
68
- globalIndex += 1;
69
- return `mm-${uniqId}-${globalIndex}`;
70
- }
71
- function noop() {// noop
72
- }
73
- function walkTree(tree, callback, key = 'children') {
74
- const walk = (item, parent) => callback(item, () => {
75
- var _item$key;
76
-
77
- (_item$key = item[key]) == null ? void 0 : _item$key.forEach(child => {
78
- walk(child, item);
79
- });
80
- }, parent);
81
-
82
- walk(tree);
83
- }
84
- function arrayFrom(arrayLike) {
85
- if (Array.from) return Array.from(arrayLike);
86
- const array = [];
87
-
88
- for (let i = 0; i < arrayLike.length; i += 1) {
89
- array.push(arrayLike[i]);
90
- }
91
-
92
- return array;
93
- }
94
- function addClass(className, ...rest) {
95
- const classList = (className || '').split(' ').filter(Boolean);
96
- rest.forEach(item => {
97
- if (item && classList.indexOf(item) < 0) classList.push(item);
98
- });
99
- return classList.join(' ');
100
- }
101
- function childSelector(filter) {
102
- if (typeof filter === 'string') {
103
- const tagName = filter;
104
-
105
- filter = el => el.tagName === tagName;
106
- }
107
-
108
- const filterFn = filter;
109
- return function selector() {
110
- let nodes = arrayFrom(this.childNodes);
111
- if (filterFn) nodes = nodes.filter(node => filterFn(node));
112
- return nodes;
113
- };
114
- }
115
- function memoize(fn) {
116
- const cache = {};
117
- return function memoized(...args) {
118
- const key = `${args[0]}`;
119
- let data = cache[key];
120
-
121
- if (!data) {
122
- data = {
123
- value: fn(...args)
124
- };
125
- cache[key] = data;
126
- }
127
-
128
- return data.value;
129
- };
130
- }
131
-
132
- function createElement(tagName, props, attrs) {
133
- const el = document.createElement(tagName);
134
-
135
- if (props) {
136
- Object.entries(props).forEach(([key, value]) => {
137
- el[key] = value;
138
- });
139
- }
140
-
141
- if (attrs) {
142
- Object.entries(attrs).forEach(([key, value]) => {
143
- el.setAttribute(key, value);
144
- });
145
- }
146
-
147
- return el;
148
- }
149
-
150
- const memoizedPreloadJS = memoize(url => {
151
- document.head.append(createElement('link', {
152
- rel: 'preload',
153
- as: 'script',
154
- href: url
155
- }));
156
- });
157
-
158
- async function loadJSItem(item, context) {
159
- if (!item.loaded) {
160
- if (item.type === 'script') {
161
- item.loaded = new Promise((resolve, reject) => {
162
- var _item$data;
163
-
164
- document.head.append(createElement('script', _extends$1({}, item.data, {
165
- onload: resolve,
166
- onerror: reject
167
- }))); // Run inline script synchronously
168
-
169
- if (!((_item$data = item.data) != null && _item$data.src)) resolve(undefined);
170
- }).then(() => {
171
- item.loaded = true;
172
- });
173
- }
174
-
175
- if (item.type === 'iife') {
176
- const {
177
- fn,
178
- getParams
179
- } = item.data;
180
- fn(...((getParams == null ? void 0 : getParams(context)) || []));
181
- item.loaded = true;
182
- }
183
- }
184
-
185
- await item.loaded;
186
- }
187
-
188
- function loadCSSItem(item) {
189
- if (item.loaded) return;
190
- item.loaded = true;
191
-
192
- if (item.type === 'style') {
193
- document.head.append(createElement('style', {
194
- textContent: item.data
195
- }));
196
- } else if (item.type === 'stylesheet') {
197
- document.head.append(createElement('link', _extends$1({
198
- rel: 'stylesheet'
199
- }, item.data)));
200
- }
201
- }
202
-
203
- async function loadJS(items, context) {
204
- const needPreload = items.filter(item => {
205
- var _item$data2;
206
-
207
- return item.type === 'script' && ((_item$data2 = item.data) == null ? void 0 : _item$data2.src);
208
- });
209
- if (needPreload.length > 1) needPreload.forEach(item => memoizedPreloadJS(item.data.src));
210
- context = _extends$1({
211
- getMarkmap: () => window.markmap
212
- }, context);
213
-
214
- for (const item of items) {
215
- await loadJSItem(item, context);
216
- }
217
- }
218
- function loadCSS(items) {
219
- for (const item of items) {
220
- loadCSSItem(item);
221
- }
222
- }
18
+ var d3__namespace = /*#__PURE__*/_interopNamespaceDefault(d3);
223
19
 
224
20
  function _extends() {
225
- _extends = Object.assign || function (target) {
21
+ _extends = Object.assign ? Object.assign.bind() : function (target) {
226
22
  for (var i = 1; i < arguments.length; i++) {
227
23
  var source = arguments[i];
228
-
229
24
  for (var key in source) {
230
25
  if (Object.prototype.hasOwnProperty.call(source, key)) {
231
26
  target[key] = source[key];
232
27
  }
233
28
  }
234
29
  }
235
-
236
30
  return target;
237
31
  };
238
-
239
32
  return _extends.apply(this, arguments);
240
33
  }
241
34
 
242
35
  function count(node) {
243
36
  var sum = 0,
244
- children = node.children,
245
- i = children && children.length;
37
+ children = node.children,
38
+ i = children && children.length;
246
39
  if (!i) sum = 1;else while (--i >= 0) sum += children[i].value;
247
40
  node.value = sum;
248
41
  }
249
-
250
42
  function node_count () {
251
43
  return this.eachAfter(count);
252
44
  }
253
45
 
254
46
  function node_each (callback) {
255
47
  var node = this,
256
- current,
257
- next = [node],
258
- children,
259
- i,
260
- n;
261
-
48
+ current,
49
+ next = [node],
50
+ children,
51
+ i,
52
+ n;
262
53
  do {
263
54
  current = next.reverse(), next = [];
264
-
265
55
  while (node = current.pop()) {
266
56
  callback(node), children = node.children;
267
57
  if (children) for (i = 0, n = children.length; i < n; ++i) {
@@ -269,56 +59,48 @@ function node_each (callback) {
269
59
  }
270
60
  }
271
61
  } while (next.length);
272
-
273
62
  return this;
274
63
  }
275
64
 
276
65
  function node_eachBefore (callback) {
277
66
  var node = this,
278
- nodes = [node],
279
- children,
280
- i;
281
-
67
+ nodes = [node],
68
+ children,
69
+ i;
282
70
  while (node = nodes.pop()) {
283
71
  callback(node), children = node.children;
284
72
  if (children) for (i = children.length - 1; i >= 0; --i) {
285
73
  nodes.push(children[i]);
286
74
  }
287
75
  }
288
-
289
76
  return this;
290
77
  }
291
78
 
292
79
  function node_eachAfter (callback) {
293
80
  var node = this,
294
- nodes = [node],
295
- next = [],
296
- children,
297
- i,
298
- n;
299
-
81
+ nodes = [node],
82
+ next = [],
83
+ children,
84
+ i,
85
+ n;
300
86
  while (node = nodes.pop()) {
301
87
  next.push(node), children = node.children;
302
88
  if (children) for (i = 0, n = children.length; i < n; ++i) {
303
89
  nodes.push(children[i]);
304
90
  }
305
91
  }
306
-
307
92
  while (node = next.pop()) {
308
93
  callback(node);
309
94
  }
310
-
311
95
  return this;
312
96
  }
313
97
 
314
98
  function node_sum (value) {
315
99
  return this.eachAfter(function (node) {
316
100
  var sum = +value(node.data) || 0,
317
- children = node.children,
318
- i = children && children.length;
319
-
101
+ children = node.children,
102
+ i = children && children.length;
320
103
  while (--i >= 0) sum += children[i].value;
321
-
322
104
  node.value = sum;
323
105
  });
324
106
  }
@@ -333,49 +115,40 @@ function node_sort (compare) {
333
115
 
334
116
  function node_path (end) {
335
117
  var start = this,
336
- ancestor = leastCommonAncestor(start, end),
337
- nodes = [start];
338
-
118
+ ancestor = leastCommonAncestor(start, end),
119
+ nodes = [start];
339
120
  while (start !== ancestor) {
340
121
  start = start.parent;
341
122
  nodes.push(start);
342
123
  }
343
-
344
124
  var k = nodes.length;
345
-
346
125
  while (end !== ancestor) {
347
126
  nodes.splice(k, 0, end);
348
127
  end = end.parent;
349
128
  }
350
-
351
129
  return nodes;
352
130
  }
353
-
354
131
  function leastCommonAncestor(a, b) {
355
132
  if (a === b) return a;
356
133
  var aNodes = a.ancestors(),
357
- bNodes = b.ancestors(),
358
- c = null;
134
+ bNodes = b.ancestors(),
135
+ c = null;
359
136
  a = aNodes.pop();
360
137
  b = bNodes.pop();
361
-
362
138
  while (a === b) {
363
139
  c = a;
364
140
  a = aNodes.pop();
365
141
  b = bNodes.pop();
366
142
  }
367
-
368
143
  return c;
369
144
  }
370
145
 
371
146
  function node_ancestors () {
372
147
  var node = this,
373
- nodes = [node];
374
-
148
+ nodes = [node];
375
149
  while (node = node.parent) {
376
150
  nodes.push(node);
377
151
  }
378
-
379
152
  return nodes;
380
153
  }
381
154
 
@@ -399,7 +172,7 @@ function node_leaves () {
399
172
 
400
173
  function node_links () {
401
174
  var root = this,
402
- links = [];
175
+ links = [];
403
176
  root.each(function (node) {
404
177
  if (node !== root) {
405
178
  // Don’t include the root’s parent, if any.
@@ -414,21 +187,18 @@ function node_links () {
414
187
 
415
188
  function hierarchy(data, children) {
416
189
  var root = new Node$1(data),
417
- valued = +data.value && (root.value = data.value),
418
- node,
419
- nodes = [root],
420
- child,
421
- childs,
422
- i,
423
- n;
190
+ valued = +data.value && (root.value = data.value),
191
+ node,
192
+ nodes = [root],
193
+ child,
194
+ childs,
195
+ i,
196
+ n;
424
197
  if (children == null) children = defaultChildren;
425
-
426
198
  while (node = nodes.pop()) {
427
199
  if (valued) node.value = +node.data.value;
428
-
429
200
  if ((childs = children(node.data)) && (n = childs.length)) {
430
201
  node.children = new Array(n);
431
-
432
202
  for (i = n - 1; i >= 0; --i) {
433
203
  nodes.push(child = node.children[i] = new Node$1(childs[i]));
434
204
  child.parent = node;
@@ -436,25 +206,19 @@ function hierarchy(data, children) {
436
206
  }
437
207
  }
438
208
  }
439
-
440
209
  return root.eachBefore(computeHeight);
441
210
  }
442
-
443
211
  function node_copy() {
444
212
  return hierarchy(this).eachBefore(copyData);
445
213
  }
446
-
447
214
  function defaultChildren(d) {
448
215
  return d.children;
449
216
  }
450
-
451
217
  function copyData(node) {
452
218
  node.data = node.data.data;
453
219
  }
454
-
455
220
  function computeHeight(node) {
456
221
  var height = 0;
457
-
458
222
  do node.height = height; while ((node = node.parent) && node.height < ++height);
459
223
  }
460
224
  function Node$1(data) {
@@ -478,110 +242,29 @@ Node$1.prototype = hierarchy.prototype = {
478
242
  copy: node_copy
479
243
  };
480
244
 
481
- var name = "d3-flextree";
482
- var version$1 = "2.1.2";
483
- var main = "build/d3-flextree.js";
484
- var module = "index";
485
- var author = {
486
- name: "Chris Maloney",
487
- url: "http://chrismaloney.org"
488
- };
489
- var description = "Flexible tree layout algorithm that allows for variable node sizes.";
490
- var keywords = [
491
- "d3",
492
- "d3-module",
493
- "layout",
494
- "tree",
495
- "hierarchy",
496
- "d3-hierarchy",
497
- "plugin",
498
- "d3-plugin",
499
- "infovis",
500
- "visualization",
501
- "2d"
502
- ];
503
- var homepage = "https://github.com/klortho/d3-flextree";
504
- var license = "WTFPL";
505
- var repository = {
506
- type: "git",
507
- url: "https://github.com/klortho/d3-flextree.git"
508
- };
509
- var scripts = {
510
- clean: "rm -rf build demo test",
511
- "build:demo": "rollup -c --environment BUILD:demo",
512
- "build:dev": "rollup -c --environment BUILD:dev",
513
- "build:prod": "rollup -c --environment BUILD:prod",
514
- "build:test": "rollup -c --environment BUILD:test",
515
- build: "rollup -c",
516
- lint: "eslint index.js src",
517
- "test:main": "node test/bundle.js",
518
- "test:browser": "node test/browser-tests.js",
519
- test: "npm-run-all test:*",
520
- prepare: "npm-run-all clean build lint test"
521
- };
522
- var dependencies = {
523
- "d3-hierarchy": "^1.1.5"
524
- };
525
- var devDependencies = {
526
- "babel-plugin-external-helpers": "^6.22.0",
527
- "babel-preset-es2015-rollup": "^3.0.0",
528
- d3: "^4.13.0",
529
- "d3-selection-multi": "^1.0.1",
530
- eslint: "^4.19.1",
531
- jsdom: "^11.6.2",
532
- "npm-run-all": "^4.1.2",
533
- rollup: "^0.55.3",
534
- "rollup-plugin-babel": "^2.7.1",
535
- "rollup-plugin-commonjs": "^8.0.2",
536
- "rollup-plugin-copy": "^0.2.3",
537
- "rollup-plugin-json": "^2.3.0",
538
- "rollup-plugin-node-resolve": "^3.0.2",
539
- "rollup-plugin-uglify": "^3.0.0",
540
- "uglify-es": "^3.3.9"
541
- };
542
- var packageInfo = {
543
- name: name,
544
- version: version$1,
545
- main: main,
546
- module: module,
547
- "jsnext:main": "index",
548
- author: author,
549
- description: description,
550
- keywords: keywords,
551
- homepage: homepage,
552
- license: license,
553
- repository: repository,
554
- scripts: scripts,
555
- dependencies: dependencies,
556
- devDependencies: devDependencies
557
- };
245
+ var version = "2.1.1";
558
246
 
559
- const {
560
- version
561
- } = packageInfo;
562
247
  const defaults = Object.freeze({
563
248
  children: data => data.children,
564
249
  nodeSize: node => node.data.size,
565
250
  spacing: 0
566
- }); // Create a layout function with customizable options. Per D3-style, the
251
+ });
252
+
253
+ // Create a layout function with customizable options. Per D3-style, the
567
254
  // options can be set at any time using setter methods. The layout function
568
255
  // will compute the tree node positions based on the options in effect at the
569
256
  // time it is called.
570
-
571
257
  function flextree(options) {
572
258
  const opts = Object.assign({}, defaults, options);
573
-
574
259
  function accessor(name) {
575
260
  const opt = opts[name];
576
261
  return typeof opt === 'function' ? opt : () => opt;
577
262
  }
578
-
579
263
  function layout(tree) {
580
264
  const wtree = wrap(getWrapper(), tree, node => node.children);
581
265
  wtree.update();
582
266
  return wtree.data;
583
267
  }
584
-
585
268
  function getFlexNode() {
586
269
  const nodeSize = accessor('nodeSize');
587
270
  const spacing = accessor('spacing');
@@ -589,78 +272,60 @@ function flextree(options) {
589
272
  constructor(data) {
590
273
  super(data);
591
274
  }
592
-
593
275
  copy() {
594
276
  const c = wrap(this.constructor, this, node => node.children);
595
277
  c.each(node => node.data = node.data.data);
596
278
  return c;
597
279
  }
598
-
599
280
  get size() {
600
281
  return nodeSize(this);
601
282
  }
602
-
603
283
  spacing(oNode) {
604
284
  return spacing(this, oNode);
605
285
  }
606
-
607
286
  get nodes() {
608
287
  return this.descendants();
609
288
  }
610
-
611
289
  get xSize() {
612
290
  return this.size[0];
613
291
  }
614
-
615
292
  get ySize() {
616
293
  return this.size[1];
617
294
  }
618
-
619
295
  get top() {
620
296
  return this.y;
621
297
  }
622
-
623
298
  get bottom() {
624
299
  return this.y + this.ySize;
625
300
  }
626
-
627
301
  get left() {
628
302
  return this.x - this.xSize / 2;
629
303
  }
630
-
631
304
  get right() {
632
305
  return this.x + this.xSize / 2;
633
306
  }
634
-
635
307
  get root() {
636
308
  const ancs = this.ancestors();
637
309
  return ancs[ancs.length - 1];
638
310
  }
639
-
640
311
  get numChildren() {
641
312
  return this.hasChildren ? this.children.length : 0;
642
313
  }
643
-
644
314
  get hasChildren() {
645
315
  return !this.noChildren;
646
316
  }
647
-
648
317
  get noChildren() {
649
318
  return this.children === null;
650
319
  }
651
-
652
320
  get firstChild() {
653
321
  return this.hasChildren ? this.children[0] : null;
654
322
  }
655
-
656
323
  get lastChild() {
657
324
  return this.hasChildren ? this.children[this.numChildren - 1] : null;
658
325
  }
659
-
660
326
  get extents() {
661
327
  return (this.children || []).reduce((acc, kid) => FlexNode.maxExtents(acc, kid.extents), this.nodeExtents);
662
328
  }
663
-
664
329
  get nodeExtents() {
665
330
  return {
666
331
  top: this.top,
@@ -669,7 +334,6 @@ function flextree(options) {
669
334
  right: this.right
670
335
  };
671
336
  }
672
-
673
337
  static maxExtents(e0, e1) {
674
338
  return {
675
339
  top: Math.min(e0.top, e1.top),
@@ -678,10 +342,8 @@ function flextree(options) {
678
342
  right: Math.max(e0.right, e1.right)
679
343
  };
680
344
  }
681
-
682
345
  };
683
346
  }
684
-
685
347
  function getWrapper() {
686
348
  const FlexNode = getFlexNode();
687
349
  const nodeSize = accessor('nodeSize');
@@ -704,40 +366,31 @@ function flextree(options) {
704
366
  rThr: null
705
367
  });
706
368
  }
707
-
708
369
  get size() {
709
370
  return nodeSize(this.data);
710
371
  }
711
-
712
372
  spacing(oNode) {
713
373
  return spacing(this.data, oNode.data);
714
374
  }
715
-
716
375
  get x() {
717
376
  return this.data.x;
718
377
  }
719
-
720
378
  set x(v) {
721
379
  this.data.x = v;
722
380
  }
723
-
724
381
  get y() {
725
382
  return this.data.y;
726
383
  }
727
-
728
384
  set y(v) {
729
385
  this.data.y = v;
730
386
  }
731
-
732
387
  update() {
733
388
  layoutChildren(this);
734
389
  resolveX(this);
735
390
  return this;
736
391
  }
737
-
738
392
  };
739
393
  }
740
-
741
394
  function wrap(FlexClass, treeData, children) {
742
395
  const _wrap = (data, parent) => {
743
396
  const node = new FlexClass(data);
@@ -749,41 +402,32 @@ function flextree(options) {
749
402
  });
750
403
  const kidsData = children(data) || [];
751
404
  node.children = kidsData.length === 0 ? null : kidsData.map(kd => _wrap(kd, node));
752
-
753
405
  if (node.children) {
754
406
  Object.assign(node, node.children.reduce((hl, kid) => ({
755
407
  height: Math.max(hl.height, kid.height + 1),
756
408
  length: hl.length + kid.length
757
409
  }), node));
758
410
  }
759
-
760
411
  return node;
761
412
  };
762
-
763
413
  return _wrap(treeData, null);
764
414
  }
765
-
766
415
  Object.assign(layout, {
767
416
  nodeSize(arg) {
768
417
  return arguments.length ? (opts.nodeSize = arg, layout) : opts.nodeSize;
769
418
  },
770
-
771
419
  spacing(arg) {
772
420
  return arguments.length ? (opts.spacing = arg, layout) : opts.spacing;
773
421
  },
774
-
775
422
  children(arg) {
776
423
  return arguments.length ? (opts.children = arg, layout) : opts.children;
777
424
  },
778
-
779
425
  hierarchy(treeData, children) {
780
426
  const kids = typeof children === 'undefined' ? opts.children : children;
781
427
  return wrap(getFlexNode(), treeData, kids);
782
428
  },
783
-
784
429
  dump(tree) {
785
430
  const nodeSize = accessor('nodeSize');
786
-
787
431
  const _dump = i0 => node => {
788
432
  const i1 = i0 + ' ';
789
433
  const i2 = i0 + ' ';
@@ -796,22 +440,19 @@ function flextree(options) {
796
440
  const kdumps = kids.length === 0 ? ' ' : `,${i1}children: [${i2}${kids.map(_dump(i2)).join(i2)}${i1}],${i0}`;
797
441
  return `{ size: [${size.join(', ')}],${i1}x: ${x}, y: ${y}${kdumps}},`;
798
442
  };
799
-
800
443
  return _dump('\n')(tree);
801
444
  }
802
-
803
445
  });
804
446
  return layout;
805
447
  }
806
448
  flextree.version = version;
807
-
808
449
  const layoutChildren = (w, y = 0) => {
809
450
  w.y = y;
810
451
  (w.children || []).reduce((acc, kid) => {
811
452
  const [i, lastLows] = acc;
812
- layoutChildren(kid, w.y + w.ySize); // The lowest vertical coordinate while extreme nodes still point
453
+ layoutChildren(kid, w.y + w.ySize);
454
+ // The lowest vertical coordinate while extreme nodes still point
813
455
  // in current subtree.
814
-
815
456
  const lowY = (i === 0 ? kid.lExt : kid.rExt).bottom;
816
457
  if (i !== 0) separate(w, i, lastLows);
817
458
  const lows = updateLows(lowY, i, lastLows);
@@ -820,12 +461,12 @@ const layoutChildren = (w, y = 0) => {
820
461
  shiftChange(w);
821
462
  positionRoot(w);
822
463
  return w;
823
- }; // Resolves the relative coordinate properties - relX and prelim --
464
+ };
465
+
466
+ // Resolves the relative coordinate properties - relX and prelim --
824
467
  // to set the final, absolute x coordinate for each node. This also sets
825
468
  // `prelim` to 0, so that `relX` for each node is its x-coordinate relative
826
469
  // to its parent.
827
-
828
-
829
470
  const resolveX = (w, prevSum, parentX) => {
830
471
  // A call to resolveX without arguments is assumed to be for the root of
831
472
  // the tree. This will set the root's x-coord to zero.
@@ -833,17 +474,16 @@ const resolveX = (w, prevSum, parentX) => {
833
474
  prevSum = -w.relX - w.prelim;
834
475
  parentX = 0;
835
476
  }
836
-
837
477
  const sum = prevSum + w.relX;
838
478
  w.relX = sum + w.prelim - parentX;
839
479
  w.prelim = 0;
840
480
  w.x = parentX + w.relX;
841
481
  (w.children || []).forEach(k => resolveX(k, sum, w.x));
842
482
  return w;
843
- }; // Process shift and change for all children, to add intermediate spacing to
844
- // each child's modifier.
845
-
483
+ };
846
484
 
485
+ // Process shift and change for all children, to add intermediate spacing to
486
+ // each child's modifier.
847
487
  const shiftChange = w => {
848
488
  (w.children || []).reduce((acc, child) => {
849
489
  const [lastShiftSum, lastChangeSum] = acc;
@@ -852,11 +492,10 @@ const shiftChange = w => {
852
492
  child.relX += changeSum;
853
493
  return [shiftSum, changeSum];
854
494
  }, [0, 0]);
855
- }; // Separates the latest child from its previous sibling
495
+ };
856
496
 
497
+ // Separates the latest child from its previous sibling
857
498
  /* eslint-disable complexity */
858
-
859
-
860
499
  const separate = (w, i, lows) => {
861
500
  const lSib = w.children[i - 1];
862
501
  const curSubtree = w.children[i];
@@ -865,56 +504,49 @@ const separate = (w, i, lows) => {
865
504
  let lContour = curSubtree;
866
505
  let lSumMods = curSubtree.relX;
867
506
  let isFirst = true;
868
-
869
507
  while (rContour && lContour) {
870
- if (rContour.bottom > lows.lowY) lows = lows.next; // How far to the left of the right side of rContour is the left side
508
+ if (rContour.bottom > lows.lowY) lows = lows.next;
509
+ // How far to the left of the right side of rContour is the left side
871
510
  // of lContour? First compute the center-to-center distance, then add
872
511
  // the "spacing"
873
-
874
512
  const dist = rSumMods + rContour.prelim - (lSumMods + lContour.prelim) + rContour.xSize / 2 + lContour.xSize / 2 + rContour.spacing(lContour);
875
-
876
513
  if (dist > 0 || dist < 0 && isFirst) {
877
- lSumMods += dist; // Move subtree by changing relX.
878
-
514
+ lSumMods += dist;
515
+ // Move subtree by changing relX.
879
516
  moveSubtree(curSubtree, dist);
880
517
  distributeExtra(w, i, lows.index, dist);
881
518
  }
882
-
883
- isFirst = false; // Advance highest node(s) and sum(s) of modifiers
884
-
519
+ isFirst = false;
520
+ // Advance highest node(s) and sum(s) of modifiers
885
521
  const rightBottom = rContour.bottom;
886
522
  const leftBottom = lContour.bottom;
887
-
888
523
  if (rightBottom <= leftBottom) {
889
524
  rContour = nextRContour(rContour);
890
525
  if (rContour) rSumMods += rContour.relX;
891
526
  }
892
-
893
527
  if (rightBottom >= leftBottom) {
894
528
  lContour = nextLContour(lContour);
895
529
  if (lContour) lSumMods += lContour.relX;
896
530
  }
897
- } // Set threads and update extreme nodes. In the first case, the
531
+ }
532
+ // Set threads and update extreme nodes. In the first case, the
898
533
  // current subtree is taller than the left siblings.
899
-
900
-
901
- if (!rContour && lContour) setLThr(w, i, lContour, lSumMods); // In the next case, the left siblings are taller than the current subtree
534
+ if (!rContour && lContour) setLThr(w, i, lContour, lSumMods);
535
+ // In the next case, the left siblings are taller than the current subtree
902
536
  else if (rContour && !lContour) setRThr(w, i, rContour, rSumMods);
903
537
  };
904
538
  /* eslint-enable complexity */
905
- // Move subtree by changing relX.
906
-
907
539
 
540
+ // Move subtree by changing relX.
908
541
  const moveSubtree = (subtree, distance) => {
909
542
  subtree.relX += distance;
910
543
  subtree.lExtRelX += distance;
911
544
  subtree.rExtRelX += distance;
912
545
  };
913
-
914
546
  const distributeExtra = (w, curSubtreeI, leftSibI, dist) => {
915
547
  const curSubtree = w.children[curSubtreeI];
916
- const n = curSubtreeI - leftSibI; // Are there intermediate children?
917
-
548
+ const n = curSubtreeI - leftSibI;
549
+ // Are there intermediate children?
918
550
  if (n > 1) {
919
551
  const delta = dist / n;
920
552
  w.children[leftSibI + 1].shift += delta;
@@ -922,31 +554,28 @@ const distributeExtra = (w, curSubtreeI, leftSibI, dist) => {
922
554
  curSubtree.change -= dist - delta;
923
555
  }
924
556
  };
925
-
926
557
  const nextLContour = w => {
927
558
  return w.hasChildren ? w.firstChild : w.lThr;
928
559
  };
929
-
930
560
  const nextRContour = w => {
931
561
  return w.hasChildren ? w.lastChild : w.rThr;
932
562
  };
933
-
934
563
  const setLThr = (w, i, lContour, lSumMods) => {
935
564
  const firstChild = w.firstChild;
936
565
  const lExt = firstChild.lExt;
937
566
  const curSubtree = w.children[i];
938
- lExt.lThr = lContour; // Change relX so that the sum of modifier after following thread is correct.
939
-
567
+ lExt.lThr = lContour;
568
+ // Change relX so that the sum of modifier after following thread is correct.
940
569
  const diff = lSumMods - lContour.relX - firstChild.lExtRelX;
941
- lExt.relX += diff; // Change preliminary x coordinate so that the node does not move.
942
-
943
- lExt.prelim -= diff; // Update extreme node and its sum of modifiers.
944
-
570
+ lExt.relX += diff;
571
+ // Change preliminary x coordinate so that the node does not move.
572
+ lExt.prelim -= diff;
573
+ // Update extreme node and its sum of modifiers.
945
574
  firstChild.lExt = curSubtree.lExt;
946
575
  firstChild.lExtRelX = curSubtree.lExtRelX;
947
- }; // Mirror image of setLThr.
948
-
576
+ };
949
577
 
578
+ // Mirror image of setLThr.
950
579
  const setRThr = (w, i, rContour, rSumMods) => {
951
580
  const curSubtree = w.children[i];
952
581
  const rExt = curSubtree.rExt;
@@ -957,9 +586,9 @@ const setRThr = (w, i, rContour, rSumMods) => {
957
586
  rExt.prelim -= diff;
958
587
  curSubtree.rExt = lSib.rExt;
959
588
  curSubtree.rExtRelX = lSib.rExtRelX;
960
- }; // Position root between children, taking into account their modifiers
961
-
589
+ };
962
590
 
591
+ // Position root between children, taking into account their modifiers
963
592
  const positionRoot = w => {
964
593
  if (w.hasChildren) {
965
594
  const k0 = w.firstChild;
@@ -973,15 +602,14 @@ const positionRoot = w => {
973
602
  rExtRelX: kf.rExtRelX
974
603
  });
975
604
  }
976
- }; // Make/maintain a linked list of the indexes of left siblings and their
977
- // lowest vertical coordinate.
978
-
605
+ };
979
606
 
607
+ // Make/maintain a linked list of the indexes of left siblings and their
608
+ // lowest vertical coordinate.
980
609
  const updateLows = (lowY, index, lastLows) => {
981
610
  // Remove siblings that are hidden by the new subtree.
982
- while (lastLows !== null && lowY >= lastLows.lowY) lastLows = lastLows.next; // Prepend the new subtree.
983
-
984
-
611
+ while (lastLows !== null && lowY >= lastLows.lowY) lastLows = lastLows.next;
612
+ // Prepend the new subtree.
985
613
  return {
986
614
  lowY,
987
615
  index,
@@ -1001,19 +629,15 @@ var NS_ATTRS = {
1001
629
  actuate: XLINK_NS,
1002
630
  href: XLINK_NS
1003
631
  };
1004
-
1005
632
  var isLeaf = function isLeaf(c) {
1006
633
  return typeof c === 'string' || typeof c === 'number';
1007
634
  };
1008
-
1009
635
  var isElement = function isElement(c) {
1010
636
  return (c == null ? void 0 : c.vtype) === VTYPE_ELEMENT;
1011
637
  };
1012
-
1013
638
  var isRenderFunction = function isRenderFunction(c) {
1014
639
  return (c == null ? void 0 : c.vtype) === VTYPE_FUNCTION;
1015
640
  };
1016
-
1017
641
  function jsx(type, props) {
1018
642
  var vtype;
1019
643
  if (typeof type === 'string') vtype = VTYPE_ELEMENT;else if (typeof type === 'function') vtype = VTYPE_FUNCTION;else throw new Error('Invalid VNode type');
@@ -1023,15 +647,12 @@ function jsx(type, props) {
1023
647
  props: props
1024
648
  };
1025
649
  }
1026
-
1027
650
  function Fragment(props) {
1028
651
  return props.children;
1029
652
  }
1030
-
1031
653
  var DEFAULT_ENV = {
1032
654
  isSvg: false
1033
655
  };
1034
-
1035
656
  function insertDom(parent, ref) {
1036
657
  if (ref.type === MOUNT_SINGLE) {
1037
658
  if (ref.node != null) parent.append(ref.node);
@@ -1043,11 +664,9 @@ function insertDom(parent, ref) {
1043
664
  throw new Error("Unkown ref type " + JSON.stringify(ref));
1044
665
  }
1045
666
  }
1046
-
1047
667
  function mountAttributes(domElement, props, env) {
1048
668
  for (var key in props) {
1049
669
  if (key === 'key' || key === 'children' || key === 'ref') continue;
1050
-
1051
670
  if (key === 'dangerouslySetInnerHTML') {
1052
671
  domElement.innerHTML = props[key].__html;
1053
672
  } else if (key === 'innerHTML' || key === 'textContent' || key === 'innerText') {
@@ -1059,22 +678,18 @@ function mountAttributes(domElement, props, env) {
1059
678
  }
1060
679
  }
1061
680
  }
1062
-
1063
681
  var attrMap = {
1064
682
  className: 'class',
1065
683
  labelFor: 'for'
1066
684
  };
1067
-
1068
685
  function setDOMAttribute(el, attr, value, isSVG) {
1069
686
  attr = attrMap[attr] || attr;
1070
-
1071
687
  if (value === true) {
1072
688
  el.setAttribute(attr, '');
1073
689
  } else if (value === false) {
1074
690
  el.removeAttribute(attr);
1075
691
  } else {
1076
692
  var namespace = isSVG ? NS_ATTRS[attr] : undefined;
1077
-
1078
693
  if (namespace !== undefined) {
1079
694
  el.setAttributeNS(namespace, attr, value);
1080
695
  } else {
@@ -1082,91 +697,72 @@ function setDOMAttribute(el, attr, value, isSVG) {
1082
697
  }
1083
698
  }
1084
699
  }
1085
-
1086
700
  function mount(vnode, env) {
1087
701
  if (env === void 0) {
1088
702
  env = DEFAULT_ENV;
1089
703
  }
1090
-
1091
704
  if (vnode == null || typeof vnode === 'boolean') {
1092
705
  return {
1093
706
  type: MOUNT_SINGLE,
1094
707
  node: null
1095
708
  };
1096
709
  }
1097
-
1098
710
  if (vnode instanceof Node) {
1099
711
  return {
1100
712
  type: MOUNT_SINGLE,
1101
713
  node: vnode
1102
714
  };
1103
715
  }
1104
-
1105
716
  if (isRenderFunction(vnode)) {
1106
717
  var _ref = vnode,
1107
- type = _ref.type,
1108
- props = _ref.props;
1109
-
718
+ type = _ref.type,
719
+ props = _ref.props;
1110
720
  if (type === Fragment) {
1111
721
  var node = document.createDocumentFragment();
1112
-
1113
722
  if (props.children) {
1114
723
  var childrenRef = mount(props.children, env);
1115
724
  insertDom(node, childrenRef);
1116
725
  }
1117
-
1118
726
  return {
1119
727
  type: MOUNT_SINGLE,
1120
728
  node: node
1121
729
  };
1122
730
  }
1123
-
1124
731
  var childVNode = type(props);
1125
732
  return mount(childVNode, env);
1126
733
  }
1127
-
1128
734
  if (isLeaf(vnode)) {
1129
735
  return {
1130
736
  type: MOUNT_SINGLE,
1131
737
  node: document.createTextNode("" + vnode)
1132
738
  };
1133
739
  }
1134
-
1135
740
  if (isElement(vnode)) {
1136
741
  var _node;
1137
-
1138
742
  var _ref2 = vnode,
1139
- _type = _ref2.type,
1140
- _props = _ref2.props;
1141
-
743
+ _type = _ref2.type,
744
+ _props = _ref2.props;
1142
745
  if (!env.isSvg && _type === 'svg') {
1143
746
  env = Object.assign({}, env, {
1144
747
  isSvg: true
1145
748
  });
1146
749
  }
1147
-
1148
750
  if (!env.isSvg) {
1149
751
  _node = document.createElement(_type);
1150
752
  } else {
1151
753
  _node = document.createElementNS(SVG_NS, _type);
1152
754
  }
1153
-
1154
755
  mountAttributes(_node, _props, env);
1155
-
1156
756
  var _childrenRef;
1157
-
1158
757
  if (_props.children) {
1159
758
  var childEnv = env;
1160
-
1161
759
  if (env.isSvg && _type === 'foreignObject') {
1162
760
  childEnv = Object.assign({}, childEnv, {
1163
761
  isSvg: false
1164
762
  });
1165
763
  }
1166
-
1167
764
  _childrenRef = mount(_props.children, childEnv);
1168
765
  }
1169
-
1170
766
  if (_childrenRef != null) insertDom(_node, _childrenRef);
1171
767
  var ref = _props.ref;
1172
768
  if (typeof ref === 'function') ref(_node);
@@ -1175,7 +771,6 @@ function mount(vnode, env) {
1175
771
  node: _node
1176
772
  };
1177
773
  }
1178
-
1179
774
  if (Array.isArray(vnode)) {
1180
775
  return {
1181
776
  type: MOUNT_ARRAY,
@@ -1184,80 +779,66 @@ function mount(vnode, env) {
1184
779
  })
1185
780
  };
1186
781
  }
1187
-
1188
782
  throw new Error('mount: Invalid Vnode!');
1189
783
  }
1190
-
1191
784
  function flattenWithoutNull(array) {
1192
785
  var result = [];
1193
-
1194
786
  for (var i = 0; i < array.length; i += 1) {
1195
787
  var item = array[i];
1196
788
  if (Array.isArray(item)) result = result.concat(flattenWithoutNull(item));else if (item != null) result.push(item);
1197
789
  }
1198
-
1199
790
  return result;
1200
791
  }
1201
-
1202
792
  function asDom(result) {
1203
793
  if (result.type === MOUNT_SINGLE) {
1204
794
  return result.node;
1205
795
  }
1206
-
1207
796
  return result.children.map(asDom);
1208
797
  }
1209
798
  /**
1210
799
  * Mount vdom as real DOM nodes.
1211
800
  */
1212
801
 
1213
-
1214
802
  function mountDom(vnode) {
1215
803
  if (Array.isArray(vnode)) {
1216
804
  return flattenWithoutNull(vnode.map(mountDom));
1217
805
  }
1218
-
1219
806
  return asDom(mount(vnode));
1220
807
  }
1221
808
 
1222
- var css_248z$1 = ".markmap{font:300 16px/20px sans-serif}.markmap-link{fill:none}.markmap-node>circle{cursor:pointer}.markmap-foreign{display:inline-block}.markmap-foreign a{color:#0097e6}.markmap-foreign a:hover{color:#00a8ff}.markmap-foreign code{background-color:#f0f0f0;border-radius:2px;color:#555;font-size:calc(1em - 2px)}.markmap-foreign :not(pre)>code{padding:.2em .4em}.markmap-foreign del{text-decoration:line-through}.markmap-foreign em{font-style:italic}.markmap-foreign strong{font-weight:bolder}.markmap-foreign mark{background:#ffeaa7}.markmap-foreign pre,.markmap-foreign pre[class*=language-]{margin:0;padding:.2em .4em}";
809
+ var css_248z$1 = ".markmap{font:300 16px/20px sans-serif}.markmap-link{fill:none}.markmap-node>circle{cursor:pointer}.markmap-foreign{display:inline-block}.markmap-foreign a{color:#0097e6}.markmap-foreign a:hover{color:#00a8ff}.markmap-foreign code{background-color:#f0f0f0;border-radius:2px;color:#555;font-size:calc(1em - 2px)}.markmap-foreign :not(pre)>code{padding:.2em .4em}.markmap-foreign del{text-decoration:line-through}.markmap-foreign em{font-style:italic}.markmap-foreign strong{font-weight:700}.markmap-foreign mark{background:#ffeaa7}.markmap-foreign pre,.markmap-foreign pre[class*=language-]{margin:0;padding:.2em .4em}";
1223
810
 
1224
811
  var css_248z = ".markmap-container{height:0;left:-100px;overflow:hidden;position:absolute;top:-100px;width:0}.markmap-container>.markmap-foreign{display:inline-block}.markmap-container>.markmap-foreign>div:last-child{white-space:nowrap}";
1225
812
 
1226
813
  const globalCSS = css_248z$1;
1227
-
1228
814
  function linkWidth(nodeData) {
1229
815
  const data = nodeData.data;
1230
816
  return Math.max(4 - 2 * data.depth, 1.5);
1231
817
  }
1232
-
1233
818
  function adjustSpacing(tree, spacing) {
1234
- walkTree(tree, (d, next) => {
819
+ markmapCommon.walkTree(tree, (d, next) => {
1235
820
  d.ySizeInner = d.ySize - spacing;
1236
821
  d.y += spacing;
1237
822
  next();
1238
823
  }, 'children');
1239
824
  }
1240
-
1241
825
  function minBy(numbers, by) {
1242
826
  const index = d3__namespace.minIndex(numbers, by);
1243
827
  return numbers[index];
1244
828
  }
1245
-
1246
829
  function stopPropagation(e) {
1247
830
  e.stopPropagation();
1248
831
  }
1249
-
1250
832
  function createViewHooks() {
1251
833
  return {
1252
- transformHtml: new Hook()
834
+ transformHtml: new markmapCommon.Hook()
1253
835
  };
1254
836
  }
837
+
1255
838
  /**
1256
839
  * A global hook to refresh all markmaps when called.
1257
840
  */
1258
-
1259
-
1260
- const refreshHook = new Hook();
841
+ const refreshHook = new markmapCommon.Hook();
1261
842
  const defaultColorFn = d3__namespace.scaleOrdinal(d3__namespace.schemeCategory10);
1262
843
  const isMacintosh = typeof navigator !== 'undefined' && navigator.userAgent.includes('Macintosh');
1263
844
  class Markmap {
@@ -1274,19 +855,17 @@ class Markmap {
1274
855
  // Pan with wheels, zoom with ctrl+wheels
1275
856
  if (event.type === 'wheel') return event.ctrlKey && !event.button;
1276
857
  }
1277
-
1278
858
  return (!event.ctrlKey || event.type === 'wheel') && !event.button;
1279
859
  }).on('zoom', this.handleZoom);
1280
860
  this.setOptions(opts);
1281
861
  this.state = {
1282
- id: this.options.id || this.svg.attr('id') || getId()
862
+ id: this.options.id || this.svg.attr('id') || markmapCommon.getId()
1283
863
  };
1284
864
  this.g = this.svg.append('g');
1285
865
  this.revokers.push(refreshHook.tap(() => {
1286
866
  this.setData();
1287
867
  }));
1288
868
  }
1289
-
1290
869
  getStyleContent() {
1291
870
  const {
1292
871
  style
@@ -1297,39 +876,47 @@ class Markmap {
1297
876
  const styleText = typeof style === 'function' ? style(id) : '';
1298
877
  return [this.options.embedGlobalCSS && css_248z$1, styleText].filter(Boolean).join('\n');
1299
878
  }
1300
-
1301
879
  updateStyle() {
1302
- this.svg.attr('class', addClass(this.svg.attr('class'), 'markmap', this.state.id));
880
+ this.svg.attr('class', markmapCommon.addClass(this.svg.attr('class'), 'markmap', this.state.id));
1303
881
  const style = this.getStyleContent();
1304
882
  this.styleNode.text(style);
1305
883
  }
1306
-
1307
884
  handleZoom(e) {
1308
885
  const {
1309
886
  transform
1310
887
  } = e;
1311
888
  this.g.attr('transform', transform);
1312
889
  }
1313
-
1314
890
  handlePan(e) {
1315
891
  e.preventDefault();
1316
892
  const transform = d3__namespace.zoomTransform(this.svg.node());
1317
893
  const newTransform = transform.translate(-e.deltaX / transform.k, -e.deltaY / transform.k);
1318
894
  this.svg.call(this.zoom.transform, newTransform);
1319
895
  }
1320
-
1321
- handleClick(_, d) {
896
+ toggleNode(data, recursive = false) {
1322
897
  var _data$payload;
1323
-
1324
- const {
1325
- data
1326
- } = d;
1327
- data.payload = _extends({}, data.payload, {
1328
- fold: (_data$payload = data.payload) != null && _data$payload.fold ? 0 : 1
1329
- });
1330
- this.renderData(d.data);
898
+ const fold = (_data$payload = data.payload) != null && _data$payload.fold ? 0 : 1;
899
+ if (recursive) {
900
+ // recursively
901
+ markmapCommon.walkTree(data, (item, next) => {
902
+ item.payload = _extends({}, item.payload, {
903
+ fold
904
+ });
905
+ next();
906
+ });
907
+ } else {
908
+ var _data$payload2;
909
+ data.payload = _extends({}, data.payload, {
910
+ fold: (_data$payload2 = data.payload) != null && _data$payload2.fold ? 0 : 1
911
+ });
912
+ }
913
+ this.renderData(data);
914
+ }
915
+ handleClick(e, d) {
916
+ let recursive = this.options.toggleRecursively;
917
+ if (e.ctrlKey) recursive = !recursive;
918
+ this.toggleNode(d.data, recursive);
1331
919
  }
1332
-
1333
920
  initializeData(node) {
1334
921
  let nodeId = 0;
1335
922
  const {
@@ -1350,9 +937,8 @@ class Markmap {
1350
937
  document.body.append(container, style);
1351
938
  const groupStyle = maxWidth ? `max-width: ${maxWidth}px` : '';
1352
939
  let foldRecursively = 0;
1353
- walkTree(node, (item, next, parent) => {
940
+ markmapCommon.walkTree(node, (item, next, parent) => {
1354
941
  var _item$children, _parent$state, _item$payload;
1355
-
1356
942
  item.children = (_item$children = item.children) == null ? void 0 : _item$children.map(child => _extends({}, child));
1357
943
  nodeId += 1;
1358
944
  const group = mountDom(jsx("div", {
@@ -1369,11 +955,10 @@ class Markmap {
1369
955
  id: nodeId,
1370
956
  el: group.firstChild
1371
957
  });
1372
- item.state.path = [parent == null ? void 0 : (_parent$state = parent.state) == null ? void 0 : _parent$state.path, item.state.id].filter(Boolean).join('.');
958
+ item.state.path = [parent == null || (_parent$state = parent.state) == null ? void 0 : _parent$state.path, item.state.id].filter(Boolean).join('.');
1373
959
  color(item); // preload colors
1374
960
 
1375
961
  const isFoldRecursively = ((_item$payload = item.payload) == null ? void 0 : _item$payload.fold) === 2;
1376
-
1377
962
  if (isFoldRecursively) {
1378
963
  foldRecursively += 1;
1379
964
  } else if (foldRecursively || initialExpandLevel >= 0 && item.depth >= initialExpandLevel) {
@@ -1381,56 +966,50 @@ class Markmap {
1381
966
  fold: 1
1382
967
  });
1383
968
  }
1384
-
1385
969
  next();
1386
970
  if (isFoldRecursively) foldRecursively -= 1;
1387
971
  });
1388
- const nodes = arrayFrom(container.childNodes).map(group => group.firstChild);
1389
- this.viewHooks.transformHtml.call(this, nodes); // Clone the rendered HTML and set `white-space: nowrap` to it to detect its max-width.
972
+ const nodes = Array.from(container.childNodes).map(group => group.firstChild);
973
+ this.viewHooks.transformHtml.call(this, nodes);
974
+ // Clone the rendered HTML and set `white-space: nowrap` to it to detect its max-width.
1390
975
  // The parent node will have a width of the max-width and the original content without
1391
976
  // `white-space: nowrap` gets re-layouted, then we will get the expected layout, with
1392
977
  // content in one line as much as possible, and subjecting to the given max-width.
1393
-
1394
978
  nodes.forEach(node => {
1395
979
  node.parentNode.append(node.cloneNode(true));
1396
980
  });
1397
- walkTree(node, (item, next, parent) => {
981
+ markmapCommon.walkTree(node, (item, next, parent) => {
1398
982
  var _parent$state2;
1399
-
1400
983
  const rect = item.state.el.getBoundingClientRect();
1401
984
  item.content = item.state.el.innerHTML;
1402
985
  item.state.size = [Math.ceil(rect.width) + 1, Math.max(Math.ceil(rect.height), nodeMinHeight)];
1403
- item.state.key = [parent == null ? void 0 : (_parent$state2 = parent.state) == null ? void 0 : _parent$state2.id, item.state.id].filter(Boolean).join('.') + // FIXME: find a way to check content hash
986
+ item.state.key = [parent == null || (_parent$state2 = parent.state) == null ? void 0 : _parent$state2.id, item.state.id].filter(Boolean).join('.') +
987
+ // FIXME: find a way to check content hash
1404
988
  item.content;
1405
989
  next();
1406
990
  });
1407
991
  container.remove();
1408
992
  style.remove();
1409
993
  }
1410
-
1411
994
  setOptions(opts) {
1412
995
  this.options = _extends({}, Markmap.defaultOptions, opts);
1413
-
1414
996
  if (this.options.zoom) {
1415
997
  this.svg.call(this.zoom);
1416
998
  } else {
1417
999
  this.svg.on('.zoom', null);
1418
1000
  }
1419
-
1420
1001
  this.svg.on('wheel', this.options.pan ? this.handlePan : null);
1421
1002
  }
1422
-
1423
1003
  setData(data, opts) {
1424
1004
  if (data) this.state.data = data;
1425
1005
  if (opts) this.setOptions(opts);
1006
+ if (!this.state.data) return;
1426
1007
  this.initializeData(this.state.data);
1427
1008
  this.updateStyle();
1428
1009
  this.renderData();
1429
1010
  }
1430
-
1431
1011
  renderData(originData) {
1432
1012
  var _origin$data$state$x, _origin$data$state$y;
1433
-
1434
1013
  if (!this.state.data) return;
1435
1014
  const {
1436
1015
  spacingHorizontal,
@@ -1441,7 +1020,6 @@ class Markmap {
1441
1020
  } = this.options;
1442
1021
  const layout = flextree().children(d => {
1443
1022
  var _d$payload;
1444
-
1445
1023
  return !((_d$payload = d.payload) != null && _d$payload.fold) && d.children;
1446
1024
  }).nodeSize(d => {
1447
1025
  const [width, height] = d.data.state.size;
@@ -1468,9 +1046,10 @@ class Markmap {
1468
1046
  if (autoFit) this.fit();
1469
1047
  const origin = originData && descendants.find(item => item.data === originData) || tree;
1470
1048
  const x0 = (_origin$data$state$x = origin.data.state.x0) != null ? _origin$data$state$x : origin.x;
1471
- const y0 = (_origin$data$state$y = origin.data.state.y0) != null ? _origin$data$state$y : origin.y; // Update the nodes
1049
+ const y0 = (_origin$data$state$y = origin.data.state.y0) != null ? _origin$data$state$y : origin.y;
1472
1050
 
1473
- const node = this.g.selectAll(childSelector('g')).data(descendants, d => d.data.state.key);
1051
+ // Update the nodes
1052
+ const node = this.g.selectAll(markmapCommon.childSelector('g')).data(descendants, d => d.data.state.key);
1474
1053
  const nodeEnter = node.enter().append('g').attr('data-depth', d => d.data.depth).attr('data-path', d => d.data.state.path).attr('transform', d => `translate(${y0 + origin.ySizeInner - d.ySizeInner},${x0 + origin.xSize / 2 - d.xSize})`);
1475
1054
  const nodeExit = this.transition(node.exit());
1476
1055
  nodeExit.select('line').attr('x1', d => d.ySizeInner).attr('x2', d => d.ySizeInner);
@@ -1478,25 +1057,25 @@ class Markmap {
1478
1057
  nodeExit.attr('transform', d => `translate(${origin.y + origin.ySizeInner - d.ySizeInner},${origin.x + origin.xSize / 2 - d.xSize})`).remove();
1479
1058
  const nodeMerge = node.merge(nodeEnter).attr('class', d => {
1480
1059
  var _d$data$payload;
1481
-
1482
1060
  return ['markmap-node', ((_d$data$payload = d.data.payload) == null ? void 0 : _d$data$payload.fold) && 'markmap-fold'].filter(Boolean).join(' ');
1483
1061
  });
1484
- this.transition(nodeMerge).attr('transform', d => `translate(${d.y},${d.x - d.xSize / 2})`); // Update lines under the content
1062
+ this.transition(nodeMerge).attr('transform', d => `translate(${d.y},${d.x - d.xSize / 2})`);
1485
1063
 
1486
- const line = nodeMerge.selectAll(childSelector('line')).data(d => [d], d => d.data.state.key).join(enter => {
1064
+ // Update lines under the content
1065
+ const line = nodeMerge.selectAll(markmapCommon.childSelector('line')).data(d => [d], d => d.data.state.key).join(enter => {
1487
1066
  return enter.append('line').attr('x1', d => d.ySizeInner).attr('x2', d => d.ySizeInner);
1488
1067
  }, update => update, exit => exit.remove());
1489
- this.transition(line).attr('x1', -1).attr('x2', d => d.ySizeInner + 2).attr('y1', d => d.xSize).attr('y2', d => d.xSize).attr('stroke', d => color(d.data)).attr('stroke-width', linkWidth); // Circle to link to children of the node
1068
+ this.transition(line).attr('x1', -1).attr('x2', d => d.ySizeInner + 2).attr('y1', d => d.xSize).attr('y2', d => d.xSize).attr('stroke', d => color(d.data)).attr('stroke-width', linkWidth);
1490
1069
 
1491
- const circle = nodeMerge.selectAll(childSelector('circle')).data(d => d.data.children ? [d] : [], d => d.data.state.key).join(enter => {
1492
- return enter.append('circle').attr('stroke-width', '1.5').attr('cx', d => d.ySizeInner).attr('cy', d => d.xSize).attr('r', 0).on('click', (e, d) => this.handleClick(e, d));
1070
+ // Circle to link to children of the node
1071
+ const circle = nodeMerge.selectAll(markmapCommon.childSelector('circle')).data(d => d.data.children ? [d] : [], d => d.data.state.key).join(enter => {
1072
+ return enter.append('circle').attr('stroke-width', '1.5').attr('cx', d => d.ySizeInner).attr('cy', d => d.xSize).attr('r', 0).on('click', (e, d) => this.handleClick(e, d)).on('mousedown', stopPropagation);
1493
1073
  }, update => update, exit => exit.remove());
1494
1074
  this.transition(circle).attr('r', 6).attr('cx', d => d.ySizeInner).attr('cy', d => d.xSize).attr('stroke', d => color(d.data)).attr('fill', d => {
1495
1075
  var _d$data$payload2;
1496
-
1497
1076
  return (_d$data$payload2 = d.data.payload) != null && _d$data$payload2.fold && d.data.children ? color(d.data) : '#fff';
1498
1077
  });
1499
- const foreignObject = nodeMerge.selectAll(childSelector('foreignObject')).data(d => [d], d => d.data.state.key).join(enter => {
1078
+ const foreignObject = nodeMerge.selectAll(markmapCommon.childSelector('foreignObject')).data(d => [d], d => d.data.state.key).join(enter => {
1500
1079
  const fo = enter.append('foreignObject').attr('class', 'markmap-foreign').attr('x', paddingX).attr('y', 0).style('opacity', 0).on('mousedown', stopPropagation).on('dblclick', stopPropagation);
1501
1080
  fo.append('xhtml:div').select(function select(d) {
1502
1081
  const clone = d.data.state.el.cloneNode(true);
@@ -1505,9 +1084,10 @@ class Markmap {
1505
1084
  }).attr('xmlns', 'http://www.w3.org/1999/xhtml');
1506
1085
  return fo;
1507
1086
  }, update => update, exit => exit.remove()).attr('width', d => Math.max(0, d.ySizeInner - paddingX * 2)).attr('height', d => d.xSize);
1508
- this.transition(foreignObject).style('opacity', 1); // Update the links
1087
+ this.transition(foreignObject).style('opacity', 1);
1509
1088
 
1510
- const path = this.g.selectAll(childSelector('path')).data(links, d => d.target.data.state.key).join(enter => {
1089
+ // Update the links
1090
+ const path = this.g.selectAll(markmapCommon.childSelector('path')).data(links, d => d.target.data.state.key).join(enter => {
1511
1091
  const source = [y0 + origin.ySizeInner, x0 + origin.xSize / 2];
1512
1092
  return enter.insert('path', 'g').attr('class', 'markmap-link').attr('data-depth', d => d.target.data.depth).attr('data-path', d => d.target.data.state.path).attr('d', linkShape({
1513
1093
  source,
@@ -1533,18 +1113,16 @@ class Markmap {
1533
1113
  d.data.state.y0 = d.y;
1534
1114
  });
1535
1115
  }
1536
-
1537
1116
  transition(sel) {
1538
1117
  const {
1539
1118
  duration
1540
1119
  } = this.options;
1541
1120
  return sel.transition().duration(duration);
1542
1121
  }
1122
+
1543
1123
  /**
1544
1124
  * Fit the content to the viewport.
1545
1125
  */
1546
-
1547
-
1548
1126
  async fit() {
1549
1127
  const svgNode = this.svg.node();
1550
1128
  const {
@@ -1564,51 +1142,45 @@ class Markmap {
1564
1142
  const naturalHeight = maxX - minX;
1565
1143
  const scale = Math.min(offsetWidth / naturalWidth * fitRatio, offsetHeight / naturalHeight * fitRatio, 2);
1566
1144
  const initialZoom = d3__namespace.zoomIdentity.translate((offsetWidth - naturalWidth * scale) / 2 - minY * scale, (offsetHeight - naturalHeight * scale) / 2 - minX * scale).scale(scale);
1567
- return this.transition(this.svg).call(this.zoom.transform, initialZoom).end().catch(noop);
1145
+ return this.transition(this.svg).call(this.zoom.transform, initialZoom).end().catch(markmapCommon.noop);
1568
1146
  }
1147
+
1569
1148
  /**
1570
1149
  * Pan the content to make the provided node visible in the viewport.
1571
1150
  */
1572
-
1573
-
1574
1151
  async ensureView(node, padding) {
1575
- let g;
1576
1152
  let itemData;
1577
- this.g.selectAll(childSelector('g')).each(function walk(d) {
1153
+ this.g.selectAll(markmapCommon.childSelector('g')).each(function walk(d) {
1578
1154
  if (d.data === node) {
1579
- g = this;
1580
1155
  itemData = d;
1581
1156
  }
1582
1157
  });
1583
- if (!g || !itemData) return;
1158
+ if (!itemData) return;
1584
1159
  const svgNode = this.svg.node();
1585
1160
  const relRect = svgNode.getBoundingClientRect();
1586
1161
  const transform = d3__namespace.zoomTransform(svgNode);
1587
1162
  const [left, right] = [itemData.y, itemData.y + itemData.ySizeInner + 2].map(x => x * transform.k + transform.x);
1588
- const [top, bottom] = [itemData.x - itemData.xSize / 2, itemData.x + itemData.xSize / 2].map(y => y * transform.k + transform.y); // Skip if the node includes or is included in the container.
1589
-
1163
+ const [top, bottom] = [itemData.x - itemData.xSize / 2, itemData.x + itemData.xSize / 2].map(y => y * transform.k + transform.y);
1164
+ // Skip if the node includes or is included in the container.
1590
1165
  const pd = _extends({
1591
1166
  left: 0,
1592
1167
  right: 0,
1593
1168
  top: 0,
1594
1169
  bottom: 0
1595
1170
  }, padding);
1596
-
1597
1171
  const dxs = [pd.left - left, relRect.width - pd.right - right];
1598
1172
  const dys = [pd.top - top, relRect.height - pd.bottom - bottom];
1599
1173
  const dx = dxs[0] * dxs[1] > 0 ? minBy(dxs, Math.abs) / transform.k : 0;
1600
1174
  const dy = dys[0] * dys[1] > 0 ? minBy(dys, Math.abs) / transform.k : 0;
1601
-
1602
1175
  if (dx || dy) {
1603
1176
  const newTransform = transform.translate(dx, dy);
1604
- return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(noop);
1177
+ return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(markmapCommon.noop);
1605
1178
  }
1606
1179
  }
1180
+
1607
1181
  /**
1608
1182
  * Scale content with it pinned at the center of the viewport.
1609
1183
  */
1610
-
1611
-
1612
1184
  async rescale(scale) {
1613
1185
  const svgNode = this.svg.node();
1614
1186
  const {
@@ -1619,9 +1191,8 @@ class Markmap {
1619
1191
  const halfHeight = offsetHeight / 2;
1620
1192
  const transform = d3__namespace.zoomTransform(svgNode);
1621
1193
  const newTransform = transform.translate((halfWidth - transform.x) * (1 - scale) / transform.k, (halfHeight - transform.y) * (1 - scale) / transform.k).scale(scale);
1622
- return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(noop);
1194
+ return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(markmapCommon.noop);
1623
1195
  }
1624
-
1625
1196
  destroy() {
1626
1197
  this.svg.on('.zoom', null);
1627
1198
  this.svg.html(null);
@@ -1629,10 +1200,8 @@ class Markmap {
1629
1200
  fn();
1630
1201
  });
1631
1202
  }
1632
-
1633
1203
  static create(svg, opts, data) {
1634
1204
  const mm = new Markmap(svg, opts);
1635
-
1636
1205
  if (data) {
1637
1206
  mm.setData(data);
1638
1207
  mm.fit(); // always fit for the first render
@@ -1640,7 +1209,6 @@ class Markmap {
1640
1209
 
1641
1210
  return mm;
1642
1211
  }
1643
-
1644
1212
  }
1645
1213
  Markmap.defaultOptions = {
1646
1214
  autoFit: false,
@@ -1656,7 +1224,8 @@ Markmap.defaultOptions = {
1656
1224
  spacingVertical: 5,
1657
1225
  initialExpandLevel: -1,
1658
1226
  zoom: true,
1659
- pan: true
1227
+ pan: true,
1228
+ toggleRecursively: false
1660
1229
  };
1661
1230
  function deriveOptions(jsonOptions) {
1662
1231
  const opts = {};
@@ -1665,20 +1234,15 @@ function deriveOptions(jsonOptions) {
1665
1234
  color,
1666
1235
  colorFreezeLevel
1667
1236
  } = jsonOptions;
1668
-
1669
1237
  if ((color == null ? void 0 : color.length) === 1) {
1670
1238
  const solidColor = color[0];
1671
-
1672
1239
  opts.color = () => solidColor;
1673
1240
  } else if (color != null && color.length) {
1674
1241
  const colorFn = d3__namespace.scaleOrdinal(color);
1675
-
1676
1242
  opts.color = node => colorFn(`${node.state.path}`);
1677
1243
  }
1678
-
1679
1244
  if (colorFreezeLevel) {
1680
1245
  const color = opts.color || Markmap.defaultOptions.color;
1681
-
1682
1246
  opts.color = node => {
1683
1247
  node = _extends({}, node, {
1684
1248
  state: _extends({}, node.state, {
@@ -1688,7 +1252,6 @@ function deriveOptions(jsonOptions) {
1688
1252
  return color(node);
1689
1253
  };
1690
1254
  }
1691
-
1692
1255
  const numberKeys = ['duration', 'maxWidth', 'initialExpandLevel'];
1693
1256
  numberKeys.forEach(key => {
1694
1257
  const value = jsonOptions[key];
@@ -1702,12 +1265,10 @@ function deriveOptions(jsonOptions) {
1702
1265
  return opts;
1703
1266
  }
1704
1267
 
1268
+ exports.loadCSS = markmapCommon.loadCSS;
1269
+ exports.loadJS = markmapCommon.loadJS;
1705
1270
  exports.Markmap = Markmap;
1706
1271
  exports.defaultColorFn = defaultColorFn;
1707
1272
  exports.deriveOptions = deriveOptions;
1708
1273
  exports.globalCSS = globalCSS;
1709
- exports.loadCSS = loadCSS;
1710
- exports.loadJS = loadJS;
1711
1274
  exports.refreshHook = refreshHook;
1712
-
1713
- })(this.markmap = this.markmap || {}, d3);