boltdocs 1.10.1 → 1.10.2

package/dist/client/index.js

@@ -1802,29 +1802,6 @@ var init_Breadcrumbs2 = __esm({
   }
 });
 
-// src/client/theme/ui/BackgroundGradient/BackgroundGradient.tsx
-function BackgroundGradient() {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "boltdocs-background-glow", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "glow-shape glow-1" }),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "glow-shape glow-2" })
-  ] });
-}
-var import_jsx_runtime18;
-var init_BackgroundGradient = __esm({
-  "src/client/theme/ui/BackgroundGradient/BackgroundGradient.tsx"() {
-    "use strict";
-    import_jsx_runtime18 = require("react/jsx-runtime");
-  }
-});
-
-// src/client/theme/ui/BackgroundGradient/index.ts
-var init_BackgroundGradient2 = __esm({
-  "src/client/theme/ui/BackgroundGradient/index.ts"() {
-    "use strict";
-    init_BackgroundGradient();
-  }
-});
-
 // src/client/theme/ui/ProgressBar/ProgressBar.css
 var init_ProgressBar = __esm({
   "src/client/theme/ui/ProgressBar/ProgressBar.css"() {
@@ -1865,7 +1842,7 @@ function ProgressBar() {
       if (timer) clearInterval(timer);
     };
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "boltdocs-progress-container", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "boltdocs-progress-container", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
     "div",
     {
       className: "boltdocs-progress-bar",
@@ -1873,13 +1850,13 @@ function ProgressBar() {
     }
   ) });
 }
-var import_react14, import_jsx_runtime19;
+var import_react14, import_jsx_runtime18;
 var init_ProgressBar2 = __esm({
   "src/client/theme/ui/ProgressBar/ProgressBar.tsx"() {
     "use strict";
     import_react14 = require("react");
     init_ProgressBar();
-    import_jsx_runtime19 = require("react/jsx-runtime");
+    import_jsx_runtime18 = require("react/jsx-runtime");
   }
 });
 
@@ -1891,13 +1868,20 @@ var init_ProgressBar3 = __esm({
   }
 });
 
+// src/client/theme/ui/ErrorBoundary/error-boundary.css
+var init_error_boundary = __esm({
+  "src/client/theme/ui/ErrorBoundary/error-boundary.css"() {
+  }
+});
+
 // src/client/theme/ui/ErrorBoundary/ErrorBoundary.tsx
-var import_react15, import_jsx_runtime20, ErrorBoundary;
+var import_react15, import_jsx_runtime19, ErrorBoundary;
 var init_ErrorBoundary = __esm({
   "src/client/theme/ui/ErrorBoundary/ErrorBoundary.tsx"() {
     "use strict";
     import_react15 = require("react");
-    import_jsx_runtime20 = require("react/jsx-runtime");
+    init_error_boundary();
+    import_jsx_runtime19 = require("react/jsx-runtime");
     ErrorBoundary = class extends import_react15.Component {
       state = {
         hasError: false
@@ -1910,10 +1894,10 @@ var init_ErrorBoundary = __esm({
       }
       render() {
         if (this.state.hasError) {
-          return this.props.fallback || /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "boltdocs-error-boundary", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "boltdocs-error-title", children: "Something went wrong" }),
-            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "boltdocs-error-message", children: this.state.error?.message || "An unexpected error occurred while rendering this page." }),
-            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+          return this.props.fallback || /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "boltdocs-error-boundary", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "boltdocs-error-title", children: "Something went wrong" }),
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "boltdocs-error-message", children: this.state.error?.message || "An unexpected error occurred while rendering this page." }),
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
               "button",
               {
                 className: "boltdocs-error-retry",
@@ -1972,51 +1956,51 @@ function CopyMarkdown({ content, config }) {
     window.open(url, "_blank");
     setIsOpen(false);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "boltdocs-copy-markdown", ref: dropdownRef, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "copy-btn-group", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "boltdocs-copy-markdown", ref: dropdownRef, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "copy-btn-group", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
         "button",
         {
           className: "copy-btn",
           onClick: handleCopy,
           "aria-label": "Copy Markdown",
           children: [
-            copied ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.Check, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.Copy, { size: 16 }),
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "copy-label", children: copied ? "Copied!" : buttonText })
+            copied ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react10.Check, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react10.Copy, { size: 16 }),
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "copy-label", children: copied ? "Copied!" : buttonText })
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         "button",
         {
           className: `copy-dropdown-toggle ${isOpen ? "is-active" : ""}`,
           onClick: () => setIsOpen(!isOpen),
           "aria-label": "More options",
           "aria-expanded": isOpen,
-          children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.ChevronDown, { size: 14, className: "arrow-icon" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react10.ChevronDown, { size: 14, className: "arrow-icon" })
         }
       )
     ] }),
-    isOpen && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "copy-dropdown", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("button", { className: "copy-option", onClick: handleCopy, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.Copy, { size: 14 }),
+    isOpen && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "copy-dropdown", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("button", { className: "copy-option", onClick: handleCopy, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react10.Copy, { size: 14 }),
         "Copy Markdown"
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("button", { className: "copy-option", onClick: handleOpenRaw, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.ExternalLink, { size: 14 }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("button", { className: "copy-option", onClick: handleOpenRaw, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react10.ExternalLink, { size: 14 }),
         "View as Markdown"
       ] })
     ] })
   ] });
 }
-var import_react16, import_lucide_react10, import_jsx_runtime21;
+var import_react16, import_lucide_react10, import_jsx_runtime20;
 var init_CopyMarkdown = __esm({
   "src/client/theme/ui/CopyMarkdown/CopyMarkdown.tsx"() {
     "use strict";
     import_react16 = require("react");
     import_lucide_react10 = require("lucide-react");
     init_copy_markdown();
-    import_jsx_runtime21 = require("react/jsx-runtime");
+    import_jsx_runtime20 = require("react/jsx-runtime");
   }
 });
 
@@ -2070,10 +2054,9 @@ function ThemeLayout({
     if (prevPage?.path) preload(prevPage.path);
     if (nextPage?.path) preload(nextPage.path);
   }, [prevPage, nextPage, preload]);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: `boltdocs-layout ${className}`, style, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ProgressBar, {}),
-    background !== void 0 ? background : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(BackgroundGradient, {}),
-    head !== void 0 ? head : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: `boltdocs-layout ${className}`, style, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ProgressBar, {}),
+    head !== void 0 ? head : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       Head,
       {
         siteTitle,
@@ -2081,7 +2064,7 @@ function ThemeLayout({
         routes
       }
     ),
-    navbar !== void 0 ? navbar : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    navbar !== void 0 ? navbar : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       Navbar,
       {
         config,
@@ -2091,52 +2074,52 @@ function ThemeLayout({
         currentVersion
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "boltdocs-main-container", children: [
-      sidebar !== void 0 ? sidebar : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Sidebar, { routes: filteredRoutes, config }),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("main", { className: "boltdocs-content", children: [
-        breadcrumbs !== void 0 ? breadcrumbs : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Breadcrumbs, { routes: filteredRoutes, config }),
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "boltdocs-page", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "boltdocs-page-header", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "boltdocs-main-container", children: [
+      sidebar !== void 0 ? sidebar : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Sidebar, { routes: filteredRoutes, config }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("main", { className: "boltdocs-content", children: [
+        breadcrumbs !== void 0 ? breadcrumbs : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Breadcrumbs, { routes: filteredRoutes, config }),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "boltdocs-page", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "boltdocs-page-header", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
             CopyMarkdown,
             {
               content: routes[currentIndex]?._rawContent,
               config: config.themeConfig?.copyMarkdown
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ErrorBoundary, { children })
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ErrorBoundary, { children })
         ] }),
-        (prevPage || nextPage) && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("nav", { className: "page-nav", "aria-label": "Pagination", children: [
-          prevPage ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+        (prevPage || nextPage) && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("nav", { className: "page-nav", "aria-label": "Pagination", children: [
+          prevPage ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
             Link,
             {
               to: prevPage.path || "/",
               className: "page-nav-link page-nav-link--prev",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "page-nav-info", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "page-nav-label", children: "Previous" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "page-nav-title", children: prevPage.title })
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "page-nav-info", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "page-nav-label", children: "Previous" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "page-nav-title", children: prevPage.title })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react11.ChevronLeft, { className: "page-nav-arrow", size: 16 })
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react11.ChevronLeft, { className: "page-nav-arrow", size: 16 })
               ]
             }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", {}),
-          nextPage ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+          ) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", {}),
+          nextPage ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
             Link,
             {
               to: nextPage.path || "/",
               className: "page-nav-link page-nav-link--next",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "page-nav-info", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "page-nav-label", children: "Next" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "page-nav-title", children: nextPage.title })
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "page-nav-info", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "page-nav-label", children: "Next" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "page-nav-title", children: nextPage.title })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react11.ChevronRight, { className: "page-nav-arrow", size: 16 })
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react11.ChevronRight, { className: "page-nav-arrow", size: 16 })
               ]
             }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", {})
