fumadocs-ui 12.5.6 → 13.0.1

package/dist/{chunk-VYTHQTZE.js → chunk-2FLZOPQN.js}

@@ -36,13 +36,13 @@ var ScrollBar = React.forwardRef(({ className, orientation = "vertical", ...prop
     ref,
     orientation,
     className: twMerge(
-      "flex select-none data-[state=hidden]:animate-fade-out",
+      "flex select-none data-[state=hidden]:animate-fd-fade-out",
       orientation === "vertical" && "h-full w-1.5",
       orientation === "horizontal" && "h-1.5 flex-col",
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
+    children: /* @__PURE__ */ jsx(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-fd-border" })
   }
 ));
 ScrollBar.displayName = ScrollAreaPrimitive.Scrollbar.displayName;

package/dist/{chunk-R3M2OC5U.js → chunk-34Z7WODD.js}

@@ -1,6 +1,6 @@
 import {
   hasActive
-} from "./chunk-IIDV3RNQ.js";
+} from "./chunk-AN2Y6MA2.js";
 
 // src/contexts/tree.tsx
 import { usePathname } from "next/navigation";

package/dist/{chunk-IIDV3RNQ.js → chunk-AN2Y6MA2.js}

@@ -18,14 +18,10 @@ function hasActive(items, url) {
     return false;
   });
 }
-function isSecondary(item) {
-  return "secondary" in item && item.secondary === true || item.type === "secondary" || item.type === "icon";
-}
 
 export {
   defaultImageSizes,
   isActive,
   replaceOrDefault,
-  hasActive,
-  isSecondary
+  hasActive
 };

package/dist/{chunk-QQAMPLSA.js → chunk-B63IB7CZ.js}

@@ -2,13 +2,13 @@ import {
   ScrollArea,
   ScrollBar,
   ScrollViewport
-} from "./chunk-VYTHQTZE.js";
+} from "./chunk-2FLZOPQN.js";
 import {
   useCopyButton
 } from "./chunk-2KMKNVSN.js";
 import {
   buttonVariants
-} from "./chunk-YSCK5YFO.js";
+} from "./chunk-IMIWZAMU.js";
 import {
   twMerge
 } from "./chunk-TK3TM3MR.js";
