@fumadocs/base-ui 16.5.0 → 16.5.2

package/dist/components/sidebar/tabs/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.js","names":["item","isActive"],"sources":["../../../../src/components/sidebar/tabs/dropdown.tsx"],"sourcesContent":["'use client';\nimport { Check, ChevronsUpDown } from 'lucide-react';\nimport { type ComponentProps, type ReactNode, useMemo, useState } from 'react';\nimport Link from 'fumadocs-core/link';\nimport { usePathname } from 'fumadocs-core/framework';\nimport { cn } from '@fumadocs/ui/cn';\nimport { normalize, isActive } from '@fumadocs/ui/urls';\nimport { useSidebar } from '@/components/sidebar/base';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\nimport type { SidebarTab } from '.';\n\nexport interface SidebarTabWithProps extends SidebarTab {\n  props?: ComponentProps<'a'>;\n}\n\nexport function SidebarTabsDropdown({\n  options,\n  placeholder,\n  ...props\n}: {\n  placeholder?: ReactNode;\n  options: SidebarTabWithProps[];\n} & ComponentProps<'button'>) {\n  const [open, setOpen] = useState(false);\n  const { closeOnRedirect } = useSidebar();\n  const pathname = usePathname();\n\n  const selected = useMemo(() => {\n    return options.findLast((item) => isTabActive(item, pathname));\n  }, [options, pathname]);\n\n  const onClick = () => {\n    closeOnRedirect.current = false;\n    setOpen(false);\n  };\n\n  const item = selected ? (\n    <>\n      <div className=\"size-9 shrink-0 empty:hidden md:size-5\">{selected.icon}</div>\n      <div>\n        <p className=\"text-sm font-medium\">{selected.title}</p>\n        <p className=\"text-sm text-fd-muted-foreground empty:hidden md:hidden\">\n          {selected.description}\n        </p>\n      </div>\n    </>\n  ) : (\n    placeholder\n  );\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      {item && (\n        <PopoverTrigger\n          {...props}\n          className={cn(\n            'flex items-center gap-2 rounded-lg p-2 border bg-fd-secondary/50 text-start text-fd-secondary-foreground transition-colors hover:bg-fd-accent data-[open]:bg-fd-accent data-[open]:text-fd-accent-foreground',\n            props.className,\n          )}\n        >\n          {item}\n          <ChevronsUpDown className=\"shrink-0 ms-auto size-4 text-fd-muted-foreground\" />\n        </PopoverTrigger>\n      )}\n      <PopoverContent className=\"flex flex-col gap-1 w-(--anchor-width) p-1 fd-scroll-container\">\n        {options.map((item) => {\n          const isActive = selected && item.url === selected.url;\n          if (!isActive && item.unlisted) return;\n\n          return (\n            <Link\n              key={item.url}\n              href={item.url}\n              onClick={onClick}\n              {...item.props}\n              className={cn(\n                'flex items-center gap-2 rounded-lg p-1.5 hover:bg-fd-accent hover:text-fd-accent-foreground',\n                item.props?.className,\n              )}\n            >\n              <div className=\"shrink-0 size-9 md:mb-auto md:size-5 empty:hidden\">{item.icon}</div>\n              <div>\n                <p className=\"text-sm font-medium leading-none\">{item.title}</p>\n                <p className=\"text-[0.8125rem] text-fd-muted-foreground mt-1 empty:hidden\">\n                  {item.description}\n                </p>\n              </div>\n\n              <Check\n                className={cn(\n                  'shrink-0 ms-auto size-3.5 text-fd-primary',\n                  !isActive && 'invisible',\n                )}\n              />\n            </Link>\n          );\n        })}\n      </PopoverContent>\n    </Popover>\n  );\n}\n\nexport function isTabActive(tab: SidebarTab, pathname: string) {\n  if (tab.urls) return tab.urls.has(normalize(pathname));\n\n  return isActive(tab.url, pathname, true);\n}\n"],"mappings":";;;;;;;;;;;;;AAeA,SAAgB,oBAAoB,EAClC,SACA,aACA,GAAG,SAIyB;CAC5B,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CACvC,MAAM,EAAE,oBAAoB,YAAY;CACxC,MAAM,WAAW,aAAa;CAE9B,MAAM,WAAW,cAAc;AAC7B,SAAO,QAAQ,UAAU,WAAS,YAAYA,QAAM,SAAS,CAAC;IAC7D,CAAC,SAAS,SAAS,CAAC;CAEvB,MAAM,gBAAgB;AACpB,kBAAgB,UAAU;AAC1B,UAAQ,MAAM;;CAGhB,MAAM,OAAO,WACX,4CACE,oBAAC;EAAI,WAAU;YAA0C,SAAS;GAAW,EAC7E,qBAAC,oBACC,oBAAC;EAAE,WAAU;YAAuB,SAAS;GAAU,EACvD,oBAAC;EAAE,WAAU;YACV,SAAS;GACR,IACA,IACL,GAEH;AAGF,QACE,qBAAC;EAAc;EAAM,cAAc;aAChC,QACC,qBAAC;GACC,GAAI;GACJ,WAAW,GACT,gNACA,MAAM,UACP;cAEA,MACD,oBAAC,kBAAe,WAAU,qDAAqD;IAChE,EAEnB,oBAAC;GAAe,WAAU;aACvB,QAAQ,KAAK,WAAS;IACrB,MAAMC,aAAW,YAAYD,OAAK,QAAQ,SAAS;AACnD,QAAI,CAACC,cAAYD,OAAK,SAAU;AAEhC,WACE,qBAAC;KAEC,MAAMA,OAAK;KACF;KACT,GAAIA,OAAK;KACT,WAAW,GACT,+FACAA,OAAK,OAAO,UACb;;MAED,oBAAC;OAAI,WAAU;iBAAqDA,OAAK;QAAW;MACpF,qBAAC,oBACC,oBAAC;OAAE,WAAU;iBAAoCA,OAAK;QAAU,EAChE,oBAAC;OAAE,WAAU;iBACVA,OAAK;QACJ,IACA;MAEN,oBAAC,SACC,WAAW,GACT,6CACA,CAACC,cAAY,YACd,GACD;;OAtBGD,OAAK,IAuBL;KAET;IACa;GACT;;AAId,SAAgB,YAAY,KAAiB,UAAkB;AAC7D,KAAI,IAAI,KAAM,QAAO,IAAI,KAAK,IAAI,UAAU,SAAS,CAAC;AAEtD,QAAO,SAAS,IAAI,KAAK,UAAU,KAAK"}
+{"version":3,"file":"dropdown.js","names":[],"sources":["../../../../src/components/sidebar/tabs/dropdown.tsx"],"sourcesContent":["'use client';\nimport { Check, ChevronsUpDown } from 'lucide-react';\nimport { type ComponentProps, type ReactNode, useMemo, useState } from 'react';\nimport Link from 'fumadocs-core/link';\nimport { usePathname } from 'fumadocs-core/framework';\nimport { cn } from '@/utils/cn';\nimport { normalize, isActive } from '@/utils/urls';\nimport { useSidebar } from '@/components/sidebar/base';\nimport { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';\nimport type { SidebarTab } from '.';\n\nexport interface SidebarTabWithProps extends SidebarTab {\n  props?: ComponentProps<'a'>;\n}\n\nexport function SidebarTabsDropdown({\n  options,\n  placeholder,\n  ...props\n}: {\n  placeholder?: ReactNode;\n  options: SidebarTabWithProps[];\n} & ComponentProps<'button'>) {\n  const [open, setOpen] = useState(false);\n  const { closeOnRedirect } = useSidebar();\n  const pathname = usePathname();\n\n  const selected = useMemo(() => {\n    return options.findLast((item) => isTabActive(item, pathname));\n  }, [options, pathname]);\n\n  const onClick = () => {\n    closeOnRedirect.current = false;\n    setOpen(false);\n  };\n\n  const item = selected ? (\n    <>\n      <div className=\"size-9 shrink-0 empty:hidden md:size-5\">{selected.icon}</div>\n      <div>\n        <p className=\"text-sm font-medium\">{selected.title}</p>\n        <p className=\"text-sm text-fd-muted-foreground empty:hidden md:hidden\">\n          {selected.description}\n        </p>\n      </div>\n    </>\n  ) : (\n    placeholder\n  );\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      {item && (\n        <PopoverTrigger\n          {...props}\n          className={cn(\n            'flex items-center gap-2 rounded-lg p-2 border bg-fd-secondary/50 text-start text-fd-secondary-foreground transition-colors hover:bg-fd-accent data-open:bg-fd-accent data-open:text-fd-accent-foreground',\n            props.className,\n          )}\n        >\n          {item}\n          <ChevronsUpDown className=\"shrink-0 ms-auto size-4 text-fd-muted-foreground\" />\n        </PopoverTrigger>\n      )}\n      <PopoverContent className=\"flex flex-col gap-1 w-(--anchor-width) p-1 fd-scroll-container\">\n        {options.map((item) => {\n          const isActive = selected && item.url === selected.url;\n          if (!isActive && item.unlisted) return;\n\n          return (\n            <Link\n              key={item.url}\n              href={item.url}\n              onClick={onClick}\n              {...item.props}\n              className={cn(\n                'flex items-center gap-2 rounded-lg p-1.5 hover:bg-fd-accent hover:text-fd-accent-foreground',\n                item.props?.className,\n              )}\n            >\n              <div className=\"shrink-0 size-9 md:mb-auto md:size-5 empty:hidden\">{item.icon}</div>\n              <div>\n                <p className=\"text-sm font-medium leading-none\">{item.title}</p>\n                <p className=\"text-[0.8125rem] text-fd-muted-foreground mt-1 empty:hidden\">\n                  {item.description}\n                </p>\n              </div>\n\n              <Check\n                className={cn(\n                  'shrink-0 ms-auto size-3.5 text-fd-primary',\n                  !isActive && 'invisible',\n                )}\n              />\n            </Link>\n          );\n        })}\n      </PopoverContent>\n    </Popover>\n  );\n}\n\nexport function isTabActive(tab: SidebarTab, pathname: string) {\n  if (tab.urls) return tab.urls.has(normalize(pathname));\n\n  return isActive(tab.url, pathname, true);\n}\n"],"mappings":";;;;;;;;;;;;;AAeA,SAAgB,oBAAoB,EAClC,SACA,aACA,GAAG,SAIyB;CAC5B,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CACvC,MAAM,EAAE,oBAAoB,YAAY;CACxC,MAAM,WAAW,aAAa;CAE9B,MAAM,WAAW,cAAc;AAC7B,SAAO,QAAQ,UAAU,SAAS,YAAY,MAAM,SAAS,CAAC;IAC7D,CAAC,SAAS,SAAS,CAAC;CAEvB,MAAM,gBAAgB;AACpB,kBAAgB,UAAU;AAC1B,UAAQ,MAAM;;CAGhB,MAAM,OAAO,WACX,8CACE,oBAAC;EAAI,WAAU;YAA0C,SAAS;GAAW,EAC7E,qBAAC,oBACC,oBAAC;EAAE,WAAU;YAAuB,SAAS;GAAU,EACvD,oBAAC;EAAE,WAAU;YACV,SAAS;GACR,IACA,IACL,GAEH;AAGF,QACE,qBAAC;EAAc;EAAM,cAAc;aAChC,QACC,qBAAC;GACC,GAAI;GACJ,WAAW,GACT,4MACA,MAAM,UACP;cAEA,MACD,oBAAC,kBAAe,WAAU,qDAAqD;IAChE,EAEnB,oBAAC;GAAe,WAAU;aACvB,QAAQ,KAAK,SAAS;IACrB,MAAM,WAAW,YAAY,KAAK,QAAQ,SAAS;AACnD,QAAI,CAAC,YAAY,KAAK,SAAU;AAEhC,WACE,qBAAC;KAEC,MAAM,KAAK;KACF;KACT,GAAI,KAAK;KACT,WAAW,GACT,+FACA,KAAK,OAAO,UACb;;MAED,oBAAC;OAAI,WAAU;iBAAqD,KAAK;QAAW;MACpF,qBAAC,oBACC,oBAAC;OAAE,WAAU;iBAAoC,KAAK;QAAU,EAChE,oBAAC;OAAE,WAAU;iBACV,KAAK;QACJ,IACA;MAEN,oBAAC,SACC,WAAW,GACT,6CACA,CAAC,YAAY,YACd,GACD;;OAtBG,KAAK,IAuBL;KAET;IACa;GACT;;AAId,SAAgB,YAAY,KAAiB,UAAkB;AAC7D,KAAI,IAAI,KAAM,QAAO,IAAI,KAAK,IAAI,UAAU,SAAS,CAAC;AAEtD,QAAO,SAAS,IAAI,KAAK,UAAU,KAAK"}

