@fumadocs/base-ui 16.6.3 → 16.6.4

package/css/generated/shared.css

@@ -215,16 +215,10 @@
 @source inline("data-[active]:border-fd-primary");
 @source inline("data-[active]:text-fd-primary");
 @source inline("data-[closed]:animate-fd-popover-out");
-@source inline("data-[ending-style]:data-[activation-direction=left]:translate-x-1/2");
-@source inline("data-[ending-style]:data-[activation-direction=right]:-translate-x-1/2");
 @source inline("data-[ending-style]:h-0");
-@source inline("data-[ending-style]:opacity-0");
 @source inline("data-[inactive]:hidden");
 @source inline("data-[open]:animate-fd-popover-in");
-@source inline("data-[starting-style]:data-[activation-direction=left]:-translate-x-1/2");
-@source inline("data-[starting-style]:data-[activation-direction=right]:translate-x-1/2");
 @source inline("data-[starting-style]:h-0");
-@source inline("data-[starting-style]:opacity-0");
 @source inline("data-accordion-value");
 @source inline("data-active");
 @source inline("data-card");
@@ -234,6 +228,9 @@
 @source inline("data-closed:animate-fd-fade-out");
 @source inline("data-collapsed");
 @source inline("data-empty");
+@source inline("data-ending-style:data-[activation-direction=left]:translate-x-1/2");
+@source inline("data-ending-style:data-[activation-direction=right]:-translate-x-1/2");
+@source inline("data-ending-style:opacity-0");
 @source inline("data-hidden");
 @source inline("data-icon");
 @source inline("data-line-numbers");
@@ -244,6 +241,9 @@
 @source inline("data-open:text-fd-accent-foreground");
 @source inline("data-search");
 @source inline("data-search-full");
+@source inline("data-starting-style:data-[activation-direction=left]:-translate-x-1/2");
+@source inline("data-starting-style:data-[activation-direction=right]:translate-x-1/2");
+@source inline("data-starting-style:opacity-0");
 @source inline("data-state");
 @source inline("data-theme-toggle");
 @source inline("date");
@@ -392,9 +392,9 @@
 @source inline("grid-cols-2");
 @source inline("grid-cols-[1fr_3fr]");
 @source inline("group");
-@source inline("group-data-[active]:bg-fd-primary");
 @source inline("group-data-[open]:rotate-180");
 @source inline("group-data-[panel-open]:rotate-90");
+@source inline("group-data-active:bg-fd-primary");
 @source inline("groupListeners");
 @source inline("guides");
 @source inline("h");

package/css/lib/shiki.css

@@ -4,45 +4,38 @@
 
   code span {
     color: var(--shiki-light);
+    font-style: var(--shiki-light-font-style);
   }
-}
-
-.dark .shiki:not(.not-fumadocs-codeblock *) {
-  code span {
-    color: var(--shiki-dark);
-  }
-}
 
-:is(pre *):is(.shiki *):not(.not-fumadocs-codeblock *) {
-  .line& {
+  .line {
     position: relative;
     padding-left: var(--padding-left);
     padding-right: var(--padding-right);
   }
 
-  .line:empty& {
+  .line:empty {
     height: 1lh;
   }
 
-  .has-focused .line&:not(.focused) {
+  &.has-focused .line:not(.focused) {
     filter: blur(2px);
     transition: filter 200ms;
   }
 
-  .has-focused:hover .line&:not(.focused) {
+  &.has-focused:hover .line:not(.focused) {
     filter: blur(0);
   }
 
-  [data-line-numbers] .twoslash-meta-line& {
+  &[data-line-numbers] .twoslash-meta-line {
     padding-left: calc(var(--padding-left) + 7 * var(--spacing));
   }
 
-  [data-line-numbers] .line& {
+  &[data-line-numbers] .line {
     counter-increment: line;
     padding-left: calc(var(--padding-left) + 7 * var(--spacing));
   }
 
-  [data-line-numbers] .line&::after {
+  &[data-line-numbers] .line::after {
     position: absolute;
     content: counter(line);
     color: color-mix(
@@ -53,41 +46,48 @@
     @apply top-0 left-4;
   }
 
-  .diff&::before {
+  .diff::before {
     position: absolute;
     left: calc(var(--spacing) * 1.5);
   }
 
-  .diff.remove& {
+  .diff.remove {
     opacity: 0.7;
     --fd-counter-color: var(--color-fd-diff-remove-symbol);
     @apply bg-fd-diff-remove;
   }
 
-  .diff.remove&::before {
+  .diff.remove::before {
     content: '-';
     @apply text-fd-diff-remove-symbol;
   }
 
-  .diff.add& {
+  .diff.add {
     --fd-counter-color: var(--color-fd-diff-add-symbol);
     @apply bg-fd-diff-add;
   }
 
-  .diff.add&::before {
+  .diff.add::before {
     content: '+';
     @apply text-fd-diff-add-symbol;
   }
 
-  .highlighted& {
+  .highlighted {
     --fd-counter-color: var(--color-fd-primary);
     padding-left: calc(var(--padding-left) - 2px);
 
     @apply border-l-2 border-fd-primary/50 bg-fd-primary/10;
   }
 
-  .highlighted-word& {
+  .highlighted-word {
     padding: 1px;
     @apply border -my-px border-fd-primary/30 bg-fd-primary/10 rounded-md font-medium;
   }
 }
+
+.dark .shiki:not(.not-fumadocs-codeblock *) {
+  code span {
+    color: var(--shiki-dark);
+    font-style: var(--shiki-dark-font-style);
+  }
+}

package/dist/components/codeblock.js

@@ -114,7 +114,7 @@ function CodeBlockTabsTrigger({ children, className, ...props }) {
 	return /* @__PURE__ */ jsxs(TabsTrigger, {
 		...props,
 		className: (s) => cn("relative group inline-flex text-sm font-medium text-nowrap items-center transition-colors gap-2 px-2 py-1.5 [&_svg]:size-3.5", s.active ? "text-fd-primary" : "hover:text-fd-accent-foreground", typeof className === "function" ? className(s) : className),
-		children: [/* @__PURE__ */ jsx("div", { className: "absolute inset-x-2 bottom-0 h-px group-data-[active]:bg-fd-primary" }), children]
+		children: [/* @__PURE__ */ jsx("div", { className: "absolute inset-x-2 bottom-0 h-px group-data-active:bg-fd-primary" }), children]
 	});
 }
 function CodeBlockTab(props) {

package/dist/components/codeblock.js.map

@@ -1 +1 @@
-{"version":3,"file":"codeblock.js","names":[],"sources":["../../src/components/codeblock.tsx"],"sourcesContent":["'use client';\nimport { Check, Clipboard } from 'lucide-react';\nimport {\n  type ComponentProps,\n  createContext,\n  type HTMLAttributes,\n  type ReactNode,\n  type RefObject,\n  use,\n  useMemo,\n  useRef,\n} from 'react';\nimport { cn } from '@/utils/cn';\nimport { useCopyButton } from '@/utils/use-copy-button';\nimport { buttonVariants } from '@/components/ui/button';\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';\nimport { mergeRefs } from '@/utils/merge-refs';\n\nexport interface CodeBlockProps extends ComponentProps<'figure'> {\n  /**\n   * Icon of code block\n   *\n   * When passed as a string, it assumes the value is the HTML of icon\n   */\n  icon?: ReactNode;\n\n  /**\n   * Allow to copy code with copy button\n   *\n   * @defaultValue true\n   */\n  allowCopy?: boolean;\n\n  /**\n   * Keep original background color generated by Shiki or Rehype Code\n   *\n   * @defaultValue false\n   */\n  keepBackground?: boolean;\n\n  viewportProps?: HTMLAttributes<HTMLElement>;\n\n  /**\n   * show line numbers\n   */\n  'data-line-numbers'?: boolean;\n\n  /**\n   * @defaultValue 1\n   */\n  'data-line-numbers-start'?: number;\n\n  Actions?: (props: { className?: string; children?: ReactNode }) => ReactNode;\n}\n\nconst TabsContext = createContext<{\n  containerRef: RefObject<HTMLDivElement | null>;\n  nested: boolean;\n} | null>(null);\n\nexport function Pre(props: ComponentProps<'pre'>) {\n  return (\n    <pre {...props} className={cn('min-w-full w-max *:flex *:flex-col', props.className)}>\n      {props.children}\n    </pre>\n  );\n}\n\nexport function CodeBlock({\n  ref,\n  title,\n  allowCopy = true,\n  keepBackground = false,\n  icon,\n  viewportProps = {},\n  children,\n  Actions = (props) => <div {...props} className={cn('empty:hidden', props.className)} />,\n  ...props\n}: CodeBlockProps) {\n  const inTab = use(TabsContext) !== null;\n  const areaRef = useRef<HTMLDivElement>(null);\n\n  return (\n    <figure\n      ref={ref}\n      dir=\"ltr\"\n      {...props}\n      tabIndex={-1}\n      className={cn(\n        inTab ? 'bg-fd-secondary -mx-px -mb-px last:rounded-b-xl' : 'my-4 bg-fd-card rounded-xl',\n        keepBackground && 'bg-(--shiki-light-bg) dark:bg-(--shiki-dark-bg)',\n\n        'shiki relative border shadow-sm not-prose overflow-hidden text-sm',\n        props.className,\n      )}\n    >\n      {title ? (\n        <div className=\"flex text-fd-muted-foreground items-center gap-2 h-9.5 border-b px-4\">\n          {typeof icon === 'string' ? (\n            <div\n              className=\"[&_svg]:size-3.5\"\n              dangerouslySetInnerHTML={{\n                __html: icon,\n              }}\n            />\n          ) : (\n            icon\n          )}\n          <figcaption className=\"flex-1 truncate\">{title}</figcaption>\n          {Actions({\n            className: '-me-2',\n            children: allowCopy && <CopyButton containerRef={areaRef} />,\n          })}\n        </div>\n      ) : (\n        Actions({\n          className:\n            'absolute top-2 right-2 z-2 backdrop-blur-lg rounded-lg text-fd-muted-foreground',\n          children: allowCopy && <CopyButton containerRef={areaRef} />,\n        })\n      )}\n      <div\n        ref={areaRef}\n        {...viewportProps}\n        role=\"region\"\n        tabIndex={0}\n        className={cn(\n          'text-[0.8125rem] py-3.5 overflow-auto max-h-[600px] fd-scroll-container focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-fd-ring',\n          viewportProps.className,\n        )}\n        style={\n          {\n            // space for toolbar\n            '--padding-right': !title ? 'calc(var(--spacing) * 8)' : undefined,\n            counterSet: props['data-line-numbers']\n              ? `line ${Number(props['data-line-numbers-start'] ?? 1) - 1}`\n              : undefined,\n            ...viewportProps.style,\n          } as object\n        }\n      >\n        {children}\n      </div>\n    </figure>\n  );\n}\n\nfunction CopyButton({\n  className,\n  containerRef,\n  ...props\n}: ComponentProps<'button'> & {\n  containerRef: RefObject<HTMLElement | null>;\n}) {\n  const [checked, onClick] = useCopyButton(() => {\n    const pre = containerRef.current?.getElementsByTagName('pre').item(0);\n    if (!pre) return;\n\n    const clone = pre.cloneNode(true) as HTMLElement;\n    clone.querySelectorAll('.nd-copy-ignore').forEach((node) => {\n      node.replaceWith('\\n');\n    });\n\n    void navigator.clipboard.writeText(clone.textContent ?? '');\n  });\n\n  return (\n    <button\n      type=\"button\"\n      data-checked={checked || undefined}\n      className={cn(\n        buttonVariants({\n          className: 'hover:text-fd-accent-foreground data-checked:text-fd-accent-foreground',\n          size: 'icon-xs',\n        }),\n        className,\n      )}\n      aria-label={checked ? 'Copied Text' : 'Copy Text'}\n      onClick={onClick}\n      {...props}\n    >\n      {checked ? <Check /> : <Clipboard />}\n    </button>\n  );\n}\n\nexport function CodeBlockTabs({ ref, className, ...props }: ComponentProps<typeof Tabs>) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const nested = use(TabsContext) !== null;\n\n  return (\n    <Tabs\n      ref={mergeRefs(containerRef, ref)}\n      {...props}\n      className={(s) =>\n        cn(\n          'bg-fd-card rounded-xl border',\n          !nested && 'my-4',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n    >\n      <TabsContext\n        value={useMemo(\n          () => ({\n            containerRef,\n            nested,\n          }),\n          [nested],\n        )}\n      >\n        {props.children}\n      </TabsContext>\n    </Tabs>\n  );\n}\n\nexport function CodeBlockTabsList({ className, ...props }: ComponentProps<typeof TabsList>) {\n  return (\n    <TabsList\n      {...props}\n      className={(s) =>\n        cn(\n          'flex flex-row px-2 overflow-x-auto text-fd-muted-foreground',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n    >\n      {props.children}\n    </TabsList>\n  );\n}\n\nexport function CodeBlockTabsTrigger({\n  children,\n  className,\n  ...props\n}: ComponentProps<typeof TabsTrigger>) {\n  return (\n    <TabsTrigger\n      {...props}\n      className={(s) =>\n        cn(\n          'relative group inline-flex text-sm font-medium text-nowrap items-center transition-colors gap-2 px-2 py-1.5 [&_svg]:size-3.5',\n          s.active ? 'text-fd-primary' : 'hover:text-fd-accent-foreground',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n    >\n      <div className=\"absolute inset-x-2 bottom-0 h-px group-data-[active]:bg-fd-primary\" />\n      {children}\n    </TabsTrigger>\n  );\n}\n\nexport function CodeBlockTab(props: ComponentProps<typeof TabsContent>) {\n  return <TabsContent {...props} />;\n}\n"],"mappings":"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"}
+{"version":3,"file":"codeblock.js","names":[],"sources":["../../src/components/codeblock.tsx"],"sourcesContent":["'use client';\nimport { Check, Clipboard } from 'lucide-react';\nimport {\n  type ComponentProps,\n  createContext,\n  type HTMLAttributes,\n  type ReactNode,\n  type RefObject,\n  use,\n  useMemo,\n  useRef,\n} from 'react';\nimport { cn } from '@/utils/cn';\nimport { useCopyButton } from '@/utils/use-copy-button';\nimport { buttonVariants } from '@/components/ui/button';\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';\nimport { mergeRefs } from '@/utils/merge-refs';\n\nexport interface CodeBlockProps extends ComponentProps<'figure'> {\n  /**\n   * Icon of code block\n   *\n   * When passed as a string, it assumes the value is the HTML of icon\n   */\n  icon?: ReactNode;\n\n  /**\n   * Allow to copy code with copy button\n   *\n   * @defaultValue true\n   */\n  allowCopy?: boolean;\n\n  /**\n   * Keep original background color generated by Shiki or Rehype Code\n   *\n   * @defaultValue false\n   */\n  keepBackground?: boolean;\n\n  viewportProps?: HTMLAttributes<HTMLElement>;\n\n  /**\n   * show line numbers\n   */\n  'data-line-numbers'?: boolean;\n\n  /**\n   * @defaultValue 1\n   */\n  'data-line-numbers-start'?: number;\n\n  Actions?: (props: { className?: string; children?: ReactNode }) => ReactNode;\n}\n\nconst TabsContext = createContext<{\n  containerRef: RefObject<HTMLDivElement | null>;\n  nested: boolean;\n} | null>(null);\n\nexport function Pre(props: ComponentProps<'pre'>) {\n  return (\n    <pre {...props} className={cn('min-w-full w-max *:flex *:flex-col', props.className)}>\n      {props.children}\n    </pre>\n  );\n}\n\nexport function CodeBlock({\n  ref,\n  title,\n  allowCopy = true,\n  keepBackground = false,\n  icon,\n  viewportProps = {},\n  children,\n  Actions = (props) => <div {...props} className={cn('empty:hidden', props.className)} />,\n  ...props\n}: CodeBlockProps) {\n  const inTab = use(TabsContext) !== null;\n  const areaRef = useRef<HTMLDivElement>(null);\n\n  return (\n    <figure\n      ref={ref}\n      dir=\"ltr\"\n      {...props}\n      tabIndex={-1}\n      className={cn(\n        inTab ? 'bg-fd-secondary -mx-px -mb-px last:rounded-b-xl' : 'my-4 bg-fd-card rounded-xl',\n        keepBackground && 'bg-(--shiki-light-bg) dark:bg-(--shiki-dark-bg)',\n\n        'shiki relative border shadow-sm not-prose overflow-hidden text-sm',\n        props.className,\n      )}\n    >\n      {title ? (\n        <div className=\"flex text-fd-muted-foreground items-center gap-2 h-9.5 border-b px-4\">\n          {typeof icon === 'string' ? (\n            <div\n              className=\"[&_svg]:size-3.5\"\n              dangerouslySetInnerHTML={{\n                __html: icon,\n              }}\n            />\n          ) : (\n            icon\n          )}\n          <figcaption className=\"flex-1 truncate\">{title}</figcaption>\n          {Actions({\n            className: '-me-2',\n            children: allowCopy && <CopyButton containerRef={areaRef} />,\n          })}\n        </div>\n      ) : (\n        Actions({\n          className:\n            'absolute top-2 right-2 z-2 backdrop-blur-lg rounded-lg text-fd-muted-foreground',\n          children: allowCopy && <CopyButton containerRef={areaRef} />,\n        })\n      )}\n      <div\n        ref={areaRef}\n        {...viewportProps}\n        role=\"region\"\n        tabIndex={0}\n        className={cn(\n          'text-[0.8125rem] py-3.5 overflow-auto max-h-[600px] fd-scroll-container focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-fd-ring',\n          viewportProps.className,\n        )}\n        style={\n          {\n            // space for toolbar\n            '--padding-right': !title ? 'calc(var(--spacing) * 8)' : undefined,\n            counterSet: props['data-line-numbers']\n              ? `line ${Number(props['data-line-numbers-start'] ?? 1) - 1}`\n              : undefined,\n            ...viewportProps.style,\n          } as object\n        }\n      >\n        {children}\n      </div>\n    </figure>\n  );\n}\n\nfunction CopyButton({\n  className,\n  containerRef,\n  ...props\n}: ComponentProps<'button'> & {\n  containerRef: RefObject<HTMLElement | null>;\n}) {\n  const [checked, onClick] = useCopyButton(() => {\n    const pre = containerRef.current?.getElementsByTagName('pre').item(0);\n    if (!pre) return;\n\n    const clone = pre.cloneNode(true) as HTMLElement;\n    clone.querySelectorAll('.nd-copy-ignore').forEach((node) => {\n      node.replaceWith('\\n');\n    });\n\n    void navigator.clipboard.writeText(clone.textContent ?? '');\n  });\n\n  return (\n    <button\n      type=\"button\"\n      data-checked={checked || undefined}\n      className={cn(\n        buttonVariants({\n          className: 'hover:text-fd-accent-foreground data-checked:text-fd-accent-foreground',\n          size: 'icon-xs',\n        }),\n        className,\n      )}\n      aria-label={checked ? 'Copied Text' : 'Copy Text'}\n      onClick={onClick}\n      {...props}\n    >\n      {checked ? <Check /> : <Clipboard />}\n    </button>\n  );\n}\n\nexport function CodeBlockTabs({ ref, className, ...props }: ComponentProps<typeof Tabs>) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const nested = use(TabsContext) !== null;\n\n  return (\n    <Tabs\n      ref={mergeRefs(containerRef, ref)}\n      {...props}\n      className={(s) =>\n        cn(\n          'bg-fd-card rounded-xl border',\n          !nested && 'my-4',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n    >\n      <TabsContext\n        value={useMemo(\n          () => ({\n            containerRef,\n            nested,\n          }),\n          [nested],\n        )}\n      >\n        {props.children}\n      </TabsContext>\n    </Tabs>\n  );\n}\n\nexport function CodeBlockTabsList({ className, ...props }: ComponentProps<typeof TabsList>) {\n  return (\n    <TabsList\n      {...props}\n      className={(s) =>\n        cn(\n          'flex flex-row px-2 overflow-x-auto text-fd-muted-foreground',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n    >\n      {props.children}\n    </TabsList>\n  );\n}\n\nexport function CodeBlockTabsTrigger({\n  children,\n  className,\n  ...props\n}: ComponentProps<typeof TabsTrigger>) {\n  return (\n    <TabsTrigger\n      {...props}\n      className={(s) =>\n        cn(\n          'relative group inline-flex text-sm font-medium text-nowrap items-center transition-colors gap-2 px-2 py-1.5 [&_svg]:size-3.5',\n          s.active ? 'text-fd-primary' : 'hover:text-fd-accent-foreground',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n    >\n      <div className=\"absolute inset-x-2 bottom-0 h-px group-data-active:bg-fd-primary\" />\n      {children}\n    </TabsTrigger>\n  );\n}\n\nexport function CodeBlockTab(props: ComponentProps<typeof TabsContent>) {\n  return <TabsContent {...props} />;\n}\n"],"mappings":"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"}

package/dist/components/type-table.d.ts

@@ -26,6 +26,9 @@ interface TypeNode {
   default?: ReactNode;
   required?: boolean;
   deprecated?: boolean;
+  /**
+   * a list of parameters info if the type is a function.
+   */
   parameters?: ParameterNode[];
   returns?: ReactNode;
 }

package/dist/components/type-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"type-table.d.ts","names":[],"sources":["../../src/components/type-table.tsx"],"mappings":";;;;UASiB,aAAA;EACf,IAAA;EACA,WAAA,EAAa,SAAA;AAAA;AAAA,UAGE,QAAA;;;;EAIf,WAAA,GAAc,SAAA;EAPD;;;EAYb,IAAA,EAAM,SAAA;EATiB;;;EAcvB,eAAA,GAAkB,SAAA;EAAA;;;EAKlB,mBAAA;EAEA,OAAA,GAAU,SAAA;EAEV,QAAA;EACA,UAAA;EAEA,UAAA,GAAa,aAAA;EAEb,OAAA,GAAU,SAAA;AAAA;AAAA,iBAKI,SAAA,CAAA;EACd,EAAA;EACA,IAAA;EACA,SAAA;EAAA,GACG;AAAA;EACA,IAAA,EAAM,MAAA,SAAe,QAAA;AAAA,IAAc,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"type-table.d.ts","names":[],"sources":["../../src/components/type-table.tsx"],"mappings":";;;;UASiB,aAAA;EACf,IAAA;EACA,WAAA,EAAa,SAAA;AAAA;AAAA,UAGE,QAAA;;;;EAIf,WAAA,GAAc,SAAA;EAPD;;;EAYb,IAAA,EAAM,SAAA;EATiB;;;EAcvB,eAAA,GAAkB,SAAA;EAAA;;;EAKlB,mBAAA;EAEA,OAAA,GAAU,SAAA;EAEV,QAAA;EACA,UAAA;EApBc;;;EAyBd,UAAA,GAAa,aAAA;EAEb,OAAA,GAAU,SAAA;AAAA;AAAA,iBAKI,SAAA,CAAA;EACd,EAAA;EACA,IAAA;EACA,SAAA;EAAA,GACG;AAAA;EACA,IAAA,EAAM,MAAA,SAAe,QAAA;AAAA,IAAc,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/type-table.js.map

@@ -1 +1 @@
-{"version":3,"file":"type-table.js","names":[],"sources":["../../src/components/type-table.tsx"],"sourcesContent":["'use client';\n\nimport { ChevronDown } from 'lucide-react';\nimport Link from 'fumadocs-core/link';\nimport { cva } from 'class-variance-authority';\nimport { cn } from '@/utils/cn';\nimport { type ComponentProps, type ReactNode, useEffect, useState } from 'react';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';\n\nexport interface ParameterNode {\n  name: string;\n  description: ReactNode;\n}\n\nexport interface TypeNode {\n  /**\n   * Additional description of the field\n   */\n  description?: ReactNode;\n\n  /**\n   * type signature (short)\n   */\n  type: ReactNode;\n\n  /**\n   * type signature (full)\n   */\n  typeDescription?: ReactNode;\n\n  /**\n   * Optional `href` for the type\n   */\n  typeDescriptionLink?: string;\n\n  default?: ReactNode;\n\n  required?: boolean;\n  deprecated?: boolean;\n\n  parameters?: ParameterNode[];\n\n  returns?: ReactNode;\n}\n\nconst fieldVariants = cva('text-fd-muted-foreground not-prose pe-2');\n\nexport function TypeTable({\n  id,\n  type,\n  className,\n  ...props\n}: { type: Record<string, TypeNode> } & ComponentProps<'div'>) {\n  return (\n    <div\n      id={id}\n      className={cn(\n        '@container flex flex-col p-1 bg-fd-card text-fd-card-foreground rounded-2xl border my-6 text-sm overflow-hidden',\n        className,\n      )}\n      {...props}\n    >\n      <div className=\"flex font-medium items-center px-3 py-1 not-prose text-fd-muted-foreground\">\n        <p className=\"w-1/4\">Prop</p>\n        <p className=\"@max-xl:hidden\">Type</p>\n      </div>\n      {Object.entries(type).map(([key, value]) => (\n        <Item key={key} parentId={id} name={key} item={value} />\n      ))}\n    </div>\n  );\n}\n\nfunction Item({\n  parentId,\n  name,\n  item: {\n    parameters = [],\n    description,\n    required = false,\n    deprecated,\n    typeDescription,\n    default: defaultValue,\n    type,\n    typeDescriptionLink,\n    returns,\n  },\n}: {\n  parentId?: string;\n  name: string;\n  item: TypeNode;\n}) {\n  const [open, setOpen] = useState(false);\n  const id = parentId ? `${parentId}-${name}` : undefined;\n\n  useEffect(() => {\n    const hash = window.location.hash;\n    if (!id || !hash) return;\n    if (`#${id}` === hash) setOpen(true);\n  }, [id]);\n\n  return (\n    <Collapsible\n      id={id}\n      open={open}\n      onOpenChange={(v) => {\n        if (v && id) {\n          window.history.replaceState(null, '', `#${id}`);\n        }\n        setOpen(v);\n      }}\n      className={cn(\n        'rounded-xl border overflow-hidden scroll-m-20 transition-all',\n        open ? 'shadow-sm bg-fd-background not-last:mb-2' : 'border-transparent',\n      )}\n    >\n      <CollapsibleTrigger className=\"relative flex flex-row items-center w-full group text-start px-3 py-2 not-prose hover:bg-fd-accent\">\n        <code\n          className={cn(\n            'text-fd-primary min-w-fit w-1/4 font-mono font-medium pe-2',\n            deprecated && 'line-through text-fd-primary/50',\n          )}\n        >\n          {name}\n          {!required && '?'}\n        </code>\n        {typeDescriptionLink ? (\n          <Link href={typeDescriptionLink} className=\"underline @max-xl:hidden\">\n            {type}\n          </Link>\n        ) : (\n          <span className=\"@max-xl:hidden\">{type}</span>\n        )}\n        <ChevronDown className=\"absolute end-2 size-4 text-fd-muted-foreground transition-transform group-data-[open]:rotate-180\" />\n      </CollapsibleTrigger>\n      <CollapsibleContent>\n        <div className=\"grid grid-cols-[1fr_3fr] gap-y-4 text-sm p-3 overflow-auto fd-scroll-container border-t\">\n          <div className=\"text-sm prose col-span-full prose-no-margin empty:hidden\">\n            {description}\n          </div>\n          {typeDescription && (\n            <>\n              <p className={cn(fieldVariants())}>Type</p>\n              <p className=\"my-auto not-prose\">{typeDescription}</p>\n            </>\n          )}\n          {defaultValue && (\n            <>\n              <p className={cn(fieldVariants())}>Default</p>\n              <p className=\"my-auto not-prose\">{defaultValue}</p>\n            </>\n          )}\n          {parameters.length > 0 && (\n            <>\n              <p className={cn(fieldVariants())}>Parameters</p>\n              <div className=\"flex flex-col gap-2\">\n                {parameters.map((param) => (\n                  <div key={param.name} className=\"inline-flex items-center flex-wrap gap-1\">\n                    <p className=\"font-medium not-prose text-nowrap\">{param.name} -</p>\n                    <div className=\"text-sm prose prose-no-margin\">{param.description}</div>\n                  </div>\n                ))}\n              </div>\n            </>\n          )}\n          {returns && (\n            <>\n              <p className={cn(fieldVariants())}>Returns</p>\n              <div className=\"my-auto text-sm prose prose-no-margin\">{returns}</div>\n            </>\n          )}\n        </div>\n      </CollapsibleContent>\n    </Collapsible>\n  );\n}\n"],"mappings":";;;;;;;;;;;AA6CA,MAAM,gBAAgB,IAAI,0CAA0C;AAEpE,SAAgB,UAAU,EACxB,IACA,MACA,WACA,GAAG,SAC0D;AAC7D,QACE,qBAAC;EACK;EACJ,WAAW,GACT,mHACA,UACD;EACD,GAAI;aAEJ,qBAAC;GAAI,WAAU;cACb,oBAAC;IAAE,WAAU;cAAQ;KAAQ,EAC7B,oBAAC;IAAE,WAAU;cAAiB;KAAQ;IAClC,EACL,OAAO,QAAQ,KAAK,CAAC,KAAK,CAAC,KAAK,WAC/B,oBAAC;GAAe,UAAU;GAAI,MAAM;GAAK,MAAM;KAApC,IAA6C,CACxD;GACE;;AAIV,SAAS,KAAK,EACZ,UACA,MACA,MAAM,EACJ,aAAa,EAAE,EACf,aACA,WAAW,OACX,YACA,iBACA,SAAS,cACT,MACA,qBACA,aAMD;CACD,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CACvC,MAAM,KAAK,WAAW,GAAG,SAAS,GAAG,SAAS;AAE9C,iBAAgB;EACd,MAAM,OAAO,OAAO,SAAS;AAC7B,MAAI,CAAC,MAAM,CAAC,KAAM;AAClB,MAAI,IAAI,SAAS,KAAM,SAAQ,KAAK;IACnC,CAAC,GAAG,CAAC;AAER,QACE,qBAAC;EACK;EACE;EACN,eAAe,MAAM;AACnB,OAAI,KAAK,GACP,QAAO,QAAQ,aAAa,MAAM,IAAI,IAAI,KAAK;AAEjD,WAAQ,EAAE;;EAEZ,WAAW,GACT,gEACA,OAAO,6CAA6C,qBACrD;aAED,qBAAC;GAAmB,WAAU;;IAC5B,qBAAC;KACC,WAAW,GACT,8DACA,cAAc,kCACf;gBAEA,MACA,CAAC,YAAY;MACT;IACN,sBACC,oBAAC;KAAK,MAAM;KAAqB,WAAU;eACxC;MACI,GAEP,oBAAC;KAAK,WAAU;eAAkB;MAAY;IAEhD,oBAAC,eAAY,WAAU,qGAAqG;;IACzG,EACrB,oBAAC,gCACC,qBAAC;GAAI,WAAU;;IACb,oBAAC;KAAI,WAAU;eACZ;MACG;IACL,mBACC,8CACE,oBAAC;KAAE,WAAW,GAAG,eAAe,CAAC;eAAE;MAAQ,EAC3C,oBAAC;KAAE,WAAU;eAAqB;MAAoB,IACrD;IAEJ,gBACC,8CACE,oBAAC;KAAE,WAAW,GAAG,eAAe,CAAC;eAAE;MAAW,EAC9C,oBAAC;KAAE,WAAU;eAAqB;MAAiB,IAClD;IAEJ,WAAW,SAAS,KACnB,8CACE,oBAAC;KAAE,WAAW,GAAG,eAAe,CAAC;eAAE;MAAc,EACjD,oBAAC;KAAI,WAAU;eACZ,WAAW,KAAK,UACf,qBAAC;MAAqB,WAAU;iBAC9B,qBAAC;OAAE,WAAU;kBAAqC,MAAM,MAAK;QAAM,EACnE,oBAAC;OAAI,WAAU;iBAAiC,MAAM;QAAkB;QAFhE,MAAM,KAGV,CACN;MACE,IACL;IAEJ,WACC,8CACE,oBAAC;KAAE,WAAW,GAAG,eAAe,CAAC;eAAE;MAAW,EAC9C,oBAAC;KAAI,WAAU;eAAyC;MAAc,IACrE;;IAED,GACa;GACT"}
+{"version":3,"file":"type-table.js","names":[],"sources":["../../src/components/type-table.tsx"],"sourcesContent":["'use client';\n\nimport { ChevronDown } from 'lucide-react';\nimport Link from 'fumadocs-core/link';\nimport { cva } from 'class-variance-authority';\nimport { cn } from '@/utils/cn';\nimport { type ComponentProps, type ReactNode, useEffect, useState } from 'react';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';\n\nexport interface ParameterNode {\n  name: string;\n  description: ReactNode;\n}\n\nexport interface TypeNode {\n  /**\n   * Additional description of the field\n   */\n  description?: ReactNode;\n\n  /**\n   * type signature (short)\n   */\n  type: ReactNode;\n\n  /**\n   * type signature (full)\n   */\n  typeDescription?: ReactNode;\n\n  /**\n   * Optional `href` for the type\n   */\n  typeDescriptionLink?: string;\n\n  default?: ReactNode;\n\n  required?: boolean;\n  deprecated?: boolean;\n\n  /**\n   * a list of parameters info if the type is a function.\n   */\n  parameters?: ParameterNode[];\n\n  returns?: ReactNode;\n}\n\nconst fieldVariants = cva('text-fd-muted-foreground not-prose pe-2');\n\nexport function TypeTable({\n  id,\n  type,\n  className,\n  ...props\n}: { type: Record<string, TypeNode> } & ComponentProps<'div'>) {\n  return (\n    <div\n      id={id}\n      className={cn(\n        '@container flex flex-col p-1 bg-fd-card text-fd-card-foreground rounded-2xl border my-6 text-sm overflow-hidden',\n        className,\n      )}\n      {...props}\n    >\n      <div className=\"flex font-medium items-center px-3 py-1 not-prose text-fd-muted-foreground\">\n        <p className=\"w-1/4\">Prop</p>\n        <p className=\"@max-xl:hidden\">Type</p>\n      </div>\n      {Object.entries(type).map(([key, value]) => (\n        <Item key={key} parentId={id} name={key} item={value} />\n      ))}\n    </div>\n  );\n}\n\nfunction Item({\n  parentId,\n  name,\n  item: {\n    parameters = [],\n    description,\n    required = false,\n    deprecated,\n    typeDescription,\n    default: defaultValue,\n    type,\n    typeDescriptionLink,\n    returns,\n  },\n}: {\n  parentId?: string;\n  name: string;\n  item: TypeNode;\n}) {\n  const [open, setOpen] = useState(false);\n  const id = parentId ? `${parentId}-${name}` : undefined;\n\n  useEffect(() => {\n    const hash = window.location.hash;\n    if (!id || !hash) return;\n    if (`#${id}` === hash) setOpen(true);\n  }, [id]);\n\n  return (\n    <Collapsible\n      id={id}\n      open={open}\n      onOpenChange={(v) => {\n        if (v && id) {\n          window.history.replaceState(null, '', `#${id}`);\n        }\n        setOpen(v);\n      }}\n      className={cn(\n        'rounded-xl border overflow-hidden scroll-m-20 transition-all',\n        open ? 'shadow-sm bg-fd-background not-last:mb-2' : 'border-transparent',\n      )}\n    >\n      <CollapsibleTrigger className=\"relative flex flex-row items-center w-full group text-start px-3 py-2 not-prose hover:bg-fd-accent\">\n        <code\n          className={cn(\n            'text-fd-primary min-w-fit w-1/4 font-mono font-medium pe-2',\n            deprecated && 'line-through text-fd-primary/50',\n          )}\n        >\n          {name}\n          {!required && '?'}\n        </code>\n        {typeDescriptionLink ? (\n          <Link href={typeDescriptionLink} className=\"underline @max-xl:hidden\">\n            {type}\n          </Link>\n        ) : (\n          <span className=\"@max-xl:hidden\">{type}</span>\n        )}\n        <ChevronDown className=\"absolute end-2 size-4 text-fd-muted-foreground transition-transform group-data-[open]:rotate-180\" />\n      </CollapsibleTrigger>\n      <CollapsibleContent>\n        <div className=\"grid grid-cols-[1fr_3fr] gap-y-4 text-sm p-3 overflow-auto fd-scroll-container border-t\">\n          <div className=\"text-sm prose col-span-full prose-no-margin empty:hidden\">\n            {description}\n          </div>\n          {typeDescription && (\n            <>\n              <p className={cn(fieldVariants())}>Type</p>\n              <p className=\"my-auto not-prose\">{typeDescription}</p>\n            </>\n          )}\n          {defaultValue && (\n            <>\n              <p className={cn(fieldVariants())}>Default</p>\n              <p className=\"my-auto not-prose\">{defaultValue}</p>\n            </>\n          )}\n          {parameters.length > 0 && (\n            <>\n              <p className={cn(fieldVariants())}>Parameters</p>\n              <div className=\"flex flex-col gap-2\">\n                {parameters.map((param) => (\n                  <div key={param.name} className=\"inline-flex items-center flex-wrap gap-1\">\n                    <p className=\"font-medium not-prose text-nowrap\">{param.name} -</p>\n                    <div className=\"text-sm prose prose-no-margin\">{param.description}</div>\n                  </div>\n                ))}\n              </div>\n            </>\n          )}\n          {returns && (\n            <>\n              <p className={cn(fieldVariants())}>Returns</p>\n              <div className=\"my-auto text-sm prose prose-no-margin\">{returns}</div>\n            </>\n          )}\n        </div>\n      </CollapsibleContent>\n    </Collapsible>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAgDA,MAAM,gBAAgB,IAAI,0CAA0C;AAEpE,SAAgB,UAAU,EACxB,IACA,MACA,WACA,GAAG,SAC0D;AAC7D,QACE,qBAAC;EACK;EACJ,WAAW,GACT,mHACA,UACD;EACD,GAAI;aAEJ,qBAAC;GAAI,WAAU;cACb,oBAAC;IAAE,WAAU;cAAQ;KAAQ,EAC7B,oBAAC;IAAE,WAAU;cAAiB;KAAQ;IAClC,EACL,OAAO,QAAQ,KAAK,CAAC,KAAK,CAAC,KAAK,WAC/B,oBAAC;GAAe,UAAU;GAAI,MAAM;GAAK,MAAM;KAApC,IAA6C,CACxD;GACE;;AAIV,SAAS,KAAK,EACZ,UACA,MACA,MAAM,EACJ,aAAa,EAAE,EACf,aACA,WAAW,OACX,YACA,iBACA,SAAS,cACT,MACA,qBACA,aAMD;CACD,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CACvC,MAAM,KAAK,WAAW,GAAG,SAAS,GAAG,SAAS;AAE9C,iBAAgB;EACd,MAAM,OAAO,OAAO,SAAS;AAC7B,MAAI,CAAC,MAAM,CAAC,KAAM;AAClB,MAAI,IAAI,SAAS,KAAM,SAAQ,KAAK;IACnC,CAAC,GAAG,CAAC;AAER,QACE,qBAAC;EACK;EACE;EACN,eAAe,MAAM;AACnB,OAAI,KAAK,GACP,QAAO,QAAQ,aAAa,MAAM,IAAI,IAAI,KAAK;AAEjD,WAAQ,EAAE;;EAEZ,WAAW,GACT,gEACA,OAAO,6CAA6C,qBACrD;aAED,qBAAC;GAAmB,WAAU;;IAC5B,qBAAC;KACC,WAAW,GACT,8DACA,cAAc,kCACf;gBAEA,MACA,CAAC,YAAY;MACT;IACN,sBACC,oBAAC;KAAK,MAAM;KAAqB,WAAU;eACxC;MACI,GAEP,oBAAC;KAAK,WAAU;eAAkB;MAAY;IAEhD,oBAAC,eAAY,WAAU,qGAAqG;;IACzG,EACrB,oBAAC,gCACC,qBAAC;GAAI,WAAU;;IACb,oBAAC;KAAI,WAAU;eACZ;MACG;IACL,mBACC,8CACE,oBAAC;KAAE,WAAW,GAAG,eAAe,CAAC;eAAE;MAAQ,EAC3C,oBAAC;KAAE,WAAU;eAAqB;MAAoB,IACrD;IAEJ,gBACC,8CACE,oBAAC;KAAE,WAAW,GAAG,eAAe,CAAC;eAAE;MAAW,EAC9C,oBAAC;KAAE,WAAU;eAAqB;MAAiB,IAClD;IAEJ,WAAW,SAAS,KACnB,8CACE,oBAAC;KAAE,WAAW,GAAG,eAAe,CAAC;eAAE;MAAc,EACjD,oBAAC;KAAI,WAAU;eACZ,WAAW,KAAK,UACf,qBAAC;MAAqB,WAAU;iBAC9B,qBAAC;OAAE,WAAU;kBAAqC,MAAM,MAAK;QAAM,EACnE,oBAAC;OAAI,WAAU;iBAAiC,MAAM;QAAkB;QAFhE,MAAM,KAGV,CACN;MACE,IACL;IAEJ,WACC,8CACE,oBAAC;KAAE,WAAW,GAAG,eAAe,CAAC;eAAE;MAAW,EAC9C,oBAAC;KAAI,WAAU;eAAyC;MAAc,IACrE;;IAED,GACa;GACT"}

package/dist/components/ui/navigation-menu.js

@@ -23,7 +23,7 @@ const NavigationMenuTrigger = React.forwardRef(({ children, ...props }, ref) =>
 NavigationMenuTrigger.displayName = NavigationMenu.Trigger.displayName;
 const NavigationMenuContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.Content, {
 	ref,
-	className: (s) => cn("size-full p-4", "transition-[opacity,transform,translate] duration-(--duration) ease-(--easing)", "data-[starting-style]:opacity-0 data-[ending-style]:opacity-0", "data-[starting-style]:data-[activation-direction=left]:-translate-x-1/2", "data-[starting-style]:data-[activation-direction=right]:translate-x-1/2", "data-[ending-style]:data-[activation-direction=left]:translate-x-1/2", "data-[ending-style]:data-[activation-direction=right]:-translate-x-1/2", typeof className === "function" ? className(s) : className),
+	className: (s) => cn("size-full p-4", "transition-[opacity,transform,translate] duration-(--duration) ease-(--easing)", "data-starting-style:opacity-0 data-ending-style:opacity-0", "data-starting-style:data-[activation-direction=left]:-translate-x-1/2", "data-starting-style:data-[activation-direction=right]:translate-x-1/2", "data-ending-style:data-[activation-direction=left]:translate-x-1/2", "data-ending-style:data-[activation-direction=right]:-translate-x-1/2", typeof className === "function" ? className(s) : className),
 	...props
 }));
 NavigationMenuContent.displayName = NavigationMenu.Content.displayName;

package/dist/components/ui/navigation-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu.js","names":["Primitive"],"sources":["../../../src/components/ui/navigation-menu.tsx"],"sourcesContent":["'use client';\nimport * as React from 'react';\nimport { NavigationMenu as Primitive } from '@base-ui/react/navigation-menu';\nimport { cn } from '@/utils/cn';\n\nexport type NavigationMenuContentProps = Primitive.Content.Props;\nexport type NavigationMenuTriggerProps = Primitive.Trigger.Props;\n\nconst NavigationMenuRoot = Primitive.Root;\n\nconst NavigationMenuList = Primitive.List;\n\nconst NavigationMenuItem = React.forwardRef<\n  React.ComponentRef<typeof Primitive.Item>,\n  React.ComponentPropsWithoutRef<typeof Primitive.Item>\n>(({ className, children, ...props }, ref) => (\n  <Primitive.Item\n    ref={ref}\n    className={(s) => cn('list-none', typeof className === 'function' ? className(s) : className)}\n    {...props}\n  >\n    {children}\n  </Primitive.Item>\n));\n\nNavigationMenuItem.displayName = Primitive.Item.displayName;\n\nconst NavigationMenuTrigger = React.forwardRef<\n  React.ComponentRef<typeof Primitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof Primitive.Trigger>\n>(({ children, ...props }, ref) => (\n  <Primitive.Trigger ref={ref} {...props}>\n    {children}\n  </Primitive.Trigger>\n));\nNavigationMenuTrigger.displayName = Primitive.Trigger.displayName;\n\nconst NavigationMenuContent = React.forwardRef<\n  React.ComponentRef<typeof Primitive.Content>,\n  React.ComponentPropsWithoutRef<typeof Primitive.Content>\n>(({ className, ...props }, ref) => (\n  <Primitive.Content\n    ref={ref}\n    className={(s) =>\n      cn(\n        'size-full p-4',\n        'transition-[opacity,transform,translate] duration-(--duration) ease-(--easing)',\n        'data-[starting-style]:opacity-0 data-[ending-style]:opacity-0',\n        'data-[starting-style]:data-[activation-direction=left]:-translate-x-1/2',\n        'data-[starting-style]:data-[activation-direction=right]:translate-x-1/2',\n        'data-[ending-style]:data-[activation-direction=left]:translate-x-1/2',\n        'data-[ending-style]:data-[activation-direction=right]:-translate-x-1/2',\n        typeof className === 'function' ? className(s) : className,\n      )\n    }\n    {...props}\n  />\n));\nNavigationMenuContent.displayName = Primitive.Content.displayName;\n\nconst NavigationMenuLink = Primitive.Link;\n\nexport {\n  NavigationMenuRoot,\n  NavigationMenuList,\n  NavigationMenuItem,\n  NavigationMenuContent,\n  NavigationMenuTrigger,\n  NavigationMenuLink,\n};\n"],"mappings":";;;;;;;;AAQA,MAAM,qBAAqBA,eAAU;AAErC,MAAM,qBAAqBA,eAAU;AAErC,MAAM,qBAAqB,MAAM,YAG9B,EAAE,WAAW,UAAU,GAAG,SAAS,QACpC,oBAACA,eAAU;CACJ;CACL,YAAY,MAAM,GAAG,aAAa,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAAU;CAC7F,GAAI;CAEH;EACc,CACjB;AAEF,mBAAmB,cAAcA,eAAU,KAAK;AAEhD,MAAM,wBAAwB,MAAM,YAGjC,EAAE,UAAU,GAAG,SAAS,QACzB,oBAACA,eAAU;CAAa;CAAK,GAAI;CAC9B;EACiB,CACpB;AACF,sBAAsB,cAAcA,eAAU,QAAQ;AAEtD,MAAM,wBAAwB,MAAM,YAGjC,EAAE,WAAW,GAAG,SAAS,QAC1B,oBAACA,eAAU;CACJ;CACL,YAAY,MACV,GACE,iBACA,kFACA,iEACA,2EACA,2EACA,wEACA,0EACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;CAEH,GAAI;EACJ,CACF;AACF,sBAAsB,cAAcA,eAAU,QAAQ;AAEtD,MAAM,qBAAqBA,eAAU"}
+{"version":3,"file":"navigation-menu.js","names":["Primitive"],"sources":["../../../src/components/ui/navigation-menu.tsx"],"sourcesContent":["'use client';\nimport * as React from 'react';\nimport { NavigationMenu as Primitive } from '@base-ui/react/navigation-menu';\nimport { cn } from '@/utils/cn';\n\nexport type NavigationMenuContentProps = Primitive.Content.Props;\nexport type NavigationMenuTriggerProps = Primitive.Trigger.Props;\n\nconst NavigationMenuRoot = Primitive.Root;\n\nconst NavigationMenuList = Primitive.List;\n\nconst NavigationMenuItem = React.forwardRef<\n  React.ComponentRef<typeof Primitive.Item>,\n  React.ComponentPropsWithoutRef<typeof Primitive.Item>\n>(({ className, children, ...props }, ref) => (\n  <Primitive.Item\n    ref={ref}\n    className={(s) => cn('list-none', typeof className === 'function' ? className(s) : className)}\n    {...props}\n  >\n    {children}\n  </Primitive.Item>\n));\n\nNavigationMenuItem.displayName = Primitive.Item.displayName;\n\nconst NavigationMenuTrigger = React.forwardRef<\n  React.ComponentRef<typeof Primitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof Primitive.Trigger>\n>(({ children, ...props }, ref) => (\n  <Primitive.Trigger ref={ref} {...props}>\n    {children}\n  </Primitive.Trigger>\n));\nNavigationMenuTrigger.displayName = Primitive.Trigger.displayName;\n\nconst NavigationMenuContent = React.forwardRef<\n  React.ComponentRef<typeof Primitive.Content>,\n  React.ComponentPropsWithoutRef<typeof Primitive.Content>\n>(({ className, ...props }, ref) => (\n  <Primitive.Content\n    ref={ref}\n    className={(s) =>\n      cn(\n        'size-full p-4',\n        'transition-[opacity,transform,translate] duration-(--duration) ease-(--easing)',\n        'data-starting-style:opacity-0 data-ending-style:opacity-0',\n        'data-starting-style:data-[activation-direction=left]:-translate-x-1/2',\n        'data-starting-style:data-[activation-direction=right]:translate-x-1/2',\n        'data-ending-style:data-[activation-direction=left]:translate-x-1/2',\n        'data-ending-style:data-[activation-direction=right]:-translate-x-1/2',\n        typeof className === 'function' ? className(s) : className,\n      )\n    }\n    {...props}\n  />\n));\nNavigationMenuContent.displayName = Primitive.Content.displayName;\n\nconst NavigationMenuLink = Primitive.Link;\n\nexport {\n  NavigationMenuRoot,\n  NavigationMenuList,\n  NavigationMenuItem,\n  NavigationMenuContent,\n  NavigationMenuTrigger,\n  NavigationMenuLink,\n};\n"],"mappings":";;;;;;;;AAQA,MAAM,qBAAqBA,eAAU;AAErC,MAAM,qBAAqBA,eAAU;AAErC,MAAM,qBAAqB,MAAM,YAG9B,EAAE,WAAW,UAAU,GAAG,SAAS,QACpC,oBAACA,eAAU;CACJ;CACL,YAAY,MAAM,GAAG,aAAa,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAAU;CAC7F,GAAI;CAEH;EACc,CACjB;AAEF,mBAAmB,cAAcA,eAAU,KAAK;AAEhD,MAAM,wBAAwB,MAAM,YAGjC,EAAE,UAAU,GAAG,SAAS,QACzB,oBAACA,eAAU;CAAa;CAAK,GAAI;CAC9B;EACiB,CACpB;AACF,sBAAsB,cAAcA,eAAU,QAAQ;AAEtD,MAAM,wBAAwB,MAAM,YAGjC,EAAE,WAAW,GAAG,SAAS,QAC1B,oBAACA,eAAU;CACJ;CACL,YAAY,MACV,GACE,iBACA,kFACA,6DACA,yEACA,yEACA,sEACA,wEACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;CAEH,GAAI;EACJ,CACF;AACF,sBAAsB,cAAcA,eAAU,QAAQ;AAEtD,MAAM,qBAAqBA,eAAU"}

package/dist/layouts/home/client.d.ts

@@ -4,7 +4,7 @@ import * as class_variance_authority_types0 from "class-variance-authority/types
 
 //#region src/layouts/home/client.d.ts
 declare const navItemVariants: (props?: ({
-  variant?: "main" | "icon" | "button" | null | undefined;
+  variant?: "button" | "main" | "icon" | null | undefined;
 } & class_variance_authority_types0.ClassProp) | undefined) => string;
 declare function Header({
   nav,

package/dist/layouts/home/client.js

@@ -42,12 +42,12 @@ function Header({ nav = {}, i18n = false, links, githubUrl, themeSwitch = {}, se
 		transparentMode: nav.transparentMode,
 		className: cn(s.open && "shadow-lg rounded-b-2xl"),
 		children: [
-			/* @__PURE__ */ jsxs(NavigationMenuList, {
+			/* @__PURE__ */ jsxs("div", {
 				className: "flex h-14 w-full items-center px-4",
 				children: [
 					renderTitleNav(nav, { className: "inline-flex items-center gap-2.5 font-semibold" }),
 					nav.children,
-					/* @__PURE__ */ jsx("ul", {
+					/* @__PURE__ */ jsx(NavigationMenuList, {
 						className: "flex flex-row items-center gap-2 px-6 max-sm:hidden",
 						children: navItems.filter((item) => !isSecondary(item)).map((item, i) => /* @__PURE__ */ jsx(NavigationMenuLinkItem, {
 							item,
@@ -63,7 +63,7 @@ function Header({ nav = {}, i18n = false, links, githubUrl, themeSwitch = {}, se
 							})),
 							themeSwitch.enabled !== false && (themeSwitch.component ?? /* @__PURE__ */ jsx(ThemeToggle, { mode: themeSwitch?.mode })),
 							i18n && /* @__PURE__ */ jsx(LanguageToggle, { children: /* @__PURE__ */ jsx(Languages, { className: "size-5" }) }),
-							/* @__PURE__ */ jsx("ul", {
+							/* @__PURE__ */ jsx(NavigationMenuList, {
 								className: "flex flex-row gap-2 items-center empty:hidden",
 								children: navItems.filter(isSecondary).map((item, i) => /* @__PURE__ */ jsx(NavigationMenuLinkItem, {
 									className: cn(item.type === "icon" && "-mx-1 first:ms-0 last:me-0"),
@@ -72,7 +72,7 @@ function Header({ nav = {}, i18n = false, links, githubUrl, themeSwitch = {}, se
 							})
 						]
 					}),
-					/* @__PURE__ */ jsxs("ul", {
+					/* @__PURE__ */ jsxs("div", {
 						className: "flex flex-row items-center ms-auto -me-1.5 lg:hidden",
 						children: [searchToggle.enabled !== false && (searchToggle.components?.sm ?? /* @__PURE__ */ jsx(SearchToggle, {
 							className: "p-2",
@@ -172,10 +172,7 @@ function HeaderRoot({ transparentMode = "none", children, className, ...props })
 	});
 }
 function NavigationMenuLinkItem({ item, ...props }) {
-	if (item.type === "custom") return /* @__PURE__ */ jsx("div", {
-		...props,
-		children: item.children
-	});
+	if (item.type === "custom") return item.children;
 	if (item.type === "menu") {
 		const children = item.items.map((child, j) => {
 			if (child.type === "custom") return /* @__PURE__ */ jsx(Fragment, { children: child.children }, j);

package/dist/layouts/home/client.js.map

@@ -1 +1 @@
-{"version":3,"file":"client.js","names":[],"sources":["../../../src/layouts/home/client.tsx"],"sourcesContent":["'use client';\nimport {\n  type ComponentProps,\n  createContext,\n  Fragment,\n  use,\n  useEffect,\n  useEffectEvent,\n  useMemo,\n  useState,\n} from 'react';\nimport { cva } from 'class-variance-authority';\nimport Link from 'fumadocs-core/link';\nimport { cn } from '@/utils/cn';\nimport { type LinkItemType, type NavOptions, renderTitleNav, useLinkItems } from '@/layouts/shared';\nimport { LinkItem } from '@/utils/link-item';\nimport {\n  NavigationMenuRoot,\n  NavigationMenuContent,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n} from '@/components/ui/navigation-menu';\nimport { buttonVariants } from '@/components/ui/button';\nimport type { HomeLayoutProps } from '.';\nimport { LargeSearchToggle, SearchToggle } from '@/layouts/shared/search-toggle';\nimport { ThemeToggle } from '@/layouts/shared/theme-toggle';\nimport { LanguageToggle, LanguageToggleText } from '@/layouts/shared/language-toggle';\nimport { ChevronDown, Languages } from 'lucide-react';\nimport { useIsScrollTop } from '@/utils/use-is-scroll-top';\nimport { NavigationMenu } from '@base-ui/react';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';\n\nconst MobileMenuContext = createContext<{\n  open: boolean;\n  setOpen: (open: boolean) => void;\n} | null>(null);\n\nexport const navItemVariants = cva('[&_svg]:size-4', {\n  variants: {\n    variant: {\n      main: 'inline-flex items-center gap-1 p-2 text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground data-[active=true]:text-fd-primary data-popup-open:text-fd-primary',\n      button: buttonVariants({\n        color: 'secondary',\n        className: 'gap-1.5',\n      }),\n      icon: buttonVariants({\n        color: 'ghost',\n        size: 'icon',\n      }),\n    },\n  },\n  defaultVariants: {\n    variant: 'main',\n  },\n});\n\nexport function Header({\n  nav = {},\n  i18n = false,\n  links,\n  githubUrl,\n  themeSwitch = {},\n  searchToggle = {},\n}: HomeLayoutProps) {\n  const { menuItems, navItems } = useLinkItems({ links, githubUrl });\n\n  return (\n    <MobileMenuCollapsible\n      render={(_, s) => (\n        <HeaderRoot\n          transparentMode={nav.transparentMode}\n          className={cn(s.open && 'shadow-lg rounded-b-2xl')}\n        >\n          <NavigationMenuList className=\"flex h-14 w-full items-center px-4\">\n            {renderTitleNav(nav, {\n              className: 'inline-flex items-center gap-2.5 font-semibold',\n            })}\n            {nav.children}\n            <ul className=\"flex flex-row items-center gap-2 px-6 max-sm:hidden\">\n              {navItems\n                .filter((item) => !isSecondary(item))\n                .map((item, i) => (\n                  <NavigationMenuLinkItem key={i} item={item} className=\"text-sm\" />\n                ))}\n            </ul>\n            <div className=\"flex flex-row items-center justify-end gap-1.5 flex-1 max-lg:hidden\">\n              {searchToggle.enabled !== false &&\n                (searchToggle.components?.lg ?? (\n                  <LargeSearchToggle\n                    className=\"w-full rounded-full ps-2.5 max-w-[240px]\"\n                    hideIfDisabled\n                  />\n                ))}\n              {themeSwitch.enabled !== false &&\n                (themeSwitch.component ?? <ThemeToggle mode={themeSwitch?.mode} />)}\n              {i18n && (\n                <LanguageToggle>\n                  <Languages className=\"size-5\" />\n                </LanguageToggle>\n              )}\n              <ul className=\"flex flex-row gap-2 items-center empty:hidden\">\n                {navItems.filter(isSecondary).map((item, i) => (\n                  <NavigationMenuLinkItem\n                    key={i}\n                    className={cn(item.type === 'icon' && '-mx-1 first:ms-0 last:me-0')}\n                    item={item}\n                  />\n                ))}\n              </ul>\n            </div>\n            <ul className=\"flex flex-row items-center ms-auto -me-1.5 lg:hidden\">\n              {searchToggle.enabled !== false &&\n                (searchToggle.components?.sm ?? <SearchToggle className=\"p-2\" hideIfDisabled />)}\n              <CollapsibleTrigger\n                aria-label=\"Toggle Menu\"\n                className={cn(\n                  buttonVariants({\n                    size: 'icon',\n                    color: 'ghost',\n                    className: 'group [&_svg]:size-5.5',\n                  }),\n                )}\n              >\n                <ChevronDown className=\"transition-transform duration-300 group-data-panel-open:rotate-180\" />\n              </CollapsibleTrigger>\n            </ul>\n          </NavigationMenuList>\n          <CollapsibleContent className=\"flex flex-col px-4\">\n            {menuItems\n              .filter((item) => !isSecondary(item))\n              .map((item, i) => (\n                <MobileMenuLinkItem key={i} item={item} className=\"first:mt-4 sm:hidden\" />\n              ))}\n            <div className=\"-ms-1.5 flex flex-row pt-2 pb-4 items-center justify-end gap-2\">\n              {menuItems.filter(isSecondary).map((item, i) => (\n                <MobileMenuLinkItem\n                  key={i}\n                  item={item}\n                  className={cn(item.type === 'icon' && '-mx-1 first:ms-0')}\n                />\n              ))}\n              <div role=\"separator\" className=\"flex-1 sm:hidden\" />\n              {i18n && (\n                <LanguageToggle>\n                  <Languages className=\"size-5\" />\n                  <LanguageToggleText />\n                  <ChevronDown className=\"size-3 text-fd-muted-foreground\" />\n                </LanguageToggle>\n              )}\n              {themeSwitch.enabled !== false &&\n                (themeSwitch.component ?? <ThemeToggle mode={themeSwitch?.mode} />)}\n            </div>\n          </CollapsibleContent>\n          <NavigationMenu.Portal>\n            <NavigationMenu.Positioner\n              sideOffset={10}\n              className=\"z-20 h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[left,right] duration-(--duration) ease-(--easing) data-instant:transition-none\"\n              style={{\n                ['--duration' as string]: '0.35s',\n                ['--easing' as string]: 'cubic-bezier(0.22, 1, 0.36, 1)',\n              }}\n            >\n              <NavigationMenu.Popup className=\"relative w-(--popup-width) h-(--popup-height) max-w-(--fd-layout-width,1400px) origin-(--transform-origin) rounded-xl bg-fd-background/80  border backdrop-blur-lg shadow-lg transition-[opacity,transform,width,height,scale,translate] duration-(--duration) ease-(--easing) data-ending-style:scale-90 data-ending-style:opacity-0 data-ending-style:duration-150 data-starting-style:scale-90 data-starting-style:opacity-0\">\n                <NavigationMenu.Viewport className=\"relative size-full overflow-hidden\" />\n              </NavigationMenu.Popup>\n            </NavigationMenu.Positioner>\n          </NavigationMenu.Portal>\n        </HeaderRoot>\n      )}\n    />\n  );\n}\n\nfunction MobileMenuCollapsible(props: ComponentProps<typeof Collapsible>) {\n  const [open, setOpen] = useState(false);\n\n  const onClick = useEffectEvent((e: Event) => {\n    if (!open) return;\n    const header = document.getElementById('nd-nav');\n    if (header && !header.contains(e.target as HTMLElement)) setOpen(false);\n  });\n\n  useEffect(() => {\n    window.addEventListener('click', onClick);\n\n    return () => {\n      window.removeEventListener('click', onClick);\n    };\n  }, []);\n\n  return (\n    <MobileMenuContext\n      value={useMemo(\n        () => ({\n          open,\n          setOpen,\n        }),\n        [open],\n      )}\n    >\n      <Collapsible open={open} onOpenChange={setOpen} {...props} />\n    </MobileMenuContext>\n  );\n}\n\nfunction isSecondary(item: LinkItemType): boolean {\n  if ('secondary' in item && item.secondary != null) return item.secondary;\n\n  return item.type === 'icon';\n}\n\nfunction HeaderRoot({\n  transparentMode = 'none',\n  children,\n  className,\n  ...props\n}: ComponentProps<'div'> & {\n  transparentMode?: NavOptions['transparentMode'];\n}) {\n  const isTop = useIsScrollTop({ enabled: transparentMode === 'top' }) ?? true;\n  const isTransparent = transparentMode === 'top' ? isTop : transparentMode === 'always';\n\n  return (\n    <header id=\"nd-nav\" className=\"sticky h-14 top-0 z-40\">\n      <NavigationMenuRoot\n        render={(_, s) => (\n          <nav\n            className={cn(\n              'w-full backdrop-blur-lg border-b transition-colors mx-auto max-w-(--fd-layout-width)',\n              (!isTransparent || s.open) && 'bg-fd-background/80',\n              className,\n            )}\n            {...props}\n          >\n            {children}\n          </nav>\n        )}\n      />\n    </header>\n  );\n}\n\nfunction NavigationMenuLinkItem({ item, ...props }: { item: LinkItemType; className?: string }) {\n  if (item.type === 'custom') return <div {...props}>{item.children}</div>;\n\n  if (item.type === 'menu') {\n    const children = item.items.map((child, j) => {\n      if (child.type === 'custom') {\n        return <Fragment key={j}>{child.children}</Fragment>;\n      }\n\n      const {\n        banner = child.icon ? (\n          <div className=\"w-fit rounded-md border bg-fd-muted p-1 [&_svg]:size-4\">{child.icon}</div>\n        ) : null,\n        ...rest\n      } = child.menu ?? {};\n\n      return (\n        <NavigationMenuLink\n          key={`${j}-${child.url}`}\n          render={\n            <Link\n              href={child.url}\n              external={child.external}\n              {...rest}\n              className={cn(\n                'flex flex-col gap-2 rounded-lg border bg-fd-card p-3 transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground',\n                rest.className,\n              )}\n            >\n              {rest.children ?? (\n                <>\n                  {banner}\n                  <p className=\"text-base font-medium\">{child.text}</p>\n                  <p className=\"text-sm text-fd-muted-foreground empty:hidden\">\n                    {child.description}\n                  </p>\n                </>\n              )}\n            </Link>\n          }\n        />\n      );\n    });\n\n    return (\n      <NavigationMenuItem {...props}>\n        <NavigationMenuTrigger className={cn(navItemVariants(), 'rounded-md')}>\n          {item.url ? (\n            <Link href={item.url} external={item.external}>\n              {item.text}\n            </Link>\n          ) : (\n            item.text\n          )}\n        </NavigationMenuTrigger>\n        <NavigationMenuContent className=\"grid grid-cols-1 gap-2 p-4 md:grid-cols-2 lg:grid-cols-3\">\n          {children}\n        </NavigationMenuContent>\n      </NavigationMenuItem>\n    );\n  }\n\n  return (\n    <NavigationMenuItem {...props}>\n      <NavigationMenuLink\n        render={\n          <LinkItem\n            item={item}\n            aria-label={item.type === 'icon' ? item.label : undefined}\n            className={cn(navItemVariants({ variant: item.type }))}\n          >\n            {item.type === 'icon' ? item.icon : item.text}\n          </LinkItem>\n        }\n      />\n    </NavigationMenuItem>\n  );\n}\n\nfunction MobileMenuLinkItem({ item, className }: { item: LinkItemType; className?: string }) {\n  if (item.type === 'custom') return <div className={cn('grid', className)}>{item.children}</div>;\n  const { setOpen } = use(MobileMenuContext)!;\n\n  if (item.type === 'menu') {\n    const header = (\n      <>\n        {item.icon}\n        {item.text}\n      </>\n    );\n\n    return (\n      <div className={cn('mb-4 flex flex-col', className)}>\n        <p className=\"mb-1 text-sm text-fd-muted-foreground\">\n          {item.url ? (\n            <Link href={item.url} external={item.external} onClick={() => setOpen(false)}>\n              {header}\n            </Link>\n          ) : (\n            header\n          )}\n        </p>\n        {item.items.map((child, i) => (\n          <MobileMenuLinkItem key={i} item={child} />\n        ))}\n      </div>\n    );\n  }\n\n  return (\n    <LinkItem\n      item={item}\n      className={cn(\n        (!item.type || item.type === 'main') &&\n          'inline-flex items-center gap-2 py-1.5 transition-colors hover:text-fd-popover-foreground/50 data-[active=true]:font-medium data-[active=true]:text-fd-primary [&_svg]:size-4',\n        item.type === 'icon' &&\n          buttonVariants({\n            size: 'icon',\n            color: 'ghost',\n          }),\n        item.type === 'button' &&\n          buttonVariants({\n            color: 'secondary',\n            className: 'gap-1.5 [&_svg]:size-4',\n          }),\n        className,\n      )}\n      aria-label={item.type === 'icon' ? item.label : undefined}\n      onClick={() => setOpen(false)}\n    >\n      {item.icon}\n      {item.type !== 'icon' && item.text}\n    </LinkItem>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"client.js","names":[],"sources":["../../../src/layouts/home/client.tsx"],"sourcesContent":["'use client';\nimport {\n  type ComponentProps,\n  createContext,\n  Fragment,\n  use,\n  useEffect,\n  useEffectEvent,\n  useMemo,\n  useState,\n} from 'react';\nimport { cva } from 'class-variance-authority';\nimport Link from 'fumadocs-core/link';\nimport { cn } from '@/utils/cn';\nimport { type LinkItemType, type NavOptions, renderTitleNav, useLinkItems } from '@/layouts/shared';\nimport { LinkItem } from '@/utils/link-item';\nimport {\n  NavigationMenuRoot,\n  NavigationMenuContent,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n} from '@/components/ui/navigation-menu';\nimport { buttonVariants } from '@/components/ui/button';\nimport type { HomeLayoutProps } from '.';\nimport { LargeSearchToggle, SearchToggle } from '@/layouts/shared/search-toggle';\nimport { ThemeToggle } from '@/layouts/shared/theme-toggle';\nimport { LanguageToggle, LanguageToggleText } from '@/layouts/shared/language-toggle';\nimport { ChevronDown, Languages } from 'lucide-react';\nimport { useIsScrollTop } from '@/utils/use-is-scroll-top';\nimport { NavigationMenu } from '@base-ui/react';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';\n\nconst MobileMenuContext = createContext<{\n  open: boolean;\n  setOpen: (open: boolean) => void;\n} | null>(null);\n\nexport const navItemVariants = cva('[&_svg]:size-4', {\n  variants: {\n    variant: {\n      main: 'inline-flex items-center gap-1 p-2 text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground data-[active=true]:text-fd-primary data-popup-open:text-fd-primary',\n      button: buttonVariants({\n        color: 'secondary',\n        className: 'gap-1.5',\n      }),\n      icon: buttonVariants({\n        color: 'ghost',\n        size: 'icon',\n      }),\n    },\n  },\n  defaultVariants: {\n    variant: 'main',\n  },\n});\n\nexport function Header({\n  nav = {},\n  i18n = false,\n  links,\n  githubUrl,\n  themeSwitch = {},\n  searchToggle = {},\n}: HomeLayoutProps) {\n  const { menuItems, navItems } = useLinkItems({ links, githubUrl });\n\n  return (\n    <MobileMenuCollapsible\n      render={(_, s) => (\n        <HeaderRoot\n          transparentMode={nav.transparentMode}\n          className={cn(s.open && 'shadow-lg rounded-b-2xl')}\n        >\n          <div className=\"flex h-14 w-full items-center px-4\">\n            {renderTitleNav(nav, {\n              className: 'inline-flex items-center gap-2.5 font-semibold',\n            })}\n            {nav.children}\n            <NavigationMenuList className=\"flex flex-row items-center gap-2 px-6 max-sm:hidden\">\n              {navItems\n                .filter((item) => !isSecondary(item))\n                .map((item, i) => (\n                  <NavigationMenuLinkItem key={i} item={item} className=\"text-sm\" />\n                ))}\n            </NavigationMenuList>\n            <div className=\"flex flex-row items-center justify-end gap-1.5 flex-1 max-lg:hidden\">\n              {searchToggle.enabled !== false &&\n                (searchToggle.components?.lg ?? (\n                  <LargeSearchToggle\n                    className=\"w-full rounded-full ps-2.5 max-w-[240px]\"\n                    hideIfDisabled\n                  />\n                ))}\n              {themeSwitch.enabled !== false &&\n                (themeSwitch.component ?? <ThemeToggle mode={themeSwitch?.mode} />)}\n              {i18n && (\n                <LanguageToggle>\n                  <Languages className=\"size-5\" />\n                </LanguageToggle>\n              )}\n              <NavigationMenuList className=\"flex flex-row gap-2 items-center empty:hidden\">\n                {navItems.filter(isSecondary).map((item, i) => (\n                  <NavigationMenuLinkItem\n                    key={i}\n                    className={cn(item.type === 'icon' && '-mx-1 first:ms-0 last:me-0')}\n                    item={item}\n                  />\n                ))}\n              </NavigationMenuList>\n            </div>\n            <div className=\"flex flex-row items-center ms-auto -me-1.5 lg:hidden\">\n              {searchToggle.enabled !== false &&\n                (searchToggle.components?.sm ?? <SearchToggle className=\"p-2\" hideIfDisabled />)}\n              <CollapsibleTrigger\n                aria-label=\"Toggle Menu\"\n                className={cn(\n                  buttonVariants({\n                    size: 'icon',\n                    color: 'ghost',\n                    className: 'group [&_svg]:size-5.5',\n                  }),\n                )}\n              >\n                <ChevronDown className=\"transition-transform duration-300 group-data-panel-open:rotate-180\" />\n              </CollapsibleTrigger>\n            </div>\n          </div>\n          <CollapsibleContent className=\"flex flex-col px-4\">\n            {menuItems\n              .filter((item) => !isSecondary(item))\n              .map((item, i) => (\n                <MobileMenuLinkItem key={i} item={item} className=\"first:mt-4 sm:hidden\" />\n              ))}\n            <div className=\"-ms-1.5 flex flex-row pt-2 pb-4 items-center justify-end gap-2\">\n              {menuItems.filter(isSecondary).map((item, i) => (\n                <MobileMenuLinkItem\n                  key={i}\n                  item={item}\n                  className={cn(item.type === 'icon' && '-mx-1 first:ms-0')}\n                />\n              ))}\n              <div role=\"separator\" className=\"flex-1 sm:hidden\" />\n              {i18n && (\n                <LanguageToggle>\n                  <Languages className=\"size-5\" />\n                  <LanguageToggleText />\n                  <ChevronDown className=\"size-3 text-fd-muted-foreground\" />\n                </LanguageToggle>\n              )}\n              {themeSwitch.enabled !== false &&\n                (themeSwitch.component ?? <ThemeToggle mode={themeSwitch?.mode} />)}\n            </div>\n          </CollapsibleContent>\n          <NavigationMenu.Portal>\n            <NavigationMenu.Positioner\n              sideOffset={10}\n              className=\"z-20 h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[left,right] duration-(--duration) ease-(--easing) data-instant:transition-none\"\n              style={{\n                ['--duration' as string]: '0.35s',\n                ['--easing' as string]: 'cubic-bezier(0.22, 1, 0.36, 1)',\n              }}\n            >\n              <NavigationMenu.Popup className=\"relative w-(--popup-width) h-(--popup-height) max-w-(--fd-layout-width,1400px) origin-(--transform-origin) rounded-xl bg-fd-background/80  border backdrop-blur-lg shadow-lg transition-[opacity,transform,width,height,scale,translate] duration-(--duration) ease-(--easing) data-ending-style:scale-90 data-ending-style:opacity-0 data-ending-style:duration-150 data-starting-style:scale-90 data-starting-style:opacity-0\">\n                <NavigationMenu.Viewport className=\"relative size-full overflow-hidden\" />\n              </NavigationMenu.Popup>\n            </NavigationMenu.Positioner>\n          </NavigationMenu.Portal>\n        </HeaderRoot>\n      )}\n    />\n  );\n}\n\nfunction MobileMenuCollapsible(props: ComponentProps<typeof Collapsible>) {\n  const [open, setOpen] = useState(false);\n\n  const onClick = useEffectEvent((e: Event) => {\n    if (!open) return;\n    const header = document.getElementById('nd-nav');\n    if (header && !header.contains(e.target as HTMLElement)) setOpen(false);\n  });\n\n  useEffect(() => {\n    window.addEventListener('click', onClick);\n\n    return () => {\n      window.removeEventListener('click', onClick);\n    };\n  }, []);\n\n  return (\n    <MobileMenuContext\n      value={useMemo(\n        () => ({\n          open,\n          setOpen,\n        }),\n        [open],\n      )}\n    >\n      <Collapsible open={open} onOpenChange={setOpen} {...props} />\n    </MobileMenuContext>\n  );\n}\n\nfunction isSecondary(item: LinkItemType): boolean {\n  if ('secondary' in item && item.secondary != null) return item.secondary;\n\n  return item.type === 'icon';\n}\n\nfunction HeaderRoot({\n  transparentMode = 'none',\n  children,\n  className,\n  ...props\n}: ComponentProps<'div'> & {\n  transparentMode?: NavOptions['transparentMode'];\n}) {\n  const isTop = useIsScrollTop({ enabled: transparentMode === 'top' }) ?? true;\n  const isTransparent = transparentMode === 'top' ? isTop : transparentMode === 'always';\n\n  return (\n    <header id=\"nd-nav\" className=\"sticky h-14 top-0 z-40\">\n      <NavigationMenuRoot\n        render={(_, s) => (\n          <nav\n            className={cn(\n              'w-full backdrop-blur-lg border-b transition-colors mx-auto max-w-(--fd-layout-width)',\n              (!isTransparent || s.open) && 'bg-fd-background/80',\n              className,\n            )}\n            {...props}\n          >\n            {children}\n          </nav>\n        )}\n      />\n    </header>\n  );\n}\n\nfunction NavigationMenuLinkItem({ item, ...props }: { item: LinkItemType; className?: string }) {\n  if (item.type === 'custom') return item.children;\n\n  if (item.type === 'menu') {\n    const children = item.items.map((child, j) => {\n      if (child.type === 'custom') {\n        return <Fragment key={j}>{child.children}</Fragment>;\n      }\n\n      const {\n        banner = child.icon ? (\n          <div className=\"w-fit rounded-md border bg-fd-muted p-1 [&_svg]:size-4\">{child.icon}</div>\n        ) : null,\n        ...rest\n      } = child.menu ?? {};\n\n      return (\n        <NavigationMenuLink\n          key={`${j}-${child.url}`}\n          render={\n            <Link\n              href={child.url}\n              external={child.external}\n              {...rest}\n              className={cn(\n                'flex flex-col gap-2 rounded-lg border bg-fd-card p-3 transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground',\n                rest.className,\n              )}\n            >\n              {rest.children ?? (\n                <>\n                  {banner}\n                  <p className=\"text-base font-medium\">{child.text}</p>\n                  <p className=\"text-sm text-fd-muted-foreground empty:hidden\">\n                    {child.description}\n                  </p>\n                </>\n              )}\n            </Link>\n          }\n        />\n      );\n    });\n\n    return (\n      <NavigationMenuItem {...props}>\n        <NavigationMenuTrigger className={cn(navItemVariants(), 'rounded-md')}>\n          {item.url ? (\n            <Link href={item.url} external={item.external}>\n              {item.text}\n            </Link>\n          ) : (\n            item.text\n          )}\n        </NavigationMenuTrigger>\n        <NavigationMenuContent className=\"grid grid-cols-1 gap-2 p-4 md:grid-cols-2 lg:grid-cols-3\">\n          {children}\n        </NavigationMenuContent>\n      </NavigationMenuItem>\n    );\n  }\n\n  return (\n    <NavigationMenuItem {...props}>\n      <NavigationMenuLink\n        render={\n          <LinkItem\n            item={item}\n            aria-label={item.type === 'icon' ? item.label : undefined}\n            className={cn(navItemVariants({ variant: item.type }))}\n          >\n            {item.type === 'icon' ? item.icon : item.text}\n          </LinkItem>\n        }\n      />\n    </NavigationMenuItem>\n  );\n}\n\nfunction MobileMenuLinkItem({ item, className }: { item: LinkItemType; className?: string }) {\n  if (item.type === 'custom') return <div className={cn('grid', className)}>{item.children}</div>;\n  const { setOpen } = use(MobileMenuContext)!;\n\n  if (item.type === 'menu') {\n    const header = (\n      <>\n        {item.icon}\n        {item.text}\n      </>\n    );\n\n    return (\n      <div className={cn('mb-4 flex flex-col', className)}>\n        <p className=\"mb-1 text-sm text-fd-muted-foreground\">\n          {item.url ? (\n            <Link href={item.url} external={item.external} onClick={() => setOpen(false)}>\n              {header}\n            </Link>\n          ) : (\n            header\n          )}\n        </p>\n        {item.items.map((child, i) => (\n          <MobileMenuLinkItem key={i} item={child} />\n        ))}\n      </div>\n    );\n  }\n\n  return (\n    <LinkItem\n      item={item}\n      className={cn(\n        (!item.type || item.type === 'main') &&\n          'inline-flex items-center gap-2 py-1.5 transition-colors hover:text-fd-popover-foreground/50 data-[active=true]:font-medium data-[active=true]:text-fd-primary [&_svg]:size-4',\n        item.type === 'icon' &&\n          buttonVariants({\n            size: 'icon',\n            color: 'ghost',\n          }),\n        item.type === 'button' &&\n          buttonVariants({\n            color: 'secondary',\n            className: 'gap-1.5 [&_svg]:size-4',\n          }),\n        className,\n      )}\n      aria-label={item.type === 'icon' ? item.label : undefined}\n      onClick={() => setOpen(false)}\n    >\n      {item.icon}\n      {item.type !== 'icon' && item.text}\n    </LinkItem>\n  );\n}\n"],"mappings":"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"}

package/dist/layouts/home/navbar.js

@@ -18,7 +18,7 @@ function NavbarMenuContent({ className, ...props }) {
 function NavbarMenuTrigger({ className, ...props }) {
 	return /* @__PURE__ */ jsx(NavigationMenuTrigger, {
 		...props,
-		className: (s) => cn(navItemVariants(), "rounded-md", typeof className === "function" ? className(s) : className),
+		className: (s) => cn(navItemVariants(), "text-sm rounded-md", typeof className === "function" ? className(s) : className),
 		children: props.children
 	});
 }

package/dist/layouts/home/navbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar.js","names":[],"sources":["../../../src/layouts/home/navbar.tsx"],"sourcesContent":["'use client';\nimport Link, { type LinkProps } from 'fumadocs-core/link';\nimport { cn } from '@/utils/cn';\nimport {\n  NavigationMenuContent,\n  type NavigationMenuContentProps,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuTrigger,\n  type NavigationMenuTriggerProps,\n} from '@/components/ui/navigation-menu';\nimport { navItemVariants } from './client';\n\nexport const NavbarMenu = NavigationMenuItem;\n\nexport function NavbarMenuContent({ className, ...props }: NavigationMenuContentProps) {\n  return (\n    <NavigationMenuContent\n      className={(s) =>\n        cn(\n          'grid grid-cols-1 gap-2 p-4 md:grid-cols-2 lg:grid-cols-3',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n      {...props}\n    >\n      {props.children}\n    </NavigationMenuContent>\n  );\n}\n\nexport function NavbarMenuTrigger({ className, ...props }: NavigationMenuTriggerProps) {\n  return (\n    <NavigationMenuTrigger\n      {...props}\n      className={(s) =>\n        cn(\n          navItemVariants(),\n          'rounded-md',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n    >\n      {props.children}\n    </NavigationMenuTrigger>\n  );\n}\n\nexport function NavbarMenuLink(props: LinkProps) {\n  return (\n    <NavigationMenuLink\n      render={\n        <Link\n          {...props}\n          className={cn(\n            'flex flex-col gap-2 rounded-lg border bg-fd-card p-3 transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground',\n            props.className,\n          )}\n        >\n          {props.children}\n        </Link>\n      }\n    />\n  );\n}\n"],"mappings":";;;;;;;;;AAaA,MAAa,aAAa;AAE1B,SAAgB,kBAAkB,EAAE,WAAW,GAAG,SAAqC;AACrF,QACE,oBAAC;EACC,YAAY,MACV,GACE,4DACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;EAEH,GAAI;YAEH,MAAM;GACe;;AAI5B,SAAgB,kBAAkB,EAAE,WAAW,GAAG,SAAqC;AACrF,QACE,oBAAC;EACC,GAAI;EACJ,YAAY,MACV,GACE,iBAAiB,EACjB,cACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;YAGF,MAAM;GACe;;AAI5B,SAAgB,eAAe,OAAkB;AAC/C,QACE,oBAAC,sBACC,QACE,oBAAC;EACC,GAAI;EACJ,WAAW,GACT,gIACA,MAAM,UACP;YAEA,MAAM;GACF,GAET"}
+{"version":3,"file":"navbar.js","names":[],"sources":["../../../src/layouts/home/navbar.tsx"],"sourcesContent":["'use client';\nimport Link, { type LinkProps } from 'fumadocs-core/link';\nimport { cn } from '@/utils/cn';\nimport {\n  NavigationMenuContent,\n  type NavigationMenuContentProps,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuTrigger,\n  type NavigationMenuTriggerProps,\n} from '@/components/ui/navigation-menu';\nimport { navItemVariants } from './client';\n\nexport const NavbarMenu = NavigationMenuItem;\n\nexport function NavbarMenuContent({ className, ...props }: NavigationMenuContentProps) {\n  return (\n    <NavigationMenuContent\n      className={(s) =>\n        cn(\n          'grid grid-cols-1 gap-2 p-4 md:grid-cols-2 lg:grid-cols-3',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n      {...props}\n    >\n      {props.children}\n    </NavigationMenuContent>\n  );\n}\n\nexport function NavbarMenuTrigger({ className, ...props }: NavigationMenuTriggerProps) {\n  return (\n    <NavigationMenuTrigger\n      {...props}\n      className={(s) =>\n        cn(\n          navItemVariants(),\n          'text-sm rounded-md',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n    >\n      {props.children}\n    </NavigationMenuTrigger>\n  );\n}\n\nexport function NavbarMenuLink(props: LinkProps) {\n  return (\n    <NavigationMenuLink\n      render={\n        <Link\n          {...props}\n          className={cn(\n            'flex flex-col gap-2 rounded-lg border bg-fd-card p-3 transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground',\n            props.className,\n          )}\n        >\n          {props.children}\n        </Link>\n      }\n    />\n  );\n}\n"],"mappings":";;;;;;;;;AAaA,MAAa,aAAa;AAE1B,SAAgB,kBAAkB,EAAE,WAAW,GAAG,SAAqC;AACrF,QACE,oBAAC;EACC,YAAY,MACV,GACE,4DACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;EAEH,GAAI;YAEH,MAAM;GACe;;AAI5B,SAAgB,kBAAkB,EAAE,WAAW,GAAG,SAAqC;AACrF,QACE,oBAAC;EACC,GAAI;EACJ,YAAY,MACV,GACE,iBAAiB,EACjB,sBACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;YAGF,MAAM;GACe;;AAI5B,SAAgB,eAAe,OAAkB;AAC/C,QACE,oBAAC,sBACC,QACE,oBAAC;EACC,GAAI;EACJ,WAAW,GACT,gIACA,MAAM,UACP;YAEA,MAAM;GACF,GAET"}

package/dist/layouts/notebook/client.d.ts

@@ -41,7 +41,7 @@ declare function NavbarLinkItem({
   ...props
 }: {
   item: LinkItemType;
-} & HTMLAttributes<HTMLElement>): string | number | bigint | boolean | react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+} & HTMLAttributes<HTMLElement>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime0.JSX.Element | null | undefined;
 //#endregion
 export { LayoutBody, LayoutContext, LayoutContextProvider, LayoutHeader, LayoutHeaderTabs, LayoutInfo, NavbarLinkItem };
 //# sourceMappingURL=client.d.ts.map

package/dist/layouts/notebook/client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"client.d.ts","names":[],"sources":["../../../src/layouts/notebook/client.tsx"],"mappings":";;;;;;;cAuBa,aAAA,EAAa,KAAA,CAAA,OAAA,EAAA,UAAA;;;UAOT,UAAA;EACf,OAAA;EACA,OAAA;AAAA;AAAA,iBAGc,qBAAA,CAAA;EACd,kBAAA;EACA,OAAA;EACA,OAAA;EACA;AAAA,GACC,UAAA;EACD,kBAAA;EACA,QAAA,EAAU,SAAA;AAAA,IACX,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAoBe,YAAA,CAAa,KAAA,EAAO,cAAA,aAAwB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAW5C,UAAA,CAAA;EAAa,SAAA;EAAW,KAAA;EAAO,QAAA;EAAA,GAAa;AAAA,GAAS,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAqC1E,gBAAA,CAAA;EACd,OAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,cAAA;EACD,OAAA,EAAS,mBAAA;AAAA,IACV,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAgCe,cAAA,CAAA;EACd,IAAA;EACA,SAAA;EAAA,GACG;AAAA;EACA,IAAA,EAAM,YAAA;AAAA,IAAiB,cAAA,CAAe,WAAA,yCAAY,kBAAA,CAAA,GAAA,CAAA,OAAA,GAAA,QAAA,CAAA,SAAA,IAAA,OAAA,sCAAA,KAAA,CAAA,WAAA,GAAA,KAAA,CAAA,YAAA,mBAAA,KAAA,CAAA,qBAAA,SAAA,QAAA,CAAA,SAAA"}
+{"version":3,"file":"client.d.ts","names":[],"sources":["../../../src/layouts/notebook/client.tsx"],"mappings":";;;;;;;cAuBa,aAAA,EAAa,KAAA,CAAA,OAAA,EAAA,UAAA;;;UAOT,UAAA;EACf,OAAA;EACA,OAAA;AAAA;AAAA,iBAGc,qBAAA,CAAA;EACd,kBAAA;EACA,OAAA;EACA,OAAA;EACA;AAAA,GACC,UAAA;EACD,kBAAA;EACA,QAAA,EAAU,SAAA;AAAA,IACX,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAoBe,YAAA,CAAa,KAAA,EAAO,cAAA,aAAwB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAW5C,UAAA,CAAA;EAAa,SAAA;EAAW,KAAA;EAAO,QAAA;EAAA,GAAa;AAAA,GAAS,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAqC1E,gBAAA,CAAA;EACd,OAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,cAAA;EACD,OAAA,EAAS,mBAAA;AAAA,IACV,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAgCe,cAAA,CAAA;EACd,IAAA;EACA,SAAA;EAAA,GACG;AAAA;EACA,IAAA,EAAM,YAAA;AAAA,IAAiB,cAAA,CAAe,WAAA,yCAAY,QAAA,CAAA,SAAA,IAAA,OAAA,sCAAA,KAAA,CAAA,WAAA,GAAA,KAAA,CAAA,YAAA,mBAAA,KAAA,CAAA,qBAAA,SAAA,QAAA,CAAA,SAAA,wBAAA,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/layouts/shared/index.d.ts

@@ -62,7 +62,7 @@ declare function resolveLinkItems({
 declare function renderTitleNav({
   title,
   url
-}: Partial<NavOptions>, props: ComponentProps<'a'>): string | number | bigint | boolean | react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+}: Partial<NavOptions>, props: ComponentProps<'a'>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime0.JSX.Element | null | undefined;
 declare function useLinkItems({
   githubUrl,
   links

package/dist/layouts/shared/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/layouts/shared/index.tsx"],"mappings":";;;;;;;UAKiB,UAAA;EACf,OAAA;EACA,SAAA,EAAW,SAAA;EAEX,KAAA,GAAQ,SAAA,KAAc,KAAA,EAAO,cAAA,UAAwB,SAAA;EAJtC;;;;EAUf,GAAA;EAN6B;;;;;EAa7B,eAAA;EAEA,QAAA,GAAW,SAAA;AAAA;AAAA,UAGI,eAAA;EACf,WAAA;IACE,OAAA;IACA,SAAA,GAAY,SAAA;IACZ,IAAA;EAAA;EAGF,YAAA,GAAe,OAAA;IACb,OAAA;IACA,UAAA,EAAY,OAAA;MACV,EAAA,EAAI,SAAA;MACJ,EAAA,EAAI,SAAA;IAAA;EAAA;;;;;;EASR,IAAA,aAAiB,UAAA;EAAA;;;EAKjB,SAAA;EAEA,KAAA,GAAQ,YAAA;EAMY;;;EAFpB,GAAA,GAAM,OAAA,CAAQ,UAAA;EAEd,QAAA,GAAW,SAAA;AAAA;;;;iBAMG,gBAAA,CAAA;EACd,KAAA;EACA;AAAA,GACC,IAAA,CAAK,eAAA,2BAA0C,YAAA;AAAA,iBAoBlC,cAAA,CAAA;EACZ,KAAA;EAAO;AAAA,GAAa,OAAA,CAAQ,UAAA,GAC9B,KAAA,EAAO,cAAA,6CAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA,GAAA,QAAA,CAAA,SAAA,IAAA,OAAA,sCAAA,KAAA,CAAA,WAAA,GAAA,KAAA,CAAA,YAAA,mBAAA,KAAA,CAAA,qBAAA,SAAA,QAAA,CAAA,SAAA;AAAA,iBAUZ,YAAA,CAAA;EAAe,SAAA;EAAW;AAAA,GAAS,IAAA,CAAK,eAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/layouts/shared/index.tsx"],"mappings":";;;;;;;UAKiB,UAAA;EACf,OAAA;EACA,SAAA,EAAW,SAAA;EAEX,KAAA,GAAQ,SAAA,KAAc,KAAA,EAAO,cAAA,UAAwB,SAAA;EAJtC;;;;EAUf,GAAA;EAN6B;;;;;EAa7B,eAAA;EAEA,QAAA,GAAW,SAAA;AAAA;AAAA,UAGI,eAAA;EACf,WAAA;IACE,OAAA;IACA,SAAA,GAAY,SAAA;IACZ,IAAA;EAAA;EAGF,YAAA,GAAe,OAAA;IACb,OAAA;IACA,UAAA,EAAY,OAAA;MACV,EAAA,EAAI,SAAA;MACJ,EAAA,EAAI,SAAA;IAAA;EAAA;;;;;;EASR,IAAA,aAAiB,UAAA;EAAA;;;EAKjB,SAAA;EAEA,KAAA,GAAQ,YAAA;EAMY;;;EAFpB,GAAA,GAAM,OAAA,CAAQ,UAAA;EAEd,QAAA,GAAW,SAAA;AAAA;;;;iBAMG,gBAAA,CAAA;EACd,KAAA;EACA;AAAA,GACC,IAAA,CAAK,eAAA,2BAA0C,YAAA;AAAA,iBAoBlC,cAAA,CAAA;EACZ,KAAA;EAAO;AAAA,GAAa,OAAA,CAAQ,UAAA,GAC9B,KAAA,EAAO,cAAA,6CAAmB,QAAA,CAAA,SAAA,IAAA,OAAA,sCAAA,KAAA,CAAA,WAAA,GAAA,KAAA,CAAA,YAAA,mBAAA,KAAA,CAAA,qBAAA,SAAA,QAAA,CAAA,SAAA,wBAAA,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAUZ,YAAA,CAAA;EAAe,SAAA;EAAW;AAAA,GAAS,IAAA,CAAK,eAAA"}

package/dist/style.css

@@ -1998,16 +1998,16 @@
       margin-bottom: calc(var(--spacing) * 2);
     }
   }
+  .group-data-active\:bg-fd-primary {
+    &:is(:where(.group)[data-active] *) {
+      background-color: var(--color-fd-primary);
+    }
+  }
   .group-data-panel-open\:rotate-180 {
     &:is(:where(.group)[data-panel-open] *) {
       rotate: 180deg;
     }
   }
-  .group-data-\[active\]\:bg-fd-primary {
-    &:is(:where(.group)[data-active] *) {
-      background-color: var(--color-fd-primary);
-    }
-  }
   .group-data-\[open\]\:rotate-180 {
     &:is(:where(.group)[data-open] *) {
       rotate: 180deg;
@@ -2325,6 +2325,38 @@
       opacity: 0%;
     }
   }
+  .data-ending-style\:data-\[activation-direction\=left\]\:translate-x-1\/2 {
+    &[data-ending-style] {
+      &[data-activation-direction="left"] {
+        --tw-translate-x: calc(1/2 * 100%);
+        translate: var(--tw-translate-x) var(--tw-translate-y);
+      }
+    }
+  }
+  .data-starting-style\:data-\[activation-direction\=left\]\:-translate-x-1\/2 {
+    &[data-starting-style] {
+      &[data-activation-direction="left"] {
+        --tw-translate-x: calc(calc(1/2 * 100%) * -1);
+        translate: var(--tw-translate-x) var(--tw-translate-y);
+      }
+    }
+  }
+  .data-ending-style\:data-\[activation-direction\=right\]\:-translate-x-1\/2 {
+    &[data-ending-style] {
+      &[data-activation-direction="right"] {
+        --tw-translate-x: calc(calc(1/2 * 100%) * -1);
+        translate: var(--tw-translate-x) var(--tw-translate-y);
+      }
+    }
+  }
+  .data-starting-style\:data-\[activation-direction\=right\]\:translate-x-1\/2 {
+    &[data-starting-style] {
+      &[data-activation-direction="right"] {
+        --tw-translate-x: calc(1/2 * 100%);
+        translate: var(--tw-translate-x) var(--tw-translate-y);
+      }
+    }
+  }
   .data-\[active\]\:border-fd-primary {
     &[data-active] {
       border-color: var(--color-fd-primary);
@@ -2436,27 +2468,6 @@
       height: calc(var(--spacing) * 0);
     }
   }
-  .data-\[ending-style\]\:opacity-0 {
-    &[data-ending-style] {
-      opacity: 0%;
-    }
-  }
-  .data-\[ending-style\]\:data-\[activation-direction\=left\]\:translate-x-1\/2 {
-    &[data-ending-style] {
-      &[data-activation-direction="left"] {
-        --tw-translate-x: calc(1/2 * 100%);
-        translate: var(--tw-translate-x) var(--tw-translate-y);
-      }
-    }
-  }
-  .data-\[ending-style\]\:data-\[activation-direction\=right\]\:-translate-x-1\/2 {
-    &[data-ending-style] {
-      &[data-activation-direction="right"] {
-        --tw-translate-x: calc(calc(1/2 * 100%) * -1);
-        translate: var(--tw-translate-x) var(--tw-translate-y);
-      }
-    }
-  }
   .data-\[inactive\]\:hidden {
     &[data-inactive] {
       display: none;
@@ -2472,27 +2483,6 @@
       height: calc(var(--spacing) * 0);
     }
   }
-  .data-\[starting-style\]\:opacity-0 {
-    &[data-starting-style] {
-      opacity: 0%;
-    }
-  }
-  .data-\[starting-style\]\:data-\[activation-direction\=left\]\:-translate-x-1\/2 {
-    &[data-starting-style] {
-      &[data-activation-direction="left"] {
-        --tw-translate-x: calc(calc(1/2 * 100%) * -1);
-        translate: var(--tw-translate-x) var(--tw-translate-y);
-      }
-    }
-  }
-  .data-\[starting-style\]\:data-\[activation-direction\=right\]\:translate-x-1\/2 {
-    &[data-starting-style] {
-      &[data-activation-direction="right"] {
-        --tw-translate-x: calc(1/2 * 100%);
-        translate: var(--tw-translate-x) var(--tw-translate-y);
-      }
-    }
-  }
   .data-\[state\=closed\]\:animate-fd-fade-out {
     &[data-state="closed"] {
       animation: var(--animate-fd-fade-out);
@@ -2867,37 +2857,31 @@
   --padding-right: calc(var(--spacing) * 4);
   code span {
     color: var(--shiki-light);
+    font-style: var(--shiki-light-font-style);
   }
-}
-.dark .shiki:not(.not-fumadocs-codeblock *) {
-  code span {
-    color: var(--shiki-dark);
-  }
-}
-:is(pre *):is(.shiki *):not(.not-fumadocs-codeblock *) {
-  .line& {
+  .line {
     position: relative;
     padding-left: var(--padding-left);
     padding-right: var(--padding-right);
   }
-  .line:empty& {
+  .line:empty {
     height: 1lh;
   }
-  .has-focused .line&:not(.focused) {
+  &.has-focused .line:not(.focused) {
     filter: blur(2px);
     transition: filter 200ms;
   }
-  .has-focused:hover .line&:not(.focused) {
+  &.has-focused:hover .line:not(.focused) {
     filter: blur(0);
   }
-  [data-line-numbers] .twoslash-meta-line& {
+  &[data-line-numbers] .twoslash-meta-line {
     padding-left: calc(var(--padding-left) + 7 * var(--spacing));
   }
-  [data-line-numbers] .line& {
+  &[data-line-numbers] .line {
     counter-increment: line;
     padding-left: calc(var(--padding-left) + 7 * var(--spacing));
   }
-  [data-line-numbers] .line&::after {
+  &[data-line-numbers] .line::after {
     position: absolute;
     content: counter(line);
     color: var(--fd-counter-color, hsl(0, 0%, 45.1%));
@@ -2907,28 +2891,28 @@
     top: calc(var(--spacing) * 0);
     left: calc(var(--spacing) * 4);
   }
-  .diff&::before {
+  .diff::before {
     position: absolute;
     left: calc(var(--spacing) * 1.5);
   }
-  .diff.remove& {
+  .diff.remove {
     opacity: 0.7;
     --fd-counter-color: var(--color-fd-diff-remove-symbol);
     background-color: var(--color-fd-diff-remove);
   }
-  .diff.remove&::before {
+  .diff.remove::before {
     content: '-';
     color: var(--color-fd-diff-remove-symbol);
   }
-  .diff.add& {
+  .diff.add {
     --fd-counter-color: var(--color-fd-diff-add-symbol);
     background-color: var(--color-fd-diff-add);
   }
-  .diff.add&::before {
+  .diff.add::before {
     content: '+';
     color: var(--color-fd-diff-add-symbol);
   }
-  .highlighted& {
+  .highlighted {
     --fd-counter-color: var(--color-fd-primary);
     padding-left: calc(var(--padding-left) - 2px);
     border-left-style: var(--tw-border-style);
@@ -2942,7 +2926,7 @@
       background-color: color-mix(in oklab, var(--color-fd-primary) 10%, transparent);
     }
   }
-  .highlighted-word& {
+  .highlighted-word {
     padding: 1px;
     margin-block: -1px;
     border-radius: var(--radius-md);
@@ -2960,6 +2944,12 @@
     font-weight: var(--font-weight-medium);
   }
 }
+.dark .shiki:not(.not-fumadocs-codeblock *) {
+  code span {
+    color: var(--shiki-dark);
+    font-style: var(--shiki-dark-font-style);
+  }
+}
 :root {
   --fd-sidebar-drawer-offset: 100%;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fumadocs/base-ui",
-  "version": "16.6.3",
+  "version": "16.6.4",
   "description": "The Base UI version of Fumadocs UI",
   "keywords": [
     "Docs",
@@ -118,7 +118,7 @@
     "unified": "^11.0.5",
     "@fumadocs/cli": "1.2.4",
     "eslint-config-custom": "0.0.0",
-    "fumadocs-core": "16.6.3",
+    "fumadocs-core": "16.6.4",
     "tsconfig": "0.0.0"
   },
   "peerDependencies": {
@@ -127,7 +127,7 @@
     "react": "^19.2.0",
     "react-dom": "^19.2.0",
     "tailwindcss": "^4.0.0",
-    "fumadocs-core": "16.6.3"
+    "fumadocs-core": "16.6.4"
   },
   "peerDependenciesMeta": {
     "next": {