+          ) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", {})
         ] })
       ] }),
-      toc !== void 0 ? toc : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      toc !== void 0 ? toc : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         OnThisPage,
         {
           headings: routes[currentIndex]?.headings,
@@ -2148,7 +2131,7 @@ function ThemeLayout({
     ] })
   ] });
 }
-var import_react17, import_react_router_dom10, import_lucide_react11, import_jsx_runtime22;
+var import_react17, import_react_router_dom10, import_lucide_react11, import_jsx_runtime21;
 var init_Layout = __esm({
   "src/client/theme/ui/Layout/Layout.tsx"() {
     "use strict";
@@ -2162,18 +2145,16 @@ var init_Layout = __esm({
     init_OnThisPage2();
     init_Head2();
     init_Breadcrumbs2();
-    init_BackgroundGradient2();
     init_Navbar2();
     init_Sidebar2();
     init_OnThisPage2();
     init_Head2();
     init_Breadcrumbs2();
-    init_BackgroundGradient2();
     init_ProgressBar3();
     init_ErrorBoundary2();
     init_CopyMarkdown2();
     init_styles();
-    import_jsx_runtime22 = require("react/jsx-runtime");
+    import_jsx_runtime21 = require("react/jsx-runtime");
   }
 });
 
@@ -2187,23 +2168,23 @@ var init_Layout2 = __esm({
 
 // src/client/theme/ui/NotFound/NotFound.tsx
 function NotFound() {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "boltdocs-not-found", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "not-found-content", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "not-found-code", children: "404" }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("h1", { className: "not-found-title", children: "Page Not Found" }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "not-found-text", children: "The page you're looking for doesn't exist or has been moved." }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Link, { to: "/", className: "not-found-link", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react12.ArrowLeft, { size: 16 }),
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "boltdocs-not-found", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "not-found-content", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "not-found-code", children: "404" }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("h1", { className: "not-found-title", children: "Page Not Found" }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "not-found-text", children: "The page you're looking for doesn't exist or has been moved." }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Link, { to: "/", className: "not-found-link", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react12.ArrowLeft, { size: 16 }),
       " Go to Home"
     ] })
   ] }) });
 }
-var import_lucide_react12, import_jsx_runtime23;
+var import_lucide_react12, import_jsx_runtime22;
 var init_NotFound = __esm({
   "src/client/theme/ui/NotFound/NotFound.tsx"() {
     "use strict";
     init_Link2();
     import_lucide_react12 = require("lucide-react");
-    import_jsx_runtime23 = require("react/jsx-runtime");
+    import_jsx_runtime22 = require("react/jsx-runtime");
   }
 });
 
@@ -2217,16 +2198,16 @@ var init_NotFound2 = __esm({
 
 // src/client/theme/ui/Loading/Loading.tsx
 function Loading() {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "boltdocs-loading", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "loading-spinner" }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "loading-text", children: "Loading..." })
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "boltdocs-loading", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "loading-spinner" }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "loading-text", children: "Loading..." })
   ] });
 }
-var import_jsx_runtime24;
+var import_jsx_runtime23;
 var init_Loading = __esm({
   "src/client/theme/ui/Loading/Loading.tsx"() {
     "use strict";
-    import_jsx_runtime24 = require("react/jsx-runtime");
+    import_jsx_runtime23 = require("react/jsx-runtime");
   }
 });
 