package/dist/components/sidebar/tabs/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/components/sidebar/tabs/index.tsx"],"sourcesContent":[],"mappings":";;;;UAGiB,UAAA;;AAAjB;;EAOS,GAAA,EAAA,MAAA;EACO,IAAA,CAAA,EAFP,SAEO;EAKP,KAAA,EANA,SAMA;EAAG,WAAA,CAAA,EALI,SAKJ;EAIK;;;EAC4C,IAAA,CAAA,EALpD,GAKoD,CAAA,MAAA,CAAA;EAAU,QAAA,CAAA,EAAA,OAAA;AAgBvE;AACQ,UAlBS,qBAAA,CAkBA;EACb,SAAA,CAAA,EAAA,CAAA,MAAA,EAlBmB,UAkBnB,EAAA,IAAA,EAlBqC,QAAA,CAAS,MAkB9C,EAAA,GAlByD,UAkBzD,GAAA,IAAA;;AACD,iBAHa,cAAA,CAGb,IAAA,EAFK,QAAA,CAAS,IAEd,EAAA;EAAA;AAAA,CAAA,CAAA,EADiC,qBACjC,CAAA,EAAA,UAAA,EAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/components/sidebar/tabs/index.tsx"],"mappings":";;;;UAGiB,UAAA;;AAAjB;;EAIE,GAAA;EAEA,IAAA,GAAO,SAAA;EACP,KAAA,EAAO,SAAA;EACP,WAAA,GAAc,SAAA;EAKP;;;EAAP,IAAA,GAAO,GAAA;EACP,QAAA;AAAA;AAAA,UAGe,qBAAA;EACf,SAAA,IAAa,MAAA,EAAQ,UAAA,EAAY,IAAA,EAAM,QAAA,CAAS,MAAA,KAAW,UAAA;AAAA;AAAA,iBAgB7C,cAAA,CACd,IAAA,EAAM,QAAA,CAAS,IAAA;EACb;AAAA,IAAgC,qBAAA,GACjC,UAAA"}

package/dist/components/steps.d.ts

@@ -1,17 +1,17 @@
-import * as react_jsx_runtime16 from "react/jsx-runtime";
 import { ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/steps.d.ts
 declare function Steps({
   children
 }: {
   children: ReactNode;
-}): react_jsx_runtime16.JSX.Element;
+}): react_jsx_runtime0.JSX.Element;
 declare function Step({
   children
 }: {
   children: ReactNode;
-}): react_jsx_runtime16.JSX.Element;
+}): react_jsx_runtime0.JSX.Element;
 //#endregion
 export { Step, Steps };
 //# sourceMappingURL=steps.d.ts.map