@@ -23,12 +23,19 @@ import {
 import { jsx, jsxs } from "react/jsx-runtime";
 var Pre = forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx("pre", { ref, className: twMerge("nd-codeblock p-4", className), ...props, children: props.children });
+    return /* @__PURE__ */ jsx("pre", { ref, className: twMerge("p-4", className), ...props, children: props.children });
   }
 );
 Pre.displayName = "Pre";
 var CodeBlock = forwardRef(
-  ({ title, allowCopy = true, icon, className, ...props }, ref) => {
+  ({
+    title,
+    allowCopy = true,
+    keepBackground = false,
+    icon,
+    className,
+    ...props
+  }, ref) => {
     const areaRef = useRef(null);
     const onCopy = useCallback(() => {
       const pre = areaRef.current?.getElementsByTagName("pre").item(0);
@@ -44,16 +51,17 @@ var CodeBlock = forwardRef(
       {
         ref,
         className: twMerge(
-          "not-prose group relative my-6 overflow-hidden rounded-lg border bg-secondary/50 text-sm",
+          "not-prose group fd-codeblock relative my-6 overflow-hidden rounded-lg border bg-fd-secondary/50 text-sm",
+          keepBackground && "fd-codeblock-keep-bg",
           className
         ),
         ...props,
         children: [
-          title ? /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center gap-2 border-b bg-muted px-4 py-1.5", children: [
+          title ? /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center gap-2 border-b bg-fd-muted px-4 py-1.5", children: [
             icon ? /* @__PURE__ */ jsx(
               "div",
               {
-                className: "text-muted-foreground [&_svg]:size-3.5",
+                className: "text-fd-muted-foreground [&_svg]:size-3.5",
                 ...typeof icon === "string" ? {
                   dangerouslySetInnerHTML: { __html: icon }
                 } : {
@@ -61,7 +69,7 @@ var CodeBlock = forwardRef(
                 }
               }
             ) : null,
-            /* @__PURE__ */ jsx("figcaption", { className: "flex-1 truncate text-muted-foreground", children: title }),
+            /* @__PURE__ */ jsx("figcaption", { className: "flex-1 truncate text-fd-muted-foreground", children: title }),
             allowCopy ? /* @__PURE__ */ jsx(CopyButton, { className: "-me-2", onCopy }) : null
           ] }) : allowCopy && /* @__PURE__ */ jsx(
             CopyButton,

package/dist/{chunk-7W3V2Z46.js → chunk-E2FDBE7T.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-HLGNIWUN.js";
 import {
   buttonVariants
-} from "./chunk-YSCK5YFO.js";
+} from "./chunk-IMIWZAMU.js";
 import {
   twMerge
 } from "./chunk-TK3TM3MR.js";
@@ -29,13 +29,13 @@ import { Search } from "lucide-react";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 var CommandInput = React.forwardRef(({ className, onClose, ...props }, ref) => /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center gap-2 px-3", children: [
-  /* @__PURE__ */ jsx(Search, { className: "size-4 text-muted-foreground" }),
+  /* @__PURE__ */ jsx(Search, { className: "size-4 text-fd-muted-foreground" }),
   /* @__PURE__ */ jsx(
     CommandPrimitive.Input,
     {
       ref,
       className: twMerge(
-        "w-0 flex-1 bg-transparent py-3 text-base placeholder:text-muted-foreground focus-visible:outline-none",
+        "w-0 flex-1 bg-transparent py-3 text-base placeholder:text-fd-muted-foreground focus-visible:outline-none",
         className
       ),
       ...props
@@ -90,7 +90,7 @@ var CommandSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__
   CommandPrimitive.Separator,
   {
     ref,
-    className: twMerge("h-px bg-border", className),
+    className: twMerge("h-px bg-fd-border", className),
     ...props
   }
 ));
@@ -100,7 +100,7 @@ var CommandItem = React.forwardRef(({ className, icon, nested = false, children,
   {
     ref,
     className: twMerge(
-      "select-none rounded-lg px-2 text-sm aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-selected:bg-accent aria-selected:text-accent-foreground",
+      "select-none rounded-lg px-2 text-sm aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-selected:bg-fd-accent aria-selected:text-fd-accent-foreground",
       className
     ),
     ...props,
@@ -112,7 +112,7 @@ var CommandItem = React.forwardRef(({ className, icon, nested = false, children,
           nested && "ms-2 gap-2 border-s ps-4"
         ),
         children: [
-          /* @__PURE__ */ jsx("div", { className: "text-muted-foreground [&_svg]:size-4", children: icon }),
+          /* @__PURE__ */ jsx("div", { className: "text-fd-muted-foreground [&_svg]:size-4", children: icon }),
           /* @__PURE__ */ jsx("p", { className: "w-0 flex-1 truncate", children })
         ]
       }
@@ -126,8 +126,8 @@ var CommandDialog = React.forwardRef(({ footer, children, ...props }, ref) => /*
     ref,
     shouldFilter: false,
     loop: true,
-    contentClassName: "fixed left-1/2 top-[10vh] z-50 w-[98vw] max-w-screen-sm origin-left -translate-x-1/2 rounded-lg border bg-popover text-popover-foreground shadow-lg data-[state=closed]:animate-dialog-out data-[state=open]:animate-dialog-in",
-    overlayClassName: "fixed inset-0 z-50 bg-background/50 backdrop-blur-sm data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in",
+    contentClassName: "fixed left-1/2 top-[10vh] z-50 w-[98vw] max-w-screen-sm origin-left -translate-x-1/2 rounded-lg border bg-fd-popover text-fd-popover-foreground shadow-lg data-[state=closed]:animate-fd-dialog-out data-[state=open]:animate-fd-dialog-in",
+    overlayClassName: "fixed inset-0 z-50 bg-fd-background/50 backdrop-blur-sm data-[state=closed]:animate-fd-fade-out data-[state=open]:animate-fd-fade-in",
     ...props,
     children: [
       children,
@@ -217,11 +217,11 @@ function Search2({
   ] });
 }
 var itemVariants = cva(
-  "rounded-md border px-2 py-0.5 text-xs font-medium text-muted-foreground transition-colors",
+  "rounded-md border px-2 py-0.5 text-xs font-medium text-fd-muted-foreground transition-colors",
   {
     variants: {
       active: {
-        true: "bg-accent text-accent-foreground"
+        true: "bg-fd-accent text-fd-accent-foreground"
       }
     }
   }

package/dist/{chunk-GHKJ6EFT.js → chunk-GLZ6ALZV.js}

@@ -16,7 +16,7 @@ var PopoverContent = React.forwardRef(({ className, align = "center", sideOffset
     sideOffset,
     side: "bottom",
     className: twMerge(
-      "z-50 min-w-[220px] max-w-[98vw] rounded-lg border bg-popover p-2 text-sm text-popover-foreground shadow-md outline-none data-[state=closed]:animate-popover-out data-[state=open]:animate-popover-in",
+      "z-50 min-w-[220px] max-w-[98vw] rounded-lg border bg-fd-popover p-2 text-sm text-fd-popover-foreground shadow-md outline-none data-[state=closed]:animate-fd-popover-out data-[state=open]:animate-fd-popover-in",
       className
     ),
     ...props

package/dist/{chunk-FMI5QZTV.js → chunk-HOIRMHZT.js}

@@ -6,7 +6,7 @@ function getLinks(links, githubUrl) {
     result = [
       ...result,
       {
-        type: "secondary",
+        type: "icon",
         url: githubUrl,
         text: "Github",
         icon: /* @__PURE__ */ jsx("svg", { role: "img", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" }) }),

package/dist/{chunk-YSCK5YFO.js → chunk-IMIWZAMU.js}

@@ -5,9 +5,9 @@ var buttonVariants = cva(
   {
     variants: {
       color: {
-        outline: "border hover:bg-accent hover:text-accent-foreground",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
-        secondary: "border bg-secondary text-secondary-foreground hover:bg-accent hover:text-accent-foreground"
+        outline: "border hover:bg-fd-accent hover:text-fd-accent-foreground",
+        ghost: "hover:bg-fd-accent hover:text-fd-accent-foreground",
+        secondary: "border bg-fd-secondary text-fd-secondary-foreground hover:bg-fd-accent hover:text-fd-accent-foreground"
       },
       size: {
         sm: "gap-1 p-0.5 text-xs",
@@ -17,12 +17,12 @@ var buttonVariants = cva(
   }
 );
 var itemVariants = cva(
-  "flex w-full flex-row items-center gap-2 rounded-md px-2 py-1.5 text-muted-foreground transition-colors duration-100 [&_svg]:size-4",
+  "flex w-full flex-row items-center gap-2 rounded-md px-2 py-1.5 text-fd-muted-foreground transition-colors duration-100 [&_svg]:size-4",
   {
     variants: {
       active: {
-        true: "bg-primary/10 font-medium text-primary",
-        false: "hover:bg-accent/50 hover:text-accent-foreground/80 hover:transition-none"
+        true: "bg-fd-primary/10 font-medium text-fd-primary",
+        false: "hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none"
       }
     },
     defaultVariants: {

package/dist/{chunk-TPY3ZIF5.js → chunk-J6TIWNTK.js}

@@ -1,18 +1,18 @@
 import {
   LargeSearchToggle,
   LinkItem
-} from "./chunk-KWGNIMEM.js";
+} from "./chunk-U7FLICJE.js";
+import {
+  useTreeContext
+} from "./chunk-34Z7WODD.js";
 import {
   ScrollArea,
   ScrollViewport
-} from "./chunk-VYTHQTZE.js";
-import {
-  useTreeContext
-} from "./chunk-R3M2OC5U.js";
+} from "./chunk-2FLZOPQN.js";
 import {
   hasActive,
   isActive
-} from "./chunk-IIDV3RNQ.js";
+} from "./chunk-AN2Y6MA2.js";
 import {
   useSearchContext
 } from "./chunk-ET4TW6M5.js";
@@ -20,10 +20,10 @@ import {
   Collapsible,
   CollapsibleContent,
   CollapsibleTrigger
-} from "./chunk-7XPZOMJ2.js";
+} from "./chunk-TQJ6YPJ3.js";
 import {
   itemVariants
-} from "./chunk-YSCK5YFO.js";
+} from "./chunk-IMIWZAMU.js";
 import {
   twMerge
 } from "./chunk-TK3TM3MR.js";
@@ -75,8 +75,8 @@ function Sidebar({
       blockScrollingWidth: 768,
       ...props.aside,
       className: twMerge(
-        "fixed z-30 flex shrink-0 flex-col bg-card text-sm md:sticky md:top-0 md:h-dvh md:w-[240px] md:border-e xl:w-[260px]",
-        "max-md:inset-0 max-md:bg-background/80 max-md:pt-14 max-md:text-[15px] max-md:backdrop-blur-md max-md:data-[open=false]:hidden",
+        "fixed z-30 flex shrink-0 flex-col bg-fd-card text-sm md:sticky md:top-0 md:h-dvh md:w-[240px] md:border-e xl:w-[260px]",
+        "max-md:inset-0 max-md:bg-fd-background/80 max-md:pt-14 max-md:text-[15px] max-md:backdrop-blur-md max-md:data-[open=false]:hidden",
         props.aside?.className
       ),
       children: [

package/dist/{chunk-SZGCBNYN.js → chunk-KACGIS2N.js}

@@ -31,7 +31,7 @@ function NavBox({
       ...props,
       className: twMerge(
         "sticky top-0 z-50 border-b transition-colors",
-        transparent ? "border-transparent" : "border-foreground/10 bg-background/60 backdrop-blur-md",
+        transparent ? "border-transparent" : "border-fd-foreground/10 bg-fd-background/60 backdrop-blur-md",
         props.className
       )
     }
@@ -47,14 +47,17 @@ import { Moon, Sun } from "lucide-react";
 import { useTheme } from "next-themes";
 import { useCallback } from "react";
 import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-var buttonVariants = cva("size-7 rounded-full p-1.5 text-muted-foreground", {
-  variants: {
-    dark: {
-      true: "dark:bg-accent dark:text-accent-foreground",
-      false: "bg-accent text-accent-foreground dark:bg-transparent dark:text-muted-foreground"
+var buttonVariants = cva(
+  "size-7 rounded-full p-1.5 text-fd-muted-foreground",
+  {
+    variants: {
+      dark: {
+        true: "dark:bg-fd-accent dark:text-fd-accent-foreground",
+        false: "bg-fd-accent text-fd-accent-foreground dark:bg-transparent dark:text-fd-muted-foreground"
+      }
     }
   }
-});
+);
 function ThemeToggle({
   className,
   ...props

package/dist/chunk-KWZZNVSY.js

@@ -0,0 +1,39 @@
+import {
+  twMerge
+} from "./chunk-TK3TM3MR.js";
+
+// src/components/callout.tsx
+import { AlertTriangle, Info, OctagonAlert } from "lucide-react";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Callout = forwardRef(
+  ({ className, children, title, type = "info", icon, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: twMerge(
+          "my-6 flex flex-row gap-2 rounded-lg border bg-fd-card p-3 text-sm text-fd-card-foreground shadow-md",
+          className
+        ),
+        ...props,
+        children: [
+          icon ?? {
+            info: /* @__PURE__ */ jsx(Info, { className: "size-5 fill-blue-500 text-fd-card" }),
+            warn: /* @__PURE__ */ jsx(AlertTriangle, { className: "size-5 fill-orange-500 text-fd-card" }),
+            error: /* @__PURE__ */ jsx(OctagonAlert, { className: "size-5 fill-red-500 text-fd-card" })
+          }[type],
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            title ? /* @__PURE__ */ jsx("p", { className: "not-prose mb-2 font-medium", children: title }) : null,
+            /* @__PURE__ */ jsx("div", { className: "text-fd-muted-foreground prose-no-margin", children })
+          ] })
+        ]
+      }
+    );
+  }
+);
+Callout.displayName = "Callout";
+
+export {
+  Callout
+};

package/dist/{chunk-7XPZOMJ2.js → chunk-TQJ6YPJ3.js}

@@ -8,16 +8,16 @@ import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 var Collapsible = CollapsiblePrimitive.Root;
 var CollapsibleTrigger2 = CollapsiblePrimitive.CollapsibleTrigger;
-var CollapsibleContent2 = forwardRef(({ className, children, ...props }, ref) => {
+var CollapsibleContent2 = forwardRef(({ children, ...props }, ref) => {
   return /* @__PURE__ */ jsx(
     CollapsiblePrimitive.CollapsibleContent,
     {
       ref,
+      ...props,
       className: twMerge(
-        "overflow-hidden data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down",
-        className
+        "overflow-hidden [--radix-collapsible-content-height:0px] data-[state=closed]:animate-fd-collapsible-up data-[state=open]:animate-fd-collapsible-down",
+        props.className
       ),
-      ...props,
       children
     }
   );

package/dist/{chunk-5CZEA2KX.js → chunk-TRYAQONT.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-TK3TM3MR.js";
 
 // src/components/heading.tsx
-import { LinkIcon } from "lucide-react";
+import { Link } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 function Heading({
   as,
@@ -11,16 +11,17 @@ function Heading({
   ...props
 }) {
   const As = as ?? "h1";
-  return /* @__PURE__ */ jsx(As, { className: twMerge("scroll-m-20", className), ...props, children: props.id ? /* @__PURE__ */ jsxs("a", { href: `#${props.id}`, className: "group", children: [
+  if (!props.id) return /* @__PURE__ */ jsx(As, { className, ...props });
+  return /* @__PURE__ */ jsx(As, { className: twMerge("scroll-m-20", className), ...props, children: /* @__PURE__ */ jsxs("a", { href: `#${props.id}`, className: "group inline-flex items-center", children: [
     props.children,
     /* @__PURE__ */ jsx(
-      LinkIcon,
+      Link,
       {
         "aria-label": "Link to section",
-        className: "ms-2 inline size-4 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100"
+        className: "ms-2 size-4 text-fd-muted-foreground opacity-0 transition-opacity group-hover:opacity-100"
       }
     )
-  ] }) : props.children });
+  ] }) });
 }
 
 export {

package/dist/{chunk-KWGNIMEM.js → chunk-U7FLICJE.js}

@@ -2,10 +2,10 @@ import {
   Popover,
   PopoverContent,
   PopoverTrigger
-} from "./chunk-GHKJ6EFT.js";
+} from "./chunk-GLZ6ALZV.js";
 import {
   isActive
-} from "./chunk-IIDV3RNQ.js";
+} from "./chunk-AN2Y6MA2.js";
 import {
   useSearchContext
 } from "./chunk-ET4TW6M5.js";
@@ -16,11 +16,11 @@ import {
   Collapsible,
   CollapsibleContent,
   CollapsibleTrigger
-} from "./chunk-7XPZOMJ2.js";
+} from "./chunk-TQJ6YPJ3.js";
 import {
   buttonVariants,
   itemVariants
-} from "./chunk-YSCK5YFO.js";
+} from "./chunk-IMIWZAMU.js";
 import {
   twMerge
 } from "./chunk-TK3TM3MR.js";
@@ -34,12 +34,12 @@ import { useState } from "react";
 import { useOnChange } from "fumadocs-core/utils/use-on-change";
 import { jsx, jsxs } from "react/jsx-runtime";
 var linkItemVariants = cva(
-  "-m-2 inline-flex items-center gap-1 p-2 text-muted-foreground transition-colors [&_svg]:size-4",
+  "-m-2 inline-flex items-center gap-1 p-2 text-fd-muted-foreground transition-colors [&_svg]:size-4",
   {
     variants: {
       active: {
-        true: "text-primary",
-        false: "hover:text-accent-foreground"
+        true: "text-fd-primary",
+        false: "hover:text-fd-accent-foreground"
       }
     },
     defaultVariants: {
@@ -108,7 +108,7 @@ function LinkItem({
   }
   const activeType = item.active ?? "url";
   const active = activeType !== "none" && isActive(item.url, pathname, activeType === "nested-url");
-  if ((item.type === "secondary" || item.type === "icon") && on === "nav") {
+  if (item.type === "icon" && on === "nav") {
     return /* @__PURE__ */ jsx(
       Link,
       {
@@ -201,7 +201,7 @@ function LargeSearchToggle(props) {
       "data-search-full": "",
       ...props,
       className: twMerge(
-        "inline-flex items-center gap-2 rounded-full border bg-secondary/50 p-1.5 text-sm text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground",
+        "inline-flex items-center gap-2 rounded-full border bg-fd-secondary/50 p-1.5 text-sm text-fd-muted-foreground transition-colors hover:bg-fd-accent hover:text-fd-accent-foreground",
         props.className
       ),
       onClick: useCallback(() => {
@@ -210,7 +210,7 @@ function LargeSearchToggle(props) {
       children: [
         /* @__PURE__ */ jsx2(SearchIcon, { className: "ms-1 size-4" }),
         text.search,
-        /* @__PURE__ */ jsx2("div", { className: "ms-auto inline-flex gap-0.5", children: hotKey.map((k, i) => /* @__PURE__ */ jsx2("kbd", { className: "rounded-md border bg-background px-1.5", children: k.display }, i)) })
+        /* @__PURE__ */ jsx2("div", { className: "ms-auto inline-flex gap-0.5", children: hotKey.map((k, i) => /* @__PURE__ */ jsx2("kbd", { className: "rounded-md border bg-fd-background px-1.5", children: k.display }, i)) })
       ]
     }
   );

package/dist/{chunk-N3HFQZRE.js → chunk-WLTWFYQA.js}

@@ -26,13 +26,13 @@ function Card({
     {
       ...props,
       className: twMerge(
-        "not-prose block rounded-lg border bg-card p-4 text-sm text-card-foreground shadow-md transition-colors hover:bg-accent/80",
+        "not-prose block rounded-lg border bg-fd-card p-4 text-sm text-fd-card-foreground shadow-md transition-colors hover:bg-fd-accent/80",
         props.className
       ),
       children: [
-        icon ? /* @__PURE__ */ jsx("div", { className: "mb-2 w-fit rounded-md border bg-muted p-2 text-muted-foreground [&_svg]:size-4", children: icon }) : null,
+        icon ? /* @__PURE__ */ jsx("div", { className: "mb-2 w-fit rounded-md border bg-fd-muted p-2 text-fd-muted-foreground [&_svg]:size-4", children: icon }) : null,
         /* @__PURE__ */ jsx("h3", { className: "mb-1 font-medium", children: title }),
-        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: description })
+        description ? /* @__PURE__ */ jsx("p", { className: "text-fd-muted-foreground", children: description }) : null
       ]
     }
   );

package/dist/components/accordion.js

@@ -1,12 +1,104 @@
 "use client";
 import {
-  Accordion,
-  Accordions
-} from "../chunk-YKLVLKDA.js";
-import "../chunk-2KMKNVSN.js";
-import "../chunk-YSCK5YFO.js";
-import "../chunk-TK3TM3MR.js";
+  useCopyButton
+} from "../chunk-2KMKNVSN.js";
+import {
+  buttonVariants
+} from "../chunk-IMIWZAMU.js";
+import {
+  twMerge
+} from "../chunk-TK3TM3MR.js";
 import "../chunk-MLKGABMK.js";
+
+// src/components/accordion.tsx
+import * as AccordionPrimitive from "@radix-ui/react-accordion";
+import { Check, ChevronRight, LinkIcon } from "lucide-react";
+import {
+  forwardRef,
+  useState,
+  useEffect
+} from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Accordions = forwardRef(({ type = "single", className, defaultValue, ...props }, ref) => {
+  const [value, setValue] = useState(
+    type === "single" ? defaultValue ?? "" : defaultValue ?? []
+  );
+  useEffect(() => {
+    const id = window.location.hash.substring(1);
+    if (id.length > 0)
+      setValue((prev) => typeof prev === "string" ? id : [id, ...prev]);
+  }, []);
+  return (
+    // @ts-expect-error -- Multiple types
+    /* @__PURE__ */ jsx(
+      AccordionPrimitive.Root,
+      {
+        type,
+        ref,
+        value,
+        onValueChange: setValue,
+        collapsible: type === "single" ? true : void 0,
+        className: twMerge(
+          "divide-y divide-fd-border overflow-hidden rounded-lg border bg-fd-card",
+          className
+        ),
+        ...props
+      }
+    )
+  );
+});
+Accordions.displayName = "Accordions";
+var Accordion = forwardRef(({ title, className, id, children, ...props }, ref) => {
+  return /* @__PURE__ */ jsxs(
+    AccordionPrimitive.Item,
+    {
+      ref,
+      value: id ?? title,
+      className: twMerge("group/accordion relative scroll-m-20", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs(
+          AccordionPrimitive.Header,
+          {
+            id,
+            className: "not-prose flex flex-row items-center font-medium text-fd-foreground",
+            children: [
+              /* @__PURE__ */ jsxs(AccordionPrimitive.Trigger, { className: "flex flex-1 items-center gap-2 p-4 text-start focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-fd-ring", children: [
+                /* @__PURE__ */ jsx(ChevronRight, { className: "-ms-1 size-4 shrink-0 text-fd-muted-foreground transition-transform duration-200 group-data-[state=open]/accordion:rotate-90" }),
+                title
+              ] }),
+              id ? /* @__PURE__ */ jsx(CopyButton, { id }) : null
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(AccordionPrimitive.Content, { className: "overflow-hidden data-[state=closed]:animate-fd-accordion-up data-[state=open]:animate-fd-accordion-down", children: /* @__PURE__ */ jsx("div", { className: "p-4 pt-0 prose-no-margin", children }) })
+      ]
+    }
+  );
+});
+function CopyButton({ id }) {
+  const [checked, onClick] = useCopyButton(() => {
+    const url = new URL(window.location.href);
+    url.hash = id;
+    void navigator.clipboard.writeText(url.toString());
+  });
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      "aria-label": "Copy Link",
+      className: twMerge(
+        buttonVariants({
+          color: "ghost",
+          className: "text-fd-muted-foreground me-2"
+        })
+      ),
+      onClick,
+      children: checked ? /* @__PURE__ */ jsx(Check, { className: "size-3.5" }) : /* @__PURE__ */ jsx(LinkIcon, { className: "size-3.5" })
+    }
+  );
+}
+Accordion.displayName = "Accordion";
 export {
   Accordion,
   Accordions

package/dist/components/api.d.ts

@@ -1,8 +1,6 @@
-import { MouseEventHandler, HTMLAttributes, ReactNode } from 'react';
+import { MouseEventHandler } from 'react';
 export { twMerge as cn } from 'tailwind-merge';
 import * as class_variance_authority_types from 'class-variance-authority/types';
-import { Tabs, Tab } from './tabs.js';
-import '@radix-ui/react-tabs';
 
 declare function useCopyButton(onCopy: () => void): [checked: boolean, onClick: MouseEventHandler];
 
@@ -14,38 +12,4 @@ declare const itemVariants: (props?: ({
     active?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 
-declare function Root({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): React.ReactElement;
-declare function API({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): React.ReactElement;
-interface APIInfoProps extends HTMLAttributes<HTMLDivElement> {
-    method?: string;
-    route: string;
-}
-declare function APIInfo({ children, className, method, route, ...props }: APIInfoProps): React.ReactElement;
-interface PropertyProps {
-    name: string;
-    type: string;
-    required: boolean;
-    deprecated: boolean;
-    children: ReactNode;
-}
-declare function Property({ name, type, required, deprecated, children, }: PropertyProps): React.ReactElement;
-declare function APIExample({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): React.ReactElement;
-declare const Responses: typeof Tabs;
-declare const Response: typeof Tab;
-declare const Requests: typeof Tabs;
-declare const Request: typeof Tab;
-declare function ResponseTypes(props: {
-    children: ReactNode;
-}): React.ReactElement;
-declare function ExampleResponse(props: {
-    children: ReactNode;
-}): React.ReactElement;
-declare function TypeScriptResponse(props: {
-    children: ReactNode;
-}): React.ReactElement;
-declare function ObjectCollapsible(props: {
-    name: string;
-    children: ReactNode;
-}): React.ReactElement;
-
-export { API, APIExample, APIInfo, type APIInfoProps, ExampleResponse, ObjectCollapsible, Property, Request, Requests, Response, ResponseTypes, Responses, Root, TypeScriptResponse, buttonVariants, itemVariants, useCopyButton };
+export { buttonVariants, itemVariants, useCopyButton };