New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

markmap-view

Package Overview
Dependencies
Maintainers
0
Versions
90
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

markmap-view - npm Package Compare versions

Comparing version 0.17.3-alpha.3 to 0.17.3-alpha.4

665

dist/browser/index.js

@@ -106,14 +106,14 @@ (function(exports, d32) {

/*! @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 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$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;
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 h(type, props, ...children) {

@@ -123,8 +123,8 @@ props = Object.assign({}, props, {

});
return jsx$1(type, props);
return jsx(type, props);
}
function jsx$1(type, props) {
function jsx(type, props) {
let vtype;
if (typeof type === "string") vtype = VTYPE_ELEMENT$1;
else if (typeof type === "function") vtype = VTYPE_FUNCTION$1;
if (typeof type === "string") vtype = VTYPE_ELEMENT;
else if (typeof type === "function") vtype = VTYPE_FUNCTION;
else throw new Error("Invalid VNode type");

@@ -137,9 +137,9 @@ return {

}
function Fragment$1(props) {
function Fragment(props) {
return props.children;
}
const DEFAULT_ENV$1 = {
const DEFAULT_ENV = {
isSvg: false
};
function insertDom$1(parent, nodes) {
function insertDom(parent, nodes) {
if (!Array.isArray(nodes)) nodes = [nodes];

@@ -149,3 +149,3 @@ nodes = nodes.filter(Boolean);

}
function mountAttributes$1(domElement, props, env) {
function mountAttributes(domElement, props, env) {
for (const key in props) {

@@ -161,12 +161,12 @@ if (key === "key" || key === "children" || key === "ref") continue;

} else {
setDOMAttribute$1(domElement, key, props[key], env.isSvg);
setDOMAttribute(domElement, key, props[key], env.isSvg);
}
}
}
const attrMap$1 = {
const attrMap = {
className: "class",
labelFor: "for"
};
function setDOMAttribute$1(el, attr, value, isSVG) {
attr = attrMap$1[attr] || attr;
function setDOMAttribute(el, attr, value, isSVG) {
attr = attrMap[attr] || attr;
if (value === true) {

@@ -177,3 +177,3 @@ el.setAttribute(attr, "");

} else {
const namespace = isSVG ? NS_ATTRS$1[attr] : void 0;
const namespace = isSVG ? NS_ATTRS[attr] : void 0;
if (namespace !== void 0) {

@@ -186,9 +186,9 @@ el.setAttributeNS(namespace, attr, value);

}
function flatten$1(arr) {
function flatten(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 mountChildren(children, env) {
return Array.isArray(children) ? flatten(children.map((child) => mountChildren(child, env))) : mount(children, env);
}
function mount$1(vnode, env = DEFAULT_ENV$1) {
function mount(vnode, env = DEFAULT_ENV) {
if (vnode == null || typeof vnode === "boolean") {

@@ -200,3 +200,3 @@ return null;

}
if (isRenderFunction$1(vnode)) {
if (isRenderFunction(vnode)) {
const {

@@ -206,7 +206,7 @@ type,

} = vnode;
if (type === Fragment$1) {
if (type === Fragment) {
const node = document.createDocumentFragment();
if (props.children) {
const children = mountChildren$1(props.children, env);
insertDom$1(node, children);
const children = mountChildren(props.children, env);
insertDom(node, children);
}

@@ -216,8 +216,8 @@ return node;

const childVNode = type(props);
return mount$1(childVNode, env);
return mount(childVNode, env);
}
if (isLeaf$1(vnode)) {
if (isLeaf(vnode)) {
return document.createTextNode(`${vnode}`);
}
if (isElement$1(vnode)) {
if (isElement(vnode)) {
let node;

@@ -236,5 +236,5 @@ const {

} else {
node = document.createElementNS(SVG_NS$1, type);
node = document.createElementNS(SVG_NS, type);
}
mountAttributes$1(node, props, env);
mountAttributes(node, props, env);
if (props.children) {

@@ -247,4 +247,4 @@ let childEnv = env;

}
const children = mountChildren$1(props.children, childEnv);
if (children != null) insertDom$1(node, children);
const children = mountChildren(props.children, childEnv);
if (children != null) insertDom(node, children);
}

@@ -259,7 +259,7 @@ const {

}
function mountDom$1(vnode) {
return mount$1(vnode);
function mountDom(vnode) {
return mount(vnode);
}
function hm(...args) {
return mountDom$1(h(...args));
return mountDom(h(...args));
}

@@ -422,141 +422,9 @@ const memoizedPreloadJS = memoize((url) => {

}
/*! @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);
}
function simpleHash(str) {
let hash = 0;
for (let i = 0; i < str.length; i++) {
hash = (hash << 5) - hash + str.charCodeAt(i) | 0;
}
return (hash >>> 0).toString(36);
}
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] : void 0;
if (namespace !== void 0) {
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!");
}
function mountDom(vnode) {
return mount(vnode);
}
function count(node) {

@@ -733,59 +601,11 @@ var sum = 0, children = node.children, i = children && children.length;

const module = "index";
const author = {
name: "Chris Maloney",
url: "http://chrismaloney.org"
};
const author = { "name": "Chris Maloney", "url": "http://chrismaloney.org" };
const description = "Flexible tree layout algorithm that allows for variable node sizes.";
const keywords = [
"d3",
"d3-module",
"layout",
"tree",
"hierarchy",
"d3-hierarchy",
"plugin",
"d3-plugin",
"infovis",
"visualization",
"2d"
];
const keywords = ["d3", "d3-module", "layout", "tree", "hierarchy", "d3-hierarchy", "plugin", "d3-plugin", "infovis", "visualization", "2d"];
const homepage = "https://github.com/klortho/d3-flextree";
const license = "WTFPL";
const repository = {
type: "git",
url: "https://github.com/klortho/d3-flextree.git"
};
const 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"
};
const dependencies = {
"d3-hierarchy": "^1.1.5"
};
const 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"
};
const repository = { "type": "git", "url": "https://github.com/klortho/d3-flextree.git" };
const 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" };
const dependencies = { "d3-hierarchy": "^1.1.5" };
const 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" };
const packageInfo = {

@@ -1140,7 +960,6 @@ name,

};
const containerCSS = "/* used for pre-rendering to get the size of each node */\n.markmap-container {\n position: absolute;\n width: 0;\n height: 0;\n top: -100px;\n left: -100px;\n overflow: hidden;\n}\n.markmap-container > .markmap-foreign {\n display: inline-block;\n }\n/* first-child for line wrapping, last-child for max-width detection */\n.markmap-container > .markmap-foreign > div:last-child,\n \n .markmap-container > .markmap-foreign > div:last-child :not(pre) {\n white-space: nowrap;\n }\n.markmap-container > .markmap-foreign > div:last-child code {\n white-space: inherit;\n }\n";
const css = "/* Note: wrap with `& { ... }` to preserve the orders, otherwise ungrouped CSS will be put in the end */\n .markmap {\n --markmap-max-width: none;\n --markmap-a-color: #0097e6;\n --markmap-a-hover-color: #00a8ff;\n --markmap-code-bg: #f0f0f0;\n --markmap-code-color: #555;\n --markmap-highlight-bg: #ffeaa7;\n --markmap-table-border: 1px solid currentColor;\n --markmap-font: 300 16px/20px sans-serif;\n --markmap-circle-open-bg: #fff;\n --markmap-text-color: #333;\n\n font: var(--markmap-font);\n color: var(--markmap-text-color);\n }\n .markmap-link {\n fill: none;\n }\n .markmap-node > circle {\n cursor: pointer;\n }\n .markmap-foreign {\n display: inline-block;\n }\n .markmap-foreign p {\n margin: 0;\n }\n .markmap-foreign a {\n color: var(--markmap-a-color);\n }\n .markmap-foreign a:hover {\n color: var(--markmap-a-hover-color);\n }\n .markmap-foreign code {\n padding: 0.25em;\n font-size: calc(1em - 2px);\n color: var(--markmap-code-color);\n background-color: var(--markmap-code-bg);\n border-radius: 2px;\n }\n .markmap-foreign pre {\n margin: 0;\n }\n .markmap-foreign pre > code {\n display: block;\n }\n .markmap-foreign del {\n text-decoration: line-through;\n }\n .markmap-foreign em {\n font-style: italic;\n }\n .markmap-foreign strong {\n font-weight: bold;\n }\n .markmap-foreign mark {\n background: var(--markmap-highlight-bg);\n }\n .markmap-foreign table,\n .markmap-foreign th,\n .markmap-foreign td {\n border-collapse: collapse;\n border: var(--markmap-table-border);\n }\n .markmap-foreign img {\n display: inline-block;\n }\n .markmap-foreign svg {\n fill: currentColor;\n }\n .markmap-foreign-testing-max {\n max-width: var(--markmap-max-width);\n }\n .markmap-foreign-testing-max img {\n max-width: var(--markmap-max-width);\n max-height: none;\n }\n @media (prefers-color-scheme: dark) {\n .markmap {\n --markmap-code-bg: #1a1b26;\n --markmap-code-color: #ddd;\n --markmap-circle-open-bg: #444;\n --markmap-text-color: #eee;\n }\n }\n";
const css = ".markmap {\n --markmap-max-width: 9999px;\n --markmap-a-color: #0097e6;\n --markmap-a-hover-color: #00a8ff;\n --markmap-code-bg: #f0f0f0;\n --markmap-code-color: #555;\n --markmap-highlight-bg: #ffeaa7;\n --markmap-table-border: 1px solid currentColor;\n --markmap-font: 300 16px/20px sans-serif;\n --markmap-circle-open-bg: #fff;\n --markmap-text-color: #333;\n\n font: var(--markmap-font);\n color: var(--markmap-text-color);\n}\n\n .markmap-link {\n fill: none;\n }\n\n .markmap-node > circle {\n cursor: pointer;\n }\n\n .markmap-foreign {\n display: inline-block;\n }\n\n .markmap-foreign p {\n margin: 0;\n }\n\n .markmap-foreign a {\n color: var(--markmap-a-color);\n }\n\n .markmap-foreign a:hover {\n color: var(--markmap-a-hover-color);\n }\n\n .markmap-foreign code {\n padding: 0.25em;\n font-size: calc(1em - 2px);\n color: var(--markmap-code-color);\n background-color: var(--markmap-code-bg);\n border-radius: 2px;\n }\n\n .markmap-foreign pre {\n margin: 0;\n }\n\n .markmap-foreign pre > code {\n display: block;\n }\n\n .markmap-foreign del {\n text-decoration: line-through;\n }\n\n .markmap-foreign em {\n font-style: italic;\n }\n\n .markmap-foreign strong {\n font-weight: bold;\n }\n\n .markmap-foreign mark {\n background: var(--markmap-highlight-bg);\n }\n\n .markmap-foreign table,\n .markmap-foreign th,\n .markmap-foreign td {\n border-collapse: collapse;\n border: var(--markmap-table-border);\n }\n\n .markmap-foreign img {\n display: inline-block;\n }\n\n .markmap-foreign svg {\n fill: currentColor;\n }\n\n .markmap-foreign > div {\n width: var(--markmap-max-width);\n }\n\n .markmap-foreign > div > div {\n display: inline-block;\n }\n\n.markmap-dark .markmap {\n --markmap-code-bg: #1a1b26;\n --markmap-code-color: #ddd;\n --markmap-circle-open-bg: #444;\n --markmap-text-color: #eee;\n}\n";
const globalCSS = css;
function linkWidth(nodeData) {
const data = nodeData.data;
const linkShape = d32.linkHorizontal();
function linkWidth(data) {
return Math.max(4 - 2 * data.state.depth, 1.5);

@@ -1160,3 +979,2 @@ }

this.revokers = [];
this.imgCache = {};
this.handleZoom = (e) => {

@@ -1178,3 +996,3 @@ const { transform } = e;

if (isMacintosh ? e.metaKey : e.ctrlKey) recursive = !recursive;
this.toggleNode(d.data, recursive);
this.toggleNode(d, recursive);
};

@@ -1192,9 +1010,10 @@ this.svg = svg.datum ? svg : d32.select(svg);

id: this.options.id || this.svg.attr("id") || getId(),
minX: 0,
maxX: 0,
minY: 0,
maxY: 0
rect: { x1: 0, y1: 0, x2: 0, y2: 0 }
};
this.g = this.svg.append("g");
this.debouncedRefresh = debounce(() => this.setData(), 200);
this.observer = new ResizeObserver(
debounce(() => {
this.renderData();
}, 100)
);
this.revokers.push(

@@ -1220,3 +1039,3 @@ refreshHook.tap(() => {

}
toggleNode(data, recursive = false) {
async toggleNode(data, recursive = false) {
var _a, _b;

@@ -1238,34 +1057,14 @@ const fold = ((_a = data.payload) == null ? void 0 : _a.fold) ? 0 : 1;

}
this.renderData(data);
await this.renderData(data);
}
initializeData(node) {
_initializeData(node) {
let nodeId = 0;
const { color, nodeMinHeight, maxWidth, initialExpandLevel } = this.options;
const { id } = this.state;
const container = mountDom(
/* @__PURE__ */ jsx("div", { className: `markmap-container markmap ${id}-g` })
);
const style = mountDom(
/* @__PURE__ */ jsx("style", { children: [this.getStyleContent(), containerCSS].join("\n") })
);
document.body.append(container, style);
const groupStyle = maxWidth ? `--markmap-max-width: ${maxWidth}px` : "";
const { color, initialExpandLevel } = this.options;
let foldRecursively = 0;
let depth = 0;
walkTree(node, (item, next, parent) => {
var _a, _b, _c;
var _a, _b, _c, _d;
depth += 1;
item.children = (_a = item.children) == null ? void 0 : _a.map((child) => ({ ...child }));
nodeId += 1;
const group = mountDom(
/* @__PURE__ */ jsx(
"div",
{
className: "markmap-foreign markmap-foreign-testing-max",
style: groupStyle,
children: /* @__PURE__ */ jsx("div", { dangerouslySetInnerHTML: { __html: item.content } })
}
)
);
container.append(group);
item.state = {

@@ -1275,7 +1074,14 @@ ...item.state,

id: nodeId,
el: group.firstChild
rect: {
x: 0,
y: 0,
width: 0,
height: 0
},
size: [0, 0]
};
item.state.path = [(_b = parent == null ? void 0 : parent.state) == null ? void 0 : _b.path, item.state.id].filter(Boolean).join(".");
item.state.key = [(_b = parent == null ? void 0 : parent.state) == null ? void 0 : _b.id, item.state.id].filter(Boolean).join(".") + simpleHash(item.content);
item.state.path = [(_c = parent == null ? void 0 : parent.state) == null ? void 0 : _c.path, item.state.id].filter(Boolean).join(".");
color(item);
const isFoldRecursively = ((_c = item.payload) == null ? void 0 : _c.fold) === 2;
const isFoldRecursively = ((_d = item.payload) == null ? void 0 : _d.fold) === 2;
if (isFoldRecursively) {

@@ -1290,44 +1096,46 @@ foldRecursively += 1;

});
const nodes = Array.from(container.childNodes).map(
(group) => group.firstChild
);
this._checkImages(container);
nodes.forEach((node2) => {
}
_relayout() {
if (!this.state.data) return;
this.g.selectAll(childSelector("g")).selectAll(
childSelector("foreignObject")
).each(function(d) {
var _a;
(_a = node2.parentNode) == null ? void 0 : _a.append(node2.cloneNode(true));
const el = (_a = this.firstChild) == null ? void 0 : _a.firstChild;
const newSize = [el.scrollWidth, el.scrollHeight];
d.state.size = newSize;
});
walkTree(node, (item, next, parent) => {
const { spacingHorizontal, paddingX, spacingVertical } = this.options;
const layout = flextree({}).children((d) => {
var _a;
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 = [(_a = parent == null ? void 0 : parent.state) == null ? void 0 : _a.id, state.id].filter(Boolean).join(".") + // FIXME: find a way to check content hash
item.content;
next();
if (!((_a = d.payload) == null ? void 0 : _a.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;
});
container.remove();
style.remove();
}
_checkImages(container) {
container.querySelectorAll("img").forEach((img) => {
if (img.width) return;
const size = this.imgCache[img.src];
if (size == null ? void 0 : size[0]) {
[img.width, img.height] = size;
} else if (!size) {
this._loadImage(img.src);
}
const tree = layout.hierarchy(this.state.data);
layout(tree);
const fnodes = tree.descendants();
fnodes.forEach((fnode) => {
const node = fnode.data;
node.state.rect = {
x: fnode.y,
y: fnode.x,
width: fnode.ySize - spacingHorizontal,
height: fnode.xSize
};
});
}
_loadImage(src) {
this.imgCache[src] = [0, 0];
const img = new Image();
img.src = src;
img.onload = () => {
this.imgCache[src] = [img.naturalWidth, img.naturalHeight];
this.debouncedRefresh();
this.state.rect = {
x1: d32.min(fnodes, (fnode) => fnode.data.state.rect.x) || 0,
y1: d32.min(fnodes, (fnode) => fnode.data.state.rect.y) || 0,
x2: d32.max(
fnodes,
(fnode) => fnode.data.state.rect.x + fnode.data.state.rect.width
) || 0,
y2: d32.max(
fnodes,
(fnode) => fnode.data.state.rect.y + fnode.data.state.rect.height
) || 0
};

@@ -1351,78 +1159,41 @@ }

}
setData(data, opts) {
async 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._initializeData(this.state.data);
this.updateStyle();
this.renderData();
await this.renderData();
}
renderData(originData) {
async renderData(originData) {
const { paddingX, autoFit, color, maxWidth } = this.options;
if (!this.state.data) return;
const { spacingHorizontal, paddingX, spacingVertical, autoFit, color } = this.options;
const layout = flextree({}).children((d) => {
const nodes = [];
walkTree(this.state.data, (item, next) => {
var _a;
if (!((_a = d.payload) == null ? void 0 : _a.fold)) return d.children;
}).nodeSize((node2) => {
const [width, height] = node2.data.state.size;
return [height, width + (width ? paddingX * 2 : 0) + spacingHorizontal];
}).spacing((a, b) => {
return a.parent === b.parent ? spacingVertical : spacingVertical * 2;
if (!((_a = item.payload) == null ? void 0 : _a.fold)) next();
nodes.push(item);
});
const tree = layout.hierarchy(this.state.data);
layout(tree);
const descendants = tree.descendants().reverse();
const links = tree.links();
const linkShape = d32.linkHorizontal();
const minX = d32.min(descendants, (d) => d.x - d.xSize / 2);
const maxX = d32.max(descendants, (d) => d.x + d.xSize / 2);
const minY = d32.min(descendants, (d) => d.y);
const maxY = d32.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.x0 ?? origin.x;
const y0 = origin.data.state.y0 ?? origin.y;
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.state.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(
const origin = originData || this.state.data;
const originRect = origin.state.rect;
const mmG = this.g.selectAll(childSelector("g")).data(nodes, (d) => d.state.key);
const mmGEnter = mmG.enter().append("g").attr("data-depth", (d) => d.state.depth).attr("data-path", (d) => d.state.path);
const mmGExit = mmG.exit();
const mmGMerge = mmG.merge(mmGEnter).attr(
"class",
(d) => {
var _a;
return ["markmap-node", ((_a = d.data.payload) == null ? void 0 : _a.fold) && "markmap-fold"].filter(Boolean).join(" ");
return ["markmap-node", ((_a = d.payload) == null ? void 0 : _a.fold) && "markmap-fold"].filter(Boolean).join(" ");
}
);
this.transition(nodeMerge).attr(
"transform",
(d) => `translate(${d.y},${d.x - d.xSize / 2})`
const mmLine = mmGMerge.selectAll(childSelector("line")).data(
(d) => [d],
(d) => d.state.key
);
const line = nodeMerge.selectAll(
const mmLineEnter = mmLine.enter().append("line");
const mmLineExit = mmGExit.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);
const circle = nodeMerge.selectAll(
const mmLineMerge = mmLine.merge(mmLineEnter);
const mmCircle = mmGMerge.selectAll(
childSelector("circle")

@@ -1432,8 +1203,8 @@ ).data(

var _a;
return ((_a = d.data.children) == null ? void 0 : _a.length) ? [d] : [];
return ((_a = d.children) == null ? void 0 : _a.length) ? [d] : [];
},
(d) => d.data.state.key
(d) => d.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);
return enter.append("circle").attr("stroke-width", "1.5").attr("r", 0).on("click", (e, d) => this.handleClick(e, d)).on("mousedown", stopPropagation);
},

@@ -1443,67 +1214,90 @@ (update) => update,

);
this.transition(circle).attr("r", 6).attr("cx", (d) => d.ySize - spacingHorizontal).attr("cy", (d) => d.xSize).attr("stroke", (d) => color(d.data)).attr(
const observer = this.observer;
const mmFo = mmGMerge.selectAll(childSelector("foreignObject")).data(
(d) => [d],
(d) => d.state.key
);
const mmFoEnter = mmFo.enter().append("foreignObject").attr("class", "markmap-foreign").attr("x", paddingX).attr("y", 0).style("opacity", 0).on("mousedown", stopPropagation).on("dblclick", stopPropagation);
mmFoEnter.append("xhtml:div").append("xhtml:div").html((d) => d.content).attr("xmlns", "http://www.w3.org/1999/xhtml");
mmFoEnter.each(function() {
var _a;
const el = (_a = this.firstChild) == null ? void 0 : _a.firstChild;
observer.observe(el);
});
const mmFoExit = mmGExit.selectAll(
childSelector("foreignObject")
);
mmFoExit.each(function() {
var _a;
const el = (_a = this.firstChild) == null ? void 0 : _a.firstChild;
observer.unobserve(el);
});
const mmFoMerge = mmFoEnter.merge(mmFo);
const links = nodes.flatMap(
(node) => {
var _a;
return ((_a = node.payload) == null ? void 0 : _a.fold) ? [] : node.children.map((child) => ({ source: node, target: child }));
}
);
const mmPath = this.g.selectAll(childSelector("path")).data(links, (d) => d.target.state.key);
const mmPathExit = mmPath.exit();
const mmPathEnter = mmPath.enter().insert("path", "g").attr("class", "markmap-link").attr("data-depth", (d) => d.target.state.depth).attr("data-path", (d) => d.target.state.path);
const mmPathMerge = mmPathEnter.merge(mmPath);
this.svg.style(
"--markmap-max-width",
maxWidth ? `${maxWidth}px` : null
);
await new Promise(requestAnimationFrame);
this._relayout();
this.transition(mmGExit).attr("transform", (d) => {
const targetX = originRect.x + originRect.width - d.state.rect.width;
const targetY = originRect.y + originRect.height / 2 - d.state.rect.height;
return `translate(${targetX},${targetY})`;
}).remove();
mmGEnter.attr(
"transform",
(d) => `translate(${originRect.x + originRect.width - d.state.rect.width},${originRect.y + originRect.height / 2 - d.state.rect.height})`
);
this.transition(mmGMerge).attr(
"transform",
(d) => `translate(${d.state.rect.x},${d.state.rect.y - d.state.rect.height / 2})`
);
this.transition(mmLineExit).attr("x1", (d) => d.state.rect.width).attr("x2", (d) => d.state.rect.width);
mmLineEnter.attr("x1", (d) => d.state.rect.width).attr("x2", (d) => d.state.rect.width);
mmLineMerge.attr("y1", (d) => d.state.rect.height).attr("y2", (d) => d.state.rect.height).attr("stroke", (d) => color(d));
this.transition(mmLineMerge).attr("x1", -1).attr("x2", (d) => d.state.rect.width + 2).attr("stroke-width", linkWidth);
mmCircle.attr("cx", (d) => d.state.rect.width).attr("cy", (d) => d.state.rect.height).attr("stroke", (d) => color(d)).attr(
"fill",
(d) => {
var _a;
return ((_a = d.data.payload) == null ? void 0 : _a.fold) && d.data.children ? color(d.data) : "var(--markmap-circle-open-bg)";
return ((_a = d.payload) == null ? void 0 : _a.fold) && d.children ? color(d) : "var(--markmap-circle-open-bg)";
}
);
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 select2(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);
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.state.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(mmCircle).attr("r", 6);
this.transition(mmFoExit).style("opacity", 0);
mmFoMerge.attr("width", (d) => Math.max(0, d.state.rect.width - paddingX * 2)).attr("height", (d) => d.state.rect.height);
this.transition(mmFoMerge).style("opacity", 1);
const pathOrigin = [
originRect.x + originRect.width,
originRect.y + originRect.height / 2
];
this.transition(mmPathExit).attr("d", linkShape({ source: pathOrigin, target: pathOrigin })).remove();
mmPathEnter.attr(
"d",
linkShape({ source: pathOrigin, target: pathOrigin })
);
this.transition(path).attr("stroke", (d) => color(d.target.data)).attr("stroke-width", (d) => linkWidth(d.target)).attr("d", (d) => {
this.transition(mmPathMerge).attr("stroke", (d) => color(d.target)).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
origSource.state.rect.x + origSource.state.rect.width,
origSource.state.rect.y + origSource.state.rect.height / 2
];
const target = [
origTarget.y,
origTarget.x + origTarget.xSize / 2
origTarget.state.rect.x,
origTarget.state.rect.y + origTarget.state.rect.height / 2
];
return linkShape({ source, target });
});
descendants.forEach((d) => {
d.data.state.x0 = d.x;
d.data.state.y0 = d.y;
});
if (autoFit) this.fit();
}

@@ -1521,5 +1315,5 @@ transition(sel) {

const { fitRatio } = this.options;
const { minX, maxX, minY, maxY } = this.state;
const naturalWidth = maxY - minY;
const naturalHeight = maxX - minX;
const { x1, y1, x2, y2 } = this.state.rect;
const naturalWidth = x2 - x1;
const naturalHeight = y2 - y1;
const scale = Math.min(

@@ -1531,4 +1325,4 @@ offsetWidth / naturalWidth * fitRatio,

const initialZoom = d32.zoomIdentity.translate(
(offsetWidth - naturalWidth * scale) / 2 - minY * scale,
(offsetHeight - naturalHeight * scale) / 2 - minX * scale
(offsetWidth - naturalWidth * scale) / 2 - x1 * scale,
(offsetHeight - naturalHeight * scale) / 2 - y1 * scale
).scale(scale);

@@ -1540,3 +1334,3 @@ return this.transition(this.svg).call(this.zoom.transform, initialZoom).end().catch(noop);

this.g.selectAll(childSelector("g")).each(function walk(d) {
if (d.data === node) {
if (d === node) {
result = {

@@ -1558,12 +1352,11 @@ data: d,

const svgNode = this.svg.node();
const { spacingHorizontal } = this.options;
const relRect = svgNode.getBoundingClientRect();
const transform = d32.zoomTransform(svgNode);
const [left, right] = [
itemData.y,
itemData.y + itemData.ySize - spacingHorizontal + 2
itemData.state.rect.x,
itemData.state.rect.x + itemData.state.rect.width + 2
].map((x) => x * transform.k + transform.x);
const [top, bottom] = [
itemData.x - itemData.xSize / 2,
itemData.x + itemData.xSize / 2
itemData.state.rect.y - itemData.state.rect.height / 2,
itemData.state.rect.y + itemData.state.rect.height / 2
].map((y) => y * transform.k + transform.y);

@@ -1611,4 +1404,3 @@ const pd = {

if (data) {
mm.setData(data);
requestAnimationFrame(() => {
mm.setData(data).then(() => {
mm.fit();

@@ -1629,3 +1421,4 @@ });

exports.refreshHook = refreshHook;
exports.simpleHash = simpleHash;
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
})(this.markmap = this.markmap || {}, d3);
import { IMarkmapOptions } from 'markmap-common';
export declare const isMacintosh: boolean;
export declare const defaultColorFn: import("d3-scale").ScaleOrdinal<string, string, never>;
export declare const defaultColorFn: import("d3").ScaleOrdinal<string, string, never>;
export declare const defaultOptions: IMarkmapOptions;

@@ -1,9 +0,9 @@

import { Hook as st, getId as at, debounce as lt, addClass as ct, walkTree as M, childSelector as C, noop as T } from "markmap-common";
import { loadCSS as Ce, loadJS as we } from "markmap-common";
import { scaleOrdinal as Y, schemeCategory10 as ht, zoomTransform as A, select as dt, zoom as ut, linkHorizontal as pt, min as H, max as I, zoomIdentity as mt, minIndex as ft } from "d3";
const K = typeof navigator < "u" && navigator.userAgent.includes("Macintosh"), gt = Y(ht), P = {
import { Hook as et, getId as nt, debounce as rt, addClass as it, walkTree as X, childSelector as b, noop as R } from "markmap-common";
import { loadCSS as ce, loadJS as he } from "markmap-common";
import { scaleOrdinal as N, schemeCategory10 as st, linkHorizontal as ot, zoomTransform as j, select as at, zoom as lt, min as T, max as _, zoomIdentity as ct, minIndex as ht } from "d3";
const P = typeof navigator < "u" && navigator.userAgent.includes("Macintosh"), dt = N(st), W = {
autoFit: !1,
color: (e) => {
var t;
return gt(`${((t = e.state) == null ? void 0 : t.path) || ""}`);
return dt(`${((t = e.state) == null ? void 0 : t.path) || ""}`);
},

@@ -17,3 +17,3 @@ duration: 500,

paddingX: 8,
scrollForPan: K,
scrollForPan: P,
spacingHorizontal: 80,

@@ -26,20 +26,20 @@ spacingVertical: 5,

};
function Se(e) {
const t = {}, n = { ...e }, { color: i, colorFreezeLevel: o } = n;
if ((i == null ? void 0 : i.length) === 1) {
const s = i[0];
t.color = () => s;
} else if (i != null && i.length) {
const s = Y(i);
t.color = (l) => s(`${l.state.path}`);
function se(e) {
const t = {}, n = { ...e }, { color: r, colorFreezeLevel: s } = n;
if ((r == null ? void 0 : r.length) === 1) {
const i = r[0];
t.color = () => i;
} else if (r != null && r.length) {
const i = N(r);
t.color = (a) => i(`${a.state.path}`);
}
if (o) {
const s = t.color || P.color;
t.color = (l) => (l = {
...l,
if (s) {
const i = t.color || W.color;
t.color = (a) => (a = {
...a,
state: {
...l.state,
path: l.state.path.split(".").slice(0, o).join(".")
...a.state,
path: a.state.path.split(".").slice(0, s).join(".")
}
}, s(l));
}, i(a));
}

@@ -56,154 +56,55 @@ return [

"spacingVertical"
].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);
].forEach((i) => {
const a = n[i];
typeof a == "number" && (t[i] = a);
}), ["zoom", "pan"].forEach((i) => {
const a = n[i];
a != null && (t[i] = !!a);
}), t;
}
/*! @gera2ld/jsx-dom v2.2.2 | ISC License */
const U = 1, G = 2, xt = "http://www.w3.org/2000/svg", _ = "http://www.w3.org/1999/xlink", yt = {
show: _,
actuate: _,
href: _
}, kt = (e) => typeof e == "string" || typeof e == "number", vt = (e) => (e == null ? void 0 : e.vtype) === U, St = (e) => (e == null ? void 0 : e.vtype) === G;
function j(e, t) {
let n;
if (typeof e == "string") n = U;
else if (typeof e == "function") n = G;
else throw new Error("Invalid VNode type");
return {
vtype: n,
type: e,
props: t
};
function pt(e) {
let t = 0;
for (let n = 0; n < e.length; n++)
t = (t << 5) - t + e.charCodeAt(n) | 0;
return (t >>> 0).toString(36);
}
function bt(e) {
return e.children;
}
const zt = {
isSvg: !1
};
function L(e, t) {
Array.isArray(t) || (t = [t]), t = t.filter(Boolean), t.length && e.append(...t);
}
function Et(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 o = t[i];
o != null && (e[i] = o);
} else i.startsWith("on") ? e[i.toLowerCase()] = t[i] : wt(e, i, t[i], n.isSvg);
}
const Ct = {
className: "class",
labelFor: "for"
};
function wt(e, t, n, i) {
if (t = Ct[t] || t, n === !0)
e.setAttribute(t, "");
else if (n === !1)
e.removeAttribute(t);
else {
const o = i ? yt[t] : void 0;
o !== void 0 ? e.setAttributeNS(o, t, n) : e.setAttribute(t, n);
}
}
function Xt(e) {
return e.reduce((t, n) => t.concat(n), []);
}
function $(e, t) {
return Array.isArray(e) ? Xt(e.map((n) => $(n, t))) : B(e, t);
}
function B(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 === bt) {
const a = document.createDocumentFragment();
if (i.children) {
const c = $(i.children, t);
L(a, c);
}
return a;
}
const o = n(i);
return B(o, t);
}
if (kt(e))
return document.createTextNode(`${e}`);
if (vt(e)) {
let n;
const {
type: i,
props: o
} = e;
if (!t.isSvg && i === "svg" && (t = Object.assign({}, t, {
isSvg: !0
})), t.isSvg ? n = document.createElementNS(xt, i) : n = document.createElement(i), Et(n, o, t), o.children) {
let c = t;
t.isSvg && i === "foreignObject" && (c = Object.assign({}, c, {
isSvg: !1
}));
const s = $(o.children, c);
s != null && L(n, s);
}
const {
ref: a
} = o;
return typeof a == "function" && a(n), n;
}
throw new Error("mount: Invalid Vnode!");
}
function O(e) {
return B(e);
}
function jt(e) {
var t = 0, n = e.children, i = n && n.length;
if (!i) t = 1;
else for (; --i >= 0; ) t += n[i].value;
function ut(e) {
var t = 0, n = e.children, r = n && n.length;
if (!r) t = 1;
else for (; --r >= 0; ) t += n[r].value;
e.value = t;
}
function Nt() {
return this.eachAfter(jt);
function mt() {
return this.eachAfter(ut);
}
function Rt(e) {
var t = this, n, i = [t], o, a, c;
function gt(e) {
var t = this, n, r = [t], s, l, c;
do
for (n = i.reverse(), i = []; t = n.pop(); )
if (e(t), o = t.children, o) for (a = 0, c = o.length; a < c; ++a)
i.push(o[a]);
while (i.length);
for (n = r.reverse(), r = []; t = n.pop(); )
if (e(t), s = t.children, s) for (l = 0, c = s.length; l < c; ++l)
r.push(s[l]);
while (r.length);
return this;
}
function Mt(e) {
for (var t = this, n = [t], i, o; t = n.pop(); )
if (e(t), i = t.children, i) for (o = i.length - 1; o >= 0; --o)
n.push(i[o]);
function ft(e) {
for (var t = this, n = [t], r, s; t = n.pop(); )
if (e(t), r = t.children, r) for (s = r.length - 1; s >= 0; --s)
n.push(r[s]);
return this;
}
function Tt(e) {
for (var t = this, n = [t], i = [], o, a, c; t = n.pop(); )
if (i.push(t), o = t.children, o) for (a = 0, c = o.length; a < c; ++a)
n.push(o[a]);
for (; t = i.pop(); )
function xt(e) {
for (var t = this, n = [t], r = [], s, l, c; t = n.pop(); )
if (r.push(t), s = t.children, s) for (l = 0, c = s.length; l < c; ++l)
n.push(s[l]);
for (; t = r.pop(); )
e(t);
return this;
}
function At(e) {
function yt(e) {
return this.eachAfter(function(t) {
for (var n = +e(t.data) || 0, i = t.children, o = i && i.length; --o >= 0; ) n += i[o].value;
for (var n = +e(t.data) || 0, r = t.children, s = r && r.length; --s >= 0; ) n += r[s].value;
t.value = n;
});
}
function _t(e) {
function kt(e) {
return this.eachBefore(function(t) {

@@ -213,17 +114,17 @@ t.children && t.children.sort(e);

}
function Ot(e) {
for (var t = this, n = Dt(t, e), i = [t]; t !== n; )
t = t.parent, i.push(t);
for (var o = i.length; e !== n; )
i.splice(o, 0, e), e = e.parent;
return i;
function vt(e) {
for (var t = this, n = bt(t, e), r = [t]; t !== n; )
t = t.parent, r.push(t);
for (var s = r.length; e !== n; )
r.splice(s, 0, e), e = e.parent;
return r;
}
function Dt(e, t) {
function bt(e, t) {
if (e === t) return e;
var n = e.ancestors(), i = t.ancestors(), o = null;
for (e = n.pop(), t = i.pop(); e === t; )
o = e, e = n.pop(), t = i.pop();
return o;
var n = e.ancestors(), r = t.ancestors(), s = null;
for (e = n.pop(), t = r.pop(); e === t; )
s = e, e = n.pop(), t = r.pop();
return s;
}
function $t() {
function zt() {
for (var e = this, t = [e]; e = e.parent; )

@@ -233,3 +134,3 @@ t.push(e);

}
function Bt() {
function St() {
var e = [];

@@ -240,3 +141,3 @@ return this.each(function(t) {

}
function Ft() {
function Et() {
var e = [];

@@ -247,3 +148,3 @@ return this.eachBefore(function(t) {

}
function Ht() {
function Ct() {
var e = this, t = [];

@@ -254,20 +155,20 @@ return e.each(function(n) {

}
function F(e, t) {
var n = new N(e), i = +e.value && (n.value = e.value), o, a = [n], c, s, l, p;
for (t == null && (t = Lt); o = a.pop(); )
if (i && (o.value = +o.data.value), (s = t(o.data)) && (p = s.length))
for (o.children = new Array(p), l = p - 1; l >= 0; --l)
a.push(c = o.children[l] = new N(s[l])), c.parent = o, c.depth = o.depth + 1;
return n.eachBefore(Vt);
function O(e, t) {
var n = new E(e), r = +e.value && (n.value = e.value), s, l = [n], c, i, a, d;
for (t == null && (t = Xt); s = l.pop(); )
if (r && (s.value = +s.data.value), (i = t(s.data)) && (d = i.length))
for (s.children = new Array(d), a = d - 1; a >= 0; --a)
l.push(c = s.children[a] = new E(i[a])), c.parent = s, c.depth = s.depth + 1;
return n.eachBefore(jt);
}
function It() {
return F(this).eachBefore(Wt);
function wt() {
return O(this).eachBefore(Rt);
}
function Lt(e) {
function Xt(e) {
return e.children;
}
function Wt(e) {
function Rt(e) {
e.data = e.data.data;
}
function Vt(e) {
function jt(e) {
var t = 0;

@@ -278,84 +179,36 @@ do

}
function N(e) {
function E(e) {
this.data = e, this.depth = this.height = 0, this.parent = null;
}
N.prototype = F.prototype = {
constructor: N,
count: Nt,
each: Rt,
eachAfter: Tt,
eachBefore: Mt,
sum: At,
sort: _t,
path: Ot,
ancestors: $t,
descendants: Bt,
leaves: Ft,
links: Ht,
copy: It
E.prototype = O.prototype = {
constructor: E,
count: mt,
each: gt,
eachAfter: xt,
eachBefore: ft,
sum: yt,
sort: kt,
path: vt,
ancestors: zt,
descendants: St,
leaves: Et,
links: Ct,
copy: wt
};
const Yt = "d3-flextree", Kt = "2.1.2", Pt = "build/d3-flextree.js", Ut = "index", Gt = {
name: "Chris Maloney",
url: "http://chrismaloney.org"
}, Zt = "Flexible tree layout algorithm that allows for variable node sizes.", qt = [
"d3",
"d3-module",
"layout",
"tree",
"hierarchy",
"d3-hierarchy",
"plugin",
"d3-plugin",
"infovis",
"visualization",
"2d"
], Jt = "https://github.com/klortho/d3-flextree", Qt = "WTFPL", te = {
type: "git",
url: "https://github.com/klortho/d3-flextree.git"
}, ee = {
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"
}, ne = {
"d3-hierarchy": "^1.1.5"
}, ie = {
"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"
}, re = {
name: Yt,
version: Kt,
main: Pt,
module: Ut,
const Mt = "d3-flextree", Bt = "2.1.2", Ot = "build/d3-flextree.js", $t = "index", At = { name: "Chris Maloney", url: "http://chrismaloney.org" }, Ft = "Flexible tree layout algorithm that allows for variable node sizes.", Dt = ["d3", "d3-module", "layout", "tree", "hierarchy", "d3-hierarchy", "plugin", "d3-plugin", "infovis", "visualization", "2d"], Tt = "https://github.com/klortho/d3-flextree", _t = "WTFPL", Ht = { type: "git", url: "https://github.com/klortho/d3-flextree.git" }, Lt = { 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" }, Nt = { "d3-hierarchy": "^1.1.5" }, Pt = { "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" }, Wt = {
name: Mt,
version: Bt,
main: Ot,
module: $t,
"jsnext:main": "index",
author: Gt,
description: Zt,
keywords: qt,
homepage: Jt,
license: Qt,
repository: te,
scripts: ee,
dependencies: ne,
devDependencies: ie
}, { version: oe } = re, se = Object.freeze({
author: At,
description: Ft,
keywords: Dt,
homepage: Tt,
license: _t,
repository: Ht,
scripts: Lt,
dependencies: Nt,
devDependencies: Pt
}, { version: It } = Wt, Kt = Object.freeze({
children: (e) => e.children,

@@ -365,15 +218,15 @@ nodeSize: (e) => e.data.size,

});
function q(e) {
const t = Object.assign({}, se, e);
function n(s) {
const l = t[s];
return typeof l == "function" ? l : () => l;
function K(e) {
const t = Object.assign({}, Kt, e);
function n(i) {
const a = t[i];
return typeof a == "function" ? a : () => a;
}
function i(s) {
const l = c(a(), s, (p) => p.children);
return l.update(), l.data;
function r(i) {
const a = c(l(), i, (d) => d.children);
return a.update(), a.data;
}
function o() {
const s = n("nodeSize"), l = n("spacing");
return class Z extends F.prototype.constructor {
function s() {
const i = n("nodeSize"), a = n("spacing");
return class I extends O.prototype.constructor {
constructor(h) {

@@ -383,10 +236,10 @@ super(h);

copy() {
const h = c(this.constructor, this, (u) => u.children);
return h.each((u) => u.data = u.data.data), h;
const h = c(this.constructor, this, (p) => p.children);
return h.each((p) => p.data = p.data.data), h;
}
get size() {
return s(this);
return i(this);
}
spacing(h) {
return l(this, h);
return a(this, h);
}

@@ -435,3 +288,3 @@ get nodes() {

return (this.children || []).reduce(
(h, u) => Z.maxExtents(h, u.extents),
(h, p) => I.maxExtents(h, p.extents),
this.nodeExtents

@@ -448,8 +301,8 @@ );

}
static maxExtents(h, u) {
static maxExtents(h, p) {
return {
top: Math.min(h.top, u.top),
bottom: Math.max(h.bottom, u.bottom),
left: Math.min(h.left, u.left),
right: Math.max(h.right, u.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)
};

@@ -459,5 +312,5 @@ }

}
function a() {
const s = o(), l = n("nodeSize"), p = n("spacing");
return class extends s {
function l() {
const i = s(), a = n("nodeSize"), d = n("spacing");
return class extends i {
constructor(h) {

@@ -480,6 +333,6 @@ super(h), Object.assign(this, {

get size() {
return l(this.data);
return a(this.data);
}
spacing(h) {
return p(this.data, h.data);
return d(this.data, h.data);
}

@@ -499,101 +352,101 @@ get x() {

update() {
return J(this), Q(this), this;
return G(this), U(this), this;
}
};
}
function c(s, l, p) {
const h = (u, g) => {
const x = new s(u);
Object.assign(x, {
parent: g,
depth: g === null ? 0 : g.depth + 1,
function c(i, a, d) {
const h = (p, u) => {
const g = new i(p);
Object.assign(g, {
parent: u,
depth: u === null ? 0 : u.depth + 1,
height: 0,
length: 1
});
const m = p(u) || [];
return x.children = m.length === 0 ? null : m.map((y) => h(y, x)), x.children && Object.assign(x, x.children.reduce(
(y, f) => ({
height: Math.max(y.height, f.height + 1),
length: y.length + f.length
const f = d(p) || [];
return g.children = f.length === 0 ? null : f.map((x) => h(x, g)), g.children && Object.assign(g, g.children.reduce(
(x, v) => ({
height: Math.max(x.height, v.height + 1),
length: x.length + v.length
}),
x
)), x;
g
)), g;
};
return h(l, null);
return h(a, null);
}
return Object.assign(i, {
nodeSize(s) {
return arguments.length ? (t.nodeSize = s, i) : t.nodeSize;
return Object.assign(r, {
nodeSize(i) {
return arguments.length ? (t.nodeSize = i, r) : t.nodeSize;
},
spacing(s) {
return arguments.length ? (t.spacing = s, i) : t.spacing;
spacing(i) {
return arguments.length ? (t.spacing = i, r) : t.spacing;
},
children(s) {
return arguments.length ? (t.children = s, i) : t.children;
children(i) {
return arguments.length ? (t.children = i, r) : t.children;
},
hierarchy(s, l) {
const p = typeof l > "u" ? t.children : l;
return c(o(), s, p);
hierarchy(i, a) {
const d = typeof a > "u" ? t.children : a;
return c(s(), i, d);
},
dump(s) {
const l = n("nodeSize"), p = (h) => (u) => {
const g = h + " ", x = h + " ", { x: m, y } = u, f = l(u), k = u.children || [], v = k.length === 0 ? " " : `,${g}children: [${x}${k.map(p(x)).join(x)}${g}],${h}`;
return `{ size: [${f.join(", ")}],${g}x: ${m}, y: ${y}${v}},`;
dump(i) {
const a = n("nodeSize"), d = (h) => (p) => {
const u = h + " ", g = h + " ", { x: f, y: x } = p, v = a(p), k = p.children || [], z = k.length === 0 ? " " : `,${u}children: [${g}${k.map(d(g)).join(g)}${u}],${h}`;
return `{ size: [${v.join(", ")}],${u}x: ${f}, y: ${x}${z}},`;
};
return p(`
`)(s);
return d(`
`)(i);
}
}), i;
}), r;
}
q.version = oe;
const J = (e, t = 0) => (e.y = t, (e.children || []).reduce((n, i) => {
const [o, a] = n;
J(i, e.y + e.ySize);
const c = (o === 0 ? i.lExt : i.rExt).bottom;
o !== 0 && le(e, o, a);
const s = ge(c, o, a);
return [o + 1, s];
}, [0, null]), ae(e), fe(e), e), Q = (e, t, n) => {
K.version = It;
const G = (e, t = 0) => (e.y = t, (e.children || []).reduce((n, r) => {
const [s, l] = n;
G(r, e.y + e.ySize);
const c = (s === 0 ? r.lExt : r.rExt).bottom;
s !== 0 && Ut(e, s, l);
const i = ee(c, s, l);
return [s + 1, i];
}, [0, null]), Gt(e), te(e), e), U = (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((o) => Q(o, i, e.x)), e;
}, ae = (e) => {
const r = t + e.relX;
return e.relX = r + e.prelim - n, e.prelim = 0, e.x = n + e.relX, (e.children || []).forEach((s) => U(s, r, e.x)), e;
}, Gt = (e) => {
(e.children || []).reduce((t, n) => {
const [i, o] = t, a = i + n.shift, c = o + a + n.change;
return n.relX += c, [a, c];
const [r, s] = t, l = r + n.shift, c = s + l + n.change;
return n.relX += c, [l, c];
}, [0, 0]);
}, le = (e, t, n) => {
const i = e.children[t - 1], o = e.children[t];
let a = i, c = i.relX, s = o, l = o.relX, p = !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 && p) && (l += h, ce(o, h), he(e, t, n.index, h)), p = !1;
const u = a.bottom, g = s.bottom;
u <= g && (a = ue(a), a && (c += a.relX)), u >= g && (s = de(s), s && (l += s.relX));
}, Ut = (e, t, n) => {
const r = e.children[t - 1], s = e.children[t];
let l = r, c = r.relX, i = s, a = s.relX, d = !0;
for (; l && i; ) {
l.bottom > n.lowY && (n = n.next);
const h = c + l.prelim - (a + i.prelim) + l.xSize / 2 + i.xSize / 2 + l.spacing(i);
(h > 0 || h < 0 && d) && (a += h, Vt(s, h), Yt(e, t, n.index, h)), d = !1;
const p = l.bottom, u = i.bottom;
p <= u && (l = qt(l), l && (c += l.relX)), p >= u && (i = Zt(i), i && (a += i.relX));
}
!a && s ? pe(e, t, s, l) : a && !s && me(e, t, a, c);
}, ce = (e, t) => {
!l && i ? Jt(e, t, i, a) : l && !i && Qt(e, t, l, c);
}, Vt = (e, t) => {
e.relX += t, e.lExtRelX += t, e.rExtRelX += t;
}, he = (e, t, n, i) => {
const o = e.children[t], a = t - n;
if (a > 1) {
const c = i / a;
e.children[n + 1].shift += c, o.shift -= c, o.change -= i - c;
}, Yt = (e, t, n, r) => {
const s = e.children[t], l = t - n;
if (l > 1) {
const c = r / l;
e.children[n + 1].shift += c, s.shift -= c, s.change -= r - c;
}
}, de = (e) => e.hasChildren ? e.firstChild : e.lThr, ue = (e) => e.hasChildren ? e.lastChild : e.rThr, pe = (e, t, n, i) => {
const o = e.firstChild, a = o.lExt, c = e.children[t];
a.lThr = n;
const s = i - n.relX - o.lExtRelX;
a.relX += s, a.prelim -= s, o.lExt = c.lExt, o.lExtRelX = c.lExtRelX;
}, me = (e, t, n, i) => {
const o = e.children[t], a = o.rExt, c = e.children[t - 1];
a.rThr = n;
const s = i - n.relX - o.rExtRelX;
a.relX += s, a.prelim -= s, o.rExt = c.rExt, o.rExtRelX = c.rExtRelX;
}, fe = (e) => {
}, Zt = (e) => e.hasChildren ? e.firstChild : e.lThr, qt = (e) => e.hasChildren ? e.lastChild : e.rThr, Jt = (e, t, n, r) => {
const s = e.firstChild, l = s.lExt, c = e.children[t];
l.lThr = n;
const i = r - n.relX - s.lExtRelX;
l.relX += i, l.prelim -= i, s.lExt = c.lExt, s.lExtRelX = c.lExtRelX;
}, Qt = (e, t, n, r) => {
const s = e.children[t], l = s.rExt, c = e.children[t - 1];
l.rThr = n;
const i = r - n.relX - s.rExtRelX;
l.relX += i, l.prelim -= i, s.rExt = c.rExt, s.rExtRelX = c.rExtRelX;
}, te = (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;
const t = e.firstChild, n = e.lastChild, r = (t.prelim + t.relX - t.xSize / 2 + n.relX + n.prelim + n.xSize / 2) / 2;
Object.assign(e, {
prelim: i,
prelim: r,
lExt: t.lExt,

@@ -605,3 +458,3 @@ lExtRelX: t.lExtRelX,

}
}, ge = (e, t, n) => {
}, ee = (e, t, n) => {
for (; n !== null && e >= n.lowY; )

@@ -614,38 +467,38 @@ n = n.next;

};
}, xe = ".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}", tt = ".markmap{--markmap-max-width: none;--markmap-a-color: #0097e6;--markmap-a-hover-color: #00a8ff;--markmap-code-bg: #f0f0f0;--markmap-code-color: #555;--markmap-highlight-bg: #ffeaa7;--markmap-table-border: 1px solid currentColor;--markmap-font: 300 16px/20px sans-serif;--markmap-circle-open-bg: #fff;--markmap-text-color: #333;font:var(--markmap-font);color:var(--markmap-text-color)}.markmap-link{fill:none}.markmap-node>circle{cursor:pointer}.markmap-foreign{display:inline-block}.markmap-foreign p{margin:0}.markmap-foreign a{color:var(--markmap-a-color)}.markmap-foreign a:hover{color:var(--markmap-a-hover-color)}.markmap-foreign code{padding:.25em;font-size:calc(1em - 2px);color:var(--markmap-code-color);background-color:var(--markmap-code-bg);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:var(--markmap-highlight-bg)}.markmap-foreign table,.markmap-foreign th,.markmap-foreign td{border-collapse:collapse;border:var(--markmap-table-border)}.markmap-foreign img{display:inline-block}.markmap-foreign svg{fill:currentColor}.markmap-foreign-testing-max{max-width:var(--markmap-max-width)}.markmap-foreign-testing-max img{max-width:var(--markmap-max-width);max-height:none}@media (prefers-color-scheme: dark){.markmap{--markmap-code-bg: #1a1b26;--markmap-code-color: #ddd;--markmap-circle-open-bg: #444;--markmap-text-color: #eee}}", be = tt;
function W(e) {
const t = e.data;
return Math.max(4 - 2 * t.state.depth, 1.5);
}, V = ".markmap{--markmap-max-width: 9999px;--markmap-a-color: #0097e6;--markmap-a-hover-color: #00a8ff;--markmap-code-bg: #f0f0f0;--markmap-code-color: #555;--markmap-highlight-bg: #ffeaa7;--markmap-table-border: 1px solid currentColor;--markmap-font: 300 16px/20px sans-serif;--markmap-circle-open-bg: #fff;--markmap-text-color: #333;font:var(--markmap-font);color:var(--markmap-text-color)}.markmap-link{fill:none}.markmap-node>circle{cursor:pointer}.markmap-foreign{display:inline-block}.markmap-foreign p{margin:0}.markmap-foreign a{color:var(--markmap-a-color)}.markmap-foreign a:hover{color:var(--markmap-a-hover-color)}.markmap-foreign code{padding:.25em;font-size:calc(1em - 2px);color:var(--markmap-code-color);background-color:var(--markmap-code-bg);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:var(--markmap-highlight-bg)}.markmap-foreign table,.markmap-foreign th,.markmap-foreign td{border-collapse:collapse;border:var(--markmap-table-border)}.markmap-foreign img{display:inline-block}.markmap-foreign svg{fill:currentColor}.markmap-foreign>div{width:var(--markmap-max-width)}.markmap-foreign>div>div{display:inline-block}.markmap-dark .markmap{--markmap-code-bg: #1a1b26;--markmap-code-color: #ddd;--markmap-circle-open-bg: #444;--markmap-text-color: #eee}", oe = V, M = ot();
function H(e) {
return Math.max(4 - 2 * e.state.depth, 1.5);
}
function V(e, t) {
const n = ft(e, t);
function L(e, t) {
const n = ht(e, t);
return e[n];
}
function D(e) {
function B(e) {
e.stopPropagation();
}
const ye = new st();
class et {
const ne = new et();
class Y {
constructor(t, n) {
this.options = P, this.revokers = [], this.imgCache = {}, this.handleZoom = (i) => {
const { transform: o } = i;
this.g.attr("transform", o);
}, this.handlePan = (i) => {
i.preventDefault();
const o = A(this.svg.node()), a = o.translate(
-i.deltaX / o.k,
-i.deltaY / o.k
this.options = W, this.revokers = [], this.handleZoom = (r) => {
const { transform: s } = r;
this.g.attr("transform", s);
}, this.handlePan = (r) => {
r.preventDefault();
const s = j(this.svg.node()), l = s.translate(
-r.deltaX / s.k,
-r.deltaY / s.k
);
this.svg.call(this.zoom.transform, a);
}, this.handleClick = (i, o) => {
let a = this.options.toggleRecursively;
(K ? i.metaKey : i.ctrlKey) && (a = !a), this.toggleNode(o.data, a);
}, this.svg = t.datum ? t : dt(t), this.styleNode = this.svg.append("style"), this.zoom = ut().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,
maxX: 0,
minY: 0,
maxY: 0
}, this.g = this.svg.append("g"), this.debouncedRefresh = lt(() => this.setData(), 200), this.revokers.push(
ye.tap(() => {
this.svg.call(this.zoom.transform, l);
}, this.handleClick = (r, s) => {
let l = this.options.toggleRecursively;
(P ? r.metaKey : r.ctrlKey) && (l = !l), this.toggleNode(s, l);
}, this.svg = t.datum ? t : at(t), this.styleNode = this.svg.append("style"), this.zoom = lt().filter((r) => this.options.scrollForPan && r.type === "wheel" ? r.ctrlKey && !r.button : (!r.ctrlKey || r.type === "wheel") && !r.button).on("zoom", this.handleZoom), this.setOptions(n), this.state = {
id: this.options.id || this.svg.attr("id") || nt(),
rect: { x1: 0, y1: 0, x2: 0, y2: 0 }
}, this.g = this.svg.append("g"), this.observer = new ResizeObserver(
rt(() => {
this.renderData();
}, 100)
), this.revokers.push(
ne.tap(() => {
this.setData();

@@ -656,4 +509,4 @@ })

getStyleContent() {
const { style: t } = this.options, { id: n } = this.state, i = typeof t == "function" ? t(n) : "";
return [this.options.embedGlobalCSS && tt, i].filter(Boolean).join(`
const { style: t } = this.options, { id: n } = this.state, r = typeof t == "function" ? t(n) : "";
return [this.options.embedGlobalCSS && V, r].filter(Boolean).join(`
`);

@@ -664,3 +517,3 @@ }

"class",
ct(this.svg.attr("class"), "markmap", this.state.id)
it(this.svg.attr("class"), "markmap", this.state.id)
);

@@ -670,76 +523,74 @@ const t = this.getStyleContent();

}
toggleNode(t, n = !1) {
var o, a;
const i = (o = t.payload) != null && o.fold ? 0 : 1;
n ? M(t, (c, s) => {
async toggleNode(t, n = !1) {
var s, l;
const r = (s = t.payload) != null && s.fold ? 0 : 1;
n ? X(t, (c, i) => {
c.payload = {
...c.payload,
fold: i
}, s();
fold: r
}, i();
}) : t.payload = {
...t.payload,
fold: (a = t.payload) != null && a.fold ? 0 : 1
}, this.renderData(t);
fold: (l = t.payload) != null && l.fold ? 0 : 1
}, await this.renderData(t);
}
initializeData(t) {
_initializeData(t) {
let n = 0;
const { color: i, nodeMinHeight: o, maxWidth: a, initialExpandLevel: c } = this.options, { id: s } = this.state, l = O(
/* @__PURE__ */ j("div", { className: `markmap-container markmap ${s}-g` })
), p = O(
/* @__PURE__ */ j("style", { children: [this.getStyleContent(), xe].join(`
`) })
);
document.body.append(l, p);
const h = a ? `--markmap-max-width: ${a}px` : "";
let u = 0, g = 0;
M(t, (m, y, f) => {
var b, w, z;
g += 1, m.children = (b = m.children) == null ? void 0 : b.map((E) => ({ ...E })), n += 1;
const k = O(
/* @__PURE__ */ j(
"div",
{
className: "markmap-foreign markmap-foreign-testing-max",
style: h,
children: /* @__PURE__ */ j("div", { dangerouslySetInnerHTML: { __html: m.content } })
}
)
);
l.append(k), m.state = {
...m.state,
depth: g,
const { color: r, initialExpandLevel: s } = this.options;
let l = 0, c = 0;
X(t, (i, a, d) => {
var p, u, g, f;
c += 1, i.children = (p = i.children) == null ? void 0 : p.map((x) => ({ ...x })), n += 1, i.state = {
...i.state,
depth: c,
id: n,
el: k.firstChild
}, m.state.path = [(w = f == null ? void 0 : f.state) == null ? void 0 : w.path, m.state.id].filter(Boolean).join("."), i(m);
const v = ((z = m.payload) == null ? void 0 : z.fold) === 2;
v ? u += 1 : (u || c >= 0 && m.state.depth >= c) && (m.payload = { ...m.payload, fold: 1 }), y(), v && (u -= 1), g -= 1;
rect: {
x: 0,
y: 0,
width: 0,
height: 0
},
size: [0, 0]
}, i.state.key = [(u = d == null ? void 0 : d.state) == null ? void 0 : u.id, i.state.id].filter(Boolean).join(".") + pt(i.content), i.state.path = [(g = d == null ? void 0 : d.state) == null ? void 0 : g.path, i.state.id].filter(Boolean).join("."), r(i);
const h = ((f = i.payload) == null ? void 0 : f.fold) === 2;
h ? l += 1 : (l || s >= 0 && i.state.depth >= s) && (i.payload = { ...i.payload, fold: 1 }), a(), h && (l -= 1), c -= 1;
});
const x = Array.from(l.childNodes).map(
(m) => m.firstChild
);
this._checkImages(l), x.forEach((m) => {
var y;
(y = m.parentNode) == null || y.append(m.cloneNode(!0));
}), M(t, (m, y, f) => {
var b;
const k = m.state, v = k.el.getBoundingClientRect();
m.content = k.el.innerHTML, k.size = [
Math.ceil(v.width) + 1,
Math.max(Math.ceil(v.height), o)
], k.key = [(b = f == null ? void 0 : f.state) == null ? void 0 : b.id, k.id].filter(Boolean).join(".") + // FIXME: find a way to check content hash
m.content, y();
}), l.remove(), p.remove();
}
_checkImages(t) {
t.querySelectorAll("img").forEach((n) => {
if (n.width) return;
const i = this.imgCache[n.src];
i != null && i[0] ? [n.width, n.height] = i : i || this._loadImage(n.src);
_relayout() {
if (!this.state.data) return;
this.g.selectAll(b("g")).selectAll(
b("foreignObject")
).each(function(i) {
var h;
const a = (h = this.firstChild) == null ? void 0 : h.firstChild, d = [a.scrollWidth, a.scrollHeight];
i.state.size = d;
});
}
_loadImage(t) {
this.imgCache[t] = [0, 0];
const n = new Image();
n.src = t, n.onload = () => {
this.imgCache[t] = [n.naturalWidth, n.naturalHeight], this.debouncedRefresh();
const { spacingHorizontal: t, paddingX: n, spacingVertical: r } = this.options, s = K({}).children((i) => {
var a;
if (!((a = i.payload) != null && a.fold)) return i.children;
}).nodeSize((i) => {
const [a, d] = i.data.state.size;
return [d, a + (a ? n * 2 : 0) + t];
}).spacing((i, a) => i.parent === a.parent ? r : r * 2), l = s.hierarchy(this.state.data);
s(l);
const c = l.descendants();
c.forEach((i) => {
const a = i.data;
a.state.rect = {
x: i.y,
y: i.x,
width: i.ySize - t,
height: i.xSize
};
}), this.state.rect = {
x1: T(c, (i) => i.data.state.rect.x) || 0,
y1: T(c, (i) => i.data.state.rect.y) || 0,
x2: _(
c,
(i) => i.data.state.rect.x + i.data.state.rect.width
) || 0,
y2: _(
c,
(i) => i.data.state.rect.y + i.data.state.rect.height
) || 0
};

@@ -753,123 +604,95 @@ }

}
setData(t, n) {
n && this.setOptions(n), t && (this.state.data = t), this.state.data && (this.initializeData(this.state.data), this.updateStyle(), this.renderData());
async setData(t, n) {
n && this.setOptions(n), t && (this.state.data = t), this.state.data && (this._initializeData(this.state.data), this.updateStyle(), await this.renderData());
}
renderData(t) {
async renderData(t) {
const { paddingX: n, autoFit: r, color: s, maxWidth: l } = this.options;
if (!this.state.data) return;
const { spacingHorizontal: n, paddingX: i, spacingVertical: o, autoFit: a, color: c } = this.options, s = q({}).children((r) => {
var d;
if (!((d = r.payload) != null && d.fold)) return r.children;
}).nodeSize((r) => {
const [d, S] = r.data.state.size;
return [S, d + (d ? i * 2 : 0) + n];
}).spacing((r, d) => r.parent === d.parent ? o : o * 2), l = s.hierarchy(this.state.data);
s(l);
const p = l.descendants().reverse(), h = l.links(), u = pt(), g = H(p, (r) => r.x - r.xSize / 2), x = I(p, (r) => r.x + r.xSize / 2), m = H(p, (r) => r.y), y = I(p, (r) => r.y + r.ySize - n);
Object.assign(this.state, {
minX: g,
maxX: x,
minY: m,
maxY: y
}), a && this.fit();
const f = t && p.find((r) => r.data === t) || l, k = f.data.state.x0 ?? f.x, v = f.data.state.y0 ?? f.y, b = this.g.selectAll(C("g")).data(p, (r) => r.data.state.key), w = b.enter().append("g").attr("data-depth", (r) => r.data.state.depth).attr("data-path", (r) => r.data.state.path).attr(
"transform",
(r) => `translate(${v + f.ySize - r.ySize},${k + f.xSize / 2 - r.xSize})`
), z = this.transition(b.exit());
z.select("line").attr("x1", (r) => r.ySize - n).attr("x2", (r) => r.ySize - n), z.select("foreignObject").style("opacity", 0), z.attr(
"transform",
(r) => `translate(${f.y + f.ySize - r.ySize},${f.x + f.xSize / 2 - r.xSize})`
).remove();
const E = b.merge(w).attr(
const c = [];
X(this.state.data, (o, m) => {
var y;
(y = o.payload) != null && y.fold || m(), c.push(o);
});
const a = (t || this.state.data).state.rect, d = this.g.selectAll(b("g")).data(c, (o) => o.state.key), h = d.enter().append("g").attr("data-depth", (o) => o.state.depth).attr("data-path", (o) => o.state.path), p = d.exit(), u = d.merge(h).attr(
"class",
(r) => {
var d;
return ["markmap-node", ((d = r.data.payload) == null ? void 0 : d.fold) && "markmap-fold"].filter(Boolean).join(" ");
(o) => {
var m;
return ["markmap-node", ((m = o.payload) == null ? void 0 : m.fold) && "markmap-fold"].filter(Boolean).join(" ");
}
);
this.transition(E).attr(
"transform",
(r) => `translate(${r.y},${r.x - r.xSize / 2})`
);
const nt = E.selectAll(
C("line")
), g = u.selectAll(b("line")).data(
(o) => [o],
(o) => o.state.key
), f = g.enter().append("line"), x = p.selectAll(
b("line")
), v = g.merge(f), k = u.selectAll(
b("circle")
).data(
(r) => [r],
(r) => r.data.state.key
).join(
(r) => r.append("line").attr("x1", (d) => d.ySize - n).attr("x2", (d) => d.ySize - n),
(r) => r,
(r) => r.remove()
);
this.transition(nt).attr("x1", -1).attr("x2", (r) => r.ySize - n + 2).attr("y1", (r) => r.xSize).attr("y2", (r) => r.xSize).attr("stroke", (r) => c(r.data)).attr("stroke-width", W);
const it = E.selectAll(
C("circle")
).data(
(r) => {
var d;
return (d = r.data.children) != null && d.length ? [r] : [];
(o) => {
var m;
return (m = o.children) != null && m.length ? [o] : [];
},
(r) => r.data.state.key
(o) => o.state.key
).join(
(r) => r.append("circle").attr("stroke-width", "1.5").attr("cx", (d) => d.ySize - n).attr("cy", (d) => d.xSize).attr("r", 0).on("click", (d, S) => this.handleClick(d, S)).on("mousedown", D),
(r) => r,
(r) => r.remove()
(o) => o.append("circle").attr("stroke-width", "1.5").attr("r", 0).on("click", (m, y) => this.handleClick(m, y)).on("mousedown", B),
(o) => o,
(o) => o.remove()
), z = this.observer, $ = u.selectAll(b("foreignObject")).data(
(o) => [o],
(o) => o.state.key
), C = $.enter().append("foreignObject").attr("class", "markmap-foreign").attr("x", n).attr("y", 0).style("opacity", 0).on("mousedown", B).on("dblclick", B);
C.append("xhtml:div").append("xhtml:div").html((o) => o.content).attr("xmlns", "http://www.w3.org/1999/xhtml"), C.each(function() {
var m;
const o = (m = this.firstChild) == null ? void 0 : m.firstChild;
z.observe(o);
});
const A = p.selectAll(
b("foreignObject")
);
this.transition(it).attr("r", 6).attr("cx", (r) => r.ySize - n).attr("cy", (r) => r.xSize).attr("stroke", (r) => c(r.data)).attr(
A.each(function() {
var m;
const o = (m = this.firstChild) == null ? void 0 : m.firstChild;
z.unobserve(o);
});
const F = C.merge($), Z = c.flatMap(
(o) => {
var m;
return (m = o.payload) != null && m.fold ? [] : o.children.map((y) => ({ source: o, target: y }));
}
), w = this.g.selectAll(b("path")).data(Z, (o) => o.target.state.key), q = w.exit(), D = w.enter().insert("path", "g").attr("class", "markmap-link").attr("data-depth", (o) => o.target.state.depth).attr("data-path", (o) => o.target.state.path), J = D.merge(w);
this.svg.style(
"--markmap-max-width",
l ? `${l}px` : null
), await new Promise(requestAnimationFrame), this._relayout(), this.transition(p).attr("transform", (o) => {
const m = a.x + a.width - o.state.rect.width, y = a.y + a.height / 2 - o.state.rect.height;
return `translate(${m},${y})`;
}).remove(), h.attr(
"transform",
(o) => `translate(${a.x + a.width - o.state.rect.width},${a.y + a.height / 2 - o.state.rect.height})`
), this.transition(u).attr(
"transform",
(o) => `translate(${o.state.rect.x},${o.state.rect.y - o.state.rect.height / 2})`
), this.transition(x).attr("x1", (o) => o.state.rect.width).attr("x2", (o) => o.state.rect.width), f.attr("x1", (o) => o.state.rect.width).attr("x2", (o) => o.state.rect.width), v.attr("y1", (o) => o.state.rect.height).attr("y2", (o) => o.state.rect.height).attr("stroke", (o) => s(o)), this.transition(v).attr("x1", -1).attr("x2", (o) => o.state.rect.width + 2).attr("stroke-width", H), k.attr("cx", (o) => o.state.rect.width).attr("cy", (o) => o.state.rect.height).attr("stroke", (o) => s(o)).attr(
"fill",
(r) => {
var d;
return (d = r.data.payload) != null && d.fold && r.data.children ? c(r.data) : "var(--markmap-circle-open-bg)";
(o) => {
var m;
return (m = o.payload) != null && m.fold && o.children ? s(o) : "var(--markmap-circle-open-bg)";
}
);
const rt = E.selectAll(
C("foreignObject")
).data(
(r) => [r],
(r) => r.data.state.key
).join(
(r) => {
const d = r.append("foreignObject").attr("class", "markmap-foreign").attr("x", i).attr("y", 0).style("opacity", 0).on("mousedown", D).on("dblclick", D);
return d.append("xhtml:div").select(function(R) {
const X = R.data.state.el.cloneNode(!0);
return this.replaceWith(X), X;
}).attr("xmlns", "http://www.w3.org/1999/xhtml"), d;
},
(r) => r,
(r) => r.remove()
).attr(
"width",
(r) => Math.max(0, r.ySize - n - i * 2)
).attr("height", (r) => r.xSize);
this.transition(rt).style("opacity", 1);
const ot = this.g.selectAll(
C("path")
).data(h, (r) => r.target.data.state.key).join(
(r) => {
const d = [
v + f.ySize - n,
k + f.xSize / 2
];
return r.insert("path", "g").attr("class", "markmap-link").attr("data-depth", (S) => S.target.data.state.depth).attr("data-path", (S) => S.target.data.state.path).attr("d", u({ source: d, target: d }));
},
(r) => r,
(r) => {
const d = [
f.y + f.ySize - n,
f.x + f.xSize / 2
];
return this.transition(r).attr("d", u({ source: d, target: d })).remove();
}
);
this.transition(ot).attr("stroke", (r) => c(r.target.data)).attr("stroke-width", (r) => W(r.target)).attr("d", (r) => {
const d = r.source, S = r.target, R = [
d.y + d.ySize - n,
d.x + d.xSize / 2
], X = [
S.y,
S.x + S.xSize / 2
), this.transition(k).attr("r", 6), this.transition(A).style("opacity", 0), F.attr("width", (o) => Math.max(0, o.state.rect.width - n * 2)).attr("height", (o) => o.state.rect.height), this.transition(F).style("opacity", 1);
const S = [
a.x + a.width,
a.y + a.height / 2
];
this.transition(q).attr("d", M({ source: S, target: S })).remove(), D.attr(
"d",
M({ source: S, target: S })
), this.transition(J).attr("stroke", (o) => s(o.target)).attr("stroke-width", (o) => H(o.target)).attr("d", (o) => {
const m = o.source, y = o.target, Q = [
m.state.rect.x + m.state.rect.width,
m.state.rect.y + m.state.rect.height / 2
], tt = [
y.state.rect.x,
y.state.rect.y + y.state.rect.height / 2
];
return u({ source: R, target: X });
}), p.forEach((r) => {
r.data.state.x0 = r.x, r.data.state.y0 = r.y;
});
return M({ source: Q, target: tt });
}), r && this.fit();
}

@@ -884,17 +707,17 @@ transition(t) {

async fit(t = this.options.maxInitialScale) {
const n = this.svg.node(), { width: i, height: o } = n.getBoundingClientRect(), { fitRatio: a } = this.options, { minX: c, maxX: s, minY: l, maxY: p } = this.state, h = p - l, u = s - c, g = Math.min(
i / h * a,
o / u * a,
const n = this.svg.node(), { width: r, height: s } = n.getBoundingClientRect(), { fitRatio: l } = this.options, { x1: c, y1: i, x2: a, y2: d } = this.state.rect, h = a - c, p = d - i, u = Math.min(
r / h * l,
s / p * l,
t
), x = mt.translate(
(i - h * g) / 2 - l * g,
(o - u * g) / 2 - c * g
).scale(g);
return this.transition(this.svg).call(this.zoom.transform, x).end().catch(T);
), g = ct.translate(
(r - h * u) / 2 - c * u,
(s - p * u) / 2 - i * u
).scale(u);
return this.transition(this.svg).call(this.zoom.transform, g).end().catch(R);
}
findElement(t) {
let n;
return this.g.selectAll(C("g")).each(function(o) {
o.data === t && (n = {
data: o,
return this.g.selectAll(b("g")).each(function(s) {
s === t && (n = {
data: s,
g: this

@@ -908,12 +731,12 @@ });

async ensureView(t, n) {
var k;
const i = (k = this.findElement(t)) == null ? void 0 : k.data;
if (!i) return;
const o = this.svg.node(), { spacingHorizontal: a } = this.options, c = o.getBoundingClientRect(), s = A(o), [l, p] = [
i.y,
i.y + i.ySize - a + 2
].map((v) => v * s.k + s.x), [h, u] = [
i.x - i.xSize / 2,
i.x + i.xSize / 2
].map((v) => v * s.k + s.y), g = {
var v;
const r = (v = this.findElement(t)) == null ? void 0 : v.data;
if (!r) return;
const s = this.svg.node(), l = s.getBoundingClientRect(), c = j(s), [i, a] = [
r.state.rect.x,
r.state.rect.x + r.state.rect.width + 2
].map((k) => k * c.k + c.x), [d, h] = [
r.state.rect.y - r.state.rect.height / 2,
r.state.rect.y + r.state.rect.height / 2
].map((k) => k * c.k + c.y), p = {
left: 0,

@@ -924,6 +747,6 @@ right: 0,

...n
}, x = [g.left - l, c.width - g.right - p], m = [g.top - h, c.height - g.bottom - u], y = x[0] * x[1] > 0 ? V(x, Math.abs) / s.k : 0, f = m[0] * m[1] > 0 ? V(m, Math.abs) / s.k : 0;
if (y || f) {
const v = s.translate(y, f);
return this.transition(this.svg).call(this.zoom.transform, v).end().catch(T);
}, u = [p.left - i, l.width - p.right - a], g = [p.top - d, l.height - p.bottom - h], f = u[0] * u[1] > 0 ? L(u, Math.abs) / c.k : 0, x = g[0] * g[1] > 0 ? L(g, Math.abs) / c.k : 0;
if (f || x) {
const k = c.translate(f, x);
return this.transition(this.svg).call(this.zoom.transform, k).end().catch(R);
}

@@ -935,7 +758,7 @@ }

async rescale(t) {
const n = this.svg.node(), { width: i, height: o } = n.getBoundingClientRect(), a = i / 2, c = o / 2, s = A(n), l = s.translate(
(a - s.x) * (1 - t) / s.k,
(c - s.y) * (1 - t) / s.k
const n = this.svg.node(), { width: r, height: s } = n.getBoundingClientRect(), l = r / 2, c = s / 2, i = j(n), a = i.translate(
(l - i.x) * (1 - t) / i.k,
(c - i.y) * (1 - t) / i.k
).scale(t);
return this.transition(this.svg).call(this.zoom.transform, l).end().catch(T);
return this.transition(this.svg).call(this.zoom.transform, a).end().catch(R);
}

@@ -947,19 +770,20 @@ destroy() {

}
static create(t, n, i = null) {
const o = new et(t, n);
return i && (o.setData(i), requestAnimationFrame(() => {
o.fit();
})), o;
static create(t, n, r = null) {
const s = new Y(t, n);
return r && s.setData(r).then(() => {
s.fit();
}), s;
}
}
export {
et as Markmap,
gt as defaultColorFn,
P as defaultOptions,
Se as deriveOptions,
be as globalCSS,
K as isMacintosh,
Ce as loadCSS,
we as loadJS,
ye as refreshHook
Y as Markmap,
dt as defaultColorFn,
W as defaultOptions,
se as deriveOptions,
oe as globalCSS,
P as isMacintosh,
ce as loadCSS,
he as loadJS,
ne as refreshHook,
pt as simpleHash
};

@@ -1,2 +0,1 @@

import { FlextreeNode } from 'd3-flextree';
import { INode } from 'markmap-common';

@@ -6,6 +5,8 @@ export interface IMarkmapState {

data?: INode;
minX: number;
maxX: number;
minY: number;
maxY: number;
rect: {
x1: number;
x2: number;
y1: number;
y2: number;
};
}

@@ -36,2 +37,2 @@ export type IMarkmapJSONOptions = Partial<{

}
export type ID3SVGElement = d3.Selection<SVGElement, FlextreeNode<INode>, HTMLElement, FlextreeNode<INode>>;
export type ID3SVGElement = d3.Selection<SVGElement, INode, HTMLElement, INode>;
import { IMarkmapOptions } from 'markmap-common';
import { IMarkmapJSONOptions } from './types';
export declare function deriveOptions(jsonOptions?: IMarkmapJSONOptions): Partial<IMarkmapOptions>;
/**
* Credit: https://gist.github.com/jlevy/c246006675becc446360a798e2b2d781?permalink_comment_id=4738050#gistcomment-4738050
*/
export declare function simpleHash(str: string): string;
import type * as d3 from 'd3';
import { FlextreeNode } from 'd3-flextree';
import { Hook, IMarkmapOptions, INode, IPureNode } from 'markmap-common';

@@ -14,8 +13,7 @@ import { ID3SVGElement, IMarkmapState, IPadding } from './types';

svg: ID3SVGElement;
styleNode: d3.Selection<HTMLStyleElement, FlextreeNode<INode>, HTMLElement, FlextreeNode<INode>>;
g: d3.Selection<SVGGElement, FlextreeNode<INode>, HTMLElement, FlextreeNode<INode>>;
zoom: d3.ZoomBehavior<SVGElement, FlextreeNode<INode>>;
styleNode: d3.Selection<HTMLStyleElement, INode, HTMLElement, INode>;
g: d3.Selection<SVGGElement, INode, HTMLElement, INode>;
observer: ResizeObserver;
zoom: d3.ZoomBehavior<SVGElement, INode>;
revokers: (() => void)[];
private imgCache;
private debouncedRefresh;
constructor(svg: string | SVGElement | ID3SVGElement, opts?: Partial<IMarkmapOptions>);

@@ -26,10 +24,9 @@ getStyleContent(): string;

handlePan: (e: WheelEvent) => void;
toggleNode(data: INode, recursive?: boolean): void;
handleClick: (e: MouseEvent, d: FlextreeNode<INode>) => void;
initializeData(node: INode): void;
private _checkImages;
private _loadImage;
toggleNode(data: INode, recursive?: boolean): Promise<void>;
handleClick: (e: MouseEvent, d: INode) => void;
private _initializeData;
private _relayout;
setOptions(opts?: Partial<IMarkmapOptions>): void;
setData(data?: IPureNode | null, opts?: Partial<IMarkmapOptions>): void;
renderData(originData?: INode): void;
setData(data?: IPureNode | null, opts?: Partial<IMarkmapOptions>): Promise<void>;
renderData(originData?: INode): Promise<void>;
transition<T extends d3.BaseType, U, P extends d3.BaseType, Q>(sel: d3.Selection<T, U, P, Q>): d3.Transition<T, U, P, Q>;

@@ -41,3 +38,3 @@ /**

findElement(node: INode): {
data: FlextreeNode<INode>;
data: INode;
g: SVGGElement;

@@ -44,0 +41,0 @@ } | undefined;

{
"name": "markmap-view",
"version": "0.17.3-alpha.3+89ad076",
"version": "0.17.3-alpha.4+be55d82",
"description": "View markmaps in browser",

@@ -25,4 +25,4 @@ "author": "Gerald <gera2ld@live.com>",

"build:js": "vite build && TARGET=es vite build",
"build": "run-s clean build:*",
"prepublishOnly": "run-s build"
"build": "pnpm clean && pnpm /^build:/",
"prepublishOnly": "pnpm build"
},

@@ -50,3 +50,3 @@ "bugs": {

"@types/d3-flextree": "^2.1.1",
"markmap-common": "0.17.3-alpha.3+89ad076"
"markmap-common": "0.17.3-alpha.4+be55d82"
},

@@ -56,3 +56,3 @@ "peerDependencies": {

},
"gitHead": "89ad076e313dd4c126aeafc49f052315755e8c0d"
"gitHead": "be55d825cb73aab3d315dc2f4034ebe06a54759b"
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc