@hyperbook/markdown 0.6.4 → 0.8.0

package/dist/Code.d.ts

@@ -1,2 +1,2 @@
-import { Components } from "react-markdown";
-export declare const Code: Components["code"];
+import { ComponentType } from "react";
+export declare const Code: ComponentType<JSX.IntrinsicElements["code"]>;

package/dist/Headings.d.ts

@@ -1,3 +1,3 @@
-import { Components } from "react-markdown";
+import { ComponentType } from "react";
 export declare const makeAnchor: (heading: string) => string;
-export declare const Headings: Components["h1"];
+export declare const Headings: (level: number) => ComponentType<JSX.IntrinsicElements["h1"]>;

package/dist/Image.d.ts

@@ -1,2 +1,2 @@
-import { Components } from "react-markdown";
-export declare const Image: Components["img"];
+import { ComponentType } from "react";
+export declare const Image: ComponentType<JSX.IntrinsicElements["img"]>;

package/dist/Link.d.ts

@@ -1,2 +1,2 @@
-import { Components } from "react-markdown";
-export declare const Link: Components["a"];
+import { ComponentType } from "react";
+export declare const Link: ComponentType<JSX.IntrinsicElements["a"]>;

package/dist/Markdown.d.ts

@@ -1,5 +1,6 @@
 import "./index.css";
 export type MarkdownProps = {
     children: string;
+    showToc?: boolean;
 };
-export declare const Markdown: ({ children }: MarkdownProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Markdown: ({ children, showToc }: MarkdownProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Table.d.ts

@@ -1,5 +1,5 @@
-import { Components } from "react-markdown";
-export declare const Table: Components["table"];
-export declare const Tr: Components["tr"];
-export declare const Td: Components["td"];
-export declare const Th: Components["th"];
+import { ComponentType } from "react";
+export declare const Table: ComponentType<JSX.IntrinsicElements["table"]>;
+export declare const Tr: ComponentType<JSX.IntrinsicElements["tr"]>;
+export declare const Td: ComponentType<JSX.IntrinsicElements["td"]>;
+export declare const Th: ComponentType<JSX.IntrinsicElements["th"]>;

package/dist/index.cjs.js

@@ -47,12 +47,12 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
-  Markdown: () => Markdown
+  Markdown: () => Markdown,
+  useToc: () => useToc
 });
 module.exports = __toCommonJS(src_exports);
 
 // src/Markdown.tsx
-var import_react_markdown = __toESM(require("react-markdown"));
 var import_remark_directive = __toESM(require("remark-directive"));
 var import_remark_directive_rehype = __toESM(require("remark-directive-rehype"));
 var import_remark_gfm = __toESM(require("remark-gfm"));
@@ -61,8 +61,8 @@ var import_remark_gemoji = __toESM(require("remark-gemoji"));
 var import_remark_unwrap_images = __toESM(require("remark-unwrap-images"));
 var import_rehype_katex = __toESM(require("rehype-katex"));
 var import_rehype_highlight = __toESM(require("rehype-highlight"));
-var import_rehype_raw = __toESM(require("rehype-raw"));
 var import_provider5 = require("@hyperbook/provider");
+var import_drawer = require("@hyperbook/drawer");
 
 // src/Code.tsx
 var import_provider = require("@hyperbook/provider");
@@ -125,7 +125,10 @@ var copyNoNavigator = (text) => {
   document.execCommand("copy");
   document.body.removeChild(textarea);
 };
