specra 0.1.0

package/dist/components/index.mjs

@@ -0,0 +1,3627 @@
+"use client";
+
+// src/components/docs/accordion.tsx
+import { ChevronDown } from "lucide-react";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function AccordionItem({ title, children, defaultOpen = false }) {
+  const [isOpen, setIsOpen] = useState(defaultOpen);
+  return /* @__PURE__ */ jsxs("div", { className: "border border-border rounded-xl overflow-hidden mb-2", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        onClick: () => setIsOpen(!isOpen),
+        className: "w-full flex items-center justify-between p-4 text-left bg-muted/30 hover:bg-muted/50 transition-colors",
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: title }),
+          /* @__PURE__ */ jsx(
+            ChevronDown,
+            {
+              className: `h-5 w-5 text-muted-foreground transition-transform ${isOpen ? "rotate-180" : ""}`
+            }
+          )
+        ]
+      }
+    ),
+    isOpen && /* @__PURE__ */ jsx("div", { className: "p-4 border-t border-border bg-background", children: /* @__PURE__ */ jsx("div", { className: "prose prose-sm dark:prose-invert max-w-none [&>*:last-child]:mb-0", children }) })
+  ] });
+}
+function Accordion({ children, type = "multiple", className }) {
+  return /* @__PURE__ */ jsx("div", { className: className || "my-6 space-y-2", children });
+}
+
+// src/components/docs/badge.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function Badge({ children, variant = "default" }) {
+  const variants = {
+    default: "bg-muted text-foreground border-border",
+    success: "bg-green-500/10 text-green-600 dark:text-green-400 border-green-500/20",
+    warning: "bg-yellow-500/10 text-yellow-600 dark:text-yellow-400 border-yellow-500/20",
+    error: "bg-red-500/10 text-red-600 dark:text-red-400 border-red-500/20",
+    info: "bg-blue-500/10 text-blue-600 dark:text-blue-400 border-blue-500/20"
+  };
+  return /* @__PURE__ */ jsx2(
+    "span",
+    {
+      className: `inline-flex items-center px-2 py-0.5 rounded-md text-xs font-medium border ${variants[variant]}`,
+      children
+    }
+  );
+}
+
+// src/components/docs/breadcrumb.tsx
+import Link from "next/link";
+import { ChevronRight } from "lucide-react";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+function Breadcrumb({ version, slug, title }) {
+  const parts = slug.split("/");
+  const breadcrumbs = [
+    { label: "Docs", href: `/docs/${version}` }
+  ];
+  let currentPath = "";
+  for (let i = 0; i < parts.length - 1; i++) {
+    currentPath += (currentPath ? "/" : "") + parts[i];
+    breadcrumbs.push({
+      label: parts[i].replace(/-/g, " ").replace(/\b\w/g, (l) => l.toUpperCase()),
+      href: `/docs/${version}/${currentPath}`
+    });
+  }
+  breadcrumbs.push({
+    label: title,
+    href: `/docs/${version}/${slug}`
+  });
+  return /* @__PURE__ */ jsx3("nav", { className: "flex items-center gap-2 text-sm text-muted-foreground mb-4", "aria-label": "Breadcrumb", children: breadcrumbs.map((crumb, index) => /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-2", children: [
+    index > 0 && /* @__PURE__ */ jsx3(ChevronRight, { className: "h-4 w-4" }),
+    index === breadcrumbs.length - 1 ? /* @__PURE__ */ jsx3("span", { className: "text-foreground font-medium", children: crumb.label }) : /* @__PURE__ */ jsx3(
+      Link,
+      {
+        href: crumb.href,
+        className: "hover:text-foreground transition-colors",
+        children: crumb.label
+      }
+    )
+  ] }, crumb.href)) });
+}
+
+// src/components/docs/callout.tsx
+import { Info, AlertTriangle, CheckCircle2, XCircle, Lightbulb } from "lucide-react";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+function Callout({ children, type = "info", title }) {
+  const configs = {
+    info: {
+      icon: Info,
+      className: "bg-blue-500/10 border-blue-500/30 text-blue-900 dark:bg-blue-400/5 dark:border-blue-500/20 dark:text-blue-400",
+      iconClassName: "text-blue-600 dark:text-blue-400",
+      titleClassName: "text-blue-700 dark:text-blue-300",
+      defaultTitle: "Info"
+    },
+    note: {
+      icon: Info,
+      className: "bg-blue-500/10 border-blue-500/30 text-blue-900 dark:bg-blue-400/5 dark:border-blue-500/20 dark:text-blue-400",
+      iconClassName: "text-blue-600 dark:text-blue-400",
+      titleClassName: "text-blue-700 dark:text-blue-300",
+      defaultTitle: "Note"
+    },
+    warning: {
+      icon: AlertTriangle,
+      className: "bg-yellow-500/10 border-yellow-500/30 text-yellow-900 dark:bg-yellow-400/5 dark:border-yellow-500/20 dark:text-yellow-400",
+      iconClassName: "text-yellow-600 dark:text-yellow-400",
+      titleClassName: "text-yellow-700 dark:text-yellow-300",
+      defaultTitle: "Warning"
+    },
+    success: {
+      icon: CheckCircle2,
+      className: "bg-green-500/10 border-green-500/30 text-green-900 dark:bg-green-400/5 dark:border-green-500/20 dark:text-green-400",
+      iconClassName: "text-green-600 dark:text-green-400",
+      titleClassName: "text-green-700 dark:text-green-300",
+      defaultTitle: "Success"
+    },
+    error: {
+      icon: XCircle,
+      className: "bg-red-500/10 border-red-500/30 text-red-900 dark:bg-red-400/5 dark:border-red-500/20 dark:text-red-400",
+      iconClassName: "text-red-600 dark:text-red-400",
+      titleClassName: "text-red-700 dark:text-red-300",
+      defaultTitle: "Error"
+    },
+    danger: {
+      icon: XCircle,
+      className: "bg-red-500/10 border-red-500/30 text-red-900 dark:bg-red-400/5 dark:border-red-500/20 dark:text-red-400",
+      iconClassName: "text-red-600 dark:text-red-400",
+      titleClassName: "text-red-700 dark:text-red-300",
+      defaultTitle: "Danger"
+    },
+    tip: {
+      icon: Lightbulb,
+      className: "bg-purple-500/10 border-purple-500/30 text-purple-900 dark:bg-purple-400/5 dark:border-purple-500/20 dark:text-purple-400",
+      iconClassName: "text-purple-600 dark:text-purple-400",
+      titleClassName: "text-purple-700 dark:text-purple-300",
+      defaultTitle: "Tip"
+    }
+  };
+  const config = configs[type];
+  const Icon2 = config.icon;
+  let _title = title || config.defaultTitle;
+  let content = children;
+  if (!title && children && typeof children === "object") {
+    const childArray = Array.isArray(children) ? children : [children];
+    const firstElement = childArray[0];
+    if (firstElement && typeof firstElement === "object" && "props" in firstElement) {
+      const props = firstElement.props;
+      if (props.children && Array.isArray(props.children)) {
+        const strongChild = props.children.find(
+          (child) => child && typeof child === "object" && child.type === "strong"
+        );
+        if (strongChild) {
+          _title = strongChild.props.children;
+          content = childArray.map((child, idx) => {
+            if (idx === 0 && typeof child === "object" && "props" in child) {
+              const newChildren = child.props.children.filter((c) => c !== strongChild);
+              return { ...child, props: { ...child.props, children: newChildren } };
+            }
+            return child;
+          });
+        }
+      }
+    }
+  }
+  return /* @__PURE__ */ jsxs3("div", { className: `flex gap-3 p-4 rounded-xl border my-2 ${config.className}`, children: [
+    /* @__PURE__ */ jsx4("div", { className: "flex-shrink-0 mt-0.5", children: /* @__PURE__ */ jsx4(Icon2, { className: `h-5 w-5 ${config.iconClassName}` }) }),
+    /* @__PURE__ */ jsxs3("div", { className: "flex-1 space-y-0", children: [
+      /* @__PURE__ */ jsx4("div", { className: `font-semibold text-sm ${config.titleClassName}`, children: _title }),
+      /* @__PURE__ */ jsx4("div", { className: "text-sm leading-relaxed [&>p]:mb-0 [&>p]:text-current", children: content })
+    ] })
+  ] });
+}
+
+// src/components/docs/card.tsx
+import { ArrowRight, ExternalLink } from "lucide-react";
+import Link2 from "next/link";
+
+// src/components/docs/icon.tsx
+import * as LucideIcons from "lucide-react";
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+function Icon({ icon, iconType = "regular", color, size = 20, className = "" }) {
+  if (typeof icon !== "string") {
+    return /* @__PURE__ */ jsx5("span", { className: `inline-flex items-center ${className}`, style: { color }, children: icon });
+  }
+  if (icon.startsWith("http") || icon.startsWith("/")) {
+    return /* @__PURE__ */ jsx5(
+      "img",
+      {
+        src: icon,
+        alt: "",
+        width: size,
+        height: size,
+        className: `inline-block ${className}`,
+        style: { color }
+      }
+    );
+  }
+  if (icon.startsWith("fa-")) {
+    const faClass = `fa-${iconType} ${icon}`;
+    return /* @__PURE__ */ jsx5(
+      "i",
+      {
+        className: `${faClass} ${className}`,
+        style: { fontSize: size, color },
+        "aria-hidden": "true"
+      }
+    );
+  }
+  const iconName = icon.split("-").map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join("");
+  const LucideIcon = LucideIcons[iconName];
+  if (LucideIcon) {
+    return /* @__PURE__ */ jsx5(
+      LucideIcon,
+      {
+        size,
+        className: `inline-block ${className}`,
+        style: { color },
+        "aria-hidden": "true"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs4("span", { className: `inline-flex items-center font-mono text-xs ${className}`, style: { color }, children: [
+    "[",
+    icon,
+    "]"
+  ] });
+}
+
+// src/components/docs/card.tsx
+import { Fragment, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+function Card({ title, description, href, icon, children, external = false }) {
+  const content = /* @__PURE__ */ jsx6(Fragment, { children: /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-3", children: [
+    icon && /* @__PURE__ */ jsx6("div", { className: "shrink-0 w-10 h-10 rounded-xl bg-primary/10 flex items-center justify-center text-primary", children: typeof icon === "string" ? /* @__PURE__ */ jsx6(Icon, { icon, size: 20 }) : icon }),
+    /* @__PURE__ */ jsxs5("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ jsx6("h3", { className: `font-semibold text-foreground mb-1 no-underline ${href ? "group-hover:text-primary transition-colors" : ""}`, children: title }),
+      description && /* @__PURE__ */ jsx6("p", { className: "text-sm text-muted-foreground line-clamp-2 no-underline", children: description }),
+      children && /* @__PURE__ */ jsx6("div", { className: "mt-2 text-sm text-muted-foreground no-underline", children })
+    ] }),
+    href && /* @__PURE__ */ jsx6("div", { className: "shrink-0 self-start mt-1", children: external ? /* @__PURE__ */ jsx6(ExternalLink, { className: "h-4 w-4 text-muted-foreground group-hover:text-primary transition-colors" }) : /* @__PURE__ */ jsx6(ArrowRight, { className: "h-4 w-4 text-muted-foreground group-hover:text-primary group-hover:translate-x-1 transition-all" }) })
+  ] }) });
+  if (href) {
+    const Component = external ? "a" : Link2;
+    return /* @__PURE__ */ jsx6(
+      Component,
+      {
+        href,
+        className: "card-link group block p-4 rounded-xl border border-border hover:border-primary/50 hover:bg-muted/50 transition-all",
+        ...external ? { target: "_blank", rel: "noopener noreferrer" } : {},
+        children: content
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx6("div", { className: "p-4 rounded-xl border border-border bg-muted/30 no-underline", children: content });
+}
+function CardGrid({ children, cols = 2 }) {
+  const gridCols = {
+    1: "grid-cols-1",
+    2: "grid-cols-1 md:grid-cols-2",
+    3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"
+  };
+  return /* @__PURE__ */ jsx6("div", { className: `grid ${gridCols[cols]} gap-4 my-6`, children });
+}
+
+// src/components/docs/category-index.tsx
+import Link4 from "next/link";
+import { ChevronRight as ChevronRight2, FileText } from "lucide-react";
+import { MDXRemote } from "next-mdx-remote/rsc";
+import remarkGfm from "remark-gfm";
+
+// src/lib/remark-code-meta.ts
+function remarkCodeMeta() {
+  return (tree) => {
+    const visit = (node) => {
+      if (node.type === "code" && node.meta) {
+        node.data = node.data || {};
+        node.data.hProperties = node.data.hProperties || {};
+        node.data.hProperties.meta = node.meta;
+      }
+      if (node.children) {
+        node.children.forEach(visit);
+      }
+    };
+    visit(tree);
+  };
+}
+
+// src/components/docs/category-index.tsx
+import rehypeSlug from "rehype-slug";
+
+// src/components/docs/code-block.tsx
+import { useState as useState2 } from "react";
+import { Check, Copy } from "lucide-react";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+function CodeBlock({ code, language, filename }) {
+  const [copied, setCopied] = useState2(false);
+  const handleCopy = async () => {
+    await navigator.clipboard.writeText(code);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2e3);
+  };
+  const highlightCode = (code2, lang) => {
+    const lines = code2.split("\n");
+    return lines.map((line, i) => {
+      const tokens = [];
+      let currentPos = 0;
+      const patterns = [
+        { type: "comment", regex: /(\/\/.*$|\/\*[\s\S]*?\*\/|#.*$)/ },
+        { type: "string", regex: /("(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*'|`(?:[^`\\]|\\.)*`)/ },
+        {
+          type: "keyword",
+          regex: /\b(const|let|var|function|return|if|else|for|while|do|break|continue|switch|case|default|import|export|from|as|class|extends|implements|interface|type|enum|namespace|async|await|try|catch|finally|throw|new|this|super|static|public|private|protected|readonly|abstract|void|null|undefined|true|false|typeof|instanceof|delete|in|of)\b/
+        },
+        { type: "operator", regex: /([+\-*/%=<>!&|^~?:]+)/ },
+        { type: "number", regex: /\b(0x[a-fA-F0-9]+|0b[01]+|\d+\.?\d*(?:e[+-]?\d+)?)\b/ },
+        { type: "function", regex: /\b([a-zA-Z_$][\w$]*)\s*(?=\()/ },
+        { type: "property", regex: /\.([a-zA-Z_$][\w$]*)/ },
+        { type: "punctuation", regex: /([{}[\]();,])/ }
+      ];
+      while (currentPos < line.length) {
+        let matched = false;
+        for (const { type, regex } of patterns) {
+          const match = line.slice(currentPos).match(regex);
+          if (match && match.index === 0) {
+            tokens.push({ type, value: match[0] });
+            currentPos += match[0].length;
+            matched = true;
+            break;
+          }
+        }
+        if (!matched) {
+          const nextSpecialChar = line.slice(currentPos).search(/["'`/\w.+\-*/%=<>!&|^~?:;,()[\]{}#]/);
+          if (nextSpecialChar === -1) {
+            tokens.push({ type: "text", value: line.slice(currentPos) });
+            break;
+          } else if (nextSpecialChar > 0) {
+            tokens.push({ type: "text", value: line.slice(currentPos, currentPos + nextSpecialChar) });
+            currentPos += nextSpecialChar;
+          } else {
+            tokens.push({ type: "text", value: line[currentPos] });
+            currentPos++;
+          }
+        }
+      }
+      return /* @__PURE__ */ jsxs6("div", { className: "table-row", children: [
+        /* @__PURE__ */ jsx7("span", { className: "table-cell pr-4 text-right select-none text-muted-foreground/40 w-8 align-top", children: i + 1 }),
+        /* @__PURE__ */ jsx7("span", { className: "table-cell align-top", children: tokens.length === 0 ? /* @__PURE__ */ jsx7("span", { children: "\xA0" }) : tokens.map((token, j) => /* @__PURE__ */ jsx7("span", { className: `token-${token.type}`, children: token.value }, j)) })
+      ] }, i);
+    });
+  };
+  return /* @__PURE__ */ jsxs6("div", { className: "relative group my-2", children: [
+    /* @__PURE__ */ jsxs6("div", { className: "bg-muted/50 dark:bg-muted/30 px-4 py-2 rounded-t-xl border border-b-0 border-border/50 flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx7("div", { className: "w-3 h-3 rounded-full bg-red-500/80 dark:bg-red-500/60" }),
+          /* @__PURE__ */ jsx7("div", { className: "w-3 h-3 rounded-full bg-yellow-500/80 dark:bg-yellow-500/60" }),
+          /* @__PURE__ */ jsx7("div", { className: "w-3 h-3 rounded-full bg-green-500/80 dark:bg-green-500/60" })
+        ] }),
+        /* @__PURE__ */ jsx7("span", { className: "text-xs font-mono text-foreground", children: filename || "Code" })
+      ] }),
+      /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx7("span", { className: "text-xs text-muted-foreground/60 font-mono uppercase tracking-wide", children: language }),
+        /* @__PURE__ */ jsx7(
+          "button",
+          {
+            onClick: handleCopy,
+            className: "p-1.5 rounded-md hover:bg-muted/50 transition-colors",
+            "aria-label": "Copy code",
+            children: copied ? /* @__PURE__ */ jsx7(Check, { className: "h-4 w-4 text-green-400" }) : /* @__PURE__ */ jsx7(Copy, { className: "h-4 w-4 text-muted-foreground" })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx7("div", { className: "bg-gray-200/50 dark:bg-[#0d1117] rounded-b-xl overflow-x-auto border border-border/50", children: /* @__PURE__ */ jsx7("pre", { className: "p-2 text-[13px] font-mono leading-relaxed text-gray-800 dark:text-gray-200", children: /* @__PURE__ */ jsx7("code", { className: "table w-full", children: highlightCode(code, language) }) }) })
+  ] });
+}
+
+// src/components/docs/tabs.tsx
+import { useState as useState3, Children, isValidElement } from "react";
+import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+function Tab({ children }) {
+  return /* @__PURE__ */ jsx8(Fragment2, { children });
+}
+function Tabs({ children, defaultValue }) {
+  const tabs = Children.toArray(children).filter(isValidElement);
+  const firstTabLabel = tabs[0]?.props.label || "";
+  const [activeTab, setActiveTab] = useState3(defaultValue || firstTabLabel);
+  return /* @__PURE__ */ jsxs7("div", { className: "my-6", children: [
+    /* @__PURE__ */ jsx8("div", { className: "flex items-center gap-1 border-b border-border mb-4", children: tabs.map((tab) => {
+      const label = tab.props.label;
+      const isActive = activeTab === label;
+      return /* @__PURE__ */ jsx8(
+        "button",
+        {
+          onClick: () => setActiveTab(label),
+          className: `px-4 py-2 text-sm font-medium transition-colors border-b-2 -mb-px ${isActive ? "border-primary text-primary" : "border-transparent text-muted-foreground hover:text-foreground hover:border-border"}`,
+          children: label
+        },
+        label
+      );
+    }) }),
+    tabs.map((tab) => {
+      const label = tab.props.label;
+      if (activeTab !== label) return null;
+      return /* @__PURE__ */ jsx8("div", { className: "prose prose-slate dark:prose-invert max-w-none [&>*:first-child]:mt-0", children: tab.props.children }, label);
+    })
+  ] });
+}
+
+// src/components/docs/image.tsx
+import NextImage from "next/image";
+import { useState as useState4 } from "react";
+import { ZoomIn, X } from "lucide-react";
+import { Fragment as Fragment3, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+function Image({ src, alt, caption, width, height, zoom = true }) {
+  const [isZoomed, setIsZoomed] = useState4(false);
+  return /* @__PURE__ */ jsxs8(Fragment3, { children: [
+    /* @__PURE__ */ jsxs8("figure", { className: "my-6", children: [
+      /* @__PURE__ */ jsxs8("div", { className: "relative group rounded-xl border border-border overflow-hidden bg-muted/30", children: [
+        /* @__PURE__ */ jsx9(
+          NextImage,
+          {
+            src,
+            alt,
+            width: width || 1200,
+            height: height || 675,
+            className: "w-full h-auto"
+          }
+        ),
+        zoom && /* @__PURE__ */ jsx9(
+          "button",
+          {
+            onClick: () => setIsZoomed(true),
+            className: "absolute top-3 right-3 p-2 rounded-md bg-background/80 backdrop-blur-sm border border-border opacity-0 group-hover:opacity-100 transition-opacity hover:bg-background",
+            "aria-label": "Zoom image",
+            children: /* @__PURE__ */ jsx9(ZoomIn, { className: "h-4 w-4 text-foreground" })
+          }
+        )
+      ] }),
+      caption && /* @__PURE__ */ jsx9("figcaption", { className: "mt-2 text-center text-sm text-muted-foreground italic", children: caption })
+    ] }),
+    isZoomed && /* @__PURE__ */ jsxs8(
+      "div",
+      {
+        className: "fixed inset-0 z-50 bg-background/95 backdrop-blur-sm flex items-center justify-center p-4",
+        onClick: () => setIsZoomed(false),
+        children: [
+          /* @__PURE__ */ jsx9(
+            "button",
+            {
+              onClick: () => setIsZoomed(false),
+              className: "absolute top-4 right-4 p-2 rounded-md bg-muted hover:bg-muted/80 transition-colors",
+              "aria-label": "Close",
+              children: /* @__PURE__ */ jsx9(X, { className: "h-5 w-5 text-foreground" })
+            }
+          ),
+          /* @__PURE__ */ jsx9("div", { className: "max-w-7xl max-h-[90vh] overflow-auto", children: /* @__PURE__ */ jsx9(
+            NextImage,
+            {
+              src,
+              alt,
+              width: width || 1920,
+              height: height || 1080,
+              className: "w-full h-auto"
+            }
+          ) })
+        ]
+      }
+    )
+  ] });
+}
+
+// src/components/docs/video.tsx
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+function Video({
+  src,
+  caption,
+  autoplay = false,
+  loop = false,
+  muted = false,
+  controls = true,
+  poster
+}) {
+  const isYouTube = src.includes("youtube.com") || src.includes("youtu.be");
+  const isVimeo = src.includes("vimeo.com");
+  const getYouTubeId = (url) => {
+    const match = url.match(/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/);
+    return match ? match[1] : null;
+  };
+  const getVimeoId = (url) => {
+    const match = url.match(/vimeo\.com\/(\d+)/);
+    return match ? match[1] : null;
+  };
+  return /* @__PURE__ */ jsxs9("figure", { className: "my-6", children: [
+    /* @__PURE__ */ jsx10("div", { className: "relative rounded-xl border border-border overflow-hidden bg-muted/30", children: isYouTube ? /* @__PURE__ */ jsx10("div", { className: "relative w-full", style: { paddingBottom: "56.25%" }, children: /* @__PURE__ */ jsx10(
+      "iframe",
+      {
+        className: "absolute top-0 left-0 w-full h-full",
+        src: `https://www.youtube.com/embed/${getYouTubeId(src)}${autoplay ? "?autoplay=1" : ""}`,
+        title: "YouTube video",
+        allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
+        allowFullScreen: true
+      }
+    ) }) : isVimeo ? /* @__PURE__ */ jsx10("div", { className: "relative w-full", style: { paddingBottom: "56.25%" }, children: /* @__PURE__ */ jsx10(
+      "iframe",
+      {
+        className: "absolute top-0 left-0 w-full h-full",
+        src: `https://player.vimeo.com/video/${getVimeoId(src)}${autoplay ? "?autoplay=1" : ""}`,
+        title: "Vimeo video",
+        allow: "autoplay; fullscreen; picture-in-picture",
+        allowFullScreen: true
+      }
+    ) }) : /* @__PURE__ */ jsx10(
+      "video",
+      {
+        src,
+        controls,
+        autoPlay: autoplay,
+        loop,
+        muted,
+        poster,
+        className: "w-full h-auto",
+        children: "Your browser does not support the video tag."
+      }
+    ) }),
+    caption && /* @__PURE__ */ jsx10("figcaption", { className: "mt-2 text-center text-sm text-muted-foreground italic", children: caption })
+  ] });
+}
+
+// src/components/docs/image-card.tsx
+import NextImage2 from "next/image";
+import Link3 from "next/link";
+import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+function ImageCard({
+  src,
+  alt,
+  title,
+  description,
+  href,
+  external = false,
+  aspectRatio = "video"
+}) {
+  const aspectRatios = {
+    square: "aspect-square",
+    video: "aspect-video",
+    portrait: "aspect-[3/4]"
+  };
+  const content = /* @__PURE__ */ jsxs10("div", { className: "flex flex-col gap-0 p-0", children: [
+    /* @__PURE__ */ jsx11("div", { className: `w-full ${aspectRatios[aspectRatio]} overflow-hidden ${title || description ? "rounded-t-xl" : "rounded-xl"} bg-muted relative`, children: /* @__PURE__ */ jsx11(
+      NextImage2,
+      {
+        src,
+        alt,
+        fill: true,
+        sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",
+        className: "object-cover transition-transform duration-300 group-hover:scale-105"
+      }
+    ) }),
+    (title || description) && /* @__PURE__ */ jsxs10("div", { className: "p-3 flex flex-col gap-1", children: [
+      title && /* @__PURE__ */ jsx11("h3", { className: `font-semibold text-foreground mb-0 no-underline ${href ? "group-hover:text-primary transition-colors" : ""}`, children: title }),
+      description && /* @__PURE__ */ jsx11("p", { className: "text-sm text-muted-foreground line-clamp-2 no-underline mb-0", children: description })
+    ] })
+  ] });
+  if (href) {
+    const Component = external ? "a" : Link3;
+    return /* @__PURE__ */ jsx11(
+      Component,
+      {
+        href,
+        className: "image-card-link group block rounded-xl border border-border hover:border-primary/50 hover:shadow-lg transition-all overflow-hidden p-0",
+        ...external ? { target: "_blank", rel: "noopener noreferrer" } : {},
+        children: content
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx11("div", { className: "block rounded-xl border border-border overflow-hidden bg-card p-0", children: content });
+}
+function ImageCardGrid({ children, cols = 3 }) {
+  const gridCols = {
+    1: "grid-cols-1",
+    2: "grid-cols-1 md:grid-cols-2",
+    3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
+    4: "grid-cols-1 md:grid-cols-2 lg:grid-cols-4"
+  };
+  return /* @__PURE__ */ jsx11("div", { className: `grid ${gridCols[cols]} gap-4 my-6`, children });
+}
+
+// src/components/docs/steps.tsx
+import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+function Steps({ children }) {
+  return /* @__PURE__ */ jsx12("div", { className: "my-6 ml-4 space-y-6 [counter-reset:step]", children });
+}
+function Step({ title, children }) {
+  return /* @__PURE__ */ jsxs11("div", { className: "relative pl-8 pb-6 border-l-2 border-border last:border-l-0 last:pb-0 [counter-increment:step] before:content-[counter(step)] before:absolute before:left-0 before:-translate-x-1/2 before:w-8 before:h-8 before:rounded-full before:bg-primary before:text-primary-foreground before:flex before:items-center before:justify-center before:text-sm before:font-semibold before:z-10", children: [
+    /* @__PURE__ */ jsx12("div", { className: "mb-2", children: /* @__PURE__ */ jsx12("h3", { className: "text-lg font-semibold text-foreground", children: title }) }),
+    /* @__PURE__ */ jsx12("div", { className: "prose prose-sm dark:prose-invert max-w-none [&>*:last-child]:mb-0", children })
+  ] });
+}
+
+// src/components/docs/mermaid.tsx
+import { useEffect, useRef, useState as useState5 } from "react";
+import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+function Mermaid({ chart, caption }) {
+  const containerRef = useRef(null);
+  const [error, setError] = useState5(null);
+  useEffect(() => {
+    const renderChart = async () => {
+      try {
+        const mermaid = (await import("mermaid")).default;
+        mermaid.initialize({
+          startOnLoad: false,
+          theme: document.documentElement.classList.contains("dark") ? "dark" : "default",
+          securityLevel: "loose",
+          fontFamily: "inherit"
+        });
+        if (containerRef.current) {
+          const id = `mermaid-${Math.random().toString(36).substr(2, 9)}`;
+          const { svg } = await mermaid.render(id, chart);
+          containerRef.current.innerHTML = svg;
+        }
+      } catch (err) {
+        console.error("Mermaid rendering error:", err);
+        setError(err instanceof Error ? err.message : "Failed to render diagram");
+      }
+    };
+    renderChart();
+    const observer = new MutationObserver((mutations) => {
+      mutations.forEach((mutation) => {
+        if (mutation.attributeName === "class") {
+          renderChart();
+        }
+      });
+    });
+    observer.observe(document.documentElement, { attributes: true });
+    return () => observer.disconnect();
+  }, [chart]);
+  if (error) {
+    return /* @__PURE__ */ jsx13("div", { className: "my-6 p-4 rounded-xl border border-red-500/50 bg-red-500/10", children: /* @__PURE__ */ jsxs12("p", { className: "text-sm text-red-600 dark:text-red-400 font-mono", children: [
+      "Mermaid Error: ",
+      error
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxs12("figure", { className: "my-6", children: [
+    /* @__PURE__ */ jsx13(
+      "div",
+      {
+        ref: containerRef,
+        className: "flex justify-center items-center p-6 rounded-xl border border-border bg-muted/30 overflow-x-auto"
+      }
+    ),
+    caption && /* @__PURE__ */ jsx13("figcaption", { className: "mt-2 text-center text-sm text-muted-foreground italic", children: caption })
+  ] });
+}
+
+// src/components/docs/math.tsx
+import { useEffect as useEffect2, useRef as useRef2 } from "react";
+import { jsx as jsx14 } from "react/jsx-runtime";
+function Math2({ children, block = false }) {
+  const containerRef = useRef2(null);
+  useEffect2(() => {
+    const renderMath = async () => {
+      try {
+        const katex = (await import("katex")).default;
+        if (containerRef.current) {
+          katex.render(children, containerRef.current, {
+            throwOnError: false,
+            displayMode: block
+          });
+        }
+      } catch (err) {
+        console.error("KaTeX rendering error:", err);
+        if (containerRef.current) {
+          containerRef.current.textContent = children;
+        }
+      }
+    };
+    renderMath();
+  }, [children, block]);
+  if (block) {
+    return /* @__PURE__ */ jsx14(
+      "div",
+      {
+        ref: containerRef,
+        className: "my-6 overflow-x-auto text-center"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx14("span", { ref: containerRef, className: "inline-block" });
+}
+
+// src/components/docs/columns.tsx
+import { jsx as jsx15 } from "react/jsx-runtime";
+function Columns({ children, cols = { sm: 1, md: 2, lg: 3 } }) {
+  const colClasses = {
+    1: "grid-cols-1",
+    2: "grid-cols-2",
+    3: "grid-cols-3",
+    4: "grid-cols-4"
+  };
+  const smClass = cols.sm ? colClasses[cols.sm] : "grid-cols-1";
+  const mdClass = cols.md ? `md:${colClasses[cols.md]}` : "";
+  const lgClass = cols.lg ? `lg:${colClasses[cols.lg]}` : "";
+  const xlClass = cols.xl ? `xl:${colClasses[cols.xl]}` : "";
+  return /* @__PURE__ */ jsx15("div", { className: `grid ${smClass} ${mdClass} ${lgClass} ${xlClass} gap-4 my-6`, children });
+}
+function Column({ children, span = 1 }) {
+  const spanClass = {
+    1: "col-span-1",
+    2: "col-span-2",
+    3: "col-span-3",
+    4: "col-span-4"
+  };
+  return /* @__PURE__ */ jsx15("div", { className: spanClass[span], children });
+}
+
+// src/components/docs/tooltip.tsx
+import { useState as useState6 } from "react";
+import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
+function Tooltip({ children, content, position = "top" }) {
+  const [isVisible, setIsVisible] = useState6(false);
+  const positions = {
+    top: "bottom-full left-1/2 -translate-x-1/2 mb-2",
+    bottom: "top-full left-1/2 -translate-x-1/2 mt-2",
+    left: "right-full top-1/2 -translate-y-1/2 mr-2",
+    right: "left-full top-1/2 -translate-y-1/2 ml-2"
+  };
+  return /* @__PURE__ */ jsxs13(
+    "span",
+    {
+      className: "relative inline-flex underline decoration-dotted cursor-help",
+      onMouseEnter: () => setIsVisible(true),
+      onMouseLeave: () => setIsVisible(false),
+      children: [
+        children,
+        isVisible && /* @__PURE__ */ jsx16(
+          "span",
+          {
+            className: `absolute ${positions[position]} z-50 px-2 py-1 text-xs text-white bg-gray-900 dark:bg-gray-700 rounded whitespace-nowrap pointer-events-none`,
+            children: content
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/docs/frame.tsx
+import { jsx as jsx17 } from "react/jsx-runtime";
+function Frame({ src, title = "Embedded content", height = 500, width = "100%" }) {
+  return /* @__PURE__ */ jsx17("div", { className: "my-6 rounded-xl border border-border overflow-hidden bg-muted/30", children: /* @__PURE__ */ jsx17(
+    "iframe",
+    {
+      src,
+      title,
+      width,
+      height,
+      className: "w-full",
+      loading: "lazy",
+      sandbox: "allow-scripts allow-same-origin allow-forms allow-popups"
+    }
+  ) });
+}
+
+// src/components/docs/api/api-endpoint.tsx
+import { useState as useState7 } from "react";
+import { ChevronDown as ChevronDown2 } from "lucide-react";
+
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+function getAssetPath(path) {
+  const basePath = process.env.NEXT_PUBLIC_BASE_PATH || process.env.__NEXT_ROUTER_BASEPATH || "";
+  const normalizedPath = path.startsWith("/") ? path : `/${path}`;
+  if (basePath) {
+    const normalizedBase = basePath.startsWith("/") ? basePath : `/${basePath}`;
+    const cleanBase = normalizedBase.replace(/\/$/, "");
+    return `${cleanBase}${normalizedPath}`;
+  }
+  return normalizedPath;
+}
+
+// src/components/docs/api/api-endpoint.tsx
+import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
+var methodColors = {
+  GET: "bg-blue-500/10 text-blue-600 dark:text-blue-400",
+  POST: "bg-green-500/10 text-green-600 dark:text-green-400",
+  PUT: "bg-orange-500/10 text-orange-600 dark:text-orange-400",
+  PATCH: "bg-purple-500/10 text-purple-600 dark:text-purple-400",
+  DELETE: "bg-red-500/10 text-red-600 dark:text-red-400"
+};
+function ApiEndpoint({ method, path, summary, children, defaultOpen = false }) {
+  const [isOpen, setIsOpen] = useState7(defaultOpen);
+  return /* @__PURE__ */ jsxs14("div", { className: "not-prose mb-4 rounded-xl border border-border overflow-hidden", children: [
+    /* @__PURE__ */ jsxs14(
+      "button",
+      {
+        onClick: () => setIsOpen(!isOpen),
+        className: "w-full flex items-center gap-3 px-4 py-3 text-left bg-muted/30 hover:bg-muted/50 transition-colors",
+        children: [
+          /* @__PURE__ */ jsx18(
+            "span",
+            {
+              className: cn(
+                "text-xs font-semibold px-2 py-0.5 rounded",
+                methodColors[method]
+              ),
+              children: method
+            }
+          ),
+          /* @__PURE__ */ jsx18("code", { className: "text-sm font-mono", children: path }),
+          summary && /* @__PURE__ */ jsx18("span", { className: "text-sm text-muted-foreground ml-auto mr-2", children: summary }),
+          /* @__PURE__ */ jsx18(
+            ChevronDown2,
+            {
+              className: cn(
+                "h-5 w-5 text-muted-foreground transition-transform flex-shrink-0",
+                isOpen ? "rotate-180" : ""
+              )
+            }
+          )
+        ]
+      }
+    ),
+    isOpen && children && /* @__PURE__ */ jsx18("div", { className: "border-t border-border bg-background", children: /* @__PURE__ */ jsx18("div", { className: "px-4 py-4 space-y-6", children }) })
+  ] });
+}
+
+// src/components/docs/api/api-params.tsx
+import { jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
+function ApiParams({ title = "Parameters", params }) {
+  if (!params || params.length === 0) return null;
+  return /* @__PURE__ */ jsxs15("div", { className: "mb-6", children: [
+    /* @__PURE__ */ jsx19("h4", { className: "text-sm font-semibold text-foreground mb-3", children: title }),
+    /* @__PURE__ */ jsx19("div", { className: "space-y-3", children: params.map((param) => /* @__PURE__ */ jsxs15("div", { className: "flex flex-col gap-1", children: [
+      /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx19("code", { className: "text-sm font-mono text-foreground", children: param.name }),
+        /* @__PURE__ */ jsx19("span", { className: "text-xs text-muted-foreground", children: param.type }),
+        param.required && /* @__PURE__ */ jsx19("span", { className: "text-xs text-red-600 dark:text-red-400", children: "required" }),
+        param.default && /* @__PURE__ */ jsxs15("span", { className: "text-xs text-muted-foreground", children: [
+          "default: ",
+          /* @__PURE__ */ jsx19("code", { className: "text-xs", children: param.default })
+        ] })
+      ] }),
+      param.description && /* @__PURE__ */ jsx19("p", { className: "text-sm text-muted-foreground", children: param.description })
+    ] }, param.name)) })
+  ] });
+}
+
+// src/components/docs/api/api-response.tsx
+import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
+var statusColors = {
+  "2": "text-green-600 dark:text-green-400",
+  "3": "text-blue-600 dark:text-blue-400",
+  "4": "text-orange-600 dark:text-orange-400",
+  "5": "text-red-600 dark:text-red-400"
+};
+function ApiResponse({ status, description, example, schema }) {
+  const statusClass = statusColors[String(status)[0]] || "text-muted-foreground";
+  return /* @__PURE__ */ jsxs16("div", { className: "mb-4", children: [
+    /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-2 mb-2", children: [
+      /* @__PURE__ */ jsx20("span", { className: `text-sm font-semibold ${statusClass}`, children: status }),
+      description && /* @__PURE__ */ jsx20("span", { className: "text-sm text-muted-foreground", children: description })
+    ] }),
+    example && /* @__PURE__ */ jsxs16("div", { className: "mb-3", children: [
+      /* @__PURE__ */ jsx20("p", { className: "text-xs font-semibold text-muted-foreground mb-2", children: "Example Response" }),
+      /* @__PURE__ */ jsx20(
+        CodeBlock,
+        {
+          code: typeof example === "string" ? example : JSON.stringify(example, null, 2),
+          language: "json"
+        }
+      )
+    ] }),
+    schema && /* @__PURE__ */ jsxs16("div", { children: [
+      /* @__PURE__ */ jsx20("p", { className: "text-xs font-semibold text-muted-foreground mb-2", children: "Schema" }),
+      /* @__PURE__ */ jsx20(
+        CodeBlock,
+        {
+          code: typeof schema === "string" ? schema : JSON.stringify(schema, null, 2),
+          language: "json"
+        }
+      )
+    ] })
+  ] });
+}
+
+// src/components/docs/api/api-playground.tsx
+import { useState as useState8, useMemo } from "react";
+
+// src/components/ui/button.tsx
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { jsx as jsx21 } from "react/jsx-runtime";
+var buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button({
+  className,
+  variant,
+  size,
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "button";
+  return /* @__PURE__ */ jsx21(
+    Comp,
+    {
+      "data-slot": "button",
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }
+  );
+}
+
+// src/components/ui/input.tsx
+import { jsx as jsx22 } from "react/jsx-runtime";
+function Input({ className, type, ...props }) {
+  return /* @__PURE__ */ jsx22(
+    "input",
+    {
+      type,
+      "data-slot": "input",
+      className: cn(
+        "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+        "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/components/ui/textarea.tsx
+import { jsx as jsx23 } from "react/jsx-runtime";
+function Textarea({ className, ...props }) {
+  return /* @__PURE__ */ jsx23(
+    "textarea",
+    {
+      "data-slot": "textarea",
+      className: cn(
+        "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/components/ui/badge.tsx
+import { Slot as Slot2 } from "@radix-ui/react-slot";
+import { cva as cva2 } from "class-variance-authority";
+import { jsx as jsx24 } from "react/jsx-runtime";
+var badgeVariants = cva2(
+  "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+        secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+        destructive: "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge2({
+  className,
+  variant,
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot2 : "span";
+  return /* @__PURE__ */ jsx24(
+    Comp,
+    {
+      "data-slot": "badge",
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+
+// src/components/docs/api/api-playground.tsx
+import { Play, Loader2 } from "lucide-react";
+import { Fragment as Fragment4, jsx as jsx25, jsxs as jsxs17 } from "react/jsx-runtime";
+function ApiPlayground({
+  method,
+  path,
+  baseUrl = "",
+  headers = {},
+  defaultBody,
+  pathParams = []
+}) {
+  const [loading, setLoading] = useState8(false);
+  const [response, setResponse] = useState8(null);
+  const [error, setError] = useState8(null);
+  const [requestBody, setRequestBody] = useState8(defaultBody || "");
+  const initialHeaders = useMemo(() => {
+    const cleanHeaders = {};
+    Object.entries(headers).forEach(([key, value]) => {
+      cleanHeaders[key] = value || "";
+    });
+    return cleanHeaders;
+  }, [headers]);
+  const [requestHeaders, setRequestHeaders] = useState8(JSON.stringify(initialHeaders, null, 2));
+  const extractedParams = useMemo(() => {
+    const params = {};
+    const pathParamPattern = /:(\w+)/g;
+    let match;
+    while ((match = pathParamPattern.exec(path)) !== null) {
+      const paramName = match[1];
+      const paramConfig = pathParams.find((p) => p.name === paramName);
+      if (paramConfig?.example !== void 0) {
+        params[paramName] = String(paramConfig.example);
+      } else if (paramConfig?.type === "number") {
+        params[paramName] = "1";
+      } else {
+        params[paramName] = "";
+      }
+    }
+    return params;
+  }, [path, pathParams]);
+  const [pathParamValues, setPathParamValues] = useState8(extractedParams);
+  const buildUrl = () => {
+    let finalPath = path;
+    Object.entries(pathParamValues).forEach(([key, value]) => {
+      finalPath = finalPath.replace(`:${key}`, value);
+    });
+    return `${baseUrl}${finalPath}`;
+  };
+  const handleSend = async () => {
+    setLoading(true);
+    setError(null);
+    setResponse(null);
+    try {
+      const url = buildUrl();
+      const parsedHeaders = JSON.parse(requestHeaders);
+      const options = {
+        method,
+        headers: {
+          "Content-Type": "application/json",
+          ...parsedHeaders
+        }
+      };
+      if (method !== "GET" && method !== "DELETE" && requestBody) {
+        options.body = requestBody;
+      }
+      const res = await fetch(url, options);
+      const data = await res.json();
+      setResponse({
+        status: res.status,
+        statusText: res.statusText,
+        headers: Object.fromEntries(res.headers.entries()),
+        body: data
+      });
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "An error occurred");
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs17("div", { className: "not-prose border border-border rounded-lg overflow-hidden bg-card/30", children: [
+    /* @__PURE__ */ jsx25("div", { className: "bg-muted/50 px-4 py-2 border-b border-border", children: /* @__PURE__ */ jsx25("h4", { className: "text-sm font-semibold text-foreground", children: "API Playground" }) }),
+    /* @__PURE__ */ jsxs17("div", { className: "p-4 space-y-4", children: [
+      Object.keys(pathParamValues).length > 0 && /* @__PURE__ */ jsxs17("div", { children: [
+        /* @__PURE__ */ jsx25("label", { className: "text-xs font-semibold text-muted-foreground mb-2 block", children: "Path Parameters" }),
+        /* @__PURE__ */ jsx25("div", { className: "space-y-2", children: Object.entries(pathParamValues).map(([paramName, paramValue]) => {
+          const paramConfig = pathParams.find((p) => p.name === paramName);
+          return /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsxs17("span", { className: "text-xs text-muted-foreground min-w-[80px]", children: [
+              ":",
+              paramName
+            ] }),
+            /* @__PURE__ */ jsx25(
+              Input,
+              {
+                value: paramValue,
+                onChange: (e) => setPathParamValues((prev) => ({ ...prev, [paramName]: e.target.value })),
+                placeholder: paramConfig?.example || paramConfig?.type || "value",
+                className: "font-mono text-sm"
+              }
+            )
+          ] }, paramName);
+        }) })
+      ] }),
+      /* @__PURE__ */ jsxs17("div", { children: [
+        /* @__PURE__ */ jsx25("label", { className: "text-xs font-semibold text-muted-foreground mb-2 block", children: "Request URL" }),
+        /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx25(Badge2, { variant: "outline", className: "font-mono", children: method }),
+          /* @__PURE__ */ jsx25(Input, { value: buildUrl(), readOnly: true, className: "font-mono text-sm" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs17("div", { children: [
+        /* @__PURE__ */ jsx25("label", { className: "text-xs font-semibold text-muted-foreground mb-2 block", children: "Headers (JSON)" }),
+        /* @__PURE__ */ jsx25(
+          Textarea,
+          {
+            value: requestHeaders,
+            onChange: (e) => setRequestHeaders(e.target.value),
+            className: "font-mono text-sm",
+            rows: 4
+          }
+        )
+      ] }),
+      method !== "GET" && method !== "DELETE" && /* @__PURE__ */ jsxs17("div", { children: [
+        /* @__PURE__ */ jsx25("label", { className: "text-xs font-semibold text-muted-foreground mb-2 block", children: "Request Body (JSON)" }),
+        /* @__PURE__ */ jsx25(
+          Textarea,
+          {
+            value: requestBody,
+            onChange: (e) => setRequestBody(e.target.value),
+            className: "font-mono text-sm",
+            rows: 6,
+            placeholder: '{\\n  "key": "value"\\n}'
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx25(Button, { onClick: handleSend, disabled: loading, className: "w-full", children: loading ? /* @__PURE__ */ jsxs17(Fragment4, { children: [
+        /* @__PURE__ */ jsx25(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }),
+        "Sending..."
+      ] }) : /* @__PURE__ */ jsxs17(Fragment4, { children: [
+        /* @__PURE__ */ jsx25(Play, { className: "mr-2 h-4 w-4" }),
+        "Send Request"
+      ] }) }),
+      response && /* @__PURE__ */ jsxs17("div", { className: "mt-4", children: [
+        /* @__PURE__ */ jsxs17("label", { className: "text-xs font-semibold text-muted-foreground mb-2 block", children: [
+          "Response (",
+          response.status,
+          " ",
+          response.statusText,
+          ")"
+        ] }),
+        /* @__PURE__ */ jsx25(CodeBlock, { code: JSON.stringify(response.body, null, 2), language: "json" })
+      ] }),
+      error && /* @__PURE__ */ jsx25("div", { className: "mt-4 p-3 bg-red-500/10 border border-red-500/20 rounded-md", children: /* @__PURE__ */ jsx25("p", { className: "text-sm text-red-600 dark:text-red-400", children: error }) })
+    ] })
+  ] });
+}
+
+// src/components/docs/api/api-reference.tsx
+import { useState as useState9, useEffect as useEffect3 } from "react";
+
+// src/lib/parsers/specra-parser.ts
+var SpecraParser = class {
+  validate(input) {
+    return typeof input === "object" && input !== null && "endpoints" in input && Array.isArray(input.endpoints);
+  }
+  parse(input) {
+    if (!this.validate(input)) {
+      throw new Error("Invalid Specra API spec format");
+    }
+    return input;
+  }
+};
+
+// src/lib/parsers/openapi-parser.ts
+var OpenApiParser = class {
+  validate(input) {
+    return typeof input === "object" && input !== null && ("openapi" in input || "swagger" in input) && "paths" in input;
+  }
+  parse(input) {
+    if (!this.validate(input)) {
+      throw new Error("Invalid OpenAPI spec format");
+    }
+    const baseUrl = this.extractBaseUrl(input);
+    const endpoints = [];
+    for (const [path, pathItem] of Object.entries(input.paths || {})) {
+      const methods = ["get", "post", "put", "patch", "delete"];
+      for (const method of methods) {
+        const operation = pathItem[method];
+        if (!operation) continue;
+        const endpoint = this.parseOperation(path, method.toUpperCase(), operation, input);
+        endpoints.push(endpoint);
+      }
+    }
+    return {
+      version: input.info?.version,
+      title: input.info?.title,
+      description: input.info?.description,
+      baseUrl,
+      auth: this.extractAuth(input),
+      endpoints
+    };
+  }
+  extractBaseUrl(spec) {
+    if (spec.servers && spec.servers.length > 0) {
+      return spec.servers[0].url;
+    }
+    if (spec.host) {
+      const scheme = spec.schemes?.[0] || "https";
+      const basePath = spec.basePath || "";
+      return `${scheme}://${spec.host}${basePath}`;
+    }
+    return "";
+  }
+  extractAuth(spec) {
+    const securitySchemes = spec.components?.securitySchemes || spec.securityDefinitions;
+    if (!securitySchemes) return void 0;
+    const firstScheme = Object.values(securitySchemes)[0];
+    if (!firstScheme) return void 0;
+    if (firstScheme.type === "http" && firstScheme.scheme === "bearer") {
+      return {
+        type: "bearer",
+        description: firstScheme.description,
+        tokenPrefix: "Bearer"
+      };
+    }
+    if (firstScheme.type === "apiKey") {
+      return {
+        type: "apiKey",
+        description: firstScheme.description,
+        headerName: firstScheme.name || "X-API-Key"
+      };
+    }
+    if (firstScheme.type === "http" && firstScheme.scheme === "basic") {
+      return {
+        type: "basic",
+        description: firstScheme.description
+      };
+    }
+    return void 0;
+  }
+  parseOperation(path, method, operation, spec) {
+    const endpoint = {
+      title: operation.summary || operation.operationId || `${method} ${path}`,
+      method,
+      path: this.convertPathParams(path),
+      description: operation.description
+    };
+    const params = this.parseParameters(operation.parameters || [], spec);
+    if (params.path.length > 0) endpoint.pathParams = params.path;
+    if (params.query.length > 0) endpoint.queryParams = params.query;
+    if (params.header.length > 0) {
+      endpoint.headers = params.header.map((p) => ({
+        name: p.name,
+        value: p.example || "",
+        description: p.description
+      }));
+    }
+    if (operation.requestBody) {
+      endpoint.body = this.parseRequestBody(operation.requestBody, spec);
+    }
+    const responses = this.parseResponses(operation.responses || {}, spec);
+    if (responses.success) endpoint.successResponse = responses.success;
+    if (responses.errors.length > 0) endpoint.errorResponses = responses.errors;
+    return endpoint;
+  }
+  convertPathParams(path) {
+    return path.replace(/\{([^}]+)\}/g, ":$1");
+  }
+  parseParameters(parameters, spec) {
+    const result = { path: [], query: [], header: [] };
+    for (const param of parameters) {
+      const resolved = param.$ref ? this.resolveRef(param.$ref, spec) : param;
+      const apiParam = {
+        name: resolved.name,
+        type: resolved.schema?.type || resolved.type || "string",
+        required: resolved.required,
+        description: resolved.description,
+        example: resolved.example || resolved.schema?.example
+      };
+      if (resolved.in === "path") result.path.push(apiParam);
+      else if (resolved.in === "query") result.query.push(apiParam);
+      else if (resolved.in === "header") result.header.push(apiParam);
+    }
+    return result;
+  }
+  parseRequestBody(requestBody, spec) {
+    const content = requestBody.content?.["application/json"];
+    if (!content) return void 0;
+    return {
+      description: requestBody.description,
+      example: content.example || this.generateExample(content.schema, spec),
+      schema: content.schema
+    };
+  }
+  parseResponses(responses, spec) {
+    const result = { errors: [] };
+    for (const [statusCode, response] of Object.entries(responses)) {
+      const status = parseInt(statusCode);
+      if (isNaN(status)) continue;
+      const resolved = response.$ref ? this.resolveRef(response.$ref, spec) : response;
+      const content = resolved.content?.["application/json"];
+      const apiResponse = {
+        status,
+        description: resolved.description,
+        example: content?.example || this.generateExample(content?.schema, spec),
+        schema: content?.schema
+      };
+      if (status >= 200 && status < 300) {
+        result.success = apiResponse;
+      } else {
+        result.errors.push(apiResponse);
+      }
+    }
+    return result;
+  }
+  generateExample(schema, spec) {
+    if (!schema) return void 0;
+    if (schema.$ref) schema = this.resolveRef(schema.$ref, spec);
+    if (schema.example) return schema.example;
+    if (schema.type === "object" && schema.properties) {
+      const example = {};
+      for (const [key, prop] of Object.entries(schema.properties)) {
+        example[key] = this.generateExample(prop, spec);
+      }
+      return example;
+    }
+    if (schema.type === "array" && schema.items) {
+      return [this.generateExample(schema.items, spec)];
+    }
+    const defaults = {
+      string: "string",
+      number: 0,
+      integer: 0,
+      boolean: false,
+      object: {},
+      array: []
+    };
+    return defaults[schema.type] || null;
+  }
+  resolveRef(ref, spec) {
+    const path = ref.replace(/^#\//, "").split("/");
+    let current = spec;
+    for (const segment of path) {
+      current = current[segment];
+      if (!current) return {};
+    }
+    return current;
+  }
+};
+
+// src/lib/parsers/postman-parser.ts
+var PostmanParser = class {
+  validate(input) {
+    return typeof input === "object" && input !== null && "info" in input && input.info?.schema?.includes("v2");
+  }
+  parse(input) {
+    if (!this.validate(input)) {
+      throw new Error("Invalid Postman Collection format (requires v2.0 or v2.1)");
+    }
+    const baseUrl = this.extractBaseUrl(input);
+    const endpoints = [];
+    this.parseItems(input.item || [], endpoints, baseUrl, input);
+    return {
+      version: input.info?.version,
+      title: input.info?.name,
+      description: input.info?.description,
+      baseUrl,
+      auth: this.extractAuth(input.auth),
+      globalHeaders: this.extractGlobalHeaders(input),
+      endpoints
+    };
+  }
+  extractBaseUrl(collection) {
+    const baseUrlVar = collection.variable?.find(
+      (v) => v.key === "baseUrl" || v.key === "base_url" || v.key === "url"
+    );
+    if (baseUrlVar) return baseUrlVar.value;
+    if (collection.item && collection.item.length > 0) {
+      const firstRequest = this.findFirstRequest(collection.item);
+      if (firstRequest?.request?.url) {
+        const url = this.parseUrl(firstRequest.request.url);
+        if (url.host) {
+          return `${url.protocol}://${url.host.join(".")}`;
+        }
+      }
+    }
+    return "";
+  }
+  findFirstRequest(items) {
+    for (const item of items) {
+      if (item.request) return item;
+      if (item.item) {
+        const found = this.findFirstRequest(item.item);
+        if (found) return found;
+      }
+    }
+    return null;
+  }
+  extractAuth(auth) {
+    if (!auth) return void 0;
+    if (auth.type === "bearer") {
+      return {
+        type: "bearer",
+        tokenPrefix: "Bearer"
+      };
+    }
+    if (auth.type === "apikey") {
+      const keyData = auth.apikey?.find((a) => a.key === "key");
+      const keyName = keyData?.value || "X-API-Key";
+      return {
+        type: "apiKey",
+        headerName: keyName
+      };
+    }
+    if (auth.type === "basic") {
+      return {
+        type: "basic"
+      };
+    }
+    return void 0;
+  }
+  extractGlobalHeaders(collection) {
+    return [];
+  }
+  parseItems(items, endpoints, baseUrl, collection) {
+    for (const item of items) {
+      if (item.item && Array.isArray(item.item)) {
+        this.parseItems(item.item, endpoints, baseUrl, collection);
+      } else if (item.request) {
+        const endpoint = this.parseRequest(item, baseUrl, collection);
+        endpoints.push(endpoint);
+      }
+    }
+  }
+  parseRequest(item, baseUrl, collection) {
+    const request = item.request;
+    const url = this.parseUrl(request.url);
+    const endpoint = {
+      title: item.name,
+      method: request.method.toUpperCase(),
+      path: this.buildPath(url, baseUrl),
+      description: item.request.description || item.description
+    };
+    const params = this.parseUrlParams(url);
+    if (params.path.length > 0) endpoint.pathParams = params.path;
+    if (params.query.length > 0) endpoint.queryParams = params.query;
+    if (request.header && request.header.length > 0) {
+      endpoint.headers = request.header.filter((h) => !h.disabled).map((h) => ({
+        name: h.key,
+        value: h.value || "",
+        description: h.description
+      }));
+    }
+    if (request.body) {
+      endpoint.body = this.parseBody(request.body);
+    }
+    const responses = this.parseResponses(item.response || []);
+    if (responses.success) endpoint.successResponse = responses.success;
+    if (responses.errors.length > 0) endpoint.errorResponses = responses.errors;
+    return endpoint;
+  }
+  parseUrl(url) {
+    if (typeof url === "string") {
+      const urlObj = new URL(url);
+      return {
+        protocol: urlObj.protocol.replace(":", ""),
+        host: urlObj.hostname.split("."),
+        path: urlObj.pathname.split("/").filter(Boolean),
+        query: [],
+        variable: []
+      };
+    }
+    return {
+      protocol: url.protocol || "https",
+      host: url.host || [],
+      path: url.path || [],
+      query: url.query || [],
+      variable: url.variable || []
+    };
+  }
+  buildPath(url, baseUrl) {
+    let path = "/";
+    if (url.path && url.path.length > 0) {
+      path += url.path.join("/");
+    }
+    path = path.replace(/\{\{([^}]+)\}\}/g, ":$1");
+    return path;
+  }
+  parseUrlParams(url) {
+    const result = { path: [], query: [] };
+    if (url.variable && url.variable.length > 0) {
+      for (const v of url.variable) {
+        result.path.push({
+          name: v.key,
+          type: v.type || "string",
+          description: v.description,
+          example: v.value
+        });
+      }
+    }
+    if (url.path && url.path.length > 0) {
+      for (const segment of url.path) {
+        if (segment.startsWith(":")) {
+          const paramName = segment.slice(1);
+          if (!result.path.find((p) => p.name === paramName)) {
+            result.path.push({
+              name: paramName,
+              type: "string"
+            });
+          }
+        }
+      }
+    }
+    if (url.query && url.query.length > 0) {
+      for (const q of url.query) {
+        if (q.disabled) continue;
+        result.query.push({
+          name: q.key,
+          type: "string",
+          description: q.description,
+          example: q.value
+        });
+      }
+    }
+    return result;
+  }
+  parseBody(body) {
+    if (!body) return void 0;
+    let example;
+    let description = body.description;
+    if (body.mode === "raw") {
+      try {
+        example = JSON.parse(body.raw);
+      } catch {
+        example = body.raw;
+      }
+    } else if (body.mode === "formdata" || body.mode === "urlencoded") {
+      example = {};
+      for (const item of body[body.mode] || []) {
+        if (!item.disabled) {
+          example[item.key] = item.value;
+        }
+      }
+    }
+    return {
+      description,
+      example
+    };
+  }
+  parseResponses(responses) {
+    const result = { errors: [] };
+    for (const response of responses) {
+      let example;
+      try {
+        example = JSON.parse(response.body);
+      } catch {
+        example = response.body;
+      }
+      const apiResponse = {
+        status: response.code || 200,
+        description: response.name,
+        example
+      };
+      if (apiResponse.status >= 200 && apiResponse.status < 300) {
+        if (!result.success) result.success = apiResponse;
+      } else {
+        result.errors.push(apiResponse);
+      }
+    }
+    return result;
+  }
+};
+
+// src/lib/parsers/index.ts
+var parsers = /* @__PURE__ */ new Map([
+  ["specra", new SpecraParser()],
+  ["openapi", new OpenApiParser()],
+  ["postman", new PostmanParser()]
+]);
+function detectParserType(input) {
+  if (!input || typeof input !== "object") {
+    throw new Error("Invalid API spec: input must be an object");
+  }
+  if (input.info?.schema?.includes("v2")) {
+    return "postman";
+  }
+  if (input.openapi || input.swagger) {
+    return "openapi";
+  }
+  if (input.endpoints && Array.isArray(input.endpoints)) {
+    return "specra";
+  }
+  throw new Error(
+    "Unable to auto-detect API spec format. Supported formats: Specra, OpenAPI 3.x, Postman Collection v2.x"
+  );
+}
+function parseApiSpec(input, parserType = "auto") {
+  const actualType = parserType === "auto" ? detectParserType(input) : parserType;
+  const parser = parsers.get(actualType);
+  if (!parser) {
+    throw new Error(`Unknown parser type: ${actualType}`);
+  }
+  if (!parser.validate(input)) {
+    throw new Error(`Input does not match ${actualType} format`);
+  }
+  return parser.parse(input);
+}
+
+// src/components/docs/api/api-reference.tsx
+import { Loader2 as Loader22 } from "lucide-react";
+import { jsx as jsx26, jsxs as jsxs18 } from "react/jsx-runtime";
+function ApiReference({ spec, parser = "auto", showPlayground = true }) {
+  const [apiSpec, setApiSpec] = useState9(null);
+  const [loading, setLoading] = useState9(true);
+  const [error, setError] = useState9(null);
+  useEffect3(() => {
+    async function loadSpec() {
+      try {
+        const response = await fetch(spec);
+        if (!response.ok) {
+          throw new Error(`Failed to load API spec: ${response.statusText}`);
+        }
+        const data = await response.json();
+        const parsedSpec = parseApiSpec(data, parser);
+        setApiSpec(parsedSpec);
+      } catch (err) {
+        setError(err instanceof Error ? err.message : "Failed to load API spec");
+      } finally {
+        setLoading(false);
+      }
+    }
+    loadSpec();
+  }, [spec, parser]);
+  const interpolateEnv = (text, env) => {
+    if (!env) return text;
+    return text.replace(/\{(\w+)\}/g, (match, key) => {
+      return env[key] || match;
+    });
+  };
+  if (loading) {
+    return /* @__PURE__ */ jsxs18("div", { className: "flex items-center justify-center py-12", children: [
+      /* @__PURE__ */ jsx26(Loader22, { className: "h-6 w-6 animate-spin text-muted-foreground" }),
+      /* @__PURE__ */ jsx26("span", { className: "ml-2 text-muted-foreground", children: "Loading API specification..." })
+    ] });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx26("div", { className: "rounded-lg border border-red-500/20 bg-red-500/10 p-4", children: /* @__PURE__ */ jsxs18("p", { className: "text-sm text-red-600 dark:text-red-400", children: [
+      "Error: ",
+      error
+    ] }) });
+  }
+  if (!apiSpec) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs18("div", { className: "space-y-6", children: [
+    (apiSpec.title || apiSpec.description) && /* @__PURE__ */ jsxs18("div", { className: "mb-8", children: [
+      apiSpec.title && /* @__PURE__ */ jsx26("h2", { className: "text-2xl font-semibold mb-2 text-foreground", children: apiSpec.title }),
+      apiSpec.description && /* @__PURE__ */ jsx26("p", { className: "text-muted-foreground", children: apiSpec.description }),
+      apiSpec.baseUrl && /* @__PURE__ */ jsxs18("div", { className: "mt-4", children: [
+        /* @__PURE__ */ jsx26("p", { className: "text-sm font-semibold text-muted-foreground mb-1", children: "Base URL" }),
+        /* @__PURE__ */ jsx26("code", { className: "text-sm px-2 py-1 bg-muted rounded", children: apiSpec.baseUrl })
+      ] })
+    ] }),
+    apiSpec.auth && /* @__PURE__ */ jsxs18("div", { className: "rounded-lg border border-border bg-card/30 p-4 mb-6", children: [
+      /* @__PURE__ */ jsx26("h3", { className: "text-lg font-semibold mb-2 text-foreground", children: "Authentication" }),
+      /* @__PURE__ */ jsx26("p", { className: "text-sm text-muted-foreground mb-2", children: apiSpec.auth.description || `This API uses ${apiSpec.auth.type} authentication.` }),
+      apiSpec.auth.type === "bearer" && /* @__PURE__ */ jsx26(
+        CodeBlock,
+        {
+          code: `Authorization: ${apiSpec.auth.tokenPrefix || "Bearer"} {YOUR_TOKEN}`,
+          language: "bash"
+        }
+      ),
+      apiSpec.auth.type === "apiKey" && /* @__PURE__ */ jsx26(
+        CodeBlock,
+        {
+          code: `${apiSpec.auth.headerName || "X-API-Key"}: {YOUR_API_KEY}`,
+          language: "bash"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx26(Accordion, { type: "single", collapsible: true, className: "space-y-4", children: apiSpec.endpoints.map((endpoint, index) => {
+      const allHeaders = [
+        ...apiSpec.globalHeaders || [],
+        ...endpoint.headers || []
+      ].map((header) => ({
+        ...header,
+        value: interpolateEnv(header.value, apiSpec.env)
+      }));
+      return /* @__PURE__ */ jsx26(
+        AccordionItem,
+        {
+          value: `endpoint-${index}`,
+          title: /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ jsx26(
+              "span",
+              {
+                className: `text-xs font-semibold px-2 py-0.5 rounded ${endpoint.method === "GET" ? "bg-blue-500/10 text-blue-600 dark:text-blue-400" : endpoint.method === "POST" ? "bg-green-500/10 text-green-600 dark:text-green-400" : endpoint.method === "PUT" ? "bg-orange-500/10 text-orange-600 dark:text-orange-400" : endpoint.method === "PATCH" ? "bg-purple-500/10 text-purple-600 dark:text-purple-400" : "bg-red-500/10 text-red-600 dark:text-red-400"}`,
+                children: endpoint.method
+              }
+            ),
+            /* @__PURE__ */ jsx26("code", { className: "text-sm font-mono", children: endpoint.path }),
+            /* @__PURE__ */ jsx26("span", { className: "text-sm text-muted-foreground ml-auto", children: endpoint.title })
+          ] }),
+          children: /* @__PURE__ */ jsxs18("div", { className: "space-y-6 pt-4", children: [
+            endpoint.description && /* @__PURE__ */ jsx26("p", { className: "text-sm text-muted-foreground", children: endpoint.description }),
+            endpoint.pathParams && endpoint.pathParams.length > 0 && /* @__PURE__ */ jsx26(ApiParams, { title: "Path Parameters", params: endpoint.pathParams }),
+            endpoint.queryParams && endpoint.queryParams.length > 0 && /* @__PURE__ */ jsx26(ApiParams, { title: "Query Parameters", params: endpoint.queryParams }),
+            allHeaders.length > 0 && /* @__PURE__ */ jsxs18("div", { children: [
+              /* @__PURE__ */ jsx26("h4", { className: "text-sm font-semibold text-foreground mb-3", children: "Headers" }),
+              /* @__PURE__ */ jsx26("div", { className: "space-y-2", children: allHeaders.map((header, idx) => /* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-1", children: [
+                /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx26("code", { className: "text-sm font-mono text-foreground", children: header.name }),
+                  /* @__PURE__ */ jsx26("span", { className: "text-xs text-muted-foreground", children: header.value })
+                ] }),
+                header.description && /* @__PURE__ */ jsx26("p", { className: "text-sm text-muted-foreground", children: header.description })
+              ] }, idx)) })
+            ] }),
+            endpoint.body && /* @__PURE__ */ jsxs18("div", { children: [
+              /* @__PURE__ */ jsx26("h4", { className: "text-sm font-semibold text-foreground mb-3", children: "Request Body" }),
+              endpoint.body.description && /* @__PURE__ */ jsx26("p", { className: "text-sm text-muted-foreground mb-2", children: endpoint.body.description }),
+              endpoint.body.example && /* @__PURE__ */ jsx26(
+                CodeBlock,
+                {
+                  code: typeof endpoint.body.example === "string" ? endpoint.body.example : JSON.stringify(endpoint.body.example, null, 2),
+                  language: "json"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs18("div", { children: [
+              /* @__PURE__ */ jsx26("h4", { className: "text-sm font-semibold text-foreground mb-3", children: "Responses" }),
+              endpoint.successResponse && /* @__PURE__ */ jsx26(
+                ApiResponse,
+                {
+                  status: endpoint.successResponse.status,
+                  description: endpoint.successResponse.description,
+                  example: endpoint.successResponse.example,
+                  schema: endpoint.successResponse.schema
+                }
+              ),
+              endpoint.errorResponses?.map((response, idx) => /* @__PURE__ */ jsx26(
+                ApiResponse,
+                {
+                  status: response.status,
+                  description: response.description,
+                  example: response.example,
+                  schema: response.schema
+                },
+                idx
+              ))
+            ] }),
+            endpoint.examples && endpoint.examples.length > 0 && /* @__PURE__ */ jsxs18("div", { children: [
+              /* @__PURE__ */ jsx26("h4", { className: "text-sm font-semibold text-foreground mb-3", children: "Examples" }),
+              endpoint.examples.map((example, idx) => /* @__PURE__ */ jsxs18("div", { className: "mb-3", children: [
+                /* @__PURE__ */ jsx26("p", { className: "text-xs font-semibold text-muted-foreground mb-2", children: example.title }),
+                /* @__PURE__ */ jsx26(CodeBlock, { code: example.code, language: example.language })
+              ] }, idx))
+            ] }),
+            showPlayground && /* @__PURE__ */ jsx26(
+              ApiPlayground,
+              {
+                method: endpoint.method,
+                path: endpoint.path,
+                baseUrl: apiSpec.baseUrl,
+                headers: Object.fromEntries(allHeaders.map((h) => [h.name, h.value])),
+                pathParams: endpoint.pathParams,
+                defaultBody: endpoint.body?.example ? typeof endpoint.body.example === "string" ? endpoint.body.example : JSON.stringify(endpoint.body.example, null, 2) : void 0
+              }
+            )
+          ] })
+        },
+        index
+      );
+    }) })
+  ] });
+}
+
+// src/components/docs/mdx-components.tsx
+import { Fragment as Fragment5, jsx as jsx27 } from "react/jsx-runtime";
+var mdxComponents = {
+  h1: ({ children }) => /* @__PURE__ */ jsx27("h1", { className: "text-3xl font-semibold tracking-tight mb-6 text-foreground", children }),
+  h2: ({ children, id }) => /* @__PURE__ */ jsx27("h2", { id, className: "text-2xl font-semibold tracking-tight mt-10 mb-4 text-foreground scroll-mt-24", children }),
+  h3: ({ children, id }) => /* @__PURE__ */ jsx27("h3", { id, className: "text-xl font-medium tracking-tight mt-8 mb-3 text-foreground scroll-mt-24", children }),
+  p: ({ children }) => /* @__PURE__ */ jsx27("p", { className: "text-base leading-7 text-muted-foreground mb-4", children }),
+  code: ({ children, className, meta, ...props }) => {
+    const isInline = !className;
+    if (isInline) {
+      return /* @__PURE__ */ jsx27("code", { className: "px-1.5 py-0.5 rounded-md bg-muted/50 text-primary font-mono text-[13px] border border-border/50", children });
+    }
+    const language = className?.replace("language-", "") || "text";
+    const filename = meta || void 0;
+    const code = String(children).replace(/\n$/, "");
+    return /* @__PURE__ */ jsx27(CodeBlock, { code, language, filename });
+  },
+  pre: ({ children }) => /* @__PURE__ */ jsx27(Fragment5, { children }),
+  ul: ({ children }) => /* @__PURE__ */ jsx27("ul", { className: "list-disc list-outside pl-5 space-y-2 mb-4 text-muted-foreground [&_p]:mb-0 [&_p]:inline [&_ul]:ml-6 [&_ol]:ml-6", children }),
+  ol: ({ children }) => /* @__PURE__ */ jsx27("ol", { className: "list-decimal list-outside pl-5 space-y-2 mb-4 text-muted-foreground [&_p]:mb-0 [&_p]:inline [&_ul]:ml-6 [&_ol]:ml-6", children }),
+  li: ({ children }) => /* @__PURE__ */ jsx27("li", { className: "leading-7 [&>p]:mb-0 [&>p]:inline", children }),
+  a: ({ children, href }) => /* @__PURE__ */ jsx27(
+    "a",
+    {
+      href,
+      className: "text-primary hover:underline font-medium",
+      target: href?.startsWith("http") ? "_blank" : void 0,
+      rel: href?.startsWith("http") ? "noopener noreferrer" : void 0,
+      children
+    }
+  ),
+  blockquote: ({ children }) => {
+    const childrenArray = Array.isArray(children) ? children : [children];
+    const firstChild = childrenArray[0];
+    let textContent = "";
+    if (firstChild && typeof firstChild === "object" && "props" in firstChild) {
+      const props = firstChild.props;
+      if (props.children) {
+        const text = Array.isArray(props.children) ? props.children.join("") : String(props.children);
+        textContent = text;
+      }
+    }
+    const alertMatch = textContent.match(/^\[!(INFO|TIP|WARNING|SUCCESS|ERROR)\]/);
+    if (alertMatch) {
+      const type = alertMatch[1].toLowerCase();
+      const processChildren = (node) => {
+        if (typeof node === "string") {
+          return node.replace(/^\[!(INFO|TIP|WARNING|SUCCESS|ERROR)\]\s*\n?/, "");
+        }
+        if (node && typeof node === "object" && "props" in node) {
+          return {
+            ...node,
+            props: {
+              ...node.props,
+              children: Array.isArray(node.props.children) ? node.props.children.map(processChildren) : processChildren(node.props.children)
+            }
+          };
+        }
+        return node;
+      };
+      const cleanedChildren = Array.isArray(children) ? children.map(processChildren) : processChildren(children);
+      return /* @__PURE__ */ jsx27(Callout, { type, children: cleanedChildren });
+    }
+    return /* @__PURE__ */ jsx27("blockquote", { className: "border-l-4 border-primary/50 bg-muted/30 pl-4 pr-4 py-3 my-6 rounded-r-lg", children: /* @__PURE__ */ jsx27("div", { className: "text-muted-foreground italic [&>p]:mb-0", children }) });
+  },
+  table: ({ children }) => /* @__PURE__ */ jsx27("div", { className: "overflow-x-auto mb-6 rounded-xl border border-border", children: /* @__PURE__ */ jsx27("table", { className: "min-w-full border-collapse", children }) }),
+  th: ({ children }) => /* @__PURE__ */ jsx27("th", { className: "border-b border-r border-border bg-muted px-4 py-2 text-left font-semibold text-foreground last:border-r-0", children }),
+  td: ({ children }) => /* @__PURE__ */ jsx27("td", { className: "border-b border-r border-border px-4 py-2 text-muted-foreground last:border-r-0", children }),
+  // Custom components
+  Callout,
+  Accordion,
+  AccordionItem,
+  Tabs,
+  Tab,
+  Image,
+  Video,
+  Card,
+  CardGrid,
+  ImageCard,
+  ImageCardGrid,
+  Steps,
+  Step,
+  Icon,
+  Mermaid,
+  Math: Math2,
+  Columns,
+  Column,
+  Badge,
+  Tooltip,
+  Frame,
+  // API Documentation components
+  ApiEndpoint,
+  ApiParams,
+  ApiResponse,
+  ApiPlayground,
+  ApiReference
+};
+
+// src/lib/config.types.ts
+var defaultConfig = {
+  site: {
+    title: "Documentation",
+    description: "Project documentation",
+    baseUrl: "/",
+    language: "en"
+  },
+  theme: {
+    defaultMode: "system",
+    respectPrefersColorScheme: true
+  },
+  navigation: {
+    showSidebar: true,
+    collapsibleSidebar: true,
+    showBreadcrumbs: true,
+    showTableOfContents: true,
+    tocPosition: "right",
+    tocMaxDepth: 3
+  },
+  search: {
+    enabled: true,
+    provider: "local",
+    placeholder: "Search documentation..."
+  },
+  features: {
+    showLastUpdated: true,
+    showReadingTime: true,
+    showAuthors: false,
+    showTags: true,
+    versioning: true,
+    i18n: false
+  }
+};
+
+// src/lib/config.server.ts
+function deepMerge(target, source) {
+  const result = { ...target };
+  for (const key in source) {
+    const sourceValue = source[key];
+    const targetValue = result[key];
+    if (sourceValue && typeof sourceValue === "object" && !Array.isArray(sourceValue)) {
+      result[key] = deepMerge(
+        targetValue && typeof targetValue === "object" ? targetValue : {},
+        sourceValue
+      );
+    } else if (sourceValue !== void 0) {
+      result[key] = sourceValue;
+    }
+  }
+  return result;
+}
+function loadConfig(userConfig) {
+  try {
+    const config = deepMerge(defaultConfig, userConfig);
+    return config;
+  } catch (error) {
+    console.error(`\u274C Error loading configuration:`, error);
+    console.warn("Using default configuration.");
+    return defaultConfig;
+  }
+}
+function replaceEnvVariables(text, config) {
+  const cfg = config || loadConfig({});
+  const envVars = cfg.env || {};
+  let result = text;
+  result = result.replace(/\$\{([^}]+)\}/g, (match, varName) => {
+    return envVars[varName] || match;
+  });
+  result = result.replace(/\{\{([^}]+)\}\}/g, (match, varName) => {
+    return envVars[varName] || match;
+  });
+  return result;
+}
+function processContentWithEnv(content, config) {
+  return replaceEnvVariables(content, config);
+}
+
+// src/lib/sidebar-utils.ts
+function sortSidebarItems(items) {
+  return [...items].sort((a, b) => {
+    const posA = a.sidebar_position ?? a.meta?.sidebar_position ?? a.meta?.order ?? 999;
+    const posB = b.sidebar_position ?? b.meta?.sidebar_position ?? b.meta?.order ?? 999;
+    return posA - posB;
+  });
+}
+function sortSidebarGroups(groups) {
+  return Object.entries(groups).sort(([, a], [, b]) => {
+    const posA = a.position ?? 999;
+    const posB = b.position ?? 999;
+    return posA - posB;
+  });
+}
+
+// src/components/docs/category-index.tsx
+import { jsx as jsx28, jsxs as jsxs19 } from "react/jsx-runtime";
+function CategoryIndex({ categoryPath, version, allDocs, title, description, content, config }) {
+  const childDocs = allDocs.filter((doc) => {
+    const parts = doc.slug.split("/");
+    const docParent = parts.slice(0, -1).join("/");
+    return docParent === categoryPath && doc.slug !== categoryPath;
+  });
+  const processedContent = () => {
+    if (content) {
+      return processContentWithEnv(content, config);
+    }
+    return "";
+  };
+  const sortedDocs = sortSidebarItems(childDocs);
+  return /* @__PURE__ */ jsxs19("div", { className: "flex-1 min-w-0", children: [
+    /* @__PURE__ */ jsxs19("div", { className: "mb-8", children: [
+      /* @__PURE__ */ jsx28("h1", { className: "text-4xl font-bold tracking-tight mb-3 text-foreground", children: title }),
+      description && /* @__PURE__ */ jsx28("p", { className: "text-lg text-muted-foreground leading-relaxed", children: description }),
+      /* @__PURE__ */ jsx28("div", { className: "prose prose-slate dark:prose-invert max-w-none prose-headings:scroll-mt-24 prose-headings:font-semibold prose-h1:text-4xl prose-h2:text-3xl prose-h2:mt-12 prose-h2:mb-4 prose-h3:text-2xl prose-h3:mt-8 prose-h3:mb-3 prose-p:text-base prose-p:leading-7 prose-p:text-muted-foreground prose-p:mb-4 prose-a:font-normal prose-a:transition-all prose-code:text-primary prose-code:bg-muted/50 prose-code:px-1.5 prose-code:py-0.5 prose-code:rounded-md prose-code:text-[13px] prose-code:font-mono prose-code:border prose-code:border-border/50 prose-code:before:content-none prose-code:after:content-none prose-pre:bg-transparent prose-pre:p-0 prose-ul:list-disc prose-ul:list-inside prose-ul:space-y-2 prose-ul:mb-4 prose-ol:list-decimal prose-ol:list-inside prose-ol:space-y-2 prose-ol:mb-4 prose-li:leading-7 prose-li:text-muted-foreground prose-strong:text-foreground prose-strong:font-semibold", children: /* @__PURE__ */ jsx28(
+        MDXRemote,
+        {
+          source: processedContent(),
+          options: {
+            parseFrontmatter: false,
+            mdxOptions: {
+              remarkPlugins: [remarkGfm, remarkCodeMeta],
+              rehypePlugins: [rehypeSlug],
+              development: false
+            }
+          },
+          components: mdxComponents
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsx28("div", { className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-3 gap-4", children: sortedDocs.map((doc) => /* @__PURE__ */ jsx28(
+      Link4,
+      {
+        href: `/docs/${version}/${doc.slug}`,
+        className: "group block p-5 rounded-xl border border-border bg-card hover:bg-accent hover:border-primary/50 transition-all duration-200",
+        style: {
+          textDecoration: "none !important"
+        },
+        children: /* @__PURE__ */ jsxs19("div", { className: "flex items-start justify-between gap-4", children: [
+          /* @__PURE__ */ jsxs19("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ jsxs19("div", { className: "flex items-center gap-2 mb-2", children: [
+              /* @__PURE__ */ jsx28(FileText, { className: "h-6 w-6 text-primary shrink-0" }),
+              /* @__PURE__ */ jsx28("h3", { className: "text-lg font-semibold text-foreground group-hover:text-primary transition-colors", children: doc.meta.title || doc.title })
+            ] }),
+            doc.meta.description && /* @__PURE__ */ jsx28("p", { className: "text-sm text-muted-foreground line-clamp-2", children: doc.meta.description }),
+            doc.meta.reading_time && /* @__PURE__ */ jsxs19("p", { className: "text-xs text-muted-foreground mt-2", children: [
+              doc.meta.reading_time,
+              " min read"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx28(ChevronRight2, { className: "h-5 w-5 text-muted-foreground group-hover:text-primary group-hover:translate-x-1 transition-all flex-shrink-0 mt-1" })
+        ] })
+      },
+      doc.slug
+    )) }),
+    sortedDocs.length === 0 && /* @__PURE__ */ jsxs19("div", { className: "text-center py-12 text-muted-foreground", children: [
+      /* @__PURE__ */ jsx28(FileText, { className: "h-12 w-12 mx-auto mb-3 opacity-50" }),
+      /* @__PURE__ */ jsx28("p", { children: "No documents found in this category." })
+    ] })
+  ] });
+}
+
+// src/components/docs/componentTextProps.ts
+var COMPONENT_TEXT_PROPS = {
+  // Accordion components
+  Accordion: ["title"],
+  AccordionItem: ["title"],
+  // Alert/Callout components
+  Alert: ["title", "description"],
+  Banner: ["title"],
+  Callout: ["title", "content"],
+  Note: ["title"],
+  Warning: ["title", "text"],
+  // Navigation components
+  BreadCrumb: ["title", "slug", "version"],
+  // Card components
+  Card: ["title", "description"],
+  ImageCard: ["title", "description", "alt"],
+  // Media components
+  Image: ["alt", "caption"],
+  Video: ["caption"],
+  Frame: ["title"],
+  Mermaid: ["caption"],
+  // Interactive components
+  Tooltip: ["content"],
+  // Code components
+  CodeBlock: ["filename"],
+  // Step components
+  Step: ["title"]
+};
+function extractComponentPropsText(mdx) {
+  return mdx.replace(
+    /<([A-Z][\w]*)\b([^/>]*)\/>/g,
+    (_, component, props) => {
+      const searchableProps = COMPONENT_TEXT_PROPS[component];
+      if (!searchableProps) return " ";
+      let extracted = "";
+      for (const prop of searchableProps) {
+        const match = props.match(
+          new RegExp(`${prop}="([^"]+)"`, "i")
+        );
+        if (match) {
+          extracted += " " + match[1];
+        }
+      }
+      return extracted || " ";
+    }
+  );
+}
+function extractSearchText(mdx) {
+  return extractComponentPropsText(mdx).replace(/```[\s\S]*?```/g, " ").replace(/<([A-Z][\w]*)\b[^>]*>[\s\S]*?<\/\1>/g, " ").replace(/<\/?[A-Za-z][^>]*>/g, " ").replace(/`[^`]+`/g, " ").replace(/\[([^\]]+)\]\([^)]+\)/g, "$1").replace(/[#>*_~=-]+/g, " ").replace(/\s+/g, " ").trim().slice(0, 1e3);
+}
+
+// src/components/docs/dev-mode-badge.tsx
+import { useEffect as useEffect4, useState as useState10 } from "react";
+import { Code2 } from "lucide-react";
+import { jsx as jsx29, jsxs as jsxs20 } from "react/jsx-runtime";
+function DevModeBadge() {
+  const [isConnected, setIsConnected] = useState10(true);
+  useEffect4(() => {
+    if (process.env.NODE_ENV !== "development") return;
+    const checkConnection = () => {
+      setIsConnected(navigator.onLine);
+    };
+    window.addEventListener("online", checkConnection);
+    window.addEventListener("offline", checkConnection);
+    return () => {
+      window.removeEventListener("online", checkConnection);
+      window.removeEventListener("offline", checkConnection);
+    };
+  }, []);
+  if (process.env.NODE_ENV !== "development") return null;
+  return /* @__PURE__ */ jsxs20("div", { className: "fixed top-20 left-4 z-40 flex items-center gap-2 px-3 py-1.5 bg-orange-500/10 text-orange-600 dark:text-orange-400 border border-orange-500/20 rounded-full text-xs font-medium", children: [
+    /* @__PURE__ */ jsx29(Code2, { className: "h-3 w-3" }),
+    /* @__PURE__ */ jsx29("span", { children: "Dev Mode" }),
+    /* @__PURE__ */ jsx29("div", { className: `h-2 w-2 rounded-full ${isConnected ? "bg-green-500" : "bg-red-500"} animate-pulse` })
+  ] });
+}
+
+// src/components/docs/doc-layout.tsx
+import { ExternalLink as ExternalLink2, FileEdit } from "lucide-react";
+import { MDXRemote as MDXRemote2 } from "next-mdx-remote/rsc";
+import remarkGfm2 from "remark-gfm";
+import rehypeSlug2 from "rehype-slug";
+
+// src/components/docs/doc-navigation.tsx
+import Link5 from "next/link";
+import { ChevronLeft, ChevronRight as ChevronRight3 } from "lucide-react";
+import { jsx as jsx30, jsxs as jsxs21 } from "react/jsx-runtime";
+function DocNavigation({ previousDoc, nextDoc, version }) {
+  if (!previousDoc && !nextDoc) return null;
+  return /* @__PURE__ */ jsxs21("div", { className: "mt-12 pt-8 border-t border-border grid grid-cols-2 gap-4", children: [
+    previousDoc ? /* @__PURE__ */ jsxs21(
+      Link5,
+      {
+        href: `/docs/${version}/${previousDoc.slug}`,
+        className: "group flex flex-col gap-2 p-4 rounded-xl border border-border hover:border-primary/50 hover:bg-muted/50 transition-all",
+        style: {
+          textDecoration: "none !important"
+        },
+        children: [
+          /* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
+            /* @__PURE__ */ jsx30(ChevronLeft, { className: "h-4 w-4" }),
+            /* @__PURE__ */ jsx30("span", { children: "Previous" })
+          ] }),
+          /* @__PURE__ */ jsx30("div", { className: "text-base font-medium text-foreground group-hover:text-primary transition-colors", children: previousDoc.title })
+        ]
+      }
+    ) : /* @__PURE__ */ jsx30("div", {}),
+    nextDoc ? /* @__PURE__ */ jsxs21(
+      Link5,
+      {
+        href: `/docs/${version}/${nextDoc.slug}`,
+        className: "group flex flex-col gap-2 p-4 rounded-xl border border-border hover:border-primary/50 hover:bg-muted/50 transition-all text-right",
+        style: {
+          textDecoration: "none !important"
+        },
+        children: [
+          /* @__PURE__ */ jsxs21("div", { className: "flex items-center justify-end gap-2 text-sm text-muted-foreground", children: [
+            /* @__PURE__ */ jsx30("span", { children: "Next" }),
+            /* @__PURE__ */ jsx30(ChevronRight3, { className: "h-4 w-4" })
+          ] }),
+          /* @__PURE__ */ jsx30("div", { className: "text-base font-medium text-foreground group-hover:text-primary transition-colors", children: nextDoc.title })
+        ]
+      }
+    ) : /* @__PURE__ */ jsx30("div", {})
+  ] });
+}
+
+// src/components/docs/doc-metadata.tsx
+import { Clock, Calendar, User } from "lucide-react";
+import { jsx as jsx31, jsxs as jsxs22 } from "react/jsx-runtime";
+function DocMetadata({ meta, config }) {
+  const showReadingTime = config.features?.showReadingTime && meta.reading_time;
+  const showLastUpdated = config.features?.showLastUpdated && meta.last_updated;
+  const showAuthors = config.features?.showAuthors && meta.authors?.length;
+  const hasMetadata = showReadingTime || showLastUpdated || showAuthors;
+  if (!hasMetadata) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs22("div", { className: "flex flex-wrap items-center gap-4 text-sm text-muted-foreground border-b border-border pb-4 mb-6", children: [
+    showReadingTime && /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx31(Clock, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsxs22("span", { children: [
+        meta.reading_time,
+        " min read"
+      ] })
+    ] }),
+    showLastUpdated && meta.last_updated && /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx31(Calendar, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsxs22("span", { children: [
+        "Updated ",
+        new Date(meta.last_updated).toLocaleDateString()
+      ] })
+    ] }),
+    showAuthors && /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx31(User, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsx31("span", { children: meta.authors.map((author, idx) => /* @__PURE__ */ jsxs22("span", { children: [
+        author.name || author.id,
+        idx < meta.authors.length - 1 && ", "
+      ] }, author.id)) })
+    ] })
+  ] });
+}
+
+// src/components/docs/draft-badge.tsx
+import { FileWarning } from "lucide-react";
+import { jsx as jsx32, jsxs as jsxs23 } from "react/jsx-runtime";
+function DraftBadge() {
+  return /* @__PURE__ */ jsxs23("div", { className: "inline-flex items-center gap-2 px-3 py-1.5 rounded-md bg-yellow-500/10 border border-yellow-500/20 text-yellow-600 dark:text-yellow-400 text-sm font-medium mb-4", children: [
+    /* @__PURE__ */ jsx32(FileWarning, { className: "h-4 w-4" }),
+    /* @__PURE__ */ jsx32("span", { children: "Draft - Not visible in production" })
+  ] });
+}
+
+// src/components/docs/doc-tags.tsx
+import { Tag } from "lucide-react";
+import { jsx as jsx33, jsxs as jsxs24 } from "react/jsx-runtime";
+function DocTags({ tags }) {
+  if (!tags || tags.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs24("div", { className: "flex flex-wrap items-center gap-2 mt-6 pt-6 border-t border-border", children: [
+    /* @__PURE__ */ jsx33(Tag, { className: "h-4 w-4 text-muted-foreground" }),
+    tags.map((tag) => /* @__PURE__ */ jsx33(
+      "span",
+      {
+        className: "inline-flex items-center px-2.5 py-0.5 rounded-md text-xs font-medium bg-primary/10 text-primary border border-primary/20",
+        children: tag
+      },
+      tag
+    ))
+  ] });
+}
+
+// src/components/docs/search-highlight.tsx
+import { useEffect as useEffect5 } from "react";
+import { useSearchParams } from "next/navigation";
+function SearchHighlight() {
+  const searchParams = useSearchParams();
+  const query = searchParams.get("q");
+  useEffect5(() => {
+    if (!query) {
+      document.querySelectorAll("mark.search-highlight").forEach((mark) => {
+        const parent = mark.parentNode;
+        if (parent) {
+          parent.replaceChild(document.createTextNode(mark.textContent || ""), mark);
+          parent.normalize();
+        }
+      });
+      return;
+    }
+    const timeout = setTimeout(() => {
+      highlightSearchTerm(query);
+    }, 100);
+    return () => {
+      clearTimeout(timeout);
+      document.querySelectorAll("mark.search-highlight").forEach((mark) => {
+        const parent = mark.parentNode;
+        if (parent) {
+          parent.replaceChild(document.createTextNode(mark.textContent || ""), mark);
+          parent.normalize();
+        }
+      });
+    };
+  }, [query]);
+  return null;
+}
+function highlightSearchTerm(searchTerm) {
+  document.querySelectorAll("mark.search-highlight").forEach((mark) => {
+    const parent = mark.parentNode;
+    if (parent) {
+      parent.replaceChild(document.createTextNode(mark.textContent || ""), mark);
+      parent.normalize();
+    }
+  });
+  const contentArea = document.querySelector("main") || document.body;
+  const walker = document.createTreeWalker(
+    contentArea,
+    NodeFilter.SHOW_TEXT,
+    {
+      acceptNode: (node) => {
+        const parent = node.parentElement;
+        if (!parent) return NodeFilter.FILTER_REJECT;
+        const tagName = parent.tagName.toLowerCase();
+        if (["mark", "script", "style", "code", "pre"].includes(tagName)) {
+          return NodeFilter.FILTER_REJECT;
+        }
+        if (node.textContent && node.textContent.toLowerCase().includes(searchTerm.toLowerCase())) {
+          return NodeFilter.FILTER_ACCEPT;
+        }
+        return NodeFilter.FILTER_REJECT;
+      }
+    }
+  );
+  const nodesToHighlight = [];
+  let currentNode;
+  while (currentNode = walker.nextNode()) {
+    if (currentNode.textContent) {
+      nodesToHighlight.push({
+        node: currentNode,
+        text: currentNode.textContent
+      });
+    }
+  }
+  nodesToHighlight.forEach(({ node, text }) => {
+    const regex = new RegExp(`(${escapeRegex(searchTerm)})`, "gi");
+    const parts = text.split(regex);
+    if (parts.length > 1) {
+      const fragment = document.createDocumentFragment();
+      parts.forEach((part) => {
+        if (part.toLowerCase() === searchTerm.toLowerCase()) {
+          const mark = document.createElement("mark");
+          mark.className = "search-highlight bg-yellow-200 dark:bg-yellow-900/50 text-foreground px-1 rounded";
+          mark.textContent = part;
+          fragment.appendChild(mark);
+        } else if (part) {
+          fragment.appendChild(document.createTextNode(part));
+        }
+      });
+      node.parentNode?.replaceChild(fragment, node);
+    }
+  });
+  const firstHighlight = document.querySelector("mark.search-highlight");
+  if (firstHighlight) {
+    setTimeout(() => {
+      firstHighlight.scrollIntoView({ behavior: "smooth", block: "center" });
+    }, 200);
+  }
+}
+function escapeRegex(string) {
+  return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+
+// src/components/docs/doc-layout.tsx
+import { jsx as jsx34, jsxs as jsxs25 } from "react/jsx-runtime";
+async function DocLayout({ content, meta, previousDoc, nextDoc, version, slug, config }) {
+  const isDevelopment = process.env.NODE_ENV === "development";
+  const processedContent = processContentWithEnv(content, config);
+  const editUrl = config.features?.editUrl && typeof config.features.editUrl === "string" ? `${config.features.editUrl}/${version}/${slug}.mdx` : null;
+  return /* @__PURE__ */ jsxs25("article", { className: "flex-1 min-w-0", children: [
+    /* @__PURE__ */ jsx34(SearchHighlight, {}),
+    config.navigation?.showBreadcrumbs && /* @__PURE__ */ jsx34(Breadcrumb, { version, slug, title: meta.title }),
+    isDevelopment && meta.draft && /* @__PURE__ */ jsx34(DraftBadge, {}),
+    /* @__PURE__ */ jsxs25("div", { className: "mb-8", children: [
+      /* @__PURE__ */ jsx34("h1", { className: "text-4xl font-bold tracking-tight mb-3 text-foreground", children: meta.title }),
+      meta.description && /* @__PURE__ */ jsx34("p", { className: "text-lg text-muted-foreground leading-relaxed", children: meta.description })
+    ] }),
+    /* @__PURE__ */ jsx34(DocMetadata, { meta, config }),
+    /* @__PURE__ */ jsx34("div", { className: "prose prose-slate dark:prose-invert max-w-none prose-headings:scroll-mt-24 prose-headings:font-semibold prose-h1:text-4xl prose-h2:text-3xl prose-h2:mt-12 prose-h2:mb-4 prose-h3:text-2xl prose-h3:mt-8 prose-h3:mb-3 prose-p:text-base prose-p:leading-7 prose-p:text-muted-foreground prose-p:mb-4 prose-a:font-normal prose-a:transition-all prose-code:text-primary prose-code:bg-muted/50 prose-code:px-1.5 prose-code:py-0.5 prose-code:rounded-md prose-code:text-[13px] prose-code:font-mono prose-code:border prose-code:border-border/50 prose-code:before:content-none prose-code:after:content-none prose-pre:bg-transparent prose-pre:p-0 prose-ul:list-disc prose-ul:list-inside prose-ul:space-y-2 prose-ul:mb-4 prose-ol:list-decimal prose-ol:list-inside prose-ol:space-y-2 prose-ol:mb-4 prose-li:leading-7 prose-li:text-muted-foreground prose-strong:text-foreground prose-strong:font-semibold", children: /* @__PURE__ */ jsx34(
+      MDXRemote2,
+      {
+        source: processedContent,
+        options: {
+          parseFrontmatter: false,
+          mdxOptions: {
+            remarkPlugins: [remarkGfm2, remarkCodeMeta],
+            rehypePlugins: [rehypeSlug2],
+            development: false
+          }
+        },
+        components: mdxComponents
+      }
+    ) }),
+    config.features?.showTags && meta.tags && meta.tags.length > 0 && /* @__PURE__ */ jsx34(DocTags, { tags: meta.tags }),
+    (editUrl || config.social?.github) && /* @__PURE__ */ jsxs25("div", { className: "mt-12 pt-6 border-t border-border flex items-center justify-between", children: [
+      editUrl ? /* @__PURE__ */ jsxs25(
+        "a",
+        {
+          href: editUrl,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          className: "flex items-center gap-2 text-sm text-muted-foreground hover:text-foreground transition-colors",
+          children: [
+            /* @__PURE__ */ jsx34(FileEdit, { className: "h-4 w-4" }),
+            "Edit this page"
+          ]
+        }
+      ) : /* @__PURE__ */ jsx34("div", {}),
+      config.social?.github && /* @__PURE__ */ jsxs25(
+        "a",
+        {
+          href: `${config.social.github}/issues/new`,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          className: "flex items-center gap-2 text-sm text-muted-foreground hover:text-foreground transition-colors",
+          children: [
+            /* @__PURE__ */ jsx34(ExternalLink2, { className: "h-4 w-4" }),
+            "Report an issue"
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx34(DocNavigation, { previousDoc, nextDoc, version })
+  ] });
+}
+
+// src/components/docs/doc-layout-wrapper.tsx
+import { useEffect as useEffect7, useRef as useRef3 } from "react";
+
+// src/components/docs/mobile-doc-layout.tsx
+import { useState as useState13, cloneElement, isValidElement as isValidElement2 } from "react";
+
+// src/components/docs/footer.tsx
+import Link6 from "next/link";
+import { jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
+function Footer({ config }) {
+  if (!config.footer) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx35("footer", { className: "bg-muted/30 dark:bg-muted/10 rounded-2xl mt-24", children: /* @__PURE__ */ jsxs26("div", { className: "px-6 py-12", children: [
+    config.footer.links && config.footer.links.length > 0 && /* @__PURE__ */ jsx35("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-8 mb-8", children: config.footer.links.map((column, idx) => /* @__PURE__ */ jsxs26("div", { children: [
+      /* @__PURE__ */ jsx35("h3", { className: "font-semibold text-foreground mb-4", children: column.title }),
+      /* @__PURE__ */ jsx35("ul", { className: "space-y-2", children: column.items.map((item, itemIdx) => /* @__PURE__ */ jsx35("li", { children: /* @__PURE__ */ jsx35(
+        Link6,
+        {
+          href: item.href,
+          className: "text-sm text-muted-foreground hover:text-foreground transition-colors",
+          children: item.label
+        }
+      ) }, itemIdx)) })
+    ] }, idx)) }),
+    config.footer.copyright && /* @__PURE__ */ jsx35("div", { className: "pt-8", children: /* @__PURE__ */ jsx35("p", { className: "text-sm text-muted-foreground text-center", children: config.footer.copyright }) })
+  ] }) });
+}
+
+// src/components/docs/site-banner.tsx
+import { X as X2, AlertCircle, CheckCircle, Info as Info2, XCircle as XCircle2 } from "lucide-react";
+import { useState as useState11, useEffect as useEffect6 } from "react";
+import { jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
+function SiteBanner({ config }) {
+  const [dismissed, setDismissed] = useState11(false);
+  const [mounted, setMounted] = useState11(false);
+  const banner = config.banner;
+  const storageKey = "site-banner-dismissed";
+  useEffect6(() => {
+    setMounted(true);
+    const isDismissed = localStorage.getItem(storageKey) === "true";
+    setDismissed(isDismissed);
+  }, []);
+  const handleDismiss = () => {
+    setDismissed(true);
+    localStorage.setItem(storageKey, "true");
+  };
+  if (!mounted || !banner || !banner.enabled || dismissed) {
+    return null;
+  }
+  const typeConfig = {
+    info: {
+      icon: Info2,
+      bg: "bg-blue-500/10 dark:bg-blue-400/5",
+      border: "border-blue-500/30 dark:border-blue-500/20",
+      iconColor: "text-blue-600 dark:text-blue-400",
+      textColor: "text-blue-900 dark:text-blue-300"
+    },
+    success: {
+      icon: CheckCircle,
+      bg: "bg-green-500/10 dark:bg-green-400/5",
+      border: "border-green-500/30 dark:border-green-500/20",
+      iconColor: "text-green-600 dark:text-green-400",
+      textColor: "text-green-900 dark:text-green-300"
+    },
+    warning: {
+      icon: AlertCircle,
+      bg: "bg-yellow-500/10 dark:bg-yellow-400/5",
+      border: "border-yellow-500/30 dark:border-yellow-500/20",
+      iconColor: "text-yellow-600 dark:text-yellow-400",
+      textColor: "text-yellow-900 dark:text-yellow-300"
+    },
+    error: {
+      icon: XCircle2,
+      bg: "bg-red-500/10 dark:bg-red-400/5",
+      border: "border-red-500/30 dark:border-red-500/20",
+      iconColor: "text-red-600 dark:text-red-400",
+      textColor: "text-red-900 dark:text-red-300"
+    }
+  };
+  const type = banner.type || "info";
+  const { icon: IconComponent, bg, border, iconColor, textColor } = typeConfig[type];
+  return /* @__PURE__ */ jsx36("div", { className: `w-full border-b ${border} ${bg}`, children: /* @__PURE__ */ jsx36("div", { className: "container mx-auto px-6 py-3", children: /* @__PURE__ */ jsxs27("div", { className: "flex items-center gap-3", children: [
+    /* @__PURE__ */ jsx36(IconComponent, { className: `h-5 w-5 shrink-0 ${iconColor}` }),
+    /* @__PURE__ */ jsx36("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsx36("p", { className: `text-sm font-medium ${textColor}`, children: banner.message }) }),
+    banner.dismissible && /* @__PURE__ */ jsx36(
+      "button",
+      {
+        onClick: handleDismiss,
+        className: `shrink-0 p-1 rounded-md hover:bg-black/5 dark:hover:bg-white/5 transition-colors ${iconColor}`,
+        "aria-label": "Dismiss banner",
+        children: /* @__PURE__ */ jsx36(X2, { className: "h-4 w-4" })
+      }
+    )
+  ] }) }) });
+}
+
+// src/components/docs/tab-groups.tsx
+import { jsx as jsx37, jsxs as jsxs28 } from "react/jsx-runtime";
+function TabGroups({ tabGroups, activeTabId, onTabChange }) {
+  const activeTab = activeTabId || tabGroups[0]?.id || "";
+  const handleTabChange = (tabId) => {
+    onTabChange?.(tabId);
+  };
+  if (!tabGroups || tabGroups.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx37("div", { className: "sticky top-16 z-30 border-b border-border bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60", children: /* @__PURE__ */ jsx37("div", { className: "container mx-auto px-6", children: /* @__PURE__ */ jsx37("nav", { className: "flex gap-1 overflow-x-auto no-scrollbar", "aria-label": "Documentation tabs", children: tabGroups.map((tab) => {
+    const isActive = tab.id === activeTab;
+    return /* @__PURE__ */ jsxs28(
+      "button",
+      {
+        onClick: () => handleTabChange(tab.id),
+        className: `flex items-center gap-2 px-4 py-3 text-sm font-medium whitespace-nowrap transition-all border-b-2 ${isActive ? "border-primary text-primary" : "border-transparent text-muted-foreground hover:text-foreground hover:border-border"}`,
+        "aria-current": isActive ? "page" : void 0,
+        children: [
+          tab.icon && /* @__PURE__ */ jsx37(Icon, { icon: tab.icon, size: 16, className: "shrink-0" }),
+          tab.label
+        ]
+      },
+      tab.id
+    );
+  }) }) }) });
+}
+
+// src/components/docs/sidebar.tsx
+import Link7 from "next/link";
+import { usePathname } from "next/navigation";
+import { ChevronRight as ChevronRight4, ChevronDown as ChevronDown3, FolderOpen } from "lucide-react";
+import { useState as useState12 } from "react";
+import { jsx as jsx38, jsxs as jsxs29 } from "react/jsx-runtime";
+function Sidebar({ docs, version, onLinkClick, config, activeTabGroup }) {
+  const pathname = usePathname();
+  const [collapsed, setCollapsed] = useState12(() => {
+    const initial = {};
+    return initial;
+  });
+  if (!config.navigation?.showSidebar) {
+    return null;
+  }
+  const hasTabGroups = config.navigation?.tabGroups && config.navigation.tabGroups.length > 0;
+  const filteredDocs = hasTabGroups && activeTabGroup ? docs.filter((doc) => {
+    const docTabGroup = doc.meta?.tab_group || doc.categoryTabGroup;
+    if (!docTabGroup) {
+      return activeTabGroup === config.navigation?.tabGroups?.[0]?.id;
+    }
+    return docTabGroup === activeTabGroup;
+  }) : docs;
+  const rootGroups = {};
+  const standalone = [];
+  filteredDocs.forEach((doc) => {
+    const pathParts = doc.filePath.split("/");
+    const isIndexFile = doc.filePath.endsWith("/index") || doc.filePath === "index" || pathParts.length > 1 && doc.slug === pathParts.slice(0, -1).join("/");
+    const customGroup = doc.sidebar || doc.group;
+    if (customGroup) {
+      const groupName = customGroup.charAt(0).toUpperCase() + customGroup.slice(1);
+      if (!rootGroups[groupName]) {
+        rootGroups[groupName] = {
+          label: groupName,
+          path: customGroup,
+          items: [],
+          position: 999,
+          collapsible: doc.categoryCollapsible ?? true,
+          defaultCollapsed: doc.categoryCollapsed ?? false,
+          children: {}
+        };
+      }
+      if (isIndexFile) {
+        rootGroups[groupName].position = doc.sidebar_position ?? 999;
+        rootGroups[groupName].icon = doc.categoryIcon;
+      } else {
+        rootGroups[groupName].items.push(doc);
+      }
+      return;
+    }
+    if (pathParts.length > 1) {
+      const folderParts = pathParts.slice(0, -1);
+      let currentLevel = rootGroups;
+      let currentPath = "";
+      for (let i = 0; i < folderParts.length; i++) {
+        const folder = folderParts[i];
+        currentPath = currentPath ? `${currentPath}/${folder}` : folder;
+        const folderLabel = folder.split("-").map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
+        if (!currentLevel[folder]) {
+          currentLevel[folder] = {
+            label: doc.categoryLabel && i === folderParts.length - 1 ? doc.categoryLabel : folderLabel,
+            path: currentPath,
+            icon: doc.categoryIcon,
+            items: [],
+            position: doc.categoryPosition ?? 999,
+            collapsible: doc.categoryCollapsible ?? true,
+            defaultCollapsed: doc.categoryCollapsed ?? false,
+            children: {}
+          };
+        }
+        if (i === folderParts.length - 1) {
+          if (isIndexFile) {
+            currentLevel[folder].position = doc.categoryPosition ?? doc.sidebar_position ?? 999;
+            if (doc.categoryLabel) {
+              currentLevel[folder].label = doc.categoryLabel;
+            }
+            if (doc.categoryIcon) {
+              currentLevel[folder].icon = doc.categoryIcon;
+            }
+          } else {
+            currentLevel[folder].items.push(doc);
+          }
+        }
+        currentLevel = currentLevel[folder].children;
+      }
+    } else {
+      if (!isIndexFile) {
+        standalone.push(doc);
+      }
+    }
+  });
+  const toggleSection = (section) => {
+    setCollapsed((prev) => ({ ...prev, [section]: !prev[section] }));
+  };
+  const renderGroup = (groupKey, group, depth = 0) => {
+    const sortedItems = sortSidebarItems(group.items);
+    const sortedChildren = sortSidebarGroups(group.children);
+    const hasChildren = sortedChildren.length > 0;
+    const hasItems = sortedItems.length > 0;
+    const hasContent = hasChildren || hasItems;
+    const isActiveInGroup = (g) => {
+      const hasActiveItem2 = g.items.some((doc) => pathname === `/docs/${version}/${doc.slug}`);
+      if (hasActiveItem2) return true;
+      return Object.values(g.children).some((child) => isActiveInGroup(child));
+    };
+    const hasActiveItem = isActiveInGroup(group);
+    const isGroupActive = pathname === `/docs/${version}/${group.path}`;
+    const isCollapsed = hasActiveItem || isGroupActive ? false : collapsed[groupKey] ?? group.defaultCollapsed;
+    const marginLeft = depth > 0 ? "ml-4" : "";
+    const groupHref = `/docs/${version}/${group.path}`;
+    return /* @__PURE__ */ jsxs29("div", { className: `space-y-1 ${marginLeft}`, children: [
+      /* @__PURE__ */ jsxs29("div", { className: "flex items-center group", children: [
+        /* @__PURE__ */ jsxs29(
+          Link7,
+          {
+            href: groupHref,
+            onClick: onLinkClick,
+            className: `flex items-center gap-2 flex-1 px-3 py-2 text-sm font-semibold rounded-l-xl transition-all ${isGroupActive ? "bg-primary/10 text-primary" : "text-foreground hover:bg-accent/50"}`,
+            children: [
+              group.icon ? /* @__PURE__ */ jsx38(Icon, { icon: group.icon, size: 16, className: "shrink-0" }) : /* @__PURE__ */ jsx38(FolderOpen, { size: 16, className: "shrink-0" }),
+              group.label
+            ]
+          }
+        ),
+        hasContent && group.collapsible && config.navigation?.collapsibleSidebar && /* @__PURE__ */ jsx38(
+          "button",
+          {
+            onClick: (e) => {
+              e.preventDefault();
+              e.stopPropagation();
+              toggleSection(groupKey);
+            },
+            className: `p-2 rounded-r-xl transition-all ${isGroupActive ? "hover:bg-primary/20" : "hover:bg-accent/50"}`,
+            "aria-label": isCollapsed ? "Expand section" : "Collapse section",
+            children: isCollapsed ? /* @__PURE__ */ jsx38(ChevronRight4, { className: `h-4 w-4 ${isGroupActive ? "text-primary" : "text-muted-foreground"}` }) : /* @__PURE__ */ jsx38(ChevronDown3, { className: `h-4 w-4 ${isGroupActive ? "text-primary" : "text-muted-foreground"}` })
+          }
+        )
+      ] }),
+      !isCollapsed && hasContent && /* @__PURE__ */ jsx38("div", { className: "ml-4 space-y-1", children: (() => {
+        const merged = [
+          ...sortedChildren.map(([childKey, childGroup]) => ({
+            type: "group",
+            key: childKey,
+            group: childGroup,
+            position: childGroup.position
+          })),
+          ...sortedItems.map((doc) => ({
+            type: "item",
+            doc,
+            position: doc.sidebar_position ?? doc.meta?.sidebar_position ?? doc.meta?.order ?? 999
+          }))
+        ];
+        merged.sort((a, b) => a.position - b.position);
+        return merged.map((item) => {
+          if (item.type === "group") {
+            return renderGroup(`${groupKey}/${item.key}`, item.group, depth + 1);
+          } else {
+            const href = `/docs/${version}/${item.doc.slug}`;
+            const isActive = pathname === href;
+            return /* @__PURE__ */ jsxs29(
+              Link7,
+              {
+                href,
+                onClick: onLinkClick,
+                className: `flex items-center gap-2 px-3 py-2 text-sm rounded-xl transition-all ${isActive ? "bg-primary/10 text-primary font-medium" : "text-foreground hover:text-foreground hover:bg-accent/50"}`,
+                children: [
+                  item.doc.meta?.icon && /* @__PURE__ */ jsx38(Icon, { icon: item.doc.meta.icon, size: 16, className: "shrink-0" }),
+                  item.doc.title
+                ]
+              },
+              `grouped-${item.doc.slug}`
+            );
+          }
+        });
+      })() })
+    ] }, `group-${groupKey}`);
+  };
+  const sortedRootGroups = sortSidebarGroups(rootGroups);
+  const sortedStandalone = sortSidebarItems(standalone);
+  const stickyTop = hasTabGroups ? "top-[7.5rem]" : "top-24";
+  const maxHeight = hasTabGroups ? "max-h-[calc(100vh-10rem)]" : "max-h-[calc(100vh-7rem)]";
+  return /* @__PURE__ */ jsx38("aside", { className: `w-64 shrink-0 sticky ${stickyTop} self-start`, children: /* @__PURE__ */ jsxs29("div", { className: `${maxHeight} overflow-y-auto bg-muted/30 dark:bg-muted/10 rounded-2xl p-4 border border-border/50`, children: [
+    /* @__PURE__ */ jsx38("h2", { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-4 px-2", children: "Documentation" }),
+    /* @__PURE__ */ jsxs29("nav", { className: "space-y-1", children: [
+      sortedStandalone.length > 0 && sortedStandalone.map((doc) => {
+        const href = `/docs/${version}/${doc.slug}`;
+        const isActive = pathname === href;
+        return /* @__PURE__ */ jsxs29(
+          Link7,
+          {
+            href,
+            onClick: onLinkClick,
+            className: `flex items-center gap-2 px-3 py-2 text-sm rounded-xl transition-all ${isActive ? "bg-primary/10 text-primary font-medium" : "text-foreground hover:text-foreground hover:bg-accent/50"}`,
+            children: [
+              doc.meta?.icon && /* @__PURE__ */ jsx38(Icon, { icon: doc.meta.icon, size: 16, className: "shrink-0" }),
+              doc.title
+            ]
+          },
+          `standalone-${doc.slug}`
+        );
+      }),
+      sortedRootGroups.map(([groupKey, group]) => renderGroup(groupKey, group, 0))
+    ] })
+  ] }) });
+}
+
+// src/components/docs/mobile-doc-layout.tsx
+import { jsx as jsx39, jsxs as jsxs30 } from "react/jsx-runtime";
+function MobileDocLayout({ header, docs, version, content, toc, config, activeTabGroup, onTabChange }) {
+  const [sidebarOpen, setSidebarOpen] = useState13(false);
+  const handleTabChange = (tabId) => {
+    onTabChange?.(tabId);
+  };
+  const closeSidebar = () => setSidebarOpen(false);
+  const toggleSidebar = () => setSidebarOpen(!sidebarOpen);
+  const headerWithProps = isValidElement2(header) ? cloneElement(header, {
+    onMenuClick: toggleSidebar
+  }) : header;
+  return /* @__PURE__ */ jsxs30("div", { className: "min-h-screen bg-background", children: [
+    headerWithProps,
+    /* @__PURE__ */ jsx39(SiteBanner, { config }),
+    config.navigation?.tabGroups && config.navigation.tabGroups.length > 0 && /* @__PURE__ */ jsx39(
+      TabGroups,
+      {
+        tabGroups: config.navigation.tabGroups,
+        activeTabId: activeTabGroup,
+        onTabChange: handleTabChange
+      }
+    ),
+    sidebarOpen && /* @__PURE__ */ jsx39(
+      "div",
+      {
+        className: "lg:hidden fixed inset-0 bg-background/80 backdrop-blur-sm z-40",
+        onClick: () => setSidebarOpen(false)
+      }
+    ),
+    /* @__PURE__ */ jsx39(
+      "div",
+      {
+        className: `lg:hidden fixed top-0 left-0 h-full w-64 bg-background border-r border-border z-40 transform transition-transform duration-300 ease-in-out overflow-y-auto ${sidebarOpen ? "translate-x-0" : "-translate-x-full"}`,
+        children: /* @__PURE__ */ jsx39("div", { className: "pt-20 px-4", children: /* @__PURE__ */ jsx39(
+          Sidebar,
+          {
+            docs,
+            version,
+            config,
+            onLinkClick: closeSidebar,
+            activeTabGroup
+          }
+        ) })
+      }
+    ),
+    /* @__PURE__ */ jsx39("main", { className: "container mx-auto px-6 py-8", children: /* @__PURE__ */ jsxs30("div", { className: "flex", children: [
+      /* @__PURE__ */ jsx39("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsx39(
+        Sidebar,
+        {
+          docs,
+          version,
+          config,
+          activeTabGroup
+        }
+      ) }),
+      /* @__PURE__ */ jsx39("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsxs30("div", { className: "flex flex-col gap-2 px-2 md:px-8", children: [
+        content,
+        /* @__PURE__ */ jsx39(Footer, { config })
+      ] }) }),
+      toc
+    ] }) })
+  ] });
+}
+
+// src/components/docs/tab-context.tsx
+import { createContext, useContext, useState as useState14 } from "react";
+import { jsx as jsx40 } from "react/jsx-runtime";
+var TabContext = createContext(void 0);
+function TabProvider({ children, defaultTab }) {
+  const [activeTabGroup, setActiveTabGroup] = useState14(defaultTab);
+  return /* @__PURE__ */ jsx40(TabContext.Provider, { value: { activeTabGroup, setActiveTabGroup }, children });
+}
+function useTabContext() {
+  const context = useContext(TabContext);
+  if (!context) {
+    throw new Error("useTabContext must be used within TabProvider");
+  }
+  return context;
+}
+
+// src/components/docs/doc-layout-wrapper.tsx
+import { jsx as jsx41 } from "react/jsx-runtime";
+function DocLayoutWrapper({ header, docs, version, content, toc, config, currentPageTabGroup }) {
+  const { activeTabGroup, setActiveTabGroup } = useTabContext();
+  const lastPageTabGroupRef = useRef3(void 0);
+  const isInitialMount = useRef3(true);
+  useEffect7(() => {
+    if (isInitialMount.current && currentPageTabGroup) {
+      setActiveTabGroup(currentPageTabGroup);
+      lastPageTabGroupRef.current = currentPageTabGroup;
+      isInitialMount.current = false;
+      return;
+    }
+    if (currentPageTabGroup && lastPageTabGroupRef.current !== currentPageTabGroup) {
+      setActiveTabGroup(currentPageTabGroup);
+      lastPageTabGroupRef.current = currentPageTabGroup;
+    }
+  }, [currentPageTabGroup, setActiveTabGroup]);
+  return /* @__PURE__ */ jsx41(
+    MobileDocLayout,
+    {
+      header,
+      docs,
+      version,
+      content,
+      toc,
+      config,
+      activeTabGroup,
+      onTabChange: setActiveTabGroup
+    }
+  );
+}
+
+// src/components/docs/doc-loading.tsx
+import { jsx as jsx42, jsxs as jsxs31 } from "react/jsx-runtime";
+function DocLoading() {
+  return /* @__PURE__ */ jsx42("div", { className: "max-w-4xl mx-auto px-6 py-8", children: /* @__PURE__ */ jsxs31("div", { className: "animate-pulse space-y-4", children: [
+    /* @__PURE__ */ jsx42("div", { className: "h-8 bg-gray-200 rounded w-3/4" }),
+    /* @__PURE__ */ jsx42("div", { className: "h-4 bg-gray-200 rounded w-1/2" }),
+    /* @__PURE__ */ jsxs31("div", { className: "space-y-3 mt-8", children: [
+      /* @__PURE__ */ jsx42("div", { className: "h-4 bg-gray-200 rounded" }),
+      /* @__PURE__ */ jsx42("div", { className: "h-4 bg-gray-200 rounded w-5/6" }),
+      /* @__PURE__ */ jsx42("div", { className: "h-4 bg-gray-200 rounded w-4/6" })
+    ] })
+  ] }) });
+}
+
+// src/components/docs/header.tsx
+import Link8 from "next/link";
+import { Search as Search2, Menu, Github, Twitter, MessageCircle } from "lucide-react";
+
+// src/components/docs/version-switcher.tsx
+import { useState as useState15 } from "react";
+import { Check as Check2, ChevronDown as ChevronDown4 } from "lucide-react";
+import { useRouter } from "next/navigation";
+import { Fragment as Fragment6, jsx as jsx43, jsxs as jsxs32 } from "react/jsx-runtime";
+function VersionSwitcher({ currentVersion, versions }) {
+  const [open, setOpen] = useState15(false);
+  const router = useRouter();
+  const handleVersionChange = (version) => {
+    router.push(`/docs/${version}`);
+    setOpen(false);
+  };
+  return /* @__PURE__ */ jsxs32("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxs32(
+      "button",
+      {
+        onClick: () => setOpen(!open),
+        className: "flex items-center gap-2 px-3 py-2 text-sm text-foreground bg-muted rounded-md hover:bg-muted/80 transition-colors",
+        children: [
+          /* @__PURE__ */ jsx43("span", { className: "font-medium", children: currentVersion }),
+          /* @__PURE__ */ jsx43(ChevronDown4, { className: "h-4 w-4" })
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ jsxs32(Fragment6, { children: [
+      /* @__PURE__ */ jsx43("div", { className: "fixed inset-0 z-40", onClick: () => setOpen(false) }),
+      /* @__PURE__ */ jsx43("div", { className: "absolute right-0 mt-2 w-48 bg-background border border-border rounded-md shadow-lg z-50", children: /* @__PURE__ */ jsx43("div", { className: "p-2", children: versions.map((version) => /* @__PURE__ */ jsxs32(
+        "button",
+        {
+          onClick: () => handleVersionChange(version),
+          className: "flex items-center justify-between w-full px-3 py-2 text-sm text-foreground hover:bg-muted rounded-md transition-colors",
+          children: [
+            /* @__PURE__ */ jsx43("span", { children: version }),
+            version === currentVersion && /* @__PURE__ */ jsx43(Check2, { className: "h-4 w-4 text-primary" })
+          ]
+        },
+        version
+      )) }) })
+    ] })
+  ] });
+}
+
+// src/components/docs/theme-toggle.tsx
+import { Moon, Sun } from "lucide-react";
+import { useEffect as useEffect8, useState as useState16 } from "react";
+import { jsx as jsx44 } from "react/jsx-runtime";
+function ThemeToggle() {
+  const [theme, setTheme] = useState16("dark");
+  useEffect8(() => {
+    const savedTheme = localStorage.getItem("theme");
+    const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+    const initialTheme = savedTheme || (prefersDark ? "dark" : "light");
+    setTheme(initialTheme);
+    document.documentElement.classList.toggle("dark", initialTheme === "dark");
+  }, []);
+  const toggleTheme = () => {
+    const newTheme = theme === "dark" ? "light" : "dark";
+    setTheme(newTheme);
+    localStorage.setItem("theme", newTheme);
+    document.documentElement.classList.toggle("dark", newTheme === "dark");
+  };
+  return /* @__PURE__ */ jsx44(
+    "button",
+    {
+      onClick: toggleTheme,
+      className: "flex items-center justify-center w-9 h-9 rounded-md border border-border bg-background hover:bg-accent transition-colors",
+      "aria-label": "Toggle theme",
+      children: theme === "dark" ? /* @__PURE__ */ jsx44(Sun, { className: "h-4 w-4 text-foreground" }) : /* @__PURE__ */ jsx44(Moon, { className: "h-4 w-4 text-foreground" })
+    }
+  );
+}
+
+// src/components/docs/search-modal.tsx
+import { useState as useState17, useEffect as useEffect9, useCallback } from "react";
+import { Search, FileText as FileText2, Loader2 as Loader23 } from "lucide-react";
+import { useRouter as useRouter2 } from "next/navigation";
+
+// src/components/ui/dialog.tsx
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { XIcon } from "lucide-react";
+import { jsx as jsx45, jsxs as jsxs33 } from "react/jsx-runtime";
+function Dialog({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx45(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
+}
+function DialogTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx45(DialogPrimitive.Trigger, { "data-slot": "dialog-trigger", ...props });
+}
+function DialogPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx45(DialogPrimitive.Portal, { "data-slot": "dialog-portal", ...props });
+}
+function DialogClose({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx45(DialogPrimitive.Close, { "data-slot": "dialog-close", ...props });
+}
+function DialogOverlay({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx45(
+    DialogPrimitive.Overlay,
+    {
+      "data-slot": "dialog-overlay",
+      className: cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50 dark:bg-black/70 backdrop-blur-md",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function DialogContent({
+  className,
+  children,
+  showCloseButton = true,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs33(DialogPortal, { "data-slot": "dialog-portal", children: [
+    /* @__PURE__ */ jsx45(DialogOverlay, {}),
+    /* @__PURE__ */ jsxs33(
+      DialogPrimitive.Content,
+      {
+        "data-slot": "dialog-content",
+        className: cn(
+          "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 outline-none sm:max-w-lg",
+          className
+        ),
+        ...props,
+        children: [
+          children,
+          showCloseButton && /* @__PURE__ */ jsxs33(
+            DialogPrimitive.Close,
+            {
+              "data-slot": "dialog-close",
+              className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+              children: [
+                /* @__PURE__ */ jsx45(XIcon, {}),
+                /* @__PURE__ */ jsx45("span", { className: "sr-only", children: "Close" })
+              ]
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+function DialogHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx45(
+    "div",
+    {
+      "data-slot": "dialog-header",
+      className: cn("flex flex-col gap-2 text-center sm:text-left", className),
+      ...props
+    }
+  );
+}
+function DialogFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx45(
+    "div",
+    {
+      "data-slot": "dialog-footer",
+      className: cn(
+        "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function DialogTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx45(
+    DialogPrimitive.Title,
+    {
+      "data-slot": "dialog-title",
+      className: cn("text-lg leading-none font-semibold", className),
+      ...props
+    }
+  );
+}
+function DialogDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx45(
+    DialogPrimitive.Description,
+    {
+      "data-slot": "dialog-description",
+      className: cn("text-muted-foreground text-sm", className),
+      ...props
+    }
+  );
+}
+
+// src/components/docs/search-modal.tsx
+import { Fragment as Fragment7, jsx as jsx46, jsxs as jsxs34 } from "react/jsx-runtime";
+function SearchModal({ isOpen, onClose, config }) {
+  const [query, setQuery] = useState17("");
+  const [results, setResults] = useState17([]);
+  const [isLoading, setIsLoading] = useState17(false);
+  const [selectedIndex, setSelectedIndex] = useState17(0);
+  const router = useRouter2();
+  const searchConfig = config.search;
+  const performSearch = useCallback(async (searchQuery) => {
+    if (!searchQuery.trim() || !searchConfig?.enabled) {
+      setResults([]);
+      return;
+    }
+    setIsLoading(true);
+    try {
+      const response = await fetch("/api/search", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          query: searchQuery,
+          // filter: 'version = "v1.0.0"',
+          distinct: "version",
+          limit: 2
+        })
+      });
+      if (response.ok) {
+        const data = await response.json();
+        console.log("Search response:", data);
+        setResults(data.hits || []);
+      } else {
+        console.error("Search failed:", response.status, await response.text());
+      }
+    } catch (error) {
+      console.error("Search error:", error);
+      setResults([]);
+    } finally {
+      setIsLoading(false);
+    }
+  }, [searchConfig]);
+  useEffect9(() => {
+    const timer = setTimeout(() => {
+      performSearch(query);
+    }, 300);
+    return () => clearTimeout(timer);
+  }, [query, performSearch]);
+  useEffect9(() => {
+    const handleKeyDown = (e) => {
+      if (!isOpen) return;
+      switch (e.key) {
+        case "Escape":
+          onClose();
+          break;
+        case "ArrowDown":
+          e.preventDefault();
+          setSelectedIndex((prev) => Math.min(prev + 1, results.length - 1));
+          break;
+        case "ArrowUp":
+          e.preventDefault();
+          setSelectedIndex((prev) => Math.max(prev - 1, 0));
+          break;
+        case "Enter":
+          e.preventDefault();
+          if (results[selectedIndex]) {
+            handleResultClick(results[selectedIndex]);
+          }
+          break;
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [isOpen, results, selectedIndex, onClose]);
+  useEffect9(() => {
+    if (isOpen) {
+      setQuery("");
+      setResults([]);
+      setSelectedIndex(0);
+    }
+  }, [isOpen]);
+  const handleResultClick = (result) => {
+    const url = `/docs/${result.version}/${result.slug}?q=${encodeURIComponent(query)}`;
+    router.push(url);
+    onClose();
+  };
+  const highlightText = (text, query2) => {
+    if (!query2.trim()) return text;
+    const parts = text.split(new RegExp(`(${query2})`, "gi"));
+    return parts.map(
+      (part, i) => part.toLowerCase() === query2.toLowerCase() ? /* @__PURE__ */ jsx46("mark", { className: "bg-yellow-200 dark:bg-yellow-900/50 text-foreground", children: part }, i) : part
+    );
+  };
+  return /* @__PURE__ */ jsx46(Dialog, { open: isOpen, onOpenChange: onClose, modal: true, children: /* @__PURE__ */ jsxs34(
+    DialogContent,
+    {
+      className: "max-w-2xl p-0 gap-0 top-[10vh] translate-y-0",
+      showCloseButton: false,
+      onOpenAutoFocus: (e) => e.preventDefault(),
+      children: [
+        /* @__PURE__ */ jsxs34("div", { className: "flex items-center gap-3 px-4 py-3 border-b border-border", children: [
+          /* @__PURE__ */ jsx46(Search, { className: "h-5 w-5 text-muted-foreground shrink-0" }),
+          /* @__PURE__ */ jsx46(
+            "input",
+            {
+              type: "text",
+              value: query,
+              onChange: (e) => setQuery(e.target.value),
+              placeholder: searchConfig?.placeholder || "Search documentation...",
+              className: "flex-1 bg-transparent border-none outline-none text-foreground placeholder:text-muted-foreground",
+              autoFocus: true
+            }
+          ),
+          isLoading && /* @__PURE__ */ jsx46(Loader23, { className: "h-5 w-5 text-muted-foreground animate-spin" })
+        ] }),
+        /* @__PURE__ */ jsxs34("div", { className: "max-h-[60vh] overflow-y-auto", children: [
+          query.trim() && results.length === 0 && !isLoading && /* @__PURE__ */ jsxs34("div", { className: "px-4 py-8 text-center text-muted-foreground", children: [
+            'No results found for "',
+            query,
+            '"'
+          ] }),
+          results.length > 0 && /* @__PURE__ */ jsx46("div", { className: "py-2", children: results.map((result, index) => /* @__PURE__ */ jsx46(
+            "button",
+            {
+              onClick: () => handleResultClick(result),
+              className: `w-full px-4 py-3 text-left hover:bg-muted/50 transition-colors border-l-2 ${index === selectedIndex ? "bg-muted/50 border-primary" : "border-transparent"}`,
+              onMouseEnter: () => setSelectedIndex(index),
+              children: /* @__PURE__ */ jsxs34("div", { className: "flex items-start gap-3", children: [
+                /* @__PURE__ */ jsx46(FileText2, { className: "h-5 w-5 text-muted-foreground shrink-0 mt-0.5" }),
+                /* @__PURE__ */ jsxs34("div", { className: "flex-1 min-w-0", children: [
+                  /* @__PURE__ */ jsx46("div", { className: "font-medium text-foreground mb-1", children: highlightText(result.title, query) }),
+                  result.content && /* @__PURE__ */ jsx46("div", { className: "text-sm text-muted-foreground line-clamp-2", children: highlightText(result.content, query) }),
+                  /* @__PURE__ */ jsxs34("div", { className: "flex items-center gap-2 mt-1 text-xs text-muted-foreground", children: [
+                    /* @__PURE__ */ jsx46("span", { children: result.version }),
+                    result.category && /* @__PURE__ */ jsxs34(Fragment7, { children: [
+                      /* @__PURE__ */ jsx46("span", { children: "\u2022" }),
+                      /* @__PURE__ */ jsx46("span", { children: result.category })
+                    ] })
+                  ] })
+                ] })
+              ] })
+            },
+            result.id
+          )) }),
+          !query.trim() && /* @__PURE__ */ jsxs34("div", { className: "px-4 py-8 text-center text-muted-foreground text-sm", children: [
+            /* @__PURE__ */ jsx46("p", { children: "Start typing to search documentation..." }),
+            /* @__PURE__ */ jsxs34("div", { className: "mt-4 flex items-center justify-center gap-4 text-xs", children: [
+              /* @__PURE__ */ jsx46("kbd", { className: "px-2 py-1 bg-muted rounded border border-border", children: "\u2191\u2193" }),
+              /* @__PURE__ */ jsx46("span", { children: "Navigate" }),
+              /* @__PURE__ */ jsx46("kbd", { className: "px-2 py-1 bg-muted rounded border border-border", children: "Enter" }),
+              /* @__PURE__ */ jsx46("span", { children: "Select" }),
+              /* @__PURE__ */ jsx46("kbd", { className: "px-2 py-1 bg-muted rounded border border-border", children: "Esc" }),
+              /* @__PURE__ */ jsx46("span", { children: "Close" })
+            ] })
+          ] })
+        ] })
+      ]
+    }
+  ) });
+}
+
+// src/components/docs/header.tsx
+import { useState as useState18, useEffect as useEffect10 } from "react";
+import { jsx as jsx47, jsxs as jsxs35 } from "react/jsx-runtime";
+function Header({ currentVersion, versions, onMenuClick, config }) {
+  const [searchOpen, setSearchOpen] = useState18(false);
+  useEffect10(() => {
+    const handleKeyDown = (e) => {
+      if ((e.metaKey || e.ctrlKey) && e.key === "k") {
+        e.preventDefault();
+        setSearchOpen(true);
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, []);
+  return /* @__PURE__ */ jsxs35("header", { className: "sticky top-0 z-50 w-full border-b border-border bg-background/95 backdrop-blur supports-backdrop-filter:bg-background/60", children: [
+    /* @__PURE__ */ jsxs35("div", { className: "container flex h-16 items-center justify-between px-6 mx-auto", children: [
+      /* @__PURE__ */ jsxs35("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx47(
+          "button",
+          {
+            onClick: onMenuClick,
+            className: "lg:hidden hover:bg-muted p-2 rounded-md transition-colors",
+            "aria-label": "Toggle menu",
+            children: /* @__PURE__ */ jsx47(Menu, { className: "h-5 w-5" })
+          }
+        ),
+        /* @__PURE__ */ jsxs35(Link8, { href: "/", className: "flex items-center gap-2", children: [
+          config.site.logo ? /* @__PURE__ */ jsx47("img", { src: getAssetPath(config.site.logo), alt: config.site.title, className: "h-8 w-auto" }) : /* @__PURE__ */ jsx47("div", { className: "h-8 w-8 rounded-xl bg-primary flex items-center justify-center", children: /* @__PURE__ */ jsx47("span", { className: "text-primary-foreground font-bold text-lg", children: config.site.title.charAt(0).toUpperCase() }) }),
+          /* @__PURE__ */ jsx47("span", { className: "font-semibold text-lg text-foreground", children: "Specra" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs35("div", { className: "flex items-center gap-2", children: [
+        config.search?.enabled && /* @__PURE__ */ jsxs35(
+          "button",
+          {
+            onClick: () => setSearchOpen(true),
+            className: "flex items-center gap-2 px-3 py-2 text-sm text-muted-foreground hover:text-foreground bg-muted rounded-md transition-colors",
+            children: [
+              /* @__PURE__ */ jsx47(Search2, { className: "h-4 w-4" }),
+              /* @__PURE__ */ jsx47("span", { className: "hidden sm:inline", children: config.search.placeholder || "Search" }),
+              /* @__PURE__ */ jsx47("kbd", { className: "hidden sm:inline-flex h-5 select-none items-center gap-1 rounded border border-border bg-background px-1.5 font-mono text-xs font-medium", children: "\u2318K" })
+            ]
+          }
+        ),
+        config.features?.versioning && /* @__PURE__ */ jsx47(VersionSwitcher, { currentVersion, versions }),
+        config.social?.github && /* @__PURE__ */ jsx47(
+          "a",
+          {
+            href: config.social.github,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "hidden md:flex items-center justify-center h-9 w-9 rounded-md hover:bg-muted transition-colors",
+            "aria-label": "GitHub",
+            children: /* @__PURE__ */ jsx47(Github, { className: "h-4 w-4" })
+          }
+        ),
+        config.social?.twitter && /* @__PURE__ */ jsx47(
+          "a",
+          {
+            href: config.social.twitter,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "hidden md:flex items-center justify-center h-9 w-9 rounded-md hover:bg-muted transition-colors",
+            "aria-label": "Twitter",
+            children: /* @__PURE__ */ jsx47(Twitter, { className: "h-4 w-4" })
+          }
+        ),
+        config.social?.discord && /* @__PURE__ */ jsx47(
+          "a",
+          {
+            href: config.social.discord,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "hidden md:flex items-center justify-center h-9 w-9 rounded-md hover:bg-muted transition-colors",
+            "aria-label": "Discord",
+            children: /* @__PURE__ */ jsx47(MessageCircle, { className: "h-4 w-4" })
+          }
+        ),
+        /* @__PURE__ */ jsx47(ThemeToggle, {})
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx47(SearchModal, { isOpen: searchOpen, onClose: () => setSearchOpen(false), config })
+  ] });
+}
+
+// src/components/docs/hot-reload-indicator.tsx
+import { useEffect as useEffect11, useState as useState19 } from "react";
+import { usePathname as usePathname2 } from "next/navigation";
+import { RefreshCw } from "lucide-react";
+import { Fragment as Fragment8, jsx as jsx48, jsxs as jsxs36 } from "react/jsx-runtime";
+function HotReloadIndicator() {
+  const [isReloading, setIsReloading] = useState19(false);
+  const [lastReload, setLastReload] = useState19(null);
+  const pathname = usePathname2();
+  useEffect11(() => {
+    if (process.env.NODE_ENV !== "development") return;
+    setIsReloading(true);
+    const timer = setTimeout(() => {
+      setIsReloading(false);
+      setLastReload(/* @__PURE__ */ new Date());
+      setTimeout(() => {
+        setLastReload(null);
+      }, 3e3);
+    }, 500);
+    return () => clearTimeout(timer);
+  }, [pathname]);
+  useEffect11(() => {
+    if (process.env.NODE_ENV !== "development") return;
+    const handleBeforeRefresh = () => {
+      setIsReloading(true);
+    };
+    const handleAfterRefresh = () => {
+      setIsReloading(false);
+      setLastReload(/* @__PURE__ */ new Date());
+      setTimeout(() => setLastReload(null), 3e3);
+    };
+    if (typeof window !== "undefined" && window.__NEXT_DATA__) {
+      window.addEventListener("beforeunload", handleBeforeRefresh);
+    }
+    return () => {
+      window.removeEventListener("beforeunload", handleBeforeRefresh);
+    };
+  }, []);
+  if (process.env.NODE_ENV !== "development") return null;
+  return /* @__PURE__ */ jsxs36(Fragment8, { children: [
+    isReloading && /* @__PURE__ */ jsxs36("div", { className: "fixed bottom-4 right-4 z-50 flex items-center gap-2 px-4 py-2 bg-primary text-primary-foreground rounded-xl shadow-lg animate-in slide-in-from-bottom-2", children: [
+      /* @__PURE__ */ jsx48(RefreshCw, { className: "h-4 w-4 animate-spin" }),
+      /* @__PURE__ */ jsx48("span", { className: "text-sm font-medium", children: "Reloading..." })
+    ] }),
+    lastReload && !isReloading && /* @__PURE__ */ jsxs36("div", { className: "fixed bottom-4 right-4 z-50 flex items-center gap-2 px-4 py-2 bg-green-500 text-white rounded-xl shadow-lg animate-in slide-in-from-bottom-2", children: [
+      /* @__PURE__ */ jsx48(RefreshCw, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsxs36("span", { className: "text-sm font-medium", children: [
+        "Updated at ",
+        lastReload.toLocaleTimeString()
+      ] })
+    ] })
+  ] });
+}
+
+// src/components/docs/mdx-hot-reload.tsx
+import { useEffect as useEffect12 } from "react";
+import { useRouter as useRouter3 } from "next/navigation";
+function MdxHotReload() {
+  const router = useRouter3();
+  useEffect12(() => {
+    if (process.env.NODE_ENV !== "development") return;
+    const eventSource = new EventSource("/api/mdx-watch");
+    eventSource.onmessage = (event) => {
+      const data = JSON.parse(event.data);
+      if (data.type === "change") {
+        console.log("[MDX Hot Reload] File changed:", data.file);
+        router.refresh();
+      } else if (data.type === "connected") {
+        console.log("[MDX Hot Reload] Watching for changes...");
+      }
+    };
+    eventSource.onerror = (error) => {
+      console.error("[MDX Hot Reload] Connection error:", error);
+      eventSource.close();
+    };
+    return () => {
+      eventSource.close();
+    };
+  }, [router]);
+  return null;
+}
+
+// src/components/docs/not-found-content.tsx
+import Link9 from "next/link";
+import { AlertTriangle as AlertTriangle2, Home, ArrowLeft } from "lucide-react";
+import { jsx as jsx49, jsxs as jsxs37 } from "react/jsx-runtime";
+function NotFoundContent({ version }) {
+  return /* @__PURE__ */ jsx49("div", { className: "flex min-h-[calc(100vh-12rem)] items-center justify-center px-4 py-12", children: /* @__PURE__ */ jsxs37("div", { className: "w-full max-w-2xl text-center", children: [
+    /* @__PURE__ */ jsx49("div", { className: "mb-6 flex justify-center", children: /* @__PURE__ */ jsx49("div", { className: "rounded-full bg-yellow-500/10 p-4", children: /* @__PURE__ */ jsx49(AlertTriangle2, { className: "h-16 w-16 text-yellow-500" }) }) }),
+    /* @__PURE__ */ jsx49("h1", { className: "mb-3 text-5xl font-bold tracking-tight", children: "404" }),
+    /* @__PURE__ */ jsx49("h2", { className: "mb-4 text-2xl font-semibold", children: "Page Not Found" }),
+    /* @__PURE__ */ jsxs37("p", { className: "mb-8 text-base text-muted-foreground", children: [
+      "The documentation page you're looking for doesn't exist or may have been moved.",
+      /* @__PURE__ */ jsx49("br", {}),
+      "Try using the sidebar to find what you're looking for, or return to the documentation home."
+    ] }),
+    /* @__PURE__ */ jsxs37("div", { className: "flex flex-col items-center justify-center gap-3 sm:flex-row", children: [
+      /* @__PURE__ */ jsxs37(
+        Link9,
+        {
+          href: `/docs/${version}`,
+          className: "inline-flex items-center gap-2 rounded-lg bg-primary px-6 py-3 text-sm font-medium text-primary-foreground hover:bg-primary/90 transition-colors",
+          children: [
+            /* @__PURE__ */ jsx49(ArrowLeft, { className: "h-4 w-4" }),
+            "Back to Documentation"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs37(
+        Link9,
+        {
+          href: "/",
+          className: "inline-flex items-center gap-2 rounded-lg border border-border bg-background px-6 py-3 text-sm font-medium hover:bg-muted transition-colors",
+          children: [
+            /* @__PURE__ */ jsx49(Home, { className: "h-4 w-4" }),
+            "Go to Homepage"
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx49("div", { className: "mt-12 rounded-lg border border-border bg-muted/30 p-6", children: /* @__PURE__ */ jsxs37("p", { className: "text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ jsx49("strong", { className: "font-medium text-foreground", children: "Tip:" }),
+      " Use the sidebar navigation on the left to browse all available documentation pages."
+    ] }) })
+  ] }) });
+}
+
+// src/components/docs/sidebar-skeleton.tsx
+import { jsx as jsx50, jsxs as jsxs38 } from "react/jsx-runtime";
+function SidebarSkeleton() {
+  return /* @__PURE__ */ jsx50("aside", { className: "w-64 pr-8 py-6", children: /* @__PURE__ */ jsxs38("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsx50("div", { className: "px-2", children: /* @__PURE__ */ jsx50("div", { className: "h-5 w-32 bg-muted/50 rounded animate-pulse" }) }),
+    /* @__PURE__ */ jsx50("div", { className: "space-y-1", children: [...Array(8)].map((_, i) => /* @__PURE__ */ jsx50("div", { className: "px-3 py-2", children: /* @__PURE__ */ jsx50(
+      "div",
+      {
+        className: "h-4 bg-muted/50 rounded animate-pulse",
+        style: { width: `${60 + Math.random() * 40}%` }
+      }
+    ) }, i)) }),
+    /* @__PURE__ */ jsxs38("div", { className: "space-y-1", children: [
+      /* @__PURE__ */ jsx50("div", { className: "px-2 mb-2", children: /* @__PURE__ */ jsx50("div", { className: "h-4 w-24 bg-muted/50 rounded animate-pulse" }) }),
+      [...Array(5)].map((_, i) => /* @__PURE__ */ jsx50("div", { className: "px-3 py-2", children: /* @__PURE__ */ jsx50(
+        "div",
+        {
+          className: "h-4 bg-muted/50 rounded animate-pulse",
+          style: { width: `${50 + Math.random() * 50}%` }
+        }
+      ) }, i))
+    ] })
+  ] }) });
+}
+
+// src/components/docs/table-of-contents.tsx
+import { useEffect as useEffect13, useState as useState20 } from "react";
+import { jsx as jsx51, jsxs as jsxs39 } from "react/jsx-runtime";
+function TableOfContents({ items, config }) {
+  const [activeId, setActiveId] = useState20("");
+  if (!config.navigation?.showTableOfContents) {
+    return null;
+  }
+  const maxDepth = config.navigation?.tocMaxDepth || 3;
+  const filteredItems = items.filter((item) => item.level <= maxDepth);
+  const hasTabGroups = config.navigation?.tabGroups && config.navigation.tabGroups.length > 0;
+  useEffect13(() => {
+    const observer = new IntersectionObserver(
+      (entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            setActiveId(entry.target.id);
+          }
+        });
+      },
+      { rootMargin: "-80px 0px -80% 0px" }
+    );
+    filteredItems.forEach((item) => {
+      const element = document.getElementById(item.id);
+      if (element) {
+        observer.observe(element);
+      }
+    });
+    return () => observer.disconnect();
+  }, [filteredItems]);
+  const handleClick = (e, id) => {
+    e.preventDefault();
+    const element = document.getElementById(id);
+    if (element) {
+      const offset = 100;
+      const elementPosition = element.getBoundingClientRect().top;
+      const offsetPosition = elementPosition + window.scrollY - offset;
+      window.scrollTo({
+        top: offsetPosition,
+        behavior: "smooth"
+      });
+      window.history.replaceState(null, "", `#${id}`);
+      setActiveId(id);
+    }
+  };
+  const stickyTop = hasTabGroups ? "top-[7.5rem]" : "top-24";
+  const maxHeight = hasTabGroups ? "max-h-[calc(100vh-10rem)]" : "max-h-[calc(100vh-7rem)]";
+  return /* @__PURE__ */ jsx51("aside", { className: `w-64 hidden xl:block shrink-0 sticky ${stickyTop} self-start`, children: filteredItems.length > 0 && /* @__PURE__ */ jsxs39("div", { className: `${maxHeight} overflow-y-auto bg-muted/30 dark:bg-muted/10 rounded-2xl p-4 border border-border/50`, children: [
+    /* @__PURE__ */ jsx51("h3", { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-4 px-2", children: "On this page" }),
+    /* @__PURE__ */ jsx51("nav", { className: "space-y-1", children: filteredItems.map((item) => /* @__PURE__ */ jsx51(
+      "a",
+      {
+        href: `#${item.id}`,
+        onClick: (e) => handleClick(e, item.id),
+        className: `block text-sm transition-all cursor-pointer rounded-xl px-3 py-2 ${item.level === 3 ? "ml-3" : ""} ${activeId === item.id ? "text-primary font-medium" : "text-foreground hover:bg-accent/50"}`,
+        children: item.title
+      },
+      item.id
+    )) })
+  ] }) });
+}
+
+// src/components/global/version-not-found.tsx
+import { AlertTriangle as AlertTriangle3 } from "lucide-react";
+import Link10 from "next/link";
+import { Fragment as Fragment9, jsx as jsx52, jsxs as jsxs40 } from "react/jsx-runtime";
+function VersionNotFound() {
+  return /* @__PURE__ */ jsx52(Fragment9, { children: /* @__PURE__ */ jsx52("div", { className: "flex min-h-screen items-center justify-center px-4", children: /* @__PURE__ */ jsxs40("div", { className: "text-center", children: [
+    /* @__PURE__ */ jsx52("div", { className: "mb-4 flex justify-center", children: /* @__PURE__ */ jsx52(AlertTriangle3, { className: "h-16 w-16 text-yellow-500" }) }),
+    /* @__PURE__ */ jsx52("h1", { className: "mb-2 text-4xl font-bold", children: "Version Not Found" }),
+    /* @__PURE__ */ jsx52("p", { className: "mb-6 text-muted-foreground", children: "The documentation version you're looking for doesn't exist." }),
+    /* @__PURE__ */ jsx52(
+      Link10,
+      {
+        href: "/docs/v1.0.0",
+        className: "inline-flex items-center rounded-lg bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90",
+        children: "Go to Latest Version"
+      }
+    )
+  ] }) }) });
+}
+export {
+  Accordion,
+  AccordionItem,
+  ApiEndpoint,
+  ApiParams,
+  ApiPlayground,
+  ApiReference,
+  ApiResponse,
+  ApiResponse as ApiResponseDisplay,
+  Badge2 as Badge,
+  Breadcrumb,
+  Button,
+  COMPONENT_TEXT_PROPS,
+  Callout,
+  Card,
+  CardGrid,
+  CategoryIndex,
+  CodeBlock,
+  Column,
+  Columns,
+  DevModeBadge,
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogOverlay,
+  DialogPortal,
+  DialogTitle,
+  DialogTrigger,
+  Badge as DocBadge,
+  DocLayout,
+  DocLayoutWrapper,
+  DocLoading,
+  DocMetadata,
+  DocNavigation,
+  DocTags,
+  DraftBadge,
+  Footer,
+  Frame,
+  Header,
+  HotReloadIndicator,
+  Icon,
+  Image,
+  ImageCard,
+  ImageCardGrid,
+  Input,
+  Math2 as Math,
+  MdxHotReload,
+  Mermaid,
+  MobileDocLayout,
+  NotFoundContent,
+  SearchHighlight,
+  SearchModal,
+  Sidebar,
+  SidebarSkeleton,
+  SiteBanner,
+  Step,
+  Steps,
+  Tab,
+  TabGroups,
+  TabProvider,
+  TableOfContents,
+  Tabs,
+  Textarea,
+  ThemeToggle,
+  Tooltip,
+  VersionNotFound,
+  VersionSwitcher,
+  Video,
+  badgeVariants,
+  buttonVariants,
+  extractComponentPropsText,
+  extractSearchText,
+  mdxComponents,
+  useTabContext
+};
+//# sourceMappingURL=index.mjs.map