markmap-view 0.14.4 → 0.15.0-alpha.0

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.15.0-alpha.0 | 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,45 @@ 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
+ this.toggleNode(d.data, e.ctrlKey);
1331
917
  }
1332
-
1333
918
  initializeData(node) {
1334
919
  let nodeId = 0;
1335
920
  const {
@@ -1350,9 +935,8 @@ class Markmap {
1350
935
  document.body.append(container, style);
1351
936
  const groupStyle = maxWidth ? `max-width: ${maxWidth}px` : '';
1352
937
  let foldRecursively = 0;
1353
- walkTree(node, (item, next, parent) => {
938
+ markmapCommon.walkTree(node, (item, next, parent) => {
1354
939
  var _item$children, _parent$state, _item$payload;
1355
-
1356
940
  item.children = (_item$children = item.children) == null ? void 0 : _item$children.map(child => _extends({}, child));
1357
941
  nodeId += 1;
1358
942
  const group = mountDom(jsx("div", {
@@ -1369,11 +953,10 @@ class Markmap {
1369
953
  id: nodeId,
1370
954
  el: group.firstChild
1371
955
  });
1372
- item.state.path = [parent == null ? void 0 : (_parent$state = parent.state) == null ? void 0 : _parent$state.path, item.state.id].filter(Boolean).join('.');
956
+ item.state.path = [parent == null || (_parent$state = parent.state) == null ? void 0 : _parent$state.path, item.state.id].filter(Boolean).join('.');
1373
957
  color(item); // preload colors
1374
958
 
1375
959
  const isFoldRecursively = ((_item$payload = item.payload) == null ? void 0 : _item$payload.fold) === 2;
1376
-
1377
960
  if (isFoldRecursively) {
1378
961
  foldRecursively += 1;
1379
962
  } else if (foldRecursively || initialExpandLevel >= 0 && item.depth >= initialExpandLevel) {
@@ -1381,45 +964,40 @@ class Markmap {
1381
964
  fold: 1
1382
965
  });
1383
966
  }
1384
-
1385
967
  next();
1386
968
  if (isFoldRecursively) foldRecursively -= 1;
1387
969
  });
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.
970
+ const nodes = Array.from(container.childNodes).map(group => group.firstChild);
971
+ this.viewHooks.transformHtml.call(this, nodes);
972
+ // Clone the rendered HTML and set `white-space: nowrap` to it to detect its max-width.
1390
973
  // The parent node will have a width of the max-width and the original content without
1391
974
  // `white-space: nowrap` gets re-layouted, then we will get the expected layout, with
1392
975
  // content in one line as much as possible, and subjecting to the given max-width.
1393
-
1394
976
  nodes.forEach(node => {
1395
977
  node.parentNode.append(node.cloneNode(true));
1396
978
  });
1397
- walkTree(node, (item, next, parent) => {
979
+ markmapCommon.walkTree(node, (item, next, parent) => {
1398
980
  var _parent$state2;
1399
-
1400
981
  const rect = item.state.el.getBoundingClientRect();
1401
982
  item.content = item.state.el.innerHTML;
1402
983
  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
984
+ item.state.key = [parent == null || (_parent$state2 = parent.state) == null ? void 0 : _parent$state2.id, item.state.id].filter(Boolean).join('.') +
985
+ // FIXME: find a way to check content hash
1404
986
  item.content;
1405
987
  next();
1406
988
  });
1407
989
  container.remove();
1408
990
  style.remove();
1409
991
  }
1410
-
1411
992
  setOptions(opts) {
1412
993
  this.options = _extends({}, Markmap.defaultOptions, opts);
1413
-
1414
994
  if (this.options.zoom) {
1415
995
  this.svg.call(this.zoom);
1416
996
  } else {
1417
997
  this.svg.on('.zoom', null);
1418
998
  }
1419
-
1420
999
  this.svg.on('wheel', this.options.pan ? this.handlePan : null);
1421
1000
  }
1422
-
1423
1001
  setData(data, opts) {
1424
1002
  if (data) this.state.data = data;
1425
1003
  if (opts) this.setOptions(opts);
@@ -1427,10 +1005,8 @@ class Markmap {
1427
1005
  this.updateStyle();
1428
1006
  this.renderData();
1429
1007
  }
1430
-
1431
1008
  renderData(originData) {
1432
1009
  var _origin$data$state$x, _origin$data$state$y;
1433
-
1434
1010
  if (!this.state.data) return;
1435
1011
  const {
1436
1012
  spacingHorizontal,
@@ -1441,7 +1017,6 @@ class Markmap {
1441
1017
  } = this.options;
1442
1018
  const layout = flextree().children(d => {
1443
1019
  var _d$payload;
1444
-
1445
1020
  return !((_d$payload = d.payload) != null && _d$payload.fold) && d.children;
1446
1021
  }).nodeSize(d => {
1447
1022
  const [width, height] = d.data.state.size;
@@ -1468,9 +1043,10 @@ class Markmap {
1468
1043
  if (autoFit) this.fit();
1469
1044
  const origin = originData && descendants.find(item => item.data === originData) || tree;
1470
1045
  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
1046
+ const y0 = (_origin$data$state$y = origin.data.state.y0) != null ? _origin$data$state$y : origin.y;
1472
1047
 
1473
- const node = this.g.selectAll(childSelector('g')).data(descendants, d => d.data.state.key);
1048
+ // Update the nodes
1049
+ const node = this.g.selectAll(markmapCommon.childSelector('g')).data(descendants, d => d.data.state.key);
1474
1050
  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
1051
  const nodeExit = this.transition(node.exit());
1476
1052
  nodeExit.select('line').attr('x1', d => d.ySizeInner).attr('x2', d => d.ySizeInner);
@@ -1478,25 +1054,25 @@ class Markmap {
1478
1054
  nodeExit.attr('transform', d => `translate(${origin.y + origin.ySizeInner - d.ySizeInner},${origin.x + origin.xSize / 2 - d.xSize})`).remove();
1479
1055
  const nodeMerge = node.merge(nodeEnter).attr('class', d => {
1480
1056
  var _d$data$payload;
1481
-
1482
1057
  return ['markmap-node', ((_d$data$payload = d.data.payload) == null ? void 0 : _d$data$payload.fold) && 'markmap-fold'].filter(Boolean).join(' ');
1483
1058
  });
1484
- this.transition(nodeMerge).attr('transform', d => `translate(${d.y},${d.x - d.xSize / 2})`); // Update lines under the content
1059
+ this.transition(nodeMerge).attr('transform', d => `translate(${d.y},${d.x - d.xSize / 2})`);
1485
1060
 
1486
- const line = nodeMerge.selectAll(childSelector('line')).data(d => [d], d => d.data.state.key).join(enter => {
1061
+ // Update lines under the content
1062
+ const line = nodeMerge.selectAll(markmapCommon.childSelector('line')).data(d => [d], d => d.data.state.key).join(enter => {
1487
1063
  return enter.append('line').attr('x1', d => d.ySizeInner).attr('x2', d => d.ySizeInner);
1488
1064
  }, 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
1065
+ 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
1066
 
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));
1067
+ // Circle to link to children of the node
1068
+ const circle = nodeMerge.selectAll(markmapCommon.childSelector('circle')).data(d => d.data.children ? [d] : [], d => d.data.state.key).join(enter => {
1069
+ 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
1070
  }, update => update, exit => exit.remove());
1494
1071
  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
1072
  var _d$data$payload2;
1496
-
1497
1073
  return (_d$data$payload2 = d.data.payload) != null && _d$data$payload2.fold && d.data.children ? color(d.data) : '#fff';
1498
1074
  });
1499
- const foreignObject = nodeMerge.selectAll(childSelector('foreignObject')).data(d => [d], d => d.data.state.key).join(enter => {
1075
+ const foreignObject = nodeMerge.selectAll(markmapCommon.childSelector('foreignObject')).data(d => [d], d => d.data.state.key).join(enter => {
1500
1076
  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
1077
  fo.append('xhtml:div').select(function select(d) {
1502
1078
  const clone = d.data.state.el.cloneNode(true);
@@ -1505,9 +1081,10 @@ class Markmap {
1505
1081
  }).attr('xmlns', 'http://www.w3.org/1999/xhtml');
1506
1082
  return fo;
1507
1083
  }, 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
1084
+ this.transition(foreignObject).style('opacity', 1);
1509
1085
 
1510
- const path = this.g.selectAll(childSelector('path')).data(links, d => d.target.data.state.key).join(enter => {
1086
+ // Update the links
1087
+ const path = this.g.selectAll(markmapCommon.childSelector('path')).data(links, d => d.target.data.state.key).join(enter => {
1511
1088
  const source = [y0 + origin.ySizeInner, x0 + origin.xSize / 2];
1512
1089
  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
1090
  source,
@@ -1533,18 +1110,16 @@ class Markmap {
1533
1110
  d.data.state.y0 = d.y;
1534
1111
  });
1535
1112
  }
1536
-
1537
1113
  transition(sel) {
1538
1114
  const {
1539
1115
  duration
1540
1116
  } = this.options;
1541
1117
  return sel.transition().duration(duration);
1542
1118
  }
1119
+
1543
1120
  /**
1544
1121
  * Fit the content to the viewport.
1545
1122
  */
1546
-
1547
-
1548
1123
  async fit() {
1549
1124
  const svgNode = this.svg.node();
1550
1125
  const {
@@ -1564,51 +1139,45 @@ class Markmap {
1564
1139
  const naturalHeight = maxX - minX;
1565
1140
  const scale = Math.min(offsetWidth / naturalWidth * fitRatio, offsetHeight / naturalHeight * fitRatio, 2);
1566
1141
  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);
1142
+ return this.transition(this.svg).call(this.zoom.transform, initialZoom).end().catch(markmapCommon.noop);
1568
1143
  }
1144
+
1569
1145
  /**
1570
1146
  * Pan the content to make the provided node visible in the viewport.
1571
1147
  */
1572
-
1573
-
1574
1148
  async ensureView(node, padding) {
1575
- let g;
1576
1149
  let itemData;
1577
- this.g.selectAll(childSelector('g')).each(function walk(d) {
1150
+ this.g.selectAll(markmapCommon.childSelector('g')).each(function walk(d) {
1578
1151
  if (d.data === node) {
1579
- g = this;
1580
1152
  itemData = d;
1581
1153
  }
1582
1154
  });
1583
- if (!g || !itemData) return;
1155
+ if (!itemData) return;
1584
1156
  const svgNode = this.svg.node();
1585
1157
  const relRect = svgNode.getBoundingClientRect();
1586
1158
  const transform = d3__namespace.zoomTransform(svgNode);
1587
1159
  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
-
1160
+ const [top, bottom] = [itemData.x - itemData.xSize / 2, itemData.x + itemData.xSize / 2].map(y => y * transform.k + transform.y);
1161
+ // Skip if the node includes or is included in the container.
1590
1162
  const pd = _extends({
1591
1163
  left: 0,
1592
1164
  right: 0,
1593
1165
  top: 0,
1594
1166
  bottom: 0
1595
1167
  }, padding);
1596
-
1597
1168
  const dxs = [pd.left - left, relRect.width - pd.right - right];
1598
1169
  const dys = [pd.top - top, relRect.height - pd.bottom - bottom];
1599
1170
  const dx = dxs[0] * dxs[1] > 0 ? minBy(dxs, Math.abs) / transform.k : 0;
1600
1171
  const dy = dys[0] * dys[1] > 0 ? minBy(dys, Math.abs) / transform.k : 0;
1601
-
1602
1172
  if (dx || dy) {
1603
1173
  const newTransform = transform.translate(dx, dy);
1604
- return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(noop);
1174
+ return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(markmapCommon.noop);
1605
1175
  }
1606
1176
  }
1177
+
1607
1178
  /**
1608
1179
  * Scale content with it pinned at the center of the viewport.
1609
1180
  */
1610
-
1611
-
1612
1181
  async rescale(scale) {
1613
1182
  const svgNode = this.svg.node();
1614
1183
  const {
@@ -1619,9 +1188,8 @@ class Markmap {
1619
1188
  const halfHeight = offsetHeight / 2;
1620
1189
  const transform = d3__namespace.zoomTransform(svgNode);
1621
1190
  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);
1191
+ return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(markmapCommon.noop);
1623
1192
  }
1624
-
1625
1193
  destroy() {
1626
1194
  this.svg.on('.zoom', null);
1627
1195
  this.svg.html(null);
@@ -1629,10 +1197,8 @@ class Markmap {
1629
1197
  fn();
1630
1198
  });
1631
1199
  }
1632
-
1633
1200
  static create(svg, opts, data) {
1634
1201
  const mm = new Markmap(svg, opts);
1635
-
1636
1202
  if (data) {
1637
1203
  mm.setData(data);
1638
1204
  mm.fit(); // always fit for the first render
@@ -1640,7 +1206,6 @@ class Markmap {
1640
1206
 
1641
1207
  return mm;
1642
1208
  }
1643
-
1644
1209
  }
1645
1210
  Markmap.defaultOptions = {
1646
1211
  autoFit: false,
@@ -1665,20 +1230,15 @@ function deriveOptions(jsonOptions) {
1665
1230
  color,
1666
1231
  colorFreezeLevel
1667
1232
  } = jsonOptions;
1668
-
1669
1233
  if ((color == null ? void 0 : color.length) === 1) {
1670
1234
  const solidColor = color[0];
1671
-
1672
1235
  opts.color = () => solidColor;
1673
1236
  } else if (color != null && color.length) {
1674
1237
  const colorFn = d3__namespace.scaleOrdinal(color);
1675
-
1676
1238
  opts.color = node => colorFn(`${node.state.path}`);
1677
1239
  }
1678
-
1679
1240
  if (colorFreezeLevel) {
1680
1241
  const color = opts.color || Markmap.defaultOptions.color;
1681
-
1682
1242
  opts.color = node => {
1683
1243
  node = _extends({}, node, {
1684
1244
  state: _extends({}, node.state, {
@@ -1688,7 +1248,6 @@ function deriveOptions(jsonOptions) {
1688
1248
  return color(node);
1689
1249
  };
1690
1250
  }
1691
-
1692
1251
  const numberKeys = ['duration', 'maxWidth', 'initialExpandLevel'];
1693
1252
  numberKeys.forEach(key => {
1694
1253
  const value = jsonOptions[key];
@@ -1702,12 +1261,10 @@ function deriveOptions(jsonOptions) {
1702
1261
  return opts;
1703
1262
  }
1704
1263
 
1264
+ exports.loadCSS = markmapCommon.loadCSS;
1265
+ exports.loadJS = markmapCommon.loadJS;
1705
1266
  exports.Markmap = Markmap;
1706
1267
  exports.defaultColorFn = defaultColorFn;
1707
1268
  exports.deriveOptions = deriveOptions;
1708
1269
  exports.globalCSS = globalCSS;
1709
- exports.loadCSS = loadCSS;
1710
- exports.loadJS = loadJS;
1711
1270
  exports.refreshHook = refreshHook;
1712
-
1713
- })(this.markmap = this.markmap || {}, d3);