@@ -2241,6 +2222,8 @@ var init_Loading2 = __esm({
 // src/client/theme/components/CodeBlock/CodeBlock.tsx
 function CodeBlock({ children, ...props }) {
   const [copied, setCopied] = (0, import_react18.useState)(false);
+  const [isExpanded, setIsExpanded] = (0, import_react18.useState)(false);
+  const [isExpandable, setIsExpandable] = (0, import_react18.useState)(false);
   const preRef = (0, import_react18.useRef)(null);
   const handleCopy = (0, import_react18.useCallback)(async () => {
     const code = preRef.current?.textContent || "";
@@ -2248,27 +2231,42 @@ function CodeBlock({ children, ...props }) {
     setCopied(true);
     setTimeout(() => setCopied(false), 2e3);
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "code-block-wrapper", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  import_react18.default.useEffect(() => {
+    if (preRef.current) {
+      const codeLength = preRef.current.textContent?.length || 0;
+      setIsExpandable(codeLength > 500);
+    }
+  }, [children]);
+  const shouldTruncate = isExpandable && !isExpanded;
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: `code-block-wrapper ${shouldTruncate ? "is-truncated" : ""}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       "button",
       {
         className: `code-block-copy ${copied ? "copied" : ""}`,
         onClick: handleCopy,
         "aria-label": "Copy code",
-        children: copied ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react13.Check, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react13.Copy, { size: 16 })
+        children: copied ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react13.Check, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react13.Copy, { size: 16 })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("pre", { ref: preRef, ...props, children })
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("pre", { ref: preRef, ...props, children }),
+    isExpandable && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "code-block-expand-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      "button",
+      {
+        className: "code-block-expand-btn",
+        onClick: () => setIsExpanded(!isExpanded),
+        children: isExpanded ? "Show less" : "Expand code"
+      }
+    ) })
   ] });
 }
-var import_react18, import_lucide_react13, import_jsx_runtime25;
+var import_react18, import_lucide_react13, import_jsx_runtime24;
 var init_CodeBlock = __esm({
   "src/client/theme/components/CodeBlock/CodeBlock.tsx"() {
     "use strict";
-    import_react18 = require("react");
+    import_react18 = __toESM(require("react"));
     import_lucide_react13 = require("lucide-react");
     init_utils();
-    import_jsx_runtime25 = require("react/jsx-runtime");
+    import_jsx_runtime24 = require("react/jsx-runtime");
   }
 });
 
@@ -2307,7 +2305,7 @@ function Video({
     observer.observe(el);
     return () => observer.disconnect();
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { ref: containerRef, className: "boltdocs-video-wrapper", children: isVisible ? /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { ref: containerRef, className: "boltdocs-video-wrapper", children: isVisible ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
     "video",
     {
       className: "boltdocs-video",
@@ -2322,7 +2320,7 @@ function Video({
         "Your browser does not support the video tag."
       ]
     }
-  ) : /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+  ) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "div",
     {
       className: "boltdocs-video-placeholder",
@@ -2331,12 +2329,12 @@ function Video({
     }
   ) });
 }
-var import_react19, import_jsx_runtime26;
+var import_react19, import_jsx_runtime25;
 var init_Video = __esm({
   "src/client/theme/components/Video/Video.tsx"() {
     "use strict";
     import_react19 = require("react");
-    import_jsx_runtime26 = require("react/jsx-runtime");
+    import_jsx_runtime25 = require("react/jsx-runtime");
   }
 });
 
@@ -2353,14 +2351,14 @@ var init_Video2 = __esm({
 });
 
 // src/client/theme/icons/npm.tsx
-var import_jsx_runtime27, NPM;
+var import_jsx_runtime26, NPM;
 var init_npm = __esm({
   "src/client/theme/icons/npm.tsx"() {
     "use strict";
-    import_jsx_runtime27 = require("react/jsx-runtime");
-    NPM = (props) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("svg", { ...props, viewBox: "0 0 2500 2500", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("path", { fill: "#c00", d: "M0 0h2500v2500H0z" }),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    import_jsx_runtime26 = require("react/jsx-runtime");
+    NPM = (props) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("svg", { ...props, viewBox: "0 0 2500 2500", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("path", { fill: "#c00", d: "M0 0h2500v2500H0z" }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
         "path",
         {
           fill: "#fff",
@@ -2372,69 +2370,69 @@ var init_npm = __esm({
 });
 
 // src/client/theme/icons/pnpm.tsx
-var import_jsx_runtime28, Pnpm;
+var import_jsx_runtime27, Pnpm;
 var init_pnpm = __esm({
   "src/client/theme/icons/pnpm.tsx"() {
     "use strict";
-    import_jsx_runtime28 = require("react/jsx-runtime");
-    Pnpm = (props) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+    import_jsx_runtime27 = require("react/jsx-runtime");
+    Pnpm = (props) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
       "svg",
       {
         ...props,
         xmlnsXlink: "http://www.w3.org/1999/xlink",
         viewBox: "76.58987244897958 44 164.00775510204068 164",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("defs", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("defs", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
               "path",
               {
                 d: "M237.6 95L187.6 95L187.6 45L237.6 45L237.6 95Z",
                 id: "pnpm_dark__b45vdTD8hs"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
               "path",
               {
                 d: "M182.59 95L132.59 95L132.59 45L182.59 45L182.59 95Z",
                 id: "pnpm_dark__a40WtxIl8d"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
               "path",
               {
                 d: "M127.59 95L77.59 95L77.59 45L127.59 45L127.59 95Z",
                 id: "pnpm_dark__h2CN9AEEpe"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
               "path",
               {
                 d: "M237.6 150L187.6 150L187.6 100L237.6 100L237.6 150Z",
                 id: "pnpm_dark__dqv5133G8"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
               "path",
               {
                 d: "M182.59 150L132.59 150L132.59 100L182.59 100L182.59 150Z",
                 id: "pnpm_dark__b1Lv79ypvm"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
               "path",
               {
                 d: "M182.59 205L132.59 205L132.59 155L182.59 155L182.59 205Z",
                 id: "pnpm_dark__hy1IZWwLX"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
               "path",
               {
                 d: "M237.6 205L187.6 205L187.6 155L237.6 155L237.6 205Z",
                 id: "pnpm_dark__akQfjxQes"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
               "path",
               {
                 d: "M127.59 205L77.59 205L77.59 155L127.59 155L127.59 205Z",
@@ -2442,15 +2440,15 @@ var init_pnpm = __esm({
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("g", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("use", { xlinkHref: "#pnpm_dark__b45vdTD8hs", fill: "#f9ad00" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("use", { xlinkHref: "#pnpm_dark__a40WtxIl8d", fill: "#f9ad00" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("use", { xlinkHref: "#pnpm_dark__h2CN9AEEpe", fill: "#f9ad00" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("use", { xlinkHref: "#pnpm_dark__dqv5133G8", fill: "#f9ad00" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("use", { xlinkHref: "#pnpm_dark__b1Lv79ypvm", fill: "#ffffff" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("use", { xlinkHref: "#pnpm_dark__hy1IZWwLX", fill: "#ffffff" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("use", { xlinkHref: "#pnpm_dark__akQfjxQes", fill: "#ffffff" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("use", { xlinkHref: "#pnpm_dark__bdSrwE5pk", fill: "#ffffff" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("g", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("use", { xlinkHref: "#pnpm_dark__b45vdTD8hs", fill: "#f9ad00" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("use", { xlinkHref: "#pnpm_dark__a40WtxIl8d", fill: "#f9ad00" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("use", { xlinkHref: "#pnpm_dark__h2CN9AEEpe", fill: "#f9ad00" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("use", { xlinkHref: "#pnpm_dark__dqv5133G8", fill: "#f9ad00" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("use", { xlinkHref: "#pnpm_dark__b1Lv79ypvm", fill: "#ffffff" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("use", { xlinkHref: "#pnpm_dark__hy1IZWwLX", fill: "#ffffff" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("use", { xlinkHref: "#pnpm_dark__akQfjxQes", fill: "#ffffff" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("use", { xlinkHref: "#pnpm_dark__bdSrwE5pk", fill: "#ffffff" }) })
           ] })
         ]
       }
@@ -2459,62 +2457,62 @@ var init_pnpm = __esm({
 });
 
 // src/client/theme/icons/bun.tsx
-var import_jsx_runtime29, Bun;
+var import_jsx_runtime28, Bun;
 var init_bun = __esm({
   "src/client/theme/icons/bun.tsx"() {
     "use strict";
-    import_jsx_runtime29 = require("react/jsx-runtime");
-    Bun = (props) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("svg", { ...props, viewBox: "0 0 80 70", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("path", { d: "M71.09 20.74c-.16-.17-.33-.34-.5-.5s-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5A26.46 26.46 0 0 1 75.5 35.7c0 16.57-16.82 30.05-37.5 30.05-11.58 0-21.94-4.23-28.83-10.86l.5.5.5.5.5.5.5.5.5.5.5.5.5.5C19.55 65.3 30.14 69.75 42 69.75c20.68 0 37.5-13.48 37.5-30 0-7.06-3.04-13.75-8.41-19.01Z" }),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    import_jsx_runtime28 = require("react/jsx-runtime");
+    Bun = (props) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("svg", { ...props, viewBox: "0 0 80 70", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M71.09 20.74c-.16-.17-.33-.34-.5-.5s-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5A26.46 26.46 0 0 1 75.5 35.7c0 16.57-16.82 30.05-37.5 30.05-11.58 0-21.94-4.23-28.83-10.86l.5.5.5.5.5.5.5.5.5.5.5.5.5.5C19.55 65.3 30.14 69.75 42 69.75c20.68 0 37.5-13.48 37.5-30 0-7.06-3.04-13.75-8.41-19.01Z" }),
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         "path",
         {
           d: "M73 35.7c0 15.21-15.67 27.54-35 27.54S3 50.91 3 35.7C3 26.27 9 17.94 18.22 13S33.18 3 38 3s8.94 4.13 19.78 10C67 17.94 73 26.27 73 35.7Z",
           style: { fill: "#fbf0df" }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         "path",
         {
           d: "M73 35.7a21.67 21.67 0 0 0-.8-5.78c-2.73 33.3-43.35 34.9-59.32 24.94A40 40 0 0 0 38 63.24c19.3 0 35-12.35 35-27.54Z",
           style: { fill: "#f6dece" }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         "path",
         {
           d: "M24.53 11.17C29 8.49 34.94 3.46 40.78 3.45A9.29 9.29 0 0 0 38 3c-2.42 0-5 1.25-8.25 3.13-1.13.66-2.3 1.39-3.54 2.15-2.33 1.44-5 3.07-8 4.7C8.69 18.13 3 26.62 3 35.7v1.19c6.06-21.41 17.07-23.04 21.53-25.72Z",
           style: { fill: "#fffefc" }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         "path",
         {
           d: "M35.12 5.53A16.41 16.41 0 0 1 29.49 18c-.28.25-.06.73.3.59 3.37-1.31 7.92-5.23 6-13.14-.08-.45-.67-.33-.67.08Zm2.27 0A16.24 16.24 0 0 1 39 19c-.12.35.31.65.55.36 2.19-2.8 4.1-8.36-1.62-14.36-.29-.26-.74.14-.54.49Zm2.76-.17A16.42 16.42 0 0 1 47 17.12a.33.33 0 0 0 .65.11c.92-3.49.4-9.44-7.17-12.53-.4-.16-.66.38-.33.62Zm-18.46 10.4a16.94 16.94 0 0 0 10.47-9c.18-.36.75-.22.66.18-1.73 8-7.52 9.67-11.12 9.45-.38.01-.37-.52-.01-.63Z",
           style: { fill: "#ccbea7", fillRule: "evenodd" }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("path", { d: "M38 65.75C17.32 65.75.5 52.27.5 35.7c0-10 6.18-19.33 16.53-24.92 3-1.6 5.57-3.21 7.86-4.62 1.26-.78 2.45-1.51 3.6-2.19C32 1.89 35 .5 38 .5s5.62 1.2 8.9 3.14c1 .57 2 1.19 3.07 1.87 2.49 1.54 5.3 3.28 9 5.27C69.32 16.37 75.5 25.69 75.5 35.7c0 16.57-16.82 30.05-37.5 30.05ZM38 3c-2.42 0-5 1.25-8.25 3.13-1.13.66-2.3 1.39-3.54 2.15-2.33 1.44-5 3.07-8 4.7C8.69 18.13 3 26.62 3 35.7c0 15.19 15.7 27.55 35 27.55S73 50.89 73 35.7c0-9.08-5.69-17.57-15.22-22.7-3.78-2-6.73-3.88-9.12-5.36-1.09-.67-2.09-1.29-3-1.84C42.63 4 40.42 3 38 3Z" }),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("g", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M38 65.75C17.32 65.75.5 52.27.5 35.7c0-10 6.18-19.33 16.53-24.92 3-1.6 5.57-3.21 7.86-4.62 1.26-.78 2.45-1.51 3.6-2.19C32 1.89 35 .5 38 .5s5.62 1.2 8.9 3.14c1 .57 2 1.19 3.07 1.87 2.49 1.54 5.3 3.28 9 5.27C69.32 16.37 75.5 25.69 75.5 35.7c0 16.57-16.82 30.05-37.5 30.05ZM38 3c-2.42 0-5 1.25-8.25 3.13-1.13.66-2.3 1.39-3.54 2.15-2.33 1.44-5 3.07-8 4.7C8.69 18.13 3 26.62 3 35.7c0 15.19 15.7 27.55 35 27.55S73 50.89 73 35.7c0-9.08-5.69-17.57-15.22-22.7-3.78-2-6.73-3.88-9.12-5.36-1.09-.67-2.09-1.29-3-1.84C42.63 4 40.42 3 38 3Z" }),
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("g", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "path",
           {
             d: "M45.05 43a8.93 8.93 0 0 1-2.92 4.71 6.81 6.81 0 0 1-4 1.88A6.84 6.84 0 0 1 34 47.71 8.93 8.93 0 0 1 31.12 43a.72.72 0 0 1 .8-.81h12.34a.72.72 0 0 1 .79.81Z",
             style: { fill: "#b71422" }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "path",
           {
             d: "M34 47.79a6.91 6.91 0 0 0 4.12 1.9 6.91 6.91 0 0 0 4.11-1.9 10.63 10.63 0 0 0 1-1.07 6.83 6.83 0 0 0-4.9-2.31 6.15 6.15 0 0 0-5 2.78c.23.21.43.41.67.6Z",
             style: { fill: "#ff6164" }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("path", { d: "M34.16 47a5.36 5.36 0 0 1 4.19-2.08 6 6 0 0 1 4 1.69c.23-.25.45-.51.66-.77a7 7 0 0 0-4.71-1.93 6.36 6.36 0 0 0-4.89 2.36 9.53 9.53 0 0 0 .75.73Z" }),
-        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("path", { d: "M38.09 50.19a7.42 7.42 0 0 1-4.45-2 9.52 9.52 0 0 1-3.11-5.05 1.2 1.2 0 0 1 .26-1 1.41 1.41 0 0 1 1.13-.51h12.34a1.44 1.44 0 0 1 1.13.51 1.19 1.19 0 0 1 .25 1 9.52 9.52 0 0 1-3.11 5.05 7.42 7.42 0 0 1-4.44 2Zm-6.17-7.4c-.16 0-.2.07-.21.09a8.29 8.29 0 0 0 2.73 4.37A6.23 6.23 0 0 0 38.09 49a6.28 6.28 0 0 0 3.65-1.73 8.3 8.3 0 0 0 2.72-4.37.21.21 0 0 0-.2-.09Z" })
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M34.16 47a5.36 5.36 0 0 1 4.19-2.08 6 6 0 0 1 4 1.69c.23-.25.45-.51.66-.77a7 7 0 0 0-4.71-1.93 6.36 6.36 0 0 0-4.89 2.36 9.53 9.53 0 0 0 .75.73Z" }),
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M38.09 50.19a7.42 7.42 0 0 1-4.45-2 9.52 9.52 0 0 1-3.11-5.05 1.2 1.2 0 0 1 .26-1 1.41 1.41 0 0 1 1.13-.51h12.34a1.44 1.44 0 0 1 1.13.51 1.19 1.19 0 0 1 .25 1 9.52 9.52 0 0 1-3.11 5.05 7.42 7.42 0 0 1-4.44 2Zm-6.17-7.4c-.16 0-.2.07-.21.09a8.29 8.29 0 0 0 2.73 4.37A6.23 6.23 0 0 0 38.09 49a6.28 6.28 0 0 0 3.65-1.73 8.3 8.3 0 0 0 2.72-4.37.21.21 0 0 0-.2-.09Z" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("g", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("g", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "ellipse",
           {
             cx: "53.22",
@@ -2524,7 +2522,7 @@ var init_bun = __esm({
             style: { fill: "#febbd0" }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "ellipse",
           {
             cx: "22.95",
@@ -2534,14 +2532,14 @@ var init_bun = __esm({
             style: { fill: "#febbd0" }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "path",
           {
             d: "M25.7 38.8a5.51 5.51 0 1 0-5.5-5.51 5.51 5.51 0 0 0 5.5 5.51Zm24.77 0A5.51 5.51 0 1 0 45 33.29a5.5 5.5 0 0 0 5.47 5.51Z",
             style: { fillRule: "evenodd" }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "path",
           {
             d: "M24 33.64a2.07 2.07 0 1 0-2.06-2.07A2.07 2.07 0 0 0 24 33.64Zm24.77 0a2.07 2.07 0 1 0-2.06-2.07 2.07 2.07 0 0 0 2.04 2.07Z",
@@ -2554,12 +2552,12 @@ var init_bun = __esm({
 });
 
 // src/client/theme/icons/deno.tsx
-var import_jsx_runtime30, Deno;
+var import_jsx_runtime29, Deno;
 var init_deno = __esm({
   "src/client/theme/icons/deno.tsx"() {
     "use strict";
-    import_jsx_runtime30 = require("react/jsx-runtime");
-    Deno = (props) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    import_jsx_runtime29 = require("react/jsx-runtime");
+    Deno = (props) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
       "svg",
       {
         ...props,
@@ -2569,7 +2567,7 @@ var init_deno = __esm({
         strokeMiterlimit: "2",
         clipRule: "evenodd",
         viewBox: "0 0 441 441",
-        children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
           "path",
           {
             fill: "currentColor",
@@ -2624,11 +2622,11 @@ function PackageManagerTabs({
     setCopied(true);
     setTimeout(() => setCopied(false), 2e3);
   }, [activeCommand]);
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: `pkg-tabs-wrapper ${className}`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "pkg-tabs-header", children: MANAGERS.map((mgr) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: `pkg-tabs-wrapper ${className}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "pkg-tabs-header", children: MANAGERS.map((mgr) => {
       const Icon = mgr.icon;
       const isActive = activeTab === mgr.id;
-      return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
         "button",
         {
           className: `pkg-tab-btn ${isActive ? "active" : ""}`,
@@ -2636,29 +2634,29 @@ function PackageManagerTabs({
           "aria-selected": isActive,
           role: "tab",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Icon, { className: "pkg-tab-icon", width: "16", height: "16" }),
-            /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { children: mgr.label })
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Icon, { className: "pkg-tab-icon", width: "16", height: "16" }),
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { children: mgr.label })
           ]
         },
         mgr.id
       );
     }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "code-block-wrapper pkg-tabs-content", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "code-block-wrapper pkg-tabs-content", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
         "button",
         {
           className: `code-block-copy ${copied ? "copied" : ""}`,
           onClick: handleCopy,
           type: "button",
           "aria-label": "Copy code",
-          children: copied ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react14.Check, { size: 14 }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react14.Copy, { size: 14 })
+          children: copied ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react14.Check, { size: 14 }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react14.Copy, { size: 14 })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("pre", { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("code", { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "line", children: activeCommand }) }) })
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("pre", { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("code", { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "line", children: activeCommand }) }) })
     ] })
   ] });
 }
