🏠 Home 

GitHub README TOC

Add table of contents(TOC) for README in GitHub.

// ==UserScript==
// @name         GitHub README TOC
// @namespace    https://greasyfork.org/en/scripts/464732-github-readme-toc
// @version      0.3.3
// @author       pacexy <[email protected]>
// @description  Add table of contents(TOC) for README in GitHub.
// @license      MIT
// @icon         https://github.com/favicon.ico
// @homepage     https://github.com/pacexy/github-readme-toc#readme
// @homepageURL  https://github.com/pacexy/github-readme-toc#readme
// @source       https://github.com/pacexy/github-readme-toc
// @supportURL   https://github.com/pacexy/github-readme-toc/issues
// @match        https://github.com/**
// @require      https://cdn.jsdelivr.net/npm/[email protected]/umd/react.production.min.js
// @require      https://cdn.jsdelivr.net/npm/[email protected]/umd/react-dom.production.min.js
// ==/UserScript==
(o=>{const t=document.createElement("style");t.dataset.source="vite-plugin-monkey",t.textContent=o,document.head.append(t)})(" #github-readme-toc{position:sticky;z-index:30;top:0px!important;padding-top:24px;margin-top:24px;border-top:1px solid var(--color-border-muted);display:flex;flex-direction:column;max-height:100vh}#github-readme-toc ul{list-style:none;overflow:auto;padding-right:8px;padding-bottom:8px}#github-readme-toc ul>li{margin-bottom:8px}#github-readme-toc a{color:var(--color-fg-default)}#github-readme-toc a:hover{color:var(--color-accent-fg);text-decoration:none} ");
(function (require$$0, require$$0$1) {
'use strict';
var jsxRuntimeExports = {};
var jsxRuntime = {
get exports() {
return jsxRuntimeExports;
},
set exports(v) {
jsxRuntimeExports = v;
}
};
var reactJsxRuntime_production_min = {};
/**
* @license React
* react-jsx-runtime.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var f = require$$0, k = Symbol.for("react.element"), l = Symbol.for("react.fragment"), m$1 = Object.prototype.hasOwnProperty, n = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, p = { key: true, ref: true, __self: true, __source: true };
function q(c, a, g) {
var b, d = {}, e = null, h = null;
void 0 !== g && (e = "" + g);
void 0 !== a.key && (e = "" + a.key);
void 0 !== a.ref && (h = a.ref);
for (b in a)
m$1.call(a, b) && !p.hasOwnProperty(b) && (d[b] = a[b]);
if (c && c.defaultProps)
for (b in a = c.defaultProps, a)
void 0 === d[b] && (d[b] = a[b]);
return { $$typeof: k, type: c, key: e, ref: h, props: d, _owner: n.current };
}
reactJsxRuntime_production_min.Fragment = l;
reactJsxRuntime_production_min.jsx = q;
reactJsxRuntime_production_min.jsxs = q;
(function(module) {
{
module.exports = reactJsxRuntime_production_min;
}
})(jsxRuntime);
var client = {};
var m = require$$0$1;
{
client.createRoot = m.createRoot;
client.hydrateRoot = m.hydrateRoot;
}
const name = "github-readme-toc";
function assert$1(el) {
if (!el) {
throw new Error("Element not exists");
}
}
function ensureElements() {
var _a;
const container = (_a = document.querySelector(".BorderGrid")) == null ? void 0 : _a.parentElement;
const headings = document.querySelectorAll("article.markdown-body .markdown-heading");
assert$1(container);
assert$1(headings);
return { container, headings };
}
function assert(x) {
if (!x) {
throw new Error("Assertion failed");
}
}
function getToc() {
return [...ensureElements().headings].map((heading) => {
var _a;
const h = heading.firstElementChild;
assert(h);
const depth = Number(h.tagName.slice(1));
const anchor = heading.querySelector("a");
return {
depth,
text: (_a = heading.textContent) == null ? void 0 : _a.trim(),
url: anchor == null ? void 0 : anchor.href
};
});
}
const Toc = ({ toc }) => {
return /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { children: toc.map((h, i) => /* @__PURE__ */ jsxRuntimeExports.jsx("li", { style: { paddingLeft: (h.depth - 1) * 16 }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: h.url, children: h.text }) }, i)) });
};
function App() {
const toc = getToc();
return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
/* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "h4 mb-3", children: "Table of Contents" }),
/* @__PURE__ */ jsxRuntimeExports.jsx(Toc, { toc })
] });
}
async function render() {
let root = document.querySelector(`#${name}`);
if (root) {
return;
}
const container = ensureElements().container;
root = document.createElement("div");
root.id = name;
container.append(root);
client.createRoot(root).render(
/* @__PURE__ */ jsxRuntimeExports.jsx(require$$0.StrictMode, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(App, {}) })
);
}
function run() {
render().then(() => {
}).catch((error) => {
});
}
["pjax:end", "turbo:render"].forEach((e) => {
document.addEventListener(e, () => {
run();
});
});
run();
})(React, ReactDOM);