package/dist/components/steps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"steps.d.ts","names":[],"sources":["../../src/components/steps.tsx"],"sourcesContent":[],"mappings":";;;;iBAEgB,KAAA;;;YAAgC;IAAW,mBAAA,CAAA,GAAA,CAAA;AAA3C,iBAIA,IAAA,CAJK;EAAA;CAAA,EAAA;EAAG,QAAA,EAIuB,SAJvB;CAAwB,CAAA,EAIU,mBAAA,CAAA,GAAA,CAAA,OAJV"}
+{"version":3,"file":"steps.d.ts","names":[],"sources":["../../src/components/steps.tsx"],"mappings":";;;;iBAEgB,KAAA,CAAA;EAAQ;AAAA;EAAc,QAAA,EAAU,SAAA;AAAA,IAAW,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAI3C,IAAA,CAAA;EAAO;AAAA;EAAc,QAAA,EAAU,SAAA;AAAA,IAAW,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/tabs.d.ts

@@ -1,7 +1,7 @@
 import { Tabs as Tabs$1, TabsContent as TabsContent$1 } from "./ui/tabs.js";
-import * as react_jsx_runtime30 from "react/jsx-runtime";
 import * as React from "react";
 import { ComponentProps, ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import * as _base_ui_react0 from "@base-ui/react";
 
 //#region src/components/tabs.d.ts
@@ -31,7 +31,7 @@ declare function Tabs({
   defaultIndex,
   defaultValue,
   ...props
-}: TabsProps): react_jsx_runtime30.JSX.Element;
+}: TabsProps): react_jsx_runtime0.JSX.Element;
 interface TabProps extends Omit<ComponentProps<typeof TabsContent$1>, 'value'> {
   /**
    * Value of tab, detect from index if unspecified.
@@ -41,12 +41,12 @@ interface TabProps extends Omit<ComponentProps<typeof TabsContent$1>, 'value'> {
 declare function Tab({
   value,
   ...props
-}: TabProps): react_jsx_runtime30.JSX.Element;
+}: TabProps): react_jsx_runtime0.JSX.Element;
 declare function TabsContent({
   value,
   className,
   ...props
-}: ComponentProps<typeof TabsContent$1>): react_jsx_runtime30.JSX.Element;
+}: ComponentProps<typeof TabsContent$1>): react_jsx_runtime0.JSX.Element;
 //#endregion
 export { Tab, TabProps, Tabs, TabsContent, TabsList, TabsProps, TabsTrigger };
 //# sourceMappingURL=tabs.d.ts.map

package/dist/components/tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.d.ts","names":[],"sources":["../../src/components/tabs.tsx"],"sourcesContent":[],"mappings":";;;;;;;UAkBiB,SAAA,SAAkB,KACjC,sBAAsB;;;;EADP,KAAA,CAAA,EAAA,MAAU,EAAA;EACH;;;;;EAgCX,YAcX,CAAA,EAAA,MAAA;EAAA;;;EAdmB,KAAA,CAAA,EAdX,SAcW;;AAAA,cAAR,QAAQ,EAAA,KAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,IAAA,CAcnB,eAAA,CAdmB,aAAA,EAAA,KAAA,CAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA,CAAA,EAAA,KAAA,CAAA,GAAA,KAAA,CAAA,aAAA,CAAA,cAAA,CAAA,CAAA;AAAA,cAiBR,WAjBQ,EAiBG,KAAA,CAAA,yBAjBH,CAiBG,IAjBH,CAiBG,IAjBH,CA+BnB,eAAA,CAdsB,YAAA,EAjBH,KAAA,CAAA,GAiBG,KAAA,CAAA,aAjBH,CAiBG,WAjBH,CAAA,EAAA,KAAA,CAAA,GAiBG,KAAA,CAAA,aAjBH,CAiBG,WAjBH,CAAA,CAAA;AAAA,iBAkCL,IAAA,CAlCK;EAAA,GAAA;EAAA,SAAA;EAAA,KAAA;EAAA,KAAA;EAAA,YAAA;EAAA,YAAA;EAAA,GAAA;AAAA,CAAA,EA0ClB,SA1CkB,CAAA,EA0CT,mBAAA,CAAA,GAAA,CAAA,OA1CS;AAAA,UA+EJ,QAAA,SAAiB,IA/Eb,CA+EkB,cA/ElB,CAAA,OA+EwC,aA/ExC,CAAA,EAAA,OAAA,CAAA,CAAA;EAiBR;;;EAAW,KAAA,CAAA,EAAA,MAAA;;AAAA,iBAqER,GAAA,CArEQ;EAAA,KAAA;EAAA,GAAA;AAAA,CAAA,EAqEiB,QArEjB,CAAA,EAqEyB,mBAAA,CAAA,GAAA,CAAA,OArEzB;AAAA,iBAuFR,WAAA,CAvFQ;EAAA,KAAA;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA2FrB,cA3FqB,CAAA,OA2FC,aA3FD,CAAA,CAAA,EA2FsB,mBAAA,CAAA,GAAA,CAAA,OA3FtB"}
+{"version":3,"file":"tabs.d.ts","names":[],"sources":["../../src/components/tabs.tsx"],"mappings":";;;;;;;UAkBiB,SAAA,SAAkB,IAAA,CACjC,cAAA,QAAsB,MAAA;;;;EAMtB,KAAA;EAPyB;;;;;EAczB,YAAA;EAdqC;;;EAmBrC,KAAA,GAAQ,SAAA;AAAA;AAAA,cAcG,QAAA,EAAQ,KAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,IAAA,CAcnB,eAAA,CAdmB,aAAA,WAAA,KAAA,CAAA,aAAA,CAAA,cAAA,YAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,cAiBR,WAAA,EAAW,KAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,IAAA,CActB,eAAA,CAdsB,YAAA,WAAA,KAAA,CAAA,aAAA,CAAA,WAAA,YAAA,KAAA,CAAA,aAAA,CAAA,WAAA;AAAA,iBAiBR,IAAA,CAAA;EACd,GAAA;EACA,SAAA;EACA,KAAA;EACA,KAAA;EACA,YAAA;EACA,YAAA;EAAA,GACG;AAAA,GACF,SAAA,GAAS,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,UAqCK,QAAA,SAAiB,IAAA,CAAK,cAAA,QAAsB,aAAA;EA7FnD;;;EAiGR,KAAA;AAAA;AAAA,iBAGc,GAAA,CAAA;EAAM,KAAA;EAAA,GAAU;AAAA,GAAS,QAAA,GAAQ,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAkBjC,WAAA,CAAA;EACd,KAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,cAAA,QAAsB,aAAA,IAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/tabs.js

@@ -1,10 +1,10 @@
 'use client';
 
+import { cn } from "../utils/cn.js";
 import { Tabs as Tabs$1, TabsContent as TabsContent$1, TabsList as TabsList$1, TabsTrigger as TabsTrigger$1 } from "./ui/tabs.js";
-import { cn } from "@fumadocs/ui/cn";
-import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { createContext, useContext, useEffect, useId, useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/tabs.tsx
 const TabsContext = createContext(null);

package/dist/components/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","names":["Unstyled.TabsList","Unstyled.TabsTrigger","Unstyled.Tabs","Unstyled.TabsContent"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n  type ComponentProps,\n  createContext,\n  type ReactNode,\n  useContext,\n  useEffect,\n  useId,\n  useMemo,\n  useState,\n} from 'react';\nimport { cn } from '@fumadocs/ui/cn';\nimport * as Unstyled from './ui/tabs';\n\ntype CollectionKey = string | symbol;\n\nexport interface TabsProps extends Omit<\n  ComponentProps<typeof Unstyled.Tabs>,\n  'value' | 'onValueChange'\n> {\n  /**\n   * Use simple mode instead of advanced usage as documented in https://radix-ui.com/primitives/docs/components/tabs.\n   */\n  items?: string[];\n\n  /**\n   * Shortcut for `defaultValue` when `items` is provided.\n   *\n   * @defaultValue 0\n   */\n  defaultIndex?: number;\n\n  /**\n   * Additional label in tabs list when `items` is provided.\n   */\n  label?: ReactNode;\n}\n\nconst TabsContext = createContext<{\n  items?: string[];\n  collection: CollectionKey[];\n} | null>(null);\n\nfunction useTabContext() {\n  const ctx = useContext(TabsContext);\n  if (!ctx) throw new Error('You must wrap your component in <Tabs>');\n  return ctx;\n}\n\nexport const TabsList = React.forwardRef<\n  React.ComponentRef<typeof Unstyled.TabsList>,\n  React.ComponentPropsWithoutRef<typeof Unstyled.TabsList>\n>(({ className, ...props }, ref) => (\n  <Unstyled.TabsList\n    ref={ref}\n    {...props}\n    className={(s) =>\n      cn(\n        'flex gap-3.5 text-fd-secondary-foreground overflow-x-auto px-4 not-prose',\n        typeof className === 'function' ? className(s) : className,\n      )\n    }\n  />\n));\nTabsList.displayName = 'TabsList';\n\nexport const TabsTrigger = React.forwardRef<\n  React.ComponentRef<typeof Unstyled.TabsTrigger>,\n  React.ComponentPropsWithoutRef<typeof Unstyled.TabsTrigger>\n>(({ className, ...props }, ref) => (\n  <Unstyled.TabsTrigger\n    ref={ref}\n    {...props}\n    className={(s) =>\n      cn(\n        'inline-flex items-center gap-2 whitespace-nowrap text-fd-muted-foreground border-b border-transparent py-2 text-sm font-medium transition-colors [&_svg]:size-4 hover:text-fd-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[active]:border-fd-primary data-[active]:text-fd-primary',\n        typeof className === 'function' ? className(s) : className,\n      )\n    }\n  />\n));\nTabsTrigger.displayName = 'TabsTrigger';\n\nexport function Tabs({\n  ref,\n  className,\n  items,\n  label,\n  defaultIndex = 0,\n  defaultValue = items ? escapeValue(items[defaultIndex]) : undefined,\n  ...props\n}: TabsProps) {\n  const [value, setValue] = useState(defaultValue);\n  const collection = useMemo<CollectionKey[]>(() => [], []);\n\n  return (\n    <Unstyled.Tabs\n      ref={ref}\n      className={(s) =>\n        cn(\n          'flex flex-col overflow-hidden rounded-xl border bg-fd-secondary my-4',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n      value={value}\n      onValueChange={(v: string) => {\n        if (items && !items.some((item) => escapeValue(item) === v)) return;\n        setValue(v);\n      }}\n      {...props}\n    >\n      {items && (\n        <TabsList>\n          {label && <span className=\"text-sm font-medium my-auto me-auto\">{label}</span>}\n          {items.map((item) => (\n            <TabsTrigger key={item} value={escapeValue(item)}>\n              {item}\n            </TabsTrigger>\n          ))}\n        </TabsList>\n      )}\n      <TabsContext.Provider value={useMemo(() => ({ items, collection }), [collection, items])}>\n        {props.children}\n      </TabsContext.Provider>\n    </Unstyled.Tabs>\n  );\n}\n\nexport interface TabProps extends Omit<ComponentProps<typeof Unstyled.TabsContent>, 'value'> {\n  /**\n   * Value of tab, detect from index if unspecified.\n   */\n  value?: string;\n}\n\nexport function Tab({ value, ...props }: TabProps) {\n  const { items } = useTabContext();\n  const resolved =\n    value ??\n    // eslint-disable-next-line react-hooks/rules-of-hooks -- `value` is not supposed to change\n    items?.at(useCollectionIndex());\n  if (!resolved)\n    throw new Error(\n      'Failed to resolve tab `value`, please pass a `value` prop to the Tab component.',\n    );\n\n  return (\n    <TabsContent value={escapeValue(resolved)} {...props}>\n      {props.children}\n    </TabsContent>\n  );\n}\n\nexport function TabsContent({\n  value,\n  className,\n  ...props\n}: ComponentProps<typeof Unstyled.TabsContent>) {\n  return (\n    <Unstyled.TabsContent\n      value={value}\n      keepMounted\n      className={(s) =>\n        cn(\n          'p-4 text-[0.9375rem] bg-fd-background rounded-xl outline-none prose-no-margin data-[inactive]:hidden [&>figure:only-child]:-m-4 [&>figure:only-child]:border-none',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n      {...props}\n    >\n      {props.children}\n    </Unstyled.TabsContent>\n  );\n}\n\n/**\n * Inspired by Headless UI.\n *\n * Return the index of children, this is made possible by registering the order of render from children using React context.\n * This is supposed by work with pre-rendering & pure client-side rendering.\n */\nfunction useCollectionIndex() {\n  const key = useId();\n  const { collection } = useTabContext();\n\n  useEffect(() => {\n    return () => {\n      const idx = collection.indexOf(key);\n      if (idx !== -1) collection.splice(idx, 1);\n    };\n  }, [key, collection]);\n\n  if (!collection.includes(key)) collection.push(key);\n  return collection.indexOf(key);\n}\n\n/**\n * only escape whitespaces in values in simple mode\n */\nfunction escapeValue(v: string): string {\n  return v.toLowerCase().replace(/\\s/, '-');\n}\n"],"mappings":";;;;;;;;;AAwCA,MAAM,cAAc,cAGV,KAAK;AAEf,SAAS,gBAAgB;CACvB,MAAM,MAAM,WAAW,YAAY;AACnC,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,yCAAyC;AACnE,QAAO;;AAGT,MAAa,WAAW,MAAM,YAG3B,EAAE,WAAW,GAAG,SAAS,QAC1B,oBAACA;CACM;CACL,GAAI;CACJ,YAAY,MACV,GACE,4EACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;EAEH,CACF;AACF,SAAS,cAAc;AAEvB,MAAa,cAAc,MAAM,YAG9B,EAAE,WAAW,GAAG,SAAS,QAC1B,oBAACC;CACM;CACL,GAAI;CACJ,YAAY,MACV,GACE,kTACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;EAEH,CACF;AACF,YAAY,cAAc;AAE1B,SAAgB,KAAK,EACnB,KACA,WACA,OACA,OACA,eAAe,GACf,eAAe,QAAQ,YAAY,MAAM,cAAc,GAAG,QAC1D,GAAG,SACS;CACZ,MAAM,CAAC,OAAO,YAAY,SAAS,aAAa;CAChD,MAAM,aAAa,cAA+B,EAAE,EAAE,EAAE,CAAC;AAEzD,QACE,qBAACC;EACM;EACL,YAAY,MACV,GACE,wEACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;EAEI;EACP,gBAAgB,MAAc;AAC5B,OAAI,SAAS,CAAC,MAAM,MAAM,SAAS,YAAY,KAAK,KAAK,EAAE,CAAE;AAC7D,YAAS,EAAE;;EAEb,GAAI;aAEH,SACC,qBAAC,uBACE,SAAS,oBAAC;GAAK,WAAU;aAAuC;IAAa,EAC7E,MAAM,KAAK,SACV,oBAAC;GAAuB,OAAO,YAAY,KAAK;aAC7C;KADe,KAEJ,CACd,IACO,EAEb,oBAAC,YAAY;GAAS,OAAO,eAAe;IAAE;IAAO;IAAY,GAAG,CAAC,YAAY,MAAM,CAAC;aACrF,MAAM;IACc;GACT;;AAWpB,SAAgB,IAAI,EAAE,OAAO,GAAG,SAAmB;CACjD,MAAM,EAAE,UAAU,eAAe;CACjC,MAAM,WACJ,SAEA,OAAO,GAAG,oBAAoB,CAAC;AACjC,KAAI,CAAC,SACH,OAAM,IAAI,MACR,kFACD;AAEH,QACE,oBAAC;EAAY,OAAO,YAAY,SAAS;EAAE,GAAI;YAC5C,MAAM;GACK;;AAIlB,SAAgB,YAAY,EAC1B,OACA,WACA,GAAG,SAC2C;AAC9C,QACE,oBAACC;EACQ;EACP;EACA,YAAY,MACV,GACE,qKACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;EAEH,GAAI;YAEH,MAAM;GACc;;;;;;;;AAU3B,SAAS,qBAAqB;CAC5B,MAAM,MAAM,OAAO;CACnB,MAAM,EAAE,eAAe,eAAe;AAEtC,iBAAgB;AACd,eAAa;GACX,MAAM,MAAM,WAAW,QAAQ,IAAI;AACnC,OAAI,QAAQ,GAAI,YAAW,OAAO,KAAK,EAAE;;IAE1C,CAAC,KAAK,WAAW,CAAC;AAErB,KAAI,CAAC,WAAW,SAAS,IAAI,CAAE,YAAW,KAAK,IAAI;AACnD,QAAO,WAAW,QAAQ,IAAI;;;;;AAMhC,SAAS,YAAY,GAAmB;AACtC,QAAO,EAAE,aAAa,CAAC,QAAQ,MAAM,IAAI"}
+{"version":3,"file":"tabs.js","names":["Unstyled.TabsList","Unstyled.TabsTrigger","Unstyled.Tabs","Unstyled.TabsContent"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n  type ComponentProps,\n  createContext,\n  type ReactNode,\n  useContext,\n  useEffect,\n  useId,\n  useMemo,\n  useState,\n} from 'react';\nimport { cn } from '@/utils/cn';\nimport * as Unstyled from './ui/tabs';\n\ntype CollectionKey = string | symbol;\n\nexport interface TabsProps extends Omit<\n  ComponentProps<typeof Unstyled.Tabs>,\n  'value' | 'onValueChange'\n> {\n  /**\n   * Use simple mode instead of advanced usage as documented in https://radix-ui.com/primitives/docs/components/tabs.\n   */\n  items?: string[];\n\n  /**\n   * Shortcut for `defaultValue` when `items` is provided.\n   *\n   * @defaultValue 0\n   */\n  defaultIndex?: number;\n\n  /**\n   * Additional label in tabs list when `items` is provided.\n   */\n  label?: ReactNode;\n}\n\nconst TabsContext = createContext<{\n  items?: string[];\n  collection: CollectionKey[];\n} | null>(null);\n\nfunction useTabContext() {\n  const ctx = useContext(TabsContext);\n  if (!ctx) throw new Error('You must wrap your component in <Tabs>');\n  return ctx;\n}\n\nexport const TabsList = React.forwardRef<\n  React.ComponentRef<typeof Unstyled.TabsList>,\n  React.ComponentPropsWithoutRef<typeof Unstyled.TabsList>\n>(({ className, ...props }, ref) => (\n  <Unstyled.TabsList\n    ref={ref}\n    {...props}\n    className={(s) =>\n      cn(\n        'flex gap-3.5 text-fd-secondary-foreground overflow-x-auto px-4 not-prose',\n        typeof className === 'function' ? className(s) : className,\n      )\n    }\n  />\n));\nTabsList.displayName = 'TabsList';\n\nexport const TabsTrigger = React.forwardRef<\n  React.ComponentRef<typeof Unstyled.TabsTrigger>,\n  React.ComponentPropsWithoutRef<typeof Unstyled.TabsTrigger>\n>(({ className, ...props }, ref) => (\n  <Unstyled.TabsTrigger\n    ref={ref}\n    {...props}\n    className={(s) =>\n      cn(\n        'inline-flex items-center gap-2 whitespace-nowrap text-fd-muted-foreground border-b border-transparent py-2 text-sm font-medium transition-colors [&_svg]:size-4 hover:text-fd-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[active]:border-fd-primary data-[active]:text-fd-primary',\n        typeof className === 'function' ? className(s) : className,\n      )\n    }\n  />\n));\nTabsTrigger.displayName = 'TabsTrigger';\n\nexport function Tabs({\n  ref,\n  className,\n  items,\n  label,\n  defaultIndex = 0,\n  defaultValue = items ? escapeValue(items[defaultIndex]) : undefined,\n  ...props\n}: TabsProps) {\n  const [value, setValue] = useState(defaultValue);\n  const collection = useMemo<CollectionKey[]>(() => [], []);\n\n  return (\n    <Unstyled.Tabs\n      ref={ref}\n      className={(s) =>\n        cn(\n          'flex flex-col overflow-hidden rounded-xl border bg-fd-secondary my-4',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n      value={value}\n      onValueChange={(v: string) => {\n        if (items && !items.some((item) => escapeValue(item) === v)) return;\n        setValue(v);\n      }}\n      {...props}\n    >\n      {items && (\n        <TabsList>\n          {label && <span className=\"text-sm font-medium my-auto me-auto\">{label}</span>}\n          {items.map((item) => (\n            <TabsTrigger key={item} value={escapeValue(item)}>\n              {item}\n            </TabsTrigger>\n          ))}\n        </TabsList>\n      )}\n      <TabsContext.Provider value={useMemo(() => ({ items, collection }), [collection, items])}>\n        {props.children}\n      </TabsContext.Provider>\n    </Unstyled.Tabs>\n  );\n}\n\nexport interface TabProps extends Omit<ComponentProps<typeof Unstyled.TabsContent>, 'value'> {\n  /**\n   * Value of tab, detect from index if unspecified.\n   */\n  value?: string;\n}\n\nexport function Tab({ value, ...props }: TabProps) {\n  const { items } = useTabContext();\n  const resolved =\n    value ??\n    // eslint-disable-next-line react-hooks/rules-of-hooks -- `value` is not supposed to change\n    items?.at(useCollectionIndex());\n  if (!resolved)\n    throw new Error(\n      'Failed to resolve tab `value`, please pass a `value` prop to the Tab component.',\n    );\n\n  return (\n    <TabsContent value={escapeValue(resolved)} {...props}>\n      {props.children}\n    </TabsContent>\n  );\n}\n\nexport function TabsContent({\n  value,\n  className,\n  ...props\n}: ComponentProps<typeof Unstyled.TabsContent>) {\n  return (\n    <Unstyled.TabsContent\n      value={value}\n      keepMounted\n      className={(s) =>\n        cn(\n          'p-4 text-[0.9375rem] bg-fd-background rounded-xl outline-none prose-no-margin data-[inactive]:hidden [&>figure:only-child]:-m-4 [&>figure:only-child]:border-none',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n      {...props}\n    >\n      {props.children}\n    </Unstyled.TabsContent>\n  );\n}\n\n/**\n * Inspired by Headless UI.\n *\n * Return the index of children, this is made possible by registering the order of render from children using React context.\n * This is supposed by work with pre-rendering & pure client-side rendering.\n */\nfunction useCollectionIndex() {\n  const key = useId();\n  const { collection } = useTabContext();\n\n  useEffect(() => {\n    return () => {\n      const idx = collection.indexOf(key);\n      if (idx !== -1) collection.splice(idx, 1);\n    };\n  }, [key, collection]);\n\n  if (!collection.includes(key)) collection.push(key);\n  return collection.indexOf(key);\n}\n\n/**\n * only escape whitespaces in values in simple mode\n */\nfunction escapeValue(v: string): string {\n  return v.toLowerCase().replace(/\\s/, '-');\n}\n"],"mappings":";;;;;;;;;AAwCA,MAAM,cAAc,cAGV,KAAK;AAEf,SAAS,gBAAgB;CACvB,MAAM,MAAM,WAAW,YAAY;AACnC,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,yCAAyC;AACnE,QAAO;;AAGT,MAAa,WAAW,MAAM,YAG3B,EAAE,WAAW,GAAG,SAAS,QAC1B,oBAACA;CACM;CACL,GAAI;CACJ,YAAY,MACV,GACE,4EACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;EAEH,CACF;AACF,SAAS,cAAc;AAEvB,MAAa,cAAc,MAAM,YAG9B,EAAE,WAAW,GAAG,SAAS,QAC1B,oBAACC;CACM;CACL,GAAI;CACJ,YAAY,MACV,GACE,kTACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;EAEH,CACF;AACF,YAAY,cAAc;AAE1B,SAAgB,KAAK,EACnB,KACA,WACA,OACA,OACA,eAAe,GACf,eAAe,QAAQ,YAAY,MAAM,cAAc,GAAG,QAC1D,GAAG,SACS;CACZ,MAAM,CAAC,OAAO,YAAY,SAAS,aAAa;CAChD,MAAM,aAAa,cAA+B,EAAE,EAAE,EAAE,CAAC;AAEzD,QACE,qBAACC;EACM;EACL,YAAY,MACV,GACE,wEACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;EAEI;EACP,gBAAgB,MAAc;AAC5B,OAAI,SAAS,CAAC,MAAM,MAAM,SAAS,YAAY,KAAK,KAAK,EAAE,CAAE;AAC7D,YAAS,EAAE;;EAEb,GAAI;aAEH,SACC,qBAAC,uBACE,SAAS,oBAAC;GAAK,WAAU;aAAuC;IAAa,EAC7E,MAAM,KAAK,SACV,oBAAC;GAAuB,OAAO,YAAY,KAAK;aAC7C;KADe,KAEJ,CACd,IACO,EAEb,oBAAC,YAAY;GAAS,OAAO,eAAe;IAAE;IAAO;IAAY,GAAG,CAAC,YAAY,MAAM,CAAC;aACrF,MAAM;IACc;GACT;;AAWpB,SAAgB,IAAI,EAAE,OAAO,GAAG,SAAmB;CACjD,MAAM,EAAE,UAAU,eAAe;CACjC,MAAM,WACJ,SAEA,OAAO,GAAG,oBAAoB,CAAC;AACjC,KAAI,CAAC,SACH,OAAM,IAAI,MACR,kFACD;AAEH,QACE,oBAAC;EAAY,OAAO,YAAY,SAAS;EAAE,GAAI;YAC5C,MAAM;GACK;;AAIlB,SAAgB,YAAY,EAC1B,OACA,WACA,GAAG,SAC2C;AAC9C,QACE,oBAACC;EACQ;EACP;EACA,YAAY,MACV,GACE,qKACA,OAAO,cAAc,aAAa,UAAU,EAAE,GAAG,UAClD;EAEH,GAAI;YAEH,MAAM;GACc;;;;;;;;AAU3B,SAAS,qBAAqB;CAC5B,MAAM,MAAM,OAAO;CACnB,MAAM,EAAE,eAAe,eAAe;AAEtC,iBAAgB;AACd,eAAa;GACX,MAAM,MAAM,WAAW,QAAQ,IAAI;AACnC,OAAI,QAAQ,GAAI,YAAW,OAAO,KAAK,EAAE;;IAE1C,CAAC,KAAK,WAAW,CAAC;AAErB,KAAI,CAAC,WAAW,SAAS,IAAI,CAAE,YAAW,KAAK,IAAI;AACnD,QAAO,WAAW,QAAQ,IAAI;;;;;AAMhC,SAAS,YAAY,GAAmB;AACtC,QAAO,EAAE,aAAa,CAAC,QAAQ,MAAM,IAAI"}

package/dist/components/toc/clerk.d.ts

@@ -1 +1,12 @@
-export * from "@fumadocs/ui/components/toc/clerk";
+import { ComponentProps } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/toc/clerk.d.ts
+declare function TOCItems({
+  ref,
+  className,
+  ...props
+}: ComponentProps<'div'>): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TOCItems };
+//# sourceMappingURL=clerk.d.ts.map

package/dist/components/toc/clerk.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"clerk.d.ts","names":[],"sources":["../../../src/components/toc/clerk.tsx"],"mappings":";;;;iBAQgB,QAAA,CAAA;EAAW,GAAA;EAAK,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/toc/clerk.js

@@ -1,12 +1,112 @@
-import { __reExport } from "../../_virtual/rolldown_runtime.js";
+'use client';
 
-export * from "@fumadocs/ui/components/toc/clerk"
+import { useI18n } from "../../contexts/i18n.js";
+import { cn } from "../../utils/cn.js";
+import { mergeRefs } from "../../utils/merge-refs.js";
+import { TocThumb, useTOCItems } from "./index.js";
+import { useEffect, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import * as Primitive from "fumadocs-core/toc";
 
 //#region src/components/toc/clerk.tsx
-var clerk_exports = {};
-import * as import__fumadocs_ui_components_toc_clerk from "@fumadocs/ui/components/toc/clerk";
-__reExport(clerk_exports, import__fumadocs_ui_components_toc_clerk);
+function TOCItems({ ref, className, ...props }) {
+	const containerRef = useRef(null);
+	const items = useTOCItems();
+	const { text } = useI18n();
+	const [svg, setSvg] = useState();
+	useEffect(() => {
+		if (!containerRef.current) return;
+		const container = containerRef.current;
+		function onResize() {
+			if (container.clientHeight === 0) return;
+			let w = 0, h = 0;
+			const d = [];
+			for (let i = 0; i < items.length; i++) {
+				const element = container.querySelector(`a[href="#${items[i].url.slice(1)}"]`);
+				if (!element) continue;
+				const styles = getComputedStyle(element);
+				const offset = getLineOffset(items[i].depth) + 1, top = element.offsetTop + parseFloat(styles.paddingTop), bottom = element.offsetTop + element.clientHeight - parseFloat(styles.paddingBottom);
+				w = Math.max(offset, w);
+				h = Math.max(h, bottom);
+				d.push(`${i === 0 ? "M" : "L"}${offset} ${top}`);
+				d.push(`L${offset} ${bottom}`);
+			}
+			setSvg({
+				path: d.join(" "),
+				width: w + 1,
+				height: h
+			});
+		}
+		const observer = new ResizeObserver(onResize);
+		onResize();
+		observer.observe(container);
+		return () => {
+			observer.disconnect();
+		};
+	}, [items]);
+	if (items.length === 0) return /* @__PURE__ */ jsx("div", {
+		className: "rounded-lg border bg-fd-card p-3 text-xs text-fd-muted-foreground",
+		children: text.tocNoHeadings
+	});
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [svg && /* @__PURE__ */ jsx("div", {
+		className: "absolute start-0 top-0 rtl:-scale-x-100",
+		style: {
+			width: svg.width,
+			height: svg.height,
+			maskImage: `url("data:image/svg+xml,${encodeURIComponent(`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${svg.width} ${svg.height}"><path d="${svg.path}" stroke="black" stroke-width="1" fill="none" /></svg>`)}")`
+		},
+		children: /* @__PURE__ */ jsx(TocThumb, {
+			containerRef,
+			className: "absolute w-full top-(--fd-top) h-(--fd-height) bg-fd-primary transition-[top,height]"
+		})
+	}), /* @__PURE__ */ jsx("div", {
+		ref: mergeRefs(containerRef, ref),
+		className: cn("flex flex-col", className),
+		...props,
+		children: items.map((item, i) => /* @__PURE__ */ jsx(TOCItem, {
+			item,
+			upper: items[i - 1]?.depth,
+			lower: items[i + 1]?.depth
+		}, item.url))
+	})] });
+}
+function getItemOffset(depth) {
+	if (depth <= 2) return 14;
+	if (depth === 3) return 26;
+	return 36;
+}
+function getLineOffset(depth) {
+	return depth >= 3 ? 10 : 0;
+}
+function TOCItem({ item, upper = item.depth, lower = item.depth }) {
+	const offset = getLineOffset(item.depth), upperOffset = getLineOffset(upper), lowerOffset = getLineOffset(lower);
+	return /* @__PURE__ */ jsxs(Primitive.TOCItem, {
+		href: item.url,
+		style: { paddingInlineStart: getItemOffset(item.depth) },
+		className: "prose relative py-1.5 text-sm text-fd-muted-foreground hover:text-fd-accent-foreground transition-colors wrap-anywhere first:pt-0 last:pb-0 data-[active=true]:text-fd-primary",
+		children: [
+			offset !== upperOffset && /* @__PURE__ */ jsx("svg", {
+				xmlns: "http://www.w3.org/2000/svg",
+				viewBox: "0 0 16 16",
+				className: "absolute -top-1.5 start-0 size-4 rtl:-scale-x-100",
+				children: /* @__PURE__ */ jsx("line", {
+					x1: upperOffset,
+					y1: "0",
+					x2: offset,
+					y2: "12",
+					className: "stroke-fd-foreground/10",
+					strokeWidth: "1"
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: cn("absolute inset-y-0 w-px bg-fd-foreground/10", offset !== upperOffset && "top-1.5", offset !== lowerOffset && "bottom-1.5"),
+				style: { insetInlineStart: offset }
+			}),
+			item.title
+		]
+	});
+}
 
 //#endregion
-export { clerk_exports };
+export { TOCItems };
 //# sourceMappingURL=clerk.js.map

package/dist/components/toc/clerk.js.map

@@ -1 +1 @@
-{"version":3,"file":"clerk.js","names":[],"sources":["../../../src/components/toc/clerk.tsx"],"sourcesContent":["export * from '@fumadocs/ui/components/toc/clerk';\n"],"mappings":""}
+{"version":3,"file":"clerk.js","names":[],"sources":["../../../src/components/toc/clerk.tsx"],"sourcesContent":["'use client';\nimport * as Primitive from 'fumadocs-core/toc';\nimport { type ComponentProps, useEffect, useRef, useState } from 'react';\nimport { cn } from '@/utils/cn';\nimport { TocThumb, useTOCItems } from '.';\nimport { mergeRefs } from '@/utils/merge-refs';\nimport { useI18n } from '@/contexts/i18n';\n\nexport function TOCItems({ ref, className, ...props }: ComponentProps<'div'>) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const items = useTOCItems();\n  const { text } = useI18n();\n\n  const [svg, setSvg] = useState<{\n    path: string;\n    width: number;\n    height: number;\n  }>();\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n    const container = containerRef.current;\n\n    function onResize(): void {\n      if (container.clientHeight === 0) return;\n      let w = 0,\n        h = 0;\n      const d: string[] = [];\n      for (let i = 0; i < items.length; i++) {\n        const element: HTMLElement | null = container.querySelector(\n          `a[href=\"#${items[i].url.slice(1)}\"]`,\n        );\n        if (!element) continue;\n\n        const styles = getComputedStyle(element);\n        const offset = getLineOffset(items[i].depth) + 1,\n          top = element.offsetTop + parseFloat(styles.paddingTop),\n          bottom = element.offsetTop + element.clientHeight - parseFloat(styles.paddingBottom);\n\n        w = Math.max(offset, w);\n        h = Math.max(h, bottom);\n\n        d.push(`${i === 0 ? 'M' : 'L'}${offset} ${top}`);\n        d.push(`L${offset} ${bottom}`);\n      }\n\n      setSvg({\n        path: d.join(' '),\n        width: w + 1,\n        height: h,\n      });\n    }\n\n    const observer = new ResizeObserver(onResize);\n    onResize();\n\n    observer.observe(container);\n    return () => {\n      observer.disconnect();\n    };\n  }, [items]);\n\n  if (items.length === 0)\n    return (\n      <div className=\"rounded-lg border bg-fd-card p-3 text-xs text-fd-muted-foreground\">\n        {text.tocNoHeadings}\n      </div>\n    );\n\n  return (\n    <>\n      {svg && (\n        <div\n          className=\"absolute start-0 top-0 rtl:-scale-x-100\"\n          style={{\n            width: svg.width,\n            height: svg.height,\n            maskImage: `url(\"data:image/svg+xml,${\n              // Inline SVG\n              encodeURIComponent(\n                `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 ${svg.width} ${svg.height}\"><path d=\"${svg.path}\" stroke=\"black\" stroke-width=\"1\" fill=\"none\" /></svg>`,\n              )\n            }\")`,\n          }}\n        >\n          <TocThumb\n            containerRef={containerRef}\n            className=\"absolute w-full top-(--fd-top) h-(--fd-height) bg-fd-primary transition-[top,height]\"\n          />\n        </div>\n      )}\n      <div ref={mergeRefs(containerRef, ref)} className={cn('flex flex-col', className)} {...props}>\n        {items.map((item, i) => (\n          <TOCItem\n            key={item.url}\n            item={item}\n            upper={items[i - 1]?.depth}\n            lower={items[i + 1]?.depth}\n          />\n        ))}\n      </div>\n    </>\n  );\n}\n\nfunction getItemOffset(depth: number): number {\n  if (depth <= 2) return 14;\n  if (depth === 3) return 26;\n  return 36;\n}\n\nfunction getLineOffset(depth: number): number {\n  return depth >= 3 ? 10 : 0;\n}\n\nfunction TOCItem({\n  item,\n  upper = item.depth,\n  lower = item.depth,\n}: {\n  item: Primitive.TOCItemType;\n  upper?: number;\n  lower?: number;\n}) {\n  const offset = getLineOffset(item.depth),\n    upperOffset = getLineOffset(upper),\n    lowerOffset = getLineOffset(lower);\n\n  return (\n    <Primitive.TOCItem\n      href={item.url}\n      style={{\n        paddingInlineStart: getItemOffset(item.depth),\n      }}\n      className=\"prose relative py-1.5 text-sm text-fd-muted-foreground hover:text-fd-accent-foreground transition-colors wrap-anywhere first:pt-0 last:pb-0 data-[active=true]:text-fd-primary\"\n    >\n      {offset !== upperOffset && (\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          viewBox=\"0 0 16 16\"\n          className=\"absolute -top-1.5 start-0 size-4 rtl:-scale-x-100\"\n        >\n          <line\n            x1={upperOffset}\n            y1=\"0\"\n            x2={offset}\n            y2=\"12\"\n            className=\"stroke-fd-foreground/10\"\n            strokeWidth=\"1\"\n          />\n        </svg>\n      )}\n      <div\n        className={cn(\n          'absolute inset-y-0 w-px bg-fd-foreground/10',\n          offset !== upperOffset && 'top-1.5',\n          offset !== lowerOffset && 'bottom-1.5',\n        )}\n        style={{\n          insetInlineStart: offset,\n        }}\n      />\n      {item.title}\n    </Primitive.TOCItem>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAQA,SAAgB,SAAS,EAAE,KAAK,WAAW,GAAG,SAAgC;CAC5E,MAAM,eAAe,OAAuB,KAAK;CACjD,MAAM,QAAQ,aAAa;CAC3B,MAAM,EAAE,SAAS,SAAS;CAE1B,MAAM,CAAC,KAAK,UAAU,UAIlB;AAEJ,iBAAgB;AACd,MAAI,CAAC,aAAa,QAAS;EAC3B,MAAM,YAAY,aAAa;EAE/B,SAAS,WAAiB;AACxB,OAAI,UAAU,iBAAiB,EAAG;GAClC,IAAI,IAAI,GACN,IAAI;GACN,MAAM,IAAc,EAAE;AACtB,QAAK,IAAI,IAAI,GAAG,IAAI,MAAM,QAAQ,KAAK;IACrC,MAAM,UAA8B,UAAU,cAC5C,YAAY,MAAM,GAAG,IAAI,MAAM,EAAE,CAAC,IACnC;AACD,QAAI,CAAC,QAAS;IAEd,MAAM,SAAS,iBAAiB,QAAQ;IACxC,MAAM,SAAS,cAAc,MAAM,GAAG,MAAM,GAAG,GAC7C,MAAM,QAAQ,YAAY,WAAW,OAAO,WAAW,EACvD,SAAS,QAAQ,YAAY,QAAQ,eAAe,WAAW,OAAO,cAAc;AAEtF,QAAI,KAAK,IAAI,QAAQ,EAAE;AACvB,QAAI,KAAK,IAAI,GAAG,OAAO;AAEvB,MAAE,KAAK,GAAG,MAAM,IAAI,MAAM,MAAM,OAAO,GAAG,MAAM;AAChD,MAAE,KAAK,IAAI,OAAO,GAAG,SAAS;;AAGhC,UAAO;IACL,MAAM,EAAE,KAAK,IAAI;IACjB,OAAO,IAAI;IACX,QAAQ;IACT,CAAC;;EAGJ,MAAM,WAAW,IAAI,eAAe,SAAS;AAC7C,YAAU;AAEV,WAAS,QAAQ,UAAU;AAC3B,eAAa;AACX,YAAS,YAAY;;IAEtB,CAAC,MAAM,CAAC;AAEX,KAAI,MAAM,WAAW,EACnB,QACE,oBAAC;EAAI,WAAU;YACZ,KAAK;GACF;AAGV,QACE,8CACG,OACC,oBAAC;EACC,WAAU;EACV,OAAO;GACL,OAAO,IAAI;GACX,QAAQ,IAAI;GACZ,WAAW,2BAET,mBACE,wDAAwD,IAAI,MAAM,GAAG,IAAI,OAAO,aAAa,IAAI,KAAK,wDACvG,CACF;GACF;YAED,oBAAC;GACe;GACd,WAAU;IACV;GACE,EAER,oBAAC;EAAI,KAAK,UAAU,cAAc,IAAI;EAAE,WAAW,GAAG,iBAAiB,UAAU;EAAE,GAAI;YACpF,MAAM,KAAK,MAAM,MAChB,oBAAC;GAEO;GACN,OAAO,MAAM,IAAI,IAAI;GACrB,OAAO,MAAM,IAAI,IAAI;KAHhB,KAAK,IAIV,CACF;GACE,IACL;;AAIP,SAAS,cAAc,OAAuB;AAC5C,KAAI,SAAS,EAAG,QAAO;AACvB,KAAI,UAAU,EAAG,QAAO;AACxB,QAAO;;AAGT,SAAS,cAAc,OAAuB;AAC5C,QAAO,SAAS,IAAI,KAAK;;AAG3B,SAAS,QAAQ,EACf,MACA,QAAQ,KAAK,OACb,QAAQ,KAAK,SAKZ;CACD,MAAM,SAAS,cAAc,KAAK,MAAM,EACtC,cAAc,cAAc,MAAM,EAClC,cAAc,cAAc,MAAM;AAEpC,QACE,qBAAC,UAAU;EACT,MAAM,KAAK;EACX,OAAO,EACL,oBAAoB,cAAc,KAAK,MAAM,EAC9C;EACD,WAAU;;GAET,WAAW,eACV,oBAAC;IACC,OAAM;IACN,SAAQ;IACR,WAAU;cAEV,oBAAC;KACC,IAAI;KACJ,IAAG;KACH,IAAI;KACJ,IAAG;KACH,WAAU;KACV,aAAY;MACZ;KACE;GAER,oBAAC;IACC,WAAW,GACT,+CACA,WAAW,eAAe,WAC1B,WAAW,eAAe,aAC3B;IACD,OAAO,EACL,kBAAkB,QACnB;KACD;GACD,KAAK;;GACY"}

package/dist/components/toc/default.d.ts

@@ -1 +1,12 @@
-export * from "@fumadocs/ui/components/toc/default";
+import { ComponentProps } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/toc/default.d.ts
+declare function TOCItems({
+  ref,
+  className,
+  ...props
+}: ComponentProps<'div'>): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TOCItems };
+//# sourceMappingURL=default.d.ts.map

package/dist/components/toc/default.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"default.d.ts","names":[],"sources":["../../../src/components/toc/default.tsx"],"mappings":";;;;iBAQgB,QAAA,CAAA;EAAW,GAAA;EAAK,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/toc/default.js

@@ -1,12 +1,40 @@
-import { __reExport } from "../../_virtual/rolldown_runtime.js";
+'use client';
 
-export * from "@fumadocs/ui/components/toc/default"
+import { useI18n } from "../../contexts/i18n.js";
+import { cn } from "../../utils/cn.js";
+import { mergeRefs } from "../../utils/merge-refs.js";
+import { TocThumb, useTOCItems } from "./index.js";
+import { useRef } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import * as Primitive from "fumadocs-core/toc";
 
 //#region src/components/toc/default.tsx
-var default_exports = {};
-import * as import__fumadocs_ui_components_toc_default from "@fumadocs/ui/components/toc/default";
-__reExport(default_exports, import__fumadocs_ui_components_toc_default);
+function TOCItems({ ref, className, ...props }) {
+	const containerRef = useRef(null);
+	const items = useTOCItems();
+	const { text } = useI18n();
+	if (items.length === 0) return /* @__PURE__ */ jsx("div", {
+		className: "rounded-lg border bg-fd-card p-3 text-xs text-fd-muted-foreground",
+		children: text.tocNoHeadings
+	});
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(TocThumb, {
+		containerRef,
+		className: "absolute top-(--fd-top) h-(--fd-height) w-0.5 rounded-e-sm bg-fd-primary transition-[top,height] ease-linear"
+	}), /* @__PURE__ */ jsx("div", {
+		ref: mergeRefs(ref, containerRef),
+		className: cn("flex flex-col border-s border-fd-foreground/10", className),
+		...props,
+		children: items.map((item) => /* @__PURE__ */ jsx(TOCItem, { item }, item.url))
+	})] });
+}
+function TOCItem({ item }) {
+	return /* @__PURE__ */ jsx(Primitive.TOCItem, {
+		href: item.url,
+		className: cn("prose py-1.5 text-sm text-fd-muted-foreground transition-colors wrap-anywhere first:pt-0 last:pb-0 data-[active=true]:text-fd-primary", item.depth <= 2 && "ps-3", item.depth === 3 && "ps-6", item.depth >= 4 && "ps-8"),
+		children: item.title
+	});
+}
 
 //#endregion
-export { default_exports };
+export { TOCItems };
 //# sourceMappingURL=default.js.map

package/dist/components/toc/default.js.map

@@ -1 +1 @@
-{"version":3,"file":"default.js","names":[],"sources":["../../../src/components/toc/default.tsx"],"sourcesContent":["export * from '@fumadocs/ui/components/toc/default';\n"],"mappings":""}
+{"version":3,"file":"default.js","names":[],"sources":["../../../src/components/toc/default.tsx"],"sourcesContent":["'use client';\nimport { useI18n } from '@/contexts/i18n';\nimport { cn } from '@/utils/cn';\nimport { type ComponentProps, useRef } from 'react';\nimport { mergeRefs } from '@/utils/merge-refs';\nimport { TocThumb, useTOCItems } from '.';\nimport * as Primitive from 'fumadocs-core/toc';\n\nexport function TOCItems({ ref, className, ...props }: ComponentProps<'div'>) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const items = useTOCItems();\n  const { text } = useI18n();\n\n  if (items.length === 0)\n    return (\n      <div className=\"rounded-lg border bg-fd-card p-3 text-xs text-fd-muted-foreground\">\n        {text.tocNoHeadings}\n      </div>\n    );\n\n  return (\n    <>\n      <TocThumb\n        containerRef={containerRef}\n        className=\"absolute top-(--fd-top) h-(--fd-height) w-0.5 rounded-e-sm bg-fd-primary transition-[top,height] ease-linear\"\n      />\n      <div\n        ref={mergeRefs(ref, containerRef)}\n        className={cn('flex flex-col border-s border-fd-foreground/10', className)}\n        {...props}\n      >\n        {items.map((item) => (\n          <TOCItem key={item.url} item={item} />\n        ))}\n      </div>\n    </>\n  );\n}\n\nfunction TOCItem({ item }: { item: Primitive.TOCItemType }) {\n  return (\n    <Primitive.TOCItem\n      href={item.url}\n      className={cn(\n        'prose py-1.5 text-sm text-fd-muted-foreground transition-colors wrap-anywhere first:pt-0 last:pb-0 data-[active=true]:text-fd-primary',\n        item.depth <= 2 && 'ps-3',\n        item.depth === 3 && 'ps-6',\n        item.depth >= 4 && 'ps-8',\n      )}\n    >\n      {item.title}\n    </Primitive.TOCItem>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAQA,SAAgB,SAAS,EAAE,KAAK,WAAW,GAAG,SAAgC;CAC5E,MAAM,eAAe,OAAuB,KAAK;CACjD,MAAM,QAAQ,aAAa;CAC3B,MAAM,EAAE,SAAS,SAAS;AAE1B,KAAI,MAAM,WAAW,EACnB,QACE,oBAAC;EAAI,WAAU;YACZ,KAAK;GACF;AAGV,QACE,8CACE,oBAAC;EACe;EACd,WAAU;GACV,EACF,oBAAC;EACC,KAAK,UAAU,KAAK,aAAa;EACjC,WAAW,GAAG,kDAAkD,UAAU;EAC1E,GAAI;YAEH,MAAM,KAAK,SACV,oBAAC,WAA6B,QAAhB,KAAK,IAAmB,CACtC;GACE,IACL;;AAIP,SAAS,QAAQ,EAAE,QAAyC;AAC1D,QACE,oBAAC,UAAU;EACT,MAAM,KAAK;EACX,WAAW,GACT,yIACA,KAAK,SAAS,KAAK,QACnB,KAAK,UAAU,KAAK,QACpB,KAAK,SAAS,KAAK,OACpB;YAEA,KAAK;GACY"}

package/dist/components/toc/index.d.ts

@@ -1 +1,26 @@
-export * from "@fumadocs/ui/components/toc/index";
+import { ComponentProps, RefObject } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as Primitive from "fumadocs-core/toc";
+
+//#region src/components/toc/index.d.ts
+declare function useTOCItems(): Primitive.TOCItemType[];
+declare function TOCProvider({
+  toc,
+  children,
+  ...props
+}: ComponentProps<typeof Primitive.AnchorProvider>): react_jsx_runtime0.JSX.Element;
+declare function TOCScrollArea({
+  ref,
+  className,
+  ...props
+}: ComponentProps<'div'>): react_jsx_runtime0.JSX.Element;
+interface RefProps {
+  containerRef: RefObject<HTMLElement | null>;
+}
+declare function TocThumb({
+  containerRef,
+  ...props
+}: ComponentProps<'div'> & RefProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TOCProvider, TOCScrollArea, TocThumb, useTOCItems };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/toc/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/toc/index.tsx"],"mappings":";;;;;iBAiBgB,WAAA,CAAA,GAAe,SAAA,CAAU,WAAA;AAAA,iBAIzB,WAAA,CAAA;EACd,GAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,cAAA,QAAsB,SAAA,CAAU,cAAA,IAAe,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAUlC,aAAA,CAAA;EAAgB,GAAA;EAAK,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,UAmBvE,QAAA;EACR,YAAA,EAAc,SAAA,CAAU,WAAA;AAAA;AAAA,iBAGV,QAAA,CAAA;EAAW,YAAA;EAAA,GAAiB;AAAA,GAAS,cAAA,UAAwB,QAAA,GAAQ,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/toc/index.js

@@ -1,12 +1,82 @@
-import { __reExport } from "../../_virtual/rolldown_runtime.js";
+'use client';
 
-export * from "@fumadocs/ui/components/toc/index"
+import { cn } from "../../utils/cn.js";
+import { mergeRefs } from "../../utils/merge-refs.js";
+import { createContext, use, useEffect, useEffectEvent, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+import * as Primitive from "fumadocs-core/toc";
+import { useOnChange } from "fumadocs-core/utils/use-on-change";
 
 //#region src/components/toc/index.tsx
-var toc_exports = {};
-import * as import__fumadocs_ui_components_toc_index from "@fumadocs/ui/components/toc/index";
-__reExport(toc_exports, import__fumadocs_ui_components_toc_index);
+const TOCContext = createContext([]);
+function useTOCItems() {
+	return use(TOCContext);
+}
+function TOCProvider({ toc, children, ...props }) {
+	return /* @__PURE__ */ jsx(TOCContext, {
+		value: toc,
+		children: /* @__PURE__ */ jsx(Primitive.AnchorProvider, {
+			toc,
+			...props,
+			children
+		})
+	});
+}
+function TOCScrollArea({ ref, className, ...props }) {
+	const viewRef = useRef(null);
+	return /* @__PURE__ */ jsx("div", {
+		ref: mergeRefs(viewRef, ref),
+		className: cn("relative min-h-0 text-sm ms-px overflow-auto [scrollbar-width:none] mask-[linear-gradient(to_bottom,transparent,white_16px,white_calc(100%-16px),transparent)] py-3", className),
+		...props,
+		children: /* @__PURE__ */ jsx(Primitive.ScrollProvider, {
+			containerRef: viewRef,
+			children: props.children
+		})
+	});
+}
+function TocThumb({ containerRef, ...props }) {
+	const thumbRef = useRef(null);
+	const active = Primitive.useActiveAnchors();
+	function update(info) {
+		const element = thumbRef.current;
+		if (!element) return;
+		element.style.setProperty("--fd-top", `${info[0]}px`);
+		element.style.setProperty("--fd-height", `${info[1]}px`);
+	}
+	const onPrint = useEffectEvent(() => {
+		if (containerRef.current) update(calc(containerRef.current, active));
+	});
+	useEffect(() => {
+		if (!containerRef.current) return;
+		const container = containerRef.current;
+		const observer = new ResizeObserver(onPrint);
+		observer.observe(container);
+		return () => {
+			observer.disconnect();
+		};
+	}, [containerRef]);
+	useOnChange(active, () => {
+		if (containerRef.current) update(calc(containerRef.current, active));
+	});
+	return /* @__PURE__ */ jsx("div", {
+		ref: thumbRef,
+		"data-hidden": active.length === 0,
+		...props
+	});
+}
+function calc(container, active) {
+	if (active.length === 0 || container.clientHeight === 0) return [0, 0];
+	let upper = Number.MAX_VALUE, lower = 0;
+	for (const item of active) {
+		const element = container.querySelector(`a[href="#${item}"]`);
+		if (!element) continue;
+		const styles = getComputedStyle(element);
+		upper = Math.min(upper, element.offsetTop + parseFloat(styles.paddingTop));
+		lower = Math.max(lower, element.offsetTop + element.clientHeight - parseFloat(styles.paddingBottom));
+	}
+	return [upper, lower - upper];
+}
 
 //#endregion
-export { toc_exports };
+export { TOCProvider, TOCScrollArea, TocThumb, useTOCItems };
 //# sourceMappingURL=index.js.map

package/dist/components/toc/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/toc/index.tsx"],"sourcesContent":["export * from '@fumadocs/ui/components/toc/index';\n"],"mappings":""}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/toc/index.tsx"],"sourcesContent":["'use client';\nimport * as Primitive from 'fumadocs-core/toc';\nimport {\n  type ComponentProps,\n  createContext,\n  type RefObject,\n  use,\n  useEffect,\n  useEffectEvent,\n  useRef,\n} from 'react';\nimport { cn } from '@/utils/cn';\nimport { mergeRefs } from '@/utils/merge-refs';\nimport { useOnChange } from 'fumadocs-core/utils/use-on-change';\n\nconst TOCContext = createContext<Primitive.TOCItemType[]>([]);\n\nexport function useTOCItems(): Primitive.TOCItemType[] {\n  return use(TOCContext);\n}\n\nexport function TOCProvider({\n  toc,\n  children,\n  ...props\n}: ComponentProps<typeof Primitive.AnchorProvider>) {\n  return (\n    <TOCContext value={toc}>\n      <Primitive.AnchorProvider toc={toc} {...props}>\n        {children}\n      </Primitive.AnchorProvider>\n    </TOCContext>\n  );\n}\n\nexport function TOCScrollArea({ ref, className, ...props }: ComponentProps<'div'>) {\n  const viewRef = useRef<HTMLDivElement>(null);\n\n  return (\n    <div\n      ref={mergeRefs(viewRef, ref)}\n      className={cn(\n        'relative min-h-0 text-sm ms-px overflow-auto [scrollbar-width:none] mask-[linear-gradient(to_bottom,transparent,white_16px,white_calc(100%-16px),transparent)] py-3',\n        className,\n      )}\n      {...props}\n    >\n      <Primitive.ScrollProvider containerRef={viewRef}>{props.children}</Primitive.ScrollProvider>\n    </div>\n  );\n}\n\ntype TocThumbType = [top: number, height: number];\n\ninterface RefProps {\n  containerRef: RefObject<HTMLElement | null>;\n}\n\nexport function TocThumb({ containerRef, ...props }: ComponentProps<'div'> & RefProps) {\n  const thumbRef = useRef<HTMLDivElement>(null);\n  const active = Primitive.useActiveAnchors();\n  function update(info: TocThumbType): void {\n    const element = thumbRef.current;\n    if (!element) return;\n    element.style.setProperty('--fd-top', `${info[0]}px`);\n    element.style.setProperty('--fd-height', `${info[1]}px`);\n  }\n\n  const onPrint = useEffectEvent(() => {\n    if (containerRef.current) {\n      update(calc(containerRef.current, active));\n    }\n  });\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n    const container = containerRef.current;\n\n    const observer = new ResizeObserver(onPrint);\n    observer.observe(container);\n\n    return () => {\n      observer.disconnect();\n    };\n  }, [containerRef]);\n\n  useOnChange(active, () => {\n    if (containerRef.current) {\n      update(calc(containerRef.current, active));\n    }\n  });\n\n  return <div ref={thumbRef} data-hidden={active.length === 0} {...props} />;\n}\n\nfunction calc(container: HTMLElement, active: string[]): TocThumbType {\n  if (active.length === 0 || container.clientHeight === 0) {\n    return [0, 0];\n  }\n\n  let upper = Number.MAX_VALUE,\n    lower = 0;\n\n  for (const item of active) {\n    const element = container.querySelector<HTMLElement>(`a[href=\"#${item}\"]`);\n    if (!element) continue;\n\n    const styles = getComputedStyle(element);\n    upper = Math.min(upper, element.offsetTop + parseFloat(styles.paddingTop));\n    lower = Math.max(\n      lower,\n      element.offsetTop + element.clientHeight - parseFloat(styles.paddingBottom),\n    );\n  }\n\n  return [upper, lower - upper];\n}\n"],"mappings":";;;;;;;;;;AAeA,MAAM,aAAa,cAAuC,EAAE,CAAC;AAE7D,SAAgB,cAAuC;AACrD,QAAO,IAAI,WAAW;;AAGxB,SAAgB,YAAY,EAC1B,KACA,UACA,GAAG,SAC+C;AAClD,QACE,oBAAC;EAAW,OAAO;YACjB,oBAAC,UAAU;GAAoB;GAAK,GAAI;GACrC;IACwB;GAChB;;AAIjB,SAAgB,cAAc,EAAE,KAAK,WAAW,GAAG,SAAgC;CACjF,MAAM,UAAU,OAAuB,KAAK;AAE5C,QACE,oBAAC;EACC,KAAK,UAAU,SAAS,IAAI;EAC5B,WAAW,GACT,uKACA,UACD;EACD,GAAI;YAEJ,oBAAC,UAAU;GAAe,cAAc;aAAU,MAAM;IAAoC;GACxF;;AAUV,SAAgB,SAAS,EAAE,cAAc,GAAG,SAA2C;CACrF,MAAM,WAAW,OAAuB,KAAK;CAC7C,MAAM,SAAS,UAAU,kBAAkB;CAC3C,SAAS,OAAO,MAA0B;EACxC,MAAM,UAAU,SAAS;AACzB,MAAI,CAAC,QAAS;AACd,UAAQ,MAAM,YAAY,YAAY,GAAG,KAAK,GAAG,IAAI;AACrD,UAAQ,MAAM,YAAY,eAAe,GAAG,KAAK,GAAG,IAAI;;CAG1D,MAAM,UAAU,qBAAqB;AACnC,MAAI,aAAa,QACf,QAAO,KAAK,aAAa,SAAS,OAAO,CAAC;GAE5C;AAEF,iBAAgB;AACd,MAAI,CAAC,aAAa,QAAS;EAC3B,MAAM,YAAY,aAAa;EAE/B,MAAM,WAAW,IAAI,eAAe,QAAQ;AAC5C,WAAS,QAAQ,UAAU;AAE3B,eAAa;AACX,YAAS,YAAY;;IAEtB,CAAC,aAAa,CAAC;AAElB,aAAY,cAAc;AACxB,MAAI,aAAa,QACf,QAAO,KAAK,aAAa,SAAS,OAAO,CAAC;GAE5C;AAEF,QAAO,oBAAC;EAAI,KAAK;EAAU,eAAa,OAAO,WAAW;EAAG,GAAI;GAAS;;AAG5E,SAAS,KAAK,WAAwB,QAAgC;AACpE,KAAI,OAAO,WAAW,KAAK,UAAU,iBAAiB,EACpD,QAAO,CAAC,GAAG,EAAE;CAGf,IAAI,QAAQ,OAAO,WACjB,QAAQ;AAEV,MAAK,MAAM,QAAQ,QAAQ;EACzB,MAAM,UAAU,UAAU,cAA2B,YAAY,KAAK,IAAI;AAC1E,MAAI,CAAC,QAAS;EAEd,MAAM,SAAS,iBAAiB,QAAQ;AACxC,UAAQ,KAAK,IAAI,OAAO,QAAQ,YAAY,WAAW,OAAO,WAAW,CAAC;AAC1E,UAAQ,KAAK,IACX,OACA,QAAQ,YAAY,QAAQ,eAAe,WAAW,OAAO,cAAc,CAC5E;;AAGH,QAAO,CAAC,OAAO,QAAQ,MAAM"}

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

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime139 from "react/jsx-runtime";
 import { ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/type-table.d.ts
 interface ParameterNode {
@@ -33,7 +33,7 @@ declare function TypeTable({
   type
 }: {
   type: Record<string, TypeNode>;
-}): react_jsx_runtime139.JSX.Element;
+}): react_jsx_runtime0.JSX.Element;
 //#endregion
 export { ParameterNode, TypeNode, TypeTable };
 //# sourceMappingURL=type-table.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"type-table.d.ts","names":[],"sources":["../../src/components/type-table.tsx"],"sourcesContent":[],"mappings":";;;;UASiB,aAAA;;eAEF;AAFf;AAKiB,UAAA,QAAA,CAAQ;EAIT;;;EAiBJ,WAAA,CAAA,EAjBI,SAiBJ;EAKG;;;EAeC,IAAA,EAhCR,SAgCiB;EAAG;;;EAA0C,eAAA,CAAA,EA3BlD,SA2BkD;EAAA;;;;YApB1D;;;eAKG;YAEH;;iBAaI,SAAA;;;QAA4B,eAAe;IAAW,oBAAA,CAAA,GAAA,CAAA"}
+{"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,iBAaI,SAAA,CAAA;EAAY;AAAA;EAAU,IAAA,EAAM,MAAA,SAAe,QAAA;AAAA,IAAW,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/type-table.js

@@ -1,11 +1,11 @@
 'use client';
 
+import { cn } from "../utils/cn.js";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "./ui/collapsible.js";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import Link from "fumadocs-core/link";
-import { cn } from "@fumadocs/ui/cn";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { ChevronDown } from "lucide-react";
-import { useState } from "react";
 import { cva } from "class-variance-authority";
 
 //#region src/components/type-table.tsx
@@ -62,21 +62,21 @@ function Item({ name, item: { parameters = [], description, required = false, de
 					className: "text-sm prose col-span-full prose-no-margin empty:hidden",
 					children: description
 				}),
-				typeDescription && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("p", {
+				typeDescription && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("p", {
 					className: cn(fieldVariants()),
 					children: "Type"
 				}), /* @__PURE__ */ jsx("p", {
 					className: "my-auto not-prose",
 					children: typeDescription
 				})] }),
-				defaultValue && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("p", {
+				defaultValue && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("p", {
 					className: cn(fieldVariants()),
 					children: "Default"
 				}), /* @__PURE__ */ jsx("p", {
 					className: "my-auto not-prose",
 					children: defaultValue
 				})] }),
-				parameters.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("p", {
+				parameters.length > 0 && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("p", {
 					className: cn(fieldVariants()),
 					children: "Parameters"
 				}), /* @__PURE__ */ jsx("div", {
@@ -92,7 +92,7 @@ function Item({ name, item: { parameters = [], description, required = false, de
 						})]
 					}, param.name))
 				})] }),
-				returns && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("p", {
+				returns && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("p", {
 					className: cn(fieldVariants()),
 					children: "Returns"
 				}), /* @__PURE__ */ jsx("div", {