-var import_react20, import_lucide_react14, import_jsx_runtime31, MANAGERS;
+var import_react20, import_lucide_react14, import_jsx_runtime30, MANAGERS;
 var init_PackageManagerTabs = __esm({
   "src/client/theme/components/PackageManagerTabs/PackageManagerTabs.tsx"() {
     "use strict";
@@ -2669,7 +2667,7 @@ var init_PackageManagerTabs = __esm({
     init_bun();
     init_deno();
     init_utils();
-    import_jsx_runtime31 = require("react/jsx-runtime");
+    import_jsx_runtime30 = require("react/jsx-runtime");
     MANAGERS = [
       { id: "npm", label: "npm", icon: NPM },
       { id: "pnpm", label: "pnpm", icon: Pnpm },
@@ -2718,7 +2716,7 @@ function AppShell({
         ...route,
         Component: import_react21.default.lazy(() => {
           if (!loader)
-            return Promise.resolve({ default: () => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(NotFound, {}) });
+            return Promise.resolve({ default: () => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(NotFound, {}) });
           return loader();
         })
       };
@@ -2737,14 +2735,14 @@ function AppShell({
   (0, import_react21.useEffect)(() => {
     setResolvedRoutes(resolveRoutes(routesInfo));
   }, [routesInfo, modules, docsDirName]);
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ConfigContext.Provider, { value: config, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(PreloadProvider, { routes: routesInfo, modules, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ScrollHandler, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react_router_dom11.Routes, { children: [
-      HomePage && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ConfigContext.Provider, { value: config, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(PreloadProvider, { routes: routesInfo, modules, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ScrollHandler, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react_router_dom11.Routes, { children: [
+      HomePage && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
         import_react_router_dom11.Route,
         {
           path: "/",
-          element: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          element: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
             ThemeLayout,
             {
               config,
@@ -2753,20 +2751,20 @@ function AppShell({
               toc: null,
               breadcrumbs: null,
               ...config.themeConfig?.layoutProps,
-              children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(HomePage, {})
+              children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(HomePage, {})
             }
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
         import_react_router_dom11.Route,
         {
-          element: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(DocsLayout, { config, routes: routesInfo }),
-          children: resolvedRoutes.map((route) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          element: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(DocsLayout, { config, routes: routesInfo }),
+          children: resolvedRoutes.map((route) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
             import_react_router_dom11.Route,
             {
               path: route.path === "" ? "/" : route.path,
-              element: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react21.default.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Loading, {}), children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+              element: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react21.default.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Loading, {}), children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
                 MdxPage,
                 {
                   Component: route.Component,
@@ -2779,17 +2777,17 @@ function AppShell({
         },
         "docs-layout"
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
         import_react_router_dom11.Route,
         {
           path: "*",
-          element: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          element: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
             ThemeLayout,
             {
               config,
               routes: routesInfo,
               ...config.themeConfig?.layoutProps,
-              children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(NotFound, {})
+              children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(NotFound, {})
             }
           )
         }
@@ -2826,13 +2824,13 @@ function DocsLayout({
   config,
   routes
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
     ThemeLayout,
     {
       config,
       routes,
       ...config.themeConfig?.layoutProps,
-      children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_router_dom11.Outlet, {})
+      children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_router_dom11.Outlet, {})
     }
   );
 }
@@ -2841,7 +2839,7 @@ function MdxPage({
   customComponents = {}
 }) {
   const allComponents = { ...mdxComponents, ...customComponents };
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react22.MDXProvider, { components: allComponents, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Component2, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react22.MDXProvider, { components: allComponents, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Component2, {}) });
 }
 function createBoltdocsApp(options) {
   const { target, routes, docsDirName, config, modules, hot, homePage } = options;
@@ -2851,7 +2849,7 @@ function createBoltdocsApp(options) {
       `[boltdocs] Mount target "${target}" not found in document.`
     );
   }
-  const app = /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react21.default.StrictMode, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_router_dom11.BrowserRouter, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  const app = /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react21.default.StrictMode, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_router_dom11.BrowserRouter, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
     AppShell,
     {
       initialRoutes: routes,
@@ -2866,7 +2864,7 @@ function createBoltdocsApp(options) {
   container.innerHTML = "";
   import_client.default.createRoot(container).render(app);
 }
-var import_react21, import_client, import_react_router_dom11, import_react22, import_react23, import_lucide_react15, import_jsx_runtime32, ConfigContext, Video2, PackageManagerTabs2, Heading, mdxComponents;
+var import_react21, import_client, import_react_router_dom11, import_react22, import_react23, import_lucide_react15, import_jsx_runtime31, ConfigContext, Video2, PackageManagerTabs2, Heading, mdxComponents;
 var init_app = __esm({
   "src/client/app/index.tsx"() {
     "use strict";
@@ -2881,7 +2879,7 @@ var init_app = __esm({
     import_lucide_react15 = require("lucide-react");
     init_CodeBlock2();
     init_preload();
-    import_jsx_runtime32 = require("react/jsx-runtime");
+    import_jsx_runtime31 = require("react/jsx-runtime");
     ConfigContext = (0, import_react23.createContext)(null);
     Video2 = (0, import_react23.lazy)(
       () => Promise.resolve().then(() => (init_Video2(), Video_exports)).then((m) => ({ default: m.Video }))
@@ -2897,21 +2895,21 @@ var init_app = __esm({
       children
     }) => {
       const Tag = `h${level}`;
-      return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(Tag, { id, className: "boltdocs-heading", children: [
+      return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Tag, { id, className: "boltdocs-heading", children: [
         children,
-        id && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("a", { href: `#${id}`, className: "header-anchor", "aria-label": "Anchor", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react15.Link, { size: 16 }) })
+        id && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("a", { href: `#${id}`, className: "header-anchor", "aria-label": "Anchor", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react15.Link, { size: 16 }) })
       ] });
     };
     mdxComponents = {
-      h1: (props) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Heading, { level: 1, ...props }),
-      h2: (props) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Heading, { level: 2, ...props }),
-      h3: (props) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Heading, { level: 3, ...props }),
-      h4: (props) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Heading, { level: 4, ...props }),
-      h5: (props) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Heading, { level: 5, ...props }),
-      h6: (props) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Heading, { level: 6, ...props }),
-      pre: (props) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(CodeBlock, { ...props, children: props.children }),
-      video: (props) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react23.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "video-skeleton" }), children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Video2, { ...props }) }),
-      PackageManagerTabs: (props) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react23.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "pkg-tabs-skeleton" }), children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(PackageManagerTabs2, { ...props }) })
+      h1: (props) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Heading, { level: 1, ...props }),
+      h2: (props) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Heading, { level: 2, ...props }),
+      h3: (props) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Heading, { level: 3, ...props }),
+      h4: (props) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Heading, { level: 4, ...props }),
+      h5: (props) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Heading, { level: 5, ...props }),
+      h6: (props) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Heading, { level: 6, ...props }),
+      pre: (props) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(CodeBlock, { ...props, children: props.children }),
+      video: (props) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react23.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "video-skeleton" }), children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Video2, { ...props }) }),
+      PackageManagerTabs: (props) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react23.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "pkg-tabs-skeleton" }), children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(PackageManagerTabs2, { ...props }) })
     };
   }
 });
