docstra 1.2.0 → 1.4.0

package/README.md

@@ -4,6 +4,8 @@ Docstra is a modern documentation framework for Next.js. It's built with Tailwin
 
 > Documentation of Docstra is coming soon. Stay tuned!
 
+> For any questions, feel free to reach out us on [contact@sudhucodes.com](mailto:contact@sudhucodes.com)
+
 ## Features
 
 - MDX support

package/dist/client/index.d.mts

@@ -7,10 +7,22 @@ interface DocstraContextType {
     docstraConfig: DocstraConfig;
     openSearchBox: boolean;
     setOpenSearchBox: (open: boolean) => void;
+    mdxData: mdxDataContent;
+}
+interface mdxDataContent {
+    metadata: Record<string, any>;
+    mdxContent: string;
+    rawMdxContent: string;
+    mdxFilePath: string;
 }
 interface DocstraConfig {
     siteName?: string;
     editOnGithub?: boolean;
+    feedback?: {
+        enabled?: boolean;
+        formSyncFormID?: string;
+        watermark?: boolean;
+    };
     formSyncFormID?: string;
     githubRepo?: string;
     navbar?: {
@@ -39,9 +51,10 @@ interface DocsLinkGroup {
     items: DocsLinkItem[];
 }
 
-declare function DocstraProvider({ children, docstraConfig }: {
+declare function DocstraProvider({ children, docstraConfig, mdxData }: {
     children: React$1.ReactNode;
     docstraConfig: DocstraConfig;
+    mdxData: mdxDataContent;
 }): react_jsx_runtime.JSX.Element;
 declare function useDocstra(): DocstraContextType;
 
@@ -55,10 +68,8 @@ declare function DocstraPage({ children }: {
 
 interface Props {
     children: React.ReactNode;
-    metadata: any;
-    mdxContent: string;
 }
-declare function DocstraBody({ children, metadata, mdxContent }: Props): react_jsx_runtime.JSX.Element;
+declare function DocstraBody({ children }: Props): react_jsx_runtime.JSX.Element;
 
 declare function DocstraTOC({ mdxFilePath, rawMdxContent }: {
     mdxFilePath: string;

package/dist/client/index.d.ts

@@ -7,10 +7,22 @@ interface DocstraContextType {
     docstraConfig: DocstraConfig;
     openSearchBox: boolean;
     setOpenSearchBox: (open: boolean) => void;
+    mdxData: mdxDataContent;
+}
+interface mdxDataContent {
+    metadata: Record<string, any>;
+    mdxContent: string;
+    rawMdxContent: string;
+    mdxFilePath: string;
 }
 interface DocstraConfig {
     siteName?: string;
     editOnGithub?: boolean;
+    feedback?: {
+        enabled?: boolean;
+        formSyncFormID?: string;
+        watermark?: boolean;
+    };
     formSyncFormID?: string;
     githubRepo?: string;
     navbar?: {
@@ -39,9 +51,10 @@ interface DocsLinkGroup {
     items: DocsLinkItem[];
 }
 
-declare function DocstraProvider({ children, docstraConfig }: {
+declare function DocstraProvider({ children, docstraConfig, mdxData }: {
     children: React$1.ReactNode;
     docstraConfig: DocstraConfig;
+    mdxData: mdxDataContent;
 }): react_jsx_runtime.JSX.Element;
 declare function useDocstra(): DocstraContextType;
 
@@ -55,10 +68,8 @@ declare function DocstraPage({ children }: {
 
 interface Props {
     children: React.ReactNode;
-    metadata: any;
-    mdxContent: string;
 }
-declare function DocstraBody({ children, metadata, mdxContent }: Props): react_jsx_runtime.JSX.Element;
+declare function DocstraBody({ children }: Props): react_jsx_runtime.JSX.Element;
 
 declare function DocstraTOC({ mdxFilePath, rawMdxContent }: {
     mdxFilePath: string;

package/dist/client/index.js

@@ -160,7 +160,8 @@ var import_jsx_runtime2 = require("react/jsx-runtime");
 var DocstraContext = (0, import_react2.createContext)(null);
 function DocstraProvider({
   children,
-  docstraConfig
+  docstraConfig,
+  mdxData
 }) {
   const [openSidebar, setOpenSidebar] = (0, import_react2.useState)(false);
   const [openSearchBox, setOpenSearchBox] = (0, import_react2.useState)(false);
@@ -172,7 +173,8 @@ function DocstraProvider({
         setOpenSidebar,
         docstraConfig,
         openSearchBox,
-        setOpenSearchBox
+        setOpenSearchBox,
+        mdxData
       },
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_toast_msg.ToastContainer, {}),
@@ -214,7 +216,7 @@ function DocstraHeader() {
     }
   }, [openSidebar]);
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("header", { className: "sticky top-0 z-10 text-sm flex items-center justify-between border-b border-gray-100 h-18 px-4 md:px-6 bg-white", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("a", { href: docstraConfig.navbar?.logo?.link || "/", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Link, { href: docstraConfig.navbar?.logo?.link || "/", className: "hover:opacity-80 transition", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       "img",
       {
         src: docstraConfig.navbar?.logo?.src || "/logo.png",
@@ -347,19 +349,18 @@ function DocstraBreadcrumbs() {
 
 // src/client/page-buttons.tsx
 var import_lucide_react5 = require("lucide-react");
-var import_navigation3 = require("next/navigation");
 var import_react4 = require("react");
 var import_jsx_runtime8 = require("react/jsx-runtime");
-function DocstraPageButtons({ rawMdxContent }) {
+function DocstraPageButtons() {
+  const { mdxData } = useDocstra();
   const [isCopied, setIsCopied] = (0, import_react4.useState)(false);
   const [href, setHref] = (0, import_react4.useState)(null);
-  const pathname = (0, import_navigation3.usePathname)();
   (0, import_react4.useEffect)(() => {
     setHref(window.location.href);
   }, []);
-  const prompt = `Read from this URL: ${href + pathname} and explain it to me.`;
+  const prompt = `Read from this URL: ${href} and explain it to me.`;
   const handleCopy = () => {
-    navigator.clipboard.writeText(rawMdxContent);
+    navigator.clipboard.writeText(mdxData?.rawMdxContent);
     setIsCopied(true);
     setTimeout(() => setIsCopied(false), 3e3);
   };
@@ -391,11 +392,12 @@ function DocstraPageButtons({ rawMdxContent }) {
 
 // src/client/docstra-page-head.tsx
 var import_jsx_runtime9 = require("react/jsx-runtime");
-function DocstraPageHead({ metadata, mdxContent }) {
+function DocstraPageHead() {
+  const { mdxData } = useDocstra();
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h1", { className: "text-3xl font-bold", children: metadata.title }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "my-4 text-gray-500", children: metadata.description }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DocstraPageButtons, { rawMdxContent: mdxContent }),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h1", { className: "text-3xl font-bold", children: mdxData?.metadata?.title }),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "my-4 text-gray-500", children: mdxData?.metadata?.description }),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DocstraPageButtons, {}),
     /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("hr", { className: "my-10 border-gray-200" })
   ] });
 }
@@ -532,7 +534,7 @@ function DocstraFeedback() {
       "form",
       {
         className: "flex flex-col gap-2",
-        action: `https://formsync.app/v1/s/${docstraConfig?.formSyncFormID || "your-form-id"}`,
+        action: `https://formsync.app/v1/s/${docstraConfig?.feedback?.formSyncFormID || ""}`,
         method: "POST",
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
@@ -550,10 +552,17 @@ function DocstraFeedback() {
           /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("input", { type: "hidden", name: "page", value: window.location.href }),
           /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("input", { type: "hidden", name: "_redirect", value: window.location.href }),
           /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Button, { label: "Submit", className: "w-max text-sm" }),
-          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("p", { className: "text-left text-sm text-gray-500 mt-6", children: [
+          docstraConfig?.feedback?.watermark !== false && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("p", { className: "text-left text-sm text-gray-500 mt-6", children: [
             "Powered by",
             " ",
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("a", { href: "https://www.formsync.app?utm_source=formsync-docs", className: "text-gray-800", children: "FormSync" })
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+              "a",
+              {
+                href: `https://www.formsync.app?utm_source=${docstraConfig?.githubRepo}`,
+                className: "text-gray-800",
+                children: "FormSync"
+              }
+            )
           ] })
         ]
       }
@@ -562,12 +571,12 @@ function DocstraFeedback() {
 }
 
 // src/client/pagination.tsx
-var import_navigation4 = require("next/navigation");
+var import_navigation3 = require("next/navigation");
 var import_link5 = __toESM(require("next/link"));
 var import_lucide_react8 = require("lucide-react");
 var import_jsx_runtime13 = require("react/jsx-runtime");
 function DocstraPagination() {
-  const pathname = (0, import_navigation4.usePathname)();
+  const pathname = (0, import_navigation3.usePathname)();
   const { docstraConfig } = useDocstra();
   const flatLinks = docstraConfig?.sidebar?.links?.flatMap((section) => section.items);
   const currentIndex = flatLinks.findIndex((item) => item.href === pathname);
@@ -607,19 +616,20 @@ function DocstraPagination() {
 
 // src/client/docs-body.tsx
 var import_jsx_runtime14 = require("react/jsx-runtime");
-function DocstraBody({ children, metadata, mdxContent }) {
+function DocstraBody({ children }) {
+  const { docstraConfig } = useDocstra();
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("main", { className: "flex-1 px-4 md:px-8 py-10 max-w-full text-base/7", children: [
     /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DocstraBreadcrumbs, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DocstraPageHead, { metadata, mdxContent }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DocstraPageHead, {}),
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DocstraFeedback, {}),
+    docstraConfig?.feedback?.enabled && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DocstraFeedback, {}),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DocstraPagination, {})
   ] });
 }
 
 // src/client/docstra-toc.tsx
 var import_lucide_react9 = require("lucide-react");
-var import_navigation5 = require("next/navigation");
+var import_navigation4 = require("next/navigation");
 var import_react6 = require("react");
 
 // src/utils/generate-id-from-text.ts
@@ -662,7 +672,7 @@ function DocstraTOC({ mdxFilePath, rawMdxContent }) {
   const { docstraConfig } = useDocstra();
   const lastScrollY = (0, import_react6.useRef)(0);
   const observerRef = (0, import_react6.useRef)(null);
-  const pathname = (0, import_navigation5.usePathname)();
+  const pathname = (0, import_navigation4.usePathname)();
   const baseUrlOfGithub = docstraConfig?.githubRepo || "https://github.com/sudhucodes/docstra";
   const normalized = mdxFilePath.replace(/\\/g, "/");
   const match = normalized.match(/\/docs\/(.+)$/);
@@ -706,6 +716,22 @@ function DocstraTOC({ mdxFilePath, rawMdxContent }) {
     const scrolled = window.scrollY > 100;
     !scrolled && setActiveId(headings[0]?.id);
   }, [headings]);
+  (0, import_react6.useEffect)(() => {
+    if (!activeId) return;
+    const container = document.querySelector(".toc-scroll-container");
+    if (!container) return;
+    const activeLink = container.querySelector(`a[href="#${activeId}"]`);
+    if (!activeLink) return;
+    const containerRect = container.getBoundingClientRect();
+    const linkRect = activeLink.getBoundingClientRect();
+    const isOutOfView = linkRect.top < containerRect.top || linkRect.bottom > containerRect.bottom;
+    if (isOutOfView) {
+      activeLink.scrollIntoView({
+        behavior: "smooth",
+        block: "nearest"
+      });
+    }
+  }, [activeId]);
   (0, import_react6.useEffect)(() => {
     if (!isManualClick) return;
     const timer = setTimeout(() => setIsManualClick(false), 800);
@@ -720,7 +746,7 @@ function DocstraTOC({ mdxFilePath, rawMdxContent }) {
       /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react9.TextAlignStartIcon, { className: "size-4" }),
       "On this page"
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("ul", { children: headings.map((h2) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("li", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("ul", { className: "toc-scroll-container max-h-3/4 overflow-y-auto scrollbar-none", children: headings.map((h2) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("li", { children: [
       /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(TableOfContentsLink, { heading: h2, activeId, handleClick }),
       h2.children.map((h3) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
         TableOfContentsLink,

package/dist/client/index.mjs

@@ -118,7 +118,8 @@ import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var DocstraContext = createContext(null);
 function DocstraProvider({
   children,
-  docstraConfig
+  docstraConfig,
+  mdxData
 }) {
   const [openSidebar, setOpenSidebar] = useState2(false);
   const [openSearchBox, setOpenSearchBox] = useState2(false);
@@ -130,7 +131,8 @@ function DocstraProvider({
         setOpenSidebar,
         docstraConfig,
         openSearchBox,
-        setOpenSearchBox
+        setOpenSearchBox,
+        mdxData
       },
       children: [
         /* @__PURE__ */ jsx2(ToastContainer, {}),
@@ -172,7 +174,7 @@ function DocstraHeader() {
     }
   }, [openSidebar]);
   return /* @__PURE__ */ jsxs3("header", { className: "sticky top-0 z-10 text-sm flex items-center justify-between border-b border-gray-100 h-18 px-4 md:px-6 bg-white", children: [
-    /* @__PURE__ */ jsx4("a", { href: docstraConfig.navbar?.logo?.link || "/", children: /* @__PURE__ */ jsx4(
+    /* @__PURE__ */ jsx4(Link, { href: docstraConfig.navbar?.logo?.link || "/", className: "hover:opacity-80 transition", children: /* @__PURE__ */ jsx4(
       "img",
       {
         src: docstraConfig.navbar?.logo?.src || "/logo.png",
@@ -305,19 +307,18 @@ function DocstraBreadcrumbs() {
 
 // src/client/page-buttons.tsx
 import { CheckIcon, CopyIcon } from "lucide-react";
-import { usePathname as usePathname3 } from "next/navigation";
 import { useEffect as useEffect3, useState as useState3 } from "react";
 import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
-function DocstraPageButtons({ rawMdxContent }) {
+function DocstraPageButtons() {
+  const { mdxData } = useDocstra();
   const [isCopied, setIsCopied] = useState3(false);
   const [href, setHref] = useState3(null);
-  const pathname = usePathname3();
   useEffect3(() => {
     setHref(window.location.href);
   }, []);
-  const prompt = `Read from this URL: ${href + pathname} and explain it to me.`;
+  const prompt = `Read from this URL: ${href} and explain it to me.`;
   const handleCopy = () => {
-    navigator.clipboard.writeText(rawMdxContent);
+    navigator.clipboard.writeText(mdxData?.rawMdxContent);
     setIsCopied(true);
     setTimeout(() => setIsCopied(false), 3e3);
   };
@@ -349,11 +350,12 @@ function DocstraPageButtons({ rawMdxContent }) {
 
 // src/client/docstra-page-head.tsx
 import { Fragment as Fragment3, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
-function DocstraPageHead({ metadata, mdxContent }) {
+function DocstraPageHead() {
+  const { mdxData } = useDocstra();
   return /* @__PURE__ */ jsxs7(Fragment3, { children: [
-    /* @__PURE__ */ jsx9("h1", { className: "text-3xl font-bold", children: metadata.title }),
-    /* @__PURE__ */ jsx9("p", { className: "my-4 text-gray-500", children: metadata.description }),
-    /* @__PURE__ */ jsx9(DocstraPageButtons, { rawMdxContent: mdxContent }),
+    /* @__PURE__ */ jsx9("h1", { className: "text-3xl font-bold", children: mdxData?.metadata?.title }),
+    /* @__PURE__ */ jsx9("p", { className: "my-4 text-gray-500", children: mdxData?.metadata?.description }),
+    /* @__PURE__ */ jsx9(DocstraPageButtons, {}),
     /* @__PURE__ */ jsx9("hr", { className: "my-10 border-gray-200" })
   ] });
 }
@@ -490,7 +492,7 @@ function DocstraFeedback() {
       "form",
       {
         className: "flex flex-col gap-2",
-        action: `https://formsync.app/v1/s/${docstraConfig?.formSyncFormID || "your-form-id"}`,
+        action: `https://formsync.app/v1/s/${docstraConfig?.feedback?.formSyncFormID || ""}`,
         method: "POST",
         children: [
           /* @__PURE__ */ jsx12(
@@ -508,10 +510,17 @@ function DocstraFeedback() {
           /* @__PURE__ */ jsx12("input", { type: "hidden", name: "page", value: window.location.href }),
           /* @__PURE__ */ jsx12("input", { type: "hidden", name: "_redirect", value: window.location.href }),
           /* @__PURE__ */ jsx12(Button, { label: "Submit", className: "w-max text-sm" }),
-          /* @__PURE__ */ jsxs9("p", { className: "text-left text-sm text-gray-500 mt-6", children: [
+          docstraConfig?.feedback?.watermark !== false && /* @__PURE__ */ jsxs9("p", { className: "text-left text-sm text-gray-500 mt-6", children: [
             "Powered by",
             " ",
-            /* @__PURE__ */ jsx12("a", { href: "https://www.formsync.app?utm_source=formsync-docs", className: "text-gray-800", children: "FormSync" })
+            /* @__PURE__ */ jsx12(
+              "a",
+              {
+                href: `https://www.formsync.app?utm_source=${docstraConfig?.githubRepo}`,
+                className: "text-gray-800",
+                children: "FormSync"
+              }
+            )
           ] })
         ]
       }
@@ -520,12 +529,12 @@ function DocstraFeedback() {
 }
 
 // src/client/pagination.tsx
-import { usePathname as usePathname4 } from "next/navigation";
+import { usePathname as usePathname3 } from "next/navigation";
 import Link2 from "next/link";
 import { ArrowLeftIcon, ArrowRightIcon } from "lucide-react";
 import { jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
 function DocstraPagination() {
-  const pathname = usePathname4();
+  const pathname = usePathname3();
   const { docstraConfig } = useDocstra();
   const flatLinks = docstraConfig?.sidebar?.links?.flatMap((section) => section.items);
   const currentIndex = flatLinks.findIndex((item) => item.href === pathname);
@@ -565,19 +574,20 @@ function DocstraPagination() {
 
 // src/client/docs-body.tsx
 import { jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
-function DocstraBody({ children, metadata, mdxContent }) {
+function DocstraBody({ children }) {
+  const { docstraConfig } = useDocstra();
   return /* @__PURE__ */ jsxs11("main", { className: "flex-1 px-4 md:px-8 py-10 max-w-full text-base/7", children: [
     /* @__PURE__ */ jsx14(DocstraBreadcrumbs, {}),
-    /* @__PURE__ */ jsx14(DocstraPageHead, { metadata, mdxContent }),
+    /* @__PURE__ */ jsx14(DocstraPageHead, {}),
     children,
-    /* @__PURE__ */ jsx14(DocstraFeedback, {}),
+    docstraConfig?.feedback?.enabled && /* @__PURE__ */ jsx14(DocstraFeedback, {}),
     /* @__PURE__ */ jsx14(DocstraPagination, {})
   ] });
 }
 
 // src/client/docstra-toc.tsx
 import { ArrowUpCircleIcon, SquareArrowOutUpRightIcon, TextAlignStartIcon } from "lucide-react";
-import { usePathname as usePathname5 } from "next/navigation";
+import { usePathname as usePathname4 } from "next/navigation";
 import { useEffect as useEffect4, useRef, useState as useState5 } from "react";
 
 // src/utils/generate-id-from-text.ts
@@ -620,7 +630,7 @@ function DocstraTOC({ mdxFilePath, rawMdxContent }) {
   const { docstraConfig } = useDocstra();
   const lastScrollY = useRef(0);
   const observerRef = useRef(null);
-  const pathname = usePathname5();
+  const pathname = usePathname4();
   const baseUrlOfGithub = docstraConfig?.githubRepo || "https://github.com/sudhucodes/docstra";
   const normalized = mdxFilePath.replace(/\\/g, "/");
   const match = normalized.match(/\/docs\/(.+)$/);
@@ -664,6 +674,22 @@ function DocstraTOC({ mdxFilePath, rawMdxContent }) {
     const scrolled = window.scrollY > 100;
     !scrolled && setActiveId(headings[0]?.id);
   }, [headings]);
+  useEffect4(() => {
+    if (!activeId) return;
+    const container = document.querySelector(".toc-scroll-container");
+    if (!container) return;
+    const activeLink = container.querySelector(`a[href="#${activeId}"]`);
+    if (!activeLink) return;
+    const containerRect = container.getBoundingClientRect();
+    const linkRect = activeLink.getBoundingClientRect();
+    const isOutOfView = linkRect.top < containerRect.top || linkRect.bottom > containerRect.bottom;
+    if (isOutOfView) {
+      activeLink.scrollIntoView({
+        behavior: "smooth",
+        block: "nearest"
+      });
+    }
+  }, [activeId]);
   useEffect4(() => {
     if (!isManualClick) return;
     const timer = setTimeout(() => setIsManualClick(false), 800);
@@ -678,7 +704,7 @@ function DocstraTOC({ mdxFilePath, rawMdxContent }) {
       /* @__PURE__ */ jsx15(TextAlignStartIcon, { className: "size-4" }),
       "On this page"
     ] }),
-    /* @__PURE__ */ jsx15("ul", { children: headings.map((h2) => /* @__PURE__ */ jsxs12("li", { children: [
+    /* @__PURE__ */ jsx15("ul", { className: "toc-scroll-container max-h-3/4 overflow-y-auto scrollbar-none", children: headings.map((h2) => /* @__PURE__ */ jsxs12("li", { children: [
       /* @__PURE__ */ jsx15(TableOfContentsLink, { heading: h2, activeId, handleClick }),
       h2.children.map((h3) => /* @__PURE__ */ jsx15(
         TableOfContentsLink,

package/dist/server/index.d.mts

@@ -3,6 +3,11 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 interface DocstraConfig {
     siteName?: string;
     editOnGithub?: boolean;
+    feedback?: {
+        enabled?: boolean;
+        formSyncFormID?: string;
+        watermark?: boolean;
+    };
     formSyncFormID?: string;
     githubRepo?: string;
     navbar?: {

package/dist/server/index.d.ts

@@ -3,6 +3,11 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 interface DocstraConfig {
     siteName?: string;
     editOnGithub?: boolean;
+    feedback?: {
+        enabled?: boolean;
+        formSyncFormID?: string;
+        watermark?: boolean;
+    };
     formSyncFormID?: string;
     githubRepo?: string;
     navbar?: {

package/dist/server/index.js

@@ -44,8 +44,7 @@ var import_gray_matter = __toESM(require("gray-matter"));
 var DEFAULT_CONTENT_DIR = import_path.default.join(process.cwd(), "app", "docs", "content");
 function getFilePath({ slug, CONTENT_DIR }) {
   const slugArray = Array.isArray(slug) && slug.length > 0 ? slug : ["index"];
-  const USER_CONTENT_DIR = process.cwd() + CONTENT_DIR;
-  const DIR = USER_CONTENT_DIR || DEFAULT_CONTENT_DIR;
+  const DIR = CONTENT_DIR ? import_path.default.join(process.cwd(), CONTENT_DIR) : DEFAULT_CONTENT_DIR;
   const possiblePaths = [
     import_path.default.join(DIR, ...slugArray) + ".mdx",
     import_path.default.join(DIR, ...slugArray) + ".md",
@@ -57,10 +56,13 @@ function getFilePath({ slug, CONTENT_DIR }) {
       return filePath;
     }
   }
-  throw new Error(`\u274C MDX file not found in: ${DIR} `);
+  throw new Error(`\u274C MDX file not found in: ${DIR}`);
 }
 function getFileContents({ slug, CONTENT_DIR }) {
-  const filePath = getFilePath({ slug, CONTENT_DIR: CONTENT_DIR || DEFAULT_CONTENT_DIR });
+  const filePath = getFilePath({
+    slug,
+    CONTENT_DIR
+  });
   const rawFile = import_fs.default.readFileSync(filePath, "utf-8");
   const { data, content } = (0, import_gray_matter.default)(rawFile);
   return {
@@ -99,9 +101,6 @@ function CreateHeading({ children, level }) {
   let fontSize;
   let iconSize;
   switch (level) {
-    case 1:
-      fontSize = "text-3xl";
-      break;
     case 2:
       fontSize = "text-2xl";
       iconSize = "size-5";
@@ -122,7 +121,7 @@ function CreateHeading({ children, level }) {
       fontSize = "text-base";
       iconSize = "size-3.5";
   }
-  return level === 1 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "text-3xl font-bold text-gray-900 mb-4", children }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     Heading,
     {
       id,
@@ -138,7 +137,7 @@ function CreateHeading({ children, level }) {
 // src/client/mdx-components.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var defaultMdxComponents = {
-  h1: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CreateHeading, { ...props, level: 1 }),
+  h1: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h1", { className: "text-3xl font-bold text-gray-900 mb-4", children: props.children }),
   h2: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CreateHeading, { ...props, level: 2 }),
   h3: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CreateHeading, { ...props, level: 3 }),
   h4: (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CreateHeading, { ...props, level: 4 }),

package/dist/server/index.mjs

@@ -5,8 +5,7 @@ import matter from "gray-matter";
 var DEFAULT_CONTENT_DIR = path.join(process.cwd(), "app", "docs", "content");
 function getFilePath({ slug, CONTENT_DIR }) {
   const slugArray = Array.isArray(slug) && slug.length > 0 ? slug : ["index"];
-  const USER_CONTENT_DIR = process.cwd() + CONTENT_DIR;
-  const DIR = USER_CONTENT_DIR || DEFAULT_CONTENT_DIR;
+  const DIR = CONTENT_DIR ? path.join(process.cwd(), CONTENT_DIR) : DEFAULT_CONTENT_DIR;
   const possiblePaths = [
     path.join(DIR, ...slugArray) + ".mdx",
     path.join(DIR, ...slugArray) + ".md",
@@ -18,10 +17,13 @@ function getFilePath({ slug, CONTENT_DIR }) {
       return filePath;
     }
   }
-  throw new Error(`\u274C MDX file not found in: ${DIR} `);
+  throw new Error(`\u274C MDX file not found in: ${DIR}`);
 }
 function getFileContents({ slug, CONTENT_DIR }) {
-  const filePath = getFilePath({ slug, CONTENT_DIR: CONTENT_DIR || DEFAULT_CONTENT_DIR });
+  const filePath = getFilePath({
+    slug,
+    CONTENT_DIR
+  });
   const rawFile = fs.readFileSync(filePath, "utf-8");
   const { data, content } = matter(rawFile);
   return {
@@ -60,9 +62,6 @@ function CreateHeading({ children, level }) {
   let fontSize;
   let iconSize;
   switch (level) {
-    case 1:
-      fontSize = "text-3xl";
-      break;
     case 2:
       fontSize = "text-2xl";
       iconSize = "size-5";
@@ -83,7 +82,7 @@ function CreateHeading({ children, level }) {
       fontSize = "text-base";
       iconSize = "size-3.5";
   }
-  return level === 1 ? /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold text-gray-900 mb-4", children }) : /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsxs(
     Heading,
     {
       id,
@@ -99,7 +98,7 @@ function CreateHeading({ children, level }) {
 // src/client/mdx-components.tsx
 import { jsx as jsx2 } from "react/jsx-runtime";
 var defaultMdxComponents = {
-  h1: (props) => /* @__PURE__ */ jsx2(CreateHeading, { ...props, level: 1 }),
+  h1: (props) => /* @__PURE__ */ jsx2("h1", { className: "text-3xl font-bold text-gray-900 mb-4", children: props.children }),
   h2: (props) => /* @__PURE__ */ jsx2(CreateHeading, { ...props, level: 2 }),
   h3: (props) => /* @__PURE__ */ jsx2(CreateHeading, { ...props, level: 3 }),
   h4: (props) => /* @__PURE__ */ jsx2(CreateHeading, { ...props, level: 4 }),

package/dist/styles.css

@@ -1 +1,43 @@
-@source ".";
+@source ".";
+
+.scrollbar-none::-webkit-scrollbar {
+    display: none;
+}
+
+.scrollbar-x::-webkit-scrollbar {
+    display: block;
+    height: 3.5px;
+}
+
+.scrollbar-x::-webkit-scrollbar-track {
+    background: var(--color-gray-100);
+}
+
+.scrollbar-x::-webkit-scrollbar-thumb {
+    background-color: var(--color-gray-300);
+    border-radius: 0px;
+    background-clip: padding-box;
+}
+
+.scrollbar-x::-webkit-scrollbar-thumb:hover {
+    background-color: var(--color-gray-400);
+}
+
+.scrollbar-y::-webkit-scrollbar {
+    display: block;
+    width: 3.5px;
+}
+
+.scrollbar-y::-webkit-scrollbar-track {
+    background: var(--color-gray-100);
+}
+
+.scrollbar-y::-webkit-scrollbar-thumb {
+    background-color: var(--color-gray-300);
+    border-radius: 0px;
+    background-clip: padding-box;
+}
+
+.scrollbar-y::-webkit-scrollbar-thumb:hover {
+    background-color: var(--color-gray-400);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "docstra",
-    "version": "1.2.0",
+    "version": "1.4.0",
     "description": "A Modern Documentation Framework for Next.js",
     "keywords": [
         "next",