-var Code = ({ children, className, inline }) => {
+var Code = ({
+  children,
+  className
+}) => {
   const directives = (0, import_provider.useDirectives)();
   if (className === "language-mermaid" && directives["mermaid"]) {
     const Mermaid = directives["mermaid"];
@@ -152,7 +155,7 @@ var Code = ({ children, className, inline }) => {
       }
     }
   };
-  return inline ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline", children: [
+  return !className ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", { ref, className, children }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "copy", onClick: copyCode, "aria-label": "Copy Code", children: copied ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MdDone, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MdContentCopy, {}) })
   ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react.Fragment, { children: [
@@ -163,6 +166,7 @@ var Code = ({ children, className, inline }) => {
 
 // src/Link.tsx
 var import_provider2 = require("@hyperbook/provider");
+var import_react2 = require("react");
 var import_jsx_runtime2 = require("react/jsx-runtime");
 function formatUrl(url) {
   if (typeof url !== "string") {
@@ -178,8 +182,31 @@ function formatUrl(url) {
   ).join("//<wbr>");
   return formatted;
 }
-var Link = ({ href, title, children }) => {
+var Link = ({
+  href,
+  title,
+  children
+}) => {
   const L = (0, import_provider2.useLink)();
+  const config = (0, import_provider2.useConfig)();
+  const [isExternal, setIsExternal] = (0, import_react2.useState)(false);
+  (0, import_react2.useEffect)(() => {
+    var _a;
+    if (href) {
+      const tmp = document.createElement("a");
+      tmp.href = href;
+      if (tmp.host !== window.location.host) {
+        setIsExternal(true);
+      } else if (config.basePath && !((_a = window.location.pathname) == null ? void 0 : _a.startsWith(config.basePath))) {
+        setIsExternal(true);
+      } else {
+        setIsExternal(false);
+      }
+    }
+  }, [href, config]);
+  if (isExternal) {
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(L, { href, title, target: "_blank", children: formatUrl(children) });
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(L, { href, title, children: formatUrl(children) });
 };
 
@@ -187,18 +214,30 @@ var Link = ({ href, title, children }) => {
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var tableHeaders = [];
 var tdIndex = 0;
-var Table = ({ children, style }) => {
+var Table = ({
+  children,
+  style
+}) => {
   tableHeaders = [];
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("table", { style, children });
 };
-var Tr = ({ children, style }) => {
+var Tr = ({
+  children,
+  style
+}) => {
   tdIndex = 0;
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("tr", { style, children });
 };
-var Td = ({ children, style }) => {
+var Td = ({
+  children,
+  style
+}) => {
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("td", { "data-label": tableHeaders[tdIndex++], style, children });
 };
-var Th = ({ children, style }) => {
+var Th = ({
+  children,
+  style
+}) => {
   tableHeaders.push(children);
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("th", { style, children });
 };
@@ -212,7 +251,7 @@ var makeAnchor = (heading) => {
   anchor = anchor.replace(/ /g, "-");
   return anchor;
 };
-var Headings = ({ level, children, id }) => {
+var Headings = (level) => ({ children, id }) => {
   var _a;
   const config = (0, import_provider3.useConfig)();
   const bookmarksConfig = (_a = config == null ? void 0 : config.elements) == null ? void 0 : _a.bookmarks;
@@ -250,11 +289,15 @@ var Headings = ({ level, children, id }) => {
 
 // src/Image.tsx
 var import_provider4 = require("@hyperbook/provider");
-var import_react2 = require("react");
+var import_react3 = require("react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
-var Image = ({ src, title, alt }) => {
+var Image = ({
+  src,
+  title,
+  alt
+}) => {
   const makeUrl = (0, import_provider4.useMakeUrl)();
-  const [full, setFull] = (0, import_react2.useState)(false);
+  const [full, setFull] = (0, import_react3.useState)(false);
   src = makeUrl(src, "public");
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("figure", { className: full ? "lightbox" : void 0, children: [
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("img", { src, alt, onClick: () => setFull((f) => !f) }),
@@ -305,14 +348,73 @@ var remarkCustomHeadingIds = () => {
   };
 };
 
+// src/useRemarkSync.ts
+var import_react4 = require("react");
+var import_unified = require("unified");
+var import_remark_parse = __toESM(require("remark-parse"));
+var import_remark_rehype = __toESM(require("remark-rehype"));
+var import_rehype_react = __toESM(require("rehype-react"));
+var useRemarkSync = (source, {
+  remarkToRehypeOptions,
+  rehypeReactOptions,
+  remarkPlugins = [],
+  rehypePlugins = []
+} = {}) => (0, import_unified.unified)().use(import_remark_parse.default).use(remarkPlugins).use(import_remark_rehype.default, remarkToRehypeOptions).use(rehypePlugins).use(import_rehype_react.default, __spreadValues({
+  createElement: import_react4.createElement,
+  Fragment: import_react4.Fragment
+}, rehypeReactOptions)).processSync(source).result;
+
+// src/useToc.ts
+var import_remark_parse2 = __toESM(require("remark-parse"));
+var import_remark_stringify = __toESM(require("remark-stringify"));
+var import_unified2 = require("unified");
+
+// src/remarkHeadings.ts
+var import_unist_util_visit3 = require("unist-util-visit");
+var import_mdast_util_to_string = require("mdast-util-to-string");
+var getAnchor = (heading) => {
+  var _a;
+  if ((_a = heading == null ? void 0 : heading.data) == null ? void 0 : _a.id) {
+    return heading.data.id;
+  }
+  let anchor = (0, import_mdast_util_to_string.toString)(heading, { includeImageAlt: false }).toLowerCase();
+  anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, "");
+  anchor = anchor.replace(/ /g, "-");
+  return anchor;
+};
+var headings = (root) => {
+  const headingList = [];
+  (0, import_unist_util_visit3.visit)(root, "heading", (node) => {
+    const heading = {
+      level: node.depth,
+      label: (0, import_mdast_util_to_string.toString)(node, { includeImageAlt: false }),
+      anchor: getAnchor(node)
+    };
+    headingList.push(heading);
+  });
+  return headingList;
+};
+var remarkHeadings = () => {
+  return (tree, file) => {
+    file.data.headings = headings(tree);
+  };
+};
+
+// src/useToc.ts
+var useToc = (markdown) => {
+  return (0, import_unified2.unified)().use(remarkCustomHeadingIds).use(import_remark_parse2.default).use(import_remark_stringify.default).use(remarkHeadings).processSync(markdown).data.headings;
+};
+
 // src/Markdown.tsx
+var import_react5 = require("react");
 var import_jsx_runtime6 = require("react/jsx-runtime");
-var Markdown = ({ children }) => {
+var Markdown = ({ children, showToc = true }) => {
   const directives = (0, import_provider5.useDirectives)();
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-    import_react_markdown.default,
-    {
-      className: "hyperbook-markdown",
+  const toc = useToc(children);
+  const [isTocOpen, setIsTocOpen] = (0, import_react5.useState)(false);
+  const reactContent = useRemarkSync(children, {
+    rehypeReactOptions: {
+      passNode: true,
       components: __spreadProps(__spreadValues({}, directives), {
         a: Link,
         code: Code,
@@ -320,32 +422,57 @@ var Markdown = ({ children }) => {
         th: Th,
         table: Table,
         tr: Tr,
-        h1: Headings,
-        h2: Headings,
-        h3: Headings,
-        h4: Headings,
-        h5: Headings,
-        h6: Headings,
+        h1: Headings(1),
+        h2: Headings(2),
+        h3: Headings(3),
+        h4: Headings(4),
+        h5: Headings(5),
+        h6: Headings(6),
         img: Image
-      }),
-      remarkPlugins: [
-        remarkRemoveComments,
-        remarkCustomHeadingIds,
-        import_remark_directive.default,
-        import_remark_directive_rehype.default,
-        import_remark_gfm.default,
-        import_remark_math.default,
-        import_remark_gemoji.default,
-        import_remark_unwrap_images.default
-      ],
-      rehypePlugins: [
-        import_rehype_raw.default,
-        import_rehype_katex.default,
-        [import_rehype_highlight.default, { ignoreMissing: true, plainText: ["mermaid"] }]
-      ],
-      skipHtml: false,
-      children
-    }
-  );
+      })
+    },
+    remarkPlugins: [
+      remarkRemoveComments,
+      remarkCustomHeadingIds,
+      import_remark_gfm.default,
+      import_remark_directive.default,
+      import_remark_directive_rehype.default,
+      import_remark_math.default,
+      import_remark_gemoji.default,
+      import_remark_unwrap_images.default
+    ],
+    rehypePlugins: [
+      import_rehype_katex.default,
+      [import_rehype_highlight.default, { ignoreMissing: true, plainText: ["mermaid"] }]
+    ]
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "hyperbook-markdown", children: [
+    showToc && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_react5.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+        "button",
+        {
+          className: isTocOpen ? "toc-toggle open" : "toc-toggle",
+          onClick: () => setIsTocOpen(!isTocOpen),
+          title: "Table of Contents",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "bar1" }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "bar2" }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "bar3" }),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "bar4" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        import_drawer.Drawer,
+        {
+          isOpen: isTocOpen,
+          onClose: () => setIsTocOpen(false),
+          position: "right",
+          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { id: "toc-sidebar", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("nav", { className: "toc", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("ul", { children: toc.map((h, i) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("li", { className: `level-${h.level}`, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("a", { href: `#${h.anchor}`, children: h.label }) }, i)) }) }) })
+        }
+      )
+    ] }),
+    reactContent
+  ] });
 };
 //# sourceMappingURL=index.cjs.js.map

package/dist/index.cjs.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/index.ts", "../src/Markdown.tsx", "../src/Code.tsx", "../src/Link.tsx", "../src/Table.tsx", "../src/Headings.tsx", "../src/Image.tsx", "../src/remarkRemoveComments.ts", "../src/remarkCustomHeadingIds.ts"],
-  "sourcesContent": ["export * from \"./Markdown\";\n", "import ReactMarkdown from \"react-markdown\";\nimport remarkDirective from \"remark-directive\";\nimport remarkDirectiveRehype from \"remark-directive-rehype\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport remarkGemoji from \"remark-gemoji\";\nimport remarkUnwrapImages from \"remark-unwrap-images\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport rehypeRaw from \"rehype-raw\";\nimport { useDirectives } from \"@hyperbook/provider\";\nimport { Code } from \"./Code\";\nimport { Link } from \"./Link\";\nimport { Table, Td, Th, Tr } from \"./Table\";\nimport { Headings } from \"./Headings\";\nimport { Image } from \"./Image\";\n\nimport \"./index.css\";\nimport { remarkRemoveComments } from \"./remarkRemoveComments\";\nimport { remarkCustomHeadingIds } from \"./remarkCustomHeadingIds\";\n\nexport type MarkdownProps = {\n  children: string;\n};\n\nexport const Markdown = ({ children }: MarkdownProps) => {\n  const directives = useDirectives();\n\n  return (\n    <ReactMarkdown\n      className=\"hyperbook-markdown\"\n      components={{\n        ...directives,\n        a: Link,\n        code: Code,\n        td: Td,\n        th: Th,\n        table: Table,\n        tr: Tr,\n        h1: Headings,\n        h2: Headings,\n        h3: Headings,\n        h4: Headings,\n        h5: Headings,\n        h6: Headings,\n        img: Image,\n      }}\n      remarkPlugins={[\n        remarkRemoveComments,\n        remarkCustomHeadingIds,\n        remarkDirective,\n        remarkDirectiveRehype,\n        remarkGfm,\n        remarkMath,\n        remarkGemoji,\n        remarkUnwrapImages,\n      ]}\n      rehypePlugins={[\n        rehypeRaw,\n        rehypeKatex,\n        [rehypeHighlight, { ignoreMissing: true, plainText: [\"mermaid\"] }],\n      ]}\n      skipHtml={false}\n    >\n      {children}\n    </ReactMarkdown>\n  );\n};\n", "import { useDirectives } from \"@hyperbook/provider\";\nimport { Fragment, useRef, useState } from \"react\";\nimport { Components } from \"react-markdown\";\n\nconst MdContentCopy = () => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      stroke=\"currentColor\"\n      fill=\"currentColor\"\n      strokeWidth=\"0\"\n      height=\"1em\"\n      width=\"1em\"\n      viewBox=\"0 0 24 24\"\n    >\n      <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\" />\n    </svg>\n  );\n};\n\nconst MdDone = () => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      stroke=\"currentColor\"\n      fill=\"currentColor\"\n      strokeWidth=\"0\"\n      height=\"1em\"\n      width=\"1em\"\n      viewBox=\"0 0 24 24\"\n    >\n      <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z\" />\n    </svg>\n  );\n};\n\nconst copyNoNavigator = (text: string) => {\n  const isIos = navigator.userAgent.match(/ipad|iphone/i);\n  const textarea = document.createElement(\"textarea\");\n\n  // create textarea\n  textarea.value = text;\n\n  // ios will zoom in on the input if the font-size is < 16px\n  textarea.style.fontSize = \"20px\";\n  document.body.appendChild(textarea);\n\n  // select text\n  if (isIos) {\n    const range = document.createRange();\n    range.selectNodeContents(textarea);\n\n    const selection = window.getSelection();\n    if (selection) {\n      selection.removeAllRanges();\n      selection.addRange(range);\n    }\n    textarea.setSelectionRange(0, 999999);\n  } else {\n    textarea.select();\n  }\n\n  // copy selection\n  document.execCommand(\"copy\");\n\n  // cleanup\n  document.body.removeChild(textarea);\n};\n\nexport const Code: Components[\"code\"] = ({ children, className, inline }) => {\n  const directives = useDirectives();\n  if (className === \"language-mermaid\" && directives[\"mermaid\"]) {\n    const Mermaid = directives[\"mermaid\"];\n    return <Mermaid children={children} />;\n  }\n\n  const ref = useRef<HTMLElement>(null);\n  const [copied, setCopied] = useState(false);\n  const copyCode = () => {\n    if (ref.current) {\n      const text = ref.current.innerText;\n      if (navigator.clipboard) {\n        navigator.clipboard\n          .writeText(text)\n          .then(() => {\n            setCopied(true);\n            setTimeout(() => setCopied(false), 2000);\n          })\n          .catch(() => {\n            copyNoNavigator(text);\n            setCopied(true);\n            setTimeout(() => setCopied(false), 2000);\n          });\n      } else {\n        copyNoNavigator(text);\n        setCopied(true);\n        setTimeout(() => setCopied(false), 2000);\n      }\n    }\n  };\n\n  return inline ? (\n    <span className=\"inline\">\n      <code ref={ref} className={className}>\n        {children}\n      </code>\n      <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n        {copied ? <MdDone /> : <MdContentCopy />}\n      </button>\n    </span>\n  ) : (\n    <Fragment>\n      <code ref={ref} className={className}>\n        {children}\n      </code>\n      <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n        {copied ? <MdDone /> : <MdContentCopy />}\n      </button>\n    </Fragment>\n  );\n};\n", "import { useLink } from \"@hyperbook/provider\";\nimport { ReactNode } from \"react\";\nimport { Components } from \"react-markdown\";\n\n// see: https://css-tricks.com/better-line-breaks-for-long-urls/\nfunction formatUrl(url: ReactNode) {\n  if (typeof url !== \"string\") {\n    return url;\n  }\n  // Split the URL into an array to distinguish double slashes from single slashes\n  var doubleSlash = url.split(\"//\");\n\n  // Format the strings on either side of double slashes separately\n  var formatted = doubleSlash\n    .map(\n      (str) =>\n        // Insert a word break opportunity after a colon\n        str\n          .replace(/(?<after>:)/giu, \"$1<wbr>\")\n          // Before a single slash, tilde, period, comma, hyphen, underline, question mark, number sign, or percent symbol\n          .replace(/(?<before>[/~.,\\-_?#%])/giu, \"<wbr>$1\")\n          // Before and after an equals sign or ampersand\n          .replace(/(?<beforeAndAfter>[=&])/giu, \"<wbr>$1<wbr>\")\n      // Reconnect the strings with word break opportunities after double slashes\n    )\n    .join(\"//<wbr>\");\n\n  return formatted;\n}\n\nexport const Link: Components[\"a\"] = ({ href, title, children }) => {\n  const L = useLink();\n\n  return (\n    <L href={href} title={title}>\n      {formatUrl(children)}\n    </L>\n  );\n};\n", "import { ReactNode } from \"react\";\nimport { Components } from \"react-markdown\";\n\nlet tableHeaders: ReactNode[][] = [];\nlet tdIndex = 0;\n\nexport const Table: Components[\"table\"] = ({ children, style }) => {\n  tableHeaders = [];\n  return <table style={style}>{children}</table>;\n};\n\nexport const Tr: Components[\"tr\"] = ({ children, style }) => {\n  tdIndex = 0;\n  return <tr style={style}>{children}</tr>;\n};\n\nexport const Td: Components[\"td\"] = ({ children, style }) => {\n  return (\n    <td data-label={tableHeaders[tdIndex++]} style={style}>\n      {children}\n    </td>\n  );\n};\n\nexport const Th: Components[\"th\"] = ({ children, style }) => {\n  tableHeaders.push(children);\n  return <th style={style}>{children}</th>;\n};\n", "import { useBookmark, useConfig } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const makeAnchor = (heading: string) => {\n  // If we have a heading, make it lower case\n  let anchor = heading.toLowerCase();\n\n  // Clean anchor (replace special characters whitespaces).\n  // Alternatively, use encodeURIComponent() if you don't care about\n  // pretty anchor links\n  anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, \"\");\n  anchor = anchor.replace(/ /g, \"-\");\n\n  return anchor;\n};\n\nexport const Headings: Components[\"h1\"] = ({ level, children, id }) => {\n  const config = useConfig();\n  const bookmarksConfig = config?.elements?.bookmarks;\n  // Access actual (string) value of heading\n  const heading = children?.[0] || \"\";\n\n  // If we have a heading, make it lower case\n  let anchor = typeof heading === \"string\" ? makeAnchor(heading) : \"\";\n\n  const label = typeof heading === \"string\" ? heading : anchor;\n\n  const [bookmark, toggleBookmark] = useBookmark(anchor, label);\n\n  // Utility\n  const container = (children: React.ReactNode): JSX.Element => (\n    <>\n      <a className=\"heading\" id={id ?? anchor} href={`#${id ?? anchor}`}>\n        <span>{children}</span>\n      </a>\n      {bookmarksConfig !== false && (\n        <button\n          className={bookmark ? \"bookmark active\" : \"bookmark\"}\n          onClick={() => toggleBookmark()}\n          title=\"Bookmark\"\n        >\n          \uD83D\uDD16\n        </button>\n      )}\n    </>\n  );\n\n  switch (level) {\n    case 1:\n      return <h1>{container(children)}</h1>;\n    case 2:\n      return <h2>{container(children)}</h2>;\n    case 3:\n      return <h3>{container(children)}</h3>;\n    case 4:\n      return <h4>{container(children)}</h4>;\n    case 5:\n      return <h5>{container(children)}</h5>;\n\n    default:\n      return <h6>{container(children)}</h6>;\n  }\n};\n", "import { useMakeUrl } from \"@hyperbook/provider\";\nimport { useState } from \"react\";\nimport { Components } from \"react-markdown\";\n\nexport const Image: Components[\"img\"] = ({ src, title, alt }) => {\n  const makeUrl = useMakeUrl();\n  const [full, setFull] = useState(false);\n  src = makeUrl(src, \"public\");\n\n  return (\n    <figure className={full ? \"lightbox\" : undefined}>\n      <img src={src} alt={alt} onClick={() => setFull((f) => !f)} />\n      {title && <figcaption>{title}</figcaption>}\n    </figure>\n  );\n};\n", "//@ts-nocheck\nimport { visit, SKIP } from \"unist-util-visit\";\nimport { Transformer } from \"unified\";\nimport { BuildVisitor } from \"unist-util-visit/complex-types\";\n\nexport const remarkRemoveComments: () => Transformer = () => (tree) => {\n  const htmlCommentRegex = /<!--([\\s\\S]*?)-->/g;\n\n  const handler: BuildVisitor = (node, index, parent) => {\n    const isComment = node.value.match(htmlCommentRegex);\n\n    if (isComment) {\n      // remove node\n      parent.children.splice(index, 1);\n      // Do not traverse `node`, continue at the node *now* at `index`. http://unifiedjs.com/learn/recipe/remove-node/\n      return [SKIP, index];\n    }\n  };\n\n  visit(tree, \"html\", handler);\n\n  visit(tree, \"jsx\", handler);\n};\n", "import { visit } from \"unist-util-visit\";\nimport { Transformer } from \"unified\";\n\nexport const remarkCustomHeadingIds: () => Transformer = () => {\n  return function (node) {\n    visit(node, \"heading\", (node) => {\n      let lastChild = node.children[node.children.length - 1];\n      if (lastChild && lastChild.type === \"text\") {\n        let string = lastChild.value.replace(/ +$/, \"\");\n        let matched = string.match(/ {#([^]+?)}$/);\n\n        if (matched) {\n          let id = matched[1];\n          if (!!id.length) {\n            if (!node.data) {\n              node.data = {};\n            }\n            if (!node.data.hProperties) {\n              node.data.hProperties = {};\n            }\n            node.data.id = node.data.hProperties.id = id;\n\n            string = string.substring(0, matched.index);\n            lastChild.value = string;\n          }\n        }\n      }\n    });\n  };\n};\n"],
-  "mappings": "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",
-  "names": ["import_provider", "import_provider", "import_jsx_runtime", "import_jsx_runtime", "import_provider", "import_jsx_runtime", "children", "import_provider", "import_react", "import_jsx_runtime", "import_unist_util_visit", "node", "import_jsx_runtime", "ReactMarkdown", "remarkDirective", "remarkDirectiveRehype", "remarkGfm", "remarkMath", "remarkGemoji", "remarkUnwrapImages", "rehypeRaw", "rehypeKatex", "rehypeHighlight"]
+  "sources": ["../src/index.ts", "../src/Markdown.tsx", "../src/Code.tsx", "../src/Link.tsx", "../src/Table.tsx", "../src/Headings.tsx", "../src/Image.tsx", "../src/remarkRemoveComments.ts", "../src/remarkCustomHeadingIds.ts", "../src/useRemarkSync.ts", "../src/useToc.ts", "../src/remarkHeadings.ts"],
+  "sourcesContent": ["export * from \"./Markdown\";\nexport * from \"./useToc\";\n", "import remarkDirective from \"remark-directive\";\nimport remarkDirectiveRehype from \"remark-directive-rehype\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport remarkGemoji from \"remark-gemoji\";\nimport remarkUnwrapImages from \"remark-unwrap-images\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport { useDirectives } from \"@hyperbook/provider\";\nimport { Drawer } from \"@hyperbook/drawer\";\nimport { Code } from \"./Code\";\nimport { Link } from \"./Link\";\nimport { Table, Td, Th, Tr } from \"./Table\";\nimport { Headings } from \"./Headings\";\nimport { Image } from \"./Image\";\n\nimport \"./index.css\";\nimport { remarkRemoveComments } from \"./remarkRemoveComments\";\nimport { remarkCustomHeadingIds } from \"./remarkCustomHeadingIds\";\nimport { useRemarkSync } from \"./useRemarkSync\";\nimport { useToc } from \"./useToc\";\nimport { Fragment, useState } from \"react\";\n\nexport type MarkdownProps = {\n  children: string;\n  showToc?: boolean;\n};\n\nexport const Markdown = ({ children, showToc = true }: MarkdownProps) => {\n  const directives = useDirectives();\n\n  const toc = useToc(children);\n  const [isTocOpen, setIsTocOpen] = useState(false);\n  const reactContent = useRemarkSync(children, {\n    rehypeReactOptions: {\n      passNode: true,\n      components: {\n        ...directives,\n        a: Link,\n        code: Code,\n        td: Td,\n        th: Th,\n        table: Table,\n        tr: Tr,\n        h1: Headings(1),\n        h2: Headings(2),\n        h3: Headings(3),\n        h4: Headings(4),\n        h5: Headings(5),\n        h6: Headings(6),\n        img: Image,\n      },\n    },\n    remarkPlugins: [\n      remarkRemoveComments,\n      remarkCustomHeadingIds,\n      remarkGfm,\n      remarkDirective,\n      remarkDirectiveRehype,\n      remarkMath,\n      remarkGemoji,\n      remarkUnwrapImages,\n    ],\n    rehypePlugins: [\n      rehypeKatex,\n      [rehypeHighlight, { ignoreMissing: true, plainText: [\"mermaid\"] }],\n    ],\n  });\n\n  return (\n    <div className=\"hyperbook-markdown\">\n      {showToc && (\n        <Fragment>\n          <button\n            className={isTocOpen ? \"toc-toggle open\" : \"toc-toggle\"}\n            onClick={() => setIsTocOpen(!isTocOpen)}\n            title=\"Table of Contents\"\n          >\n            <div className=\"bar1\"></div>\n            <div className=\"bar2\"></div>\n            <div className=\"bar3\"></div>\n            <div className=\"bar4\"></div>\n          </button>\n          <Drawer\n            isOpen={isTocOpen}\n            onClose={() => setIsTocOpen(false)}\n            position=\"right\"\n          >\n            <div id=\"toc-sidebar\">\n              <nav className=\"toc\">\n                <ul>\n                  {toc.map((h, i) => (\n                    <li key={i} className={`level-${h.level}`}>\n                      <a href={`#${h.anchor}`}>{h.label}</a>\n                    </li>\n                  ))}\n                </ul>\n              </nav>\n            </div>\n          </Drawer>\n        </Fragment>\n      )}\n      {reactContent}\n    </div>\n  );\n};\n", "import { useDirectives } from \"@hyperbook/provider\";\nimport { ComponentType, Fragment, useRef, useState } from \"react\";\n\nconst MdContentCopy = () => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      stroke=\"currentColor\"\n      fill=\"currentColor\"\n      strokeWidth=\"0\"\n      height=\"1em\"\n      width=\"1em\"\n      viewBox=\"0 0 24 24\"\n    >\n      <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\" />\n    </svg>\n  );\n};\n\nconst MdDone = () => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      stroke=\"currentColor\"\n      fill=\"currentColor\"\n      strokeWidth=\"0\"\n      height=\"1em\"\n      width=\"1em\"\n      viewBox=\"0 0 24 24\"\n    >\n      <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z\" />\n    </svg>\n  );\n};\n\nconst copyNoNavigator = (text: string) => {\n  const isIos = navigator.userAgent.match(/ipad|iphone/i);\n  const textarea = document.createElement(\"textarea\");\n\n  // create textarea\n  textarea.value = text;\n\n  // ios will zoom in on the input if the font-size is < 16px\n  textarea.style.fontSize = \"20px\";\n  document.body.appendChild(textarea);\n\n  // select text\n  if (isIos) {\n    const range = document.createRange();\n    range.selectNodeContents(textarea);\n\n    const selection = window.getSelection();\n    if (selection) {\n      selection.removeAllRanges();\n      selection.addRange(range);\n    }\n    textarea.setSelectionRange(0, 999999);\n  } else {\n    textarea.select();\n  }\n\n  // copy selection\n  document.execCommand(\"copy\");\n\n  // cleanup\n  document.body.removeChild(textarea);\n};\n\nexport const Code: ComponentType<JSX.IntrinsicElements[\"code\"]> = ({\n  children,\n  className,\n}) => {\n  const directives = useDirectives();\n  if (className === \"language-mermaid\" && directives[\"mermaid\"]) {\n    const Mermaid = directives[\"mermaid\"];\n    return <Mermaid children={children} />;\n  }\n\n  const ref = useRef<HTMLElement>(null);\n  const [copied, setCopied] = useState(false);\n  const copyCode = () => {\n    if (ref.current) {\n      const text = ref.current.innerText;\n      if (navigator.clipboard) {\n        navigator.clipboard\n          .writeText(text)\n          .then(() => {\n            setCopied(true);\n            setTimeout(() => setCopied(false), 2000);\n          })\n          .catch(() => {\n            copyNoNavigator(text);\n            setCopied(true);\n            setTimeout(() => setCopied(false), 2000);\n          });\n      } else {\n        copyNoNavigator(text);\n        setCopied(true);\n        setTimeout(() => setCopied(false), 2000);\n      }\n    }\n  };\n\n  return !className ? (\n    <span className=\"inline\">\n      <code ref={ref} className={className}>\n        {children}\n      </code>\n      <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n        {copied ? <MdDone /> : <MdContentCopy />}\n      </button>\n    </span>\n  ) : (\n    <Fragment>\n      <code ref={ref} className={className}>\n        {children}\n      </code>\n      <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n        {copied ? <MdDone /> : <MdContentCopy />}\n      </button>\n    </Fragment>\n  );\n};\n", "import { useConfig, useLink } from \"@hyperbook/provider\";\nimport { ComponentType, ReactNode, useEffect, useState } from \"react\";\n\n// see: https://css-tricks.com/better-line-breaks-for-long-urls/\nfunction formatUrl(url: ReactNode) {\n  if (typeof url !== \"string\") {\n    return url;\n  }\n  // Split the URL into an array to distinguish double slashes from single slashes\n  var doubleSlash = url.split(\"//\");\n\n  // Format the strings on either side of double slashes separately\n  var formatted = doubleSlash\n    .map(\n      (str) =>\n        // Insert a word break opportunity after a colon\n        str\n          .replace(/(?<after>:)/giu, \"$1<wbr>\")\n          // Before a single slash, tilde, period, comma, hyphen, underline, question mark, number sign, or percent symbol\n          .replace(/(?<before>[/~.,\\-_?#%])/giu, \"<wbr>$1\")\n          // Before and after an equals sign or ampersand\n          .replace(/(?<beforeAndAfter>[=&])/giu, \"<wbr>$1<wbr>\")\n      // Reconnect the strings with word break opportunities after double slashes\n    )\n    .join(\"//<wbr>\");\n\n  return formatted;\n}\n\nexport const Link: ComponentType<JSX.IntrinsicElements[\"a\"]> = ({\n  href,\n  title,\n  children,\n}) => {\n  const L = useLink();\n  const config = useConfig();\n  const [isExternal, setIsExternal] = useState(false);\n\n  useEffect(() => {\n    if (href) {\n      const tmp = document.createElement(\"a\");\n      tmp.href = href;\n      if (tmp.host !== window.location.host) {\n        setIsExternal(true);\n      } else if (\n        config.basePath &&\n        !window.location.pathname?.startsWith(config.basePath)\n      ) {\n        setIsExternal(true);\n      } else {\n        setIsExternal(false);\n      }\n    }\n  }, [href, config]);\n\n  if (isExternal) {\n    <L href={href} title={title} target=\"_blank\">\n      {formatUrl(children)}\n    </L>;\n  }\n\n  return (\n    <L href={href} title={title}>\n      {formatUrl(children)}\n    </L>\n  );\n};\n", "import { ComponentType, ReactNode } from \"react\";\n\nlet tableHeaders: ReactNode[] = [];\nlet tdIndex = 0;\n\nexport const Table: ComponentType<JSX.IntrinsicElements[\"table\"]> = ({\n  children,\n  style,\n}) => {\n  tableHeaders = [];\n  return <table style={style}>{children}</table>;\n};\n\nexport const Tr: ComponentType<JSX.IntrinsicElements[\"tr\"]> = ({\n  children,\n  style,\n}) => {\n  tdIndex = 0;\n  return <tr style={style}>{children}</tr>;\n};\n\nexport const Td: ComponentType<JSX.IntrinsicElements[\"td\"]> = ({\n  children,\n  style,\n}) => {\n  return (\n    <td data-label={tableHeaders[tdIndex++]} style={style}>\n      {children}\n    </td>\n  );\n};\n\nexport const Th: ComponentType<JSX.IntrinsicElements[\"th\"]> = ({\n  children,\n  style,\n}) => {\n  tableHeaders.push(children);\n  return <th style={style}>{children}</th>;\n};\n", "import { useBookmark, useConfig } from \"@hyperbook/provider\";\nimport { ComponentType } from \"react\";\n\nexport const makeAnchor = (heading: string) => {\n  // If we have a heading, make it lower case\n  let anchor = heading.toLowerCase();\n\n  // Clean anchor (replace special characters whitespaces).\n  // Alternatively, use encodeURIComponent() if you don't care about\n  // pretty anchor links\n  anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, \"\");\n  anchor = anchor.replace(/ /g, \"-\");\n\n  return anchor;\n};\n\nexport const Headings =\n  (level: number): ComponentType<JSX.IntrinsicElements[\"h1\"]> =>\n  ({ children, id }) => {\n    const config = useConfig();\n    const bookmarksConfig = config?.elements?.bookmarks;\n    // Access actual (string) value of heading\n    const heading = children?.[0] || \"\";\n\n    // If we have a heading, make it lower case\n    let anchor = typeof heading === \"string\" ? makeAnchor(heading) : \"\";\n\n    const label = typeof heading === \"string\" ? heading : anchor;\n\n    const [bookmark, toggleBookmark] = useBookmark(anchor, label);\n\n    // Utility\n    const container = (children: React.ReactNode): JSX.Element => (\n      <>\n        <a className=\"heading\" id={id ?? anchor} href={`#${id ?? anchor}`}>\n          <span>{children}</span>\n        </a>\n        {bookmarksConfig !== false && (\n          <button\n            className={bookmark ? \"bookmark active\" : \"bookmark\"}\n            onClick={() => toggleBookmark()}\n            title=\"Bookmark\"\n          >\n            \uD83D\uDD16\n          </button>\n        )}\n      </>\n    );\n\n    switch (level) {\n      case 1:\n        return <h1>{container(children)}</h1>;\n      case 2:\n        return <h2>{container(children)}</h2>;\n      case 3:\n        return <h3>{container(children)}</h3>;\n      case 4:\n        return <h4>{container(children)}</h4>;\n      case 5:\n        return <h5>{container(children)}</h5>;\n\n      default:\n        return <h6>{container(children)}</h6>;\n    }\n  };\n", "import { useMakeUrl } from \"@hyperbook/provider\";\nimport { ComponentType, useState } from \"react\";\n\nexport const Image: ComponentType<JSX.IntrinsicElements[\"img\"]> = ({\n  src,\n  title,\n  alt,\n}) => {\n  const makeUrl = useMakeUrl();\n  const [full, setFull] = useState(false);\n  src = makeUrl(src, \"public\");\n\n  return (\n    <figure className={full ? \"lightbox\" : undefined}>\n      <img src={src} alt={alt} onClick={() => setFull((f) => !f)} />\n      {title && <figcaption>{title}</figcaption>}\n    </figure>\n  );\n};\n", "//@ts-nocheck\nimport { visit, SKIP } from \"unist-util-visit\";\nimport { Transformer } from \"unified\";\nimport { BuildVisitor } from \"unist-util-visit/complex-types\";\n\nexport const remarkRemoveComments: () => Transformer = () => (tree) => {\n  const htmlCommentRegex = /<!--([\\s\\S]*?)-->/g;\n\n  const handler: BuildVisitor = (node, index, parent) => {\n    const isComment = node.value.match(htmlCommentRegex);\n\n    if (isComment) {\n      // remove node\n      parent.children.splice(index, 1);\n      // Do not traverse `node`, continue at the node *now* at `index`. http://unifiedjs.com/learn/recipe/remove-node/\n      return [SKIP, index];\n    }\n  };\n\n  visit(tree, \"html\", handler);\n\n  visit(tree, \"jsx\", handler);\n};\n", "import { visit } from \"unist-util-visit\";\nimport { Transformer } from \"unified\";\n\nexport const remarkCustomHeadingIds: () => Transformer = () => {\n  return function (node) {\n    visit(node, \"heading\", (node) => {\n      let lastChild = node.children[node.children.length - 1];\n      if (lastChild && lastChild.type === \"text\") {\n        let string = lastChild.value.replace(/ +$/, \"\");\n        let matched = string.match(/ {#([^]+?)}$/);\n\n        if (matched) {\n          let id = matched[1];\n          if (!!id.length) {\n            if (!node.data) {\n              node.data = {};\n            }\n            if (!node.data.hProperties) {\n              node.data.hProperties = {};\n            }\n            node.data.id = node.data.hProperties.id = id;\n\n            string = string.substring(0, matched.index);\n            lastChild.value = string;\n          }\n        }\n      }\n    });\n  };\n};\n", "import { Fragment, ReactElement, createElement } from \"react\";\nimport { unified, PluggableList } from \"unified\";\nimport remarkParse from \"remark-parse\";\nimport { Options as RemarkRehypeOptions } from \"mdast-util-to-hast\";\nimport remarkToRehype from \"remark-rehype\";\nimport rehypeReact, { Options as RehypeReactOptions } from \"rehype-react\";\n\ntype PartialBy<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;\n\nexport interface UseRemarkSyncOptions {\n  remarkToRehypeOptions?: RemarkRehypeOptions;\n  rehypeReactOptions?: PartialBy<RehypeReactOptions, \"createElement\">;\n  remarkPlugins?: PluggableList;\n  rehypePlugins?: PluggableList;\n}\n\nexport const useRemarkSync = (\n  source: string,\n  {\n    remarkToRehypeOptions,\n    rehypeReactOptions,\n    remarkPlugins = [],\n    rehypePlugins = [],\n  }: UseRemarkSyncOptions = {}\n): ReactElement =>\n  unified()\n    .use(remarkParse)\n    .use(remarkPlugins)\n    .use(remarkToRehype, remarkToRehypeOptions)\n    .use(rehypePlugins)\n    .use(rehypeReact, {\n      createElement,\n      Fragment,\n      ...rehypeReactOptions,\n    } as RehypeReactOptions)\n    .processSync(source).result as ReactElement;\n", "import remarkParse from \"remark-parse\";\nimport remarkStringify from \"remark-stringify\";\nimport { unified } from \"unified\";\nimport { remarkCustomHeadingIds } from \"./remarkCustomHeadingIds\";\nimport { Heading, remarkHeadings } from \"./remarkHeadings\";\n\nexport const useToc = (markdown: string): Heading[] => {\n  return unified()\n    .use(remarkCustomHeadingIds)\n    .use(remarkParse)\n    .use(remarkStringify)\n    .use(remarkHeadings)\n    .processSync(markdown).data.headings;\n};\n", "import { Plugin } from \"unified\";\nimport { Root as MdastRoot, Heading as AstHeading } from \"mdast\";\nimport { Root as HastRoot } from \"hast\";\nimport { visit } from \"unist-util-visit\";\nimport { toString } from \"mdast-util-to-string\";\n\nexport interface Heading {\n  level: number;\n  label: string;\n  anchor: string;\n}\n\nconst getAnchor = (heading: AstHeading): string => {\n  // If we have a heading, make it lower case\n  if (heading?.data?.id) {\n    return heading.data.id as string;\n  }\n\n  let anchor = toString(heading, { includeImageAlt: false }).toLowerCase();\n\n  // Clean anchor (replace special characters whitespaces).\n  // Alternatively, use encodeURIComponent() if you don't care about\n  // pretty anchor links\n  anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, \"\");\n  anchor = anchor.replace(/ /g, \"-\");\n\n  return anchor;\n};\n\nconst headings = (root: MdastRoot) => {\n  const headingList: Heading[] = [];\n\n  visit(root, \"heading\", (node: AstHeading) => {\n    const heading: Heading = {\n      level: node.depth,\n      label: toString(node, { includeImageAlt: false }),\n      anchor: getAnchor(node),\n    };\n\n    headingList.push(heading);\n  });\n\n  return headingList;\n};\n\nexport const remarkHeadings: Plugin<[], MdastRoot, HastRoot> = () => {\n  return (tree, file) => {\n    file.data.headings = headings(tree);\n  };\n};\n"],
+  "mappings": "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",
+  "names": ["import_provider", "import_provider", "import_react", "import_jsx_runtime", "import_jsx_runtime", "import_provider", "import_jsx_runtime", "children", "import_provider", "import_react", "import_jsx_runtime", "import_unist_util_visit", "node", "import_react", "remarkParse", "remarkToRehype", "rehypeReact", "import_remark_parse", "import_unified", "import_unist_util_visit", "remarkParse", "remarkStringify", "import_react", "import_jsx_runtime", "remarkGfm", "remarkDirective", "remarkDirectiveRehype", "remarkMath", "remarkGemoji", "remarkUnwrapImages", "rehypeKatex", "rehypeHighlight"]
 }

package/dist/index.css

@@ -346,6 +346,65 @@
   right: 10px;
   top: 10px;
 }
+.hyperbook-markdown .toc-toggle > .bar1,
+.hyperbook-markdown .toc-toggle > .bar2,
+.hyperbook-markdown .toc-toggle > .bar3,
+.hyperbook-markdown .toc-toggle > .bar4 {
+  background-color: var(--color-text);
+}
+.hyperbook-markdown .toc-toggle {
+  background: var(--color-background);
+  border-color: var(--color-nav-border);
+}
+#toc-sidebar {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: calc(var(--app-height) - 80px);
+  border-left-width: 1px;
+  border-left-style: solid;
+  overflow-y: auto;
+}
+#toc-sidebar > nav {
+  padding: 20px;
+  flex: 1;
+}
+#toc-sidebar > nav li a {
+  display: block;
+}
+#toc-sidebar > nav li a:hover {
+  text-decoration: underline;
+}
+.hyperbook-markdown .toc-toggle {
+  position: fixed;
+  padding: 4px;
+  top: 90px;
+  right: 20px;
+  border-radius: 50%;
+  height: 40px;
+  width: 40px;
+  border-style: solid;
+  border-width: 1px;
+  opacity: 0.7;
+  z-index: 1000;
+}
+.hyperbook-markdown .toc-toggle:hover {
+  opacity: 1;
+}
+.hyperbook-markdown .toc-toggle > .bar1,
+.hyperbook-markdown .toc-toggle > .bar3 {
+  width: 20px;
+  height: 2px;
+  margin: 2px 3px;
+  transition: 0.4s;
+}
+.hyperbook-markdown .toc-toggle > .bar2,
+.hyperbook-markdown .toc-toggle > .bar4 {
+  width: 25px;
+  height: 2px;
+  margin: 2px 3px;
+  transition: 0.4s;
+}
 .hljs {
   color: #24292e;
   background: #ffffff;

package/dist/index.css.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/index.css"],
-  "sourcesContent": [".hyperbook-markdown {\n  background: var(--color-background);\n  color: var(--color-text);\n  font-family: hyperbook-body, sans-serif;\n}\n\n.hyperbook-markdown a {\n  color: var(--color-brand);\n}\n\n/**\n * IE 8\u201311 and Prince don\u2019t recognize the `wbr` element,\n * but a pseudo-element can achieve the same effect with IE 9+ and Prince.\n */\n.hyperbook-markdown wbr:before {\n  /* Unicode zero width space */\n  content: \"\\200B\";\n  white-space: normal;\n}\n\n.hyperbook-markdown .copy {\n  color: var(--color-text);\n}\n\n.hyperbook-markdown .hljs {\n  background: var(--color-nav) !important;\n  border-color: var(--color-spacer);\n}\n\n.hyperbook-markdown p > code {\n  background: var(--color-nav) !important;\n  border-color: var(--color-spacer);\n}\n\n.hyperbook-markdown img {\n  max-width: 100%;\n}\n\n.hyperbook-markdown figure.lightbox {\n  position: fixed;\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  align-items: center;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  padding: 1em;\n  z-index: 10000;\n  margin: 0px;\n  background: rgba(0, 0, 0, 0.5);\n}\n\n.hyperbook-markdown figure.lightbox img {\n  min-width: 100%;\n  min-height: 100%;\n  cursor: zoom-out;\n  object-fit: contain;\n}\n\n.hyperbook-markdown table {\n  border-color: var(--color-spacer);\n}\n\n.hyperbook-markdown table tr {\n  background-color: var(--color-nav);\n  border-color: var(--color-spacer);\n}\n\n.hyperbook-markdown h2 {\n  border-bottom-color: var(--color-spacer);\n}\n\n.hyperbook-markdown ul.bookmarks li {\n  border-color: var(--color-spacer);\n}\n\n.hyperbook-markdown ul.bookmarks li:hover {\n  background: var(--color-nav);\n}\n\n.hyperbook-markdown ul.bookmarks li:last-of-type {\n  border-color: var(--color-spacer);\n}\n\n@media screen and (max-width: 600px) {\n  .hyperbook-markdown table td {\n    border-bottom-color: var(--color-spacer);\n  }\n}\n\n.hyperbook-markdown figure {\n  text-align: center;\n  margin-top: 10px;\n  margin-bottom: 10px;\n}\n\n.hyperbook-markdown figure img {\n  cursor: zoom-in;\n}\n\n.hyperbook-markdown figcaption {\n  font-style: italic;\n  font-size: 14px;\n  max-width: 400px;\n  margin: 0 auto;\n}\n\n.hyperbook-markdown a.heading {\n  position: relative;\n  text-decoration: none;\n  padding-left: 16px;\n  margin-left: -16px;\n}\n\n.hyperbook-markdown a.heading:hover::before {\n  position: absolute;\n  content: \"\uD83D\uDCCE\";\n  font-size: 12px;\n  top: 50%;\n  transform: translateY(-50%);\n  left: 0px;\n}\n\n.hyperbook-markdown code {\n  font-family: hyperbook-code, monospace;\n  font-size: 85%;\n  padding: 0.2em 0.4em;\n  border-radius: 6px;\n}\n\n.hyperbook-markdown .inline {\n  display: inline-flex;\n  align-items: center;\n  color: var(--color-text);\n  border-width: 1px;\n  border-style: solid;\n  background: var(--color-nav) !important;\n  border-color: var(--color-spacer);\n  font-family: hyperbook-code, monospace;\n  padding: 0em 0.4em 0em 0em;\n  border-radius: 6px;\n}\n\n.hyperbook-markdown ul,\n.hyperbook-markdown ol {\n  margin-top: 0;\n  margin-bottom: 0;\n  padding-left: 2em;\n}\n\n.hyperbook-markdown ol ol,\n.hyperbook-markdown ul ol {\n  list-style-type: lower-roman;\n}\n\n.hyperbook-markdown ul ul ol,\n.hyperbook-markdown ul ol ol,\n.hyperbook-markdown ol ul ol,\n.hyperbook-markdown ol ol ol {\n  list-style-type: lower-alpha;\n}\n\n.hyperbook-markdown ul ul,\n.hyperbook-markdown ul ol,\n.hyperbook-markdown ol ol,\n.hyperbook-markdown ol ul {\n  margin-top: 0;\n  margin-bottom: 0;\n}\n\n.hyperbook-markdown li + li {\n  margin-top: 0.25em;\n}\n\n.hyperbook-markdown li > p {\n  margin-top: 16px;\n}\n\n.hyperbook-markdown p,\n.hyperbook-markdown blockquote,\n.hyperbook-markdown ol,\n.hyperbook-markdown ul,\n.hyperbook-markdown table,\n.hyperbook-markdown pre,\n.hyperbook-markdown details {\n  margin-top: 0;\n  margin-bottom: 10px;\n}\n\n.hyperbook-markdown blockquote {\n  width: 90%;\n  margin: 20px auto;\n  font-style: italic;\n  padding: 1.2em 30px 1.2em 75px;\n  border-left: 8px solid var(--color-brand);\n  line-height: 1.5;\n  position: relative;\n  background: var(--color-nav);\n}\n\n.hyperbook-markdown blockquote::before {\n  content: \"\\201C\";\n  color: var(--color-brand);\n  font-size: 4em;\n  position: absolute;\n  left: 10px;\n  top: -10px;\n}\n\n.hyperbook-markdown blockquote::after {\n  content: \"\";\n}\n\n.hyperbook-markdown table {\n  border-width: 1px;\n  border-style: solid;\n  border-collapse: collapse;\n  width: 100%;\n  table-layout: fixed;\n}\n\n.hyperbook-markdown table caption {\n  font-size: 1.5em;\n  margin: 0.5em 0 0.75em;\n}\n\n.hyperbook-markdown table tr {\n  border-width: 1px;\n  border-style: solid;\n  padding: 0.35em;\n}\n\n.hyperbook-markdown table th,\n.hyperbook-markdown table td {\n  padding: 0.625em;\n}\n\n.hyperbook-markdown table th {\n  font-size: 0.85em;\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n}\n\n@media screen and (max-width: 600px) {\n  .hyperbook-markdown table {\n    border: 0;\n  }\n\n  .hyperbook-markdown table caption {\n    font-size: 1.3em;\n  }\n\n  .hyperbook-markdown table thead {\n    border: none;\n    clip: rect(0 0 0 0);\n    height: 1px;\n    margin: -1px;\n    overflow: hidden;\n    padding: 0;\n    position: absolute;\n    width: 1px;\n  }\n\n  .hyperbook-markdown table tr {\n    border-bottom-width: 3px;\n    display: block;\n    margin-bottom: 0.625em;\n  }\n\n  .hyperbook-markdown table td {\n    border-bottom-width: 1px;\n    border-bottom-style: solid;\n    display: block;\n    font-size: 0.8em;\n    text-align: right;\n  }\n\n  .hyperbook-markdown table td::before {\n    /*\n    * aria-label has no advantage, it won't be read inside a table\n    content: attr(aria-label);\n    */\n    content: attr(data-label);\n    float: left;\n    font-weight: bold;\n    text-transform: uppercase;\n    margin-right: 8px;\n  }\n\n  .hyperbook-markdown table td:last-child {\n    border-bottom: 0;\n  }\n}\n\n.hyperbook-markdown h1,\n.hyperbook-markdown h2,\n.hyperbook-markdown h3,\n.hyperbook-markdown h4,\n.hyperbook-markdown h5,\n.hyperbook-markdown h6 {\n  font-family: hyperbook-heading, sans-serif;\n  margin-top: 24px;\n  margin-bottom: 16px;\n  font-weight: 600;\n  line-height: 1.25;\n}\n\n.hyperbook-markdown h1 {\n  font-size: 1.75em;\n  font-weight: 700;\n}\n\n.hyperbook-markdown h2 {\n  font-weight: 600;\n  padding-bottom: 0.3em;\n  font-size: 1.5em;\n  border-bottom-width: 1px;\n  border-bottom-style: solid;\n}\n\n.hyperbook-markdown h3 {\n  font-weight: 600;\n  font-size: 1.25em;\n}\n\n.hyperbook-markdown h4 {\n  font-weight: 600;\n  font-size: 1em;\n}\n\n.hyperbook-markdown h5 {\n  font-weight: 600;\n  font-size: 0.875em;\n}\n\n.hyperbook-markdown h6 {\n  font-weight: 600;\n  font-size: 0.85em;\n}\n\n.hyperbook-markdown p {\n  margin-top: 0;\n  margin-bottom: 10px;\n}\n\n.hyperbook-markdown h1,\n.hyperbook-markdown h2,\n.hyperbook-markdown h3,\n.hyperbook-markdown h4,\n.hyperbook-markdown h5,\n.hyperbook-markdown h6 {\n  display: flex;\n  align-items: center;\n}\n\n.hyperbook-markdown .bookmark {\n  margin-left: 10px;\n  background: none;\n  border: none;\n  opacity: 0.5;\n  font-size: 16px;\n}\n\n.hyperbook-markdown .bookmark:hover {\n  opacity: 1;\n}\n\n.hyperbook-markdown .bookmark.active {\n  opacity: 1;\n}\n\n.hyperbook-markdown ul.bookmarks {\n  padding-left: 0;\n}\n\n.hyperbook-markdown ul.bookmarks li {\n  list-style-type: none;\n}\n\n.hyperbook-markdown pre {\n  position: relative;\n}\n\n.hyperbook-markdown pre code.hljs {\n  display: block;\n  overflow-x: auto;\n  padding: 1em;\n}\n\n.hyperbook-markdown pre code {\n  display: inline-flex;\n  align-items: center;\n  color: var(--color-text);\n  border-width: 1px;\n  border-style: solid;\n}\n\n.hyperbook-markdown button.copy {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 4px;\n  background: var(--color-nav);\n  border: none;\n  padding: 0;\n  border-radius: 4px;\n  opacity: 0.9;\n}\n\n.hyperbook-markdown button.copy:hover {\n  opacity: 1;\n}\n\n.hyperbook-markdown pre > button.copy {\n  position: absolute;\n  right: 10px;\n  top: 10px;\n}\n\n/*!\n  Theme: GitHub\n  Description: Light theme as seen on github.com\n  Author: github.com\n  Maintainer: @Hirse\n  Updated: 2021-05-15\n\n  Outdated base version: https://github.com/primer/github-syntax-light\n  Current colors taken from GitHub's CSS\n*/\n\n.hljs {\n  color: #24292e;\n  background: #ffffff;\n}\n\n.hljs-doctag,\n.hljs-keyword,\n.hljs-meta .hljs-keyword,\n.hljs-template-tag,\n.hljs-template-variable,\n.hljs-type,\n.hljs-variable.language_ {\n  /* prettylights-syntax-keyword */\n  color: #d73a49;\n}\n\n.hljs-title,\n.hljs-title.class_,\n.hljs-title.class_.inherited__,\n.hljs-title.function_ {\n  /* prettylights-syntax-entity */\n  color: #6f42c1;\n}\n\n.hljs-attr,\n.hljs-attribute,\n.hljs-literal,\n.hljs-meta,\n.hljs-number,\n.hljs-operator,\n.hljs-variable,\n.hljs-selector-attr,\n.hljs-selector-class,\n.hljs-selector-id {\n  /* prettylights-syntax-constant */\n  color: #005cc5;\n}\n\n.hljs-regexp,\n.hljs-string,\n.hljs-meta .hljs-string {\n  /* prettylights-syntax-string */\n  color: #032f62;\n}\n\n.hljs-built_in,\n.hljs-symbol {\n  /* prettylights-syntax-variable */\n  color: #e36209;\n}\n\n.hljs-comment,\n.hljs-code,\n.hljs-formula {\n  /* prettylights-syntax-comment */\n  color: #6a737d;\n}\n\n.hljs-name,\n.hljs-quote,\n.hljs-selector-tag,\n.hljs-selector-pseudo {\n  /* prettylights-syntax-entity-tag */\n  color: #22863a;\n}\n\n.hljs-subst {\n  /* prettylights-syntax-storage-modifier-import */\n  color: #24292e;\n}\n\n.hljs-section {\n  /* prettylights-syntax-markup-heading */\n  color: #005cc5;\n  font-weight: bold;\n}\n\n.hljs-bullet {\n  /* prettylights-syntax-markup-list */\n  color: #735c0f;\n}\n\n.hljs-emphasis {\n  /* prettylights-syntax-markup-italic */\n  color: #24292e;\n  font-style: italic;\n}\n\n.hljs-strong {\n  /* prettylights-syntax-markup-bold */\n  color: #24292e;\n  font-weight: bold;\n}\n\n.hljs-addition {\n  /* prettylights-syntax-markup-inserted */\n  color: #22863a;\n  background-color: #f0fff4;\n}\n\n.hljs-deletion {\n  /* prettylights-syntax-markup-deleted */\n  color: #b31d28;\n  background-color: #ffeef0;\n}\n\n.hljs-char.escape_,\n.hljs-link,\n.hljs-params,\n.hljs-property,\n.hljs-punctuation,\n.hljs-tag {\n  /* purposely ignored */\n}\n\n/*!\n  Theme: GitHub Dark\n  Description: Dark theme as seen on github.com\n  Author: github.com\n  Maintainer: @Hirse\n  Updated: 2021-05-15\n\n  Outdated base version: https://github.com/primer/github-syntax-dark\n  Current colors taken from GitHub's CSS\n*/\n\n@media (prefers-color-scheme: dark) {\n  .hljs {\n    color: #c9d1d9;\n    background: #0d1117;\n  }\n\n  .hljs-doctag,\n  .hljs-keyword,\n  .hljs-meta .hljs-keyword,\n  .hljs-template-tag,\n  .hljs-template-variable,\n  .hljs-type,\n  .hljs-variable.language_ {\n    /* prettylights-syntax-keyword */\n    color: #ff7b72;\n  }\n\n  .hljs-title,\n  .hljs-title.class_,\n  .hljs-title.class_.inherited__,\n  .hljs-title.function_ {\n    /* prettylights-syntax-entity */\n    color: #d2a8ff;\n  }\n\n  .hljs-attr,\n  .hljs-attribute,\n  .hljs-literal,\n  .hljs-meta,\n  .hljs-number,\n  .hljs-operator,\n  .hljs-variable,\n  .hljs-selector-attr,\n  .hljs-selector-class,\n  .hljs-selector-id {\n    /* prettylights-syntax-constant */\n    color: #79c0ff;\n  }\n\n  .hljs-regexp,\n  .hljs-string,\n  .hljs-meta .hljs-string {\n    /* prettylights-syntax-string */\n    color: #a5d6ff;\n  }\n\n  .hljs-built_in,\n  .hljs-symbol {\n    /* prettylights-syntax-variable */\n    color: #ffa657;\n  }\n\n  .hljs-comment,\n  .hljs-code,\n  .hljs-formula {\n    /* prettylights-syntax-comment */\n    color: #8b949e;\n  }\n\n  .hljs-name,\n  .hljs-quote,\n  .hljs-selector-tag,\n  .hljs-selector-pseudo {\n    /* prettylights-syntax-entity-tag */\n    color: #7ee787;\n  }\n\n  .hljs-subst {\n    /* prettylights-syntax-storage-modifier-import */\n    color: #c9d1d9;\n  }\n\n  .hljs-section {\n    /* prettylights-syntax-markup-heading */\n    color: #1f6feb;\n    font-weight: bold;\n  }\n\n  .hljs-bullet {\n    /* prettylights-syntax-markup-list */\n    color: #f2cc60;\n  }\n\n  .hljs-emphasis {\n    /* prettylights-syntax-markup-italic */\n    color: #c9d1d9;\n    font-style: italic;\n  }\n\n  .hljs-strong {\n    /* prettylights-syntax-markup-bold */\n    color: #c9d1d9;\n    font-weight: bold;\n  }\n\n  .hljs-addition {\n    /* prettylights-syntax-markup-inserted */\n    color: #aff5b4;\n    background-color: #033a16;\n  }\n\n  .hljs-deletion {\n    /* prettylights-syntax-markup-deleted */\n    color: #ffdcd7;\n    background-color: #67060c;\n  }\n\n  .hljs-char.escape_,\n  .hljs-link,\n  .hljs-params,\n  .hljs-property,\n  .hljs-punctuation,\n  .hljs-tag {\n    /* purposely ignored */\n  }\n}\n"],
-  "mappings": ";AAAA;AACE;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAOF;AAEE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACE;AAAA;AAAA;AAIJ;AACE;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AAAA;AAGF;AAAA;AAAA;AAAA;AAIE;AAAA;AAGF;AAAA;AAAA;AAAA;AAIE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AAKE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAAA;AAIJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAME;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAME;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAcF;AACE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQE;AAAA;AAGF;AAAA;AAAA;AAAA;AAKE;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWE;AAAA;AAGF;AAAA;AAAA;AAIE;AAAA;AAGF;AAAA;AAGE;AAAA;AAGF;AAAA;AAAA;AAIE;AAAA;AAGF;AAAA;AAAA;AAAA;AAKE;AAAA;AAGF;AAEE;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBA;AACE;AACE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQE;AAAA;AAGF;AAAA;AAAA;AAAA;AAKE;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWE;AAAA;AAGF;AAAA;AAAA;AAIE;AAAA;AAGF;AAAA;AAGE;AAAA;AAGF;AAAA;AAAA;AAIE;AAAA;AAGF;AAAA;AAAA;AAAA;AAKE;AAAA;AAGF;AAEE;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
+  "sourcesContent": [".hyperbook-markdown {\n  background: var(--color-background);\n  color: var(--color-text);\n  font-family: hyperbook-body, sans-serif;\n}\n\n.hyperbook-markdown a {\n  color: var(--color-brand);\n}\n\n/**\n * IE 8\u201311 and Prince don\u2019t recognize the `wbr` element,\n * but a pseudo-element can achieve the same effect with IE 9+ and Prince.\n */\n.hyperbook-markdown wbr:before {\n  /* Unicode zero width space */\n  content: \"\\200B\";\n  white-space: normal;\n}\n\n.hyperbook-markdown .copy {\n  color: var(--color-text);\n}\n\n.hyperbook-markdown .hljs {\n  background: var(--color-nav) !important;\n  border-color: var(--color-spacer);\n}\n\n.hyperbook-markdown p > code {\n  background: var(--color-nav) !important;\n  border-color: var(--color-spacer);\n}\n\n.hyperbook-markdown img {\n  max-width: 100%;\n}\n\n.hyperbook-markdown figure.lightbox {\n  position: fixed;\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  align-items: center;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  padding: 1em;\n  z-index: 10000;\n  margin: 0px;\n  background: rgba(0, 0, 0, 0.5);\n}\n\n.hyperbook-markdown figure.lightbox img {\n  min-width: 100%;\n  min-height: 100%;\n  cursor: zoom-out;\n  object-fit: contain;\n}\n\n.hyperbook-markdown table {\n  border-color: var(--color-spacer);\n}\n\n.hyperbook-markdown table tr {\n  background-color: var(--color-nav);\n  border-color: var(--color-spacer);\n}\n\n.hyperbook-markdown h2 {\n  border-bottom-color: var(--color-spacer);\n}\n\n.hyperbook-markdown ul.bookmarks li {\n  border-color: var(--color-spacer);\n}\n\n.hyperbook-markdown ul.bookmarks li:hover {\n  background: var(--color-nav);\n}\n\n.hyperbook-markdown ul.bookmarks li:last-of-type {\n  border-color: var(--color-spacer);\n}\n\n@media screen and (max-width: 600px) {\n  .hyperbook-markdown table td {\n    border-bottom-color: var(--color-spacer);\n  }\n}\n\n.hyperbook-markdown figure {\n  text-align: center;\n  margin-top: 10px;\n  margin-bottom: 10px;\n}\n\n.hyperbook-markdown figure img {\n  cursor: zoom-in;\n}\n\n.hyperbook-markdown figcaption {\n  font-style: italic;\n  font-size: 14px;\n  max-width: 400px;\n  margin: 0 auto;\n}\n\n.hyperbook-markdown a.heading {\n  position: relative;\n  text-decoration: none;\n  padding-left: 16px;\n  margin-left: -16px;\n}\n\n.hyperbook-markdown a.heading:hover::before {\n  position: absolute;\n  content: \"\uD83D\uDCCE\";\n  font-size: 12px;\n  top: 50%;\n  transform: translateY(-50%);\n  left: 0px;\n}\n\n.hyperbook-markdown code {\n  font-family: hyperbook-code, monospace;\n  font-size: 85%;\n  padding: 0.2em 0.4em;\n  border-radius: 6px;\n}\n\n.hyperbook-markdown .inline {\n  display: inline-flex;\n  align-items: center;\n  color: var(--color-text);\n  border-width: 1px;\n  border-style: solid;\n  background: var(--color-nav) !important;\n  border-color: var(--color-spacer);\n  font-family: hyperbook-code, monospace;\n  padding: 0em 0.4em 0em 0em;\n  border-radius: 6px;\n}\n\n.hyperbook-markdown ul,\n.hyperbook-markdown ol {\n  margin-top: 0;\n  margin-bottom: 0;\n  padding-left: 2em;\n}\n\n.hyperbook-markdown ol ol,\n.hyperbook-markdown ul ol {\n  list-style-type: lower-roman;\n}\n\n.hyperbook-markdown ul ul ol,\n.hyperbook-markdown ul ol ol,\n.hyperbook-markdown ol ul ol,\n.hyperbook-markdown ol ol ol {\n  list-style-type: lower-alpha;\n}\n\n.hyperbook-markdown ul ul,\n.hyperbook-markdown ul ol,\n.hyperbook-markdown ol ol,\n.hyperbook-markdown ol ul {\n  margin-top: 0;\n  margin-bottom: 0;\n}\n\n.hyperbook-markdown li + li {\n  margin-top: 0.25em;\n}\n\n.hyperbook-markdown li > p {\n  margin-top: 16px;\n}\n\n.hyperbook-markdown p,\n.hyperbook-markdown blockquote,\n.hyperbook-markdown ol,\n.hyperbook-markdown ul,\n.hyperbook-markdown table,\n.hyperbook-markdown pre,\n.hyperbook-markdown details {\n  margin-top: 0;\n  margin-bottom: 10px;\n}\n\n.hyperbook-markdown blockquote {\n  width: 90%;\n  margin: 20px auto;\n  font-style: italic;\n  padding: 1.2em 30px 1.2em 75px;\n  border-left: 8px solid var(--color-brand);\n  line-height: 1.5;\n  position: relative;\n  background: var(--color-nav);\n}\n\n.hyperbook-markdown blockquote::before {\n  content: \"\\201C\";\n  color: var(--color-brand);\n  font-size: 4em;\n  position: absolute;\n  left: 10px;\n  top: -10px;\n}\n\n.hyperbook-markdown blockquote::after {\n  content: \"\";\n}\n\n.hyperbook-markdown table {\n  border-width: 1px;\n  border-style: solid;\n  border-collapse: collapse;\n  width: 100%;\n  table-layout: fixed;\n}\n\n.hyperbook-markdown table caption {\n  font-size: 1.5em;\n  margin: 0.5em 0 0.75em;\n}\n\n.hyperbook-markdown table tr {\n  border-width: 1px;\n  border-style: solid;\n  padding: 0.35em;\n}\n\n.hyperbook-markdown table th,\n.hyperbook-markdown table td {\n  padding: 0.625em;\n}\n\n.hyperbook-markdown table th {\n  font-size: 0.85em;\n  letter-spacing: 0.1em;\n  text-transform: uppercase;\n}\n\n@media screen and (max-width: 600px) {\n  .hyperbook-markdown table {\n    border: 0;\n  }\n\n  .hyperbook-markdown table caption {\n    font-size: 1.3em;\n  }\n\n  .hyperbook-markdown table thead {\n    border: none;\n    clip: rect(0 0 0 0);\n    height: 1px;\n    margin: -1px;\n    overflow: hidden;\n    padding: 0;\n    position: absolute;\n    width: 1px;\n  }\n\n  .hyperbook-markdown table tr {\n    border-bottom-width: 3px;\n    display: block;\n    margin-bottom: 0.625em;\n  }\n\n  .hyperbook-markdown table td {\n    border-bottom-width: 1px;\n    border-bottom-style: solid;\n    display: block;\n    font-size: 0.8em;\n    text-align: right;\n  }\n\n  .hyperbook-markdown table td::before {\n    /*\n    * aria-label has no advantage, it won't be read inside a table\n    content: attr(aria-label);\n    */\n    content: attr(data-label);\n    float: left;\n    font-weight: bold;\n    text-transform: uppercase;\n    margin-right: 8px;\n  }\n\n  .hyperbook-markdown table td:last-child {\n    border-bottom: 0;\n  }\n}\n\n.hyperbook-markdown h1,\n.hyperbook-markdown h2,\n.hyperbook-markdown h3,\n.hyperbook-markdown h4,\n.hyperbook-markdown h5,\n.hyperbook-markdown h6 {\n  font-family: hyperbook-heading, sans-serif;\n  margin-top: 24px;\n  margin-bottom: 16px;\n  font-weight: 600;\n  line-height: 1.25;\n}\n\n.hyperbook-markdown h1 {\n  font-size: 1.75em;\n  font-weight: 700;\n}\n\n.hyperbook-markdown h2 {\n  font-weight: 600;\n  padding-bottom: 0.3em;\n  font-size: 1.5em;\n  border-bottom-width: 1px;\n  border-bottom-style: solid;\n}\n\n.hyperbook-markdown h3 {\n  font-weight: 600;\n  font-size: 1.25em;\n}\n\n.hyperbook-markdown h4 {\n  font-weight: 600;\n  font-size: 1em;\n}\n\n.hyperbook-markdown h5 {\n  font-weight: 600;\n  font-size: 0.875em;\n}\n\n.hyperbook-markdown h6 {\n  font-weight: 600;\n  font-size: 0.85em;\n}\n\n.hyperbook-markdown p {\n  margin-top: 0;\n  margin-bottom: 10px;\n}\n\n.hyperbook-markdown h1,\n.hyperbook-markdown h2,\n.hyperbook-markdown h3,\n.hyperbook-markdown h4,\n.hyperbook-markdown h5,\n.hyperbook-markdown h6 {\n  display: flex;\n  align-items: center;\n}\n\n.hyperbook-markdown .bookmark {\n  margin-left: 10px;\n  background: none;\n  border: none;\n  opacity: 0.5;\n  font-size: 16px;\n}\n\n.hyperbook-markdown .bookmark:hover {\n  opacity: 1;\n}\n\n.hyperbook-markdown .bookmark.active {\n  opacity: 1;\n}\n\n.hyperbook-markdown ul.bookmarks {\n  padding-left: 0;\n}\n\n.hyperbook-markdown ul.bookmarks li {\n  list-style-type: none;\n}\n\n.hyperbook-markdown pre {\n  position: relative;\n}\n\n.hyperbook-markdown pre code.hljs {\n  display: block;\n  overflow-x: auto;\n  padding: 1em;\n}\n\n.hyperbook-markdown pre code {\n  display: inline-flex;\n  align-items: center;\n  color: var(--color-text);\n  border-width: 1px;\n  border-style: solid;\n}\n\n.hyperbook-markdown button.copy {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 4px;\n  background: var(--color-nav);\n  border: none;\n  padding: 0;\n  border-radius: 4px;\n  opacity: 0.9;\n}\n\n.hyperbook-markdown button.copy:hover {\n  opacity: 1;\n}\n\n.hyperbook-markdown pre > button.copy {\n  position: absolute;\n  right: 10px;\n  top: 10px;\n}\n\n.hyperbook-markdown .toc-toggle > .bar1,\n.hyperbook-markdown .toc-toggle > .bar2,\n.hyperbook-markdown .toc-toggle > .bar3,\n.hyperbook-markdown .toc-toggle > .bar4 {\n  background-color: var(--color-text);\n}\n\n.hyperbook-markdown .toc-toggle {\n  background: var(--color-background);\n  border-color: var(--color-nav-border);\n}\n\n#toc-sidebar {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: calc(var(--app-height) - 80px);\n  border-left-width: 1px;\n  border-left-style: solid;\n  overflow-y: auto;\n}\n\n#toc-sidebar > nav {\n  padding: 20px;\n  flex: 1;\n}\n\n#toc-sidebar > nav li a {\n  display: block;\n}\n\n#toc-sidebar > nav li a:hover {\n  text-decoration: underline;\n}\n\n.hyperbook-markdown .toc-toggle {\n  position: fixed;\n  padding: 4px;\n  top: 90px;\n  right: 20px;\n  border-radius: 50%;\n  height: 40px;\n  width: 40px;\n  border-style: solid;\n  border-width: 1px;\n  opacity: 0.7;\n  z-index: 1000;\n}\n\n.hyperbook-markdown .toc-toggle:hover {\n  opacity: 1;\n}\n\n.hyperbook-markdown .toc-toggle > .bar1,\n.hyperbook-markdown .toc-toggle > .bar3 {\n  width: 20px;\n  height: 2px;\n  margin: 2px 3px;\n  transition: 0.4s;\n}\n\n.hyperbook-markdown .toc-toggle > .bar2,\n.hyperbook-markdown .toc-toggle > .bar4 {\n  width: 25px;\n  height: 2px;\n  margin: 2px 3px;\n  transition: 0.4s;\n}\n\n/*!\n  Theme: GitHub\n  Description: Light theme as seen on github.com\n  Author: github.com\n  Maintainer: @Hirse\n  Updated: 2021-05-15\n\n  Outdated base version: https://github.com/primer/github-syntax-light\n  Current colors taken from GitHub's CSS\n*/\n\n.hljs {\n  color: #24292e;\n  background: #ffffff;\n}\n\n.hljs-doctag,\n.hljs-keyword,\n.hljs-meta .hljs-keyword,\n.hljs-template-tag,\n.hljs-template-variable,\n.hljs-type,\n.hljs-variable.language_ {\n  /* prettylights-syntax-keyword */\n  color: #d73a49;\n}\n\n.hljs-title,\n.hljs-title.class_,\n.hljs-title.class_.inherited__,\n.hljs-title.function_ {\n  /* prettylights-syntax-entity */\n  color: #6f42c1;\n}\n\n.hljs-attr,\n.hljs-attribute,\n.hljs-literal,\n.hljs-meta,\n.hljs-number,\n.hljs-operator,\n.hljs-variable,\n.hljs-selector-attr,\n.hljs-selector-class,\n.hljs-selector-id {\n  /* prettylights-syntax-constant */\n  color: #005cc5;\n}\n\n.hljs-regexp,\n.hljs-string,\n.hljs-meta .hljs-string {\n  /* prettylights-syntax-string */\n  color: #032f62;\n}\n\n.hljs-built_in,\n.hljs-symbol {\n  /* prettylights-syntax-variable */\n  color: #e36209;\n}\n\n.hljs-comment,\n.hljs-code,\n.hljs-formula {\n  /* prettylights-syntax-comment */\n  color: #6a737d;\n}\n\n.hljs-name,\n.hljs-quote,\n.hljs-selector-tag,\n.hljs-selector-pseudo {\n  /* prettylights-syntax-entity-tag */\n  color: #22863a;\n}\n\n.hljs-subst {\n  /* prettylights-syntax-storage-modifier-import */\n  color: #24292e;\n}\n\n.hljs-section {\n  /* prettylights-syntax-markup-heading */\n  color: #005cc5;\n  font-weight: bold;\n}\n\n.hljs-bullet {\n  /* prettylights-syntax-markup-list */\n  color: #735c0f;\n}\n\n.hljs-emphasis {\n  /* prettylights-syntax-markup-italic */\n  color: #24292e;\n  font-style: italic;\n}\n\n.hljs-strong {\n  /* prettylights-syntax-markup-bold */\n  color: #24292e;\n  font-weight: bold;\n}\n\n.hljs-addition {\n  /* prettylights-syntax-markup-inserted */\n  color: #22863a;\n  background-color: #f0fff4;\n}\n\n.hljs-deletion {\n  /* prettylights-syntax-markup-deleted */\n  color: #b31d28;\n  background-color: #ffeef0;\n}\n\n.hljs-char.escape_,\n.hljs-link,\n.hljs-params,\n.hljs-property,\n.hljs-punctuation,\n.hljs-tag {\n  /* purposely ignored */\n}\n\n/*!\n  Theme: GitHub Dark\n  Description: Dark theme as seen on github.com\n  Author: github.com\n  Maintainer: @Hirse\n  Updated: 2021-05-15\n\n  Outdated base version: https://github.com/primer/github-syntax-dark\n  Current colors taken from GitHub's CSS\n*/\n\n@media (prefers-color-scheme: dark) {\n  .hljs {\n    color: #c9d1d9;\n    background: #0d1117;\n  }\n\n  .hljs-doctag,\n  .hljs-keyword,\n  .hljs-meta .hljs-keyword,\n  .hljs-template-tag,\n  .hljs-template-variable,\n  .hljs-type,\n  .hljs-variable.language_ {\n    /* prettylights-syntax-keyword */\n    color: #ff7b72;\n  }\n\n  .hljs-title,\n  .hljs-title.class_,\n  .hljs-title.class_.inherited__,\n  .hljs-title.function_ {\n    /* prettylights-syntax-entity */\n    color: #d2a8ff;\n  }\n\n  .hljs-attr,\n  .hljs-attribute,\n  .hljs-literal,\n  .hljs-meta,\n  .hljs-number,\n  .hljs-operator,\n  .hljs-variable,\n  .hljs-selector-attr,\n  .hljs-selector-class,\n  .hljs-selector-id {\n    /* prettylights-syntax-constant */\n    color: #79c0ff;\n  }\n\n  .hljs-regexp,\n  .hljs-string,\n  .hljs-meta .hljs-string {\n    /* prettylights-syntax-string */\n    color: #a5d6ff;\n  }\n\n  .hljs-built_in,\n  .hljs-symbol {\n    /* prettylights-syntax-variable */\n    color: #ffa657;\n  }\n\n  .hljs-comment,\n  .hljs-code,\n  .hljs-formula {\n    /* prettylights-syntax-comment */\n    color: #8b949e;\n  }\n\n  .hljs-name,\n  .hljs-quote,\n  .hljs-selector-tag,\n  .hljs-selector-pseudo {\n    /* prettylights-syntax-entity-tag */\n    color: #7ee787;\n  }\n\n  .hljs-subst {\n    /* prettylights-syntax-storage-modifier-import */\n    color: #c9d1d9;\n  }\n\n  .hljs-section {\n    /* prettylights-syntax-markup-heading */\n    color: #1f6feb;\n    font-weight: bold;\n  }\n\n  .hljs-bullet {\n    /* prettylights-syntax-markup-list */\n    color: #f2cc60;\n  }\n\n  .hljs-emphasis {\n    /* prettylights-syntax-markup-italic */\n    color: #c9d1d9;\n    font-style: italic;\n  }\n\n  .hljs-strong {\n    /* prettylights-syntax-markup-bold */\n    color: #c9d1d9;\n    font-weight: bold;\n  }\n\n  .hljs-addition {\n    /* prettylights-syntax-markup-inserted */\n    color: #aff5b4;\n    background-color: #033a16;\n  }\n\n  .hljs-deletion {\n    /* prettylights-syntax-markup-deleted */\n    color: #ffdcd7;\n    background-color: #67060c;\n  }\n\n  .hljs-char.escape_,\n  .hljs-link,\n  .hljs-params,\n  .hljs-property,\n  .hljs-punctuation,\n  .hljs-tag {\n    /* purposely ignored */\n  }\n}\n"],
+  "mappings": ";AAAA;AACE;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAOF;AAEE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACE;AAAA;AAAA;AAIJ;AACE;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AAAA;AAGF;AAAA;AAAA;AAAA;AAIE;AAAA;AAGF;AAAA;AAAA;AAAA;AAIE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AAKE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAAA;AAIJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAME;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAME;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAIE;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AAAA;AAEE;AACA;AACA;AACA;AAAA;AAGF;AAAA;AAEE;AACA;AACA;AACA;AAAA;AAcF;AACE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQE;AAAA;AAGF;AAAA;AAAA;AAAA;AAKE;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWE;AAAA;AAGF;AAAA;AAAA;AAIE;AAAA;AAGF;AAAA;AAGE;AAAA;AAGF;AAAA;AAAA;AAIE;AAAA;AAGF;AAAA;AAAA;AAAA;AAKE;AAAA;AAGF;AAEE;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBA;AACE;AACE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQE;AAAA;AAGF;AAAA;AAAA;AAAA;AAKE;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWE;AAAA;AAGF;AAAA;AAAA;AAIE;AAAA;AAGF;AAAA;AAGE;AAAA;AAGF;AAAA;AAAA;AAIE;AAAA;AAGF;AAAA;AAAA;AAAA;AAKE;AAAA;AAGF;AAEE;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAEE;AACA;AAAA;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
   "names": []
 }

package/dist/index.d.ts

@@ -1 +1,2 @@
 export * from "./Markdown";
+export * from "./useToc";

package/dist/index.esm.mjs

@@ -19,7 +19,6 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 
 // src/Markdown.tsx
-import ReactMarkdown from "react-markdown";
 import remarkDirective from "remark-directive";
 import remarkDirectiveRehype from "remark-directive-rehype";
 import remarkGfm from "remark-gfm";
@@ -28,8 +27,8 @@ import remarkGemoji from "remark-gemoji";
 import remarkUnwrapImages from "remark-unwrap-images";
 import rehypeKatex from "rehype-katex";
 import rehypeHighlight from "rehype-highlight";
-import rehypeRaw from "rehype-raw";
 import { useDirectives as useDirectives2 } from "@hyperbook/provider";
+import { Drawer } from "@hyperbook/drawer";
 
 // src/Code.tsx
 import { useDirectives } from "@hyperbook/provider";
@@ -92,7 +91,10 @@ var copyNoNavigator = (text) => {
   document.execCommand("copy");
   document.body.removeChild(textarea);
 };
-var Code = ({ children, className, inline }) => {
+var Code = ({
+  children,
+  className
+}) => {
   const directives = useDirectives();
   if (className === "language-mermaid" && directives["mermaid"]) {
     const Mermaid = directives["mermaid"];
@@ -119,7 +121,7 @@ var Code = ({ children, className, inline }) => {
       }
     }
   };
-  return inline ? /* @__PURE__ */ jsxs("span", { className: "inline", children: [
+  return !className ? /* @__PURE__ */ jsxs("span", { className: "inline", children: [
     /* @__PURE__ */ jsx("code", { ref, className, children }),
     /* @__PURE__ */ jsx("button", { className: "copy", onClick: copyCode, "aria-label": "Copy Code", children: copied ? /* @__PURE__ */ jsx(MdDone, {}) : /* @__PURE__ */ jsx(MdContentCopy, {}) })
   ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -129,7 +131,8 @@ var Code = ({ children, className, inline }) => {
 };
 
 // src/Link.tsx
-import { useLink } from "@hyperbook/provider";
+import { useConfig, useLink } from "@hyperbook/provider";
+import { useEffect, useState as useState2 } from "react";
 import { jsx as jsx2 } from "react/jsx-runtime";
 function formatUrl(url) {
   if (typeof url !== "string") {
@@ -145,8 +148,31 @@ function formatUrl(url) {
   ).join("//<wbr>");
   return formatted;
 }
-var Link = ({ href, title, children }) => {
+var Link = ({
+  href,
+  title,
+  children
+}) => {
   const L = useLink();
+  const config = useConfig();
+  const [isExternal, setIsExternal] = useState2(false);
+  useEffect(() => {
+    var _a;
+    if (href) {
+      const tmp = document.createElement("a");
+      tmp.href = href;
+      if (tmp.host !== window.location.host) {
+        setIsExternal(true);
+      } else if (config.basePath && !((_a = window.location.pathname) == null ? void 0 : _a.startsWith(config.basePath))) {
+        setIsExternal(true);
+      } else {
+        setIsExternal(false);
+      }
+    }
+  }, [href, config]);
+  if (isExternal) {
+    /* @__PURE__ */ jsx2(L, { href, title, target: "_blank", children: formatUrl(children) });
+  }
   return /* @__PURE__ */ jsx2(L, { href, title, children: formatUrl(children) });
 };
 
@@ -154,24 +180,36 @@ var Link = ({ href, title, children }) => {
 import { jsx as jsx3 } from "react/jsx-runtime";
 var tableHeaders = [];
 var tdIndex = 0;
-var Table = ({ children, style }) => {
+var Table = ({
+  children,
+  style
+}) => {
   tableHeaders = [];
   return /* @__PURE__ */ jsx3("table", { style, children });
 };
-var Tr = ({ children, style }) => {
+var Tr = ({
+  children,
+  style
+}) => {
   tdIndex = 0;
   return /* @__PURE__ */ jsx3("tr", { style, children });
 };
-var Td = ({ children, style }) => {
+var Td = ({
+  children,
+  style
+}) => {
   return /* @__PURE__ */ jsx3("td", { "data-label": tableHeaders[tdIndex++], style, children });
 };
-var Th = ({ children, style }) => {
+var Th = ({
+  children,
+  style
+}) => {
   tableHeaders.push(children);
   return /* @__PURE__ */ jsx3("th", { style, children });
 };
 
 // src/Headings.tsx
-import { useBookmark, useConfig } from "@hyperbook/provider";
+import { useBookmark, useConfig as useConfig2 } from "@hyperbook/provider";
 import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
 var makeAnchor = (heading) => {
   let anchor = heading.toLowerCase();
@@ -179,9 +217,9 @@ var makeAnchor = (heading) => {
   anchor = anchor.replace(/ /g, "-");
   return anchor;
 };
-var Headings = ({ level, children, id }) => {
+var Headings = (level) => ({ children, id }) => {
   var _a;
-  const config = useConfig();
+  const config = useConfig2();
   const bookmarksConfig = (_a = config == null ? void 0 : config.elements) == null ? void 0 : _a.bookmarks;
   const heading = (children == null ? void 0 : children[0]) || "";
   let anchor = typeof heading === "string" ? makeAnchor(heading) : "";
@@ -217,11 +255,15 @@ var Headings = ({ level, children, id }) => {
 
 // src/Image.tsx
 import { useMakeUrl } from "@hyperbook/provider";
-import { useState as useState2 } from "react";
+import { useState as useState3 } from "react";
 import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
-var Image = ({ src, title, alt }) => {
+var Image = ({
+  src,
+  title,
+  alt
+}) => {
   const makeUrl = useMakeUrl();
-  const [full, setFull] = useState2(false);
+  const [full, setFull] = useState3(false);
   src = makeUrl(src, "public");
   return /* @__PURE__ */ jsxs3("figure", { className: full ? "lightbox" : void 0, children: [
     /* @__PURE__ */ jsx5("img", { src, alt, onClick: () => setFull((f) => !f) }),
@@ -272,14 +314,73 @@ var remarkCustomHeadingIds = () => {
   };
 };
 
+// src/useRemarkSync.ts
+import { Fragment as Fragment3, createElement } from "react";
+import { unified } from "unified";
+import remarkParse from "remark-parse";
+import remarkToRehype from "remark-rehype";
+import rehypeReact from "rehype-react";
+var useRemarkSync = (source, {
+  remarkToRehypeOptions,
+  rehypeReactOptions,
+  remarkPlugins = [],
+  rehypePlugins = []
+} = {}) => unified().use(remarkParse).use(remarkPlugins).use(remarkToRehype, remarkToRehypeOptions).use(rehypePlugins).use(rehypeReact, __spreadValues({
+  createElement,
+  Fragment: Fragment3
+}, rehypeReactOptions)).processSync(source).result;
+
+// src/useToc.ts
+import remarkParse2 from "remark-parse";
+import remarkStringify from "remark-stringify";
+import { unified as unified2 } from "unified";
+
+// src/remarkHeadings.ts
+import { visit as visit3 } from "unist-util-visit";
+import { toString } from "mdast-util-to-string";
+var getAnchor = (heading) => {
+  var _a;
+  if ((_a = heading == null ? void 0 : heading.data) == null ? void 0 : _a.id) {
+    return heading.data.id;
+  }
+  let anchor = toString(heading, { includeImageAlt: false }).toLowerCase();
+  anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, "");
+  anchor = anchor.replace(/ /g, "-");
+  return anchor;
+};
+var headings = (root) => {
+  const headingList = [];
+  visit3(root, "heading", (node) => {
+    const heading = {
+      level: node.depth,
+      label: toString(node, { includeImageAlt: false }),
+      anchor: getAnchor(node)
+    };
+    headingList.push(heading);
+  });
+  return headingList;
+};
+var remarkHeadings = () => {
+  return (tree, file) => {
+    file.data.headings = headings(tree);
+  };
+};
+
+// src/useToc.ts
+var useToc = (markdown) => {
+  return unified2().use(remarkCustomHeadingIds).use(remarkParse2).use(remarkStringify).use(remarkHeadings).processSync(markdown).data.headings;
+};
+
 // src/Markdown.tsx
-import { jsx as jsx6 } from "react/jsx-runtime";
-var Markdown = ({ children }) => {
+import { Fragment as Fragment4, useState as useState4 } from "react";
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+var Markdown = ({ children, showToc = true }) => {
   const directives = useDirectives2();
-  return /* @__PURE__ */ jsx6(
-    ReactMarkdown,
-    {
-      className: "hyperbook-markdown",
+  const toc = useToc(children);
+  const [isTocOpen, setIsTocOpen] = useState4(false);
+  const reactContent = useRemarkSync(children, {
+    rehypeReactOptions: {
+      passNode: true,
       components: __spreadProps(__spreadValues({}, directives), {
         a: Link,
         code: Code,
@@ -287,35 +388,61 @@ var Markdown = ({ children }) => {
         th: Th,
         table: Table,
         tr: Tr,
-        h1: Headings,
-        h2: Headings,
-        h3: Headings,
-        h4: Headings,
-        h5: Headings,
-        h6: Headings,
+        h1: Headings(1),
+        h2: Headings(2),
+        h3: Headings(3),
+        h4: Headings(4),
+        h5: Headings(5),
+        h6: Headings(6),
         img: Image
-      }),
-      remarkPlugins: [
-        remarkRemoveComments,
-        remarkCustomHeadingIds,
-        remarkDirective,
-        remarkDirectiveRehype,
-        remarkGfm,
-        remarkMath,
-        remarkGemoji,
-        remarkUnwrapImages
-      ],
-      rehypePlugins: [
-        rehypeRaw,
-        rehypeKatex,
-        [rehypeHighlight, { ignoreMissing: true, plainText: ["mermaid"] }]
-      ],
-      skipHtml: false,
-      children
-    }
-  );
+      })
+    },
+    remarkPlugins: [
+      remarkRemoveComments,
+      remarkCustomHeadingIds,
+      remarkGfm,
+      remarkDirective,
+      remarkDirectiveRehype,
+      remarkMath,
+      remarkGemoji,
+      remarkUnwrapImages
+    ],
+    rehypePlugins: [
+      rehypeKatex,
+      [rehypeHighlight, { ignoreMissing: true, plainText: ["mermaid"] }]
+    ]
+  });
+  return /* @__PURE__ */ jsxs4("div", { className: "hyperbook-markdown", children: [
+    showToc && /* @__PURE__ */ jsxs4(Fragment4, { children: [
+      /* @__PURE__ */ jsxs4(
+        "button",
+        {
+          className: isTocOpen ? "toc-toggle open" : "toc-toggle",
+          onClick: () => setIsTocOpen(!isTocOpen),
+          title: "Table of Contents",
+          children: [
+            /* @__PURE__ */ jsx6("div", { className: "bar1" }),
+            /* @__PURE__ */ jsx6("div", { className: "bar2" }),
+            /* @__PURE__ */ jsx6("div", { className: "bar3" }),
+            /* @__PURE__ */ jsx6("div", { className: "bar4" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx6(
+        Drawer,
+        {
+          isOpen: isTocOpen,
+          onClose: () => setIsTocOpen(false),
+          position: "right",
+          children: /* @__PURE__ */ jsx6("div", { id: "toc-sidebar", children: /* @__PURE__ */ jsx6("nav", { className: "toc", children: /* @__PURE__ */ jsx6("ul", { children: toc.map((h, i) => /* @__PURE__ */ jsx6("li", { className: `level-${h.level}`, children: /* @__PURE__ */ jsx6("a", { href: `#${h.anchor}`, children: h.label }) }, i)) }) }) })
+        }
+      )
+    ] }),
+    reactContent
+  ] });
 };
 export {
-  Markdown
+  Markdown,
+  useToc
 };
 //# sourceMappingURL=index.esm.mjs.map

package/dist/index.esm.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/Markdown.tsx", "../src/Code.tsx", "../src/Link.tsx", "../src/Table.tsx", "../src/Headings.tsx", "../src/Image.tsx", "../src/remarkRemoveComments.ts", "../src/remarkCustomHeadingIds.ts"],
-  "sourcesContent": ["import ReactMarkdown from \"react-markdown\";\nimport remarkDirective from \"remark-directive\";\nimport remarkDirectiveRehype from \"remark-directive-rehype\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport remarkGemoji from \"remark-gemoji\";\nimport remarkUnwrapImages from \"remark-unwrap-images\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport rehypeRaw from \"rehype-raw\";\nimport { useDirectives } from \"@hyperbook/provider\";\nimport { Code } from \"./Code\";\nimport { Link } from \"./Link\";\nimport { Table, Td, Th, Tr } from \"./Table\";\nimport { Headings } from \"./Headings\";\nimport { Image } from \"./Image\";\n\nimport \"./index.css\";\nimport { remarkRemoveComments } from \"./remarkRemoveComments\";\nimport { remarkCustomHeadingIds } from \"./remarkCustomHeadingIds\";\n\nexport type MarkdownProps = {\n  children: string;\n};\n\nexport const Markdown = ({ children }: MarkdownProps) => {\n  const directives = useDirectives();\n\n  return (\n    <ReactMarkdown\n      className=\"hyperbook-markdown\"\n      components={{\n        ...directives,\n        a: Link,\n        code: Code,\n        td: Td,\n        th: Th,\n        table: Table,\n        tr: Tr,\n        h1: Headings,\n        h2: Headings,\n        h3: Headings,\n        h4: Headings,\n        h5: Headings,\n        h6: Headings,\n        img: Image,\n      }}\n      remarkPlugins={[\n        remarkRemoveComments,\n        remarkCustomHeadingIds,\n        remarkDirective,\n        remarkDirectiveRehype,\n        remarkGfm,\n        remarkMath,\n        remarkGemoji,\n        remarkUnwrapImages,\n      ]}\n      rehypePlugins={[\n        rehypeRaw,\n        rehypeKatex,\n        [rehypeHighlight, { ignoreMissing: true, plainText: [\"mermaid\"] }],\n      ]}\n      skipHtml={false}\n    >\n      {children}\n    </ReactMarkdown>\n  );\n};\n", "import { useDirectives } from \"@hyperbook/provider\";\nimport { Fragment, useRef, useState } from \"react\";\nimport { Components } from \"react-markdown\";\n\nconst MdContentCopy = () => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      stroke=\"currentColor\"\n      fill=\"currentColor\"\n      strokeWidth=\"0\"\n      height=\"1em\"\n      width=\"1em\"\n      viewBox=\"0 0 24 24\"\n    >\n      <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\" />\n    </svg>\n  );\n};\n\nconst MdDone = () => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      stroke=\"currentColor\"\n      fill=\"currentColor\"\n      strokeWidth=\"0\"\n      height=\"1em\"\n      width=\"1em\"\n      viewBox=\"0 0 24 24\"\n    >\n      <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z\" />\n    </svg>\n  );\n};\n\nconst copyNoNavigator = (text: string) => {\n  const isIos = navigator.userAgent.match(/ipad|iphone/i);\n  const textarea = document.createElement(\"textarea\");\n\n  // create textarea\n  textarea.value = text;\n\n  // ios will zoom in on the input if the font-size is < 16px\n  textarea.style.fontSize = \"20px\";\n  document.body.appendChild(textarea);\n\n  // select text\n  if (isIos) {\n    const range = document.createRange();\n    range.selectNodeContents(textarea);\n\n    const selection = window.getSelection();\n    if (selection) {\n      selection.removeAllRanges();\n      selection.addRange(range);\n    }\n    textarea.setSelectionRange(0, 999999);\n  } else {\n    textarea.select();\n  }\n\n  // copy selection\n  document.execCommand(\"copy\");\n\n  // cleanup\n  document.body.removeChild(textarea);\n};\n\nexport const Code: Components[\"code\"] = ({ children, className, inline }) => {\n  const directives = useDirectives();\n  if (className === \"language-mermaid\" && directives[\"mermaid\"]) {\n    const Mermaid = directives[\"mermaid\"];\n    return <Mermaid children={children} />;\n  }\n\n  const ref = useRef<HTMLElement>(null);\n  const [copied, setCopied] = useState(false);\n  const copyCode = () => {\n    if (ref.current) {\n      const text = ref.current.innerText;\n      if (navigator.clipboard) {\n        navigator.clipboard\n          .writeText(text)\n          .then(() => {\n            setCopied(true);\n            setTimeout(() => setCopied(false), 2000);\n          })\n          .catch(() => {\n            copyNoNavigator(text);\n            setCopied(true);\n            setTimeout(() => setCopied(false), 2000);\n          });\n      } else {\n        copyNoNavigator(text);\n        setCopied(true);\n        setTimeout(() => setCopied(false), 2000);\n      }\n    }\n  };\n\n  return inline ? (\n    <span className=\"inline\">\n      <code ref={ref} className={className}>\n        {children}\n      </code>\n      <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n        {copied ? <MdDone /> : <MdContentCopy />}\n      </button>\n    </span>\n  ) : (\n    <Fragment>\n      <code ref={ref} className={className}>\n        {children}\n      </code>\n      <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n        {copied ? <MdDone /> : <MdContentCopy />}\n      </button>\n    </Fragment>\n  );\n};\n", "import { useLink } from \"@hyperbook/provider\";\nimport { ReactNode } from \"react\";\nimport { Components } from \"react-markdown\";\n\n// see: https://css-tricks.com/better-line-breaks-for-long-urls/\nfunction formatUrl(url: ReactNode) {\n  if (typeof url !== \"string\") {\n    return url;\n  }\n  // Split the URL into an array to distinguish double slashes from single slashes\n  var doubleSlash = url.split(\"//\");\n\n  // Format the strings on either side of double slashes separately\n  var formatted = doubleSlash\n    .map(\n      (str) =>\n        // Insert a word break opportunity after a colon\n        str\n          .replace(/(?<after>:)/giu, \"$1<wbr>\")\n          // Before a single slash, tilde, period, comma, hyphen, underline, question mark, number sign, or percent symbol\n          .replace(/(?<before>[/~.,\\-_?#%])/giu, \"<wbr>$1\")\n          // Before and after an equals sign or ampersand\n          .replace(/(?<beforeAndAfter>[=&])/giu, \"<wbr>$1<wbr>\")\n      // Reconnect the strings with word break opportunities after double slashes\n    )\n    .join(\"//<wbr>\");\n\n  return formatted;\n}\n\nexport const Link: Components[\"a\"] = ({ href, title, children }) => {\n  const L = useLink();\n\n  return (\n    <L href={href} title={title}>\n      {formatUrl(children)}\n    </L>\n  );\n};\n", "import { ReactNode } from \"react\";\nimport { Components } from \"react-markdown\";\n\nlet tableHeaders: ReactNode[][] = [];\nlet tdIndex = 0;\n\nexport const Table: Components[\"table\"] = ({ children, style }) => {\n  tableHeaders = [];\n  return <table style={style}>{children}</table>;\n};\n\nexport const Tr: Components[\"tr\"] = ({ children, style }) => {\n  tdIndex = 0;\n  return <tr style={style}>{children}</tr>;\n};\n\nexport const Td: Components[\"td\"] = ({ children, style }) => {\n  return (\n    <td data-label={tableHeaders[tdIndex++]} style={style}>\n      {children}\n    </td>\n  );\n};\n\nexport const Th: Components[\"th\"] = ({ children, style }) => {\n  tableHeaders.push(children);\n  return <th style={style}>{children}</th>;\n};\n", "import { useBookmark, useConfig } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const makeAnchor = (heading: string) => {\n  // If we have a heading, make it lower case\n  let anchor = heading.toLowerCase();\n\n  // Clean anchor (replace special characters whitespaces).\n  // Alternatively, use encodeURIComponent() if you don't care about\n  // pretty anchor links\n  anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, \"\");\n  anchor = anchor.replace(/ /g, \"-\");\n\n  return anchor;\n};\n\nexport const Headings: Components[\"h1\"] = ({ level, children, id }) => {\n  const config = useConfig();\n  const bookmarksConfig = config?.elements?.bookmarks;\n  // Access actual (string) value of heading\n  const heading = children?.[0] || \"\";\n\n  // If we have a heading, make it lower case\n  let anchor = typeof heading === \"string\" ? makeAnchor(heading) : \"\";\n\n  const label = typeof heading === \"string\" ? heading : anchor;\n\n  const [bookmark, toggleBookmark] = useBookmark(anchor, label);\n\n  // Utility\n  const container = (children: React.ReactNode): JSX.Element => (\n    <>\n      <a className=\"heading\" id={id ?? anchor} href={`#${id ?? anchor}`}>\n        <span>{children}</span>\n      </a>\n      {bookmarksConfig !== false && (\n        <button\n          className={bookmark ? \"bookmark active\" : \"bookmark\"}\n          onClick={() => toggleBookmark()}\n          title=\"Bookmark\"\n        >\n          \uD83D\uDD16\n        </button>\n      )}\n    </>\n  );\n\n  switch (level) {\n    case 1:\n      return <h1>{container(children)}</h1>;\n    case 2:\n      return <h2>{container(children)}</h2>;\n    case 3:\n      return <h3>{container(children)}</h3>;\n    case 4:\n      return <h4>{container(children)}</h4>;\n    case 5:\n      return <h5>{container(children)}</h5>;\n\n    default:\n      return <h6>{container(children)}</h6>;\n  }\n};\n", "import { useMakeUrl } from \"@hyperbook/provider\";\nimport { useState } from \"react\";\nimport { Components } from \"react-markdown\";\n\nexport const Image: Components[\"img\"] = ({ src, title, alt }) => {\n  const makeUrl = useMakeUrl();\n  const [full, setFull] = useState(false);\n  src = makeUrl(src, \"public\");\n\n  return (\n    <figure className={full ? \"lightbox\" : undefined}>\n      <img src={src} alt={alt} onClick={() => setFull((f) => !f)} />\n      {title && <figcaption>{title}</figcaption>}\n    </figure>\n  );\n};\n", "//@ts-nocheck\nimport { visit, SKIP } from \"unist-util-visit\";\nimport { Transformer } from \"unified\";\nimport { BuildVisitor } from \"unist-util-visit/complex-types\";\n\nexport const remarkRemoveComments: () => Transformer = () => (tree) => {\n  const htmlCommentRegex = /<!--([\\s\\S]*?)-->/g;\n\n  const handler: BuildVisitor = (node, index, parent) => {\n    const isComment = node.value.match(htmlCommentRegex);\n\n    if (isComment) {\n      // remove node\n      parent.children.splice(index, 1);\n      // Do not traverse `node`, continue at the node *now* at `index`. http://unifiedjs.com/learn/recipe/remove-node/\n      return [SKIP, index];\n    }\n  };\n\n  visit(tree, \"html\", handler);\n\n  visit(tree, \"jsx\", handler);\n};\n", "import { visit } from \"unist-util-visit\";\nimport { Transformer } from \"unified\";\n\nexport const remarkCustomHeadingIds: () => Transformer = () => {\n  return function (node) {\n    visit(node, \"heading\", (node) => {\n      let lastChild = node.children[node.children.length - 1];\n      if (lastChild && lastChild.type === \"text\") {\n        let string = lastChild.value.replace(/ +$/, \"\");\n        let matched = string.match(/ {#([^]+?)}$/);\n\n        if (matched) {\n          let id = matched[1];\n          if (!!id.length) {\n            if (!node.data) {\n              node.data = {};\n            }\n            if (!node.data.hProperties) {\n              node.data.hProperties = {};\n            }\n            node.data.id = node.data.hProperties.id = id;\n\n            string = string.substring(0, matched.index);\n            lastChild.value = string;\n          }\n        }\n      }\n    });\n  };\n};\n"],
-  "mappings": "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",
-  "names": ["useDirectives", "jsx", "jsx", "Fragment", "jsx", "jsxs", "children", "useState", "jsx", "jsxs", "visit", "node", "jsx", "useDirectives"]
+  "sources": ["../src/Markdown.tsx", "../src/Code.tsx", "../src/Link.tsx", "../src/Table.tsx", "../src/Headings.tsx", "../src/Image.tsx", "../src/remarkRemoveComments.ts", "../src/remarkCustomHeadingIds.ts", "../src/useRemarkSync.ts", "../src/useToc.ts", "../src/remarkHeadings.ts"],
+  "sourcesContent": ["import remarkDirective from \"remark-directive\";\nimport remarkDirectiveRehype from \"remark-directive-rehype\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport remarkGemoji from \"remark-gemoji\";\nimport remarkUnwrapImages from \"remark-unwrap-images\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport { useDirectives } from \"@hyperbook/provider\";\nimport { Drawer } from \"@hyperbook/drawer\";\nimport { Code } from \"./Code\";\nimport { Link } from \"./Link\";\nimport { Table, Td, Th, Tr } from \"./Table\";\nimport { Headings } from \"./Headings\";\nimport { Image } from \"./Image\";\n\nimport \"./index.css\";\nimport { remarkRemoveComments } from \"./remarkRemoveComments\";\nimport { remarkCustomHeadingIds } from \"./remarkCustomHeadingIds\";\nimport { useRemarkSync } from \"./useRemarkSync\";\nimport { useToc } from \"./useToc\";\nimport { Fragment, useState } from \"react\";\n\nexport type MarkdownProps = {\n  children: string;\n  showToc?: boolean;\n};\n\nexport const Markdown = ({ children, showToc = true }: MarkdownProps) => {\n  const directives = useDirectives();\n\n  const toc = useToc(children);\n  const [isTocOpen, setIsTocOpen] = useState(false);\n  const reactContent = useRemarkSync(children, {\n    rehypeReactOptions: {\n      passNode: true,\n      components: {\n        ...directives,\n        a: Link,\n        code: Code,\n        td: Td,\n        th: Th,\n        table: Table,\n        tr: Tr,\n        h1: Headings(1),\n        h2: Headings(2),\n        h3: Headings(3),\n        h4: Headings(4),\n        h5: Headings(5),\n        h6: Headings(6),\n        img: Image,\n      },\n    },\n    remarkPlugins: [\n      remarkRemoveComments,\n      remarkCustomHeadingIds,\n      remarkGfm,\n      remarkDirective,\n      remarkDirectiveRehype,\n      remarkMath,\n      remarkGemoji,\n      remarkUnwrapImages,\n    ],\n    rehypePlugins: [\n      rehypeKatex,\n      [rehypeHighlight, { ignoreMissing: true, plainText: [\"mermaid\"] }],\n    ],\n  });\n\n  return (\n    <div className=\"hyperbook-markdown\">\n      {showToc && (\n        <Fragment>\n          <button\n            className={isTocOpen ? \"toc-toggle open\" : \"toc-toggle\"}\n            onClick={() => setIsTocOpen(!isTocOpen)}\n            title=\"Table of Contents\"\n          >\n            <div className=\"bar1\"></div>\n            <div className=\"bar2\"></div>\n            <div className=\"bar3\"></div>\n            <div className=\"bar4\"></div>\n          </button>\n          <Drawer\n            isOpen={isTocOpen}\n            onClose={() => setIsTocOpen(false)}\n            position=\"right\"\n          >\n            <div id=\"toc-sidebar\">\n              <nav className=\"toc\">\n                <ul>\n                  {toc.map((h, i) => (\n                    <li key={i} className={`level-${h.level}`}>\n                      <a href={`#${h.anchor}`}>{h.label}</a>\n                    </li>\n                  ))}\n                </ul>\n              </nav>\n            </div>\n          </Drawer>\n        </Fragment>\n      )}\n      {reactContent}\n    </div>\n  );\n};\n", "import { useDirectives } from \"@hyperbook/provider\";\nimport { ComponentType, Fragment, useRef, useState } from \"react\";\n\nconst MdContentCopy = () => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      stroke=\"currentColor\"\n      fill=\"currentColor\"\n      strokeWidth=\"0\"\n      height=\"1em\"\n      width=\"1em\"\n      viewBox=\"0 0 24 24\"\n    >\n      <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\" />\n    </svg>\n  );\n};\n\nconst MdDone = () => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      stroke=\"currentColor\"\n      fill=\"currentColor\"\n      strokeWidth=\"0\"\n      height=\"1em\"\n      width=\"1em\"\n      viewBox=\"0 0 24 24\"\n    >\n      <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z\" />\n    </svg>\n  );\n};\n\nconst copyNoNavigator = (text: string) => {\n  const isIos = navigator.userAgent.match(/ipad|iphone/i);\n  const textarea = document.createElement(\"textarea\");\n\n  // create textarea\n  textarea.value = text;\n\n  // ios will zoom in on the input if the font-size is < 16px\n  textarea.style.fontSize = \"20px\";\n  document.body.appendChild(textarea);\n\n  // select text\n  if (isIos) {\n    const range = document.createRange();\n    range.selectNodeContents(textarea);\n\n    const selection = window.getSelection();\n    if (selection) {\n      selection.removeAllRanges();\n      selection.addRange(range);\n    }\n    textarea.setSelectionRange(0, 999999);\n  } else {\n    textarea.select();\n  }\n\n  // copy selection\n  document.execCommand(\"copy\");\n\n  // cleanup\n  document.body.removeChild(textarea);\n};\n\nexport const Code: ComponentType<JSX.IntrinsicElements[\"code\"]> = ({\n  children,\n  className,\n}) => {\n  const directives = useDirectives();\n  if (className === \"language-mermaid\" && directives[\"mermaid\"]) {\n    const Mermaid = directives[\"mermaid\"];\n    return <Mermaid children={children} />;\n  }\n\n  const ref = useRef<HTMLElement>(null);\n  const [copied, setCopied] = useState(false);\n  const copyCode = () => {\n    if (ref.current) {\n      const text = ref.current.innerText;\n      if (navigator.clipboard) {\n        navigator.clipboard\n          .writeText(text)\n          .then(() => {\n            setCopied(true);\n            setTimeout(() => setCopied(false), 2000);\n          })\n          .catch(() => {\n            copyNoNavigator(text);\n            setCopied(true);\n            setTimeout(() => setCopied(false), 2000);\n          });\n      } else {\n        copyNoNavigator(text);\n        setCopied(true);\n        setTimeout(() => setCopied(false), 2000);\n      }\n    }\n  };\n\n  return !className ? (\n    <span className=\"inline\">\n      <code ref={ref} className={className}>\n        {children}\n      </code>\n      <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n        {copied ? <MdDone /> : <MdContentCopy />}\n      </button>\n    </span>\n  ) : (\n    <Fragment>\n      <code ref={ref} className={className}>\n        {children}\n      </code>\n      <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n        {copied ? <MdDone /> : <MdContentCopy />}\n      </button>\n    </Fragment>\n  );\n};\n", "import { useConfig, useLink } from \"@hyperbook/provider\";\nimport { ComponentType, ReactNode, useEffect, useState } from \"react\";\n\n// see: https://css-tricks.com/better-line-breaks-for-long-urls/\nfunction formatUrl(url: ReactNode) {\n  if (typeof url !== \"string\") {\n    return url;\n  }\n  // Split the URL into an array to distinguish double slashes from single slashes\n  var doubleSlash = url.split(\"//\");\n\n  // Format the strings on either side of double slashes separately\n  var formatted = doubleSlash\n    .map(\n      (str) =>\n        // Insert a word break opportunity after a colon\n        str\n          .replace(/(?<after>:)/giu, \"$1<wbr>\")\n          // Before a single slash, tilde, period, comma, hyphen, underline, question mark, number sign, or percent symbol\n          .replace(/(?<before>[/~.,\\-_?#%])/giu, \"<wbr>$1\")\n          // Before and after an equals sign or ampersand\n          .replace(/(?<beforeAndAfter>[=&])/giu, \"<wbr>$1<wbr>\")\n      // Reconnect the strings with word break opportunities after double slashes\n    )\n    .join(\"//<wbr>\");\n\n  return formatted;\n}\n\nexport const Link: ComponentType<JSX.IntrinsicElements[\"a\"]> = ({\n  href,\n  title,\n  children,\n}) => {\n  const L = useLink();\n  const config = useConfig();\n  const [isExternal, setIsExternal] = useState(false);\n\n  useEffect(() => {\n    if (href) {\n      const tmp = document.createElement(\"a\");\n      tmp.href = href;\n      if (tmp.host !== window.location.host) {\n        setIsExternal(true);\n      } else if (\n        config.basePath &&\n        !window.location.pathname?.startsWith(config.basePath)\n      ) {\n        setIsExternal(true);\n      } else {\n        setIsExternal(false);\n      }\n    }\n  }, [href, config]);\n\n  if (isExternal) {\n    <L href={href} title={title} target=\"_blank\">\n      {formatUrl(children)}\n    </L>;\n  }\n\n  return (\n    <L href={href} title={title}>\n      {formatUrl(children)}\n    </L>\n  );\n};\n", "import { ComponentType, ReactNode } from \"react\";\n\nlet tableHeaders: ReactNode[] = [];\nlet tdIndex = 0;\n\nexport const Table: ComponentType<JSX.IntrinsicElements[\"table\"]> = ({\n  children,\n  style,\n}) => {\n  tableHeaders = [];\n  return <table style={style}>{children}</table>;\n};\n\nexport const Tr: ComponentType<JSX.IntrinsicElements[\"tr\"]> = ({\n  children,\n  style,\n}) => {\n  tdIndex = 0;\n  return <tr style={style}>{children}</tr>;\n};\n\nexport const Td: ComponentType<JSX.IntrinsicElements[\"td\"]> = ({\n  children,\n  style,\n}) => {\n  return (\n    <td data-label={tableHeaders[tdIndex++]} style={style}>\n      {children}\n    </td>\n  );\n};\n\nexport const Th: ComponentType<JSX.IntrinsicElements[\"th\"]> = ({\n  children,\n  style,\n}) => {\n  tableHeaders.push(children);\n  return <th style={style}>{children}</th>;\n};\n", "import { useBookmark, useConfig } from \"@hyperbook/provider\";\nimport { ComponentType } from \"react\";\n\nexport const makeAnchor = (heading: string) => {\n  // If we have a heading, make it lower case\n  let anchor = heading.toLowerCase();\n\n  // Clean anchor (replace special characters whitespaces).\n  // Alternatively, use encodeURIComponent() if you don't care about\n  // pretty anchor links\n  anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, \"\");\n  anchor = anchor.replace(/ /g, \"-\");\n\n  return anchor;\n};\n\nexport const Headings =\n  (level: number): ComponentType<JSX.IntrinsicElements[\"h1\"]> =>\n  ({ children, id }) => {\n    const config = useConfig();\n    const bookmarksConfig = config?.elements?.bookmarks;\n    // Access actual (string) value of heading\n    const heading = children?.[0] || \"\";\n\n    // If we have a heading, make it lower case\n    let anchor = typeof heading === \"string\" ? makeAnchor(heading) : \"\";\n\n    const label = typeof heading === \"string\" ? heading : anchor;\n\n    const [bookmark, toggleBookmark] = useBookmark(anchor, label);\n\n    // Utility\n    const container = (children: React.ReactNode): JSX.Element => (\n      <>\n        <a className=\"heading\" id={id ?? anchor} href={`#${id ?? anchor}`}>\n          <span>{children}</span>\n        </a>\n        {bookmarksConfig !== false && (\n          <button\n            className={bookmark ? \"bookmark active\" : \"bookmark\"}\n            onClick={() => toggleBookmark()}\n            title=\"Bookmark\"\n          >\n            \uD83D\uDD16\n          </button>\n        )}\n      </>\n    );\n\n    switch (level) {\n      case 1:\n        return <h1>{container(children)}</h1>;\n      case 2:\n        return <h2>{container(children)}</h2>;\n      case 3:\n        return <h3>{container(children)}</h3>;\n      case 4:\n        return <h4>{container(children)}</h4>;\n      case 5:\n        return <h5>{container(children)}</h5>;\n\n      default:\n        return <h6>{container(children)}</h6>;\n    }\n  };\n", "import { useMakeUrl } from \"@hyperbook/provider\";\nimport { ComponentType, useState } from \"react\";\n\nexport const Image: ComponentType<JSX.IntrinsicElements[\"img\"]> = ({\n  src,\n  title,\n  alt,\n}) => {\n  const makeUrl = useMakeUrl();\n  const [full, setFull] = useState(false);\n  src = makeUrl(src, \"public\");\n\n  return (\n    <figure className={full ? \"lightbox\" : undefined}>\n      <img src={src} alt={alt} onClick={() => setFull((f) => !f)} />\n      {title && <figcaption>{title}</figcaption>}\n    </figure>\n  );\n};\n", "//@ts-nocheck\nimport { visit, SKIP } from \"unist-util-visit\";\nimport { Transformer } from \"unified\";\nimport { BuildVisitor } from \"unist-util-visit/complex-types\";\n\nexport const remarkRemoveComments: () => Transformer = () => (tree) => {\n  const htmlCommentRegex = /<!--([\\s\\S]*?)-->/g;\n\n  const handler: BuildVisitor = (node, index, parent) => {\n    const isComment = node.value.match(htmlCommentRegex);\n\n    if (isComment) {\n      // remove node\n      parent.children.splice(index, 1);\n      // Do not traverse `node`, continue at the node *now* at `index`. http://unifiedjs.com/learn/recipe/remove-node/\n      return [SKIP, index];\n    }\n  };\n\n  visit(tree, \"html\", handler);\n\n  visit(tree, \"jsx\", handler);\n};\n", "import { visit } from \"unist-util-visit\";\nimport { Transformer } from \"unified\";\n\nexport const remarkCustomHeadingIds: () => Transformer = () => {\n  return function (node) {\n    visit(node, \"heading\", (node) => {\n      let lastChild = node.children[node.children.length - 1];\n      if (lastChild && lastChild.type === \"text\") {\n        let string = lastChild.value.replace(/ +$/, \"\");\n        let matched = string.match(/ {#([^]+?)}$/);\n\n        if (matched) {\n          let id = matched[1];\n          if (!!id.length) {\n            if (!node.data) {\n              node.data = {};\n            }\n            if (!node.data.hProperties) {\n              node.data.hProperties = {};\n            }\n            node.data.id = node.data.hProperties.id = id;\n\n            string = string.substring(0, matched.index);\n            lastChild.value = string;\n          }\n        }\n      }\n    });\n  };\n};\n", "import { Fragment, ReactElement, createElement } from \"react\";\nimport { unified, PluggableList } from \"unified\";\nimport remarkParse from \"remark-parse\";\nimport { Options as RemarkRehypeOptions } from \"mdast-util-to-hast\";\nimport remarkToRehype from \"remark-rehype\";\nimport rehypeReact, { Options as RehypeReactOptions } from \"rehype-react\";\n\ntype PartialBy<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;\n\nexport interface UseRemarkSyncOptions {\n  remarkToRehypeOptions?: RemarkRehypeOptions;\n  rehypeReactOptions?: PartialBy<RehypeReactOptions, \"createElement\">;\n  remarkPlugins?: PluggableList;\n  rehypePlugins?: PluggableList;\n}\n\nexport const useRemarkSync = (\n  source: string,\n  {\n    remarkToRehypeOptions,\n    rehypeReactOptions,\n    remarkPlugins = [],\n    rehypePlugins = [],\n  }: UseRemarkSyncOptions = {}\n): ReactElement =>\n  unified()\n    .use(remarkParse)\n    .use(remarkPlugins)\n    .use(remarkToRehype, remarkToRehypeOptions)\n    .use(rehypePlugins)\n    .use(rehypeReact, {\n      createElement,\n      Fragment,\n      ...rehypeReactOptions,\n    } as RehypeReactOptions)\n    .processSync(source).result as ReactElement;\n", "import remarkParse from \"remark-parse\";\nimport remarkStringify from \"remark-stringify\";\nimport { unified } from \"unified\";\nimport { remarkCustomHeadingIds } from \"./remarkCustomHeadingIds\";\nimport { Heading, remarkHeadings } from \"./remarkHeadings\";\n\nexport const useToc = (markdown: string): Heading[] => {\n  return unified()\n    .use(remarkCustomHeadingIds)\n    .use(remarkParse)\n    .use(remarkStringify)\n    .use(remarkHeadings)\n    .processSync(markdown).data.headings;\n};\n", "import { Plugin } from \"unified\";\nimport { Root as MdastRoot, Heading as AstHeading } from \"mdast\";\nimport { Root as HastRoot } from \"hast\";\nimport { visit } from \"unist-util-visit\";\nimport { toString } from \"mdast-util-to-string\";\n\nexport interface Heading {\n  level: number;\n  label: string;\n  anchor: string;\n}\n\nconst getAnchor = (heading: AstHeading): string => {\n  // If we have a heading, make it lower case\n  if (heading?.data?.id) {\n    return heading.data.id as string;\n  }\n\n  let anchor = toString(heading, { includeImageAlt: false }).toLowerCase();\n\n  // Clean anchor (replace special characters whitespaces).\n  // Alternatively, use encodeURIComponent() if you don't care about\n  // pretty anchor links\n  anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, \"\");\n  anchor = anchor.replace(/ /g, \"-\");\n\n  return anchor;\n};\n\nconst headings = (root: MdastRoot) => {\n  const headingList: Heading[] = [];\n\n  visit(root, \"heading\", (node: AstHeading) => {\n    const heading: Heading = {\n      level: node.depth,\n      label: toString(node, { includeImageAlt: false }),\n      anchor: getAnchor(node),\n    };\n\n    headingList.push(heading);\n  });\n\n  return headingList;\n};\n\nexport const remarkHeadings: Plugin<[], MdastRoot, HastRoot> = () => {\n  return (tree, file) => {\n    file.data.headings = headings(tree);\n  };\n};\n"],
+  "mappings": "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",
+  "names": ["useDirectives", "useState", "jsx", "jsx", "useConfig", "Fragment", "jsx", "jsxs", "children", "useState", "jsx", "jsxs", "visit", "node", "Fragment", "Fragment", "remarkParse", "unified", "visit", "unified", "remarkParse", "Fragment", "useState", "jsx", "jsxs", "useDirectives", "useState", "Fragment"]
 }

package/dist/remarkHeadings.d.ts

@@ -0,0 +1,9 @@
+import { Plugin } from "unified";
+import { Root as MdastRoot } from "mdast";
+import { Root as HastRoot } from "hast";
+export interface Heading {
+    level: number;
+    label: string;
+    anchor: string;
+}
+export declare const remarkHeadings: Plugin<[], MdastRoot, HastRoot>;

package/dist/useRemarkSync.d.ts

@@ -0,0 +1,13 @@
+import { ReactElement } from "react";
+import { PluggableList } from "unified";
+import { Options as RemarkRehypeOptions } from "mdast-util-to-hast";
+import { Options as RehypeReactOptions } from "rehype-react";
+type PartialBy<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
+export interface UseRemarkSyncOptions {
+    remarkToRehypeOptions?: RemarkRehypeOptions;
+    rehypeReactOptions?: PartialBy<RehypeReactOptions, "createElement">;
+    remarkPlugins?: PluggableList;
+    rehypePlugins?: PluggableList;
+}
+export declare const useRemarkSync: (source: string, { remarkToRehypeOptions, rehypeReactOptions, remarkPlugins, rehypePlugins, }?: UseRemarkSyncOptions) => ReactElement;
+export {};

package/dist/useToc.d.ts

@@ -0,0 +1,2 @@
+import { Heading } from "./remarkHeadings";
+export declare const useToc: (markdown: string) => Heading[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperbook/markdown",
-  "version": "0.6.4",
+  "version": "0.8.0",
   "author": "Mike Barkmin",
   "homepage": "https://github.com/openpatch/hyperbook#readme",
   "license": "MIT",
@@ -32,17 +32,22 @@
     "url": "https://github.com/openpatch/hyperbook/issues"
   },
   "dependencies": {
-    "react-markdown": "8.0.7",
+    "mdast-util-to-hast": "^12.3.0",
+    "mdast-util-to-string": "^3.2.0",
     "rehype-highlight": "5.0.2",
     "rehype-katex": "6.0.3",
+    "rehype-parse": "^8.0.4",
     "rehype-raw": "^6.1.1",
+    "rehype-react": "^7.2.0",
     "remark-directive": "2.0.1",
     "remark-directive-rehype": "0.4.2",
     "remark-gemoji": "7.0.1",
     "remark-math": "5.1.1",
+    "remark-stringify": "^10.0.3",
     "remark-unwrap-images": "3.0.1",
     "unist-util-visit": "^4.1.1",
-    "@hyperbook/provider": "0.2.5"
+    "@hyperbook/provider": "0.3.0",
+    "@hyperbook/drawer": "0.0.0"
   },
   "peerDependencies": {
     "react": "18.x",
@@ -50,6 +55,7 @@
   },
   "devDependencies": {
     "@types/hast": "2.3.4",
+    "@types/mdast": "^3.0.11",
     "@types/react": "18.2.12",
     "@types/react-dom": "18.2.5",
     "@types/unist": "2.0.6",