markmap-view
Advanced tools
Comparing version 0.15.5 to 0.15.6-alpha.4
@@ -1,1670 +0,4 @@ | ||
/*! markmap-view v0.15.5 | MIT License */ | ||
(function (exports, d3) { | ||
'use strict'; | ||
/*! markmap-common v0.15.5 | MIT License */ | ||
function _extends$1() { | ||
_extends$1 = Object.assign ? Object.assign.bind() : function (target) { | ||
for (var i = 1; i < arguments.length; i++) { | ||
var source = arguments[i]; | ||
for (var key in source) { | ||
if (Object.prototype.hasOwnProperty.call(source, key)) { | ||
target[key] = source[key]; | ||
} | ||
} | ||
} | ||
return target; | ||
}; | ||
return _extends$1.apply(this, arguments); | ||
} | ||
const testPath = "npm2url/dist/index.cjs"; | ||
const defaultProviders = { | ||
jsdelivr: path => `https://cdn.jsdelivr.net/npm/${path}`, | ||
unpkg: path => `https://unpkg.com/${path}` | ||
}; | ||
class UrlBuilder { | ||
constructor() { | ||
this.providers = _extends$1({}, defaultProviders); | ||
this.provider = "jsdelivr"; | ||
} | ||
getFastestProvider(timeout = 5e3, path = testPath) { | ||
return new Promise((resolve, reject) => { | ||
Promise.all(Object.entries(this.providers).map(async ([name, factory]) => { | ||
try { | ||
const res = await fetch(factory(path)); | ||
if (!res.ok) { | ||
throw res; | ||
} | ||
await res.text(); | ||
resolve(name); | ||
} catch (_unused) {} | ||
})).then(() => reject(new Error("All providers failed"))); | ||
setTimeout(reject, timeout, new Error("Timed out")); | ||
}); | ||
} | ||
async findFastestProvider(timeout) { | ||
this.provider = await this.getFastestProvider(timeout); | ||
return this.provider; | ||
} | ||
setProvider(name, factory) { | ||
if (factory) { | ||
this.providers[name] = factory; | ||
} else { | ||
delete this.providers[name]; | ||
} | ||
} | ||
getFullUrl(path, provider = this.provider) { | ||
if (path.includes("://")) { | ||
return path; | ||
} | ||
const factory = this.providers[provider]; | ||
if (!factory) { | ||
throw new Error(`Provider ${provider} not found`); | ||
} | ||
return factory(path); | ||
} | ||
} | ||
new UrlBuilder(); | ||
class Hook { | ||
constructor() { | ||
this.listeners = []; | ||
} | ||
tap(fn) { | ||
this.listeners.push(fn); | ||
return () => this.revoke(fn); | ||
} | ||
revoke(fn) { | ||
const i = this.listeners.indexOf(fn); | ||
if (i >= 0) this.listeners.splice(i, 1); | ||
} | ||
revokeAll() { | ||
this.listeners.splice(0); | ||
} | ||
call(...args) { | ||
for (const fn of this.listeners) { | ||
fn(...args); | ||
} | ||
} | ||
} | ||
const uniqId = Math.random().toString(36).slice(2, 8); | ||
let globalIndex = 0; | ||
function getId() { | ||
globalIndex += 1; | ||
return `mm-${uniqId}-${globalIndex}`; | ||
} | ||
function noop() { | ||
// noop | ||
} | ||
function walkTree(tree, callback) { | ||
const walk = (item, parent) => callback(item, () => { | ||
var _item$children; | ||
(_item$children = item.children) == null || _item$children.forEach(child => { | ||
walk(child, item); | ||
}); | ||
}, parent); | ||
walk(tree); | ||
} | ||
function addClass(className, ...rest) { | ||
const classList = (className || '').split(' ').filter(Boolean); | ||
rest.forEach(item => { | ||
if (item && classList.indexOf(item) < 0) classList.push(item); | ||
}); | ||
return classList.join(' '); | ||
} | ||
function childSelector(filter) { | ||
if (typeof filter === 'string') { | ||
const tagName = filter; | ||
filter = el => el.tagName === tagName; | ||
} | ||
const filterFn = filter; | ||
return function selector() { | ||
let nodes = Array.from(this.childNodes); | ||
if (filterFn) nodes = nodes.filter(node => filterFn(node)); | ||
return nodes; | ||
}; | ||
} | ||
function memoize(fn) { | ||
const cache = {}; | ||
return function memoized(...args) { | ||
const key = `${args[0]}`; | ||
let data = cache[key]; | ||
if (!data) { | ||
data = { | ||
value: fn(...args) | ||
}; | ||
cache[key] = data; | ||
} | ||
return data.value; | ||
}; | ||
} | ||
/*! @gera2ld/jsx-dom v2.2.2 | ISC License */ | ||
const VTYPE_ELEMENT$1 = 1; | ||
const VTYPE_FUNCTION$1 = 2; | ||
const SVG_NS$1 = 'http://www.w3.org/2000/svg'; | ||
const XLINK_NS$1 = 'http://www.w3.org/1999/xlink'; | ||
const NS_ATTRS$1 = { | ||
show: XLINK_NS$1, | ||
actuate: XLINK_NS$1, | ||
href: XLINK_NS$1 | ||
}; | ||
const isLeaf$1 = c => typeof c === 'string' || typeof c === 'number'; | ||
const isElement$1 = c => (c == null ? void 0 : c.vtype) === VTYPE_ELEMENT$1; | ||
const isRenderFunction$1 = c => (c == null ? void 0 : c.vtype) === VTYPE_FUNCTION$1; | ||
function h(type, props, ...children) { | ||
props = Object.assign({}, props, { | ||
children: children.length === 1 ? children[0] : children | ||
}); | ||
return jsx$1(type, props); | ||
} | ||
function jsx$1(type, props) { | ||
let vtype; | ||
if (typeof type === 'string') vtype = VTYPE_ELEMENT$1;else if (typeof type === 'function') vtype = VTYPE_FUNCTION$1;else throw new Error('Invalid VNode type'); | ||
return { | ||
vtype, | ||
type, | ||
props | ||
}; | ||
} | ||
function Fragment$1(props) { | ||
return props.children; | ||
} | ||
const DEFAULT_ENV$1 = { | ||
isSvg: false | ||
}; | ||
function insertDom$1(parent, nodes) { | ||
if (!Array.isArray(nodes)) nodes = [nodes]; | ||
nodes = nodes.filter(Boolean); | ||
if (nodes.length) parent.append(...nodes); | ||
} | ||
function mountAttributes$1(domElement, props, env) { | ||
for (const key in props) { | ||
if (key === 'key' || key === 'children' || key === 'ref') continue; | ||
if (key === 'dangerouslySetInnerHTML') { | ||
domElement.innerHTML = props[key].__html; | ||
} else if (key === 'innerHTML' || key === 'textContent' || key === 'innerText' || key === 'value' && ['textarea', 'select'].includes(domElement.tagName)) { | ||
const value = props[key]; | ||
if (value != null) domElement[key] = value; | ||
} else if (key.startsWith('on')) { | ||
domElement[key.toLowerCase()] = props[key]; | ||
} else { | ||
setDOMAttribute$1(domElement, key, props[key], env.isSvg); | ||
} | ||
} | ||
} | ||
const attrMap$1 = { | ||
className: 'class', | ||
labelFor: 'for' | ||
}; | ||
function setDOMAttribute$1(el, attr, value, isSVG) { | ||
attr = attrMap$1[attr] || attr; | ||
if (value === true) { | ||
el.setAttribute(attr, ''); | ||
} else if (value === false) { | ||
el.removeAttribute(attr); | ||
} else { | ||
const namespace = isSVG ? NS_ATTRS$1[attr] : undefined; | ||
if (namespace !== undefined) { | ||
el.setAttributeNS(namespace, attr, value); | ||
} else { | ||
el.setAttribute(attr, value); | ||
} | ||
} | ||
} | ||
function flatten$1(arr) { | ||
return arr.reduce((prev, item) => prev.concat(item), []); | ||
} | ||
function mountChildren$1(children, env) { | ||
return Array.isArray(children) ? flatten$1(children.map(child => mountChildren$1(child, env))) : mount$1(children, env); | ||
} | ||
function mount$1(vnode, env = DEFAULT_ENV$1) { | ||
if (vnode == null || typeof vnode === 'boolean') { | ||
return null; | ||
} | ||
if (vnode instanceof Node) { | ||
return vnode; | ||
} | ||
if (isRenderFunction$1(vnode)) { | ||
const { | ||
type, | ||
props | ||
} = vnode; | ||
if (type === Fragment$1) { | ||
const node = document.createDocumentFragment(); | ||
if (props.children) { | ||
const children = mountChildren$1(props.children, env); | ||
insertDom$1(node, children); | ||
} | ||
return node; | ||
} | ||
const childVNode = type(props); | ||
return mount$1(childVNode, env); | ||
} | ||
if (isLeaf$1(vnode)) { | ||
return document.createTextNode(`${vnode}`); | ||
} | ||
if (isElement$1(vnode)) { | ||
let node; | ||
const { | ||
type, | ||
props | ||
} = vnode; | ||
if (!env.isSvg && type === 'svg') { | ||
env = Object.assign({}, env, { | ||
isSvg: true | ||
}); | ||
} | ||
if (!env.isSvg) { | ||
node = document.createElement(type); | ||
} else { | ||
node = document.createElementNS(SVG_NS$1, type); | ||
} | ||
mountAttributes$1(node, props, env); | ||
if (props.children) { | ||
let childEnv = env; | ||
if (env.isSvg && type === 'foreignObject') { | ||
childEnv = Object.assign({}, childEnv, { | ||
isSvg: false | ||
}); | ||
} | ||
const children = mountChildren$1(props.children, childEnv); | ||
if (children != null) insertDom$1(node, children); | ||
} | ||
const { | ||
ref | ||
} = props; | ||
if (typeof ref === 'function') ref(node); | ||
return node; | ||
} | ||
throw new Error('mount: Invalid Vnode!'); | ||
} | ||
/** | ||
* Mount vdom as real DOM nodes. | ||
*/ | ||
function mountDom$1(vnode) { | ||
return mount$1(vnode); | ||
} | ||
/** | ||
* Render and mount without returning VirtualDOM, useful when you don't need SVG support. | ||
*/ | ||
function hm(...args) { | ||
return mountDom$1(h(...args)); | ||
} | ||
const memoizedPreloadJS = memoize(url => { | ||
document.head.append(hm('link', { | ||
rel: 'preload', | ||
as: 'script', | ||
href: url | ||
})); | ||
}); | ||
const jsCache = {}; | ||
const cssCache = {}; | ||
async function loadJSItem(item, context) { | ||
var _item$data; | ||
const src = item.type === 'script' && ((_item$data = item.data) == null ? void 0 : _item$data.src) || ''; | ||
item.loaded || (item.loaded = jsCache[src]); | ||
if (!item.loaded) { | ||
if (item.type === 'script') { | ||
item.loaded = new Promise((resolve, reject) => { | ||
document.head.append(hm('script', _extends$1({}, item.data, { | ||
onLoad: resolve, | ||
onError: reject | ||
}))); | ||
if (!src) { | ||
// Run inline script synchronously | ||
resolve(undefined); | ||
} | ||
}).then(() => { | ||
item.loaded = true; | ||
}); | ||
if (src) jsCache[src] = item.loaded; | ||
} | ||
if (item.type === 'iife') { | ||
const { | ||
fn, | ||
getParams | ||
} = item.data; | ||
fn(...((getParams == null ? void 0 : getParams(context)) || [])); | ||
item.loaded = true; | ||
} | ||
} | ||
await item.loaded; | ||
} | ||
function loadCSSItem(item) { | ||
const url = item.type === 'stylesheet' && item.data.href || ''; | ||
item.loaded || (item.loaded = cssCache[url]); | ||
if (item.loaded) return; | ||
item.loaded = true; | ||
if (url) cssCache[url] = true; | ||
if (item.type === 'style') { | ||
document.head.append(hm('style', { | ||
textContent: item.data | ||
})); | ||
} else if (item.type === 'stylesheet') { | ||
document.head.append(hm('link', _extends$1({ | ||
rel: 'stylesheet' | ||
}, item.data))); | ||
} | ||
} | ||
async function loadJS(items, context) { | ||
items.forEach(item => { | ||
var _item$data2; | ||
if (item.type === 'script' && (_item$data2 = item.data) != null && _item$data2.src) { | ||
memoizedPreloadJS(item.data.src); | ||
} | ||
}); | ||
context = _extends$1({ | ||
getMarkmap: () => window.markmap | ||
}, context); | ||
for (const item of items) { | ||
await loadJSItem(item, context); | ||
} | ||
} | ||
function loadCSS(items) { | ||
for (const item of items) { | ||
loadCSSItem(item); | ||
} | ||
} | ||
function _extends() { | ||
_extends = Object.assign ? Object.assign.bind() : function (target) { | ||
for (var i = 1; i < arguments.length; i++) { | ||
var source = arguments[i]; | ||
for (var key in source) { | ||
if (Object.prototype.hasOwnProperty.call(source, key)) { | ||
target[key] = source[key]; | ||
} | ||
} | ||
} | ||
return target; | ||
}; | ||
return _extends.apply(this, arguments); | ||
} | ||
function count(node) { | ||
var sum = 0, | ||
children = node.children, | ||
i = children && children.length; | ||
if (!i) sum = 1;else while (--i >= 0) sum += children[i].value; | ||
node.value = sum; | ||
} | ||
function node_count () { | ||
return this.eachAfter(count); | ||
} | ||
function node_each (callback) { | ||
var node = this, | ||
current, | ||
next = [node], | ||
children, | ||
i, | ||
n; | ||
do { | ||
current = next.reverse(), next = []; | ||
while (node = current.pop()) { | ||
callback(node), children = node.children; | ||
if (children) for (i = 0, n = children.length; i < n; ++i) { | ||
next.push(children[i]); | ||
} | ||
} | ||
} while (next.length); | ||
return this; | ||
} | ||
function node_eachBefore (callback) { | ||
var node = this, | ||
nodes = [node], | ||
children, | ||
i; | ||
while (node = nodes.pop()) { | ||
callback(node), children = node.children; | ||
if (children) for (i = children.length - 1; i >= 0; --i) { | ||
nodes.push(children[i]); | ||
} | ||
} | ||
return this; | ||
} | ||
function node_eachAfter (callback) { | ||
var node = this, | ||
nodes = [node], | ||
next = [], | ||
children, | ||
i, | ||
n; | ||
while (node = nodes.pop()) { | ||
next.push(node), children = node.children; | ||
if (children) for (i = 0, n = children.length; i < n; ++i) { | ||
nodes.push(children[i]); | ||
} | ||
} | ||
while (node = next.pop()) { | ||
callback(node); | ||
} | ||
return this; | ||
} | ||
function node_sum (value) { | ||
return this.eachAfter(function (node) { | ||
var sum = +value(node.data) || 0, | ||
children = node.children, | ||
i = children && children.length; | ||
while (--i >= 0) sum += children[i].value; | ||
node.value = sum; | ||
}); | ||
} | ||
function node_sort (compare) { | ||
return this.eachBefore(function (node) { | ||
if (node.children) { | ||
node.children.sort(compare); | ||
} | ||
}); | ||
} | ||
function node_path (end) { | ||
var start = this, | ||
ancestor = leastCommonAncestor(start, end), | ||
nodes = [start]; | ||
while (start !== ancestor) { | ||
start = start.parent; | ||
nodes.push(start); | ||
} | ||
var k = nodes.length; | ||
while (end !== ancestor) { | ||
nodes.splice(k, 0, end); | ||
end = end.parent; | ||
} | ||
return nodes; | ||
} | ||
function leastCommonAncestor(a, b) { | ||
if (a === b) return a; | ||
var aNodes = a.ancestors(), | ||
bNodes = b.ancestors(), | ||
c = null; | ||
a = aNodes.pop(); | ||
b = bNodes.pop(); | ||
while (a === b) { | ||
c = a; | ||
a = aNodes.pop(); | ||
b = bNodes.pop(); | ||
} | ||
return c; | ||
} | ||
function node_ancestors () { | ||
var node = this, | ||
nodes = [node]; | ||
while (node = node.parent) { | ||
nodes.push(node); | ||
} | ||
return nodes; | ||
} | ||
function node_descendants () { | ||
var nodes = []; | ||
this.each(function (node) { | ||
nodes.push(node); | ||
}); | ||
return nodes; | ||
} | ||
function node_leaves () { | ||
var leaves = []; | ||
this.eachBefore(function (node) { | ||
if (!node.children) { | ||
leaves.push(node); | ||
} | ||
}); | ||
return leaves; | ||
} | ||
function node_links () { | ||
var root = this, | ||
links = []; | ||
root.each(function (node) { | ||
if (node !== root) { | ||
// Don’t include the root’s parent, if any. | ||
links.push({ | ||
source: node.parent, | ||
target: node | ||
}); | ||
} | ||
}); | ||
return links; | ||
} | ||
function hierarchy(data, children) { | ||
var root = new Node$1(data), | ||
valued = +data.value && (root.value = data.value), | ||
node, | ||
nodes = [root], | ||
child, | ||
childs, | ||
i, | ||
n; | ||
if (children == null) children = defaultChildren; | ||
while (node = nodes.pop()) { | ||
if (valued) node.value = +node.data.value; | ||
if ((childs = children(node.data)) && (n = childs.length)) { | ||
node.children = new Array(n); | ||
for (i = n - 1; i >= 0; --i) { | ||
nodes.push(child = node.children[i] = new Node$1(childs[i])); | ||
child.parent = node; | ||
child.depth = node.depth + 1; | ||
} | ||
} | ||
} | ||
return root.eachBefore(computeHeight); | ||
} | ||
function node_copy() { | ||
return hierarchy(this).eachBefore(copyData); | ||
} | ||
function defaultChildren(d) { | ||
return d.children; | ||
} | ||
function copyData(node) { | ||
node.data = node.data.data; | ||
} | ||
function computeHeight(node) { | ||
var height = 0; | ||
do node.height = height; while ((node = node.parent) && node.height < ++height); | ||
} | ||
function Node$1(data) { | ||
this.data = data; | ||
this.depth = this.height = 0; | ||
this.parent = null; | ||
} | ||
Node$1.prototype = hierarchy.prototype = { | ||
constructor: Node$1, | ||
count: node_count, | ||
each: node_each, | ||
eachAfter: node_eachAfter, | ||
eachBefore: node_eachBefore, | ||
sum: node_sum, | ||
sort: node_sort, | ||
path: node_path, | ||
ancestors: node_ancestors, | ||
descendants: node_descendants, | ||
leaves: node_leaves, | ||
links: node_links, | ||
copy: node_copy | ||
}; | ||
var name = "d3-flextree"; | ||
var version$1 = "2.1.2"; | ||
var main = "build/d3-flextree.js"; | ||
var module = "index"; | ||
var author = { | ||
name: "Chris Maloney", | ||
url: "http://chrismaloney.org" | ||
}; | ||
var description = "Flexible tree layout algorithm that allows for variable node sizes."; | ||
var keywords = [ | ||
"d3", | ||
"d3-module", | ||
"layout", | ||
"tree", | ||
"hierarchy", | ||
"d3-hierarchy", | ||
"plugin", | ||
"d3-plugin", | ||
"infovis", | ||
"visualization", | ||
"2d" | ||
]; | ||
var homepage = "https://github.com/klortho/d3-flextree"; | ||
var license = "WTFPL"; | ||
var repository = { | ||
type: "git", | ||
url: "https://github.com/klortho/d3-flextree.git" | ||
}; | ||
var scripts = { | ||
clean: "rm -rf build demo test", | ||
"build:demo": "rollup -c --environment BUILD:demo", | ||
"build:dev": "rollup -c --environment BUILD:dev", | ||
"build:prod": "rollup -c --environment BUILD:prod", | ||
"build:test": "rollup -c --environment BUILD:test", | ||
build: "rollup -c", | ||
lint: "eslint index.js src", | ||
"test:main": "node test/bundle.js", | ||
"test:browser": "node test/browser-tests.js", | ||
test: "npm-run-all test:*", | ||
prepare: "npm-run-all clean build lint test" | ||
}; | ||
var dependencies = { | ||
"d3-hierarchy": "^1.1.5" | ||
}; | ||
var devDependencies = { | ||
"babel-plugin-external-helpers": "^6.22.0", | ||
"babel-preset-es2015-rollup": "^3.0.0", | ||
d3: "^4.13.0", | ||
"d3-selection-multi": "^1.0.1", | ||
eslint: "^4.19.1", | ||
jsdom: "^11.6.2", | ||
"npm-run-all": "^4.1.2", | ||
rollup: "^0.55.3", | ||
"rollup-plugin-babel": "^2.7.1", | ||
"rollup-plugin-commonjs": "^8.0.2", | ||
"rollup-plugin-copy": "^0.2.3", | ||
"rollup-plugin-json": "^2.3.0", | ||
"rollup-plugin-node-resolve": "^3.0.2", | ||
"rollup-plugin-uglify": "^3.0.0", | ||
"uglify-es": "^3.3.9" | ||
}; | ||
var packageInfo = { | ||
name: name, | ||
version: version$1, | ||
main: main, | ||
module: module, | ||
"jsnext:main": "index", | ||
author: author, | ||
description: description, | ||
keywords: keywords, | ||
homepage: homepage, | ||
license: license, | ||
repository: repository, | ||
scripts: scripts, | ||
dependencies: dependencies, | ||
devDependencies: devDependencies | ||
}; | ||
const { | ||
version | ||
} = packageInfo; | ||
const defaults = Object.freeze({ | ||
children: data => data.children, | ||
nodeSize: node => node.data.size, | ||
spacing: 0 | ||
}); | ||
// Create a layout function with customizable options. Per D3-style, the | ||
// options can be set at any time using setter methods. The layout function | ||
// will compute the tree node positions based on the options in effect at the | ||
// time it is called. | ||
function flextree(options) { | ||
const opts = Object.assign({}, defaults, options); | ||
function accessor(name) { | ||
const opt = opts[name]; | ||
return typeof opt === 'function' ? opt : () => opt; | ||
} | ||
function layout(tree) { | ||
const wtree = wrap(getWrapper(), tree, node => node.children); | ||
wtree.update(); | ||
return wtree.data; | ||
} | ||
function getFlexNode() { | ||
const nodeSize = accessor('nodeSize'); | ||
const spacing = accessor('spacing'); | ||
return class FlexNode extends hierarchy.prototype.constructor { | ||
constructor(data) { | ||
super(data); | ||
} | ||
copy() { | ||
const c = wrap(this.constructor, this, node => node.children); | ||
c.each(node => node.data = node.data.data); | ||
return c; | ||
} | ||
get size() { | ||
return nodeSize(this); | ||
} | ||
spacing(oNode) { | ||
return spacing(this, oNode); | ||
} | ||
get nodes() { | ||
return this.descendants(); | ||
} | ||
get xSize() { | ||
return this.size[0]; | ||
} | ||
get ySize() { | ||
return this.size[1]; | ||
} | ||
get top() { | ||
return this.y; | ||
} | ||
get bottom() { | ||
return this.y + this.ySize; | ||
} | ||
get left() { | ||
return this.x - this.xSize / 2; | ||
} | ||
get right() { | ||
return this.x + this.xSize / 2; | ||
} | ||
get root() { | ||
const ancs = this.ancestors(); | ||
return ancs[ancs.length - 1]; | ||
} | ||
get numChildren() { | ||
return this.hasChildren ? this.children.length : 0; | ||
} | ||
get hasChildren() { | ||
return !this.noChildren; | ||
} | ||
get noChildren() { | ||
return this.children === null; | ||
} | ||
get firstChild() { | ||
return this.hasChildren ? this.children[0] : null; | ||
} | ||
get lastChild() { | ||
return this.hasChildren ? this.children[this.numChildren - 1] : null; | ||
} | ||
get extents() { | ||
return (this.children || []).reduce((acc, kid) => FlexNode.maxExtents(acc, kid.extents), this.nodeExtents); | ||
} | ||
get nodeExtents() { | ||
return { | ||
top: this.top, | ||
bottom: this.bottom, | ||
left: this.left, | ||
right: this.right | ||
}; | ||
} | ||
static maxExtents(e0, e1) { | ||
return { | ||
top: Math.min(e0.top, e1.top), | ||
bottom: Math.max(e0.bottom, e1.bottom), | ||
left: Math.min(e0.left, e1.left), | ||
right: Math.max(e0.right, e1.right) | ||
}; | ||
} | ||
}; | ||
} | ||
function getWrapper() { | ||
const FlexNode = getFlexNode(); | ||
const nodeSize = accessor('nodeSize'); | ||
const spacing = accessor('spacing'); | ||
return class extends FlexNode { | ||
constructor(data) { | ||
super(data); | ||
Object.assign(this, { | ||
x: 0, | ||
y: 0, | ||
relX: 0, | ||
prelim: 0, | ||
shift: 0, | ||
change: 0, | ||
lExt: this, | ||
lExtRelX: 0, | ||
lThr: null, | ||
rExt: this, | ||
rExtRelX: 0, | ||
rThr: null | ||
}); | ||
} | ||
get size() { | ||
return nodeSize(this.data); | ||
} | ||
spacing(oNode) { | ||
return spacing(this.data, oNode.data); | ||
} | ||
get x() { | ||
return this.data.x; | ||
} | ||
set x(v) { | ||
this.data.x = v; | ||
} | ||
get y() { | ||
return this.data.y; | ||
} | ||
set y(v) { | ||
this.data.y = v; | ||
} | ||
update() { | ||
layoutChildren(this); | ||
resolveX(this); | ||
return this; | ||
} | ||
}; | ||
} | ||
function wrap(FlexClass, treeData, children) { | ||
const _wrap = (data, parent) => { | ||
const node = new FlexClass(data); | ||
Object.assign(node, { | ||
parent, | ||
depth: parent === null ? 0 : parent.depth + 1, | ||
height: 0, | ||
length: 1 | ||
}); | ||
const kidsData = children(data) || []; | ||
node.children = kidsData.length === 0 ? null : kidsData.map(kd => _wrap(kd, node)); | ||
if (node.children) { | ||
Object.assign(node, node.children.reduce((hl, kid) => ({ | ||
height: Math.max(hl.height, kid.height + 1), | ||
length: hl.length + kid.length | ||
}), node)); | ||
} | ||
return node; | ||
}; | ||
return _wrap(treeData, null); | ||
} | ||
Object.assign(layout, { | ||
nodeSize(arg) { | ||
return arguments.length ? (opts.nodeSize = arg, layout) : opts.nodeSize; | ||
}, | ||
spacing(arg) { | ||
return arguments.length ? (opts.spacing = arg, layout) : opts.spacing; | ||
}, | ||
children(arg) { | ||
return arguments.length ? (opts.children = arg, layout) : opts.children; | ||
}, | ||
hierarchy(treeData, children) { | ||
const kids = typeof children === 'undefined' ? opts.children : children; | ||
return wrap(getFlexNode(), treeData, kids); | ||
}, | ||
dump(tree) { | ||
const nodeSize = accessor('nodeSize'); | ||
const _dump = i0 => node => { | ||
const i1 = i0 + ' '; | ||
const i2 = i0 + ' '; | ||
const { | ||
x, | ||
y | ||
} = node; | ||
const size = nodeSize(node); | ||
const kids = node.children || []; | ||
const kdumps = kids.length === 0 ? ' ' : `,${i1}children: [${i2}${kids.map(_dump(i2)).join(i2)}${i1}],${i0}`; | ||
return `{ size: [${size.join(', ')}],${i1}x: ${x}, y: ${y}${kdumps}},`; | ||
}; | ||
return _dump('\n')(tree); | ||
} | ||
}); | ||
return layout; | ||
} | ||
flextree.version = version; | ||
const layoutChildren = (w, y = 0) => { | ||
w.y = y; | ||
(w.children || []).reduce((acc, kid) => { | ||
const [i, lastLows] = acc; | ||
layoutChildren(kid, w.y + w.ySize); | ||
// The lowest vertical coordinate while extreme nodes still point | ||
// in current subtree. | ||
const lowY = (i === 0 ? kid.lExt : kid.rExt).bottom; | ||
if (i !== 0) separate(w, i, lastLows); | ||
const lows = updateLows(lowY, i, lastLows); | ||
return [i + 1, lows]; | ||
}, [0, null]); | ||
shiftChange(w); | ||
positionRoot(w); | ||
return w; | ||
}; | ||
// Resolves the relative coordinate properties - relX and prelim -- | ||
// to set the final, absolute x coordinate for each node. This also sets | ||
// `prelim` to 0, so that `relX` for each node is its x-coordinate relative | ||
// to its parent. | ||
const resolveX = (w, prevSum, parentX) => { | ||
// A call to resolveX without arguments is assumed to be for the root of | ||
// the tree. This will set the root's x-coord to zero. | ||
if (typeof prevSum === 'undefined') { | ||
prevSum = -w.relX - w.prelim; | ||
parentX = 0; | ||
} | ||
const sum = prevSum + w.relX; | ||
w.relX = sum + w.prelim - parentX; | ||
w.prelim = 0; | ||
w.x = parentX + w.relX; | ||
(w.children || []).forEach(k => resolveX(k, sum, w.x)); | ||
return w; | ||
}; | ||
// Process shift and change for all children, to add intermediate spacing to | ||
// each child's modifier. | ||
const shiftChange = w => { | ||
(w.children || []).reduce((acc, child) => { | ||
const [lastShiftSum, lastChangeSum] = acc; | ||
const shiftSum = lastShiftSum + child.shift; | ||
const changeSum = lastChangeSum + shiftSum + child.change; | ||
child.relX += changeSum; | ||
return [shiftSum, changeSum]; | ||
}, [0, 0]); | ||
}; | ||
// Separates the latest child from its previous sibling | ||
/* eslint-disable complexity */ | ||
const separate = (w, i, lows) => { | ||
const lSib = w.children[i - 1]; | ||
const curSubtree = w.children[i]; | ||
let rContour = lSib; | ||
let rSumMods = lSib.relX; | ||
let lContour = curSubtree; | ||
let lSumMods = curSubtree.relX; | ||
let isFirst = true; | ||
while (rContour && lContour) { | ||
if (rContour.bottom > lows.lowY) lows = lows.next; | ||
// How far to the left of the right side of rContour is the left side | ||
// of lContour? First compute the center-to-center distance, then add | ||
// the "spacing" | ||
const dist = rSumMods + rContour.prelim - (lSumMods + lContour.prelim) + rContour.xSize / 2 + lContour.xSize / 2 + rContour.spacing(lContour); | ||
if (dist > 0 || dist < 0 && isFirst) { | ||
lSumMods += dist; | ||
// Move subtree by changing relX. | ||
moveSubtree(curSubtree, dist); | ||
distributeExtra(w, i, lows.index, dist); | ||
} | ||
isFirst = false; | ||
// Advance highest node(s) and sum(s) of modifiers | ||
const rightBottom = rContour.bottom; | ||
const leftBottom = lContour.bottom; | ||
if (rightBottom <= leftBottom) { | ||
rContour = nextRContour(rContour); | ||
if (rContour) rSumMods += rContour.relX; | ||
} | ||
if (rightBottom >= leftBottom) { | ||
lContour = nextLContour(lContour); | ||
if (lContour) lSumMods += lContour.relX; | ||
} | ||
} | ||
// Set threads and update extreme nodes. In the first case, the | ||
// current subtree is taller than the left siblings. | ||
if (!rContour && lContour) setLThr(w, i, lContour, lSumMods); | ||
// In the next case, the left siblings are taller than the current subtree | ||
else if (rContour && !lContour) setRThr(w, i, rContour, rSumMods); | ||
}; | ||
/* eslint-enable complexity */ | ||
// Move subtree by changing relX. | ||
const moveSubtree = (subtree, distance) => { | ||
subtree.relX += distance; | ||
subtree.lExtRelX += distance; | ||
subtree.rExtRelX += distance; | ||
}; | ||
const distributeExtra = (w, curSubtreeI, leftSibI, dist) => { | ||
const curSubtree = w.children[curSubtreeI]; | ||
const n = curSubtreeI - leftSibI; | ||
// Are there intermediate children? | ||
if (n > 1) { | ||
const delta = dist / n; | ||
w.children[leftSibI + 1].shift += delta; | ||
curSubtree.shift -= delta; | ||
curSubtree.change -= dist - delta; | ||
} | ||
}; | ||
const nextLContour = w => { | ||
return w.hasChildren ? w.firstChild : w.lThr; | ||
}; | ||
const nextRContour = w => { | ||
return w.hasChildren ? w.lastChild : w.rThr; | ||
}; | ||
const setLThr = (w, i, lContour, lSumMods) => { | ||
const firstChild = w.firstChild; | ||
const lExt = firstChild.lExt; | ||
const curSubtree = w.children[i]; | ||
lExt.lThr = lContour; | ||
// Change relX so that the sum of modifier after following thread is correct. | ||
const diff = lSumMods - lContour.relX - firstChild.lExtRelX; | ||
lExt.relX += diff; | ||
// Change preliminary x coordinate so that the node does not move. | ||
lExt.prelim -= diff; | ||
// Update extreme node and its sum of modifiers. | ||
firstChild.lExt = curSubtree.lExt; | ||
firstChild.lExtRelX = curSubtree.lExtRelX; | ||
}; | ||
// Mirror image of setLThr. | ||
const setRThr = (w, i, rContour, rSumMods) => { | ||
const curSubtree = w.children[i]; | ||
const rExt = curSubtree.rExt; | ||
const lSib = w.children[i - 1]; | ||
rExt.rThr = rContour; | ||
const diff = rSumMods - rContour.relX - curSubtree.rExtRelX; | ||
rExt.relX += diff; | ||
rExt.prelim -= diff; | ||
curSubtree.rExt = lSib.rExt; | ||
curSubtree.rExtRelX = lSib.rExtRelX; | ||
}; | ||
// Position root between children, taking into account their modifiers | ||
const positionRoot = w => { | ||
if (w.hasChildren) { | ||
const k0 = w.firstChild; | ||
const kf = w.lastChild; | ||
const prelim = (k0.prelim + k0.relX - k0.xSize / 2 + kf.relX + kf.prelim + kf.xSize / 2) / 2; | ||
Object.assign(w, { | ||
prelim, | ||
lExt: k0.lExt, | ||
lExtRelX: k0.lExtRelX, | ||
rExt: kf.rExt, | ||
rExtRelX: kf.rExtRelX | ||
}); | ||
} | ||
}; | ||
// Make/maintain a linked list of the indexes of left siblings and their | ||
// lowest vertical coordinate. | ||
const updateLows = (lowY, index, lastLows) => { | ||
// Remove siblings that are hidden by the new subtree. | ||
while (lastLows !== null && lowY >= lastLows.lowY) lastLows = lastLows.next; | ||
// Prepend the new subtree. | ||
return { | ||
lowY, | ||
index, | ||
next: lastLows | ||
}; | ||
}; | ||
/*! @gera2ld/jsx-dom v2.2.2 | ISC License */ | ||
const VTYPE_ELEMENT = 1; | ||
const VTYPE_FUNCTION = 2; | ||
const SVG_NS = 'http://www.w3.org/2000/svg'; | ||
const XLINK_NS = 'http://www.w3.org/1999/xlink'; | ||
const NS_ATTRS = { | ||
show: XLINK_NS, | ||
actuate: XLINK_NS, | ||
href: XLINK_NS | ||
}; | ||
const isLeaf = c => typeof c === 'string' || typeof c === 'number'; | ||
const isElement = c => (c == null ? void 0 : c.vtype) === VTYPE_ELEMENT; | ||
const isRenderFunction = c => (c == null ? void 0 : c.vtype) === VTYPE_FUNCTION; | ||
function jsx(type, props) { | ||
let vtype; | ||
if (typeof type === 'string') vtype = VTYPE_ELEMENT;else if (typeof type === 'function') vtype = VTYPE_FUNCTION;else throw new Error('Invalid VNode type'); | ||
return { | ||
vtype, | ||
type, | ||
props | ||
}; | ||
} | ||
function Fragment(props) { | ||
return props.children; | ||
} | ||
const DEFAULT_ENV = { | ||
isSvg: false | ||
}; | ||
function insertDom(parent, nodes) { | ||
if (!Array.isArray(nodes)) nodes = [nodes]; | ||
nodes = nodes.filter(Boolean); | ||
if (nodes.length) parent.append(...nodes); | ||
} | ||
function mountAttributes(domElement, props, env) { | ||
for (const key in props) { | ||
if (key === 'key' || key === 'children' || key === 'ref') continue; | ||
if (key === 'dangerouslySetInnerHTML') { | ||
domElement.innerHTML = props[key].__html; | ||
} else if (key === 'innerHTML' || key === 'textContent' || key === 'innerText' || key === 'value' && ['textarea', 'select'].includes(domElement.tagName)) { | ||
const value = props[key]; | ||
if (value != null) domElement[key] = value; | ||
} else if (key.startsWith('on')) { | ||
domElement[key.toLowerCase()] = props[key]; | ||
} else { | ||
setDOMAttribute(domElement, key, props[key], env.isSvg); | ||
} | ||
} | ||
} | ||
const attrMap = { | ||
className: 'class', | ||
labelFor: 'for' | ||
}; | ||
function setDOMAttribute(el, attr, value, isSVG) { | ||
attr = attrMap[attr] || attr; | ||
if (value === true) { | ||
el.setAttribute(attr, ''); | ||
} else if (value === false) { | ||
el.removeAttribute(attr); | ||
} else { | ||
const namespace = isSVG ? NS_ATTRS[attr] : undefined; | ||
if (namespace !== undefined) { | ||
el.setAttributeNS(namespace, attr, value); | ||
} else { | ||
el.setAttribute(attr, value); | ||
} | ||
} | ||
} | ||
function flatten(arr) { | ||
return arr.reduce((prev, item) => prev.concat(item), []); | ||
} | ||
function mountChildren(children, env) { | ||
return Array.isArray(children) ? flatten(children.map(child => mountChildren(child, env))) : mount(children, env); | ||
} | ||
function mount(vnode, env = DEFAULT_ENV) { | ||
if (vnode == null || typeof vnode === 'boolean') { | ||
return null; | ||
} | ||
if (vnode instanceof Node) { | ||
return vnode; | ||
} | ||
if (isRenderFunction(vnode)) { | ||
const { | ||
type, | ||
props | ||
} = vnode; | ||
if (type === Fragment) { | ||
const node = document.createDocumentFragment(); | ||
if (props.children) { | ||
const children = mountChildren(props.children, env); | ||
insertDom(node, children); | ||
} | ||
return node; | ||
} | ||
const childVNode = type(props); | ||
return mount(childVNode, env); | ||
} | ||
if (isLeaf(vnode)) { | ||
return document.createTextNode(`${vnode}`); | ||
} | ||
if (isElement(vnode)) { | ||
let node; | ||
const { | ||
type, | ||
props | ||
} = vnode; | ||
if (!env.isSvg && type === 'svg') { | ||
env = Object.assign({}, env, { | ||
isSvg: true | ||
}); | ||
} | ||
if (!env.isSvg) { | ||
node = document.createElement(type); | ||
} else { | ||
node = document.createElementNS(SVG_NS, type); | ||
} | ||
mountAttributes(node, props, env); | ||
if (props.children) { | ||
let childEnv = env; | ||
if (env.isSvg && type === 'foreignObject') { | ||
childEnv = Object.assign({}, childEnv, { | ||
isSvg: false | ||
}); | ||
} | ||
const children = mountChildren(props.children, childEnv); | ||
if (children != null) insertDom(node, children); | ||
} | ||
const { | ||
ref | ||
} = props; | ||
if (typeof ref === 'function') ref(node); | ||
return node; | ||
} | ||
throw new Error('mount: Invalid Vnode!'); | ||
} | ||
/** | ||
* Mount vdom as real DOM nodes. | ||
*/ | ||
function mountDom(vnode) { | ||
return mount(vnode); | ||
} | ||
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);padding:.25em}.markmap-foreign pre{margin:0}.markmap-foreign pre>code{display:block}.markmap-foreign del{text-decoration:line-through}.markmap-foreign em{font-style:italic}.markmap-foreign strong{font-weight:700}.markmap-foreign mark{background:#ffeaa7}"; | ||
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,.markmap-container>.markmap-foreign>div:last-child *{white-space:nowrap}"; | ||
const globalCSS = css_248z$1; | ||
function linkWidth(nodeData) { | ||
const data = nodeData.data; | ||
return Math.max(4 - 2 * data.depth, 1.5); | ||
} | ||
function minBy(numbers, by) { | ||
const index = d3.minIndex(numbers, by); | ||
return numbers[index]; | ||
} | ||
function stopPropagation(e) { | ||
e.stopPropagation(); | ||
} | ||
function createViewHooks() { | ||
return { | ||
transformHtml: new Hook() | ||
}; | ||
} | ||
/** | ||
* A global hook to refresh all markmaps when called. | ||
*/ | ||
const refreshHook = new Hook(); | ||
const defaultColorFn = d3.scaleOrdinal(d3.schemeCategory10); | ||
const isMacintosh = typeof navigator !== 'undefined' && navigator.userAgent.includes('Macintosh'); | ||
class Markmap { | ||
constructor(svg, opts) { | ||
this.options = Markmap.defaultOptions; | ||
this.revokers = []; | ||
this.handleZoom = e => { | ||
const { | ||
transform | ||
} = e; | ||
this.g.attr('transform', transform); | ||
}; | ||
this.handlePan = e => { | ||
e.preventDefault(); | ||
const transform = d3.zoomTransform(this.svg.node()); | ||
const newTransform = transform.translate(-e.deltaX / transform.k, -e.deltaY / transform.k); | ||
this.svg.call(this.zoom.transform, newTransform); | ||
}; | ||
this.handleClick = (e, d) => { | ||
let recursive = this.options.toggleRecursively; | ||
if (isMacintosh ? e.metaKey : e.ctrlKey) recursive = !recursive; | ||
this.toggleNode(d.data, recursive); | ||
}; | ||
this.viewHooks = createViewHooks(); | ||
this.svg = svg.datum ? svg : d3.select(svg); | ||
this.styleNode = this.svg.append('style'); | ||
this.zoom = d3.zoom().filter(event => { | ||
if (this.options.scrollForPan) { | ||
// Pan with wheels, zoom with ctrl+wheels | ||
if (event.type === 'wheel') return event.ctrlKey && !event.button; | ||
} | ||
return (!event.ctrlKey || event.type === 'wheel') && !event.button; | ||
}).on('zoom', this.handleZoom); | ||
this.setOptions(opts); | ||
this.state = { | ||
id: this.options.id || this.svg.attr('id') || getId(), | ||
minX: 0, | ||
maxX: 0, | ||
minY: 0, | ||
maxY: 0 | ||
}; | ||
this.g = this.svg.append('g'); | ||
this.revokers.push(refreshHook.tap(() => { | ||
this.setData(); | ||
})); | ||
} | ||
getStyleContent() { | ||
const { | ||
style | ||
} = this.options; | ||
const { | ||
id | ||
} = this.state; | ||
const styleText = typeof style === 'function' ? style(id) : ''; | ||
return [this.options.embedGlobalCSS && css_248z$1, styleText].filter(Boolean).join('\n'); | ||
} | ||
updateStyle() { | ||
this.svg.attr('class', addClass(this.svg.attr('class'), 'markmap', this.state.id)); | ||
const style = this.getStyleContent(); | ||
this.styleNode.text(style); | ||
} | ||
toggleNode(data, recursive = false) { | ||
var _data$payload; | ||
const fold = (_data$payload = data.payload) != null && _data$payload.fold ? 0 : 1; | ||
if (recursive) { | ||
// recursively | ||
walkTree(data, (item, next) => { | ||
item.payload = _extends({}, item.payload, { | ||
fold | ||
}); | ||
next(); | ||
}); | ||
} else { | ||
var _data$payload2; | ||
data.payload = _extends({}, data.payload, { | ||
fold: (_data$payload2 = data.payload) != null && _data$payload2.fold ? 0 : 1 | ||
}); | ||
} | ||
this.renderData(data); | ||
} | ||
initializeData(node) { | ||
let nodeId = 0; | ||
const { | ||
color, | ||
nodeMinHeight, | ||
maxWidth, | ||
initialExpandLevel | ||
} = this.options; | ||
const { | ||
id | ||
} = this.state; | ||
const container = mountDom(jsx("div", { | ||
className: `markmap-container markmap ${id}-g` | ||
})); | ||
const style = mountDom(jsx("style", { | ||
children: [this.getStyleContent(), css_248z].join('\n') | ||
})); | ||
document.body.append(container, style); | ||
const groupStyle = maxWidth ? `max-width: ${maxWidth}px` : ''; | ||
let foldRecursively = 0; | ||
walkTree(node, (item, next, parent) => { | ||
var _item$children, _parent$state, _item$payload; | ||
item.children = (_item$children = item.children) == null ? void 0 : _item$children.map(child => _extends({}, child)); | ||
nodeId += 1; | ||
const group = mountDom(jsx("div", { | ||
className: "markmap-foreign", | ||
style: groupStyle, | ||
children: jsx("div", { | ||
dangerouslySetInnerHTML: { | ||
__html: item.content | ||
} | ||
}) | ||
})); | ||
container.append(group); | ||
item.state = _extends({}, item.state, { | ||
id: nodeId, | ||
el: group.firstChild | ||
}); | ||
item.state.path = [parent == null || (_parent$state = parent.state) == null ? void 0 : _parent$state.path, item.state.id].filter(Boolean).join('.'); | ||
color(item); // preload colors | ||
const isFoldRecursively = ((_item$payload = item.payload) == null ? void 0 : _item$payload.fold) === 2; | ||
if (isFoldRecursively) { | ||
foldRecursively += 1; | ||
} else if (foldRecursively || initialExpandLevel >= 0 && item.depth >= initialExpandLevel) { | ||
item.payload = _extends({}, item.payload, { | ||
fold: 1 | ||
}); | ||
} | ||
next(); | ||
if (isFoldRecursively) foldRecursively -= 1; | ||
}); | ||
const nodes = Array.from(container.childNodes).map(group => group.firstChild); | ||
this.viewHooks.transformHtml.call(this, nodes); | ||
// Clone the rendered HTML and set `white-space: nowrap` to it to detect its max-width. | ||
// The parent node will have a width of the max-width and the original content without | ||
// `white-space: nowrap` gets re-layouted, then we will get the expected layout, with | ||
// content in one line as much as possible, and subjecting to the given max-width. | ||
nodes.forEach(node => { | ||
var _node$parentNode; | ||
(_node$parentNode = node.parentNode) == null || _node$parentNode.append(node.cloneNode(true)); | ||
}); | ||
walkTree(node, (item, next, parent) => { | ||
var _parent$state2; | ||
const state = item.state; | ||
const rect = state.el.getBoundingClientRect(); | ||
item.content = state.el.innerHTML; | ||
state.size = [Math.ceil(rect.width) + 1, Math.max(Math.ceil(rect.height), nodeMinHeight)]; | ||
state.key = [parent == null || (_parent$state2 = parent.state) == null ? void 0 : _parent$state2.id, state.id].filter(Boolean).join('.') + | ||
// FIXME: find a way to check content hash | ||
item.content; | ||
next(); | ||
}); | ||
container.remove(); | ||
style.remove(); | ||
} | ||
setOptions(opts) { | ||
this.options = _extends({}, this.options, opts); | ||
if (this.options.zoom) { | ||
this.svg.call(this.zoom); | ||
} else { | ||
this.svg.on('.zoom', null); | ||
} | ||
if (this.options.pan) { | ||
this.svg.on('wheel', this.handlePan); | ||
} else { | ||
this.svg.on('wheel', null); | ||
} | ||
} | ||
setData(data, opts) { | ||
if (opts) this.setOptions(opts); | ||
if (data) this.state.data = data; | ||
if (!this.state.data) return; | ||
this.initializeData(this.state.data); | ||
this.updateStyle(); | ||
this.renderData(); | ||
} | ||
renderData(originData) { | ||
var _origin$data$state$x, _origin$data$state$y; | ||
if (!this.state.data) return; | ||
const { | ||
spacingHorizontal, | ||
paddingX, | ||
spacingVertical, | ||
autoFit, | ||
color | ||
} = this.options; | ||
const layout = flextree({}).children(d => { | ||
var _d$payload; | ||
if (!((_d$payload = d.payload) != null && _d$payload.fold)) return d.children; | ||
}).nodeSize(node => { | ||
const [width, height] = node.data.state.size; | ||
return [height, width + (width ? paddingX * 2 : 0) + spacingHorizontal]; | ||
}).spacing((a, b) => { | ||
return a.parent === b.parent ? spacingVertical : spacingVertical * 2; | ||
}); | ||
const tree = layout.hierarchy(this.state.data); | ||
layout(tree); | ||
const descendants = tree.descendants().reverse(); | ||
const links = tree.links(); | ||
const linkShape = d3.linkHorizontal(); | ||
const minX = d3.min(descendants, d => d.x - d.xSize / 2); | ||
const maxX = d3.max(descendants, d => d.x + d.xSize / 2); | ||
const minY = d3.min(descendants, d => d.y); | ||
const maxY = d3.max(descendants, d => d.y + d.ySize - spacingHorizontal); | ||
Object.assign(this.state, { | ||
minX, | ||
maxX, | ||
minY, | ||
maxY | ||
}); | ||
if (autoFit) this.fit(); | ||
const origin = originData && descendants.find(item => item.data === originData) || tree; | ||
const x0 = (_origin$data$state$x = origin.data.state.x0) != null ? _origin$data$state$x : origin.x; | ||
const y0 = (_origin$data$state$y = origin.data.state.y0) != null ? _origin$data$state$y : origin.y; | ||
// Update the nodes | ||
const node = this.g.selectAll(childSelector('g')).data(descendants, d => d.data.state.key); | ||
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.ySize - d.ySize},${x0 + origin.xSize / 2 - d.xSize})`); | ||
const nodeExit = this.transition(node.exit()); | ||
nodeExit.select('line').attr('x1', d => d.ySize - spacingHorizontal).attr('x2', d => d.ySize - spacingHorizontal); | ||
nodeExit.select('foreignObject').style('opacity', 0); | ||
nodeExit.attr('transform', d => `translate(${origin.y + origin.ySize - d.ySize},${origin.x + origin.xSize / 2 - d.xSize})`).remove(); | ||
const nodeMerge = node.merge(nodeEnter).attr('class', d => { | ||
var _d$data$payload; | ||
return ['markmap-node', ((_d$data$payload = d.data.payload) == null ? void 0 : _d$data$payload.fold) && 'markmap-fold'].filter(Boolean).join(' '); | ||
}); | ||
this.transition(nodeMerge).attr('transform', d => `translate(${d.y},${d.x - d.xSize / 2})`); | ||
// Update lines under the content | ||
const line = nodeMerge.selectAll(childSelector('line')).data(d => [d], d => d.data.state.key).join(enter => { | ||
return enter.append('line').attr('x1', d => d.ySize - spacingHorizontal).attr('x2', d => d.ySize - spacingHorizontal); | ||
}, update => update, exit => exit.remove()); | ||
this.transition(line).attr('x1', -1).attr('x2', d => d.ySize - spacingHorizontal + 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 | ||
const circle = nodeMerge.selectAll(childSelector('circle')).data(d => { | ||
var _d$data$children; | ||
return (_d$data$children = d.data.children) != null && _d$data$children.length ? [d] : []; | ||
}, d => d.data.state.key).join(enter => { | ||
return enter.append('circle').attr('stroke-width', '1.5').attr('cx', d => d.ySize - spacingHorizontal).attr('cy', d => d.xSize).attr('r', 0).on('click', (e, d) => this.handleClick(e, d)).on('mousedown', stopPropagation); | ||
}, update => update, exit => exit.remove()); | ||
this.transition(circle).attr('r', 6).attr('cx', d => d.ySize - spacingHorizontal).attr('cy', d => d.xSize).attr('stroke', d => color(d.data)).attr('fill', d => { | ||
var _d$data$payload2; | ||
return (_d$data$payload2 = d.data.payload) != null && _d$data$payload2.fold && d.data.children ? color(d.data) : '#fff'; | ||
}); | ||
const foreignObject = nodeMerge.selectAll(childSelector('foreignObject')).data(d => [d], d => d.data.state.key).join(enter => { | ||
const fo = enter.append('foreignObject').attr('class', 'markmap-foreign').attr('x', paddingX).attr('y', 0).style('opacity', 0).on('mousedown', stopPropagation).on('dblclick', stopPropagation); | ||
fo.append('xhtml:div').select(function select(d) { | ||
const clone = d.data.state.el.cloneNode(true); | ||
this.replaceWith(clone); | ||
return clone; | ||
}).attr('xmlns', 'http://www.w3.org/1999/xhtml'); | ||
return fo; | ||
}, update => update, exit => exit.remove()).attr('width', d => Math.max(0, d.ySize - spacingHorizontal - paddingX * 2)).attr('height', d => d.xSize); | ||
this.transition(foreignObject).style('opacity', 1); | ||
// Update the links | ||
const path = this.g.selectAll(childSelector('path')).data(links, d => d.target.data.state.key).join(enter => { | ||
const source = [y0 + origin.ySize - spacingHorizontal, x0 + origin.xSize / 2]; | ||
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({ | ||
source, | ||
target: source | ||
})); | ||
}, update => update, exit => { | ||
const source = [origin.y + origin.ySize - spacingHorizontal, origin.x + origin.xSize / 2]; | ||
return this.transition(exit).attr('d', linkShape({ | ||
source, | ||
target: source | ||
})).remove(); | ||
}); | ||
this.transition(path).attr('stroke', d => color(d.target.data)).attr('stroke-width', d => linkWidth(d.target)).attr('d', d => { | ||
const origSource = d.source; | ||
const origTarget = d.target; | ||
const source = [origSource.y + origSource.ySize - spacingHorizontal, origSource.x + origSource.xSize / 2]; | ||
const target = [origTarget.y, origTarget.x + origTarget.xSize / 2]; | ||
return linkShape({ | ||
source, | ||
target | ||
}); | ||
}); | ||
descendants.forEach(d => { | ||
d.data.state.x0 = d.x; | ||
d.data.state.y0 = d.y; | ||
}); | ||
} | ||
transition(sel) { | ||
const { | ||
duration | ||
} = this.options; | ||
return sel.transition().duration(duration); | ||
} | ||
/** | ||
* Fit the content to the viewport. | ||
*/ | ||
async fit() { | ||
const svgNode = this.svg.node(); | ||
const { | ||
width: offsetWidth, | ||
height: offsetHeight | ||
} = svgNode.getBoundingClientRect(); | ||
const { | ||
fitRatio | ||
} = this.options; | ||
const { | ||
minX, | ||
maxX, | ||
minY, | ||
maxY | ||
} = this.state; | ||
const naturalWidth = maxY - minY; | ||
const naturalHeight = maxX - minX; | ||
const scale = Math.min(offsetWidth / naturalWidth * fitRatio, offsetHeight / naturalHeight * fitRatio, 2); | ||
const initialZoom = d3.zoomIdentity.translate((offsetWidth - naturalWidth * scale) / 2 - minY * scale, (offsetHeight - naturalHeight * scale) / 2 - minX * scale).scale(scale); | ||
return this.transition(this.svg).call(this.zoom.transform, initialZoom).end().catch(noop); | ||
} | ||
/** | ||
* Pan the content to make the provided node visible in the viewport. | ||
*/ | ||
async ensureView(node, padding) { | ||
let itemData; | ||
this.g.selectAll(childSelector('g')).each(function walk(d) { | ||
if (d.data === node) { | ||
itemData = d; | ||
} | ||
}); | ||
if (!itemData) return; | ||
const svgNode = this.svg.node(); | ||
const { | ||
spacingHorizontal | ||
} = this.options; | ||
const relRect = svgNode.getBoundingClientRect(); | ||
const transform = d3.zoomTransform(svgNode); | ||
const [left, right] = [itemData.y, itemData.y + itemData.ySize - spacingHorizontal + 2].map(x => x * transform.k + transform.x); | ||
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. | ||
const pd = _extends({ | ||
left: 0, | ||
right: 0, | ||
top: 0, | ||
bottom: 0 | ||
}, padding); | ||
const dxs = [pd.left - left, relRect.width - pd.right - right]; | ||
const dys = [pd.top - top, relRect.height - pd.bottom - bottom]; | ||
const dx = dxs[0] * dxs[1] > 0 ? minBy(dxs, Math.abs) / transform.k : 0; | ||
const dy = dys[0] * dys[1] > 0 ? minBy(dys, Math.abs) / transform.k : 0; | ||
if (dx || dy) { | ||
const newTransform = transform.translate(dx, dy); | ||
return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(noop); | ||
} | ||
} | ||
/** | ||
* Scale content with it pinned at the center of the viewport. | ||
*/ | ||
async rescale(scale) { | ||
const svgNode = this.svg.node(); | ||
const { | ||
width: offsetWidth, | ||
height: offsetHeight | ||
} = svgNode.getBoundingClientRect(); | ||
const halfWidth = offsetWidth / 2; | ||
const halfHeight = offsetHeight / 2; | ||
const transform = d3.zoomTransform(svgNode); | ||
const newTransform = transform.translate((halfWidth - transform.x) * (1 - scale) / transform.k, (halfHeight - transform.y) * (1 - scale) / transform.k).scale(scale); | ||
return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(noop); | ||
} | ||
destroy() { | ||
this.svg.on('.zoom', null); | ||
this.svg.html(null); | ||
this.revokers.forEach(fn => { | ||
fn(); | ||
}); | ||
} | ||
static create(svg, opts, data = null) { | ||
const mm = new Markmap(svg, opts); | ||
if (data) { | ||
mm.setData(data); | ||
mm.fit(); // always fit for the first render | ||
} | ||
return mm; | ||
} | ||
} | ||
Markmap.defaultOptions = { | ||
autoFit: false, | ||
color: node => { | ||
var _node$state; | ||
return defaultColorFn(`${((_node$state = node.state) == null ? void 0 : _node$state.path) || ''}`); | ||
}, | ||
duration: 500, | ||
embedGlobalCSS: true, | ||
fitRatio: 0.95, | ||
maxWidth: 0, | ||
nodeMinHeight: 16, | ||
paddingX: 8, | ||
scrollForPan: isMacintosh, | ||
spacingHorizontal: 80, | ||
spacingVertical: 5, | ||
initialExpandLevel: -1, | ||
zoom: true, | ||
pan: true, | ||
toggleRecursively: false | ||
}; | ||
function deriveOptions(jsonOptions) { | ||
const derivedOptions = {}; | ||
const options = _extends({}, jsonOptions); | ||
const { | ||
color, | ||
colorFreezeLevel | ||
} = options; | ||
if ((color == null ? void 0 : color.length) === 1) { | ||
const solidColor = color[0]; | ||
derivedOptions.color = () => solidColor; | ||
} else if (color != null && color.length) { | ||
const colorFn = d3.scaleOrdinal(color); | ||
derivedOptions.color = node => colorFn(`${node.state.path}`); | ||
} | ||
if (colorFreezeLevel) { | ||
const color = derivedOptions.color || Markmap.defaultOptions.color; | ||
derivedOptions.color = node => { | ||
node = _extends({}, node, { | ||
state: _extends({}, node.state, { | ||
path: node.state.path.split('.').slice(0, colorFreezeLevel).join('.') | ||
}) | ||
}); | ||
return color(node); | ||
}; | ||
} | ||
const numberKeys = ['duration', 'maxWidth', 'initialExpandLevel']; | ||
numberKeys.forEach(key => { | ||
const value = options[key]; | ||
if (typeof value === 'number') derivedOptions[key] = value; | ||
}); | ||
const booleanKeys = ['zoom', 'pan']; | ||
booleanKeys.forEach(key => { | ||
const value = options[key]; | ||
if (value != null) derivedOptions[key] = !!value; | ||
}); | ||
return derivedOptions; | ||
} | ||
exports.Markmap = Markmap; | ||
exports.defaultColorFn = defaultColorFn; | ||
exports.deriveOptions = deriveOptions; | ||
exports.globalCSS = globalCSS; | ||
exports.loadCSS = loadCSS; | ||
exports.loadJS = loadJS; | ||
exports.refreshHook = refreshHook; | ||
})(this.markmap = this.markmap || {}, d3); | ||
(function(z,v){"use strict";class K{constructor(){this.listeners=[]}tap(e){return this.listeners.push(e),()=>this.revoke(e)}revoke(e){const n=this.listeners.indexOf(e);n>=0&&this.listeners.splice(n,1)}revokeAll(){this.listeners.splice(0)}call(...e){for(const n of this.listeners)n(...e)}}const pt=Math.random().toString(36).slice(2,8);let U=0;function gt(){return U+=1,`mm-${pt}-${U}`}function R(){}function _(t,e){const n=(i,o)=>e(i,()=>{var s;(s=i.children)==null||s.forEach(l=>{n(l,i)})},o);n(t)}function mt(t,...e){const n=(t||"").split(" ").filter(Boolean);return e.forEach(i=>{i&&n.indexOf(i)<0&&n.push(i)}),n.join(" ")}function w(t){if(typeof t=="string"){const n=t;t=i=>i.tagName===n}const e=t;return function(){let i=Array.from(this.childNodes);return e&&(i=i.filter(o=>e(o))),i}}function G(){const t={};return t.promise=new Promise((e,n)=>{t.resolve=e,t.reject=n}),t}function yt(t){const e={};return function(...i){const o=`${i[0]}`;let s=e[o];return s||(s={value:t(...i)},e[o]=s),s.value}}/*! @gera2ld/jsx-dom v2.2.2 | ISC License */const J=1,Z=2,xt="http://www.w3.org/2000/svg",L="http://www.w3.org/1999/xlink",St={show:L,actuate:L,href:L},vt=t=>typeof t=="string"||typeof t=="number",kt=t=>(t==null?void 0:t.vtype)===J,bt=t=>(t==null?void 0:t.vtype)===Z;function zt(t,e,...n){return e=Object.assign({},e,{children:n.length===1?n[0]:n}),wt(t,e)}function wt(t,e){let n;if(typeof t=="string")n=J;else if(typeof t=="function")n=Z;else throw new Error("Invalid VNode type");return{vtype:n,type:t,props:e}}function Et(t){return t.children}const Ct={isSvg:!1};function q(t,e){Array.isArray(e)||(e=[e]),e=e.filter(Boolean),e.length&&t.append(...e)}function Nt(t,e,n){for(const i in e)if(!(i==="key"||i==="children"||i==="ref"))if(i==="dangerouslySetInnerHTML")t.innerHTML=e[i].__html;else if(i==="innerHTML"||i==="textContent"||i==="innerText"||i==="value"&&["textarea","select"].includes(t.tagName)){const o=e[i];o!=null&&(t[i]=o)}else i.startsWith("on")?t[i.toLowerCase()]=e[i]:$t(t,i,e[i],n.isSvg)}const jt={className:"class",labelFor:"for"};function $t(t,e,n,i){if(e=jt[e]||e,n===!0)t.setAttribute(e,"");else if(n===!1)t.removeAttribute(e);else{const o=i?St[e]:void 0;o!==void 0?t.setAttributeNS(o,e,n):t.setAttribute(e,n)}}function Tt(t){return t.reduce((e,n)=>e.concat(n),[])}function D(t,e){return Array.isArray(t)?Tt(t.map(n=>D(n,e))):F(t,e)}function F(t,e=Ct){if(t==null||typeof t=="boolean")return null;if(t instanceof Node)return t;if(bt(t)){const{type:n,props:i}=t;if(n===Et){const s=document.createDocumentFragment();if(i.children){const l=D(i.children,e);q(s,l)}return s}const o=n(i);return F(o,e)}if(vt(t))return document.createTextNode(`${t}`);if(kt(t)){let n;const{type:i,props:o}=t;if(!e.isSvg&&i==="svg"&&(e=Object.assign({},e,{isSvg:!0})),e.isSvg?n=document.createElementNS(xt,i):n=document.createElement(i),Nt(n,o,e),o.children){let l=e;e.isSvg&&i==="foreignObject"&&(l=Object.assign({},l,{isSvg:!1}));const a=D(o.children,l);a!=null&&q(n,a)}const{ref:s}=o;return typeof s=="function"&&s(n),n}throw new Error("mount: Invalid Vnode!")}function Xt(t){return F(t)}function j(...t){return Xt(zt(...t))}const At=yt(t=>{document.head.append(j("link",{rel:"preload",as:"script",href:t}))}),Q={},tt={};async function Mt(t,e){var n;const i=t.type==="script"&&((n=t.data)==null?void 0:n.src)||"";if(t.loaded||(t.loaded=Q[i]),!t.loaded){const o=G();if(t.loaded=o.promise,t.type==="script"&&(document.head.append(j("script",{...t.data,onLoad:()=>o.resolve(),onError:o.reject})),i?Q[i]=t.loaded:o.resolve()),t.type==="iife"){const{fn:s,getParams:l}=t.data;s(...(l==null?void 0:l(e))||[]),o.resolve()}}await t.loaded}async function Ot(t){const e=t.type==="stylesheet"&&t.data.href||"";if(t.loaded||(t.loaded=tt[e]),!t.loaded){const n=G();t.loaded=n.promise,e&&(tt[e]=t.loaded),t.type==="style"?(document.head.append(j("style",{textContent:t.data})),n.resolve()):e&&(document.head.append(j("link",{rel:"stylesheet",...t.data})),fetch(e).then(i=>{if(i.ok)return i.text();throw i}).then(()=>n.resolve(),n.reject))}await t.loaded}async function Rt(t,e){t.forEach(n=>{var i;n.type==="script"&&((i=n.data)!=null&&i.src)&&At(n.data.src)}),e={getMarkmap:()=>window.markmap,...e};for(const n of t)await Mt(n,e)}async function _t(t){await Promise.all(t.map(e=>Ot(e)))}/*! @gera2ld/jsx-dom v2.2.2 | ISC License */const et=1,nt=2,Lt="http://www.w3.org/2000/svg",H="http://www.w3.org/1999/xlink",Dt={show:H,actuate:H,href:H},Ft=t=>typeof t=="string"||typeof t=="number",Ht=t=>(t==null?void 0:t.vtype)===et,Bt=t=>(t==null?void 0:t.vtype)===nt;function $(t,e){let n;if(typeof t=="string")n=et;else if(typeof t=="function")n=nt;else throw new Error("Invalid VNode type");return{vtype:n,type:t,props:e}}function It(t){return t.children}const Vt={isSvg:!1};function it(t,e){Array.isArray(e)||(e=[e]),e=e.filter(Boolean),e.length&&t.append(...e)}function Pt(t,e,n){for(const i in e)if(!(i==="key"||i==="children"||i==="ref"))if(i==="dangerouslySetInnerHTML")t.innerHTML=e[i].__html;else if(i==="innerHTML"||i==="textContent"||i==="innerText"||i==="value"&&["textarea","select"].includes(t.tagName)){const o=e[i];o!=null&&(t[i]=o)}else i.startsWith("on")?t[i.toLowerCase()]=e[i]:Yt(t,i,e[i],n.isSvg)}const Wt={className:"class",labelFor:"for"};function Yt(t,e,n,i){if(e=Wt[e]||e,n===!0)t.setAttribute(e,"");else if(n===!1)t.removeAttribute(e);else{const o=i?Dt[e]:void 0;o!==void 0?t.setAttributeNS(o,e,n):t.setAttribute(e,n)}}function Kt(t){return t.reduce((e,n)=>e.concat(n),[])}function B(t,e){return Array.isArray(t)?Kt(t.map(n=>B(n,e))):I(t,e)}function I(t,e=Vt){if(t==null||typeof t=="boolean")return null;if(t instanceof Node)return t;if(Bt(t)){const{type:n,props:i}=t;if(n===It){const s=document.createDocumentFragment();if(i.children){const l=B(i.children,e);it(s,l)}return s}const o=n(i);return I(o,e)}if(Ft(t))return document.createTextNode(`${t}`);if(Ht(t)){let n;const{type:i,props:o}=t;if(!e.isSvg&&i==="svg"&&(e=Object.assign({},e,{isSvg:!0})),e.isSvg?n=document.createElementNS(Lt,i):n=document.createElement(i),Pt(n,o,e),o.children){let l=e;e.isSvg&&i==="foreignObject"&&(l=Object.assign({},l,{isSvg:!1}));const a=B(o.children,l);a!=null&&it(n,a)}const{ref:s}=o;return typeof s=="function"&&s(n),n}throw new Error("mount: Invalid Vnode!")}function V(t){return I(t)}function Ut(t){var e=0,n=t.children,i=n&&n.length;if(!i)e=1;else for(;--i>=0;)e+=n[i].value;t.value=e}function Gt(){return this.eachAfter(Ut)}function Jt(t){var e=this,n,i=[e],o,s,l;do for(n=i.reverse(),i=[];e=n.pop();)if(t(e),o=e.children,o)for(s=0,l=o.length;s<l;++s)i.push(o[s]);while(i.length);return this}function Zt(t){for(var e=this,n=[e],i,o;e=n.pop();)if(t(e),i=e.children,i)for(o=i.length-1;o>=0;--o)n.push(i[o]);return this}function qt(t){for(var e=this,n=[e],i=[],o,s,l;e=n.pop();)if(i.push(e),o=e.children,o)for(s=0,l=o.length;s<l;++s)n.push(o[s]);for(;e=i.pop();)t(e);return this}function Qt(t){return this.eachAfter(function(e){for(var n=+t(e.data)||0,i=e.children,o=i&&i.length;--o>=0;)n+=i[o].value;e.value=n})}function te(t){return this.eachBefore(function(e){e.children&&e.children.sort(t)})}function ee(t){for(var e=this,n=ne(e,t),i=[e];e!==n;)e=e.parent,i.push(e);for(var o=i.length;t!==n;)i.splice(o,0,t),t=t.parent;return i}function ne(t,e){if(t===e)return t;var n=t.ancestors(),i=e.ancestors(),o=null;for(t=n.pop(),e=i.pop();t===e;)o=t,t=n.pop(),e=i.pop();return o}function ie(){for(var t=this,e=[t];t=t.parent;)e.push(t);return e}function oe(){var t=[];return this.each(function(e){t.push(e)}),t}function re(){var t=[];return this.eachBefore(function(e){e.children||t.push(e)}),t}function se(){var t=this,e=[];return t.each(function(n){n!==t&&e.push({source:n.parent,target:n})}),e}function P(t,e){var n=new T(t),i=+t.value&&(n.value=t.value),o,s=[n],l,a,c,p;for(e==null&&(e=le);o=s.pop();)if(i&&(o.value=+o.data.value),(a=e(o.data))&&(p=a.length))for(o.children=new Array(p),c=p-1;c>=0;--c)s.push(l=o.children[c]=new T(a[c])),l.parent=o,l.depth=o.depth+1;return n.eachBefore(he)}function ae(){return P(this).eachBefore(ce)}function le(t){return t.children}function ce(t){t.data=t.data.data}function he(t){var e=0;do t.height=e;while((t=t.parent)&&t.height<++e)}function T(t){this.data=t,this.depth=this.height=0,this.parent=null}T.prototype=P.prototype={constructor:T,count:Gt,each:Jt,eachAfter:qt,eachBefore:Zt,sum:Qt,sort:te,path:ee,ancestors:ie,descendants:oe,leaves:re,links:se,copy:ae};const de={name:"d3-flextree",version:"2.1.2",main:"build/d3-flextree.js",module:"index","jsnext:main":"index",author:{name:"Chris Maloney",url:"http://chrismaloney.org"},description:"Flexible tree layout algorithm that allows for variable node sizes.",keywords:["d3","d3-module","layout","tree","hierarchy","d3-hierarchy","plugin","d3-plugin","infovis","visualization","2d"],homepage:"https://github.com/klortho/d3-flextree",license:"WTFPL",repository:{type:"git",url:"https://github.com/klortho/d3-flextree.git"},scripts:{clean:"rm -rf build demo test","build:demo":"rollup -c --environment BUILD:demo","build:dev":"rollup -c --environment BUILD:dev","build:prod":"rollup -c --environment BUILD:prod","build:test":"rollup -c --environment BUILD:test",build:"rollup -c",lint:"eslint index.js src","test:main":"node test/bundle.js","test:browser":"node test/browser-tests.js",test:"npm-run-all test:*",prepare:"npm-run-all clean build lint test"},dependencies:{"d3-hierarchy":"^1.1.5"},devDependencies:{"babel-plugin-external-helpers":"^6.22.0","babel-preset-es2015-rollup":"^3.0.0",d3:"^4.13.0","d3-selection-multi":"^1.0.1",eslint:"^4.19.1",jsdom:"^11.6.2","npm-run-all":"^4.1.2",rollup:"^0.55.3","rollup-plugin-babel":"^2.7.1","rollup-plugin-commonjs":"^8.0.2","rollup-plugin-copy":"^0.2.3","rollup-plugin-json":"^2.3.0","rollup-plugin-node-resolve":"^3.0.2","rollup-plugin-uglify":"^3.0.0","uglify-es":"^3.3.9"}},{version:ue}=de,fe=Object.freeze({children:t=>t.children,nodeSize:t=>t.data.size,spacing:0});function ot(t){const e=Object.assign({},fe,t);function n(a){const c=e[a];return typeof c=="function"?c:()=>c}function i(a){const c=l(s(),a,p=>p.children);return c.update(),c.data}function o(){const a=n("nodeSize"),c=n("spacing");return class ft extends P.prototype.constructor{constructor(h){super(h)}copy(){const h=l(this.constructor,this,f=>f.children);return h.each(f=>f.data=f.data.data),h}get size(){return a(this)}spacing(h){return c(this,h)}get nodes(){return this.descendants()}get xSize(){return this.size[0]}get ySize(){return this.size[1]}get top(){return this.y}get bottom(){return this.y+this.ySize}get left(){return this.x-this.xSize/2}get right(){return this.x+this.xSize/2}get root(){const h=this.ancestors();return h[h.length-1]}get numChildren(){return this.hasChildren?this.children.length:0}get hasChildren(){return!this.noChildren}get noChildren(){return this.children===null}get firstChild(){return this.hasChildren?this.children[0]:null}get lastChild(){return this.hasChildren?this.children[this.numChildren-1]:null}get extents(){return(this.children||[]).reduce((h,f)=>ft.maxExtents(h,f.extents),this.nodeExtents)}get nodeExtents(){return{top:this.top,bottom:this.bottom,left:this.left,right:this.right}}static maxExtents(h,f){return{top:Math.min(h.top,f.top),bottom:Math.max(h.bottom,f.bottom),left:Math.min(h.left,f.left),right:Math.max(h.right,f.right)}}}}function s(){const a=o(),c=n("nodeSize"),p=n("spacing");return class extends a{constructor(h){super(h),Object.assign(this,{x:0,y:0,relX:0,prelim:0,shift:0,change:0,lExt:this,lExtRelX:0,lThr:null,rExt:this,rExtRelX:0,rThr:null})}get size(){return c(this.data)}spacing(h){return p(this.data,h.data)}get x(){return this.data.x}set x(h){this.data.x=h}get y(){return this.data.y}set y(h){this.data.y=h}update(){return rt(this),st(this),this}}}function l(a,c,p){const h=(f,m)=>{const d=new a(f);Object.assign(d,{parent:m,depth:m===null?0:m.depth+1,height:0,length:1});const S=p(f)||[];return d.children=S.length===0?null:S.map(y=>h(y,d)),d.children&&Object.assign(d,d.children.reduce((y,g)=>({height:Math.max(y.height,g.height+1),length:y.length+g.length}),d)),d};return h(c,null)}return Object.assign(i,{nodeSize(a){return arguments.length?(e.nodeSize=a,i):e.nodeSize},spacing(a){return arguments.length?(e.spacing=a,i):e.spacing},children(a){return arguments.length?(e.children=a,i):e.children},hierarchy(a,c){const p=typeof c>"u"?e.children:c;return l(o(),a,p)},dump(a){const c=n("nodeSize"),p=h=>f=>{const m=h+" ",d=h+" ",{x:S,y}=f,g=c(f),x=f.children||[],k=x.length===0?" ":`,${m}children: [${d}${x.map(p(d)).join(d)}${m}],${h}`;return`{ size: [${g.join(", ")}],${m}x: ${S}, y: ${y}${k}},`};return p(` | ||
`)(a)}}),i}ot.version=ue;const rt=(t,e=0)=>(t.y=e,(t.children||[]).reduce((n,i)=>{const[o,s]=n;rt(i,t.y+t.ySize);const l=(o===0?i.lExt:i.rExt).bottom;o!==0&&ge(t,o,s);const a=ze(l,o,s);return[o+1,a]},[0,null]),pe(t),be(t),t),st=(t,e,n)=>{typeof e>"u"&&(e=-t.relX-t.prelim,n=0);const i=e+t.relX;return t.relX=i+t.prelim-n,t.prelim=0,t.x=n+t.relX,(t.children||[]).forEach(o=>st(o,i,t.x)),t},pe=t=>{(t.children||[]).reduce((e,n)=>{const[i,o]=e,s=i+n.shift,l=o+s+n.change;return n.relX+=l,[s,l]},[0,0])},ge=(t,e,n)=>{const i=t.children[e-1],o=t.children[e];let s=i,l=i.relX,a=o,c=o.relX,p=!0;for(;s&&a;){s.bottom>n.lowY&&(n=n.next);const h=l+s.prelim-(c+a.prelim)+s.xSize/2+a.xSize/2+s.spacing(a);(h>0||h<0&&p)&&(c+=h,me(o,h),ye(t,e,n.index,h)),p=!1;const f=s.bottom,m=a.bottom;f<=m&&(s=Se(s),s&&(l+=s.relX)),f>=m&&(a=xe(a),a&&(c+=a.relX))}!s&&a?ve(t,e,a,c):s&&!a&&ke(t,e,s,l)},me=(t,e)=>{t.relX+=e,t.lExtRelX+=e,t.rExtRelX+=e},ye=(t,e,n,i)=>{const o=t.children[e],s=e-n;if(s>1){const l=i/s;t.children[n+1].shift+=l,o.shift-=l,o.change-=i-l}},xe=t=>t.hasChildren?t.firstChild:t.lThr,Se=t=>t.hasChildren?t.lastChild:t.rThr,ve=(t,e,n,i)=>{const o=t.firstChild,s=o.lExt,l=t.children[e];s.lThr=n;const a=i-n.relX-o.lExtRelX;s.relX+=a,s.prelim-=a,o.lExt=l.lExt,o.lExtRelX=l.lExtRelX},ke=(t,e,n,i)=>{const o=t.children[e],s=o.rExt,l=t.children[e-1];s.rThr=n;const a=i-n.relX-o.rExtRelX;s.relX+=a,s.prelim-=a,o.rExt=l.rExt,o.rExtRelX=l.rExtRelX},be=t=>{if(t.hasChildren){const e=t.firstChild,n=t.lastChild,i=(e.prelim+e.relX-e.xSize/2+n.relX+n.prelim+n.xSize/2)/2;Object.assign(t,{prelim:i,lExt:e.lExt,lExtRelX:e.lExtRelX,rExt:n.rExt,rExtRelX:n.rExtRelX})}},ze=(t,e,n)=>{for(;n!==null&&t>=n.lowY;)n=n.next;return{lowY:t,index:e,next:n}},at=".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{padding:.25em;font-size:calc(1em - 2px);color:#555;background-color:#f0f0f0;border-radius:2px}.markmap-foreign pre{margin:0}.markmap-foreign pre>code{display:block}.markmap-foreign del{text-decoration:line-through}.markmap-foreign em{font-style:italic}.markmap-foreign strong{font-weight:700}.markmap-foreign mark{background:#ffeaa7}",we=".markmap-container{position:absolute;width:0;height:0;top:-100px;left:-100px;overflow:hidden}.markmap-container>.markmap-foreign{display:inline-block}.markmap-container>.markmap-foreign>div:last-child,.markmap-container>.markmap-foreign>div:last-child :not(pre){white-space:nowrap}.markmap-container>.markmap-foreign>div:last-child code{white-space:inherit}",Ee=at;function lt(t){const e=t.data;return Math.max(4-2*e.depth,1.5)}function ct(t,e){const n=v.minIndex(t,e);return t[n]}function W(t){t.stopPropagation()}function Ce(){return{transformHtml:new K}}const ht=new K,dt=v.scaleOrdinal(v.schemeCategory10),ut=typeof navigator<"u"&&navigator.userAgent.includes("Macintosh"),C=class C{constructor(e,n){this.options=C.defaultOptions,this.revokers=[],this.handleZoom=i=>{const{transform:o}=i;this.g.attr("transform",o)},this.handlePan=i=>{i.preventDefault();const o=v.zoomTransform(this.svg.node()),s=o.translate(-i.deltaX/o.k,-i.deltaY/o.k);this.svg.call(this.zoom.transform,s)},this.handleClick=(i,o)=>{let s=this.options.toggleRecursively;(ut?i.metaKey:i.ctrlKey)&&(s=!s),this.toggleNode(o.data,s)},this.viewHooks=Ce(),this.svg=e.datum?e:v.select(e),this.styleNode=this.svg.append("style"),this.zoom=v.zoom().filter(i=>this.options.scrollForPan&&i.type==="wheel"?i.ctrlKey&&!i.button:(!i.ctrlKey||i.type==="wheel")&&!i.button).on("zoom",this.handleZoom),this.setOptions(n),this.state={id:this.options.id||this.svg.attr("id")||gt(),minX:0,maxX:0,minY:0,maxY:0},this.g=this.svg.append("g"),this.revokers.push(ht.tap(()=>{this.setData()}))}getStyleContent(){const{style:e}=this.options,{id:n}=this.state,i=typeof e=="function"?e(n):"";return[this.options.embedGlobalCSS&&at,i].filter(Boolean).join(` | ||
`)}updateStyle(){this.svg.attr("class",mt(this.svg.attr("class"),"markmap",this.state.id));const e=this.getStyleContent();this.styleNode.text(e)}toggleNode(e,n=!1){var o,s;const i=(o=e.payload)!=null&&o.fold?0:1;n?_(e,(l,a)=>{l.payload={...l.payload,fold:i},a()}):e.payload={...e.payload,fold:(s=e.payload)!=null&&s.fold?0:1},this.renderData(e)}initializeData(e){let n=0;const{color:i,nodeMinHeight:o,maxWidth:s,initialExpandLevel:l}=this.options,{id:a}=this.state,c=V($("div",{className:`markmap-container markmap ${a}-g`})),p=V($("style",{children:[this.getStyleContent(),we].join(` | ||
`)}));document.body.append(c,p);const h=s?`max-width: ${s}px`:"";let f=0;_(e,(d,S,y)=>{var k,E,A;d.children=(k=d.children)==null?void 0:k.map(N=>({...N})),n+=1;const g=V($("div",{className:"markmap-foreign",style:h,children:$("div",{dangerouslySetInnerHTML:{__html:d.content}})}));c.append(g),d.state={...d.state,id:n,el:g.firstChild},d.state.path=[(E=y==null?void 0:y.state)==null?void 0:E.path,d.state.id].filter(Boolean).join("."),i(d);const x=((A=d.payload)==null?void 0:A.fold)===2;x?f+=1:(f||l>=0&&d.depth>=l)&&(d.payload={...d.payload,fold:1}),S(),x&&(f-=1)});const m=Array.from(c.childNodes).map(d=>d.firstChild);this.viewHooks.transformHtml.call(this,m),m.forEach(d=>{var S;(S=d.parentNode)==null||S.append(d.cloneNode(!0))}),_(e,(d,S,y)=>{var k;const g=d.state,x=g.el.getBoundingClientRect();d.content=g.el.innerHTML,g.size=[Math.ceil(x.width)+1,Math.max(Math.ceil(x.height),o)],g.key=[(k=y==null?void 0:y.state)==null?void 0:k.id,g.id].filter(Boolean).join(".")+d.content,S()}),c.remove(),p.remove()}setOptions(e){this.options={...this.options,...e},this.options.zoom?this.svg.call(this.zoom):this.svg.on(".zoom",null),this.options.pan?this.svg.on("wheel",this.handlePan):this.svg.on("wheel",null)}setData(e,n){n&&this.setOptions(n),e&&(this.state.data=e),this.state.data&&(this.initializeData(this.state.data),this.updateStyle(),this.renderData())}renderData(e){if(!this.state.data)return;const{spacingHorizontal:n,paddingX:i,spacingVertical:o,autoFit:s,color:l}=this.options,a=ot({}).children(r=>{var u;if(!((u=r.payload)!=null&&u.fold))return r.children}).nodeSize(r=>{const[u,b]=r.data.state.size;return[b,u+(u?i*2:0)+n]}).spacing((r,u)=>r.parent===u.parent?o:o*2),c=a.hierarchy(this.state.data);a(c);const p=c.descendants().reverse(),h=c.links(),f=v.linkHorizontal(),m=v.min(p,r=>r.x-r.xSize/2),d=v.max(p,r=>r.x+r.xSize/2),S=v.min(p,r=>r.y),y=v.max(p,r=>r.y+r.ySize-n);Object.assign(this.state,{minX:m,maxX:d,minY:S,maxY:y}),s&&this.fit();const g=e&&p.find(r=>r.data===e)||c,x=g.data.state.x0??g.x,k=g.data.state.y0??g.y,E=this.g.selectAll(w("g")).data(p,r=>r.data.state.key),A=E.enter().append("g").attr("data-depth",r=>r.data.depth).attr("data-path",r=>r.data.state.path).attr("transform",r=>`translate(${k+g.ySize-r.ySize},${x+g.xSize/2-r.xSize})`),N=this.transition(E.exit());N.select("line").attr("x1",r=>r.ySize-n).attr("x2",r=>r.ySize-n),N.select("foreignObject").style("opacity",0),N.attr("transform",r=>`translate(${g.y+g.ySize-r.ySize},${g.x+g.xSize/2-r.xSize})`).remove();const M=E.merge(A).attr("class",r=>{var u;return["markmap-node",((u=r.data.payload)==null?void 0:u.fold)&&"markmap-fold"].filter(Boolean).join(" ")});this.transition(M).attr("transform",r=>`translate(${r.y},${r.x-r.xSize/2})`);const je=M.selectAll(w("line")).data(r=>[r],r=>r.data.state.key).join(r=>r.append("line").attr("x1",u=>u.ySize-n).attr("x2",u=>u.ySize-n),r=>r,r=>r.remove());this.transition(je).attr("x1",-1).attr("x2",r=>r.ySize-n+2).attr("y1",r=>r.xSize).attr("y2",r=>r.xSize).attr("stroke",r=>l(r.data)).attr("stroke-width",lt);const $e=M.selectAll(w("circle")).data(r=>{var u;return(u=r.data.children)!=null&&u.length?[r]:[]},r=>r.data.state.key).join(r=>r.append("circle").attr("stroke-width","1.5").attr("cx",u=>u.ySize-n).attr("cy",u=>u.xSize).attr("r",0).on("click",(u,b)=>this.handleClick(u,b)).on("mousedown",W),r=>r,r=>r.remove());this.transition($e).attr("r",6).attr("cx",r=>r.ySize-n).attr("cy",r=>r.xSize).attr("stroke",r=>l(r.data)).attr("fill",r=>{var u;return(u=r.data.payload)!=null&&u.fold&&r.data.children?l(r.data):"#fff"});const Te=M.selectAll(w("foreignObject")).data(r=>[r],r=>r.data.state.key).join(r=>{const u=r.append("foreignObject").attr("class","markmap-foreign").attr("x",i).attr("y",0).style("opacity",0).on("mousedown",W).on("dblclick",W);return u.append("xhtml:div").select(function(Y){const O=Y.data.state.el.cloneNode(!0);return this.replaceWith(O),O}).attr("xmlns","http://www.w3.org/1999/xhtml"),u},r=>r,r=>r.remove()).attr("width",r=>Math.max(0,r.ySize-n-i*2)).attr("height",r=>r.xSize);this.transition(Te).style("opacity",1);const Xe=this.g.selectAll(w("path")).data(h,r=>r.target.data.state.key).join(r=>{const u=[k+g.ySize-n,x+g.xSize/2];return r.insert("path","g").attr("class","markmap-link").attr("data-depth",b=>b.target.data.depth).attr("data-path",b=>b.target.data.state.path).attr("d",f({source:u,target:u}))},r=>r,r=>{const u=[g.y+g.ySize-n,g.x+g.xSize/2];return this.transition(r).attr("d",f({source:u,target:u})).remove()});this.transition(Xe).attr("stroke",r=>l(r.target.data)).attr("stroke-width",r=>lt(r.target)).attr("d",r=>{const u=r.source,b=r.target,Y=[u.y+u.ySize-n,u.x+u.xSize/2],O=[b.y,b.x+b.xSize/2];return f({source:Y,target:O})}),p.forEach(r=>{r.data.state.x0=r.x,r.data.state.y0=r.y})}transition(e){const{duration:n}=this.options;return e.transition().duration(n)}async fit(){const e=this.svg.node(),{width:n,height:i}=e.getBoundingClientRect(),{fitRatio:o}=this.options,{minX:s,maxX:l,minY:a,maxY:c}=this.state,p=c-a,h=l-s,f=Math.min(n/p*o,i/h*o,2),m=v.zoomIdentity.translate((n-p*f)/2-a*f,(i-h*f)/2-s*f).scale(f);return this.transition(this.svg).call(this.zoom.transform,m).end().catch(R)}async ensureView(e,n){let i;if(this.g.selectAll(w("g")).each(function(k){k.data===e&&(i=k)}),!i)return;const o=this.svg.node(),{spacingHorizontal:s}=this.options,l=o.getBoundingClientRect(),a=v.zoomTransform(o),[c,p]=[i.y,i.y+i.ySize-s+2].map(x=>x*a.k+a.x),[h,f]=[i.x-i.xSize/2,i.x+i.xSize/2].map(x=>x*a.k+a.y),m={left:0,right:0,top:0,bottom:0,...n},d=[m.left-c,l.width-m.right-p],S=[m.top-h,l.height-m.bottom-f],y=d[0]*d[1]>0?ct(d,Math.abs)/a.k:0,g=S[0]*S[1]>0?ct(S,Math.abs)/a.k:0;if(y||g){const x=a.translate(y,g);return this.transition(this.svg).call(this.zoom.transform,x).end().catch(R)}}async rescale(e){const n=this.svg.node(),{width:i,height:o}=n.getBoundingClientRect(),s=i/2,l=o/2,a=v.zoomTransform(n),c=a.translate((s-a.x)*(1-e)/a.k,(l-a.y)*(1-e)/a.k).scale(e);return this.transition(this.svg).call(this.zoom.transform,c).end().catch(R)}destroy(){this.svg.on(".zoom",null),this.svg.html(null),this.revokers.forEach(e=>{e()})}static create(e,n,i=null){const o=new C(e,n);return i&&(o.setData(i),o.fit()),o}};C.defaultOptions={autoFit:!1,color:e=>{var n;return dt(`${((n=e.state)==null?void 0:n.path)||""}`)},duration:500,embedGlobalCSS:!0,fitRatio:.95,maxWidth:0,nodeMinHeight:16,paddingX:8,scrollForPan:ut,spacingHorizontal:80,spacingVertical:5,initialExpandLevel:-1,zoom:!0,pan:!0,toggleRecursively:!1};let X=C;function Ne(t){const e={},n={...t},{color:i,colorFreezeLevel:o}=n;if((i==null?void 0:i.length)===1){const a=i[0];e.color=()=>a}else if(i!=null&&i.length){const a=v.scaleOrdinal(i);e.color=c=>a(`${c.state.path}`)}if(o){const a=e.color||X.defaultOptions.color;e.color=c=>(c={...c,state:{...c.state,path:c.state.path.split(".").slice(0,o).join(".")}},a(c))}return["duration","maxWidth","initialExpandLevel"].forEach(a=>{const c=n[a];typeof c=="number"&&(e[a]=c)}),["zoom","pan"].forEach(a=>{const c=n[a];c!=null&&(e[a]=!!c)}),e}z.Markmap=X,z.defaultColorFn=dt,z.deriveOptions=Ne,z.globalCSS=Ee,z.loadCSS=_t,z.loadJS=Rt,z.refreshHook=ht,Object.defineProperty(z,Symbol.toStringTag,{value:"Module"})})(this.markmap=this.markmap||{},d3); |
1816
dist/index.js
@@ -1,350 +0,335 @@ | ||
/*! markmap-view v0.15.5 | MIT License */ | ||
import { Hook, getId, addClass, walkTree, childSelector, noop } from 'markmap-common'; | ||
export { loadCSS, loadJS } from 'markmap-common'; | ||
import { scaleOrdinal, schemeCategory10, zoomTransform, select, zoom, linkHorizontal, min, max, zoomIdentity, minIndex } from 'd3'; | ||
function _extends() { | ||
_extends = Object.assign ? Object.assign.bind() : function (target) { | ||
for (var i = 1; i < arguments.length; i++) { | ||
var source = arguments[i]; | ||
for (var key in source) { | ||
if (Object.prototype.hasOwnProperty.call(source, key)) { | ||
target[key] = source[key]; | ||
} | ||
} | ||
} | ||
return target; | ||
import { Hook as U, getId as at, addClass as lt, walkTree as M, childSelector as b, noop as A } from "markmap-common"; | ||
import { loadCSS as Ce, loadJS as we } from "markmap-common"; | ||
import { scaleOrdinal as G, schemeCategory10 as ct, zoomTransform as O, select as ht, zoom as dt, linkHorizontal as ut, min as I, max as W, zoomIdentity as pt, minIndex as ft } from "d3"; | ||
/*! @gera2ld/jsx-dom v2.2.2 | ISC License */ | ||
const Z = 1, J = 2, gt = "http://www.w3.org/2000/svg", H = "http://www.w3.org/1999/xlink", mt = { | ||
show: H, | ||
actuate: H, | ||
href: H | ||
}, xt = (e) => typeof e == "string" || typeof e == "number", yt = (e) => (e == null ? void 0 : e.vtype) === Z, St = (e) => (e == null ? void 0 : e.vtype) === J; | ||
function N(e, t) { | ||
let n; | ||
if (typeof e == "string") | ||
n = Z; | ||
else if (typeof e == "function") | ||
n = J; | ||
else | ||
throw new Error("Invalid VNode type"); | ||
return { | ||
vtype: n, | ||
type: e, | ||
props: t | ||
}; | ||
return _extends.apply(this, arguments); | ||
} | ||
function count(node) { | ||
var sum = 0, | ||
children = node.children, | ||
i = children && children.length; | ||
if (!i) sum = 1;else while (--i >= 0) sum += children[i].value; | ||
node.value = sum; | ||
function vt(e) { | ||
return e.children; | ||
} | ||
function node_count () { | ||
return this.eachAfter(count); | ||
const zt = { | ||
isSvg: !1 | ||
}; | ||
function V(e, t) { | ||
Array.isArray(t) || (t = [t]), t = t.filter(Boolean), t.length && e.append(...t); | ||
} | ||
function node_each (callback) { | ||
var node = this, | ||
current, | ||
next = [node], | ||
children, | ||
i, | ||
n; | ||
do { | ||
current = next.reverse(), next = []; | ||
while (node = current.pop()) { | ||
callback(node), children = node.children; | ||
if (children) for (i = 0, n = children.length; i < n; ++i) { | ||
next.push(children[i]); | ||
} | ||
} | ||
} while (next.length); | ||
return this; | ||
function kt(e, t, n) { | ||
for (const i in t) | ||
if (!(i === "key" || i === "children" || i === "ref")) | ||
if (i === "dangerouslySetInnerHTML") | ||
e.innerHTML = t[i].__html; | ||
else if (i === "innerHTML" || i === "textContent" || i === "innerText" || i === "value" && ["textarea", "select"].includes(e.tagName)) { | ||
const r = t[i]; | ||
r != null && (e[i] = r); | ||
} else | ||
i.startsWith("on") ? e[i.toLowerCase()] = t[i] : Et(e, i, t[i], n.isSvg); | ||
} | ||
function node_eachBefore (callback) { | ||
var node = this, | ||
nodes = [node], | ||
children, | ||
i; | ||
while (node = nodes.pop()) { | ||
callback(node), children = node.children; | ||
if (children) for (i = children.length - 1; i >= 0; --i) { | ||
nodes.push(children[i]); | ||
} | ||
const bt = { | ||
className: "class", | ||
labelFor: "for" | ||
}; | ||
function Et(e, t, n, i) { | ||
if (t = bt[t] || t, n === !0) | ||
e.setAttribute(t, ""); | ||
else if (n === !1) | ||
e.removeAttribute(t); | ||
else { | ||
const r = i ? mt[t] : void 0; | ||
r !== void 0 ? e.setAttributeNS(r, t, n) : e.setAttribute(t, n); | ||
} | ||
return this; | ||
} | ||
function node_eachAfter (callback) { | ||
var node = this, | ||
nodes = [node], | ||
next = [], | ||
children, | ||
i, | ||
n; | ||
while (node = nodes.pop()) { | ||
next.push(node), children = node.children; | ||
if (children) for (i = 0, n = children.length; i < n; ++i) { | ||
nodes.push(children[i]); | ||
function Ct(e) { | ||
return e.reduce((t, n) => t.concat(n), []); | ||
} | ||
function D(e, t) { | ||
return Array.isArray(e) ? Ct(e.map((n) => D(n, t))) : _(e, t); | ||
} | ||
function _(e, t = zt) { | ||
if (e == null || typeof e == "boolean") | ||
return null; | ||
if (e instanceof Node) | ||
return e; | ||
if (St(e)) { | ||
const { | ||
type: n, | ||
props: i | ||
} = e; | ||
if (n === vt) { | ||
const a = document.createDocumentFragment(); | ||
if (i.children) { | ||
const c = D(i.children, t); | ||
V(a, c); | ||
} | ||
return a; | ||
} | ||
const r = n(i); | ||
return _(r, t); | ||
} | ||
while (node = next.pop()) { | ||
callback(node); | ||
if (xt(e)) | ||
return document.createTextNode(`${e}`); | ||
if (yt(e)) { | ||
let n; | ||
const { | ||
type: i, | ||
props: r | ||
} = e; | ||
if (!t.isSvg && i === "svg" && (t = Object.assign({}, t, { | ||
isSvg: !0 | ||
})), t.isSvg ? n = document.createElementNS(gt, i) : n = document.createElement(i), kt(n, r, t), r.children) { | ||
let c = t; | ||
t.isSvg && i === "foreignObject" && (c = Object.assign({}, c, { | ||
isSvg: !1 | ||
})); | ||
const s = D(r.children, c); | ||
s != null && V(n, s); | ||
} | ||
const { | ||
ref: a | ||
} = r; | ||
return typeof a == "function" && a(n), n; | ||
} | ||
throw new Error("mount: Invalid Vnode!"); | ||
} | ||
function $(e) { | ||
return _(e); | ||
} | ||
function wt(e) { | ||
var t = 0, n = e.children, i = n && n.length; | ||
if (!i) | ||
t = 1; | ||
else | ||
for (; --i >= 0; ) | ||
t += n[i].value; | ||
e.value = t; | ||
} | ||
function Xt() { | ||
return this.eachAfter(wt); | ||
} | ||
function jt(e) { | ||
var t = this, n, i = [t], r, a, c; | ||
do | ||
for (n = i.reverse(), i = []; t = n.pop(); ) | ||
if (e(t), r = t.children, r) | ||
for (a = 0, c = r.length; a < c; ++a) | ||
i.push(r[a]); | ||
while (i.length); | ||
return this; | ||
} | ||
function node_sum (value) { | ||
return this.eachAfter(function (node) { | ||
var sum = +value(node.data) || 0, | ||
children = node.children, | ||
i = children && children.length; | ||
while (--i >= 0) sum += children[i].value; | ||
node.value = sum; | ||
function Nt(e) { | ||
for (var t = this, n = [t], i, r; t = n.pop(); ) | ||
if (e(t), i = t.children, i) | ||
for (r = i.length - 1; r >= 0; --r) | ||
n.push(i[r]); | ||
return this; | ||
} | ||
function Rt(e) { | ||
for (var t = this, n = [t], i = [], r, a, c; t = n.pop(); ) | ||
if (i.push(t), r = t.children, r) | ||
for (a = 0, c = r.length; a < c; ++a) | ||
n.push(r[a]); | ||
for (; t = i.pop(); ) | ||
e(t); | ||
return this; | ||
} | ||
function Tt(e) { | ||
return this.eachAfter(function(t) { | ||
for (var n = +e(t.data) || 0, i = t.children, r = i && i.length; --r >= 0; ) | ||
n += i[r].value; | ||
t.value = n; | ||
}); | ||
} | ||
function node_sort (compare) { | ||
return this.eachBefore(function (node) { | ||
if (node.children) { | ||
node.children.sort(compare); | ||
} | ||
function Mt(e) { | ||
return this.eachBefore(function(t) { | ||
t.children && t.children.sort(e); | ||
}); | ||
} | ||
function node_path (end) { | ||
var start = this, | ||
ancestor = leastCommonAncestor(start, end), | ||
nodes = [start]; | ||
while (start !== ancestor) { | ||
start = start.parent; | ||
nodes.push(start); | ||
} | ||
var k = nodes.length; | ||
while (end !== ancestor) { | ||
nodes.splice(k, 0, end); | ||
end = end.parent; | ||
} | ||
return nodes; | ||
function At(e) { | ||
for (var t = this, n = Ot(t, e), i = [t]; t !== n; ) | ||
t = t.parent, i.push(t); | ||
for (var r = i.length; e !== n; ) | ||
i.splice(r, 0, e), e = e.parent; | ||
return i; | ||
} | ||
function leastCommonAncestor(a, b) { | ||
if (a === b) return a; | ||
var aNodes = a.ancestors(), | ||
bNodes = b.ancestors(), | ||
c = null; | ||
a = aNodes.pop(); | ||
b = bNodes.pop(); | ||
while (a === b) { | ||
c = a; | ||
a = aNodes.pop(); | ||
b = bNodes.pop(); | ||
} | ||
return c; | ||
function Ot(e, t) { | ||
if (e === t) | ||
return e; | ||
var n = e.ancestors(), i = t.ancestors(), r = null; | ||
for (e = n.pop(), t = i.pop(); e === t; ) | ||
r = e, e = n.pop(), t = i.pop(); | ||
return r; | ||
} | ||
function node_ancestors () { | ||
var node = this, | ||
nodes = [node]; | ||
while (node = node.parent) { | ||
nodes.push(node); | ||
} | ||
return nodes; | ||
function Ht() { | ||
for (var e = this, t = [e]; e = e.parent; ) | ||
t.push(e); | ||
return t; | ||
} | ||
function node_descendants () { | ||
var nodes = []; | ||
this.each(function (node) { | ||
nodes.push(node); | ||
}); | ||
return nodes; | ||
function $t() { | ||
var e = []; | ||
return this.each(function(t) { | ||
e.push(t); | ||
}), e; | ||
} | ||
function node_leaves () { | ||
var leaves = []; | ||
this.eachBefore(function (node) { | ||
if (!node.children) { | ||
leaves.push(node); | ||
} | ||
}); | ||
return leaves; | ||
function Bt() { | ||
var e = []; | ||
return this.eachBefore(function(t) { | ||
t.children || e.push(t); | ||
}), e; | ||
} | ||
function node_links () { | ||
var root = this, | ||
links = []; | ||
root.each(function (node) { | ||
if (node !== root) { | ||
// Don’t include the root’s parent, if any. | ||
links.push({ | ||
source: node.parent, | ||
target: node | ||
}); | ||
} | ||
}); | ||
return links; | ||
function Dt() { | ||
var e = this, t = []; | ||
return e.each(function(n) { | ||
n !== e && t.push({ source: n.parent, target: n }); | ||
}), t; | ||
} | ||
function hierarchy(data, children) { | ||
var root = new Node$1(data), | ||
valued = +data.value && (root.value = data.value), | ||
node, | ||
nodes = [root], | ||
child, | ||
childs, | ||
i, | ||
n; | ||
if (children == null) children = defaultChildren; | ||
while (node = nodes.pop()) { | ||
if (valued) node.value = +node.data.value; | ||
if ((childs = children(node.data)) && (n = childs.length)) { | ||
node.children = new Array(n); | ||
for (i = n - 1; i >= 0; --i) { | ||
nodes.push(child = node.children[i] = new Node$1(childs[i])); | ||
child.parent = node; | ||
child.depth = node.depth + 1; | ||
} | ||
} | ||
} | ||
return root.eachBefore(computeHeight); | ||
function L(e, t) { | ||
var n = new R(e), i = +e.value && (n.value = e.value), r, a = [n], c, s, l, f; | ||
for (t == null && (t = _t); r = a.pop(); ) | ||
if (i && (r.value = +r.data.value), (s = t(r.data)) && (f = s.length)) | ||
for (r.children = new Array(f), l = f - 1; l >= 0; --l) | ||
a.push(c = r.children[l] = new R(s[l])), c.parent = r, c.depth = r.depth + 1; | ||
return n.eachBefore(It); | ||
} | ||
function node_copy() { | ||
return hierarchy(this).eachBefore(copyData); | ||
function Ft() { | ||
return L(this).eachBefore(Lt); | ||
} | ||
function defaultChildren(d) { | ||
return d.children; | ||
function _t(e) { | ||
return e.children; | ||
} | ||
function copyData(node) { | ||
node.data = node.data.data; | ||
function Lt(e) { | ||
e.data = e.data.data; | ||
} | ||
function computeHeight(node) { | ||
var height = 0; | ||
do node.height = height; while ((node = node.parent) && node.height < ++height); | ||
function It(e) { | ||
var t = 0; | ||
do | ||
e.height = t; | ||
while ((e = e.parent) && e.height < ++t); | ||
} | ||
function Node$1(data) { | ||
this.data = data; | ||
this.depth = this.height = 0; | ||
this.parent = null; | ||
function R(e) { | ||
this.data = e, this.depth = this.height = 0, this.parent = null; | ||
} | ||
Node$1.prototype = hierarchy.prototype = { | ||
constructor: Node$1, | ||
count: node_count, | ||
each: node_each, | ||
eachAfter: node_eachAfter, | ||
eachBefore: node_eachBefore, | ||
sum: node_sum, | ||
sort: node_sort, | ||
path: node_path, | ||
ancestors: node_ancestors, | ||
descendants: node_descendants, | ||
leaves: node_leaves, | ||
links: node_links, | ||
copy: node_copy | ||
R.prototype = L.prototype = { | ||
constructor: R, | ||
count: Xt, | ||
each: jt, | ||
eachAfter: Rt, | ||
eachBefore: Nt, | ||
sum: Tt, | ||
sort: Mt, | ||
path: At, | ||
ancestors: Ht, | ||
descendants: $t, | ||
leaves: Bt, | ||
links: Dt, | ||
copy: Ft | ||
}; | ||
var name = "d3-flextree"; | ||
var version$1 = "2.1.2"; | ||
var main = "build/d3-flextree.js"; | ||
var module = "index"; | ||
var author = { | ||
name: "Chris Maloney", | ||
url: "http://chrismaloney.org" | ||
}; | ||
var description = "Flexible tree layout algorithm that allows for variable node sizes."; | ||
var keywords = [ | ||
"d3", | ||
"d3-module", | ||
"layout", | ||
"tree", | ||
"hierarchy", | ||
"d3-hierarchy", | ||
"plugin", | ||
"d3-plugin", | ||
"infovis", | ||
"visualization", | ||
"2d" | ||
]; | ||
var homepage = "https://github.com/klortho/d3-flextree"; | ||
var license = "WTFPL"; | ||
var repository = { | ||
type: "git", | ||
url: "https://github.com/klortho/d3-flextree.git" | ||
}; | ||
var scripts = { | ||
clean: "rm -rf build demo test", | ||
"build:demo": "rollup -c --environment BUILD:demo", | ||
"build:dev": "rollup -c --environment BUILD:dev", | ||
"build:prod": "rollup -c --environment BUILD:prod", | ||
"build:test": "rollup -c --environment BUILD:test", | ||
build: "rollup -c", | ||
lint: "eslint index.js src", | ||
"test:main": "node test/bundle.js", | ||
"test:browser": "node test/browser-tests.js", | ||
test: "npm-run-all test:*", | ||
prepare: "npm-run-all clean build lint test" | ||
}; | ||
var dependencies = { | ||
"d3-hierarchy": "^1.1.5" | ||
}; | ||
var devDependencies = { | ||
"babel-plugin-external-helpers": "^6.22.0", | ||
"babel-preset-es2015-rollup": "^3.0.0", | ||
d3: "^4.13.0", | ||
"d3-selection-multi": "^1.0.1", | ||
eslint: "^4.19.1", | ||
jsdom: "^11.6.2", | ||
"npm-run-all": "^4.1.2", | ||
rollup: "^0.55.3", | ||
"rollup-plugin-babel": "^2.7.1", | ||
"rollup-plugin-commonjs": "^8.0.2", | ||
"rollup-plugin-copy": "^0.2.3", | ||
"rollup-plugin-json": "^2.3.0", | ||
"rollup-plugin-node-resolve": "^3.0.2", | ||
"rollup-plugin-uglify": "^3.0.0", | ||
"uglify-es": "^3.3.9" | ||
}; | ||
var packageInfo = { | ||
name: name, | ||
version: version$1, | ||
main: main, | ||
module: module, | ||
"jsnext:main": "index", | ||
author: author, | ||
description: description, | ||
keywords: keywords, | ||
homepage: homepage, | ||
license: license, | ||
repository: repository, | ||
scripts: scripts, | ||
dependencies: dependencies, | ||
devDependencies: devDependencies | ||
}; | ||
const { | ||
version | ||
} = packageInfo; | ||
const defaults = Object.freeze({ | ||
children: data => data.children, | ||
nodeSize: node => node.data.size, | ||
const Wt = "d3-flextree", Vt = "2.1.2", Yt = "build/d3-flextree.js", Kt = "index", Pt = { | ||
name: "Chris Maloney", | ||
url: "http://chrismaloney.org" | ||
}, Ut = "Flexible tree layout algorithm that allows for variable node sizes.", Gt = [ | ||
"d3", | ||
"d3-module", | ||
"layout", | ||
"tree", | ||
"hierarchy", | ||
"d3-hierarchy", | ||
"plugin", | ||
"d3-plugin", | ||
"infovis", | ||
"visualization", | ||
"2d" | ||
], Zt = "https://github.com/klortho/d3-flextree", Jt = "WTFPL", qt = { | ||
type: "git", | ||
url: "https://github.com/klortho/d3-flextree.git" | ||
}, Qt = { | ||
clean: "rm -rf build demo test", | ||
"build:demo": "rollup -c --environment BUILD:demo", | ||
"build:dev": "rollup -c --environment BUILD:dev", | ||
"build:prod": "rollup -c --environment BUILD:prod", | ||
"build:test": "rollup -c --environment BUILD:test", | ||
build: "rollup -c", | ||
lint: "eslint index.js src", | ||
"test:main": "node test/bundle.js", | ||
"test:browser": "node test/browser-tests.js", | ||
test: "npm-run-all test:*", | ||
prepare: "npm-run-all clean build lint test" | ||
}, te = { | ||
"d3-hierarchy": "^1.1.5" | ||
}, ee = { | ||
"babel-plugin-external-helpers": "^6.22.0", | ||
"babel-preset-es2015-rollup": "^3.0.0", | ||
d3: "^4.13.0", | ||
"d3-selection-multi": "^1.0.1", | ||
eslint: "^4.19.1", | ||
jsdom: "^11.6.2", | ||
"npm-run-all": "^4.1.2", | ||
rollup: "^0.55.3", | ||
"rollup-plugin-babel": "^2.7.1", | ||
"rollup-plugin-commonjs": "^8.0.2", | ||
"rollup-plugin-copy": "^0.2.3", | ||
"rollup-plugin-json": "^2.3.0", | ||
"rollup-plugin-node-resolve": "^3.0.2", | ||
"rollup-plugin-uglify": "^3.0.0", | ||
"uglify-es": "^3.3.9" | ||
}, ne = { | ||
name: Wt, | ||
version: Vt, | ||
main: Yt, | ||
module: Kt, | ||
"jsnext:main": "index", | ||
author: Pt, | ||
description: Ut, | ||
keywords: Gt, | ||
homepage: Zt, | ||
license: Jt, | ||
repository: qt, | ||
scripts: Qt, | ||
dependencies: te, | ||
devDependencies: ee | ||
}, { version: ie } = ne, oe = Object.freeze({ | ||
children: (e) => e.children, | ||
nodeSize: (e) => e.data.size, | ||
spacing: 0 | ||
}); | ||
// Create a layout function with customizable options. Per D3-style, the | ||
// options can be set at any time using setter methods. The layout function | ||
// will compute the tree node positions based on the options in effect at the | ||
// time it is called. | ||
function flextree(options) { | ||
const opts = Object.assign({}, defaults, options); | ||
function accessor(name) { | ||
const opt = opts[name]; | ||
return typeof opt === 'function' ? opt : () => opt; | ||
function Q(e) { | ||
const t = Object.assign({}, oe, e); | ||
function n(s) { | ||
const l = t[s]; | ||
return typeof l == "function" ? l : () => l; | ||
} | ||
function layout(tree) { | ||
const wtree = wrap(getWrapper(), tree, node => node.children); | ||
wtree.update(); | ||
return wtree.data; | ||
function i(s) { | ||
const l = c(a(), s, (f) => f.children); | ||
return l.update(), l.data; | ||
} | ||
function getFlexNode() { | ||
const nodeSize = accessor('nodeSize'); | ||
const spacing = accessor('spacing'); | ||
return class FlexNode extends hierarchy.prototype.constructor { | ||
constructor(data) { | ||
super(data); | ||
function r() { | ||
const s = n("nodeSize"), l = n("spacing"); | ||
return class q extends L.prototype.constructor { | ||
constructor(h) { | ||
super(h); | ||
} | ||
copy() { | ||
const c = wrap(this.constructor, this, node => node.children); | ||
c.each(node => node.data = node.data.data); | ||
return c; | ||
const h = c(this.constructor, this, (p) => p.children); | ||
return h.each((p) => p.data = p.data.data), h; | ||
} | ||
get size() { | ||
return nodeSize(this); | ||
return s(this); | ||
} | ||
spacing(oNode) { | ||
return spacing(this, oNode); | ||
spacing(h) { | ||
return l(this, h); | ||
} | ||
@@ -373,4 +358,4 @@ get nodes() { | ||
get root() { | ||
const ancs = this.ancestors(); | ||
return ancs[ancs.length - 1]; | ||
const h = this.ancestors(); | ||
return h[h.length - 1]; | ||
} | ||
@@ -393,3 +378,6 @@ get numChildren() { | ||
get extents() { | ||
return (this.children || []).reduce((acc, kid) => FlexNode.maxExtents(acc, kid.extents), this.nodeExtents); | ||
return (this.children || []).reduce( | ||
(h, p) => q.maxExtents(h, p.extents), | ||
this.nodeExtents | ||
); | ||
} | ||
@@ -404,8 +392,8 @@ get nodeExtents() { | ||
} | ||
static maxExtents(e0, e1) { | ||
static maxExtents(h, p) { | ||
return { | ||
top: Math.min(e0.top, e1.top), | ||
bottom: Math.max(e0.bottom, e1.bottom), | ||
left: Math.min(e0.left, e1.left), | ||
right: Math.max(e0.right, e1.right) | ||
top: Math.min(h.top, p.top), | ||
bottom: Math.max(h.bottom, p.bottom), | ||
left: Math.min(h.left, p.left), | ||
right: Math.max(h.right, p.right) | ||
}; | ||
@@ -415,10 +403,7 @@ } | ||
} | ||
function getWrapper() { | ||
const FlexNode = getFlexNode(); | ||
const nodeSize = accessor('nodeSize'); | ||
const spacing = accessor('spacing'); | ||
return class extends FlexNode { | ||
constructor(data) { | ||
super(data); | ||
Object.assign(this, { | ||
function a() { | ||
const s = r(), l = n("nodeSize"), f = n("spacing"); | ||
return class extends s { | ||
constructor(h) { | ||
super(h), Object.assign(this, { | ||
x: 0, | ||
@@ -439,6 +424,6 @@ y: 0, | ||
get size() { | ||
return nodeSize(this.data); | ||
return l(this.data); | ||
} | ||
spacing(oNode) { | ||
return spacing(this.data, oNode.data); | ||
spacing(h) { | ||
return f(this.data, h.data); | ||
} | ||
@@ -448,4 +433,4 @@ get x() { | ||
} | ||
set x(v) { | ||
this.data.x = v; | ||
set x(h) { | ||
this.data.x = h; | ||
} | ||
@@ -455,442 +440,153 @@ get y() { | ||
} | ||
set y(v) { | ||
this.data.y = v; | ||
set y(h) { | ||
this.data.y = h; | ||
} | ||
update() { | ||
layoutChildren(this); | ||
resolveX(this); | ||
return this; | ||
return tt(this), et(this), this; | ||
} | ||
}; | ||
} | ||
function wrap(FlexClass, treeData, children) { | ||
const _wrap = (data, parent) => { | ||
const node = new FlexClass(data); | ||
Object.assign(node, { | ||
parent, | ||
depth: parent === null ? 0 : parent.depth + 1, | ||
function c(s, l, f) { | ||
const h = (p, m) => { | ||
const d = new s(p); | ||
Object.assign(d, { | ||
parent: m, | ||
depth: m === null ? 0 : m.depth + 1, | ||
height: 0, | ||
length: 1 | ||
}); | ||
const kidsData = children(data) || []; | ||
node.children = kidsData.length === 0 ? null : kidsData.map(kd => _wrap(kd, node)); | ||
if (node.children) { | ||
Object.assign(node, node.children.reduce((hl, kid) => ({ | ||
height: Math.max(hl.height, kid.height + 1), | ||
length: hl.length + kid.length | ||
}), node)); | ||
} | ||
return node; | ||
const S = f(p) || []; | ||
return d.children = S.length === 0 ? null : S.map((x) => h(x, d)), d.children && Object.assign(d, d.children.reduce( | ||
(x, g) => ({ | ||
height: Math.max(x.height, g.height + 1), | ||
length: x.length + g.length | ||
}), | ||
d | ||
)), d; | ||
}; | ||
return _wrap(treeData, null); | ||
return h(l, null); | ||
} | ||
Object.assign(layout, { | ||
nodeSize(arg) { | ||
return arguments.length ? (opts.nodeSize = arg, layout) : opts.nodeSize; | ||
return Object.assign(i, { | ||
nodeSize(s) { | ||
return arguments.length ? (t.nodeSize = s, i) : t.nodeSize; | ||
}, | ||
spacing(arg) { | ||
return arguments.length ? (opts.spacing = arg, layout) : opts.spacing; | ||
spacing(s) { | ||
return arguments.length ? (t.spacing = s, i) : t.spacing; | ||
}, | ||
children(arg) { | ||
return arguments.length ? (opts.children = arg, layout) : opts.children; | ||
children(s) { | ||
return arguments.length ? (t.children = s, i) : t.children; | ||
}, | ||
hierarchy(treeData, children) { | ||
const kids = typeof children === 'undefined' ? opts.children : children; | ||
return wrap(getFlexNode(), treeData, kids); | ||
hierarchy(s, l) { | ||
const f = typeof l > "u" ? t.children : l; | ||
return c(r(), s, f); | ||
}, | ||
dump(tree) { | ||
const nodeSize = accessor('nodeSize'); | ||
const _dump = i0 => node => { | ||
const i1 = i0 + ' '; | ||
const i2 = i0 + ' '; | ||
const { | ||
x, | ||
y | ||
} = node; | ||
const size = nodeSize(node); | ||
const kids = node.children || []; | ||
const kdumps = kids.length === 0 ? ' ' : `,${i1}children: [${i2}${kids.map(_dump(i2)).join(i2)}${i1}],${i0}`; | ||
return `{ size: [${size.join(', ')}],${i1}x: ${x}, y: ${y}${kdumps}},`; | ||
dump(s) { | ||
const l = n("nodeSize"), f = (h) => (p) => { | ||
const m = h + " ", d = h + " ", { x: S, y: x } = p, g = l(p), y = p.children || [], v = y.length === 0 ? " " : `,${m}children: [${d}${y.map(f(d)).join(d)}${m}],${h}`; | ||
return `{ size: [${g.join(", ")}],${m}x: ${S}, y: ${x}${v}},`; | ||
}; | ||
return _dump('\n')(tree); | ||
return f(` | ||
`)(s); | ||
} | ||
}); | ||
return layout; | ||
}), i; | ||
} | ||
flextree.version = version; | ||
const layoutChildren = (w, y = 0) => { | ||
w.y = y; | ||
(w.children || []).reduce((acc, kid) => { | ||
const [i, lastLows] = acc; | ||
layoutChildren(kid, w.y + w.ySize); | ||
// The lowest vertical coordinate while extreme nodes still point | ||
// in current subtree. | ||
const lowY = (i === 0 ? kid.lExt : kid.rExt).bottom; | ||
if (i !== 0) separate(w, i, lastLows); | ||
const lows = updateLows(lowY, i, lastLows); | ||
return [i + 1, lows]; | ||
}, [0, null]); | ||
shiftChange(w); | ||
positionRoot(w); | ||
return w; | ||
}; | ||
// Resolves the relative coordinate properties - relX and prelim -- | ||
// to set the final, absolute x coordinate for each node. This also sets | ||
// `prelim` to 0, so that `relX` for each node is its x-coordinate relative | ||
// to its parent. | ||
const resolveX = (w, prevSum, parentX) => { | ||
// A call to resolveX without arguments is assumed to be for the root of | ||
// the tree. This will set the root's x-coord to zero. | ||
if (typeof prevSum === 'undefined') { | ||
prevSum = -w.relX - w.prelim; | ||
parentX = 0; | ||
} | ||
const sum = prevSum + w.relX; | ||
w.relX = sum + w.prelim - parentX; | ||
w.prelim = 0; | ||
w.x = parentX + w.relX; | ||
(w.children || []).forEach(k => resolveX(k, sum, w.x)); | ||
return w; | ||
}; | ||
// Process shift and change for all children, to add intermediate spacing to | ||
// each child's modifier. | ||
const shiftChange = w => { | ||
(w.children || []).reduce((acc, child) => { | ||
const [lastShiftSum, lastChangeSum] = acc; | ||
const shiftSum = lastShiftSum + child.shift; | ||
const changeSum = lastChangeSum + shiftSum + child.change; | ||
child.relX += changeSum; | ||
return [shiftSum, changeSum]; | ||
Q.version = ie; | ||
const tt = (e, t = 0) => (e.y = t, (e.children || []).reduce((n, i) => { | ||
const [r, a] = n; | ||
tt(i, e.y + e.ySize); | ||
const c = (r === 0 ? i.lExt : i.rExt).bottom; | ||
r !== 0 && se(e, r, a); | ||
const s = fe(c, r, a); | ||
return [r + 1, s]; | ||
}, [0, null]), re(e), pe(e), e), et = (e, t, n) => { | ||
typeof t > "u" && (t = -e.relX - e.prelim, n = 0); | ||
const i = t + e.relX; | ||
return e.relX = i + e.prelim - n, e.prelim = 0, e.x = n + e.relX, (e.children || []).forEach((r) => et(r, i, e.x)), e; | ||
}, re = (e) => { | ||
(e.children || []).reduce((t, n) => { | ||
const [i, r] = t, a = i + n.shift, c = r + a + n.change; | ||
return n.relX += c, [a, c]; | ||
}, [0, 0]); | ||
}; | ||
// Separates the latest child from its previous sibling | ||
/* eslint-disable complexity */ | ||
const separate = (w, i, lows) => { | ||
const lSib = w.children[i - 1]; | ||
const curSubtree = w.children[i]; | ||
let rContour = lSib; | ||
let rSumMods = lSib.relX; | ||
let lContour = curSubtree; | ||
let lSumMods = curSubtree.relX; | ||
let isFirst = true; | ||
while (rContour && lContour) { | ||
if (rContour.bottom > lows.lowY) lows = lows.next; | ||
// How far to the left of the right side of rContour is the left side | ||
// of lContour? First compute the center-to-center distance, then add | ||
// the "spacing" | ||
const dist = rSumMods + rContour.prelim - (lSumMods + lContour.prelim) + rContour.xSize / 2 + lContour.xSize / 2 + rContour.spacing(lContour); | ||
if (dist > 0 || dist < 0 && isFirst) { | ||
lSumMods += dist; | ||
// Move subtree by changing relX. | ||
moveSubtree(curSubtree, dist); | ||
distributeExtra(w, i, lows.index, dist); | ||
} | ||
isFirst = false; | ||
// Advance highest node(s) and sum(s) of modifiers | ||
const rightBottom = rContour.bottom; | ||
const leftBottom = lContour.bottom; | ||
if (rightBottom <= leftBottom) { | ||
rContour = nextRContour(rContour); | ||
if (rContour) rSumMods += rContour.relX; | ||
} | ||
if (rightBottom >= leftBottom) { | ||
lContour = nextLContour(lContour); | ||
if (lContour) lSumMods += lContour.relX; | ||
} | ||
}, se = (e, t, n) => { | ||
const i = e.children[t - 1], r = e.children[t]; | ||
let a = i, c = i.relX, s = r, l = r.relX, f = !0; | ||
for (; a && s; ) { | ||
a.bottom > n.lowY && (n = n.next); | ||
const h = c + a.prelim - (l + s.prelim) + a.xSize / 2 + s.xSize / 2 + a.spacing(s); | ||
(h > 0 || h < 0 && f) && (l += h, ae(r, h), le(e, t, n.index, h)), f = !1; | ||
const p = a.bottom, m = s.bottom; | ||
p <= m && (a = he(a), a && (c += a.relX)), p >= m && (s = ce(s), s && (l += s.relX)); | ||
} | ||
// Set threads and update extreme nodes. In the first case, the | ||
// current subtree is taller than the left siblings. | ||
if (!rContour && lContour) setLThr(w, i, lContour, lSumMods); | ||
// In the next case, the left siblings are taller than the current subtree | ||
else if (rContour && !lContour) setRThr(w, i, rContour, rSumMods); | ||
}; | ||
/* eslint-enable complexity */ | ||
// Move subtree by changing relX. | ||
const moveSubtree = (subtree, distance) => { | ||
subtree.relX += distance; | ||
subtree.lExtRelX += distance; | ||
subtree.rExtRelX += distance; | ||
}; | ||
const distributeExtra = (w, curSubtreeI, leftSibI, dist) => { | ||
const curSubtree = w.children[curSubtreeI]; | ||
const n = curSubtreeI - leftSibI; | ||
// Are there intermediate children? | ||
if (n > 1) { | ||
const delta = dist / n; | ||
w.children[leftSibI + 1].shift += delta; | ||
curSubtree.shift -= delta; | ||
curSubtree.change -= dist - delta; | ||
!a && s ? de(e, t, s, l) : a && !s && ue(e, t, a, c); | ||
}, ae = (e, t) => { | ||
e.relX += t, e.lExtRelX += t, e.rExtRelX += t; | ||
}, le = (e, t, n, i) => { | ||
const r = e.children[t], a = t - n; | ||
if (a > 1) { | ||
const c = i / a; | ||
e.children[n + 1].shift += c, r.shift -= c, r.change -= i - c; | ||
} | ||
}; | ||
const nextLContour = w => { | ||
return w.hasChildren ? w.firstChild : w.lThr; | ||
}; | ||
const nextRContour = w => { | ||
return w.hasChildren ? w.lastChild : w.rThr; | ||
}; | ||
const setLThr = (w, i, lContour, lSumMods) => { | ||
const firstChild = w.firstChild; | ||
const lExt = firstChild.lExt; | ||
const curSubtree = w.children[i]; | ||
lExt.lThr = lContour; | ||
// Change relX so that the sum of modifier after following thread is correct. | ||
const diff = lSumMods - lContour.relX - firstChild.lExtRelX; | ||
lExt.relX += diff; | ||
// Change preliminary x coordinate so that the node does not move. | ||
lExt.prelim -= diff; | ||
// Update extreme node and its sum of modifiers. | ||
firstChild.lExt = curSubtree.lExt; | ||
firstChild.lExtRelX = curSubtree.lExtRelX; | ||
}; | ||
// Mirror image of setLThr. | ||
const setRThr = (w, i, rContour, rSumMods) => { | ||
const curSubtree = w.children[i]; | ||
const rExt = curSubtree.rExt; | ||
const lSib = w.children[i - 1]; | ||
rExt.rThr = rContour; | ||
const diff = rSumMods - rContour.relX - curSubtree.rExtRelX; | ||
rExt.relX += diff; | ||
rExt.prelim -= diff; | ||
curSubtree.rExt = lSib.rExt; | ||
curSubtree.rExtRelX = lSib.rExtRelX; | ||
}; | ||
// Position root between children, taking into account their modifiers | ||
const positionRoot = w => { | ||
if (w.hasChildren) { | ||
const k0 = w.firstChild; | ||
const kf = w.lastChild; | ||
const prelim = (k0.prelim + k0.relX - k0.xSize / 2 + kf.relX + kf.prelim + kf.xSize / 2) / 2; | ||
Object.assign(w, { | ||
prelim, | ||
lExt: k0.lExt, | ||
lExtRelX: k0.lExtRelX, | ||
rExt: kf.rExt, | ||
rExtRelX: kf.rExtRelX | ||
}, ce = (e) => e.hasChildren ? e.firstChild : e.lThr, he = (e) => e.hasChildren ? e.lastChild : e.rThr, de = (e, t, n, i) => { | ||
const r = e.firstChild, a = r.lExt, c = e.children[t]; | ||
a.lThr = n; | ||
const s = i - n.relX - r.lExtRelX; | ||
a.relX += s, a.prelim -= s, r.lExt = c.lExt, r.lExtRelX = c.lExtRelX; | ||
}, ue = (e, t, n, i) => { | ||
const r = e.children[t], a = r.rExt, c = e.children[t - 1]; | ||
a.rThr = n; | ||
const s = i - n.relX - r.rExtRelX; | ||
a.relX += s, a.prelim -= s, r.rExt = c.rExt, r.rExtRelX = c.rExtRelX; | ||
}, pe = (e) => { | ||
if (e.hasChildren) { | ||
const t = e.firstChild, n = e.lastChild, i = (t.prelim + t.relX - t.xSize / 2 + n.relX + n.prelim + n.xSize / 2) / 2; | ||
Object.assign(e, { | ||
prelim: i, | ||
lExt: t.lExt, | ||
lExtRelX: t.lExtRelX, | ||
rExt: n.rExt, | ||
rExtRelX: n.rExtRelX | ||
}); | ||
} | ||
}; | ||
// Make/maintain a linked list of the indexes of left siblings and their | ||
// lowest vertical coordinate. | ||
const updateLows = (lowY, index, lastLows) => { | ||
// Remove siblings that are hidden by the new subtree. | ||
while (lastLows !== null && lowY >= lastLows.lowY) lastLows = lastLows.next; | ||
// Prepend the new subtree. | ||
}, fe = (e, t, n) => { | ||
for (; n !== null && e >= n.lowY; ) | ||
n = n.next; | ||
return { | ||
lowY, | ||
index, | ||
next: lastLows | ||
lowY: e, | ||
index: t, | ||
next: n | ||
}; | ||
}; | ||
/*! @gera2ld/jsx-dom v2.2.2 | ISC License */ | ||
const VTYPE_ELEMENT = 1; | ||
const VTYPE_FUNCTION = 2; | ||
const SVG_NS = 'http://www.w3.org/2000/svg'; | ||
const XLINK_NS = 'http://www.w3.org/1999/xlink'; | ||
const NS_ATTRS = { | ||
show: XLINK_NS, | ||
actuate: XLINK_NS, | ||
href: XLINK_NS | ||
}; | ||
const isLeaf = c => typeof c === 'string' || typeof c === 'number'; | ||
const isElement = c => (c == null ? void 0 : c.vtype) === VTYPE_ELEMENT; | ||
const isRenderFunction = c => (c == null ? void 0 : c.vtype) === VTYPE_FUNCTION; | ||
function jsx(type, props) { | ||
let vtype; | ||
if (typeof type === 'string') vtype = VTYPE_ELEMENT;else if (typeof type === 'function') vtype = VTYPE_FUNCTION;else throw new Error('Invalid VNode type'); | ||
return { | ||
vtype, | ||
type, | ||
props | ||
}; | ||
}, nt = ".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{padding:.25em;font-size:calc(1em - 2px);color:#555;background-color:#f0f0f0;border-radius:2px}.markmap-foreign pre{margin:0}.markmap-foreign pre>code{display:block}.markmap-foreign del{text-decoration:line-through}.markmap-foreign em{font-style:italic}.markmap-foreign strong{font-weight:700}.markmap-foreign mark{background:#ffeaa7}", ge = ".markmap-container{position:absolute;width:0;height:0;top:-100px;left:-100px;overflow:hidden}.markmap-container>.markmap-foreign{display:inline-block}.markmap-container>.markmap-foreign>div:last-child,.markmap-container>.markmap-foreign>div:last-child :not(pre){white-space:nowrap}.markmap-container>.markmap-foreign>div:last-child code{white-space:inherit}", ze = nt; | ||
function Y(e) { | ||
const t = e.data; | ||
return Math.max(4 - 2 * t.depth, 1.5); | ||
} | ||
function Fragment(props) { | ||
return props.children; | ||
function K(e, t) { | ||
const n = ft(e, t); | ||
return e[n]; | ||
} | ||
const DEFAULT_ENV = { | ||
isSvg: false | ||
}; | ||
function insertDom(parent, nodes) { | ||
if (!Array.isArray(nodes)) nodes = [nodes]; | ||
nodes = nodes.filter(Boolean); | ||
if (nodes.length) parent.append(...nodes); | ||
} | ||
function mountAttributes(domElement, props, env) { | ||
for (const key in props) { | ||
if (key === 'key' || key === 'children' || key === 'ref') continue; | ||
if (key === 'dangerouslySetInnerHTML') { | ||
domElement.innerHTML = props[key].__html; | ||
} else if (key === 'innerHTML' || key === 'textContent' || key === 'innerText' || key === 'value' && ['textarea', 'select'].includes(domElement.tagName)) { | ||
const value = props[key]; | ||
if (value != null) domElement[key] = value; | ||
} else if (key.startsWith('on')) { | ||
domElement[key.toLowerCase()] = props[key]; | ||
} else { | ||
setDOMAttribute(domElement, key, props[key], env.isSvg); | ||
} | ||
} | ||
} | ||
const attrMap = { | ||
className: 'class', | ||
labelFor: 'for' | ||
}; | ||
function setDOMAttribute(el, attr, value, isSVG) { | ||
attr = attrMap[attr] || attr; | ||
if (value === true) { | ||
el.setAttribute(attr, ''); | ||
} else if (value === false) { | ||
el.removeAttribute(attr); | ||
} else { | ||
const namespace = isSVG ? NS_ATTRS[attr] : undefined; | ||
if (namespace !== undefined) { | ||
el.setAttributeNS(namespace, attr, value); | ||
} else { | ||
el.setAttribute(attr, value); | ||
} | ||
} | ||
} | ||
function flatten(arr) { | ||
return arr.reduce((prev, item) => prev.concat(item), []); | ||
} | ||
function mountChildren(children, env) { | ||
return Array.isArray(children) ? flatten(children.map(child => mountChildren(child, env))) : mount(children, env); | ||
} | ||
function mount(vnode, env = DEFAULT_ENV) { | ||
if (vnode == null || typeof vnode === 'boolean') { | ||
return null; | ||
} | ||
if (vnode instanceof Node) { | ||
return vnode; | ||
} | ||
if (isRenderFunction(vnode)) { | ||
const { | ||
type, | ||
props | ||
} = vnode; | ||
if (type === Fragment) { | ||
const node = document.createDocumentFragment(); | ||
if (props.children) { | ||
const children = mountChildren(props.children, env); | ||
insertDom(node, children); | ||
} | ||
return node; | ||
} | ||
const childVNode = type(props); | ||
return mount(childVNode, env); | ||
} | ||
if (isLeaf(vnode)) { | ||
return document.createTextNode(`${vnode}`); | ||
} | ||
if (isElement(vnode)) { | ||
let node; | ||
const { | ||
type, | ||
props | ||
} = vnode; | ||
if (!env.isSvg && type === 'svg') { | ||
env = Object.assign({}, env, { | ||
isSvg: true | ||
}); | ||
} | ||
if (!env.isSvg) { | ||
node = document.createElement(type); | ||
} else { | ||
node = document.createElementNS(SVG_NS, type); | ||
} | ||
mountAttributes(node, props, env); | ||
if (props.children) { | ||
let childEnv = env; | ||
if (env.isSvg && type === 'foreignObject') { | ||
childEnv = Object.assign({}, childEnv, { | ||
isSvg: false | ||
}); | ||
} | ||
const children = mountChildren(props.children, childEnv); | ||
if (children != null) insertDom(node, children); | ||
} | ||
const { | ||
ref | ||
} = props; | ||
if (typeof ref === 'function') ref(node); | ||
return node; | ||
} | ||
throw new Error('mount: Invalid Vnode!'); | ||
} | ||
/** | ||
* Mount vdom as real DOM nodes. | ||
*/ | ||
function mountDom(vnode) { | ||
return mount(vnode); | ||
} | ||
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);padding:.25em}.markmap-foreign pre{margin:0}.markmap-foreign pre>code{display:block}.markmap-foreign del{text-decoration:line-through}.markmap-foreign em{font-style:italic}.markmap-foreign strong{font-weight:700}.markmap-foreign mark{background:#ffeaa7}"; | ||
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,.markmap-container>.markmap-foreign>div:last-child *{white-space:nowrap}"; | ||
const globalCSS = css_248z$1; | ||
function linkWidth(nodeData) { | ||
const data = nodeData.data; | ||
return Math.max(4 - 2 * data.depth, 1.5); | ||
} | ||
function minBy(numbers, by) { | ||
const index = minIndex(numbers, by); | ||
return numbers[index]; | ||
} | ||
function stopPropagation(e) { | ||
function B(e) { | ||
e.stopPropagation(); | ||
} | ||
function createViewHooks() { | ||
function me() { | ||
return { | ||
transformHtml: new Hook() | ||
transformHtml: new U() | ||
}; | ||
} | ||
/** | ||
* A global hook to refresh all markmaps when called. | ||
*/ | ||
const refreshHook = new Hook(); | ||
const defaultColorFn = scaleOrdinal(schemeCategory10); | ||
const isMacintosh = typeof navigator !== 'undefined' && navigator.userAgent.includes('Macintosh'); | ||
class Markmap { | ||
constructor(svg, opts) { | ||
this.options = Markmap.defaultOptions; | ||
this.revokers = []; | ||
this.handleZoom = e => { | ||
const { | ||
transform | ||
} = e; | ||
this.g.attr('transform', transform); | ||
}; | ||
this.handlePan = e => { | ||
e.preventDefault(); | ||
const transform = zoomTransform(this.svg.node()); | ||
const newTransform = transform.translate(-e.deltaX / transform.k, -e.deltaY / transform.k); | ||
this.svg.call(this.zoom.transform, newTransform); | ||
}; | ||
this.handleClick = (e, d) => { | ||
let recursive = this.options.toggleRecursively; | ||
if (isMacintosh ? e.metaKey : e.ctrlKey) recursive = !recursive; | ||
this.toggleNode(d.data, recursive); | ||
}; | ||
this.viewHooks = createViewHooks(); | ||
this.svg = svg.datum ? svg : select(svg); | ||
this.styleNode = this.svg.append('style'); | ||
this.zoom = zoom().filter(event => { | ||
if (this.options.scrollForPan) { | ||
// Pan with wheels, zoom with ctrl+wheels | ||
if (event.type === 'wheel') return event.ctrlKey && !event.button; | ||
} | ||
return (!event.ctrlKey || event.type === 'wheel') && !event.button; | ||
}).on('zoom', this.handleZoom); | ||
this.setOptions(opts); | ||
this.state = { | ||
id: this.options.id || this.svg.attr('id') || getId(), | ||
const xe = new U(), ye = G(ct), P = typeof navigator < "u" && navigator.userAgent.includes("Macintosh"), C = class C { | ||
constructor(t, n) { | ||
this.options = C.defaultOptions, this.revokers = [], this.handleZoom = (i) => { | ||
const { transform: r } = i; | ||
this.g.attr("transform", r); | ||
}, this.handlePan = (i) => { | ||
i.preventDefault(); | ||
const r = O(this.svg.node()), a = r.translate( | ||
-i.deltaX / r.k, | ||
-i.deltaY / r.k | ||
); | ||
this.svg.call(this.zoom.transform, a); | ||
}, this.handleClick = (i, r) => { | ||
let a = this.options.toggleRecursively; | ||
(P ? i.metaKey : i.ctrlKey) && (a = !a), this.toggleNode(r.data, a); | ||
}, this.viewHooks = me(), this.svg = t.datum ? t : ht(t), this.styleNode = this.svg.append("style"), this.zoom = dt().filter((i) => this.options.scrollForPan && i.type === "wheel" ? i.ctrlKey && !i.button : (!i.ctrlKey || i.type === "wheel") && !i.button).on("zoom", this.handleZoom), this.setOptions(n), this.state = { | ||
id: this.options.id || this.svg.attr("id") || at(), | ||
minX: 0, | ||
@@ -900,255 +596,211 @@ maxX: 0, | ||
maxY: 0 | ||
}; | ||
this.g = this.svg.append('g'); | ||
this.revokers.push(refreshHook.tap(() => { | ||
this.setData(); | ||
})); | ||
}, this.g = this.svg.append("g"), this.revokers.push( | ||
xe.tap(() => { | ||
this.setData(); | ||
}) | ||
); | ||
} | ||
getStyleContent() { | ||
const { | ||
style | ||
} = this.options; | ||
const { | ||
id | ||
} = this.state; | ||
const styleText = typeof style === 'function' ? style(id) : ''; | ||
return [this.options.embedGlobalCSS && css_248z$1, styleText].filter(Boolean).join('\n'); | ||
const { style: t } = this.options, { id: n } = this.state, i = typeof t == "function" ? t(n) : ""; | ||
return [this.options.embedGlobalCSS && nt, i].filter(Boolean).join(` | ||
`); | ||
} | ||
updateStyle() { | ||
this.svg.attr('class', addClass(this.svg.attr('class'), 'markmap', this.state.id)); | ||
const style = this.getStyleContent(); | ||
this.styleNode.text(style); | ||
this.svg.attr( | ||
"class", | ||
lt(this.svg.attr("class"), "markmap", this.state.id) | ||
); | ||
const t = this.getStyleContent(); | ||
this.styleNode.text(t); | ||
} | ||
toggleNode(data, recursive = false) { | ||
var _data$payload; | ||
const fold = (_data$payload = data.payload) != null && _data$payload.fold ? 0 : 1; | ||
if (recursive) { | ||
// recursively | ||
walkTree(data, (item, next) => { | ||
item.payload = _extends({}, item.payload, { | ||
fold | ||
}); | ||
next(); | ||
}); | ||
} else { | ||
var _data$payload2; | ||
data.payload = _extends({}, data.payload, { | ||
fold: (_data$payload2 = data.payload) != null && _data$payload2.fold ? 0 : 1 | ||
}); | ||
} | ||
this.renderData(data); | ||
toggleNode(t, n = !1) { | ||
var r, a; | ||
const i = (r = t.payload) != null && r.fold ? 0 : 1; | ||
n ? M(t, (c, s) => { | ||
c.payload = { | ||
...c.payload, | ||
fold: i | ||
}, s(); | ||
}) : t.payload = { | ||
...t.payload, | ||
fold: (a = t.payload) != null && a.fold ? 0 : 1 | ||
}, this.renderData(t); | ||
} | ||
initializeData(node) { | ||
let nodeId = 0; | ||
const { | ||
color, | ||
nodeMinHeight, | ||
maxWidth, | ||
initialExpandLevel | ||
} = this.options; | ||
const { | ||
id | ||
} = this.state; | ||
const container = mountDom(jsx("div", { | ||
className: `markmap-container markmap ${id}-g` | ||
})); | ||
const style = mountDom(jsx("style", { | ||
children: [this.getStyleContent(), css_248z].join('\n') | ||
})); | ||
document.body.append(container, style); | ||
const groupStyle = maxWidth ? `max-width: ${maxWidth}px` : ''; | ||
let foldRecursively = 0; | ||
walkTree(node, (item, next, parent) => { | ||
var _item$children, _parent$state, _item$payload; | ||
item.children = (_item$children = item.children) == null ? void 0 : _item$children.map(child => _extends({}, child)); | ||
nodeId += 1; | ||
const group = mountDom(jsx("div", { | ||
className: "markmap-foreign", | ||
style: groupStyle, | ||
children: jsx("div", { | ||
dangerouslySetInnerHTML: { | ||
__html: item.content | ||
} | ||
}) | ||
})); | ||
container.append(group); | ||
item.state = _extends({}, item.state, { | ||
id: nodeId, | ||
el: group.firstChild | ||
}); | ||
item.state.path = [parent == null || (_parent$state = parent.state) == null ? void 0 : _parent$state.path, item.state.id].filter(Boolean).join('.'); | ||
color(item); // preload colors | ||
const isFoldRecursively = ((_item$payload = item.payload) == null ? void 0 : _item$payload.fold) === 2; | ||
if (isFoldRecursively) { | ||
foldRecursively += 1; | ||
} else if (foldRecursively || initialExpandLevel >= 0 && item.depth >= initialExpandLevel) { | ||
item.payload = _extends({}, item.payload, { | ||
fold: 1 | ||
}); | ||
} | ||
next(); | ||
if (isFoldRecursively) foldRecursively -= 1; | ||
initializeData(t) { | ||
let n = 0; | ||
const { color: i, nodeMinHeight: r, maxWidth: a, initialExpandLevel: c } = this.options, { id: s } = this.state, l = $( | ||
/* @__PURE__ */ N("div", { className: `markmap-container markmap ${s}-g` }) | ||
), f = $( | ||
/* @__PURE__ */ N("style", { children: [this.getStyleContent(), ge].join(` | ||
`) }) | ||
); | ||
document.body.append(l, f); | ||
const h = a ? `max-width: ${a}px` : ""; | ||
let p = 0; | ||
M(t, (d, S, x) => { | ||
var v, k, w; | ||
d.children = (v = d.children) == null ? void 0 : v.map((E) => ({ ...E })), n += 1; | ||
const g = $( | ||
/* @__PURE__ */ N("div", { className: "markmap-foreign", style: h, children: /* @__PURE__ */ N("div", { dangerouslySetInnerHTML: { __html: d.content } }) }) | ||
); | ||
l.append(g), d.state = { | ||
...d.state, | ||
id: n, | ||
el: g.firstChild | ||
}, d.state.path = [(k = x == null ? void 0 : x.state) == null ? void 0 : k.path, d.state.id].filter(Boolean).join("."), i(d); | ||
const y = ((w = d.payload) == null ? void 0 : w.fold) === 2; | ||
y ? p += 1 : (p || c >= 0 && d.depth >= c) && (d.payload = { ...d.payload, fold: 1 }), S(), y && (p -= 1); | ||
}); | ||
const nodes = Array.from(container.childNodes).map(group => group.firstChild); | ||
this.viewHooks.transformHtml.call(this, nodes); | ||
// Clone the rendered HTML and set `white-space: nowrap` to it to detect its max-width. | ||
// The parent node will have a width of the max-width and the original content without | ||
// `white-space: nowrap` gets re-layouted, then we will get the expected layout, with | ||
// content in one line as much as possible, and subjecting to the given max-width. | ||
nodes.forEach(node => { | ||
var _node$parentNode; | ||
(_node$parentNode = node.parentNode) == null || _node$parentNode.append(node.cloneNode(true)); | ||
}); | ||
walkTree(node, (item, next, parent) => { | ||
var _parent$state2; | ||
const state = item.state; | ||
const rect = state.el.getBoundingClientRect(); | ||
item.content = state.el.innerHTML; | ||
state.size = [Math.ceil(rect.width) + 1, Math.max(Math.ceil(rect.height), nodeMinHeight)]; | ||
state.key = [parent == null || (_parent$state2 = parent.state) == null ? void 0 : _parent$state2.id, state.id].filter(Boolean).join('.') + | ||
// FIXME: find a way to check content hash | ||
item.content; | ||
next(); | ||
}); | ||
container.remove(); | ||
style.remove(); | ||
const m = Array.from(l.childNodes).map( | ||
(d) => d.firstChild | ||
); | ||
this.viewHooks.transformHtml.call(this, m), m.forEach((d) => { | ||
var S; | ||
(S = d.parentNode) == null || S.append(d.cloneNode(!0)); | ||
}), M(t, (d, S, x) => { | ||
var v; | ||
const g = d.state, y = g.el.getBoundingClientRect(); | ||
d.content = g.el.innerHTML, g.size = [ | ||
Math.ceil(y.width) + 1, | ||
Math.max(Math.ceil(y.height), r) | ||
], g.key = [(v = x == null ? void 0 : x.state) == null ? void 0 : v.id, g.id].filter(Boolean).join(".") + // FIXME: find a way to check content hash | ||
d.content, S(); | ||
}), l.remove(), f.remove(); | ||
} | ||
setOptions(opts) { | ||
this.options = _extends({}, this.options, opts); | ||
if (this.options.zoom) { | ||
this.svg.call(this.zoom); | ||
} else { | ||
this.svg.on('.zoom', null); | ||
} | ||
if (this.options.pan) { | ||
this.svg.on('wheel', this.handlePan); | ||
} else { | ||
this.svg.on('wheel', null); | ||
} | ||
setOptions(t) { | ||
this.options = { | ||
...this.options, | ||
...t | ||
}, this.options.zoom ? this.svg.call(this.zoom) : this.svg.on(".zoom", null), this.options.pan ? this.svg.on("wheel", this.handlePan) : this.svg.on("wheel", null); | ||
} | ||
setData(data, opts) { | ||
if (opts) this.setOptions(opts); | ||
if (data) this.state.data = data; | ||
if (!this.state.data) return; | ||
this.initializeData(this.state.data); | ||
this.updateStyle(); | ||
this.renderData(); | ||
setData(t, n) { | ||
n && this.setOptions(n), t && (this.state.data = t), this.state.data && (this.initializeData(this.state.data), this.updateStyle(), this.renderData()); | ||
} | ||
renderData(originData) { | ||
var _origin$data$state$x, _origin$data$state$y; | ||
if (!this.state.data) return; | ||
const { | ||
spacingHorizontal, | ||
paddingX, | ||
spacingVertical, | ||
autoFit, | ||
color | ||
} = this.options; | ||
const layout = flextree({}).children(d => { | ||
var _d$payload; | ||
if (!((_d$payload = d.payload) != null && _d$payload.fold)) return d.children; | ||
}).nodeSize(node => { | ||
const [width, height] = node.data.state.size; | ||
return [height, width + (width ? paddingX * 2 : 0) + spacingHorizontal]; | ||
}).spacing((a, b) => { | ||
return a.parent === b.parent ? spacingVertical : spacingVertical * 2; | ||
}); | ||
const tree = layout.hierarchy(this.state.data); | ||
layout(tree); | ||
const descendants = tree.descendants().reverse(); | ||
const links = tree.links(); | ||
const linkShape = linkHorizontal(); | ||
const minX = min(descendants, d => d.x - d.xSize / 2); | ||
const maxX = max(descendants, d => d.x + d.xSize / 2); | ||
const minY = min(descendants, d => d.y); | ||
const maxY = max(descendants, d => d.y + d.ySize - spacingHorizontal); | ||
renderData(t) { | ||
if (!this.state.data) | ||
return; | ||
const { spacingHorizontal: n, paddingX: i, spacingVertical: r, autoFit: a, color: c } = this.options, s = Q({}).children((o) => { | ||
var u; | ||
if (!((u = o.payload) != null && u.fold)) | ||
return o.children; | ||
}).nodeSize((o) => { | ||
const [u, z] = o.data.state.size; | ||
return [z, u + (u ? i * 2 : 0) + n]; | ||
}).spacing((o, u) => o.parent === u.parent ? r : r * 2), l = s.hierarchy(this.state.data); | ||
s(l); | ||
const f = l.descendants().reverse(), h = l.links(), p = ut(), m = I(f, (o) => o.x - o.xSize / 2), d = W(f, (o) => o.x + o.xSize / 2), S = I(f, (o) => o.y), x = W(f, (o) => o.y + o.ySize - n); | ||
Object.assign(this.state, { | ||
minX, | ||
maxX, | ||
minY, | ||
maxY | ||
minX: m, | ||
maxX: d, | ||
minY: S, | ||
maxY: x | ||
}), a && this.fit(); | ||
const g = t && f.find((o) => o.data === t) || l, y = g.data.state.x0 ?? g.x, v = g.data.state.y0 ?? g.y, k = this.g.selectAll( | ||
b("g") | ||
).data(f, (o) => o.data.state.key), w = k.enter().append("g").attr("data-depth", (o) => o.data.depth).attr("data-path", (o) => o.data.state.path).attr( | ||
"transform", | ||
(o) => `translate(${v + g.ySize - o.ySize},${y + g.xSize / 2 - o.xSize})` | ||
), E = this.transition(k.exit()); | ||
E.select("line").attr("x1", (o) => o.ySize - n).attr("x2", (o) => o.ySize - n), E.select("foreignObject").style("opacity", 0), E.attr( | ||
"transform", | ||
(o) => `translate(${g.y + g.ySize - o.ySize},${g.x + g.xSize / 2 - o.xSize})` | ||
).remove(); | ||
const X = k.merge(w).attr( | ||
"class", | ||
(o) => { | ||
var u; | ||
return ["markmap-node", ((u = o.data.payload) == null ? void 0 : u.fold) && "markmap-fold"].filter(Boolean).join(" "); | ||
} | ||
); | ||
this.transition(X).attr( | ||
"transform", | ||
(o) => `translate(${o.y},${o.x - o.xSize / 2})` | ||
); | ||
const it = X.selectAll( | ||
b("line") | ||
).data( | ||
(o) => [o], | ||
(o) => o.data.state.key | ||
).join( | ||
(o) => o.append("line").attr("x1", (u) => u.ySize - n).attr("x2", (u) => u.ySize - n), | ||
(o) => o, | ||
(o) => o.remove() | ||
); | ||
this.transition(it).attr("x1", -1).attr("x2", (o) => o.ySize - n + 2).attr("y1", (o) => o.xSize).attr("y2", (o) => o.xSize).attr("stroke", (o) => c(o.data)).attr("stroke-width", Y); | ||
const ot = X.selectAll( | ||
b("circle") | ||
).data( | ||
(o) => { | ||
var u; | ||
return (u = o.data.children) != null && u.length ? [o] : []; | ||
}, | ||
(o) => o.data.state.key | ||
).join( | ||
(o) => o.append("circle").attr("stroke-width", "1.5").attr("cx", (u) => u.ySize - n).attr("cy", (u) => u.xSize).attr("r", 0).on("click", (u, z) => this.handleClick(u, z)).on("mousedown", B), | ||
(o) => o, | ||
(o) => o.remove() | ||
); | ||
this.transition(ot).attr("r", 6).attr("cx", (o) => o.ySize - n).attr("cy", (o) => o.xSize).attr("stroke", (o) => c(o.data)).attr( | ||
"fill", | ||
(o) => { | ||
var u; | ||
return (u = o.data.payload) != null && u.fold && o.data.children ? c(o.data) : "#fff"; | ||
} | ||
); | ||
const rt = X.selectAll( | ||
b("foreignObject") | ||
).data( | ||
(o) => [o], | ||
(o) => o.data.state.key | ||
).join( | ||
(o) => { | ||
const u = o.append("foreignObject").attr("class", "markmap-foreign").attr("x", i).attr("y", 0).style("opacity", 0).on("mousedown", B).on("dblclick", B); | ||
return u.append("xhtml:div").select(function(T) { | ||
const j = T.data.state.el.cloneNode(!0); | ||
return this.replaceWith(j), j; | ||
}).attr("xmlns", "http://www.w3.org/1999/xhtml"), u; | ||
}, | ||
(o) => o, | ||
(o) => o.remove() | ||
).attr( | ||
"width", | ||
(o) => Math.max(0, o.ySize - n - i * 2) | ||
).attr("height", (o) => o.xSize); | ||
this.transition(rt).style("opacity", 1); | ||
const st = this.g.selectAll( | ||
b("path") | ||
).data(h, (o) => o.target.data.state.key).join( | ||
(o) => { | ||
const u = [ | ||
v + g.ySize - n, | ||
y + g.xSize / 2 | ||
]; | ||
return o.insert("path", "g").attr("class", "markmap-link").attr("data-depth", (z) => z.target.data.depth).attr("data-path", (z) => z.target.data.state.path).attr("d", p({ source: u, target: u })); | ||
}, | ||
(o) => o, | ||
(o) => { | ||
const u = [ | ||
g.y + g.ySize - n, | ||
g.x + g.xSize / 2 | ||
]; | ||
return this.transition(o).attr("d", p({ source: u, target: u })).remove(); | ||
} | ||
); | ||
this.transition(st).attr("stroke", (o) => c(o.target.data)).attr("stroke-width", (o) => Y(o.target)).attr("d", (o) => { | ||
const u = o.source, z = o.target, T = [ | ||
u.y + u.ySize - n, | ||
u.x + u.xSize / 2 | ||
], j = [ | ||
z.y, | ||
z.x + z.xSize / 2 | ||
]; | ||
return p({ source: T, target: j }); | ||
}), f.forEach((o) => { | ||
o.data.state.x0 = o.x, o.data.state.y0 = o.y; | ||
}); | ||
if (autoFit) this.fit(); | ||
const origin = originData && descendants.find(item => item.data === originData) || tree; | ||
const x0 = (_origin$data$state$x = origin.data.state.x0) != null ? _origin$data$state$x : origin.x; | ||
const y0 = (_origin$data$state$y = origin.data.state.y0) != null ? _origin$data$state$y : origin.y; | ||
// Update the nodes | ||
const node = this.g.selectAll(childSelector('g')).data(descendants, d => d.data.state.key); | ||
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.ySize - d.ySize},${x0 + origin.xSize / 2 - d.xSize})`); | ||
const nodeExit = this.transition(node.exit()); | ||
nodeExit.select('line').attr('x1', d => d.ySize - spacingHorizontal).attr('x2', d => d.ySize - spacingHorizontal); | ||
nodeExit.select('foreignObject').style('opacity', 0); | ||
nodeExit.attr('transform', d => `translate(${origin.y + origin.ySize - d.ySize},${origin.x + origin.xSize / 2 - d.xSize})`).remove(); | ||
const nodeMerge = node.merge(nodeEnter).attr('class', d => { | ||
var _d$data$payload; | ||
return ['markmap-node', ((_d$data$payload = d.data.payload) == null ? void 0 : _d$data$payload.fold) && 'markmap-fold'].filter(Boolean).join(' '); | ||
}); | ||
this.transition(nodeMerge).attr('transform', d => `translate(${d.y},${d.x - d.xSize / 2})`); | ||
// Update lines under the content | ||
const line = nodeMerge.selectAll(childSelector('line')).data(d => [d], d => d.data.state.key).join(enter => { | ||
return enter.append('line').attr('x1', d => d.ySize - spacingHorizontal).attr('x2', d => d.ySize - spacingHorizontal); | ||
}, update => update, exit => exit.remove()); | ||
this.transition(line).attr('x1', -1).attr('x2', d => d.ySize - spacingHorizontal + 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 | ||
const circle = nodeMerge.selectAll(childSelector('circle')).data(d => { | ||
var _d$data$children; | ||
return (_d$data$children = d.data.children) != null && _d$data$children.length ? [d] : []; | ||
}, d => d.data.state.key).join(enter => { | ||
return enter.append('circle').attr('stroke-width', '1.5').attr('cx', d => d.ySize - spacingHorizontal).attr('cy', d => d.xSize).attr('r', 0).on('click', (e, d) => this.handleClick(e, d)).on('mousedown', stopPropagation); | ||
}, update => update, exit => exit.remove()); | ||
this.transition(circle).attr('r', 6).attr('cx', d => d.ySize - spacingHorizontal).attr('cy', d => d.xSize).attr('stroke', d => color(d.data)).attr('fill', d => { | ||
var _d$data$payload2; | ||
return (_d$data$payload2 = d.data.payload) != null && _d$data$payload2.fold && d.data.children ? color(d.data) : '#fff'; | ||
}); | ||
const foreignObject = nodeMerge.selectAll(childSelector('foreignObject')).data(d => [d], d => d.data.state.key).join(enter => { | ||
const fo = enter.append('foreignObject').attr('class', 'markmap-foreign').attr('x', paddingX).attr('y', 0).style('opacity', 0).on('mousedown', stopPropagation).on('dblclick', stopPropagation); | ||
fo.append('xhtml:div').select(function select(d) { | ||
const clone = d.data.state.el.cloneNode(true); | ||
this.replaceWith(clone); | ||
return clone; | ||
}).attr('xmlns', 'http://www.w3.org/1999/xhtml'); | ||
return fo; | ||
}, update => update, exit => exit.remove()).attr('width', d => Math.max(0, d.ySize - spacingHorizontal - paddingX * 2)).attr('height', d => d.xSize); | ||
this.transition(foreignObject).style('opacity', 1); | ||
// Update the links | ||
const path = this.g.selectAll(childSelector('path')).data(links, d => d.target.data.state.key).join(enter => { | ||
const source = [y0 + origin.ySize - spacingHorizontal, x0 + origin.xSize / 2]; | ||
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({ | ||
source, | ||
target: source | ||
})); | ||
}, update => update, exit => { | ||
const source = [origin.y + origin.ySize - spacingHorizontal, origin.x + origin.xSize / 2]; | ||
return this.transition(exit).attr('d', linkShape({ | ||
source, | ||
target: source | ||
})).remove(); | ||
}); | ||
this.transition(path).attr('stroke', d => color(d.target.data)).attr('stroke-width', d => linkWidth(d.target)).attr('d', d => { | ||
const origSource = d.source; | ||
const origTarget = d.target; | ||
const source = [origSource.y + origSource.ySize - spacingHorizontal, origSource.x + origSource.xSize / 2]; | ||
const target = [origTarget.y, origTarget.x + origTarget.xSize / 2]; | ||
return linkShape({ | ||
source, | ||
target | ||
}); | ||
}); | ||
descendants.forEach(d => { | ||
d.data.state.x0 = d.x; | ||
d.data.state.y0 = d.y; | ||
}); | ||
} | ||
transition(sel) { | ||
const { | ||
duration | ||
} = this.options; | ||
return sel.transition().duration(duration); | ||
transition(t) { | ||
const { duration: n } = this.options; | ||
return t.transition().duration(n); | ||
} | ||
/** | ||
@@ -1158,99 +810,69 @@ * Fit the content to the viewport. | ||
async fit() { | ||
const svgNode = this.svg.node(); | ||
const { | ||
width: offsetWidth, | ||
height: offsetHeight | ||
} = svgNode.getBoundingClientRect(); | ||
const { | ||
fitRatio | ||
} = this.options; | ||
const { | ||
minX, | ||
maxX, | ||
minY, | ||
maxY | ||
} = this.state; | ||
const naturalWidth = maxY - minY; | ||
const naturalHeight = maxX - minX; | ||
const scale = Math.min(offsetWidth / naturalWidth * fitRatio, offsetHeight / naturalHeight * fitRatio, 2); | ||
const initialZoom = zoomIdentity.translate((offsetWidth - naturalWidth * scale) / 2 - minY * scale, (offsetHeight - naturalHeight * scale) / 2 - minX * scale).scale(scale); | ||
return this.transition(this.svg).call(this.zoom.transform, initialZoom).end().catch(noop); | ||
const t = this.svg.node(), { width: n, height: i } = t.getBoundingClientRect(), { fitRatio: r } = this.options, { minX: a, maxX: c, minY: s, maxY: l } = this.state, f = l - s, h = c - a, p = Math.min( | ||
n / f * r, | ||
i / h * r, | ||
2 | ||
), m = pt.translate( | ||
(n - f * p) / 2 - s * p, | ||
(i - h * p) / 2 - a * p | ||
).scale(p); | ||
return this.transition(this.svg).call(this.zoom.transform, m).end().catch(A); | ||
} | ||
/** | ||
* Pan the content to make the provided node visible in the viewport. | ||
*/ | ||
async ensureView(node, padding) { | ||
let itemData; | ||
this.g.selectAll(childSelector('g')).each(function walk(d) { | ||
if (d.data === node) { | ||
itemData = d; | ||
} | ||
}); | ||
if (!itemData) return; | ||
const svgNode = this.svg.node(); | ||
const { | ||
spacingHorizontal | ||
} = this.options; | ||
const relRect = svgNode.getBoundingClientRect(); | ||
const transform = zoomTransform(svgNode); | ||
const [left, right] = [itemData.y, itemData.y + itemData.ySize - spacingHorizontal + 2].map(x => x * transform.k + transform.x); | ||
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. | ||
const pd = _extends({ | ||
async ensureView(t, n) { | ||
let i; | ||
if (this.g.selectAll( | ||
b("g") | ||
).each(function(v) { | ||
v.data === t && (i = v); | ||
}), !i) | ||
return; | ||
const r = this.svg.node(), { spacingHorizontal: a } = this.options, c = r.getBoundingClientRect(), s = O(r), [l, f] = [ | ||
i.y, | ||
i.y + i.ySize - a + 2 | ||
].map((y) => y * s.k + s.x), [h, p] = [ | ||
i.x - i.xSize / 2, | ||
i.x + i.xSize / 2 | ||
].map((y) => y * s.k + s.y), m = { | ||
left: 0, | ||
right: 0, | ||
top: 0, | ||
bottom: 0 | ||
}, padding); | ||
const dxs = [pd.left - left, relRect.width - pd.right - right]; | ||
const dys = [pd.top - top, relRect.height - pd.bottom - bottom]; | ||
const dx = dxs[0] * dxs[1] > 0 ? minBy(dxs, Math.abs) / transform.k : 0; | ||
const dy = dys[0] * dys[1] > 0 ? minBy(dys, Math.abs) / transform.k : 0; | ||
if (dx || dy) { | ||
const newTransform = transform.translate(dx, dy); | ||
return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(noop); | ||
bottom: 0, | ||
...n | ||
}, d = [m.left - l, c.width - m.right - f], S = [m.top - h, c.height - m.bottom - p], x = d[0] * d[1] > 0 ? K(d, Math.abs) / s.k : 0, g = S[0] * S[1] > 0 ? K(S, Math.abs) / s.k : 0; | ||
if (x || g) { | ||
const y = s.translate(x, g); | ||
return this.transition(this.svg).call(this.zoom.transform, y).end().catch(A); | ||
} | ||
} | ||
/** | ||
* Scale content with it pinned at the center of the viewport. | ||
*/ | ||
async rescale(scale) { | ||
const svgNode = this.svg.node(); | ||
const { | ||
width: offsetWidth, | ||
height: offsetHeight | ||
} = svgNode.getBoundingClientRect(); | ||
const halfWidth = offsetWidth / 2; | ||
const halfHeight = offsetHeight / 2; | ||
const transform = zoomTransform(svgNode); | ||
const newTransform = transform.translate((halfWidth - transform.x) * (1 - scale) / transform.k, (halfHeight - transform.y) * (1 - scale) / transform.k).scale(scale); | ||
return this.transition(this.svg).call(this.zoom.transform, newTransform).end().catch(noop); | ||
async rescale(t) { | ||
const n = this.svg.node(), { width: i, height: r } = n.getBoundingClientRect(), a = i / 2, c = r / 2, s = O(n), l = s.translate( | ||
(a - s.x) * (1 - t) / s.k, | ||
(c - s.y) * (1 - t) / s.k | ||
).scale(t); | ||
return this.transition(this.svg).call(this.zoom.transform, l).end().catch(A); | ||
} | ||
destroy() { | ||
this.svg.on('.zoom', null); | ||
this.svg.html(null); | ||
this.revokers.forEach(fn => { | ||
fn(); | ||
this.svg.on(".zoom", null), this.svg.html(null), this.revokers.forEach((t) => { | ||
t(); | ||
}); | ||
} | ||
static create(svg, opts, data = null) { | ||
const mm = new Markmap(svg, opts); | ||
if (data) { | ||
mm.setData(data); | ||
mm.fit(); // always fit for the first render | ||
} | ||
return mm; | ||
static create(t, n, i = null) { | ||
const r = new C(t, n); | ||
return i && (r.setData(i), r.fit()), r; | ||
} | ||
} | ||
Markmap.defaultOptions = { | ||
autoFit: false, | ||
color: node => { | ||
var _node$state; | ||
return defaultColorFn(`${((_node$state = node.state) == null ? void 0 : _node$state.path) || ''}`); | ||
}; | ||
C.defaultOptions = { | ||
autoFit: !1, | ||
color: (t) => { | ||
var n; | ||
return ye(`${((n = t.state) == null ? void 0 : n.path) || ""}`); | ||
}, | ||
duration: 500, | ||
embedGlobalCSS: true, | ||
embedGlobalCSS: !0, | ||
fitRatio: 0.95, | ||
@@ -1260,48 +882,46 @@ maxWidth: 0, | ||
paddingX: 8, | ||
scrollForPan: isMacintosh, | ||
scrollForPan: P, | ||
spacingHorizontal: 80, | ||
spacingVertical: 5, | ||
initialExpandLevel: -1, | ||
zoom: true, | ||
pan: true, | ||
toggleRecursively: false | ||
zoom: !0, | ||
pan: !0, | ||
toggleRecursively: !1 | ||
}; | ||
function deriveOptions(jsonOptions) { | ||
const derivedOptions = {}; | ||
const options = _extends({}, jsonOptions); | ||
const { | ||
color, | ||
colorFreezeLevel | ||
} = options; | ||
if ((color == null ? void 0 : color.length) === 1) { | ||
const solidColor = color[0]; | ||
derivedOptions.color = () => solidColor; | ||
} else if (color != null && color.length) { | ||
const colorFn = scaleOrdinal(color); | ||
derivedOptions.color = node => colorFn(`${node.state.path}`); | ||
let F = C; | ||
function ke(e) { | ||
const t = {}, n = { ...e }, { color: i, colorFreezeLevel: r } = n; | ||
if ((i == null ? void 0 : i.length) === 1) { | ||
const s = i[0]; | ||
t.color = () => s; | ||
} else if (i != null && i.length) { | ||
const s = G(i); | ||
t.color = (l) => s(`${l.state.path}`); | ||
} | ||
if (colorFreezeLevel) { | ||
const color = derivedOptions.color || Markmap.defaultOptions.color; | ||
derivedOptions.color = node => { | ||
node = _extends({}, node, { | ||
state: _extends({}, node.state, { | ||
path: node.state.path.split('.').slice(0, colorFreezeLevel).join('.') | ||
}) | ||
}); | ||
return color(node); | ||
}; | ||
if (r) { | ||
const s = t.color || F.defaultOptions.color; | ||
t.color = (l) => (l = { | ||
...l, | ||
state: { | ||
...l.state, | ||
path: l.state.path.split(".").slice(0, r).join(".") | ||
} | ||
}, s(l)); | ||
} | ||
const numberKeys = ['duration', 'maxWidth', 'initialExpandLevel']; | ||
numberKeys.forEach(key => { | ||
const value = options[key]; | ||
if (typeof value === 'number') derivedOptions[key] = value; | ||
}); | ||
const booleanKeys = ['zoom', 'pan']; | ||
booleanKeys.forEach(key => { | ||
const value = options[key]; | ||
if (value != null) derivedOptions[key] = !!value; | ||
}); | ||
return derivedOptions; | ||
return ["duration", "maxWidth", "initialExpandLevel"].forEach((s) => { | ||
const l = n[s]; | ||
typeof l == "number" && (t[s] = l); | ||
}), ["zoom", "pan"].forEach((s) => { | ||
const l = n[s]; | ||
l != null && (t[s] = !!l); | ||
}), t; | ||
} | ||
export { Markmap, defaultColorFn, deriveOptions, globalCSS, refreshHook }; | ||
export { | ||
F as Markmap, | ||
ye as defaultColorFn, | ||
ke as deriveOptions, | ||
ze as globalCSS, | ||
Ce as loadCSS, | ||
we as loadJS, | ||
xe as refreshHook | ||
}; |
{ | ||
"name": "markmap-view", | ||
"version": "0.15.5", | ||
"version": "0.15.6-alpha.4+4734119", | ||
"description": "View markmaps in browser", | ||
@@ -22,6 +22,5 @@ "author": "Gerald <gera2ld@live.com>", | ||
"scripts": { | ||
"dev": "rollup -wc", | ||
"clean": "del-cli dist types", | ||
"build:js": "rollup -c", | ||
"build:types": "tsc" | ||
"clean": "del-cli dist", | ||
"build:types": "tsc", | ||
"build:js": "vite build && TARGET=es vite build --emptyOutDir=false" | ||
}, | ||
@@ -37,6 +36,5 @@ "bugs": { | ||
"files": [ | ||
"dist", | ||
"types" | ||
"dist" | ||
], | ||
"typings": "types/index.d.ts", | ||
"typings": "dist/index.d.ts", | ||
"dependencies": { | ||
@@ -56,3 +54,3 @@ "@babel/runtime": "^7.22.6", | ||
}, | ||
"gitHead": "f7bda12b219cba3833dec1dae1daad14c3b53db6" | ||
"gitHead": "473411985496abcc20a546978438614c48ec56cf" | ||
} |
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Manifest confusion
Supply chain riskThis package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.
Found 1 instance in 1 package
58402
1087
3