Render notion code block as graph by kroki
当前为
// ==UserScript==
// @name notion-kroki
// @namespace https://github.com/zuisong/notion-kroki
// @grant none
// @version 1.1.4
// @license MIT
// @match *://www.notion.so/*
// @match *://*.notion.site/*
// @match *://*.super.site/*
// @supportURL https://github.com/zuisong/notion-kroki/issues
// @run-at document-idle
// @author zuisong
// @description Render notion code block as graph by kroki
// ==/UserScript==
// src/common/utils.ts
function _xpath(xpath, node) {
const xresult = document.evaluate(
xpath,
node,
null,
XPathResult.ANY_TYPE,
null
);
const xnodes = [];
let xres;
while (true) {
xres = xresult.iterateNext();
if (xres) {
xnodes.push(xres);
} else {
break;
}
}
return xnodes;
}
function _debug(...data) {
if (localStorage.getItem("debug")) {
console.log(...data);
}
}
function debounce(callback, ms) {
let timer;
return function(...t) {
clearTimeout(timer);
timer = setTimeout(() => {
clearTimeout(timer);
callback(t);
}, ms);
};
}
// http-import:https://unpkg.com/[email protected]/esm/browser.js
var u8 = Uint8Array;
var u16 = Uint16Array;
var u32 = Uint32Array;
var fleb = new u8([0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 2, 2, 2, 2, 3, 3, 3, 3, 4, 4, 4, 4, 5, 5, 5, 5, 0, 0, 0, 0]);
var fdeb = new u8([0, 0, 0, 0, 1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 6, 6, 7, 7, 8, 8, 9, 9, 10, 10, 11, 11, 12, 12, 13, 13, 0, 0]);
var clim = new u8([16, 17, 18, 0, 8, 7, 9, 6, 10, 5, 11, 4, 12, 3, 13, 2, 14, 1, 15]);
var freb = function(eb, start) {
var b = new u16(31);
for (var i = 0; i < 31; ++i) {
b[i] = start += 1 << eb[i - 1];
}
var r = new u32(b[30]);
for (var i = 1; i < 30; ++i) {
for (var j = b[i]; j < b[i + 1]; ++j) {
r[j] = j - b[i] << 5 | i;
}
}
return [b, r];
};
var _a = freb(fleb, 2);
var fl = _a[0];
var revfl = _a[1];
fl[28] = 258, revfl[258] = 28;
var _b = freb(fdeb, 0);
var fd = _b[0];
var revfd = _b[1];
var rev = new u16(32768);
for (i = 0; i < 32768; ++i) {
x = (i & 43690) >>> 1 | (i & 21845) << 1;
x = (x & 52428) >>> 2 | (x & 13107) << 2;
x = (x & 61680) >>> 4 | (x & 3855) << 4;
rev[i] = ((x & 65280) >>> 8 | (x & 255) << 8) >>> 1;
}
var x;
var i;
var hMap = function(cd, mb, r) {
var s = cd.length;
var i = 0;
var l = new u16(mb);
for (; i < s; ++i) {
if (cd[i])
++l[cd[i] - 1];
}
var le = new u16(mb);
for (i = 0; i < mb; ++i) {
le[i] = le[i - 1] + l[i - 1] << 1;
}
var co;
if (r) {
co = new u16(1 << mb);
var rvb = 15 - mb;
for (i = 0; i < s; ++i) {
if (cd[i]) {
var sv = i << 4 | cd[i];
var r_1 = mb - cd[i];
var v = le[cd[i] - 1]++ << r_1;
for (var m = v | (1 << r_1) - 1; v <= m; ++v) {
co[rev[v] >>> rvb] = sv;
}
}
}
} else {
co = new u16(s);
for (i = 0; i < s; ++i) {
if (cd[i]) {
co[i] = rev[le[cd[i] - 1]++] >>> 15 - cd[i];
}
}
}
return co;
};
var flt = new u8(288);
for (i = 0; i < 144; ++i)
flt[i] = 8;
var i;
for (i = 144; i < 256; ++i)
flt[i] = 9;
var i;
for (i = 256; i < 280; ++i)
flt[i] = 7;
var i;
for (i = 280; i < 288; ++i)
flt[i] = 8;
var i;
var fdt = new u8(32);
for (i = 0; i < 32; ++i)
fdt[i] = 5;
var i;
var flm = /* @__PURE__ */ hMap(flt, 9, 0);
var fdm = /* @__PURE__ */ hMap(fdt, 5, 0);
var shft = function(p) {
return (p + 7) / 8 | 0;
};
var slc = function(v, s, e) {
if (s == null || s < 0)
s = 0;
if (e == null || e > v.length)
e = v.length;
var n = new (v.BYTES_PER_ELEMENT == 2 ? u16 : v.BYTES_PER_ELEMENT == 4 ? u32 : u8)(e - s);
n.set(v.subarray(s, e));
return n;
};
var wbits = function(d, p, v) {
v <<= p & 7;
var o = p / 8 | 0;
d[o] |= v;
d[o + 1] |= v >>> 8;
};
var wbits16 = function(d, p, v) {
v <<= p & 7;
var o = p / 8 | 0;
d[o] |= v;
d[o + 1] |= v >>> 8;
d[o + 2] |= v >>> 16;
};
var hTree = function(d, mb) {
var t = [];
for (var i = 0; i < d.length; ++i) {
if (d[i])
t.push({ s: i, f: d[i] });
}
var s = t.length;
var t2 = t.slice();
if (!s)
return [et, 0];
if (s == 1) {
var v = new u8(t[0].s + 1);
v[t[0].s] = 1;
return [v, 1];
}
t.sort(function(a, b) {
return a.f - b.f;
});
t.push({ s: -1, f: 25001 });
var l = t[0], r = t[1], i0 = 0, i1 = 1, i2 = 2;
t[0] = { s: -1, f: l.f + r.f, l, r };
while (i1 != s - 1) {
l = t[t[i0].f < t[i2].f ? i0++ : i2++];
r = t[i0 != i1 && t[i0].f < t[i2].f ? i0++ : i2++];
t[i1++] = { s: -1, f: l.f + r.f, l, r };
}
var maxSym = t2[0].s;
for (var i = 1; i < s; ++i) {
if (t2[i].s > maxSym)
maxSym = t2[i].s;
}
var tr = new u16(maxSym + 1);
var mbt = ln(t[i1 - 1], tr, 0);
if (mbt > mb) {
var i = 0, dt = 0;
var lft = mbt - mb, cst = 1 << lft;
t2.sort(function(a, b) {
return tr[b.s] - tr[a.s] || a.f - b.f;
});
for (; i < s; ++i) {
var i2_1 = t2[i].s;
if (tr[i2_1] > mb) {
dt += cst - (1 << mbt - tr[i2_1]);
tr[i2_1] = mb;
} else
break;
}
dt >>>= lft;
while (dt > 0) {
var i2_2 = t2[i].s;
if (tr[i2_2] < mb)
dt -= 1 << mb - tr[i2_2]++ - 1;
else
++i;
}
for (; i >= 0 && dt; --i) {
var i2_3 = t2[i].s;
if (tr[i2_3] == mb) {
--tr[i2_3];
++dt;
}
}
mbt = mb;
}
return [new u8(tr), mbt];
};
var ln = function(n, l, d) {
return n.s == -1 ? Math.max(ln(n.l, l, d + 1), ln(n.r, l, d + 1)) : l[n.s] = d;
};
var lc = function(c) {
var s = c.length;
while (s && !c[--s])
;
var cl = new u16(++s);
var cli = 0, cln = c[0], cls = 1;
var w = function(v) {
cl[cli++] = v;
};
for (var i = 1; i <= s; ++i) {
if (c[i] == cln && i != s)
++cls;
else {
if (!cln && cls > 2) {
for (; cls > 138; cls -= 138)
w(32754);
if (cls > 2) {
w(cls > 10 ? cls - 11 << 5 | 28690 : cls - 3 << 5 | 12305);
cls = 0;
}
} else if (cls > 3) {
w(cln), --cls;
for (; cls > 6; cls -= 6)
w(8304);
if (cls > 2)
w(cls - 3 << 5 | 8208), cls = 0;
}
while (cls--)
w(cln);
cls = 1;
cln = c[i];
}
}
return [cl.subarray(0, cli), s];
};
var clen = function(cf, cl) {
var l = 0;
for (var i = 0; i < cl.length; ++i)
l += cf[i] * cl[i];
return l;
};
var wfblk = function(out, pos, dat) {
var s = dat.length;
var o = shft(pos + 2);
out[o] = s & 255;
out[o + 1] = s >>> 8;
out[o + 2] = out[o] ^ 255;
out[o + 3] = out[o + 1] ^ 255;
for (var i = 0; i < s; ++i)
out[o + i + 4] = dat[i];
return (o + 4 + s) * 8;
};
var wblk = function(dat, out, final, syms, lf, df, eb, li, bs, bl, p) {
wbits(out, p++, final);
++lf[256];
var _a2 = hTree(lf, 15), dlt = _a2[0], mlb = _a2[1];
var _b2 = hTree(df, 15), ddt = _b2[0], mdb = _b2[1];
var _c = lc(dlt), lclt = _c[0], nlc = _c[1];
var _d = lc(ddt), lcdt = _d[0], ndc = _d[1];
var lcfreq = new u16(19);
for (var i = 0; i < lclt.length; ++i)
lcfreq[lclt[i] & 31]++;
for (var i = 0; i < lcdt.length; ++i)
lcfreq[lcdt[i] & 31]++;
var _e = hTree(lcfreq, 7), lct = _e[0], mlcb = _e[1];
var nlcc = 19;
for (; nlcc > 4 && !lct[clim[nlcc - 1]]; --nlcc)
;
var flen = bl + 5 << 3;
var ftlen = clen(lf, flt) + clen(df, fdt) + eb;
var dtlen = clen(lf, dlt) + clen(df, ddt) + eb + 14 + 3 * nlcc + clen(lcfreq, lct) + (2 * lcfreq[16] + 3 * lcfreq[17] + 7 * lcfreq[18]);
if (flen <= ftlen && flen <= dtlen)
return wfblk(out, p, dat.subarray(bs, bs + bl));
var lm, ll, dm, dl;
wbits(out, p, 1 + (dtlen < ftlen)), p += 2;
if (dtlen < ftlen) {
lm = hMap(dlt, mlb, 0), ll = dlt, dm = hMap(ddt, mdb, 0), dl = ddt;
var llm = hMap(lct, mlcb, 0);
wbits(out, p, nlc - 257);
wbits(out, p + 5, ndc - 1);
wbits(out, p + 10, nlcc - 4);
p += 14;
for (var i = 0; i < nlcc; ++i)
wbits(out, p + 3 * i, lct[clim[i]]);
p += 3 * nlcc;
var lcts = [lclt, lcdt];
for (var it = 0; it < 2; ++it) {
var clct = lcts[it];
for (var i = 0; i < clct.length; ++i) {
var len = clct[i] & 31;
wbits(out, p, llm[len]), p += lct[len];
if (len > 15)
wbits(out, p, clct[i] >>> 5 & 127), p += clct[i] >>> 12;
}
}
} else {
lm = flm, ll = flt, dm = fdm, dl = fdt;
}
for (var i = 0; i < li; ++i) {
if (syms[i] > 255) {
var len = syms[i] >>> 18 & 31;
wbits16(out, p, lm[len + 257]), p += ll[len + 257];
if (len > 7)
wbits(out, p, syms[i] >>> 23 & 31), p += fleb[len];
var dst = syms[i] & 31;
wbits16(out, p, dm[dst]), p += dl[dst];
if (dst > 3)
wbits16(out, p, syms[i] >>> 5 & 8191), p += fdeb[dst];
} else {
wbits16(out, p, lm[syms[i]]), p += ll[syms[i]];
}
}
wbits16(out, p, lm[256]);
return p + ll[256];
};
var deo = /* @__PURE__ */ new u32([65540, 131080, 131088, 131104, 262176, 1048704, 1048832, 2114560, 2117632]);
var et = /* @__PURE__ */ new u8(0);
var dflt = function(dat, lvl, plvl, pre, post, lst) {
var s = dat.length;
var o = new u8(pre + s + 5 * (1 + Math.ceil(s / 7e3)) + post);
var w = o.subarray(pre, o.length - post);
var pos = 0;
if (!lvl || s < 8) {
for (var i = 0; i <= s; i += 65535) {
var e = i + 65535;
if (e >= s) {
w[pos >> 3] = lst;
}
pos = wfblk(w, pos + 1, dat.subarray(i, e));
}
} else {
var opt = deo[lvl - 1];
var n = opt >>> 13, c = opt & 8191;
var msk_1 = (1 << plvl) - 1;
var prev = new u16(32768), head = new u16(msk_1 + 1);
var bs1_1 = Math.ceil(plvl / 3), bs2_1 = 2 * bs1_1;
var hsh = function(i2) {
return (dat[i2] ^ dat[i2 + 1] << bs1_1 ^ dat[i2 + 2] << bs2_1) & msk_1;
};
var syms = new u32(25e3);
var lf = new u16(288), df = new u16(32);
var lc_1 = 0, eb = 0, i = 0, li = 0, wi = 0, bs = 0;
for (; i < s; ++i) {
var hv = hsh(i);
var imod = i & 32767, pimod = head[hv];
prev[imod] = pimod;
head[hv] = imod;
if (wi <= i) {
var rem = s - i;
if ((lc_1 > 7e3 || li > 24576) && rem > 423) {
pos = wblk(dat, w, 0, syms, lf, df, eb, li, bs, i - bs, pos);
li = lc_1 = eb = 0, bs = i;
for (var j = 0; j < 286; ++j)
lf[j] = 0;
for (var j = 0; j < 30; ++j)
df[j] = 0;
}
var l = 2, d = 0, ch_1 = c, dif = imod - pimod & 32767;
if (rem > 2 && hv == hsh(i - dif)) {
var maxn = Math.min(n, rem) - 1;
var maxd = Math.min(32767, i);
var ml = Math.min(258, rem);
while (dif <= maxd && --ch_1 && imod != pimod) {
if (dat[i + l] == dat[i + l - dif]) {
var nl = 0;
for (; nl < ml && dat[i + nl] == dat[i + nl - dif]; ++nl)
;
if (nl > l) {
l = nl, d = dif;
if (nl > maxn)
break;
var mmd = Math.min(dif, nl - 2);
var md = 0;
for (var j = 0; j < mmd; ++j) {
var ti = i - dif + j + 32768 & 32767;
var pti = prev[ti];
var cd = ti - pti + 32768 & 32767;
if (cd > md)
md = cd, pimod = ti;
}
}
}
imod = pimod, pimod = prev[imod];
dif += imod - pimod + 32768 & 32767;
}
}
if (d) {
syms[li++] = 268435456 | revfl[l] << 18 | revfd[d];
var lin = revfl[l] & 31, din = revfd[d] & 31;
eb += fleb[lin] + fdeb[din];
++lf[257 + lin];
++df[din];
wi = i + l;
++lc_1;
} else {
syms[li++] = dat[i];
++lf[dat[i]];
}
}
}
pos = wblk(dat, w, lst, syms, lf, df, eb, li, bs, i - bs, pos);
if (!lst && pos & 7)
pos = wfblk(w, pos + 1, et);
}
return slc(o, 0, pre + shft(pos) + post);
};
var adler = function() {
var a = 1, b = 0;
return {
p: function(d) {
var n = a, m = b;
var l = d.length | 0;
for (var i = 0; i != l; ) {
var e = Math.min(i + 2655, l);
for (; i < e; ++i)
m += n += d[i];
n = (n & 65535) + 15 * (n >> 16), m = (m & 65535) + 15 * (m >> 16);
}
a = n, b = m;
},
d: function() {
a %= 65521, b %= 65521;
return (a & 255) << 24 | a >>> 8 << 16 | (b & 255) << 8 | b >>> 8;
}
};
};
var dopt = function(dat, opt, pre, post, st) {
return dflt(dat, opt.level == null ? 6 : opt.level, opt.mem == null ? Math.ceil(Math.max(8, Math.min(13, Math.log(dat.length))) * 1.5) : 12 + opt.mem, pre, post, !st);
};
var wbytes = function(d, b, v) {
for (; v; ++b)
d[b] = v, v >>>= 8;
};
var zlh = function(c, o) {
var lv = o.level, fl2 = lv == 0 ? 0 : lv < 6 ? 1 : lv == 9 ? 3 : 2;
c[0] = 120, c[1] = fl2 << 6 | (fl2 ? 32 - 2 * fl2 : 1);
};
function zlibSync(data, opts) {
if (!opts)
opts = {};
var a = adler();
a.p(data);
var d = dopt(data, opts, 2, 4);
return zlh(d, opts), wbytes(d, d.length - 4, a.d()), d;
}
var td = typeof TextDecoder != "undefined" && /* @__PURE__ */ new TextDecoder();
var tds = 0;
try {
td.decode(et, { stream: true });
tds = 1;
} catch (e) {
}
// src/main.ts
var defaultConfig = {
serverPath: "//kroki.io/"
};
function b64encode(str) {
return btoa(str);
}
function main(element = null) {
var _a2, _b2, _c, _d, _e, _f, _g, _h;
const blocks = _xpath(
"//*[starts-with(text(),'//kroki ')]",
element != null ? element : document.body
);
for (const codeDiv of blocks) {
if (!codeDiv)
continue;
if ((_a2 = codeDiv.textContent) == null ? void 0 : _a2.startsWith("//kroki")) {
const lines = codeDiv.textContent.split("\n");
const type = lines[0].replace("//kroki", "").trim();
if (!(type == null ? void 0 : type.trim()))
continue;
const data = lines.filter((_value, index) => index != 0).join("\n");
if (!(data == null ? void 0 : data.trim()))
continue;
const svgUrl = plant(data, type, defaultConfig);
const div = document.createElement("div", void 0);
div.style.cssText = "display: flex; flex-direction: row; place-content: center;";
div.setAttribute("notion-kroki", "true");
div.innerHTML = `<object type="image/svg+xml" style="max-width: 100%;" data="${svgUrl}" />`;
const preCreatedNode = (_c = (_b2 = codeDiv.parentElement) == null ? void 0 : _b2.parentElement) == null ? void 0 : _c.querySelector("div[notion-kroki]");
if (preCreatedNode) {
const preSvgUrl = (_d = preCreatedNode.firstElementChild) == null ? void 0 : _d.getAttribute(
"data"
);
_debug(`preSvgUrl:${preSvgUrl}`);
_debug(`svgUrl:${svgUrl}`);
if (preSvgUrl == svgUrl) {
continue;
} else {
(_f = (_e = codeDiv.parentElement) == null ? void 0 : _e.parentElement) == null ? void 0 : _f.removeChild(
preCreatedNode
);
}
}
(_h = (_g = codeDiv.parentElement) == null ? void 0 : _g.parentElement) == null ? void 0 : _h.appendChild(div);
}
}
}
function textEncode(str) {
return new TextEncoder().encode(str);
}
function plant(content, type, config) {
content = content.trim();
_debug(`kroki render type: ${type}`);
_debug(`kroki render content:
${content}`);
const urlPrefix = `${(config == null ? void 0 : config.serverPath) + type}/svg/`;
const data = textEncode(content);
const compressed = decode(zlibSync(data, { level: 9 }));
const result = b64encode(compressed).replace(/\+/g, "-").replace(/\//g, "_");
const svgUrl = urlPrefix + result;
return svgUrl;
}
main();
new MutationObserver(check).observe(document, {
childList: true,
subtree: true
});
function check(mutations, _observer) {
_debug("mutations", mutations);
mutations.forEach((mutation) => {
debounce(() => main(), 1e3)(mutation.target);
});
}
function decode(dat) {
let r = "";
for (let i = 0; i < dat.length; i += 16384) {
r += String.fromCharCode(...dat.subarray(i, i + 16384));
}
return r;
}