@apify/docs-theme 1.0.134 → 1.0.136

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@apify/docs-theme",
-    "version": "1.0.134",
+    "version": "1.0.136",
     "description": "",
     "main": "./src/index.js",
     "files": [
@@ -19,7 +19,7 @@
         "access": "public"
     },
     "dependencies": {
-        "@apify/docs-search-modal": "^1.1.0",
+        "@apify/docs-search-modal": "^1.1.1",
         "@docusaurus/theme-common": "^3.5.2",
         "@stackql/docusaurus-plugin-hubspot": "^1.1.0",
         "axios": "^1.7.4",

package/src/theme/TOCItems/Tree.jsx

@@ -0,0 +1,41 @@
+import Link from '@docusaurus/Link';
+import clsx from 'clsx';
+import React from 'react';
+
+import styles from './styles.module.css';
+
+// Recursive component rendering the toc tree
+function TOCItemTree({
+    toc,
+    className,
+    linkClassName,
+    isChild,
+}) {
+    if (!toc.length) {
+        return null;
+    }
+    return (
+        <ul className={isChild ? undefined : className}>
+            {toc.map((heading) => (
+                <li key={heading.id}>
+                    <Link
+                        to={`#${heading.id}`}
+                        className={clsx(styles.apifyTocLink, linkClassName ?? undefined)}
+                        data-label={heading.value}
+                        // Developer provided the HTML, so assume it's safe.
+                        dangerouslySetInnerHTML={{ __html: heading.value }}
+                    />
+                    <TOCItemTree
+                        isChild
+                        toc={heading.children}
+                        className={className}
+                        linkClassName={linkClassName}
+                    />
+                </li>
+            ))}
+        </ul>
+    );
+}
+
+// Memo only the tree root is enough
+export default React.memo(TOCItemTree);

package/src/theme/TOCItems/index.jsx

@@ -0,0 +1,50 @@
+import { useThemeConfig } from '@docusaurus/theme-common';
+import {
+    useTOCHighlight,
+    useFilteredAndTreeifiedTOC,
+} from '@docusaurus/theme-common/internal';
+import TOCItemTree from '@theme/TOCItems/Tree';
+import React, { useMemo } from 'react';
+
+export default function TOCItems({
+    toc,
+    className = 'table-of-contents table-of-contents__left-border',
+    linkClassName = 'table-of-contents__link',
+    linkActiveClassName = undefined,
+    minHeadingLevel: minHeadingLevelOption,
+    maxHeadingLevel: maxHeadingLevelOption,
+    ...props
+}) {
+    const themeConfig = useThemeConfig();
+
+    const minHeadingLevel = minHeadingLevelOption ?? themeConfig.tableOfContents.minHeadingLevel;
+    const maxHeadingLevel = maxHeadingLevelOption ?? themeConfig.tableOfContents.maxHeadingLevel;
+
+    const tocTree = useFilteredAndTreeifiedTOC({
+        toc,
+        minHeadingLevel,
+        maxHeadingLevel,
+    });
+
+    const tocHighlightConfig = useMemo(() => {
+        if (linkClassName && linkActiveClassName) {
+            return {
+                linkClassName,
+                linkActiveClassName,
+                minHeadingLevel,
+                maxHeadingLevel,
+            };
+        }
+        return undefined;
+    }, [linkClassName, linkActiveClassName, minHeadingLevel, maxHeadingLevel]);
+    useTOCHighlight(tocHighlightConfig);
+
+    return (
+        <TOCItemTree
+            toc={tocTree}
+            className={className}
+            linkClassName={linkClassName}
+            {...props}
+        />
+    );
+}

package/src/theme/TOCItems/styles.module.css

@@ -0,0 +1,12 @@
+.apifyTocLink {
+    display: block;
+}
+
+.apifyTocLink::before {
+    display: block;
+    content: attr(data-label);
+    font-weight: 700;
+    height: 0;
+    overflow: hidden;
+    visibility: hidden;
+}

package/src/theme/custom.css

@@ -1549,6 +1549,7 @@ html[data-theme='dark'] .runnable-code-block svg .apify-logo {
 .prism-code.language-javascript .token-line::before,
 .prism-code.language-json .token-line::before,
 .prism-code.language-json5 .token-line::before,
+.prism-code.language-py .token-line::before,
 .prism-code.language-python .token-line::before,
 .prism-code.language-dockerfile .token-line::before,
 .prism-code.language-XML .token-line::before,