@@ -2920,7 +2918,6 @@ var init_app = __esm({
 var client_exports = {};
 __export(client_exports, {
   Admonition: () => Admonition,
-  BackgroundGradient: () => BackgroundGradient,
   Badge: () => Badge,
   Breadcrumbs: () => Breadcrumbs,
   Button: () => Button,
@@ -2957,15 +2954,14 @@ init_Sidebar2();
 init_OnThisPage2();
 init_Head2();
 init_Breadcrumbs2();
-init_BackgroundGradient2();
 
 // src/client/theme/components/Playground/Playground.tsx
 var import_react24 = __toESM(require("react"));
 var import_react_live = require("react-live");
 var import_lucide_react16 = require("lucide-react");
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 function prepareCode(raw) {
-  const trimmed = raw.trim();
+  const trimmed = (raw || "").trim();
   const fnMatch = trimmed.match(/export\s+default\s+function\s+(\w+)/);
   if (fnMatch) {
     const name = fnMatch[1];
@@ -2984,65 +2980,106 @@ render(<${name} />);`;
   return { code: trimmed, noInline: false };
 }
 function Playground({
-  code,
+  code: propsCode,
   children,
+  preview,
   scope = {},
   readonly = false,
   noInline: forceNoInline
 }) {
-  let initialCode = code || "";
-  if (!initialCode && typeof children === "string") {
-    initialCode = children;
-  }
-  const prepared = prepareCode(initialCode);
+  const initialCode = (0, import_react24.useMemo)(() => {
+    let base = propsCode || "";
+    if (!base && typeof children === "string") {
+      base = children;
+    }
+    return base.trim();
+  }, [propsCode, children]);
+  const prepared = (0, import_react24.useMemo)(() => prepareCode(initialCode), [initialCode]);
   const useNoInline = forceNoInline ?? prepared.noInline;
   const [copied, setCopied] = (0, import_react24.useState)(false);
   const [activeCode, setActiveCode] = (0, import_react24.useState)(prepared.code);
+  const [isExpanded, setIsExpanded] = (0, import_react24.useState)(false);
+  import_react24.default.useEffect(() => {
+    setActiveCode(prepared.code);
+  }, [prepared.code]);
   const handleCopy = () => {
-    navigator.clipboard.writeText(activeCode);
+    const textToCopy = !!preview ? initialCode : activeCode;
+    navigator.clipboard.writeText(textToCopy);
     setCopied(true);
     setTimeout(() => setCopied(false), 2e3);
   };
   const extendedScope = { React: import_react24.default, ...scope };
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "boltdocs-playground", "data-readonly": readonly, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
-    import_react_live.LiveProvider,
-    {
-      code: activeCode,
-      scope: extendedScope,
-      theme: void 0,
-      noInline: useNoInline,
-      children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "playground-split-container", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "playground-panel playground-editor-panel", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "playground-panel-header", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "playground-panel-title", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react16.Terminal, { size: 14 }),
-              /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { children: readonly ? "Code Example" : "Live Editor" })
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
-              "button",
-              {
-                className: "playground-copy-btn",
-                onClick: handleCopy,
-                title: "Copy code",
-                children: copied ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react16.Check, { size: 14 }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react16.Copy, { size: 14 })
-              }
-            )
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "playground-panel-content playground-editor", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_live.LiveEditor, { disabled: readonly, onChange: setActiveCode }) })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "playground-panel playground-preview-panel", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "playground-panel-header", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "playground-panel-title", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react16.Play, { size: 14 }),
-            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { children: "Preview" })
-          ] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "playground-panel-content playground-preview", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_live.LivePreview, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_live.LiveError, { className: "playground-error" })
-          ] })
-        ] })
-      ] })
-    }
-  ) });
+  const charLimit = 800;
+  const isExpandable = (propsCode || initialCode).length > charLimit;
+  const shouldTruncate = isExpandable && !isExpanded;
+  const isStatic = !!preview;
+  const staticTransform = (code) => {
+    return "render(<div style={{display:'none'}} />)";
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: `boltdocs-playground ${shouldTruncate ? "is-truncated" : ""}`, "data-readonly": readonly || isStatic, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "playground-split-container", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "playground-panel playground-preview-panel", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "playground-panel-header", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "playground-panel-title", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react16.Play, { size: 14 }),
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { children: "Preview" })
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "playground-panel-content playground-preview", children: isStatic ? preview : /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+        import_react_live.LiveProvider,
+        {
+          code: activeCode,
+          scope: extendedScope,
+          theme: void 0,
+          noInline: useNoInline,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_live.LivePreview, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_live.LiveError, { className: "playground-error" })
+          ]
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "playground-panel playground-editor-panel", children: [
+      !isStatic && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "playground-panel-header", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "playground-panel-title", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react16.Terminal, { size: 14 }),
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { children: readonly ? "Code Example" : "Live Editor" })
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "playground-panel-content playground-editor", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          "button",
+          {
+            className: "playground-copy-btn-inner",
+            onClick: handleCopy,
+            title: "Copy code",
+            children: copied ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react16.Check, { size: 14 }) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react16.Copy, { size: 14 })
+          }
+        ),
+        isStatic ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          import_react_live.LiveProvider,
+          {
+            code: initialCode,
+            noInline: true,
+            transformCode: staticTransform,
+            children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_live.LiveEditor, { disabled: true })
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          import_react_live.LiveProvider,
+          {
+            code: activeCode,
+            scope: extendedScope,
+            theme: void 0,
+            noInline: useNoInline,
+            children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_live.LiveEditor, { disabled: readonly, onChange: setActiveCode })
+          }
+        )
+      ] }),
+      isExpandable && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "playground-expand-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        "button",
+        {
+          className: "playground-expand-btn",
+          onClick: () => setIsExpanded(!isExpanded),
+          children: isExpanded ? "Show less" : "Expand code"
+        }
+      ) })
+    ] })
+  ] }) });
 }
 
 // src/client/index.ts
@@ -3052,7 +3089,7 @@ init_CodeBlock2();
 init_Video2();
 
 // src/client/theme/components/mdx/Button.tsx
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 function Button({
   variant = "primary",
   size = "md",
@@ -3063,7 +3100,7 @@ function Button({
 }) {
   const cls = `ld-btn ld-btn--${variant} ld-btn--${size} ${className}`.trim();
   if (href) {
-    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
       "a",
       {
         href,
@@ -3074,18 +3111,18 @@ function Button({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("button", { className: cls, ...rest, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("button", { className: cls, ...rest, children });
 }
 
 // src/client/theme/components/mdx/Badge.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 function Badge({
   variant = "default",
   children,
   className = "",
   ...rest
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "span",
     {
       className: `ld-badge ld-badge--${variant} ${className}`.trim(),
@@ -3096,14 +3133,14 @@ function Badge({
 }
 
 // src/client/theme/components/mdx/Card.tsx
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 function Cards({
   cols = 3,
   children,
   className = "",
   ...rest
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: `ld-cards ld-cards--${cols} ${className}`.trim(), ...rest, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: `ld-cards ld-cards--${cols} ${className}`.trim(), ...rest, children });
 }
 function Card({
   title,
@@ -3113,13 +3150,13 @@ function Card({
   className = "",
   ...rest
 }) {
-  const inner = /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
-    icon && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "ld-card__icon", children: icon }),
-    title && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("h3", { className: "ld-card__title", children: title }),
-    children && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "ld-card__body", children })
+  const inner = /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_jsx_runtime35.Fragment, { children: [
+    icon && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "ld-card__icon", children: icon }),
+    title && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("h3", { className: "ld-card__title", children: title }),
+    children && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "ld-card__body", children })
   ] });
   if (href) {
-    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
       "a",
       {
         href,
@@ -3129,7 +3166,7 @@ function Card({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: `ld-card ${className}`.trim(), ...rest, children: inner });
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: `ld-card ${className}`.trim(), ...rest, children: inner });
 }
 
 // src/client/theme/components/mdx/Tabs.tsx
@@ -3139,17 +3176,17 @@ init_npm();
 init_pnpm();
 init_bun();
 init_deno();
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 function Tab({ children }) {
-  const content = typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(CodeBlock, { className: "language-bash", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("code", { children: children.trim() }) }) : children;
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "ld-tab-panel", children: content });
+  const content = typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(CodeBlock, { className: "language-bash", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("code", { children: children.trim() }) }) : children;
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "ld-tab-panel", children: content });
 }
 var getIconForLabel = (label) => {
   const l = label.toLowerCase();
-  if (l.includes("pnpm")) return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Pnpm, {});
-  if (l.includes("npm")) return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(NPM, {});
-  if (l.includes("bun")) return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Bun, {});
-  if (l.includes("deno")) return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Deno, {});
+  if (l.includes("pnpm")) return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Pnpm, {});
+  if (l.includes("npm")) return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(NPM, {});
+  if (l.includes("bun")) return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Bun, {});
+  if (l.includes("deno")) return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Deno, {});
   return null;
 };
 function Tabs2({ defaultIndex = 0, children }) {
@@ -3170,11 +3207,11 @@ function Tabs2({ defaultIndex = 0, children }) {
       tabRefs.current[newIndex]?.focus();
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "ld-tabs", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "ld-tabs__bar", role: "tablist", onKeyDown: handleKeyDown, children: tabs.map((child, i) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "ld-tabs", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "ld-tabs__bar", role: "tablist", onKeyDown: handleKeyDown, children: tabs.map((child, i) => {
       const label = child.props.label;
       const Icon = getIconForLabel(label);
-      return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
         "button",
         {
           role: "tab",
@@ -3189,13 +3226,13 @@ function Tabs2({ defaultIndex = 0, children }) {
           onClick: () => setActive(i),
           children: [
             Icon,
-            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { children: label })
+            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { children: label })
           ]
         },
         i
       );
     }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
       "div",
       {
         className: "ld-tabs__content",
@@ -3210,13 +3247,13 @@ function Tabs2({ defaultIndex = 0, children }) {
 
 // src/client/theme/components/mdx/Admonition.tsx
 var import_lucide_react17 = require("lucide-react");
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var ICON_MAP2 = {
-  note: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react17.Bookmark, { size: 18 }),
-  tip: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react17.Lightbulb, { size: 18 }),
-  info: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react17.Info, { size: 18 }),
-  warning: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react17.AlertTriangle, { size: 18 }),
-  danger: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react17.ShieldAlert, { size: 18 })
+  note: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react17.Bookmark, { size: 18 }),
+  tip: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react17.Lightbulb, { size: 18 }),
+  info: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react17.Info, { size: 18 }),
+  warning: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react17.AlertTriangle, { size: 18 }),
+  danger: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react17.ShieldAlert, { size: 18 })
 };
 var LABEL_MAP = {
   note: "Note",
@@ -3232,35 +3269,35 @@ function Admonition({
   className = "",
   ...rest
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
     "div",
     {
       className: `ld-admonition ld-admonition--${type} ${className}`.trim(),
       role: type === "warning" || type === "danger" ? "alert" : "note",
       ...rest,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "ld-admonition__header", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "ld-admonition__icon", children: ICON_MAP2[type] }),
-          /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "ld-admonition__title", children: title || LABEL_MAP[type] })
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "ld-admonition__header", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "ld-admonition__icon", children: ICON_MAP2[type] }),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "ld-admonition__title", children: title || LABEL_MAP[type] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "ld-admonition__body", children })
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "ld-admonition__body", children })
       ]
     }
   );
 }
-var Note = (props) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Admonition, { type: "note", ...props });
-var Tip = (props) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Admonition, { type: "tip", ...props });
-var Warning = (props) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Admonition, { type: "warning", ...props });
-var Danger = (props) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Admonition, { type: "danger", ...props });
-var InfoBox = (props) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Admonition, { type: "info", ...props });
+var Note = (props) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Admonition, { type: "note", ...props });
+var Tip = (props) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Admonition, { type: "tip", ...props });
+var Warning = (props) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Admonition, { type: "warning", ...props });
+var Danger = (props) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Admonition, { type: "danger", ...props });
+var InfoBox = (props) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Admonition, { type: "info", ...props });
 
 // src/client/theme/components/mdx/List.tsx
 var import_react26 = __toESM(require("react"));
 var import_lucide_react18 = require("lucide-react");
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var ICON_MAP3 = {
-  checked: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react18.Check, { size: 14, className: "ld-list__icon" }),
-  arrow: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react18.ChevronRight, { size: 14, className: "ld-list__icon" })
+  checked: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react18.Check, { size: 14, className: "ld-list__icon" }),
+  arrow: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react18.ChevronRight, { size: 14, className: "ld-list__icon" })
 };
 function List({
   variant = "default",
@@ -3269,14 +3306,14 @@ function List({
   ...rest
 }) {
   if (variant === "default") {
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("ul", { className: `ld-list ${className}`.trim(), ...rest, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("ul", { className: `ld-list ${className}`.trim(), ...rest, children });
   }
   const icon = ICON_MAP3[variant];
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("ul", { className: `ld-list ld-list--${variant} ${className}`.trim(), ...rest, children: import_react26.Children.map(children, (child) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("ul", { className: `ld-list ld-list--${variant} ${className}`.trim(), ...rest, children: import_react26.Children.map(children, (child) => {
     if (!import_react26.default.isValidElement(child)) return child;
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("li", { className: "ld-list__item", children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("li", { className: "ld-list__item", children: [
       icon,
-      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "ld-list__text", children: child.props.children })
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "ld-list__text", children: child.props.children })
     ] });
   }) });
 }
@@ -3284,7 +3321,7 @@ function List({
 // src/client/theme/components/mdx/FileTree.tsx
 var import_react27 = __toESM(require("react"));
 var import_lucide_react19 = require("lucide-react");
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 function getTextContent(node) {
   if (typeof node === "string") return node;
   if (typeof node === "number") return node.toString();
@@ -3297,13 +3334,13 @@ function getTextContent(node) {
 function getFileIcon(filename) {
   const name = filename.toLowerCase();
   if (name.endsWith(".ts") || name.endsWith(".tsx") || name.endsWith(".js") || name.endsWith(".jsx") || name.endsWith(".json") || name.endsWith(".mjs") || name.endsWith(".cjs") || name.endsWith(".astro") || name.endsWith(".vue") || name.endsWith(".svelte")) {
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react19.FileCode, { size: 16, strokeWidth: 2, className: "ld-file-tree__icon-file" });
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react19.FileCode, { size: 16, strokeWidth: 2, className: "ld-file-tree__icon-file" });
   }
   if (name.endsWith(".md") || name.endsWith(".mdx") || name.endsWith(".txt")) {
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react19.FileText, { size: 16, strokeWidth: 2, className: "ld-file-tree__icon-file" });
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react19.FileText, { size: 16, strokeWidth: 2, className: "ld-file-tree__icon-file" });
   }
   if (name.endsWith(".png") || name.endsWith(".jpg") || name.endsWith(".jpeg") || name.endsWith(".svg") || name.endsWith(".gif")) {
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
       import_lucide_react19.FileImage,
       {
         size: 16,
@@ -3312,7 +3349,7 @@ function getFileIcon(filename) {
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react19.File, { size: 16, strokeWidth: 2, className: "ld-file-tree__icon-file" });
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react19.File, { size: 16, strokeWidth: 2, className: "ld-file-tree__icon-file" });
 }
 function isListElement(node, tag) {
   if (typeof node.type === "string") {
@@ -3335,15 +3372,15 @@ function FolderNode({
   depth
 }) {
   const [isOpen, setIsOpen] = (0, import_react27.useState)(true);
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("li", { className: "ld-file-tree__item", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("li", { className: "ld-file-tree__item", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
       "div",
       {
         className: "ld-file-tree__label ld-file-tree__label--folder",
         onClick: () => setIsOpen(!isOpen),
         style: { cursor: "pointer" },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "ld-file-tree__icon ld-file-tree__icon--chevron", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "ld-file-tree__icon ld-file-tree__icon--chevron", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
             import_lucide_react19.ChevronRight,
             {
               size: 14,
@@ -3351,7 +3388,7 @@ function FolderNode({
               strokeWidth: 3
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "ld-file-tree__icon", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "ld-file-tree__icon", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
             import_lucide_react19.Folder,
             {
               size: 16,
@@ -3361,11 +3398,11 @@ function FolderNode({
               fillOpacity: 0.15
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "ld-file-tree__name", children: labelText })
+          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "ld-file-tree__name", children: labelText })
         ]
       }
     ),
-    isOpen && nestedNodes.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "ld-file-tree__nested", children: nestedNodes.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react27.default.Fragment, { children: parseNode(child, depth) }, index)) })
+    isOpen && nestedNodes.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "ld-file-tree__nested", children: nestedNodes.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react27.default.Fragment, { children: parseNode(child, depth) }, index)) })
   ] });
 }
 function parseNode(node, depth = 0) {
@@ -3373,11 +3410,11 @@ function parseNode(node, depth = 0) {
     return node;
   }
   if (isListElement(node, "ul")) {
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
       "ul",
       {
         className: `ld-file-tree__list ${depth === 0 ? "ld-file-tree__list--root" : ""}`,
-        children: import_react27.Children.map(node.props.children, (child, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react27.default.Fragment, { children: parseNode(child, depth + 1) }, index))
+        children: import_react27.Children.map(node.props.children, (child, index) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react27.default.Fragment, { children: parseNode(child, depth + 1) }, index))
       }
     );
   }
@@ -3394,7 +3431,7 @@ function parseNode(node, depth = 0) {
     const labelText = isExplicitDir ? rawLabelContent.slice(0, -1) : rawLabelContent;
     const isFolder = hasNested || isExplicitDir;
     if (isFolder) {
-      return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
         FolderNode,
         {
           labelText,
@@ -3403,25 +3440,25 @@ function parseNode(node, depth = 0) {
         }
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("li", { className: "ld-file-tree__item", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "ld-file-tree__label ld-file-tree__label--file", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "ld-file-tree__icon ld-file-tree__icon--spacer" }),
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "ld-file-tree__icon", children: getFileIcon(labelText) }),
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "ld-file-tree__name", children: labelText })
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("li", { className: "ld-file-tree__item", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "ld-file-tree__label ld-file-tree__label--file", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "ld-file-tree__icon ld-file-tree__icon--spacer" }),
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "ld-file-tree__icon", children: getFileIcon(labelText) }),
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "ld-file-tree__name", children: labelText })
     ] }) });
   }
   if (node.props.children) {
-    return import_react27.Children.map(node.props.children, (child, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react27.default.Fragment, { children: parseNode(child, depth) }, index));
+    return import_react27.Children.map(node.props.children, (child, index) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react27.default.Fragment, { children: parseNode(child, depth) }, index));
   }
   return node;
 }
 function FileTree({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "ld-file-tree", dir: "ltr", children: import_react27.Children.map(children, (child) => parseNode(child, 0)) });
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "ld-file-tree", dir: "ltr", children: import_react27.Children.map(children, (child) => parseNode(child, 0)) });
 }
 
 // src/client/theme/components/mdx/Table.tsx
 var import_react28 = require("react");
 var import_lucide_react20 = require("lucide-react");
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 function Table({
   headers,
   data,
@@ -3465,68 +3502,68 @@ function Table({
   };
   const renderSortIcon = (index) => {
     if (!sortable) return null;
-    if (sortConfig?.key !== index) return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react20.ChevronDown, { size: 14, className: "ld-table-sort-icon ld-table-sort-icon--hidden" });
-    return sortConfig.direction === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react20.ChevronUp, { size: 14, className: "ld-table-sort-icon" }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react20.ChevronDown, { size: 14, className: "ld-table-sort-icon" });
+    if (sortConfig?.key !== index) return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react20.ChevronDown, { size: 14, className: "ld-table-sort-icon ld-table-sort-icon--hidden" });
+    return sortConfig.direction === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react20.ChevronUp, { size: 14, className: "ld-table-sort-icon" }) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react20.ChevronDown, { size: 14, className: "ld-table-sort-icon" });
   };
-  const tableContent = children ? children : /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
-    headers && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("tr", { children: headers.map((header, i) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+  const tableContent = children ? children : /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
+    headers && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("tr", { children: headers.map((header, i) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
       "th",
       {
         onClick: () => requestSort(i),
         className: sortable ? "ld-table-header--sortable" : "",
-        children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "ld-table-header-content", children: [
+        children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "ld-table-header-content", children: [
           header,
           renderSortIcon(i)
         ] })
       },
       i
     )) }) }),
-    paginatedData && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("tbody", { children: paginatedData.map((row, i) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("tr", { children: row.map((cell, j) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("td", { children: cell }, j)) }, i)) })
+    paginatedData && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("tbody", { children: paginatedData.map((row, i) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("tr", { children: row.map((cell, j) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("td", { children: cell }, j)) }, i)) })
   ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: `ld-table-container ${className}`.trim(), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "ld-table-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("table", { className: "ld-table", children: tableContent }) }),
-    paginated && totalPages > 1 && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "ld-table-pagination", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "ld-table-pagination-info", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: `ld-table-container ${className}`.trim(), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "ld-table-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("table", { className: "ld-table", children: tableContent }) }),
+    paginated && totalPages > 1 && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "ld-table-pagination", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "ld-table-pagination-info", children: [
         "Page ",
         currentPage,
         " of ",
         totalPages
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "ld-table-pagination-controls", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "ld-table-pagination-controls", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
           "button",
           {
             onClick: () => setCurrentPage(1),
             disabled: currentPage === 1,
             className: "ld-table-pagination-btn",
-            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react20.ChevronsLeft, { size: 16 })
+            children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react20.ChevronsLeft, { size: 16 })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
           "button",
           {
             onClick: () => setCurrentPage((prev) => Math.max(prev - 1, 1)),
             disabled: currentPage === 1,
             className: "ld-table-pagination-btn",
-            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react20.ChevronLeft, { size: 16 })
+            children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react20.ChevronLeft, { size: 16 })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
           "button",
           {
             onClick: () => setCurrentPage((prev) => Math.min(prev + 1, totalPages)),
             disabled: currentPage === totalPages,
             className: "ld-table-pagination-btn",
-            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react20.ChevronRight, { size: 16 })
+            children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react20.ChevronRight, { size: 16 })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
           "button",
           {
             onClick: () => setCurrentPage(totalPages),
             disabled: currentPage === totalPages,
             className: "ld-table-pagination-btn",
-            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react20.ChevronsRight, { size: 16 })
+            children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react20.ChevronsRight, { size: 16 })
           }
         )
       ] })
@@ -3535,7 +3572,7 @@ function Table({
 }
 
 // src/client/theme/components/mdx/Field.tsx
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 function Field({
   name,
   type,
@@ -3545,25 +3582,24 @@ function Field({
   id,
   className = ""
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: `ld-field ${className}`.trim(), id, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "ld-field__header", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "ld-field__signature", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("code", { className: "ld-field__name", children: name }),
-        type && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "ld-field__type-badge", children: type }),
-        required && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "ld-field__required-badge", children: "required" })
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: `ld-field ${className}`.trim(), id, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "ld-field__header", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "ld-field__signature", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("code", { className: "ld-field__name", children: name }),
+        type && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "ld-field__type-badge", children: type }),
+        required && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "ld-field__required-badge", children: "required" })
       ] }),
-      defaultValue && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "ld-field__default", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "ld-field__default-label", children: "Default:" }),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("code", { className: "ld-field__default-value", children: defaultValue })
+      defaultValue && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "ld-field__default", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "ld-field__default-label", children: "Default:" }),
+        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("code", { className: "ld-field__default-value", children: defaultValue })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "ld-field__content", children })
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "ld-field__content", children })
   ] });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Admonition,
-  BackgroundGradient,
   Badge,
   Breadcrumbs,
   Button,